/*
Copyright © 2020 EPAM Systems, Inc. All Rights Reserved. All information contained herein is, and remains the
property of EPAM Systems, Inc. and/or its suppliers and is protected by international intellectual
property law. Dissemination of this information or reproduction of this material is strictly forbidden,
unless prior written permission is obtained from EPAM Systems, Inc
*/

@font-face{
	font-family:roboto;
	src:url(/css/assets/fonts/Roboto-Medium.eot);
	src:url(/css/assets/fonts/Roboto-Medium.eot?#iefix) format("embedded-opentype"),url(/css/assets/fonts/Roboto-Medium.woff2) format("woff2"),url(/css/assets/fonts/Roboto-Medium.woff) format("woff"),url(/css/assets/fonts/Roboto-Medium.ttf) format("truetype");
	font-weight:500;
	font-style:normal
}

@font-face{
	font-family:roboto;
	src:url(/css/assets/fonts/Roboto-Bold.eot);
	src:url(/css/assets/fonts/Roboto-Bold.eot?#iefix) format("embedded-opentype"),url(/css/assets/fonts/Roboto-Bold.woff2) format("woff2"),url(/css/assets/fonts/Roboto-Bold.woff) format("woff"),url(/css/assets/fonts/Roboto-Bold.ttf) format("truetype");
	font-weight:700;
	font-style:normal
}

@font-face{
	font-family:roboto;
	src:url(/css/assets/fonts/Roboto-Regular.eot);
	src:url(/css/assets/fonts/Roboto-Regular.eot?#iefix) format("embedded-opentype"),url(/css/assets/fonts/Roboto-Regular.woff2) format("woff2"),url(/css/assets/fonts/Roboto-Regular.woff) format("woff"),url(/css/assets/fonts/Roboto-Regular.ttf) format("truetype");
	font-weight:400;
	font-style:normal
}

:root{
	--blue_light:#7b7b8a;
	--blue:#3D70B2;
	--gradient_blue_first:#5596e6;
	--gradient_blue_second:#3D70B2;
	--white:#fff;
	--grey:#8C9BA5;
	--grey_dark:#48545D;
	--grey_light:#DFE3E6;
	--grey_back:#E4E6E8;
	--red_light:#FFD2DD;
	--red:#EB3B4E
}

*{
	margin:0;
	padding:0;
	box-sizing:border-box
}

html{
	height:100%;
	font:400 12px/12px roboto,Courier,Monaco,monospace
}

.main{
	display:flex;
	height:100%
}

.section__header{
	font-size:1.83rem;
	font-weight:700;
	line-height:2.08rem
}

.section__footer{
	color:var(--grey_dark);
	font-size:10px
}

.section__form{
	z-index:1;
	display:flex;
	justify-content:center;
	width:35%;
	box-shadow:10px 0 20px 0 rgba(0,0,0,.1);
	padding: 0 40px
}

.section__wrapper{
	display:flex;
	flex-direction:column;
	justify-content:space-between;
	max-width:347px;
	padding:18% 0 6% 0
}

.form{
	display:flex;
	flex-direction:column;
	font-size:1.17rem;
	line-height:1.5rem
}

.error__text{
	color:var(--red);
	font-size:0.83rem;
	line-height:1rem
}

.error{
	background:var(--red_light);
	padding:10px 18px;
	margin-top:16px
}

.form__input+.form__label{
	margin-top:16px
}

.form__label{
	font-weight:500
}

.form__input{
	margin-top:8px;
	padding:10px 16px;
	border:1px solid var(--grey_light)
}

.form__input_error{
	border-bottom:1px solid var(--red)
}

.form__button{
	margin-top:32px;
	padding:12px 42px;
	color:var(--white);
	line-height:.83rem;
	background:linear-gradient(180deg,var(--gradient_blue_first),var(--gradient_blue_second));
	border:1px solid var(--blue);
	border-radius:2px
}

.clinic-logo{
	display:flex;
	align-items:center;
	padding:10px 0;

}

.clinic-logo__image{
	width:100%;
}

.section__header+.clinic-logo{
	margin-top:36px
}

.clinic-logo+.form{
	margin-top:32px
}

.section__promo{
	display:flex;
	flex-direction:column;
	align-items:center;
	width:65%;
	background:var(--grey_back) url(/css/assets/images/background.svg);
	background-repeat:no-repeat;
	background-position-x:center;
	background-position-y:top
}

.wrapper{
	padding-top:5%;
	max-width:700px
}

.info{
	display:flex;
	flex-direction:column;
	padding-left:30px;
	color:var(--white)
}

.info__title{
	color:var(--white);
	font-size:3rem;
	font-weight:700;
	line-height:3.5rem
}

.info__title+.info__description{
	margin-top:10px
}

.info__description{
	margin:0;
	font-size:1.17rem;
	line-height:1.42rem
}

.promo__image{
	width:100%
}

@media only screen and (max-width:980px){
	.section__promo{
		display:none
	}

	.section__wrapper{
		justify-content:space-between;
		width:347px;
		padding:8% 0 4% 0
	}

	.section__form{
		display:flex;
		justify-content:center;
		width:100%;
	}


}

@media only screen and (min-width:1440px) and (max-width:1599px){
	.promo__image{
		width:760px
	}


}

@media only screen and (min-width:1600px){
	.promo__image{
		width:800px
	}


}