/*
    form-contact.css
    web-communication.eu | 14/04/2016
    Copyright 2016 web-communication.eu
*/


#form-contact {
	position:					relative;
	margin-top: 				5px;
	width:						100%;
}

#form-contact .row {
	width:						100%;
	display: 					inline-block;
	margin: 					0;
}

#form-contact .alert {
	float: 						left;
	width:						10%;
	height: 					50px;
}	


#form-contact .alert_bg {
	background: 				url('../images/alert.png') no-repeat right 8px  top 13px;	
}

#form-contact .alert_ok {
	background: 			 	url('../images/ok.png') no-repeat right 8px  top 13px;	
	background-size: 24px;
}






#form-contact .field {
	float: 						left;
	width:						80%;
}

#form-contact .info {
	float: 						left;
	width:						10%;
	height: 					50px;
}	

#form-contact .infoimg {
	position: 					relative;
	top: 						10px;
	left: 						5px;
	width: 						30px;
	height: 					30px;
	display:                    block;
	cursor:                     pointer;
	background:                 url('../images/info.png') no-repeat 0 0;
}

#form-contact .infoimg:hover {
	background:                 url('../images/info.png') no-repeat 0 -30px;
}




#form-contact .error {
	float: 						left;
	margin: 					10px 0 5px 10%;
	width:						90%;
	padding-left:				5px;
	font-family:                Verdana, Arial, Helvetica, sans-serif;
	color:                   	#ff0000;
	font-size: 					14px;
}		


#form-contact form {
	width:							100%;
	margin:							0;
}


#form-contact input[type=text], input[type=number], input[type=email] {
	width:							100%;
	height: 						50px;
	padding: 						15px;
	border-radius:					5px;
	border:							1px solid #0000ff;
	font-family:                	Verdana, Arial, Helvetica, sans-serif;
	color:                   	    #000000;
	font-size: 						14px;
}

/*
#form-contact input[type=number] {
	width:							100%;
	height: 						50px;
	padding: 						15px;
	border-radius:					5px;
	border:							1px solid #0000ff;
	font-family:                	Verdana, Arial, Helvetica, sans-serif;
	color:                   	    #000000;
	font-size: 						14px;
}
*/

#form-contact textarea {
	width:							100%;
	height: 						200px;
	padding: 						15px;
	border:							1px solid #0000ff;
	border-radius:					5px;
	resize:							none;
	font-family:               		Verdana, Arial, Helvetica, sans-serif;
	color:                     		#000000;
	font-size: 						14px;
}

#form-contact input[type=text]:focus, input[type=number]:focus, input[type=email]:focus, textarea:focus  {
	border-color:              		#0000ff;
    box-shadow:               		0 0 5px #000;
    -moz-box-shadow:         		0 0 5px #000;
    -webkit-box-shadow:     		0 0 5px #000;
    color:                  		#000000;
    -webkit-appearance:       	    none;
}

#form-contact input[type=text]:hover, input[type=number]:hover, input[type=email]:hover, textarea:hover {
	border-color:              		#0000ff;
    box-shadow:                		0 0 5px #000;
    -moz-box-shadow:           		0 0 5px #000;
    -webkit-box-shadow:        		0 0 5px #000;
    color:                     		#000000;
    -webkit-appearance:        		none;
}

/* placeholder */	
#form-contact ::-webkit-input-placeholder { color:#999999;}
#form-contact ::-moz-placeholder { color:#555555;} /* firefox 19+ */
#form-contact :-ms-input-placeholder { color:#999999;} /* ie */
#form-contact input:-moz-placeholder { color:#999999;}



#form-contact input.red, #form-contact textarea.red {
	border:							1px solid #ff0000;
	background:						#ffdddd;
}


#form-contact label[for="conditions"], #form-contact label[for="connected"] {
    margin-left:               		7px;
	font-family:               		Verdana, Arial, Helvetica, sans-serif;
    font-size:                 		12px;
	color:                     		#000000;
	float: 							left;
	width: 							70%;
}

/* checkbox */
#form-contact input[type=checkbox], #form-contact input[type=radio] {
    vertical-align:            		middle;
    position:                  		relative;
    bottom:                    		1px;
	margin-top: 					2px;
	margin-left: 					10px;
	float:							left;
	
	/* Double-sized Checkboxes */
	-ms-transform: scale(1.5); /* IE */
	-moz-transform: scale(1.5); /* FF */
	-webkit-transform: scale(1.5); /* Safari and Chrome */
	-o-transform: scale(1.5); /* Opera */
}

#form-contact input[type=radio] {
    bottom:                    		2px;
}


#form-contact .link, #form-contact .link:visited {
	color:                     		#0000ff;
	text-decoration:				none;
}

#form-contact .link:hover {
	color:                     		#0000ff;
	text-decoration:				underline;
}


/* SUBMIT */
#form-contact .submit, #form-contact .submit:visited {
    color:                     #FFF;
    font-family:               Arial, Helvetica, sans-serif;
    font-size:                 18px;
    font-weight:               normal;
    width:                     100%;
    height:                    50px;
    margin:                    0;
    background:                #0F67CC;
    cursor:                    pointer;
    border:                    none;
    padding:                   4px 10px 5px;
    text-decoration:           none;
    text-align:                center;
    display:                   inline-block;
    line-height:               1;
    -webkit-appearance:        none;
    border-radius:             5px;
    -moz-border-radius:        5px;
    -webkit-border-radius:     5px;
}

#form-contact .submit:hover {
    background:                #009CDE;
}



#form-contact .box_captcha {
	margin: 					0 auto;
	width: 						250px;
	height:						125px;
	padding: 					0 15px;
}

#form-contact .captcha_img {
	float:                     left;
	width:                     44px;
	height:                    125px;
}