@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');

@charset 'utf-8';
/*
 * name:top.css
 * author:sovanda nulo
*/

/* top
------------------------------------------------ */

.list-filter { display: block; position: relative; margin: -20px 0 35px; }
#news-filter-form { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; }
.list-filter--lists { margin: 0 15px; }
.list-filter--lists select { display: none; font-size: 16px; line-height: 1.5; padding: 0; padding-right: 13px; font-weight: bolder; height: 24px; width: 100%; border: none; color: #222; border-bottom: 1px solid #222222; background-position: right -9px center; outline: none; background-color: #fff; -webkit-appearance: none; appearance: none; }
.list-filter--lists select:focus { outline: none; box-shadow: none; }
.list-filter--lists button { font-size: 18px; width: 100px; height: 38px; border: 2px solid #222222; background: #fff; box-sizing: border-box; transition: linear .2s; outline: none; -webkit-appearance: none; appearance: none; }
.list-filter--team,
.list-filter--location { width: 240px; }
.list-filter--years { width: 70px; }
.list-filter--month { width: 40px; }

    @media only screen and (min-width: 767px) {
        .list-new { min-height: 500px }
        .list-news ul li > div.text { vertical-align: top; }
        .list-filter--lists button:hover { background: #222; color: #fff; }
    }

    @media only screen and (max-width: 767px) {
        .list-new { min-height: 400px }
        #news-filter-form { padding: 0 20px; margin-top: -10px; }
        .list-filter--lists { margin: 10px 10px 0; }
        .list-filter--lists button { font-size: 12px; width: 60px; height: 24px; }
        .list-filter--lists select { font-size: 12px; line-height: 1.6; height: 20px; }
        .list-filter--team,
        .list-filter--location { width: 118px; }
        .list-filter--years { width: 56px; }
        .list-filter--month { width: 40px; }
        .list-filter { margin: -5px 0 30px; }
        
    }

.custom-dropdown { position: relative; width: 100%; max-width: 320px; font-family: inherit; user-select: none; }
.custom-dropdown .selected { font-size: 16px; line-height: 1.5; letter-spacing: 0; padding: 0; padding-right: 13px; font-weight: bolder; height: 24px; width: 100%; border: none; color: #222; border-bottom: 1px solid #222222; outline: none; overflow: hidden; background-color: #fff; -webkit-appearance: none; appearance: none; cursor: pointer; background-repeat: no-repeat; background-image: url(../../img/common/icon-select-margin.svg); background-position: right -9px center; background-size: 32px 16px; box-sizing: border-box; }
.custom-dropdown .options { position: absolute; left: 0; right: 0; z-index: 999; margin-top: 5px; padding: 8px 22px; background: #E8E8E8; width: 100%; max-height: 450px; overflow-y: auto; display: none; }
.custom-dropdown.open .options { display: block; }
.custom-dropdown .option { font-size: 14px; padding: 8px 5px; border-radius: 0; cursor: pointer; white-space: nowrap; position: relative; }
.custom-dropdown .option:hover { background: #15126F; color: #fff; }
.custom-dropdown .option[aria-selected="true"]:before { content: ''; display: inline-block; width: 1em; height: .657em; position: absolute; right: 100%; top: .75em; background-image: url(../../img/common/icon-checkbox.svg); background-size: 100% 100%; background-position: center; }
.custom-dropdown + select[data-custom-hidden] { position: absolute !important; opacity: 0 !important; pointer-events: none !important; height: 0 !important; width: 0 !important; margin: 0 !important; padding: 0 !important; border: 0 !important; }

    @media only screen and (max-width: 767px) {
        .custom-dropdown .selected { font-size: 12px; line-height: 1.6; height: 20px; }
        .custom-dropdown .option { font-size: 12px; }
        .list-filter--team .custom-dropdown .options { width: 100%; }
        .list-filter--location .custom-dropdown .options { width: 180%; }
    }

#training { display: block; position: relative; padding-top: 80px; z-index: 20; }
.training--title { margin-bottom: 50px; }
.training--tabs { display: block; position: relative; background: #007F00; }
.training--tab { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; }
.training--tab li { font-size: 16px; font-weight: bold; line-height: 1.7; width: 36%; text-align: center; }
.training--tab li a { display: block; padding: .9em 0; color: #fff; text-decoration: none; }
.training--tab li.active a { color: #15126F; background: #ABCD00; }
.training--conts { display: block; overflow: hidden; position: relative; background: #ABCD00;  }
.training--cont { position: absolute; left: 0; top: 0; width: 100%; opacity: 0; padding: 40px 5px 60px; visibility: hidden; transition: linear .2s; box-sizing: border-box; }
.training--cont.active { position: relative; opacity: 1; visibility: initial; }

    @media only screen and (min-width: 768px) {
        .training--tab li:hover a { color: #15126F; background: #ABCD00; }
    }

    @media only screen and (max-width: 768px) {
        #training { padding-top: 65px; }
        .training--title { margin: 0 -10px; margin-bottom: 33px; }
        .training--tabs { margin: 0 -20px; }
        .training--tab li { width: 50%; }
        .training--cont { padding: 20px 20px 60px; }
    }

.training__lists { display: flex; flex-wrap: wrap; }
.training__list { font-size: 10px; width: calc( 20% - 4px ); margin-right: 5px; position: relative; display: block; position: relative; background: #eee; }
.training__list:nth-child(5n) { margin-right: 0; }
.training__list:nth-child(n+6) { margin-top: 5px; }
.training__list--head { font-size: 20px; font-weight: bold; line-height: 2; position: relative; display: flex; flex-wrap: wrap; background: #018ABC; color: #fff; }
.training__list--head h3 { font-size: 20px; font-weight: bold; line-height: 2; letter-spacing: 0; width: 50%; padding: 0 10px; text-align: center; box-sizing: border-box; }
.training__list--head span { font-weight: normal; line-height: 1; position: absolute; left: 50%; top: calc( 50% - 1px ); transform: translate(-50%,-50%); }
.training__list--desc { padding: 15px 20px 20px; display: block; position: relative; }
.training__list--date { font-size: 16px; font-weight: bold; letter-spacing: 0; line-height: 2; color: #15126F; }
.training__list--date span { font-size: 24px; font-weight: bold; letter-spacing: 0; line-height: 1.33; display: inline-block; }
.training__list--time { font-size: 19px; font-weight: bold; letter-spacing: 0; line-height: 1.368; min-height: 1.368em; margin: 0; color: #15126F; position: relative; }
.training__list--time span { display: block; position: relative; padding-left: 19px; word-break: break-all; }
.training__list--time span:before { content: ''; display: inline-block; position: absolute; left: 0; top: 5px; width: 16px; height: 16px; background-image: url(../../img/common/icon-clock.svg); background-repeat: no-repeat; background-size: 100% 100%; }
.training__list--maps { font-size: 14px; line-height: 1.428; letter-spacing: 0; margin-top: 5px; position: relative; padding-left: 19px; word-break: break-all; }
.training__list--maps:before { content: ''; display: inline-block; position: absolute; left: 0; top: 2px; width: 16px; height: 16px; background-image: url(../../img/common/icon-marker.svg); background-repeat: no-repeat; background-size: 100% 100%; }
.training__list--maps a,
.training__list--maps span { color: #222222; display: inline-block; text-decoration: none; }
.training__more { font-size: 16px; font-weight: bold; line-height: 1.7; max-width: 400px; display: block; padding: 10.5px 0; margin: 0 auto; margin-top: 40px; text-align: center; color: #15126F; background: #fff; border: 1px solid #15126F; transition: linear .2s; }
.training__more span { display: inline-block; position: relative; padding-right: 2.1875em; }
.training__more span:after,
.training__more span:before { content: ''; display: inline-block; width: 1em; height: 2px; position: absolute; right: 0; top: calc( 50% - 1px ); background: #15126F; border-radius: 1em; transition: linear .2s; }
.training__more span:after { transform: rotate(90deg); }
.training__list--result { font-size: 10px; position: absolute; width: 100%; left: 0; bottom: 0; display: flex; flex-wrap: wrap; padding: .9em 0; align-items: center; justify-content: center; background: #fff; }
.training__list--result p { font-family: "Alte-Haas-Grotesk-Regular"; font-size: 3.8em; line-height: 1.1; padding: 0 .3157em; position: relative; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; color: #15126F; margin: 0; }
.training__list--result p span { font-size: .5526em; margin: 0 .238em; display: inline-block; }
.training__list--result p:not(:last-child):after { content: ''; display: inline-block; width: 1px; height: .736em; position: absolute; right: 0; top: calc( 50% - calc( .736em / 2 ) ); background: #999; transform: rotate(25deg); }

    @media only screen and (min-width: 768px) and (max-width: 1920px) {
        .training__list--result,
        .training__list { font-size: .52vw; }
    }

    @media only screen and (min-width: 768px) and (max-width: 1600px)  {
        .training__list--desc { font-size: 1.2em; padding: 1.5em 2em 2em; }
        .training__list--head { font-size: 2.4em; }
        .training__list--head h3 { font-size: 1em; padding: 0 .5em; }
        .training__list--date { font-size: 1.6em; }
        .training__list--date span { font-size: 1.5em; }
        .training__list--time { font-size: 1.9em; }
        .training__list--time span { padding-left: 1em;  }
        .training__list--time span:before { top: .26em; width: .84em; height: .84em; }
        .training__list--maps { font-size: 1.4em; margin-top: .33em; padding-left: 1.51em; }
        .training__list--maps:before { top: .05em; width: 1.272em; height: 1.272em; }
    }

    @media only screen and (min-width: 768px) {
        .training__list:nth-child(n+11) { display: none; }

        .training__more:hover { background: #15126F; color: #fff; }
        .training__more:hover span:after,
        .training__more:hover span:before { background: #fff; }

        .training__lists--result { flex-direction: row-reverse; justify-content: flex-end; }
        .training__lists--result .training__list { padding-bottom: 6em; }
    }

    @media only screen and (max-width: 768px) {
        .training__lists { display: block; }
        .training__list { width: 100%; margin: 0; display: flex; flex-wrap: wrap; justify-content: space-between; }
        .training__list:nth-child(n+2) { margin-top: 5px; }
        .training__list:nth-child(n+6) { display: none; }
        .training__list--head { position: absolute; left: 0; top: 0; width: 100px; height: 100%; flex-direction: column; justify-content: center; align-items: center; }
        .training__list--head h3 { font-size: 18px; width: 100%; padding: 0; }
        .training__list--head span { font-size: 17px; position: relative; width: 100%; top: auto; display: block; left: auto; transform: none; text-align: center; }
        .training__list--desc { width: calc( 100% - 100px ); min-height: 102px; margin-left: auto; padding: 15px 15px 10px; box-sizing: border-box; }
        .training__list--date { font-size: 13px; }
        .training__list--date span { font-size: 19px; }
        .training__list--time { font-size: 16px; }
        .training__list--time span:before { top: 4px; }
        .training__list--maps { font-size: 12px; margin-top: 10px; }
        .training__list--maps:before { top: 1px; }
        .training__more { margin-top: 30px; }
        .training__list--result { width: calc( 100% - 100px ); left: 100px; }
        .training__list--result p { font-size: 2.2em; }

            .training__lists--result { flex-direction: column-reverse; }
            .training__lists--result .training__list--desc { padding-bottom: 52px; }
            .training__lists--result .training__list--desc.no-result { padding-bottom: 10px; }
    }