
/* SETUP */

h1 {margin: 0px;}
h2 {margin: 0px;}
h3 {margin: 0px;}
h4 {margin: 0px;}

/* END OF SETUP */

/* UNIVERSAL */

.backbluedark { background: #003274; }
.bluedark { color: #003274; }
.backbluemedium { background: #025EA1; }
.bluemedium { color: #025EA1; }
.backbluelight { background: #6CACE4; }
.bluelight { color: #6CACE4; }
.backyellow { background: #FCC30B; }
.yellow { color: #FCC30B; }
.backred { background: #FF3A21; }
.red { color: #FF3A21; }
.backgreyblue { background: #E9F3FB; }
.bluegrey { color: #E9F3FB; }
.blue1 { color: #509DD5; }

.h1 {
    font-family: Atom700;
    font-size: 48px;
    line-height: 100%;
    text-transform: uppercase;
}

.h2 {
    font-family: Atom700;
    font-size: 32px;
    line-height: 42px;
    text-transform: uppercase;
}

.h3 {
    font-family: Atom700;
    font-size: 24px;
    line-height: 31px;
    text-transform: uppercase;
}

.h4 {
    font-family: Atom400;
    font-size: 18px;
    line-height: 23px;
}

.t36 {
    font-family: Atom700;
    font-size: 24px;
    line-height: 31px;
}

.t20a {
    font-family: Atom700;
    font-size: 20px;
    line-height: 110%;
}

.t18 {
    font-family:  Atom400;
    font-size: 18px;
    line-height: 140%;
}

.t16 {
    font-family: Atom400;
    font-size: 16px;
    line-height: 140%;
}

.t14 {
    font-family: Atom400;
    font-size: 14px;
    line-height: 130%;
}

.t13 {
    font-family: Atom400;
    font-size: 13px;
    line-height: 130%;
}


.f0_8 { flex: 0.8; }
.f1 { flex: 1; }
.f1_2 {flex: 1.2; }

.col {
    display: flex;
    flex: 1;
    flex-direction: column;
}

.row {
    display: flex;
    flex: 1;
    flex-direction: row;
}

.rowmcol, .rowtcol {
    display: flex;
    flex: 1;
    flex-direction: row;
}

.compbutton {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 11px 30px 13px;
    gap: 10px;
    background: #FFFFFF;
    border-radius: 30px;

    font-family: Atom700;
    font-size: 20px;
    line-height: 26px;
    color: #6CACE4;

    border: 0px;

    width: 240px;

    cursor: pointer;
}

.compbuttoninvcol {
    color: #FFFFFF;
    background-color: #6CACE4;
}

.redbutton_22 {
    max-width: 340px;
    width: 100%;
    height: 50px;
    background: #FF3A21;
    border-radius: 30px;


    font-family: Atom700;
    font-size: 20px;
    line-height: 26px;

    /* identical to box height */
    text-align: center;

    /* White */
    color: #FFFFFF;

    border: 0px;

    cursor: pointer;
}

.center {
    align-items: center;
    justify-content: center;
    text-align: center;
}

.centercol {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.centerrow {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.centerrowmcol {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.padside16 {
    padding-left: 16px;
    padding-right: 16px;
}

.nowrap {
    white-space: nowrap;
}


.jc-fs {
    justify-content: flex-start;
}

.jc-sb {
    justify-content: space-between;
}

.ai-fs {
    align-items: flex-start;
}

.ai-fe {
    align-items: flex-end;
}

.ai-center {
    align-items: center;
}

.desknone_mobflex { display: none; }
.desknone_mobblock { display: none; }
.deskblock_mobnone { display: block; }
.desktoponlyblock { display: block; }
.mobileandtabblock { display: none; }

.mb5 { margin-bottom: 5px; } .mb10 { margin-bottom: 10px; } .mb15 { margin-bottom: 15px; } .mb20 { margin-bottom: 20px; } .mb25 { margin-bottom: 25px; } .mb30 { margin-bottom: 30px; } .mb35 { margin-bottom: 35px; } .mb40 { margin-bottom: 40px; } .mb45 { margin-bottom: 45px; } .mb50 { margin-bottom: 50px; } .mb55 { margin-bottom: 55px; } .mb60 { margin-bottom: 60px; } .mb65 { margin-bottom: 65px; } .mb70 { margin-bottom: 70px; } .mb75 { margin-bottom: 75px; } .mb80 { margin-bottom: 80px; } .mb85 { margin-bottom: 85px; } .mb90 { margin-bottom: 90px; } .mb95 { margin-bottom: 95px; } .mb100 { margin-bottom: 100px; } .mb105 { margin-bottom: 105px; } .mb110 { margin-bottom: 110px; } .mb115 { margin-bottom: 115px; } .mb120 { margin-bottom: 120px; } .mb130 { margin-bottom: 130px; } .mb150 { margin-bottom: 150px; } .mb155 { margin-bottom: 155px; } .mb170 { margin-bottom: 170px; } .mb185 { margin-bottom: 185px; }  .mb210 { margin-bottom: 210px; }  .mb215 { margin-bottom: 215px; }  .mb225 { margin-bottom: 225px; }
.mr5 { margin-right: 5px; } .mr10 { margin-right: 10px; } .mr15 { margin-right: 15px; } .mr20 { margin-right: 20px; } .mr25 { margin-right: 25px; } .mr30 { margin-right: 30px; } .mr35 { margin-right: 35px; } .mr40 { margin-right: 40px; } .mr45 { margin-right: 45px; } .mr50 { margin-right: 50px; } .mr55 { margin-right: 55px; } .mr60 { margin-right: 60px; } .mr65 { margin-right: 65px; } .mr70 { margin-right: 70px; } .mr75 { margin-right: 75px; } .mr80 { margin-right: 80px; } .mr85 { margin-right: 85px; } .mr90 { margin-right: 90px; } .mr95 { margin-right: 95px; } .mr100 { margin-right: 100px; } .mr105 { margin-right: 105px; } .mr110 { margin-right: 110px; } .mr115 { margin-right: 115px; } .mr120 { margin-right: 120px; } .mr155 { margin-right: 155px; } .mr170 { margin-right: 170px; } .mr185 { margin-right: 185px; }  .mr210 { margin-right: 210px; }  .mr215 { margin-right: 215px; }  .mr225 { margin-right: 225px; }

.flex_wrap {
    flex-wrap: wrap;
}

.s-smaller-frame {
	max-width: 1168px; /* 1200px - 32px */
	margin-left: auto;
	margin-right: auto;
}

@media (max-width: 1232px) {
    .s-smaller-frame {
        margin-left: 16px;
        margin-right: 16px;
    }
}

/* END OF UNIVERSAL */

#s1 {
    width: 100%;
    height: 100vh;
}

.s1-1 {
    position: absolute;
    top: unset;
    bottom: 45px;
    z-index: 1000;
    left: 2.375%;
    width: 320px;
}


#s2_22 {
    background-color: #025EA1;
    background-image: url('./imgs/main-texture.jpg');
    background-size: contain;
    background-repeat: repeat;
    height: unset;
    padding: 100px 100px 150px 100px;
    padding: 100px 0px 150px 0px;
}

#s2_1_2 {
    max-width: 600px;
}

.ledishki {
    width: 100vw;
}

.srow {
 display: flex;
 margin-top: 25px;
 margin-bottom: 25px;
}

.ssubrow {
    display: flex;
}

.infobox {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-left: 20px;
    margin-right: 20px;
}

.infobox > div:first-child {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    background-color: #003274;
    transform: translateY(40px);
}

.infobox > div:nth-child(2) {
    border: 2px solid #6CACE4;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    text-align: center;

    padding-top: 55px;

    width: 270px;
    height: 160px;
    box-sizing: border-box;
}

#sr1_22 {
    padding-top: 180px;
}

#sr1_22_ibs .infobox > div:nth-child(2) {
    height: 204px;
    padding-top: 75px;
}

#sr1_22_ibs .infobox:first-child > div:nth-child(2) {
    padding-top: 55px;
}

.infobox > div:nth-child(2) > div {
    margin-bottom: 10px;
}

.infobox > div:nth-child(2) div:nth-child(1) {
    font-family: Atom700;
    font-size: 20px;
    line-height: 110%;
    color: #FFFFFF;
}

.infobox > div:nth-child(2) div:nth-child(2) {
    font-family: Atom400;
    font-size: 16px;
    line-height: 140%;
    color: #FFFFFF;
    max-width: 200px;
}

.infobox > div:nth-child(2) div:nth-child(3) {
    font-family: Atom400;
    font-size: 12px;
    line-height: 130%;
    text-align: center;
    color: #FFFFFF;
    max-width: 200px;
}

#hochesh {
    background-image: url('./imgs/hochesh_d.png');
    background-size: contain;
    background-size: cover;
    background-repeat: no-repeat;
    height: 39vw;
}

#etapi {
    display: flex;
    flex-direction: row;
    align-items: start;
    padding-left: 100px;
    padding-right: 100px;
}

.etap {
    font-family: Atom400;
    font-size: 20px;
    line-height: 26px;
    font-size: 18px;
    line-height: 23px;
    color: #FFFFFF;
    text-align: center;

    max-width: 280px;
    /* width: 17vw; */

    display: flex;
    flex-direction: column;
    align-items: center;

    flex: 1;
}

.etap > img {
    width: 150px;
    height: 150px;
}

.etap > span {
    margin-top: 30px;
    width: 280px;
}


.etaparrow {
    width: 126px;
    height: 40px;
    width: 7.87vw;
    height: 2.5vw;
    margin: 40px -50px 0px -50px;

    flex: 1;
}

.etaparrowflip {
    width: 126px;
    height: 40px;
    width: 7.87vw;
    height: 2.5vw;
    margin: 60px -50px 0px -50px;
    transform: scaleY(-1);

    flex: 1;
}

#ic-lamp {
    width: 110px;
    height: 160px;
    margin-left: 40px;
    margin-right: 40px;
    flex: 1;
}

#s3_22 {
    background-image: url(./imgs/s3d.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    width: 100vw;
    height: 40vw;
    margin-bottom: 150px;
}

#s3content {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    width: 260px;
    width: 15vw;
    transform: translateY(-0%);
}


#s3_title0 {
    width: 94px;
    height: 89px;
    width: 5.87vw;
    height: 5.56vw;

    position: absolute;
    top: calc(-6.06vw - 5.56vw);
    /* top: calc(-100px - 5.56vw);
    top: -100px; */
}

#s3_title1 {
    font-family: Atom700;
    font-size: 32px;
    line-height: 42px;
    font-size: 2vw;
    line-height: 2.62vw;
    text-transform: uppercase;
    color: #025EA1;

    position: absolute;
    top: calc(-2.81vw - 2.62vw);
    /* top: calc(-45px - 2.62vw);
    top: -45px; */
}

#s3_title2 {
    font-family: Atom400;
    font-size: 18px;
    font-size: 1.12vw;
    line-height: 140%;
    text-align: center;
    color: #025EA1;

	white-space: nowrap;

    position: absolute;

    /* высота сторки + растояние от кнопки, только в минус */
    top: calc(-1.25vw - 1.4 * 1.12vw);
    /* top: -20px;
    top: 0px; */
}

#s3content button {
    font-size: 1.25vw;
    line-height: 1.62vw;

    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    background: #6CACE4;
    color: #FFFFFF;
}

#s4_22 {
    background: #FFFFFF;
    padding-bottom: 150px;
    /* display: none; */
}

#s4_22 > h1:first-child {
    margin-top: 0px;
    margin-bottom: 67px;
}

.tracks {
    align-items: flex-start;
    flex-wrap: wrap;
    justify-content: space-between;
    /* justify-content: center; */
}

@media (max-width: 1024px) {
.tracks {
    justify-content: center;
}
}

.track > span {
    padding-left: 16px;
    padding-right: 16px;
}

.track {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.track h4 {
    margin-top: 20px;
    margin-bottom: 18px;
}

.track > img:first-child {
    margin-left: 45px;
    margin-right: 45px;
    margin-left: 15px;
    margin-right: 15px;
    width: 340px;
    height: 240px;
    margin-bottom: 30px;
}

.track > h3 {
    margin-bottom: 10px;
}

.track > span {
    max-width: 340px;
}

.trackdetails {
    box-sizing: border-box;
    width: 100%;
    max-width: 340px;
}

.trackdetails > div:nth-child(1), .trackdetails > div:nth-child(2) {
    box-sizing: border-box;
    width: 100%;
    margin: 1px 0px;
}

.trackdetails > div:nth-child(1) {
    padding-bottom: 20px;
}

.trackdetails > div:nth-child(2) {
    padding: 0px 30px 30px 30px;
}

.trackthemescont {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
    width: 100%;
}

.trackthemescont > div > img {
    margin-bottom: 5px;
}

.membersbox {
    box-sizing: border-box;
    padding-left: 16px;
    padding-right: 16px;
    padding-top: 10px;
    padding-bottom: 10px;
    margin-top: 10px;

    border: 1px solid #6CACE4;
    border-radius: 30px;
}

.membersbox div {
    box-sizing: border-box;
    background: #E9F3FB;
    border-radius: 20px;
    padding: 5px 15px;
    margin-right: 30px;
}


.membersbox img {
    width: 30px;
    height: 30px;
    margin-right: 15px;
}

.membersbox span {
    text-align: left;
}

#s5_22 {
    background-image: url('./imgs/main-texture.jpg');
    background-color: #025EA1;
    background-repeat: repeat;
    background-size: contain;
    padding-bottom: 100px;
    overflow: clip;
}

#s5_22 > img:first-child {
    position: relative;
    top: -1px;
    left: -4px;
}

.s5_22_1 {
    border: 2px solid #6CACE4;
    margin: 100px;
}

.s5_22_1_1 {
    padding-top: 80px;
    padding-right: 20px;
    padding-bottom: 60px;
    max-width: 525px;
}

#podarki-oblako {
    background-image: url(./imgs/kontur-oblaka-d.svg);
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;

    width: 480px;
    height: 370px;

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}

#podarki-oblako > span {
    margin-top: 10px;
    margin-left: 15px;
    margin-right: 15px;
}

#podarki-oblako > span:nth-child(2) {
    max-width: 340px;
}



@media (min-width: 1024px) {
    #podarki-oblako  {
        margin: 100px auto -260px;
    }

    #podarki-list {
        position: relative;
        height: 666px;
        align-items: flex-start;
        justify-content: space-evenly;
    }

    #podarki-list .podarki-item:nth-child(2) {
        position: relative;
        top: 290px;
    }
}

#icebreakerimg {
    margin-top: -200px;
    margin-bottom: -200px;
    margin-left: -100px;
    width: 667px;
    width: 41.68vw;
}

.lineseparator {
    height: 0px;
    border: 1px solid #6CACE4;
}

#sr1_22 {
    background-color: #025EA1;
    /* padding: 100px 200px; */
}

#sr1_22_btimgs {
    background-color: #025EA1;
}

/* #sr1_22 > button:first-child {
    margin-top: 100px;
} */

#sr2_22 {
    background-color: #003274;
    padding-top: 60px;
    padding-bottom: 100px;
    /* padding: 60px 200px 100px 200px;
    padding: 60px 12.5vw 100px 12.5vw; */
}

#sr2_numberinfos {
    display: flex;
    align-items: flex-start;
    justify-content: center;
}

.numberinfo {
    display: flex;
    flex-direction: column;

    padding-right: 10px;
}

.numberinfo > span:first-child {
    font-family: Atom700;
    font-size: 96px;
    line-height: 100%;
    text-align: center;
    text-transform: uppercase;
}

.numberinfo > span:last-child {
    width: 200px;
    font-family: Atom400;
    font-size: 16px;
    line-height: 140%;
    text-align: center;
    color: #FFFFFF;
}

#vazhno-cont {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;

    margin-top: 100px;
}

#vazhno {
    background-image: url(./imgs/vazhno.svg);
    width: 310px;
    height: 328px;

    display: flex;
    align-items: center;

    font-family: Atom700;
    font-size: 96px;
    line-height: 100%;

    text-transform: uppercase;
    color: #FFFFFF;

    margin-right: 310px;
}

@media (min-width: 1024px) {
#vazhno > div {
    transform: translateX(90px);
}
}

#sr3_22 {
    background-color: #025EA1;
    padding: 100px 0px;
}


#sr3_3themes {
    margin-right: 130px;
}

#sr3_3themes_descr {

}

@media (min-width: 1024px) {
    .sr_title {
        box-sizing: border-box;
        width: 490px;
        min-width: 490px;
        height: 84px;
        margin: 0px;
        margin-right: 130px;
    }
}


.tracks_table_desk {
    margin-top: 100px;
    margin-bottom: 100px;
}

table, th, td {
    border-collapse: collapse;
    border: 2px solid #6CACE4;
    text-align: center;
    vertical-align: middle;
}

table {
    box-sizing: border-box;
    /* width: 1200px; */
}

table img {
    display: inline;
}

.tracks_table_desk tr {
    height: 100px;
}
/*
td > * {
    margin: auto;
} */

.tracks_table_desk td {
    padding-left: 40px;
    padding-right: 20px;
}

.tracks_table_desk td img {
    margin: 15px;
    max-width: 70px;
    max-height: 70px;
}

.tracks_table_desk tr > td:first-child {
    min-width: 140px;
}

.tabletitle {
    font-family: Atom700;
    font-size: 20px;
    line-height: 22px;
    text-transform: uppercase;
}

.intdwithimg {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
}

.tabletitle img {
    float: left;
}

@media (min-width: 1024px) {

#sr3_22_descr {
    margin-bottom: 150px;
}

.dmr50 {
    margin-right: 50px;
}

.dmr130 {
    margin-right: 130px;
}

#sr3_22_descr > div:first-child > div {
    /* width: 570px; */
}

#sr3_22_descr > div:first-child > div:first-child {
    margin-bottom: 20px;
}

}

#sr4_22 {
    background-color: #025EA1;
    padding: 0px 12.0px 150px 12.5vw;
    padding: 0px 0px 150px 0px;
}

#sr4_22 > div:first-child {
    align-items: flex-start;
    justify-content: flex-start;
}

@media (min-width: 1024px) {

#sr4_22 h2 {
    width: 490px;
    max-width: 490px;
}

}

#sr4_22_rules_details {
    border: 2px solid #6CACE4;
    padding: 6.25vw;
}

#sr4_22_rules_details > div {
    max-width: 600px;
}

#sr5_22 {
    background-color: #025EA1;
    padding: 0px 12.5vw 150px 12.5vw;
    padding: 0px 0px 150px 0px;
}


#se1 {
    padding: 180px 0px 0px 0px;
    background-color: #025EA1;
}

#se1 > div:first-child {
    padding-left: 12.5vw;
    padding-right: 12.5vw;
}

@media (min-width: 1024px) {
    #se1 .sr_title {
        width: 425px;
        min-width: 425px;
        margin-right: 0;
    }
}

#se1_1 {
    background-color: #025EA1;
    background-image: url(./imgs/2-ill-1-min.png);
    background-repeat: no-repeat;
    background-size: cover;
    width: 100vw;
    height: 48.43vw;

    padding-top: 180px;
}

#se1_1 > div {
    margin-left: auto;
    margin-right: auto;
    width: 465px;
}

#se2 {
    padding-top: 10px;
    margin: 0px;
}

#se2 > div:first-child {
    margin-left: auto;
    margin-right: auto;
    width: 465px;
}

#se2 video {
    width: 100%;
    margin: auto;
}

#se_2_3_rec {
    background-color: #025EA1;
}

#se_2_3_rec > img:first-child {
    margin-top: -2px;
    margin-left: -3px;
}

#se3 {
    background-color: #025EA1;
    /* padding: 0px 12.5vw; */
    padding-top: 150px;
    padding-bottom: 150px;
}

.se3-1 {
    overflow: hidden;
    padding-top: 30px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-left: 40%;
    /* padding-left: 150px; */
  }

.se3_1 {
    padding-left: 12.5vw;
    padding-right: 12.5vw;
}

.se3-1-1-1 {
	position: absolute;
	display: flex;
	flex-direction: row;
	left: calc(30% - 160px);
}

.se3-1-1-1 div:first-child, .se3-1-1-2 div:first-child {
	margin-right: 20px;
}

.se3-1-1-2 {
    display: none;
}

.se3-1-0 {
    max-width: 516px;
}

#icebreakerimg_e {
    background-image: url(./imgs/icebreacker-hover.svg);
    background-size: contain;
    background-repeat: no-repeat;
    width: 56.56vw;
    height: 61.68vw;
    margin-right: 60px;
}

#se3 aside {
    padding: 20px 40px;
}

#about_capitans {
}

#about_capitans > h1 {
    margin-bottom: 100px;
}

#about_capitans > div {
    margin-bottom: 150px;
}

.captimg-cont {
    width: 29.37vw;
    height: 22.5vw;
    margin-left: 4vw;
    margin-right: 4vw;

    max-width: 470px;
    max-height: 360px;
    margin-left: 50px;
    margin-right: 50px;
}

#seawaybox {
    background-color: #025EA1;
    border: 2px solid #6CACE4;

    padding-left: 100px;
    padding-right: 100px;
    padding-top: 150px;
    padding-bottom: 130px;

    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.mw580 {
    max-width: 580px;
}

.icethickness {
    width: 26.25vw;
    height: 10vw;
}

#seawaybox > img {
    width: 60.62vw;
    height: 32.62vw;

    margin-top: 70px;

    align-self: center;
}

#aflot {
    margin: 100px auto;
}

#aflot > div:first-child {
    max-width: 520px;
}

#aflot > img {
    width: 38.75vw;
    height: 27.06vw;
}

.circle-bullets {
    padding: 0px 0px 0px 16px;
}

.circle-bullets li {
    position: relative;
    font-size: 16px;
    line-height: 140%;
    margin: 8px 0px;
    font-family: Atom400;
    list-style-type: none;
}

.circle-bullets li::before {
    content: '';
    border: 1px solid #6CACE4;
    border-radius: 50%;
    width: 4px;
    height: 4px;
    position: absolute;
    left: -15px;
    top: 9px;
}
