html, body {
	width: 100%;
}
body {
	font-family: Arial;
	font-size: 14px;
	line-height: 22px;
	color: #333;
}

a {
    color: #347cd4;
}
.small-capitals {
    font-family: Verdana;
    font-size: 86%;
    letter-spacing: 1px;
}

.header-background {
	background-color: #000;
    position: relative;
    z-index: 10;
    /* background-image: linear-gradient(-45deg, #171363 1%, #222 100%); */
}
header {
	width: 920px;
	height: 46px;
	margin: auto;
    padding: 0 44px;
	color: #FFF;
}
#logo, #description, #address, #work-time, #email, #phone {
	display: inline-block;
	vertical-align: top;
}
#logo {
	margin: 13px 32px 0 0;
}
#logo a {
	font-size: 22px;
    font-weight: bold;
	color: #FFF;
	text-decoration: none;
}
#logo p {
    display: inline-block;
    font-size: 7px;
    line-height: 11px;
    margin-left: 18px;
    text-transform: uppercase;
    letter-spacing: 1px;
}
#address {
	margin: 12px 40px 0 0;
	background: url(../img/template/location.png) no-repeat 0px center;
	background-size: 18px 18px;
}
#address a {
	color: #FFF;
	text-decoration: none;
	padding-left: 22px;
}
#address a span {
    border-bottom: 1px dashed #AAA;
}
#work-time {
	margin: 13px 34px 0 0;
	background: url(../img/template/clock.png) no-repeat 0px center;
	background-size: 18px 18px;
}
#work-time span {
	padding-left: 26px;
}
#email {
	margin: 13px 30px 0 0;
	background: url(../img/template/envelope.png) no-repeat 0px center;
	background-size: 18px 18px;
}
#email a {
	text-decoration: none;
    padding-left: 26px;
    color: #FFF;
}
#email a span {
    border-bottom: 1px dashed #AAA;
}
#phone {
	margin: 14px 0 0 0;
	font-size: 16px;
	font-weight: bold;
	color: #FFF;
	background: url(../img/template/phone.png) no-repeat 0px 1px;
	background-size: 18px 18px;
}
#phone a {
    text-decoration: none;
    padding-left: 22px;
    color: #FFF;
}


.offer-background {
    background: url('../img/template/bg2.jpg');
    background-position: 50% 20%;
    background-size: cover;
    background-color: rgba(0,0,0,.02);
    background-blend-mode: darken;
border-bottom: 4px dashed #FFF;
}
#offer {
	width: 920px;
	margin: auto;
    padding: 66px 44px 60px;
    border: 0px solid;
}
h1 {
    font-family: GothamProBold;
    font-size: 46px;
    font-weight: 900;
    line-height: 62px;
    color: #F7F7F7;
    text-align: center;
    text-shadow: 1px 2px 0px #000;
    margin-bottom: 16px;
}
.title {
    font-family: GothamProBold;
    font-size: 46px;
    font-weight: 900;
    line-height: 62px;
    color: #F7F7F7;
    text-align: center;
    text-shadow: 1px 2px 0px #000;
    margin-bottom: 36px;
}
.sub-title {
    

    font-size: 20px;
    line-height: 30px;
    font-weight: 400;
    text-align: center;
    text-shadow: 1px 2px 0px #333;
    margin-bottom: 58px;
color: #F7F7F7;

}
#offer ul.bullet {
    text-align: center;
    margin-bottom: 46px;
    margin-left: -50px;
}
#offer ul.bullet li {
    display: inline-block;
    margin-left: 50px;
    font-size: 18px;
    line-height: 28px;
    color: #F7F7F7;
    padding-left: 40px;
    text-shadow: 1px 2px 0px #000;
vertical-align: top;
}
#offer ul.bullet li span {
    padding-left: 4px;
}
.officially {
    background: url('../img/bullet-icons/officially.png') 10px 10px no-repeat transparent;
	background-position: 0px 0px;	
    background-size: 32px;
}
.in-5-minutes {
    background: url('../img/bullet-icons/in-5-minutes.png') 10px 10px no-repeat transparent;
	background-position: 0px 0px;	
    background-size: 32px;
}
.price-from-450-rubles {
    background: url('../img/bullet-icons/price-from-450-rubles.png') 10px 10px no-repeat transparent;
	background-position: 0px 0px;	
    background-size: 32px;
}
.without-prepayment {
    background: url('../img/bullet-icons/without-prepayment.png') 10px 10px no-repeat transparent;
	background-position: 0px 0px;	
    background-size: 32px;
}
ul.bullet li p {
		font-size: 12px;
		display: block;
		margin-top: -4px;}
.as-a-result {
    width: 698px;
    margin-top: 34px;
    text-align: left;

}
#offer div {
    width: 756px;
    margin: -64px auto 8px;
}


#string {

}
#string>span{ 
font-size: 20px; 
font-weight: 900; 
line-height: 26px; 
text-align: center; 
color: #fff; 
text-shadow: 1px 1px 0 rgba(0,0,0,0.7); 
cursor: pointer; 

} 
#string>span:before { 
content: ""; 
left: 0em; 
width: 368px; 
height: 64px; 
background: linear-gradient(to left, rgba(255,255,255,.0), rgba(255,255,255,.8), rgba(255,255,255,.0)) no-repeat -2em 0%; 
background-size: 2em 100%; 
top: 70px; 
border-radius: 30px 75px 30px 75px; 
position: relative; 
display: inline-block; 
transform: rotate(15deg); 
-moz-transform: skewX(-50deg); 
-o-transform: skewX(-50deg); 
-webkit-transform: skewX(-50deg); 
transform: skewX(-20deg); 
} 



#string>span.blink_on:before{ 
    transition: 1.5s linear; 
    background-position: 130% 0%; 
} 






.button {
    display: block;
	float: left;
    
    width: 368px;
    border-radius: 50px;
    margin: 0 32px 0 0;
    padding: 18px 20px 18px 20px;
    box-shadow: 0 4px 6px 0 rgba(0,0,0,.15),0 1px 0 1px rgba(0,0,0,.05),0 0 0 1px rgba(0,0,0,.05);
	
	background-color: #4285f4;
	border-bottom: 2px solid #366bc3;
	
    font-size: 20px;
	font-weight: 900;
	line-height: 26px;
	text-align: center;
	text-decoration: none;
    color: #fff;
    text-shadow: 1px 1px 0 rgba(0,0,0,0.7);

	box-sizing: border-box;
	cursor: pointer;    
}
input[type="submit"] {
    width: 354px;
    float: left;
        animation: test infinite 5s;
    background-color: #4285f4;
    border-bottom-color: rgb(255, 255, 255);
    border-bottom-left-radius: 50px;
    border-bottom-right-radius: 50px;
    border-top-left-radius: 50px;
    border-top-right-radius: 50px;
    border-bottom-style: none;
    border-bottom-width: 0px;
    border-left-color: rgb(255, 255, 255);
    border-left-style: none;
    border-left-width: 0px;
    border-right-color: rgb(255, 255, 255);
    border-right-style: none;
    border-right-width: 0px;
    border-top-color: rgb(255, 255, 255);
    border-top-style: none;
    border-top-width: 0px;

    box-sizing: border-box;
    color: #FFF;
    cursor: pointer;

    font-size: 18px;
    font-style: normal;
    font-variant: normal;
    font-weight: 700;
    height: 62px;
    line-height: 23px;
    border-bottom: 2px solid #366bc3;

    margin-left: 0px;
    margin-right: 28px;
    margin-top: 0px;
    outline-color: rgb(255, 255, 255);
    outline-style: none;
    outline-width: 0px;
    padding-bottom: 10px;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 8px;
    position: relative;
    text-align: center;
    text-decoration: none;
    text-shadow: 1px 1px 0 rgba(0,0,0,0.7);
    transition-delay: 0s, 0s;
    transition-duration: 0.2s, 0.2s;
    transition-property: background, box-shadow;
    transition-timing-function: ease, ease;
    vertical-align: middle;
    white-space: nowrap;
    
}

.or {
	float: left;
	margin-right: 28px;
	margin-top: 10px;
    color: #FFF;
}
.call {
	float: left;
	font-size: 14px;
	font-weight: 500;
	width: 266px;
	margin-top: 0px;
    font-style: italic;
	line-height: 22px;
    color: #FFF;
}
.call a {
	font-size: 14px;
	text-decoration: none;
	font-weight: bold;
    color: #FFF;
}

ul.department {
				margin-left: -2px;
				opacity: 0.8; 
			}
			ul.department li {
				display: inline-block;
				vertical-align: top;
				}
			
			.gibdd {
				margin-right: 26px;
				}		
			.rsa {
				margin-right: 36px;
				}
			.mintrans {
				margin-right: 40px;
				}
			.deptrans {}
			
			ul.department img {
			  -webkit-filter: grayscale(100%);
			  -moz-filter: grayscale(100%);
			  -ms-filter: grayscale(100%);
			  -o-filter: grayscale(100%);
			  filter: grayscale(100%);
			  filter: gray; /* IE 6-9 */
				height: 54px;
			}
			ul.department img:hover {

			  -webkit-filter: none;
			  -moz-filter: none;
			  -ms-filter: none;
			  -o-filter: none;
			  filter: none;
			  filter: none; /* IE 6-9 */
			}
			
			ul.department img {
			  -webkit-filter: grayscale(100%);
			  -moz-filter: grayscale(100%);
			  -ms-filter: grayscale(100%);
			  -o-filter: grayscale(100%);
			  filter: grayscale(100%);
			  filter: gray; /* IE 6-9 */
			/*??????? ??? ????? ??? ???*/
			  -webkit-transition: all 0.3s;
			  -moz-transition: all 0.3s;
			  -o-transition: all 0.3s;
			  transition: all 0.3s;
			/*????? ???? ? transition*/
			}
			ul.department img:hover {
			  -webkit-filter: none;
			  -moz-filter: none;
			  -ms-filter: none;
			  -o-filter: none;
			  filter: none;
			  filter: none; /* IE 6-9 */
			}






.scheme-of-work-background {
    background-size: cover;
    background: #F4F4F4;
}
#scheme-of-work {
	width: 920px;
	margin: auto;
    padding: 44px 44px 54px;
    border: 0px solid;
}
.header-h2 {
    display: block;
    font-family: GothamProBold;
    font-size: 26px;
    font-weight: 900;
    line-height: 36px;
    color: #222;
    margin-bottom: 22px;
}
#scheme-of-work ul li {
    display: inline-block;
}
.header-h4 {
    display: block;
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
    color: #222;
    margin-bottom: 4px;
}
.one {
    width: 250px;
    margin-right: 50px;
}
.two {
    width: 196px;
    margin-right: 48px;
}
.three {
    width: 250px;
    margin-right: 36px;
}
.four {
    width: 176px;
}

#operator-of-technical-inspection {
	width: 920px;
	margin: auto;
    padding: 44px 44px 34px 44px;
}
#category {
    float: left;
    margin-bottom: 38px;
}
#category ul li {
    display: inline-block;
    vertical-align: top;
    margin-right: 34px;
}
#category ul li img {
    display: block;
    width: 64px;
    margin-bottom: 10px;
}
.category-name {
    display: block;
    font-size: 12px;
    line-height: 16px;
    font-weight: 900;
}
.category-descr {
    display: block;
    font-size: 11px;
    line-height: 16px;
}
#icon-dk {
    float: left;
    height: 332px;
    margin-bottom: 0px;
}
#icon-dk img {
    width: 468px;
    margin-left: -8px;
}
#info {
    float: right;
    width: 392px;
    margin-top: 4px;
    margin-bottom: 34px;
}
#info ul {
    margin-bottom: -46px;
}
#info ul li {
    margin-bottom: 46px;
}
#info .header-h4 {
    margin-bottom: 12px;
}
#info p {
    margin-top: 0px;
}
.lable {
    font-family: Verdana;
    text-transform: uppercase;
    font-size: 10px;
    font-weight: 400;
    color: #666;
    padding-right: 6px;
}
i {
    font-style: italic;
}
#info ul li p a {
    text-decoration: none;
    border-bottom: 1px dashed rgba(66,72,181,.3);
}
#insurance {
    float: left;
}
#insurance ul li {
    display: inline-block;
    vertical-align: middle;
    margin-right: 38px;
}
#insurance ul li img {
    display: block;
    width: 100px;

}

.form-background {
    background: linear-gradient(138deg,#EEEEf0, #fff,#EEEEf0);
}
#online-form {
	width: 920px;
	margin: auto;
    padding: 44px 44px 54px;
}

.super-red {
				margin-bottom: 10px;
				font-size: 14px;
				font-weight: 900;
				color: #E00;
			}

.tabs {
    display: inline-block;
    width: 100%;
}

.tabs .header-h2:after {
    content: "";
    display: block;
    clear: both;
    margin-bottom: 28px;
}
.tabs .header-h2 .title-link {
    margin: 0px;
    padding: 0px;
    cursor: pointer;
    display: inline-block;
	text-decoration: none;
}
.tabs .header-h2 .title-link span {
    color: #347cd4;
	border-bottom: 1px dashed rgba(66,72,181,.3);
}
.tabs .header-h2 .title-link.active, .tabs .header-h2 .title-link.active span, .tabs .header-h2 .title-link.active:hover {
    color: #222;
	border-bottom: none;
    cursor: auto;
}
.tabs input[type="text"] {
	background: #FFF;
	outline: none;
	height: 36px;
	border: 1px solid #A4A4A4;
	font-size: 14px;
	border-radius: 2px;
	font-family: Arial;
	background: #ffffff !important;
	padding: 0 10px;
}
.tabs input[type="text"]:focus {
	color: #000000;
	border: 1px solid #000000;
}
.tabs select {
	outline: none;
	height: 38px;
	border: 1px solid #A4A4A4;
	font-size: 14px;
	font-family: Arial;
    color: #222;
	background: #ffffff !important;
    white-space: pre;
    margin-top: 4px;
}

.photo-info {
	margin-bottom: 42px;
}
.photo-info a {
    text-decoration: none;
    color: #222;
    font-weight: 700;
}
.photo-place {
	float: left;
}
.photo-place input {
	margin-left: 38px;
}
.front-side {
	border: 2px dashed #CCC;
	padding: 18px 20px 28px 20px;
	width: 280px;
	margin-bottom: 34px;
}
.back-side {
	border: 2px dashed #CCC;
	padding: 18px 20px 28px 20px;
	width: 280px;
}

.front-side, .back-side {
    height: 44px;
    background-color: #F3F3F3;
    padding-top: 22px;
}



#online-form .lable {
    font-family: Verdana;
    text-transform: uppercase;
    font-size: 10px;
    font-weight: 700;
    color: #222;
    padding-right: 6px;
}



.info-place {
	float: left;
	margin-left: 36px;
	margin-bottom: 40px;
}
.info-place .additional-information {
	margin-top: 4px;
	margin-bottom: 42px;
}
.info-place div b {
	display: block;
}
.info-place label, .osago-information {
	font-size: 11px;
	color: #555;
}
.info-place .fuel {
	display: inline-block;
	width: 102px;
	margin-right: 10px;
}
.info-place .fuel select {
	width: 102px;
	border: 1px solid #888;
}
.info-place .mileage {
	display: inline-block;
	width: 72px;
	margin-right: 10px;
}
.info-place .mileage input {
	width: 50px;
	margin-top: 4px;
}
.info-place .tires {
	display: inline-block;
	width: 114px;
	margin-right: 10px;
}
.info-place .tires input {
	width: 92px;
	margin-top: 4px;
}
.info-place .taxi {
	display: inline-block;
	width: 230px;
}
.info-place .taxi select {
	width: 230px;
	border: 1px solid #888;
	margin-top: 4px;
}
.info-place .name {
	display: inline-block;
	width: 180px;
	margin-right: 10px;
}
.info-place .name input {
	width: 158px;
	margin-top: 4px;
}
.info-place .phone-number {
	display: inline-block;
	width: 150px;
	margin-right: 10px;
}
.info-place .phone-number input {
	width: 128px;
	margin-top: 4px;
}
.info-place .email {
	display: inline-block;
	width: 200px;
}
.info-place .email input {
	width: 180px;
	margin-top: 4px;
}






.osago-information {
    margin-bottom: 38px;
}

.registration {
	display: inline-block;
	width: 158px;
	margin-right: 12px;
}

.power {
	display: inline-block;
	width: 140px;
	margin-right: 14px;
}



.drivers {
	display: inline-block;
	width: 192px;
	margin-right: 14px;
}

.drivers select {
    width: 228px;
}







.button-place button {
	width: 326px;
    float: left;
    background-color: #4285f4;
    border-bottom-color: rgb(255, 255, 255);
    border-bottom-left-radius: 50px;
    border-bottom-right-radius: 50px;
    border-top-left-radius: 50px;
    border-top-right-radius: 50px;
    border-bottom-style: none;
    border-bottom-width: 0px;
    border-left-color: rgb(255, 255, 255);
    border-left-style: none;
    border-left-width: 0px;
    border-right-color: rgb(255, 255, 255);
    border-right-style: none;
    border-right-width: 0px;
    border-top-color: rgb(255, 255, 255);
    border-top-style: none;
    border-top-width: 0px;

    box-sizing: border-box;
    color: #FFF;
    cursor: pointer;

    font-size: 18px;
    font-style: normal;
    font-variant: normal;
    font-weight: 700;
    height: 62px;
    line-height: 23px;
    border-bottom: 2px solid #366bc3;

    margin-left: 0px;
    margin-right: 6px;
    margin-top: 0px;
    outline-color: rgb(255, 255, 255);
    outline-style: none;
    outline-width: 0px;
    padding-bottom: 10px;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 8px;
    position: relative;
    text-align: center;
    text-decoration: none;
    text-shadow: 1px 1px 0 rgba(0,0,0,0.7);
    transition-delay: 0s, 0s;
    transition-duration: 0.2s, 0.2s;
    transition-property: background, box-shadow;
    transition-timing-function: ease, ease;
    vertical-align: middle;
    white-space: nowrap;
}
.button-place p {
    display: inline-block;
    margin: 0;
    margin-left: 30px;
    margin-top: 12px;
    width: 480px;
    font-size: 11px;
    line-height: 17px;
    color: #222;
}
.button-place p a {
    text-decoration: none;
    color: #333;   
}
.button-place p a span {
    border-bottom: 1px dashed;
}

.manual-tab {}
.manual-info {
    margin-bottom: 42px;
	color: #333;
}
.manual-info a {
    text-decoration: none;
    color: #222;
    font-weight: 700;
}
.manual-inputs {
    float: left;
    width: 600px;
}
.manual-tab label {
    font-size: 11px;
    color: #666;
}
.manual-tab input {
    margin-top: 4px;
}
.line-submitted-document {
    margin-bottom: 28px;
}
.line-submitted-document div {
    display: inline-block;
    margin-bottom: 12px;
}
.line-submitted-document p {
    display: inline-block;
}
.line-submitted-document select {
    display: inline-block;
    width: 388px;
}
.line-submitted-document .full-name {
    width: 600px;
    margin-top: -4px;
}
.line-submitted-document .full-name input {
    width: 578px;
}
.line-submitted-document .series-and-number {
    width: 124px;
    margin-right: 10px;
}
.line-submitted-document .series-and-number input {
    width: 102px;
}
.line-submitted-document .issued-by {
    width: 354px;
    margin-right: 10px;
}
.line-submitted-document .issued-by input {
    width: 332px;
}
.line-submitted-document .date-of-issue {
    width: 94px;
}
.line-submitted-document .date-of-issue input {
    width: 72px;
}
.line-vehicle-information {
    margin-bottom: 28px;
}
.line-vehicle-information div {
    display: inline-block;
    margin-bottom: 12px;
}
.line-vehicle-information .vehicle-number {
    width: 118px;
    margin-right: 10px;
}
.line-vehicle-information .vehicle-number input {
    width: 96px;
}
.line-vehicle-information .vin {
    width: 174px;
    margin-right: 10px;
}
.line-vehicle-information .vin input {
    width: 152px;
}
.line-vehicle-information .brand-and-model {
    width: 280px;
}
.line-vehicle-information .brand-and-model input {
    width: 258px;
}
.line-vehicle-information .vehicle-category {
    width: 160px;
    margin-right: 10px;
}
.line-vehicle-information .vehicle-category select {
    width: 160px;
}
.line-vehicle-information .year-of-issue {
    width: 82px;
    margin-right: 10px;
}
.line-vehicle-information .year-of-issue select {
    width: 82px;
}
.line-vehicle-information .chassis {
    width: 142px;
    margin-right: 10px;
}
.line-vehicle-information .chassis input {
    width: 118px;
}
.line-vehicle-information .body {
    width: 174px;
}
.line-vehicle-information .body input {
    width: 152px;
}
.line-vehicle-information .maximum-weight {
    width: 82px;
    margin-right: 10px;
}
.line-vehicle-information .maximum-weight input {
    width: 60px;
}
.line-vehicle-information .weight-without-load {
    width: 82px;
    margin-right: 10px;
}
.line-vehicle-information .weight-without-load input {
    width: 60px;
}
.line-vehicle-information .mileage {
    width: 82px;
    margin-right: 10px;
}
.line-vehicle-information .mileage input {
    width: 60px;
}
.line-vehicle-information .tyres {
    width: 196px;
    margin-right: 10px;
}
.line-vehicle-information .tyres input {
    width: 172px;
}
.line-vehicle-information .fuel {
    width: 102px;
}
.line-vehicle-information .fuel select {
    width: 102px;
}
.line-contact-information div {
    display: inline-block;
    margin-bottom: 38px;
}
.line-contact-information .name {
    width: 180px;
    margin-right: 10px;
}
.line-contact-information .name input {
    width: 158px;
}
.line-contact-information .phone-number {
    width: 148px;
    margin-right: 10px;
}
.line-contact-information .phone-number input {
    width: 126px;
}
.line-contact-information .email {
    width: 244px;
}
.line-contact-information .email input {
    width: 222px;
}
.notes {
    float: left;
    width: 268px;
    margin-left: 52px;
    font-size: 11px;
    line-height: 18px;
    color: #888;
    font-style: italic;
}
.one-note {}
.two-note {
    margin-top: 78px;
}
.three-note {
    margin-top: 56px;
}
.four-note {
    margin-top: 100px;
}
.five-note {
    margin-top: 128px;
}

#questions-and-answers {
    width: 920px;
	margin: auto;
    padding: 44px 44px 34px 44px;
}
.block {
    display: inline-block;
    width: 266px;
    margin-right: 38px;
    vertical-align: top;
    margin-bottom: 24px;
}
.spoilerLink {
    font-size: 14px;
    margin: 16px 0;
    color: #347cd4;
	border-bottom: 1px dashed rgba(66,72,181,.3);
    cursor: pointer;
}
.spoilerBody {
    display: none;
}

#footer {
	width: 920px;
	margin: auto;
	font-size: 11px;
	line-height: 16px;
	padding: 22px 0 32px;
	color: #222;
    border-top: 1px solid #CCC;
}
#footer div {
	display: inline-block;
	vertical-align: top;
}
.copyright {
	width: 320px;
	margin-right: 36px;
}
.copyright p {
	margin-bottom: 6px;	
}
.copy2017 {
	text-transform: uppercase;
	font-size: 11px;
	font-weight: bold;
}
.legal-information {
	width: 222px;
	margin-right: 54px;
}
.legal-information p {
	margin-bottom: 6px;	
}
.legal-information a {
	color: #222;
	text-decoration: none;
}
.legal-information span {
	border-bottom: 1px dashed;
}
.federal-law {
	width: 280px;
}




#reviews {
	width: 920px;
	margin: auto;
    padding: 44px 44px 54px;
    border: 0px solid;
}











/*
#string>span{
font-size: 20px;
font-weight: 900;
line-height: 26px;
text-align: center;
color: #fff;
text-shadow: 1px 1px 0 rgba(0,0,0,0.7);
cursor: pointer;

}
#string>span:before {
content: "";
left: 0em;
width: 370px;
height: 64px;
background: linear-gradient(to left, rgba(255,255,255,.0), rgba(255,255,255,.8), rgba(255,255,255,.0)) no-repeat -2em 0%;
background-size: 2em 100%;
top: 70px;
border-radius: 30px 75px 30px 75px;
position: relative;
display: inline-block;
transform: rotate(15deg);
-moz-transform: skewX(-50deg);
-o-transform: skewX(-50deg);
-webkit-transform: skewX(-50deg);
transform: skewX(-20deg);
}

#string>span.blink_on:before{
    transition: 0.6s linear;
    background-position: 130% 0%;
}
*/

.modal {
    display: none;
    position: fixed;
    z-index: 1;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0, 0, 0, 0.5);
    padding-top: 60px;
}

.modal-content {
    background-color: #fefefe;
    margin: 5% auto;
    padding: 20px;
    border: 1px solid #888;
    width: 90%;
    max-width: 500px;
    border-radius: 10px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
}

.close {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
    cursor: pointer;
}

.close:hover,
.close:focus {
    color: black;
    text-decoration: none;
}

form {
    display: flex;
    flex-direction: column;
}

label {
    margin-top: 10px;
    font-weight: bold;
}

input, select, button {
    width: 100%;
    padding: 10px;
    margin-top: 5px;
    border: 1px solid #ccc;
    border-radius: 5px;
    font-size: 16px;
}

button {
    margin-top: 20px;
    background-color: #4CAF50;
    color: white;
    border: none;
    cursor: pointer;
    padding: 10px;
    font-size: 16px;
}

button:hover {
    background-color: #45a049;
}

#step2 {
    display: none;
}