/*-----RESET_CSS--------------------------*/

/* Reset and base styles  */
* {
	padding: 0px;
	margin: 0px;
	border: none;
}



html {
	box-sizing: border-box;
}
*,*::before,*::after {
	box-sizing: inherit;
}


a:hover  {

	text-decoration: none;
}



aside, nav, footer, header, section, main {
	display: block;
}

h1, h2, h3, h4, h5, h6, p {
	font-size: inherit;
	font-weight: inherit;
}


address {
  font-style: normal;
}



input, textarea, button, select {
	font-family: inherit;
	font-size: inherit;
	color: inherit;
	background-color: transparent;
}


button, input[type="submit"] {
	display: inline-block;
	box-shadow: none;
	background-color: transparent;
	background: none;
	cursor: pointer;
}

input:focus, input:active,
button:focus, button:active {
	outline: none;
}


label {
	cursor: pointer;
}

legend {
	display: block;
}

/*--------------------END RESET CSS--------------------------------*/




/*--------------FONT Manrope----------------*/

/* manrope-regular - cyrillic_latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/manrope-v13-cyrillic_latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+ */
	   url('fonts/manrope-v13-cyrillic_latin-regular.woff') format('woff'); /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* manrope-500 - cyrillic_latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 500;
  src: url('fonts/manrope-v13-cyrillic_latin-500.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+ */
	   url('fonts/manrope-v13-cyrillic_latin-500.woff') format('woff'); /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* manrope-600 - cyrillic_latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 600;
  src: url('fonts/manrope-v13-cyrillic_latin-600.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+ */
	   url('fonts/manrope-v13-cyrillic_latin-600.woff') format('woff'); /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* manrope-700 - cyrillic_latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 700;
  src: url('fonts/manrope-v13-cyrillic_latin-700.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+ */
	   url('fonts/manrope-v13-cyrillic_latin-700.woff') format('woff'); /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* manrope-800 - cyrillic_latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 800;
  src: url('fonts/manrope-v13-cyrillic_latin-800.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+ */
	   url('fonts/manrope-v13-cyrillic_latin-800.woff') format('woff'); /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/*----------  END FONT Manrope-------------*/

body {
	font-family: 'Manrope';
	font-style: normal;
	
}


/*-----------Header----------------*/

.header{
/*background:url('img/001.jpg') no-repeat center;*/
background:url('/img/pict_header.jpg') no-repeat center;
background-size: cover;
text-align:center;
color:white;
height:319px;
padding-top:30px;
}


.logo {
	font-size:30px;
	margin-bottom:20px;
	color:inherit;
	width:20%;
	height:100px;
	margin-right:auto;
	margin-left:auto;
}

.link_logo {
	color:white;
	text-decoration:none;
}

.caption_text {
	font-size:38px;
	font-weight:800;
	line-height:45px;
	margin-bottom:22px;
}

.caption_subtext {
	font-size:20px;
	font-weight:400;
	line-height:40px;
}


/*-----------------------------------------*/


.main_container {
width:1180px;
margin:0 auto; 
}


/*----------Блок кнопок-----------------*/

.main_menu_item {
display: inline-block;
font-size: 16px;
font-weight:600;
line-height:24px;
color: #4873A6;
border: 1px solid #4873A6;
border-radius: 5px;
width:200px;
height:50px;
padding-top:12px;
padding-bottom:14px;
text-align:center;
cursor:pointer;
margin-right:20px;
}


.main_menu_item_active {
background-color:#4873A6;
color:#FFFFFF;
font-weight:700;
}

.main_menu_item:hover {
background-color:#4873A6;
color:white;
border-color:black;
}



/*-----------Выбор банка----------------------*/


.choose_bank_caption {
	display: inline-block;
	font-size:16px;
	line-height:24px;
	font-weight:400;
	color:#222222;
	margin-right:21px;
	height:50px;
	padding-top:12px;
	padding-bottom:14px;
}


.selected_bank {
	display: inline-block;
	width:330px;
	height:50px;
	border: 1px solid #D9D9D9;
	border-radius: 5px;
	padding-left:12px;
	padding-top:12px;
	padding-bottom:14px;
	position:relative;
	cursor: pointer;
}

.choose_bank_value {
	font-size:16px;
	line-height:24px;
	font-weight:400;
	margin-left:5px;
	color:#575757;
}

.daw {
	position:absolute;
	top:21px;
	right:15px;
}


.head_interface {
	display:flex;
	flex-wrap:wrap;
	align-items:flex-end;
	justify-content:space-between;
	margin-top:50px;
}


.bank-select-window {
width:331px;
position: absolute;
top:49px;
left:-0.5px;
background-color:white;
border:1px solid #D9D9D9;
border-radius:5px;
padding-top:10px;
padding-bottom:30px;

z-index:1000;
}




.bank-select-list {
list-style: none;	
margin-left:15px;
}

.bank-select-list li {
cursor: pointer;
font-size: 15px;
font-weight: 400;
line-height:39px;
width:90%;
}

.bank-select-list li:hover {
/*background-color:#f2fbdd;
box-shadow: 2px 2px 2px #2f80ec;*/
background-color:#ebf9cb;
}


.choose-logo {
width: 28px;
height: 29px;
display:inline-block;
vertical-align:middle;
margin-right:8px;
}

.bank-select-list.choose_all {
margin-left:40px;
width:80%;
}

.major {
font-size:16px;
line-height:41px;
}

/*------------------------------------------------------*/



/*------Список имеющихся банков----------------*/

.available_banks_block {
	background-color:#F7F7F7;	
	margin-top:28px;
	padding-top:43px;
	padding-bottom:63px;
}


.available_banks_caption {
font-size:30px;
font-weight:800;
line-height:45px;
color:#222222;
text-align:center;
margin-bottom:19px;
}


.div_banks {
	white-space:nowrap;
}

.div_bank1 {
	margin-bottom:10px;
}


.available_banks_list {
	list-style:none;
	text-align:center;
}

.available_banks_list li {
display:inline-block;
vertical-align:bottom;
width:157px;
height:140px;
text-align:center;
background-color:white;
margin-right:12px;
font-size:15px;
font-weight:400;
line-height:21px;
color:#222222;
border: 1px solid #D9D9D9;
border-radius: 5px;


margin-top:7px;
margin-bottom:7px;
padding:20px;
}



.available_banks_list li.rmrg0 {
	margin-right:0;
}


.ava-logo {
	max-width:100px;
	max-height:59px;
	margin-bottom: 8px;
}

/*.ava-logo-alfa {
	width:51px;
	height:52px;
	margin:26px 52px 13px 54px;
}

.ava-logo-vtb {
	width:70px;
	height:46px;
	margin:30px 78px 15px 33px;
}

.ava-logo-gazprom {
	width:49px;
	height:48px;
	margin:28px 55px 15px 53px;
}

.ava-logo-evropabank {
	width:46px;
	height:46px;
	margin:27px 55px 9px 56px;
}

.ava-logo-mts {
	width:49px;
	height:46px;
	margin:27px 54px 18px 54px;
}

.ava-logo-otkritie {
	width:77px;
	height:70px;
	margin:18px 50px 2px 42px;
}

.ava-logo-renessans {
	width:66px;
	height:59px;
	margin:21px 47px 2px 44px;
}

.ava-logo-rosbank {
	width:78px;
	height:59px;
	margin:24px 41px 8px 38px;
}

.ava-logo-sber {
	width:50px;
	height:51px;
	margin:27px 55px 13px 52px;
}

.ava-logo-sovkombank {
	width:47px;
	height:48px;
	margin:27px 57px 16px 53px;
}

.ava-logo-tinkoff {
	width:55px;
	height:49px;
	margin:24px 48px 18px 54px;
}

.ava-logo-ubrir {
	width:58px;
	height:47px;
	margin:31px 51px 13px 48px;
}

.ava-logo-uralsib {
	width:69px;
	height:54px;
	margin:24px 44px 13px 44px;
}

.ava-logo-forabank {
	width:88px;
	height:54px;
	margin:25px 33px 12px 36px;
}*/


.available_banks_list li.active {
	background: linear-gradient(to bottom right, #ffd607, #ffad00);
	border-color: #FF9800; 
	box-shadow: 0 0 5px rgba(0,0,0,0.3); 
}




/*----------Конец блока списка имеющихся банков------------------------------*/


.caption {
	padding-top:29px;
	text-align:center;
	font-size:30px;
	font-weight:800;
	line-height:40px;
	color:#222222;
	margin-bottom:31px;
}







/*---------------Карточный блок--------------------------*/



.card_block {	
width:370px;
height:605px;
background: #FFFFFF;
border: 1px solid #D9D9D9;
border-radius: 5px;
display: inline-block;
padding-top:30px;
padding-bottom:20px;
vertical-align: bottom;
margin-right:30px;
margin-bottom:30px;
}


.card_header {
margin-bottom:12px;
}

.img_greed {
width:270px;
height:170px;
cursor:pointer;
display:block;
margin-right:auto;
margin-left:auto;
margin-bottom:16px;
border-radius:18px;
}

.img_greed_logo {
	height:50px;
	/*width:48px;
	display:inline-block;
	vertical-align:middle;
	
	margin-right:12px;*/
	margin-left:22px;
}


.width65 {
	width:65px;
}


.card_tittle {
display:inline-block;
font-size:18px;
font-weight:700;
line-height:24px;
vertical-align:middle;
flex: 1 1 auto;
}

.card_tittle_img {
	display:flex;
align-items:center;
justify-content:center;
gap: 7px;
}

.card_line {
	width:325px;
	height:1px;
	background-color:#E1E1E1;
	margin-left:auto;
	margin-right:auto;
}


.card_block.rmrg0 {
	margin-right:0;
}



.inline {
display: inline-block;
}

.vertikal_align {
vertical-align: middle;
}

.vertikal_align_top {
vertical-align: top;
}









/*.greed {
padding-left:2%;
padding-right:2%;
padding-bottom:20px;
margin-left:auto;
margin-right:auto;
border-radius:10px;
}*/


.greed {
background-color:##F5F5F5;
}




.advantages_items {
height:225px;
list-style:none;
margin-top:15px;
font-size: 15px;
font-weight:400;
line-height:21px;
color:#222222;
padding-left:24px;
padding-right:24px;
overflow-y: auto;
}

.advantages_items li {
margin-top:9px;
display: flex;
align-items: top;
}


.advantages_items li:before {
content:url('icons/check.svg');
margin-right:7px;
}


.order_button {
	width: 326px;
	height:50px;
	background-color:#4873A6;
	text-align:center;
	margin-left: auto;
	margin-right: auto;
	border-radius: 5px;
	cursor:pointer;
	margin-top:19px;
	font-size:15px;
	font-weight:700;
	line-height:24px;
	color:#FFFFFF;
	/*display: flex;
	align-items: center;
	justify-content: center;
	padding-top:12px;*/
}

.order_button:hover {
background-color:#406794;
}


.of_site_caption {
	opacity:0;
	transition: opacity 0.7s linear;
	text-align:center;
	color:#222222;
	margin-left: auto;
	margin-right: auto;
	margin-top:15px;
	
}

.order_button:hover +.of_site_caption {
opacity:1;
transition: opacity 0.7s linear;
}


/*.img_greed:hover .of_site_caption{
opacity:1;
transition: opacity 0.7s linear;
}*/



.order_button::before{
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  content: "";
}

.order_caption {
	display: inline-block;
	vertical-align:middle;
}




.align_center {
	text-align:center;
}

.empty_li {
	list-style:none;
}

.display_none {
	display: none;
}



/*---------------Карты не представлены------------------*/





.absent_cards {
	margin-top:30px;
	width:1180px;
	height:100px;
	background-color:#F6F6F6;
	border-radius:10px;
	margin-left:auto;
	margin-right:auto;
}

.absent_cards::before{
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  content: "";
}

.absent_img {
	display:inline-block;
	vertical-align:middle;
	margin-right:15px;
}

.caption_absent {
	font-size: 16px;
	font-weight: 400;
	line-height:24px;
	color: #4873A6;
	display:inline-block;
	vertical-align:middle;
}





/*-----------------------------------------*/



.footer {
	
	background-color:#333333;
	padding-bottom:23px;
	position:relative;
	color:#FFFFFF;
	margin-top:50px;
}

.footer-container {
position:relative;
padding-top:40px;
padding-left:30px;
}

.footer-logo {
	position:absolute;
	top:30px;
	left:30px;
	text-align:center;
	font-size:20px;
}

.footer-logo-icon {
  font-size:25px;
}


.footer_line {
	height:1px;
	background-color:#6C6C6C;
	margin-top:36px;
	margin-bottom:31px;
	width:96%;
}


.footer-caption {
 font-size:20px;
 line-height:21px;
 font-weight:400;
text-align:center;
}

.notes {
font-size:14px;
line-height:20px;
font-weight:400;
}

.notes p{
	margin-bottom:20px;
}

.note3 {
	width:96%;
}

.ok_icon, .vk_icon, .email_icon {
	position:absolute;
}

.email_icon {
	height:29px;
	right:200px;
	bottom:13px;
}

.ok_icon {
	height:26px;
	right:120px;
	bottom:15px;
}

.vk_icon {
	height:35px;
	right:155px;
	bottom:10px;
}

.vk_icon:hover {
	height:40px;
}

.ok_icon:hover {
	height:31px;
}

.email_icon:hover {
	height:32px;
}

.up {
	position:fixed;
	right:50px;
	bottom:1px;
	opacity:0.7;
}

.up img{
	height:50px;
}

.optional {
cursor:pointer;
/*margin-bottom:20px;*/
max-width: max-content;
}

.optional p {
	display:inline-block;
}

.optional i{
	display:inline-block;
	vertical-align:middle;
	margin-left:10px;
	color:#F2F2F2;
	font-size:10px;
}

.optional i:hover{
	color:grey;
}


.optional_menu {
	margin-top:10px;
	line-height:24px;
	vertical-align:middle;
}

/*.consumer_loans_gazprom_block div, .consumer_loans_alfa_block div, .mortgage_otkritie_block div, .mortgage_alfa_block div, .mortgage_gazprom_block div, .mortgage_bgf_block div, .deposits_alfa_block div*/ .product_common_block div, .optional_menu div, .consumer_loans div, .mortgage div, .insurance div, .investment div, .deposit div, .refinancing div {
cursor:pointer;
max-width: max-content;
border-bottom: 1px solid #333333;
}


/*.consumer_loans_alfa_block div:hover, .consumer_loans_gazprom_block div:hover, .mortgage_otkritie_block div:hover, .mortgage_alfa_block div:hover, .mortgage_gazprom_block div:hover, .mortgage_bgf_block div:hover, .deposits_alfa_block div:hover*/.product_common_block div:hover, .optional_menu div:hover, .consumer_loans div:hover, .mortgage div:hover, .insurance div:hover, .investment div:hover, .deposit div:hover, .refinancing div:hover {
border-bottom: 1px solid #F2F2F2;
}


.border_bottom {
border-bottom: 1px solid #F2F2F2 !important;
}

/*.consumer_loans_gazprom_block, .consumer_loans_alfa_block, .mortgage_otkritie_block, .mortgage_alfa_block, .mortgage_gazprom_block, .mortgage_bgf_block, .deposits_alfa_block*/.product_common_block, .consumer_loans, .mortgage,  .insurance, .investment, .deposit, .refinancing {
	vertical-align:middle;
	font-size:14px;
	line-height:24px;
	margin-left:20px;
}


/*.consumer_loans_gazprom>p, .consumer_loans_alfa>p, .mortgage_otkritie>p, .mortgage_alfa>p, .mortgage_gazprom>p, .mortgage_bgf>p, .deposits_alfa>p */.product_common>p, .optional_menu>div>p, .consumer_loans_item>p, .mortgage_item>p, .insurance_item>p, .investment_item>p, .deposits_item>p, .refinancing_item>p {
	display:inline-block;
	vertical-align:middle;
}

/*.consumer_loans_gazprom>i, .consumer_loans_alfa>i, .mortgage_otkritie>i, .mortgage_alfa>i, .mortgage_gazprom>i, .mortgage_bgf>i, .deposits_alfa>i,*/.product_common>i, .optional_menu>div>i, .consumer_loans_item>i, .mortgage_item>i,  .insurance_item>i, .investment_item>i, .deposits_item>i,  .refinancing_item>i {
	display:inline-block;
	vertical-align:middle;
	margin-left:3px;
	color:grey
}

.clrwhite {
	color:#F2F2F2 !important;
}