/* font-family: "HeliosCondRegular"; */
@font-face {
    font-family: "HeliosCondRegular";
    src: url("/bitrix/templates/union_new/css/modal-auth-form/fonts/HeliosCondRegular/HeliosCondRegular.ttf");
    font-style: normal;
    font-weight: normal;
}

.fixed-overlay {position:relative;}

.modal-window-container  {
    width: 446px;
    min-height: 200px;
    border-radius: 4px;
  	background-color: rgb(255, 255, 255);
  	box-shadow: 0px 0px 37.2px 2.8px rgba(0, 0, 0, 0.3);
    background: #fff;
    /* margin: 0 auto; */
    position: fixed;
    display: none;
    opacity: 0;
    z-index: 999;
    padding: 10px 30px; 
    -webkit-box-shadow: 1px -2px 67px 5px rgba(128,124,128,1);
    -moz-box-shadow: 1px -2px 67px 5px rgba(128,124,128,1);
    padding-bottom:30px;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

/* Пoдлoжкa */
#overlay {
  z-index:101; /* пoдлoжкa дoлжнa быть выше слoев элементoв сaйтa, нo ниже слoя мoдaльнoгo oкнa */
  position:fixed; /* всегдa перекрывaет весь сaйт */
  background-color: rgb(165, 165, 165);
  opacity: 0.8;
  -moz-opacity:0.8; /* фикс прозрачности для старых браузеров */
  filter:alpha(opacity=80);
  width:100%; 
  height:100%; /* рaзмерoм вo весь экрaн */
  top:0; /* сверху и слевa 0, oбязaтельные свoйствa! */
  left:0;
  cursor:pointer;
  display:none; /* в oбычнoм сoстoянии её нет) */
}


#modal_form.modal-window-container {
    width: 446px;
    min-height: 570px;
    border-radius: 4px;
  	background-color: rgb(255, 255, 255);
  	box-shadow: 0px 0px 37.2px 2.8px rgba(0, 0, 0, 0.3);
    background: #fff;
    /* margin: 0 auto; */
    position: fixed;
    /*margin-top: -330px;*/
    display: none;
    opacity: 0;
    z-index: 999;
    /* padding: 20px 10px; */
    -webkit-box-shadow: 1px -2px 67px 5px rgba(128,124,128,1);
    -moz-box-shadow: 1px -2px 67px 5px rgba(128,124,128,1);
    padding: 0 0 30px 10px;
    left: 50%;
    top: 1%;
    transform: translate(-50%, 1%);
}



/* Кнoпкa зaкрыть для тех ктo в тaнке) */
#modal_close  {
  width: 30px;
  height: 30px;
  position: absolute;
  top: 23px;
  right: 23px;
  cursor: pointer;
  display: block;
  background: url(/bitrix/js/main/core/images/popup/popup-window-close-icon.png) no-repeat;
}
#modal_close:hover{
  opacity: 0.6;
}
.close {
  background-color: rgb(35, 119, 189);
  position: absolute;
  left: 836px;
  top: 82px;
  width: 28px;
  height: 27px;
  z-index: 102;
}


/*табы*/

#modal_form .tabs__caption{margin-left:80px; list-style:none; overflow:hidden; padding-left:0; margin-bottom:0;}

#modal_form .tabs__caption li {float:left; margin-right:30px; cursor:pointer}
#modal_form .tabs__caption li.active { border-bottom:2px dashed rgb(70, 111, 174);}

#modal_form .tabs__content {
  display: none; /* по умолчанию прячем все блоки */
}
#modal_form .tabs__content.active {
  display: block; /* по умолчанию показываем нужный блок */
}


#modal_form .log-in, #modal_form .sign-up, .modal-window-container .heading{
  margin-top: 20px;
  margin-bottom:10px;
    /*Text*/
  font-size: 24px;
  font-family: HeliosCondRegular;
  color: rgb(70, 111, 174);
  line-height: 0.916;
  text-align: left;
}

#modal_form .button_hover {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 1347px;
  height: 624px;
  z-index: 135;
}

#modal_form .button {
  display:inline-block;
  padding: 0 25px;
  height: 41px;
    /*Margin, Border & Padding*/
  border:none; 
  margin-left: 80px;
    /*Text*/
  color:#E5FFFF; 
  font-size: 14px;
  font-family: "Arial";
  text-align:center; 
  text-decoration:none; 
    /*Other*/
  border-radius: 4px; 
  -moz-border-radius:4px;
  -webkit-border-radius:4px;
  cursor: pointer;  
  background:#2773c4; 
  } 

#modal_notice .button {
  display:inline-block;
  padding: 0 25px;
  height: 41px;
  line-height: 41px;
    /*Margin, Border & Padding*/
  border:none; 
    /*Text*/
  color:#E5FFFF; 
  text-align:center; 
  text-decoration:none; 
    /*Other*/
  border-radius: 4px; 
  -moz-border-radius:4px;
  -webkit-border-radius:4px;
  cursor: pointer;  
  background:#2773c4; 
}

#modal_form .button:hover, #modal_notice .button:hover { 
 background-color: rgb(40, 96, 144);
}
#modal_form .social{
  margin-left:77px;
  height:80px;
}
#modal_form .social-text{
font-size: 14px;
    font-family: "Arial";
    color: rgb(136, 136, 136);
   margin-top: 14px;
    /* color: grey; */
	
}
#modal_form .social-img{
  height:35px;
  width: 35px;
  float:left;
  margin-right: 10px;
}
#modal_form .forgot-register{
  /*margin-top:35px;*/
  border-top: 1px #c8cbce solid;
  position: absolute;
  width: 100%;
  bottom: 0;
}
#modal_form .forgot-register-text{
  float:left;
margin-left: 71px;  
  margin-top: 20px;
  cursor: pointer;
  font-size: 14px;
  font-family: "Arial";
  color: rgb( 51, 122, 183 );
}
#modal_form .forgot-register-text:hover{
  
  color: rgb(51, 122, 183);
  text-decoration: underline;

}

}
#modal_form .two_element{
  margin-left: 67px;
}
#modal_form input[type="checkbox"] {
    display:none;
}
#modal_form input[type="checkbox"] + label:before {
    display: inline-block;
    height: 16px;
    width: 16px;
	position:absolute;
	left:0;
	top:1px;
    background: url(../images/checkbox.png) no-repeat;
    background-size: 16px;
    content: "";
    cursor: pointer;
}
#modal_form input[type="checkbox"]:checked + label:before {
    /*Other*/
    background-position: 0 -16px;
}

#modal_form .checkbox-text{

    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-family: "Arial";
    color: rgb(136, 136, 136);
    position:relative; 
	font-weight:normal !important;
	padding-left:25px;
	margin-top:20px;
}

#modal_form .container, #modal_form .bx-authform-label-container{
	width: auto;
	margin: 0;
	padding: 0;
	height: 30px;
}

#modal_form .field-text{
  /*margin-left: 100px;
  margin-top: 80px;*/
  margin-left: 80px;
  padding-top:7px;
  /*padding-left: 10px;*/
  font-size: 14px;
  font-family: "Arial";
  color: rgb( 136, 136, 136 );
}
#modal_form input[type="text"], #modal_form input[type="password"] {
        width: 274px;
    height: 28px;
    border-style: solid;
	border-width: 1px;
	border-color: rgb(204, 213, 219);
	background-color: rgb(248, 250, 252);

    margin-left: 80px;
    font-size: 20px;
  	padding-left: 10px;
  	padding-right: 10px;
    font-family: Arial, Helvetica, sans-serif;
 /*   background: radial-gradient(circle at 50% 33%, #ffffff, #f2f2f2);*/
    cursor: pointer;
}



#modal_form .errortext{
    margin-left: 80px;
	margin-top:0px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	color:red;
}

#modal_form .error{border:1px red solid !important;}
.bx-captcha {margin-left:80px; float:left; max-width:150px; padding-top:2px;}
.bx-captcha img {margin-top:-2px;}

#modal_form .bx-authform-input-container {position:relative;}
#modal_form .errormsg {
	position: absolute;
    vertical-align: middle;
    display: inline-block;
    left: 80px;
    top: 0;
    padding: 10px;
    height: 40px;
    width: 275px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    color: red;
}

input[type="submit"]:disabled {
	background-color: #9aa6b8 !important;
}

/*Tooltip*/

.user-agreement-container {display:inline-block;}

.agree {margin-left: 7px;}
 
.agreement:before {
 content:attr(data-description);
 box-sizing:border-box;
 display:none;
 background:rgba(255,255,255,.95);
 color: rgb(136, 136, 136);
 padding:20px;
 position:absolute;
 left:-145px;
 top:35px;
 box-shadow:0px 0px 5px rgba(0,0,0,.4);
 width:340px;
 height:auto;
 z-index:999999;
 line-height:25px;
 border-radius:5px;
 opacity:0;
 transition:.25s ease-in-out;
}

.user-agreement-register .agreement:before {
	top:-285px;
	left:-195px;
}
 

.agreement:hover:before {
 display:block;
 opacity:1;
}
 
.agreement:hover:after {
 opacity:1;
 top:15px;
}

.bx-authform-checkbox-container {
	margin-left:80px;
}
	



@media (min-width: 320px) and (max-width:483px) {
	.modal-window-container {
		width: 316px;
		height: 700px;
	 
	 
		background: #fff;
		/* margin: 0 auto; */
		position: absolute;
		top: 20%;
		bottom: 310px;
		left: 37%;
		display: none;
		opacity: 0;
		z-index: 102;
		/* padding: 20px 10px; */
		-webkit-box-shadow: 1px -2px 67px 5px rgba(128,124,128,1);
		-moz-box-shadow: 1px -2px 67px 5px rgba(128,124,128,1);
		box-shadow: 1px -2px 67px 5px rgba(128,124,128,1);
	
	}
	#modal_form .checkbox-text{
	  margin-left: 25px;
	}
	#modal_form .log-in {
		margin-top: 40px;
			margin-left: 22px;
		font-size: 28px;
	   
		color: rgb(51,122,183);
	}
	#modal_form .field-text {
		 margin-left: 22px;
	   
	}
	#modal_form input[type="text"], #modal_form input[type="password"]  {
	width: 245px;
		margin-left: 22px;
	  
	}
	#modal_form .forgot-register-text {
		float: left;
		   margin-left: 22px;
	 
	}
	#modal_form input[type="checkbox"] + label:before {
		display: inline-block;
		height: 19px;
		width: 19px;
		/*margin: -3px 40px;*/
	  
		/* text-align: left; */
		background: url(../images/checkbox.png) no-repeat;
		background-size: 19px;
		content: "";
		cursor: pointer;
	}
	#modal_form .button {
	 
		  margin-left: 22px;
	}
	#modal_form .social {
		margin-left: 22px;
		height: 80px;
	} 
	
	.bx-captcha {margin-left:20px;}

}