*{
	margin: 0;
	box-sizing: border-box;
}
:root {
	--bodyback: #eee;
    --mainback: #fff;

    --maincolor: #181818;
    --seccolor: #787878;

    --borcolor:#ccc;

    --boxsh:rgba(0,0,0,0.6);
    --links:#fff;

    --bottums:rgba(0,0,0,0.5);
    --botcolor:#fff;
    --botback:#800000;

    --hover:linear-gradient(135deg,#1e1e2f,#2c2c54) !important;
    --overlay:rgba(0,0,0,0.3);

}

.our-sections{
	width: 94%;
	height: 55vh;
	padding:10px; 
	margin: 30px 3% 10px 3%;
	display: flex;
	justify-content: start;
	align-items: flex-start;
	border-radius: 7px;
	box-shadow: 2px 5px 7px var(--overlay);
	background: var(--mainback);
}
.our-sections h5{
	float: left;
	font-weight: 700;
	margin: 10px 5px 20px 5px;
	color: var(--botback);
}
.our-sections ul{
	margin-top: 20px;
	padding: 12px;
	list-style: none;
	text-align: left;
	text-indent: 10px;
}
.our-sections ul li{
	padding: 10px;
	font-size: 14px;
	font-weight: bold;
	color: var(--seccolor);
	letter-spacing: 1.5px;
}
.our-sections ul li i{
	color: var(--botback);
}
.our-sections table{
	width: 100%;
}
.our-sections table tr th{
	color: var(--maincolor);
}
.our-sections table td input{
	width: 100%;
	padding: 5px;
	margin: 10px 5px;
	text-indent: 20px;
	border:0px;
	border: 1px solid var(--borcolor);
	transition: all .5s ease-in-out;
	border-bottom: 1px solid var(--borcolor);
	background: var(--mainback);
}
.our-sections table td textarea{
	width: 100%;
	height: 50px;
	padding: 5px;
	margin: 10px 5px;
	text-align: left;
	border:0px;
	border: 1px solid var(--borcolor);
	transition: all .5s ease-in-out;
	border-bottom: 1px solid var(--borcolor);
	background: var(--mainback);	
}
.our-sections table th input{
	width: 300px;
	padding: 7px;
	margin: 10px 1px;
	font-size: 16px;
	font-weight: bold;
	border-radius: 5px;
	border:0px;
	transition: all 3s ease-in-out;
	box-shadow: 2px 5px 7px var(--overlay);
	border-bottom: 1px solid var(--borcolor);
	color: var(--mainback);
	background: var(--botback);	
}
.our-sections table th input:hover{
	
	box-shadow: 3px 7px 10px var(--bottums);
	border-bottom: 1px solid var(--maincolor);
	color: var(--mainback);
	background: var(--hover);	
}
.our-sections table td input::placeholder{
	text-indent: 20px;
	color: var(--seccolor);
}
.our-sections table td input:focus,.our-sections table td textarea:focus{
	outline: 2px solid var(--overlay);
	box-shadow: -1px 3px 5px var(--botback);	
}


.ok-done
{
    width: 80%;
    padding: 10px;
    margin: 5px 10%;
    text-align: center;
    font-size: 14px;
    font-weight: bold;
    font-style: italic;
    border:1px solid rgba(255,255,255,0.6);
    box-shadow: -2px 5px 7px rgba(255,255,255,0.6);
    color: #fff;
    background: rgba(63,233,71,0.7);
}
.error_mass
{
    width: 80%;
    padding: 10px;
    margin: 5px 10%;
    text-align: center;
    font-size: 14px;
    font-weight: bold;
    font-style: italic;
    border:1px solid rgba(255,255,255,0.6);
    box-shadow: -2px 5px 7px rgba(255,255,255,0.6);
    color: #fff;
    background: rgba(255,0,0,0.7);
}



@media(max-width: 768px){
	.our-sections{
		padding-top: 20px; 
	}
	.our-sections table td input{
	width: 98%;
	padding: 5px;
	margin: 10px 1px;
	text-indent: 20px;
	border:0px;
	border: 1px solid var(--borcolor);
	transition: all .5s ease-in-out;
	border-bottom: 1px solid var(--borcolor);
	background: var(--mainback);
}
.our-sections table td textarea{
	width: 98%;
	height: 70px;
	padding: 5px;
	margin: 10px 1%;
	text-align: left;
	border:0px;
	border: 1px solid var(--borcolor);
	transition: all .5s ease-in-out;
	border-bottom: 1px solid var(--borcolor);
	background: var(--mainback);	
}
.our-sections ul li{
	padding: 10px;
	margin-left: -20px;
	font-size: 14px;
	font-weight: bold;
	color: var(--seccolor);
	letter-spacing: 1.5px;
}
.our-sections ul li i{
	color: var(--botback);
}
}