@charset "utf-8";
/* CSS Document */
#contact-form .caption {
	width: 530px;
	text-align: center;
	margin: auto;
	margin-bottom: 30px;
}

#contact-form .caption h2 {
	font-size: 18px;
	margin-bottom: 25px;
	line-height: 150%;
	color: black;
}

#contact-form form {
	width: 640px;
	margin: auto;
}
	

#contact-form form dl {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	    -ms-flex-pack: justify;
	        justify-content: space-between;	
	-ms-flex-wrap: wrap;	
	    flex-wrap: wrap;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
}

#contact-form form dt, dd {
	margin-top: 15px;
}
	

#contact-form form dt {
	width: 20%;
	height: 32px;
	text-align: center;
	background: rgba(247,147,30,1);
	color: white;
	font-weight: 700;
	border-radius: 30px;
	line-height: 32px;
}

#contact-form form dd {
	width: 75%;
}

#contact-form form dd input {
	height: 45px;
}

#contact-form form dd textarea {
	height: 110px;
}

#contact-form form dd input:focus,
#contact-form form dd select:focus,
#contact-form form dd textarea:focus {
	outline: none;
	border: 1px solid rgba(252,217,173,1);
}

#contact-form form dd input,
#contact-form form dd select,
#contact-form form dd textarea {
	width: 100%;
	resize: vertical;
	border-radius: 10px;
	border: 1px solid rgba(247,147,30,1);
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
	padding: 10px 10px;
}


#contact-form form .address-dd {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
}

#contact-form form .address-dd input:nth-child(1),
#contact-form form .address-dd select  {
	-ms-flex-preferred-size: 20%;
	    flex-basis: 20%;
    margin-right: 10px;
	width: 20%;
}

#contact-form form .address-dd input:nth-child(3) {
	-ms-flex-preferred-size: calc(60% - 20px);
	    flex-basis: calc(60% - 20px);
}

#contact-form form .check {
	margin-left: 165px;
}

#contact-form form .check input[type="checkbox"]{
	vertical-align: -2px;
}

#contact-form form input[type="submit"] {	
	opacity: 0.9;
	margin-left: auto;
	border-radius: 20px;
	border: 1px solid rgba(255,204,102,1);
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
	padding: 10px 10px;
	background: -webkit-radial-gradient(bottom center, circle, #ffe29b 0%, #ff931e 100%);
	background: -o-radial-gradient(bottom center, circle, #ffe29b 0%, #ff931e 100%);
	background: radial-gradient(circle at bottom center, #ffe29b 0%, #ff931e 100%);
	width: 210px;
	color: white;
	height: 53px;
    -webkit-box-shadow: 0px 4px 3px 1px #aaa;
            box-shadow: 0px 4px 3px 1px #aaa;
	-webkit-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
	display: block;
}

#contact-form form input[type="submit"]:hover {
	opacity: 1;
	-webkit-box-shadow: 0px 12px 8px -5px #bbb;
	        box-shadow: 0px 12px 8px -5px #bbb;
	-webkit-transform: translate(0, -4px);
	    -ms-transform: translate(0, -4px);
	        transform: translate(0, -4px);
}

#contact-form form input[type="submit"]:focus {
	outline:none;
}

#contact-form form input[type="submit"]:active {
	-webkit-box-shadow: 0px 2px 5px 1px #aaa;
	        box-shadow: 0px 2px 5px 1px #aaa;
	outline:none;
	-webkit-transform: translate(0, 0px);
	    -ms-transform: translate(0, 0px);
	        transform: translate(0, 0px);
}

#contact-form form .alert {
	color: rgba(247,147,30,1);
	margin-left: 10px;
    margin-top: 2px;
}

@media (max-width:660px) {
	
	#contact-form form {
		width: auto;
	}

	#contact-form form dl {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		    -ms-flex-direction: column;
		        flex-direction: column;
	}
	#contact-form form dt {
		width: 75%;
		text-align: left;
		padding-left: 20px;
		-webkit-box-sizing: border-box;
		        box-sizing: border-box;
	}

	#contact-form form .check {
		margin-left: auto;

		margin-right: auto;
		width: 75%;
	}
	#contact-form form input[type="submit"] {
		margin-top: 20px;
		margin-right: auto;
	}
	
}

@media (max-width:575px) {
	#contact-form .caption {
		width: 90%;
	}
}


@media (max-width:460px) {
	#contact-form .caption,
	#contact-form form dt,
	#contact-form form dd,
	#contact-form form .check {
		width: 90%;
	}
	
	.contacts {
		width: 90%;
	}
	
}

@media (max-width:370px){
	#contact-form form .address-dd {
		-webkit-box-pack: justify;
		    -ms-flex-pack: justify;
		        justify-content: space-between;
	}	
	
	#contact-form form .address-dd input:nth-child(1), 
	#contact-form form .address-dd select {
		-ms-flex-preferred-size: 48%;
		    flex-basis: 48%;
    	margin-right: 0;
	}
	
	#contact-form form .address-dd input:nth-child(3) {
		-ms-flex-preferred-size: 100%;
		    flex-basis: 100%;
    	margin-top: 10px;
		
	}
}