html {height: 100%; overflow:auto;}

body {background: #F6F6F6; font-family: ProximaNova, Verdana, Arial, sans-serif; font-size: 17px; line-height: 24px; height: 100%; width: 100%; color:#000000; font-weight: 400; z-index:1; position: relative;}

h1, h2, h3, h4, h5, h6 {font-family: ProximaNova, Verdana, Arial, sans-serif; font-weight: 600; line-height: 1.2em;}

::selection {background: #0072BC; color:#FFF;}

a {text-decoration: none; color:#0072BC; transition: all .1s ease; border:none;}
a:hover {text-decoration: none; color:#000;}

/*CTA*/
.cta {display: inline-flex; font-size: 12px; line-height: 14px; padding: 17px 34px; background: #0072BC; color:#FFF; font-weight: bold; text-transform: uppercase; letter-spacing: .14em;   }
.cta i {display: block; line-height: 14px; font-size: 14px; width: 14px; text-align: center; margin: 0 17px 0 -17px;}
.cta:hover {background: #000; color:#FFF;}

/*TOP LINE*/
header .top_line {background: #0072BC; height: 50px; overflow: hidden;}

header .top_line .progrann_logo {display: inline-block; margin: 14px 0;}
header .top_line .progrann_logo img {height: 22px;}

header .top_line .lang {font-size: 14px; line-height: 22px; margin: 14px 0; display: flex; justify-content: space-between}
header .top_line .lang li {}
header .top_line .lang li a {color:#FFF;}

/*HEADER*/
header .header {background: #FFF; padding: 18px 0; border-bottom: solid 1px #EEE;}
header .header .logo {display: block;}
header .header .logo img {height: 88px;}

header .mobile_menu {display: none; color: #0072BC; font-size: 44px; line-height: 44px; height: 44px; margin: 22px 0 22px auto;}

/*MENU*/
header .header .menu {display: flex; font-size: 13px; line-height: 22px; justify-content: space-between; margin: 33px 0;}
header .header .menu li {}
header .header .menu li a {display: block; text-transform: uppercase; font-weight: 400; color:#000; position: relative}
header .header .menu li a:after {position: absolute; content: ""; display: block; bottom:-6px; lefT: 0; right:0; height: 2px; background: #0072BC; opacity: 0; transition: all .2s ease;}
header .header .menu li a.active {font-weight: 600;}
header .header .menu li a.active:after,
header .header .menu li a:hover:after {opacity: 1;}

/*CONTENT*/
main.content {padding: 56px 0 120px; position: relative; z-index: 1;}
main.content h1.main_title {font-weight: 800; font-size: 55px; line-height: 59px; margin: 0 0 55px;}
main.content:before {content: ""; position: absolute; top: 0; left: 0; right:0; height: 440px; background: #FFF url("../img/bg.png")  center center no-repeat; background-size: cover; z-index: -1; border-bottom: solid 1px #F4F4F4;}
main.content .content_wrapper {background: #FFF; padding: 32px;}

main.content .content_wrapper ul {margin: 24px 0; padding:0; list-style-type: none;}
main.content .content_wrapper ul li {margin: 6px 0; padding-left: 36px; position: relative}
main.content .content_wrapper ul li:before {content: ""; position: absolute; top: 12px; left:12px; height: 2px; width: 12px; background: #0072BC; border-radius: 1px;}

main.content .content_wrapper ol {margin: 24px 0; counter-reset: ol_counter;}
main.content .content_wrapper ol li {margin: 6px 0; padding-left: 36px; position: relative; counter-increment: ol_counter;}
main.content .content_wrapper ol li:before {display: block; content: counter(ol_counter); position: absolute; left: 0; top: 0; font-weight: 600; color:#0072BC; width: 36px; text-align: center;}



main.content.page_about_international_council .content_wrapper,
main.content.page_about_committee .content_wrapper,
main.content.page_news_best_practices .content_wrapper,
main.content.page_news .content_wrapper,
main.content.page_news_tsu .content_wrapper,
main.content.page_news_contest .content_wrapper,
main.content.page_mobility .content_wrapper,
main.content.page_about_projects .content_wrapper,
main.content.page_about_policies .content_wrapper,
main.content.page_mobility_contest .content_wrapper,
main.content.page_about_management_office .content_wrapper
{background: none; padding: 0;}

main.content.page_news:before,
main.content.page_news_tsu:before,
main.content.page_news_contest:before,
main.content.page_about_projects:before,
main.content.page_about_policies:before,
main.content.page_rating:before,
main.content.page_main:before,
main.content.page_news_best_practices:before {display: none;}

main.content .section_menu {font-size: 12px; line-height: 15px; text-transform: uppercase; background: #FFF; border:solid 1px #ECECEC; position: sticky; top: 24px;}
main.content .section_menu li {}
main.content .section_menu li a {display: block; color:#0072BC; padding: 20px 18px; font-weight: 600; letter-spacing: 0.12em;}
main.content .section_menu li a:hover {color:#000;}
main.content .section_menu li a.active {color:#FFF; background: #0072BC;}

main.content h2.main_title {line-height: 46px; margin: 20px 0 40px; display: flex}
main.content h2.main_title > span {font-size: 40px; font-weight: 800;}

main.content h2.main_title a {display: flex; margin: 3px 0 3px auto; color:#0072BC; box-shadow: 0 0 0 1px #0072BC; border-radius: 2px; padding: 0 24px; line-height: 40px; height: 40px; overflow: hidden;}
main.content h2.main_title a:hover {background: #0072BC; color:#FFF;}
main.content h2.main_title a span {display: block; font-size: 12px; text-transform: uppercase; letter-spacing: 0.2em; flex-shrink: 0; flex-grow: 0;}
main.content h2.main_title a i {display: block; font-size: 20px; line-height: 40px; width: 40px; flex-shrink: 1; flex-grow: 1; text-align: center; margin: 0 -12px 0 12px;}

/*FOOTER*/
footer .footer {background: #FFF; padding: 76px 0;}
footer .footer .top_line {}
footer .footer .top_line .logo {display: inline-block;}
footer .footer .top_line .logo img {height: 70px;}

footer .footer .horizontal_menu {display: flex; font-size: 14px; line-height: 22px; margin-top: 76px;}
footer .footer .horizontal_menu li {margin-right: 38px;}
footer .footer .horizontal_menu li a {color:#000; border-bottom:solid 1px #000;}
footer .footer .horizontal_menu li a:hover {border-color: transparent; color:#0072BC;}

/*COPYRIGHT*/
footer .copyright {height: 50px; overflow: hidden; background: #0072BC; color:#FFF;}

/*PAGE 404*/
.page404 {text-align: center; padding: 120px 0;}
.page404 h1 {color: #0072BC; font-size:224px; line-height: 224px;}
.page404 p {font-size: 16px; line-height: 23px; color:#000; margin: 24px 0 48px;}

/*TILE LAYOUT*/
.ml { -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-column-count: 1; -moz-column-count: 1; column-count: 1; -webkit-column-gap: 0; -moz-column-gap: 0; column-gap: 0;}
.ml * { -webkit-box-sizing: border-box; box-sizing: border-box;}
@media (min-width: 500px) { .ml { -webkit-column-count: 1; -moz-column-count: 1; column-count: 1;}}
@media (min-width: 1200px) { .ml { -webkit-column-count: 2; -moz-column-count: 2; column-count: 2;}}
.ml-pnl { margin: 0; padding: 5px;}
@media (min-width: 500px) { .ml-pnl { -webkit-column-break-inside: avoid; page-break-inside: avoid; break-inside: avoid;}}
.ml-pnl__cntnt {border-radius: 10px;overflow: hidden;padding: 15px;width: 100%;position: relative;padding-bottom: 68px;}
.ml-flp { -webkit-perspective: 1000; perspective: 1000;}
.ml-clstr { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; padding: 0;}
.ml-clstr--vrt { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column;}
@media (min-width: 500px) { .ml-clstr--vrt { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row;}}
.ml-clstr--hrz { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column;}
.ml-clstr__sgmnt { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; overflow: hidden; -webkit-box-flex: 1; -webkit-flex: 1 1 auto; -ms-flex: 1 1 auto; flex: 1 1 auto;}
.ml-clstr__sgmnt--rw { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column;}
@media (min-width: 500px) { .ml-clstr__sgmnt--rw { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row;}}
.ml-clstr__sgmnt--clmn { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column;}
@media (min-width: 500px) { .ml-clstr__sgmnt--hlf { -webkit-flex-basis: 50%; -ms-flex-preferred-size: 50%;		flex-basis: 50%;}}
.ml-clstr__sgmnt--qrt { -webkit-flex-basis: 25%; -ms-flex-preferred-size: 25%; flex-basis: 25%;}
.tx--white {text-decoration: underline; color: #000; text-transform: uppercase; font-family: 'Montserrat', sans-serif; text-align: center;}
.bg--blue {background-color: #FFFFFF;border: 3px solid #0072BC;}
.border-button {all: initial;  transition-duration: 0.2s; background: noun;  text-decoration: none;  display: inline-block;  padding: 8px 15px;color: black;  border: 3px solid rgba(0, 114, 188);  border-radius: 8px;  position: absolute;  bottom: 15px;right: 15px;font-size: 11pt;  font-family: 'Montserrat', sans-serif;text-transform: uppercase;}
.border-button:hover {background-color: #0072BC;color: white;cursor: pointer;}
.a_blank {target="_blank"}