/* === Удаляем автофокус webkit === */
*:focus { outline: none; }
.contact_form { width:100%; }

/* === Ширина формы === */
.contact_form p { margin:7px 10px 7px 10px; padding:0px; }

/* === Размер и расположение блоков === */
.contact_form input, .contact_form textarea, .contact_form button { width: 100%; font-family: 'PT Sans Narrow', sans-serif; font-size: 1em;  }
.contact_form input, .contact_form textarea { border: 1px solid #000; border-radius: 10px; padding-left: 15px; }

/* Цвета и эффекты */
.contact_form input, .contact_form textarea { border:1px solid #aaa; padding-right: 30px; -moz-transition: padding .25s; -webkit-transition: padding .25s; -o-transition: padding .25s; transition: padding .25s; }
.contact_form input:focus, .contact_form textarea:focus { background: #fff; border: 1px solid #555; box-shadow: 0 0 3px #aaa; padding-right: 70px; }

/* === HTML5  === */	
.contact_form input:required, .contact_form textarea:required { background: #fff no-repeat 98% center; }
.contact_form input:required:valid, .contact_form textarea:required:valid { background: #fff no-repeat 98% center; box-shadow: 0 0 5px #5cd053; border-color: #28921f; }
.contact_form input:focus:invalid, .contact_form textarea:focus:invalid { background: #fff no-repeat 98% center; box-shadow: 0 0 5px #d45252;	border-color: #b03535 }

/* === Стили подсказок === */
.form_hint { background: #d45252;	border-radius: 5px; color: white; margin-left: 8px; padding: 0 10px;	z-index: 999; position: absolute; display: none; }
.form_hint::before { content: "\25C0";	color:#d45252;	position: absolute;	top:1px; left:-6px; }
.contact_form input:focus + .form_hint { display: inline; }
.contact_form input:required:valid + .form_hint { background: #28921f; }
.contact_form input:required:valid + .form_hint::before { color:#28921f; }

small { font-family: 'PT Sans Narrow', sans-serif;  margin: 0; display: block; text-align: center; }
.fon small { color: #eee; }

/* === Всплывающее окно === */
#zapis, #zapis h3 { border-radius: 10px; }
.fancybox__content { padding: 15px!important; }
#zapis .contact_form button { margin: 0!important; }

@media (max-width: 767px) {
	#zapis { min-width: 340px; }
	.contact_form input, .contact_form textarea { font-size: 16px; line-height: 36px;  }
}
@media (min-width: 768px) {
	#zapis { min-width: 340px; }
	.contact_form input, .contact_form textarea { font-size: 20px; line-height: 46px;  }
}