#videobanner{
     position: relative;
 }
 #videobanner .covervid-wrapper{
     width: 100%;
     height: 100%;
     overflow: hidden;
     position: relative;
     -moz-background-size: cover;
       -o-background-size: cover;
          background-size: cover;
     background-position: center center;
     background-repeat: no-repeat;
     max-height: 100svh;
}
 #videobanner .covervid-wrapper video{
     width: 100svw;
     height: auto;
     float: left;
}
 #videobanner .description{
     position: absolute;
     left: 0;
     bottom: 2.5rem;
     max-width: 55svw;
}
 #videobanner .description .text{
     background-color: rgba(22,22,22,0.2);
     padding: 2rem 2rem 2rem 9rem;
     margin-bottom: 2rem;
}
 #videobanner .description h1, #videobanner .description h6, #videobanner .description h5, #videobanner .description h4, #videobanner .description h3, #videobanner .description h2, #videobanner .description p{
     color: #ffffff;
}
 #videobanner .description h1{
     font-size: 4rem;
     line-height: 4rem;
     margin-bottom: 1rem;
}
 #videobanner .description h6, #videobanner .description h5, #videobanner .description h4, #videobanner .description h3, #videobanner .description h2{
     font-size: 2rem;
     line-height: 2.2rem;
}
 #videobanner .description p{
     font-size: 1.071rem;
}
 #videobanner .description .butns{
     -webkit-box-pack: end;
     -webkit-justify-content: end;
        -moz-box-pack: end;
         -ms-flex-pack: end;
             justify-content: end;
     -webkit-box-align: center;
     -webkit-align-items: center;
        -moz-box-align: center;
         -ms-flex-align: center;
                 -ms-grid-row-align: center;
             align-items: center;
     padding-left: 7rem;
}
 #videobanner .description .butns a{
     padding: 1.2rem 5rem;
     margin-left: 2rem;
}
 #videobanner .description .butns a:hover{
     -webkit-box-shadow: 0 0 30px rgba(9,54,245,0.2);
     -moz-box-shadow: 0 0 30px rgba(9,54,245,0.2);
     -ms-box-shadow: 0 0 30px rgba(9,54,245,0.2);
     -o-box-shadow: 0 0 30px rgba(9,54,245,0.2);
     box-shadow: 0 0 30px rgba(9,54,245,0.2);
     background: #0936F5;
     background: -moz-linear-gradient(45deg,#0936F5 0%,#2984BD 100%);
     background: -webkit-gradient(linear,left bottom,right top,color-stop(0%,#0936F5),color-stop(100%,#2984BD));
     background: -webkit-linear-gradient(45deg,#0936F5 0%,#2984BD 100%);
     background: -o-linear-gradient(45deg,#0936F5 0%,#2984BD 100%);
     background: linear-gradient(45deg,#0936F5 0%,#2984BD 100%);
}
 #videobanner .next {
     position: absolute;
     bottom: -3rem;
     left: 0;
     right: 0;
     margin: auto;
     background-color: #ffffff;
     width: 6rem;
     -webkit-border-radius: 100%;
        -moz-border-radius: 100%;
             border-radius: 100%;
     padding: 1rem;
     height: 6rem;
     text-align: center;
}
 #videobanner .next svg{
     width: 1.5rem;
}
 #videobanner .next:hover{
     -webkit-box-shadow: 0 0 30px rgba(9,54,245,0.5);
     -moz-box-shadow: 0 0 30px rgba(9,54,245,0.5);
     -ms-box-shadow: 0 0 30px rgba(9,54,245,0.5);
     -o-box-shadow: 0 0 30px rgba(9,54,245,0.5);
     box-shadow: 0 0 30px rgba(9,54,245,0.5);
     background: -webkit-linear-gradient(45deg,#2984BD 0%,#0936F5 100%);
     background: -moz-linear-gradient(45deg,#2984BD 0%,#0936F5 100%);
     background: -o-linear-gradient(45deg,#2984BD 0%,#0936F5 100%);
     background: linear-gradient(45deg,#2984BD 0%,#0936F5 100%);
     width: 8rem;
     height: 8rem;
     bottom: -4.5rem;
     -webkit-transition: all .3s ease;
     -o-transition: all .3s ease;
     -moz-transition: all .3s ease;
     transition: all .3s ease;
}
 #videobanner .next:hover svg{
     width: 2rem;
}
 #videobanner .next:hover svg path{
     fill: #ffffff;
}
 #main1{
     -webkit-box-pack: end;
     -webkit-justify-content: end;
        -moz-box-pack: end;
         -ms-flex-pack: end;
             justify-content: end;
     background-position: top center;
     background-repeat: no-repeat;
     -moz-background-size: cover;
     -o-background-size: cover;
     background-size: cover;
}
 #main1 h2 {
     font-size: 3.097rem;
     line-height: 3.3rem;
     color: #ffffff;
     background-color: #000;
     padding: 1.806rem 3.097rem;
     margin: 0;
     width: 110%;
     margin-left: -10%;
}
 #main1 .text{
     width: 45%;
     background-color: #161616;
     margin-bottom: 85svh;
}
 #main1 .text .editor{
     padding: 2.323rem 3.097rem;
}
 #main1 .text p{
     color: #ffffff;
}
 #main3, #main4{
     background-color: #F3F3F3;
}
 #main2 .image, #main3 .image, #main4 .image{
     width: 45%;
     min-height: 50svh;
     background-position: 100% 50%;
     background-repeat: no-repeat;
     -moz-background-size: cover;
       -o-background-size: cover;
          background-size: cover;
     position: relative;
     overflow: hidden;
}
 #main2 .image{
     -webkit-animation-duration: 1s;
        -moz-animation-duration: 1s;
          -o-animation-duration: 1s;
             animation-duration: 1s;
}
 #main3 .image{
     -webkit-animation-duration: 1.5s;
        -moz-animation-duration: 1.5s;
          -o-animation-duration: 1.5s;
             animation-duration: 1.5s;
}
 #main4 .image{
     -webkit-animation-duration: 2s;
        -moz-animation-duration: 2s;
          -o-animation-duration: 2s;
             animation-duration: 2s;
}
 #main2 .image svg, #main3 .image svg, #main4 .image svg{
     position: absolute;
     top: -1px;
     right: -1px;
     bottom: -1px;
     width: auto;
     height: -webkit-calc(100% + 2px);
     height: -moz-calc(100% + 2px);
     height: calc(100% + 2px);
}
#main2 .image svg{
left: -1px;
right: unset;
transform: rotate(180deg);
}
 #main2 .image svg path{
     fill: #ffffff;
}
 #main3 .image svg path, #main4 .image svg path{
     fill: #F3F3F3;
}
 #main2 .text, #main3 .text{
     width: 55%;
     padding: 8.323rem 3.097rem;
     -webkit-align-content: center;
         -ms-flex-line-pack: center;
             align-content: center;
}
 #main4 .text{
     width: 50%;
     padding: 4.323rem 3.097rem;
     -webkit-align-content: center;
         -ms-flex-line-pack: center;
             align-content: center;
}
 #main2 .text h2, #main3 .text h2, #main4 .text h2, #world .info h3{
     font-size:2.323rem;
     line-height:2.523rem;
}
 #videocarousel{
     -webkit-box-align: center;
     -webkit-align-items: center;
        -moz-box-align: center;
         -ms-flex-align: center;
                 -ms-grid-row-align: center;
             align-items: center;
     position: relative;
    /* background-color: #F3F3F3;
     */
}
 #videocarousel .videocarousel{
     width: 50%;
     padding: 4.323rem 3.097rem 4.323rem 1.097rem;
     position: relative;
}
 #videocarousel:before {
     background-color: #F3F3F3;
     -webkit-border-radius: 100%;
        -moz-border-radius: 100%;
             border-radius: 100%;
     content: '';
     aspect-ratio: 9/9;
     position: absolute;
     width: 100svw;
     height: 100svw;
     top: 0;
     right: -33.33svw;
     bottom: 0;
     margin: auto;
     z-index: -2;
     opacity: .5;
     -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
}
 #videocarousel .videocarousel:before {
     background-color: #F3F3F3;
     -webkit-border-radius: 100%;
        -moz-border-radius: 100%;
             border-radius: 100%;
     content: '';
     aspect-ratio: 9/9;
     position: absolute;
     width: 80svw;
     height: 80svw;
     top: 0;
     right: -30svw;
     bottom: 0;
     margin: auto;
     z-index: -2;
}
 #videocarousel .videocarousel:after {
     background-color: #0936F4;
     -webkit-border-radius: 100%;
        -moz-border-radius: 100%;
             border-radius: 100%;
     content: '';
     aspect-ratio: 9/9;
     position: absolute;
     width: 27svw;
     height: 27svw;
     top: -10svw;
     right: 7svw;
     bottom: 0;
     margin: auto;
     z-index: -1;
}
 #videocarousel .text{
     width: 50%;
     padding: 4.323rem 3.097rem;
}
 #videocarousel .swiper-slide{
     width: 80%;
     padding: 3rem 0;
     background-color: #000;
}
 #videocarousel .swiper-slide div{
     aspect-ratio: 16/9;
     display: block;
     background-position: center;
     background-repeat: no-repeat;
     -moz-background-size: cover;
       -o-background-size: cover;
          background-size: cover;
     /* max-width: 30.968rem; */
     cursor: pointer;
     width: 100%;
}
 #videocarousel .swiper-slide div span {
     width: auto;
     -webkit-border-radius: 100%;
     -moz-border-radius: 100%;
     border-radius: 100%;
     background: -webkit-linear-gradient(45deg,#2984BD 0%,#0936F5 100%);
     background: -moz-linear-gradient(45deg,#2984BD 0%,#0936F5 100%);
     background: -o-linear-gradient(45deg,#2984BD 0%,#0936F5 100%);
     background: linear-gradient(45deg,#2984BD 0%,#0936F5 100%);
     display: -webkit-inline-box;
     display: -webkit-inline-flex;
     display: -moz-inline-box;
     display: -ms-inline-flexbox;
     display: inline-flex;
     -webkit-box-align: center;
     -webkit-align-items: center;
     -moz-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     -webkit-box-pack: center;
     -webkit-justify-content: center;
     -moz-box-pack: center;
     -ms-flex-pack: center;
     justify-content: center;
     padding: .4rem;
     vertical-align: middle;
     position: absolute;
     top:0;
     right: 0;
     bottom: 0;
     left: 0;
     margin: auto;
     width: 3rem;
     height: 3rem;
     z-index: 12;
}
 #videocarousel .swiper-slide div span svg {
     float: left;
     width: 1.5rem;
     height: 1.5rem;
     z-index: 2;
     position: relative;
}
 #videocarousel .swiper-slide div span svg path{
     fill: #ffffff;
}
 #videocarousel .swiper-slide div i{
     content: '';
     position: absolute;
     top: 50%;
     left: 50%;
     -webkit-transform: translate(-50%, -50%);
        -moz-transform: translate(-50%, -50%);
         -ms-transform: translate(-50%, -50%);
          -o-transform: translate(-50%, -50%);
             transform: translate(-50%, -50%);
     width: 10rem;
     height: 10rem;
     background-color: rgba(255,255,255,0.13);
     -webkit-border-radius: 100%;
        -moz-border-radius: 100%;
             border-radius: 100%;
     z-index: 10;
     opacity: 0;
     -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
     pointer-events: none;
     -webkit-transition: opacity 1s ease, width 1s ease, height 1s ease;
     -o-transition: opacity 1s ease, width 1s ease, height 1s ease;
     -moz-transition: opacity 1s ease, width 1s ease, height 1s ease;
     transition: opacity 1s ease, width 1s ease, height 1s ease;
}
 #videocarousel .swiper-slide div i:before{
     content: '';
     position: absolute;
     top: 50%;
     left: 50%;
     -webkit-transform: translate(-50%, -50%);
        -moz-transform: translate(-50%, -50%);
         -ms-transform: translate(-50%, -50%);
          -o-transform: translate(-50%, -50%);
             transform: translate(-50%, -50%);
     width: 6rem;
     height: 6rem;
     background-color: rgba(255,255,255,0.23);
     z-index: 10;
     opacity: 0;
     -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
     pointer-events: none;
     -webkit-transition: opacity 0.3s ease, width 0.3s ease, height 0.3s ease;
     -o-transition: opacity 0.3s ease, width 0.3s ease, height 0.3s ease;
     -moz-transition: opacity 0.3s ease, width 0.3s ease, height 0.3s ease;
     transition: opacity 0.3s ease, width 0.3s ease, height 0.3s ease;
     -webkit-border-radius: 100%;
        -moz-border-radius: 100%;
             border-radius: 100%;
}
 #videocarousel .swiper-slide div:hover i, #videocarousel .swiper-slide div:hover i:before {
     opacity: 1;
     -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}
 #videocarousel .swiper-slide div:hover span{
     background: #0936F5;
     background: -moz-linear-gradient(45deg,#0936F5 0%,#2984BD 100%);
     background: -webkit-gradient(linear,left bottom,right top,color-stop(0%,#0936F5),color-stop(100%,#2984BD));
     background: -webkit-linear-gradient(45deg,#0936F5 0%,#2984BD 100%);
     background: -o-linear-gradient(45deg,#0936F5 0%,#2984BD 100%);
     background: linear-gradient(45deg,#0936F5 0%,#2984BD 100%);
}
 #videocarousel .swnav{
     position: relative;
     -webkit-box-align: center;
     -webkit-align-items: center;
        -moz-box-align: center;
         -ms-flex-align: center;
                 -ms-grid-row-align: center;
             align-items: center;
     -webkit-box-pack: center;
     -webkit-justify-content: center;
        -moz-box-pack: center;
         -ms-flex-pack: center;
             justify-content: center;
}
 #videocarousel .swnav div{
     position: relative;
     margin: 1rem;
     width: auto;
     -webkit-border-radius: 100%;
     -moz-border-radius: 100%;
     border-radius: 100%;
     border: 1px solid #D1D1D1;
     display: -webkit-inline-box;
     display: -webkit-inline-flex;
     display: -moz-inline-box;
     display: -ms-inline-flexbox;
     display: inline-flex;
     -webkit-box-align: center;
     -webkit-align-items: center;
     -moz-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     -webkit-box-pack: center;
     -webkit-justify-content: center;
     -moz-box-pack: center;
     -ms-flex-pack: center;
     justify-content: center;
     padding: .5rem;
     background-color: #D1D1D1;
     -webkit-transition: margin 0.1s ease, padding 0.1s ease;
     -o-transition: margin 0.1s ease, padding 0.1s ease;
     -moz-transition: margin 0.1s ease, padding 0.1s ease;
     transition: margin 0.1s ease, padding 0.1s ease;
     cursor: pointer;
}
 #videocarousel .swnav div:hover{
     background-color: #0936F4;
     border: 1px solid #0936F4;
}
 #videocarousel .swnav div svg{
     width: 1.3rem;
     height: 1.3rem;
}
 #videocarousel .swnav div svg path{
     fill: #000;
}
 #videocarousel .swnav div:hover svg path{
     fill: #ffffff;
}
#world{
    min-height: 50svh;
    scroll-margin-top: 6rem;
}
 #world .info, #world .flags{
     width: 50%;
     padding: 4.323rem 3.097rem;
}
 #world .info{
     padding-right: 6.097rem;
}
#world .info h3{
    width: 100%;
}
  .annotation{
     color: #444;
     -webkit-border-image: -webkit-gradient(linear,right top, left top,from(rgba(68, 68, 68, 0)), color-stop(50%, rgba(68, 68, 68, .7)), to(rgba(68, 68, 68, 1)));
     -webkit-border-image: -webkit-linear-gradient(right,rgba(68, 68, 68, 0) 0%, rgba(68, 68, 68, .7) 50%, rgba(68, 68, 68, 1) 100%);
        -moz-border-image: -moz-linear-gradient(right,rgba(68, 68, 68, 0) 0%, rgba(68, 68, 68, .7) 50%, rgba(68, 68, 68, 1) 100%);
          -o-border-image: -o-linear-gradient(right,rgba(68, 68, 68, 0) 0%, rgba(68, 68, 68, .7) 50%, rgba(68, 68, 68, 1) 100%);
             border-image: -webkit-gradient(linear,right top, left top,from(rgba(68, 68, 68, 0)), color-stop(50%, rgba(68, 68, 68, .7)), to(rgba(68, 68, 68, 1)));
             border-image: linear-gradient(to left,rgba(68, 68, 68, 0) 0%, rgba(68, 68, 68, .7) 50%, rgba(68, 68, 68, 1) 100%);
     border-image-slice: 1;
     border-width: 1px;
     border-top: 1px solid;
     padding-top: 1rem;
     font-size: 0.857rem;
     line-height: 1rem;
}
#world .info a{
    width: 100%;
}
 #worldinfo{
     -webkit-transition: opacity 0.2s ease;
     -o-transition: opacity 0.2s ease;
     -moz-transition: opacity 0.2s ease;
     transition: opacity 0.2s ease;
     opacity: 1;
     -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
     width: 100%;
}
 #worldinfo.fade-out {
     opacity: 0;
     -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
     -webkit-transition: opacity 0.2s ease-out;
     -o-transition: opacity 0.2s ease-out;
     -moz-transition: opacity 0.2s ease-out;
     transition: opacity 0.2s ease-out;
}
 #worldinfo h6, #worldinfo a{
     cursor: pointer;
}
 #worldinfo h6{
     -webkit-animation-name: slideInLeft;
        -moz-animation-name: slideInLeft;
          -o-animation-name: slideInLeft;
             animation-name: slideInLeft;
     -webkit-animation-duration: 1.5s;
        -moz-animation-duration: 1.5s;
          -o-animation-duration: 1.5s;
             animation-duration: 1.5s;
}
 #world span{
     margin: .2rem;
     width: auto;
     -webkit-border-radius: 100%;
     -moz-border-radius: 100%;
     border-radius: 100%;
     border: 1px solid #EBEBEB;
     background-color: #EBEBEB;
     display: -webkit-inline-box;
     display: -webkit-inline-flex;
     display: -moz-inline-box;
     display: -ms-inline-flexbox;
     display: inline-flex;
     -webkit-box-align: center;
     -webkit-align-items: center;
     -moz-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     -webkit-box-pack: center;
     -webkit-justify-content: center;
     -moz-box-pack: center;
     -ms-flex-pack: center;
     justify-content: center;
     padding: .4rem;
     vertical-align: middle;
}
 #world span svg{
     float: left;
     width: 1rem;
     height: 1rem;
}
 #world span svg path{
     fill: #000;
}
 #world a:hover{
     color: #000;
}
 #world h6:hover span, #world a:hover span{
     background-color: #0936F4;
     border: 1px solid #0936F4;
     padding: .6rem;
     margin: 0rem;
}
 #world h6:hover span svg path, #world a:hover span svg path{
     fill: #ffffff;
}
 #world, #world .flags{
     position: relative;
}
 #world:before {
     background-color: #F3F3F3;
     -webkit-border-radius: 100%;
        -moz-border-radius: 100%;
             border-radius: 100%;
     content: '';
     aspect-ratio: 9/9;
     position: absolute;
     width: 100svw;
     height: 100svw;
     top: 0;
     right: -33.33svw;
     bottom: 0;
     margin: auto;
     z-index: -2;
     opacity: .5;
     -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
}
 #world .flags:before {
     background-color: #F3F3F3;
     -webkit-border-radius: 100%;
        -moz-border-radius: 100%;
             border-radius: 100%;
     content: '';
     aspect-ratio: 9/9;
     position: absolute;
     width: 80svw;
     height: 80svw;
     top: 0;
     right: -30svw;
     bottom: 0;
     margin: auto;
     z-index: -2;
}
 #world .flags button{
     width: -webkit-calc(20% - 1rem);
     width: -moz-calc(20% - 1rem);
     width: calc(20% - 1rem);
     -webkit-flex-wrap: wrap;
         -ms-flex-wrap: wrap;
             flex-wrap: wrap;
     margin: .5rem;
     filter: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="filter"><feColorMatrix type="matrix" color-interpolation-filters="sRGB" values="0.2126 0.7152 0.0722 0 0 0.2126 0.7152 0.0722 0 0 0.2126 0.7152 0.0722 0 0 0 0 0 1 0" /></filter></svg>#filter');
     -webkit-filter: grayscale(1);
             filter: grayscale(1);
     -webkit-filter: gray;
             filter: gray;
     background: #D1D1D1;
     padding: 2.5rem;
}
 #world .flags button img{
     width: 100%;
     height: auto;
     opacity: .5;
     -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
}
 #world .flags button i{
     font-style: normal;
     font-size: 0.757rem;
     line-height: 1rem;
     font-family: 'RobotoCondensed-Regular';
     color: #000;
     margin-top: .5rem;
}
 #world .flags button:hover, #world .flags button.active{
     filter: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="filter"><feColorMatrix type="matrix" color-interpolation-filters="sRGB" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0" /></filter></svg>#filter');
     -webkit-filter: grayscale(0);
             filter: grayscale(0);
     background: #0936F4;
}
 #world .flags button:hover i, #world .flags button.active i{
     color: #ffffff;
}
 #world .flags button:hover img, #world .flags button.active img{
     opacity: 1;
     -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}
.onmobile, .flagcarousel{
    display: none;
}
@media only screen and (max-width: 2000px) {
    #world .flags button{
        padding: .5rem;
    }

}
@media only screen and (max-width: 1274px){
    #videobanner .covervid-wrapper video {
        width: auto;
        height: 100svh;
    }
    #videobanner .description {
        max-width: -webkit-calc(100% - 2rem);
        max-width: -moz-calc(100% - 2rem);
        max-width: calc(100% - 2rem);
    }
    #videobanner .description .butns {
      -webkit-box-pack: start;
      -webkit-justify-content: start;
         -moz-box-pack: start;
          -ms-flex-pack: start;
              justify-content: start;
    }
    #main1 .text {
        width: 85%;
    }
}
@media only screen and (max-width: 1000px){
    #world .info, #world .flags {
        width: 100%;
    }
    #world .flags{
        padding-top: 0;
    }
    #videocarousel .text {
        padding: 4.323rem 3.097rem 4.323rem 1.097rem;
    }
}
@media only screen and (max-height: 630px), only screen and (max-width: 830px) {
    #videobanner {
        background-position: top center;
        background-repeat: no-repeat;
        -moz-background-size: cover;
       -o-background-size: cover;
          background-size: cover;
    }
    #videobanner .covervid-wrapper {
        min-height: 25rem;  
    }
    #videobanner.mobiletoo .covervid-wrapper {
        visibility: hidden;
        opacity: 0;
    }
    #videobanner .next{
        display: none;
    }
    #videobanner .covervid-wrapper video {
        height: auto;
        min-height: 100svh;
    }
    #videobanner .description{
        left: 1.3rem;
        right: 2rem;
    }
    #videobanner .description .butns{
        padding-left: 0;
    }
    #videobanner .description .butns a:nth-child(1), #videobanner .description .butns a:nth-child(2){
        display: none;
    }
    #videobanner .description .butns a:nth-child(3){
        display: inline-block !important;
        padding: 1.2rem 3rem;
    }
    #videobanner .description .butns a{
        margin-left: 0;
    }
    #videobanner .description .text{
        padding: 1.3rem;
        margin-bottom: 1rem;
    }
    #videobanner .description h1{
        font-size: 2.63rem;
        line-height: 3rem;
    }
    #videobanner .description h6, #videobanner .description h5, #videobanner .description h4, #videobanner .description h3, #videobanner .description h2 {
        font-size: 1.75rem;
        line-height: 2rem;
    }
    #videobanner .description p {
        font-size: 1rem;
        line-height: 1.2;
    }
    #videocarousel .videocarousel {
        width: 100%;
        -webkit-box-ordinal-group: 3;
        -webkit-order: 2;
           -moz-box-ordinal-group: 3;
            -ms-flex-order: 2;
                order: 2;
        padding: 1.323rem 1.097rem;
    }
    #videocarousel .text {
        width: 100%;
        -webkit-box-ordinal-group: 2;
        -webkit-order: 1;
           -moz-box-ordinal-group: 2;
            -ms-flex-order: 1;
                order: 1;
        padding: 1.323rem 1.097rem;
    }
    #world {
        min-height: auto;
    }
    #world .info{
        padding: 1.323rem 1.097rem;
    }
    #main1 .text{
        margin-top: 0;
        background-color: transparent;
    }
    #main1 .text .editor {
        margin-top: 100%;
        background-color: #161616;
    }
    #main1 h2 {
        width: 100%;
        margin-left: 0;
        font-size: 1.5rem;
    }
     #main2 .image{
        -webkit-box-ordinal-group: 2;
        -webkit-order: 1;
           -moz-box-ordinal-group: 2;
            -ms-flex-order: 1;
                order: 1;
     }
     #main2 .text{
        -webkit-box-ordinal-group: 3;
        -webkit-order: 2;
           -moz-box-ordinal-group: 3;
            -ms-flex-order: 2;
                order: 2;
     }
    #main1 .text, #main2 .text, #main3 .text, #main4 .text, #main2 .image, #main3 .image, #main4 .image {
        width: 100%;
    }
    #main2 .image svg, #main3 .image svg, #main4 .image svg{
        display: none;
    }
    #main2 .image, #main3 .image, #main4 .image{
        margin: 0 1rem;
    }
    #world .info h3 {
        font-size: 1.571rem;
        text-align: center;
    }
    #main2 .text h2, #main3 .text h2, #main4 .text h2, #worldinfo, #world .info .annotation, #world .flags, #world .info .linkon{
        display: none;
    }
    .flagcarousel{
        width: 100%;
        display: block;
        padding: 1.323rem 1.097rem;
    }
    .flagcarousel .swiper-slide{
        text-align: center;
        padding: 2rem;
    }
    .flagcarousel img{
        max-width: 10rem;
        margin: 0 auto 1rem;
        display: block;
    }
    .flagcarousel i{
    font-style: normal;
     font-size: 0.757rem;
     line-height: 1rem;
     font-family: 'RobotoCondensed-Regular';
     color: #000;
     margin-top: .5rem;
    }
     .flagcarousel .swnav{
     position: relative;
     -webkit-box-align: center;
     -webkit-align-items: center;
        -moz-box-align: center;
         -ms-flex-align: center;
                 -ms-grid-row-align: center;
             align-items: center;
     -webkit-box-pack: center;
     -webkit-justify-content: center;
        -moz-box-pack: center;
         -ms-flex-pack: center;
             justify-content: center;
}
 .flagcarousel .swnav div{
     position: relative;
     margin: 1rem;
     width: auto;
     -webkit-border-radius: 100%;
     -moz-border-radius: 100%;
     border-radius: 100%;
     border: 1px solid #D1D1D1;
     display: -webkit-inline-box;
     display: -webkit-inline-flex;
     display: -moz-inline-box;
     display: -ms-inline-flexbox;
     display: inline-flex;
     -webkit-box-align: center;
     -webkit-align-items: center;
     -moz-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     -webkit-box-pack: center;
     -webkit-justify-content: center;
     -moz-box-pack: center;
     -ms-flex-pack: center;
     justify-content: center;
     padding: .5rem;
     background-color: #D1D1D1;
     -webkit-transition: margin 0.1s ease, padding 0.1s ease;
     -o-transition: margin 0.1s ease, padding 0.1s ease;
     -moz-transition: margin 0.1s ease, padding 0.1s ease;
     transition: margin 0.1s ease, padding 0.1s ease;
     cursor: pointer;
}
.flagcarousel .swnav div:hover{
     background-color: #0936F4;
     border: 1px solid #0936F4;
}
.flagcarousel .swnav div svg{
     width: 1.3rem;
     height: 1.3rem;
}
 .flagcarousel .swnav div svg path{
     fill: #000;
}
.flagcarousel .swnav div:hover svg path{
     fill: #ffffff;
}
    .onmobile{
        display: block;
        margin: 1rem;
        font-size: 1.571rem;
    }
}

@media only screen and (max-width: 400px){
    #main1 .text{
        margin-bottom: auto;
    }
    #main1 {
        background-image: none!important;
    }
  #main1 .text .editor, #main4 .text, #main2 .text, #main3 .text, #videocarousel .text, #world .info{
    padding: 1.323rem 1.097rem;
  }
  #main1 h2, #portfolio h2 {
    padding: 0.806rem 1.097rem;
  }
}

@media (orientation: portrait) {
  #main2 .image, #main3 .image, #main4 .image {
        aspect-ratio: 9/16;
    }
}
@media (orientation: landscape) {
  #main2 .image, #main3 .image, #main4 .image {
        aspect-ratio: 16/9;
    }
}