@font-face {
    font-family: 'Fontype Rounded';
    src: url('/assets/font/FontypeRounded.eot');
    src: local('Fontype Rounded'), local('FontypeRounded'),
    url('/assets/font/FontypeRounded.eot?#iefix') format('embedded-opentype'),
    url('/assets/font/FontypeRounded.woff2') format('woff2'),
    url('/assets/font/FontypeRounded.woff') format('woff'),
    url('/assets/font/FontypeRounded.ttf') format('truetype'),
    url('/assets/font/FontypeRounded.svg#FontypeRounded') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Fontype Rounded';
    src: url('/assets/font/FontypeRounded-Bold.eot');
    src: local('Fontype Rounded Bold'), local('FontypeRounded-Bold'),
    url('/assets/font/FontypeRounded-Bold.eot?#iefix') format('embedded-opentype'),
    url('/assets/font/FontypeRounded-Bold.woff2') format('woff2'),
    url('/assets/font/FontypeRounded-Bold.woff') format('woff'),
    url('/assets/font/FontypeRounded-Bold.ttf') format('truetype'),
    url('/assets/font/FontypeRounded-Bold.svg#FontypeRounded-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

body{display:flex; flex-direction:column; font:normal 14px/24px 'Fontype Rounded',tahoma; background:#141414 url("../images/background.jpg") no-repeat center center; background-size: cover; direction: ltr; margin: 0; padding: 0}
body *{box-sizing: border-box}
a{text-decoration:none}
.container{width:780px; margin:0 auto}
#navigation{order: 1; margin:16px 0}
#navigation .main-menu{list-style:none; margin:0; padding:0; display:flex;}
#navigation .main-menu li{width:100%; height:40px; margin:0 16px; list-style: none; background: #2b5b2d; border-radius:0; opacity:1 !important}
#navigation .main-menu li a{display:block; width:100%; height:32px; text-align: center; line-height:40px; color:#666666}
#navigation .main-menu li.swiper-pagination-bullet-active a{color:#fff}
#header{order: 2}
#header .logo{overflow:hidden;}
#header .logo img{width:100%; height:320px; margin:-60px 0; object-fit: contain}
#main{order: 3; color: #fff}
#stages{height:calc(100vh - 32px - 40px - 200px - 32px - 50px)}
#stages .swiper{height:100%;}
#stages .swiper .swiper-slide{height:100%;}
#stages .swiper .swiper-slide .box-stage{height:100%; }
#stages .swiper .swiper-slide .box-stage .box-header{display:flex; position:relative; height:32px; line-height:32px;}
#stages .swiper .swiper-slide .box-stage .box-header:before{content:""; width:32px; height:50%; border-bottom:1px solid #666666}
#stages .swiper .swiper-slide .box-stage .box-header:after{content:""; width:100%; height:50%; border-bottom:1px solid #666666}
#stages .swiper .swiper-slide .box-stage .box-header-title{display:inline-block; padding:0 16px; color:#ccc; white-space:nowrap}
#stages .swiper .swiper-slide{opacity:0;}
#stages .swiper .swiper-slide .box-stage .box-content{margin:4px 0 16px; overflow:auto; height:calc(100% - 50px); padding:0 16px;}
.content-about-us{color:#fff; text-align: justify; display:flex; flex-direction: column; justify-content: center; min-height:100%}
.networks-list{display:flex; margin: 0; padding: 0; height:100%}
.networks-list .networks-item{list-style:none; width:100%; display:flex; justify-content: center; align-items: center}
.networks-list .networks-item button{width:75px; height:75px; background:#2b5b2d; color:#fff; cursor:pointer; border:none; border-radius:4px; padding:0; display:flex; justify-content:center; align-items:center;}
.networks-list .networks-item button img{width:75%; height:75%; object-fit:contain}
.networks-list .networks-item ul{display:none}

.form{display:flex; flex-direction: column; justify-content: center; min-height:100%; overflow:auto;}
.form-row{position:relative; margin-bottom:8px;}
.form-row input[type="text"],
.form-row input[type="password"],
.form-row input[type="email"]{width:100%; height:40px; outline: none; padding:0 8px;}
.form-row textarea{width:100%; height:100px; min-height:100px; max-height:150px; resize: vertical; outline: none; padding:8px;}
.form-row button{height:30px; border:none; background:#2b5b2d;color:#fff; cursor:pointer; padding:0 16px;}
.form-row input[type="checkbox"]{display:none}
.form-row label{line-height:30px; user-select:none; -webkit-user-select:none; cursor:pointer}
.form-row input[type="checkbox"] ~ label:before{content:"✔"; display:inline-block; font-size:14px; line-height:18px; text-align:center; width:18px; height:18px; background: #2b5b2d; color:transparent; vertical-align:middle; margin-right:4px; border-radius:3px;}
.form-row input[type="checkbox"]:checked ~ label:before{color:#fff;}

.form-fluid{width:50%; min-height:100%; overflow:auto; display:flex; flex-direction: column; justify-content: center; margin:0 auto}
.form-fluid.has-tab{overflow:hidden;}
.form-fluid.has-tab .form-fluid-head{display:flex;margin: 0 -1px;}
.form-fluid.has-tab .form-fluid-head button{width:100%; height:40px; border:none;margin: 0 1px; background:#2b5b2d;color:#fff; cursor:pointer}
.form-fluid.has-tab .form-fluid-head button#sing-up{cursor:default; opacity:0;}
.form-fluid.has-tab .form-fluid-head button.selected{background:#fff;color:#2b5b2d;}
.form-fluid.has-tab .form-fluid-body{background:#fff;}
.form-fluid.has-tab .form-fluid-body .form-tabs-bodies{list-style:none; margin:0; padding:0}
.form-fluid.has-tab .form-fluid-body .form-tabs-bodies>li{list-style:none; display:none;}
.form-fluid.has-tab .form-fluid-body .form-tabs-bodies>li.selected{display:flex}
.form-fluid.has-tab .form-fluid-body .form-tabs-bodies .form .form-row{}
.form-fluid.has-tab .form-fluid-body .form-tabs-bodies .form .form-row.has-col{display:flex}
.form-fluid.has-tab .form-fluid-body .form-tabs-bodies .form .form-row.has-col .remember-me{margin-left: auto; display:flex; height:30px; }
.form-fluid.has-tab .form-fluid-body .form-tabs-bodies .form label{color:#666}
.form-fluid.has-tab .form-fluid-body .form-tabs-bodies .form{width:100%; padding:16px 48px;}
.form-fluid.has-tab .form-fluid-body .form-tabs-bodies .form input[type="text"],
.form-fluid.has-tab .form-fluid-body .form-tabs-bodies .form input[type="email"],
.form-fluid.has-tab .form-fluid-body .form-tabs-bodies .form input[type="password"]{border:none; background:#ccc;}

.webui-popover-title{text-align: center}
.webui-popover-content{/*padding:0 !important*/}
.webui-popover-content ul{margin:0; padding:0}
.webui-popover-content ul li{list-style:none;}
.webui-popover-content ul li a{display:block; padding:0 16px; line-height:40px; height:40px; text-align: center; white-space: nowrap}
.webui-popover-content ul li a:hover{background:#f4f4f4}

#footer{order:4; }
#footer .copyright{height:40px; padding:12px 0; text-align:center; color:#666666; border-top:1px solid #666666}


@media screen and (max-width:860px) {
    .container{width:650px;}
    .form-fluid{width:65%;}
    #navigation .main-menu li{margin:0 8px;}
}
@media screen and (max-width:680px) {
    .container{width:500px;}
    .form-fluid{width:75%;}

}
@media screen and (max-width:560px) {
    .container{width:90%;}
    .form-fluid{width:90%;}

     #navigation .main-menu, .networks-list{flex-wrap:wrap;}
     #navigation .main-menu li, .networks-list .networks-item{white-space:nowrap; width:33.33%; flex-grow:1; margin:4px; padding:0 8px;}

}
@media screen and (max-width:400px) {
    
}