html,body{padding:0;margin:0;}
body{font-family: 'Mukta', sans-serif;font-size:16px;background:#fff;overflow-x: hidden;position:relative;}

#loader-bg{z-index:200;display:block;width:100%;height:100%;position:fixed;background:#fff;opacity:1;}
#loader{z-index:210;
    position:absolute;
    left: 50%;
    top: 50%;
    margin-left:-40px;
    margin-top:-40px;
    border:2px solid #000;
    width: 80px;
    height: 80px;
    -webkit-animation:spin 1s ease infinite;
    -moz-animation:spin 1s ease infinite;
    animation:spin 1s ease infinite;
    opacity:1;
}

.loader-off{
    top:30% !important;
    opacity:0 !important;
    transition: 0.5s;
}
.loader-bg-off{opacity:0 !important;transition: 1s;}

h1,h2,h3,h4,h5,a.fat{position:relative;z-index:4;font-family: 'Archivo Black', sans-serif;vertical-align:bottom;margin:0;padding:0;color:#000;}
a{text-decoration: none;color:#000;display:inline-block;padding-bottom:4px;border-bottom:1px solid #000;}
a:hover{color:#7f7f7f;}

*{transition: 0.2s;}

#top-bg{z-index:1;width:100%;background-color: #e5e5e5;text-align:center;padding:0 32px;box-sizing:border-box;}
#top-content{z-index:2;position:relative;width:100%;max-width:1408px;margin:auto;padding:56px 0 104px;background: url("/img/bg1.gif") top left repeat;text-align:left;}
#top-bar{z-index:4;width:100%;height:56px;}
#logo{z-index:4;width:200px;height:56px;float:left;background:url('/img/logo.svg') center center no-repeat;display:block;font-size:0;color:transparent;border:0px none !important;padding:0 !important;}
#menu-rwd{width:24px;height:24px;background: url('/img/menu-line.svg') center center no-repeat;cursor:pointer;display:none;right:0;float:right}
#menu{z-index:4;float:right;height:24px;font-family: 'Archivo Black', sans-serif;font-size: 16px;text-align: center;color: #000000;padding:0;margin:0;line-height:24px;list-style: none;position:initial}
#menu li{z-index:4;float:left;padding:0;margin:0;height:24px;line-height:24px;vertical-align:middle;}
#menu li.sm{width:24px;text-align:center;margin-left:48px}
#menu li.menu{text-align:center;margin:0 30px}
#menu li a{text-decoration:none;display: initial;border:0 none;padding:0;}
#menu li a:hover{color:#000;opacity:.45;filter:alpha(opacity=45);}
#menu li a img{vertical-align:sub;}
#li-rwd{display:none;position:relative;height:18px !important;}
#li-rwd .close{right:0;}

#andrew{z-index:3;position:absolute;top:184px;right:0;width:640px;height:686px;}

h1{line-height:104px;font-size:80px;color: #e5e5e5;}
h1{text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000;}
@supports (-webkit-text-stroke: 1px #000) {
  h1 {
    -webkit-text-stroke: 1.8px #000;
    text-shadow:none;
    color: rgba(255, 255, 255, 0);
    letter-spacing: 0.3px;
  }
}
@-moz-document url-prefix() {
  h1{letter-spacing:-1.2px;}  
}
h2{line-height:104px;font-size:80px;}
h3{line-height:62px;font-size:48px;}
h4{line-height:42px;font-size:32px;}
h5{line-height:56px;font-size:24px;}

#arr{width:24px;height:80px;z-index:4;position:absolute;left:72px;bottom:-35px;background:url("/img/arrow-down-line.svg") center center no-repeat;}

#circle-txt {
    z-index:10;
    position: absolute;
    top: 603px;
    right:calc(50% - 810px);
    width: 218px;
    height: 218px;
    -webkit-animation:spin 16s linear infinite;
    -moz-animation:spin 16s linear infinite;
    animation:spin 16s linear infinite;
}
@-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } }
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); }}

#content-wrap{width:100%;text-align:center;padding:0 32px;box-sizing:border-box;}
#content{z-index:1;position:relative;width:100%;max-width:1408px;margin:auto;padding:144px 0 129px;background: url("/img/bg2.gif") top left repeat;text-align:left;}

.small{font-size:16px;color:#b2b2b2;}
#clients{width:100%;max-width:1280px;overflow:hidden;padding-top:80px;}
.clients-logo{width:256px;height:112px;float:left;background-position:left center;background-repeat:no-repeat;}

#content-inside{width:100%;max-width:1280px;}
#szkolenie{padding-top:100px;}
#desc{width:100%;box-sizing:border-box;padding:92px 0 121px 256px;position:relative;}
#desc ul{padding:0;margin:0 0 0 -16px;line-height:24px;list-style:none;}
#desc ul li{font-family:Mukta;font-size:24px;padding:0 0 0 56px;line-height:56px;background:url('/img/line.gif') 0 28px no-repeat;}
#desc2{color: #7f7f7f;margin-bottom:104px;line-height:24px;}
#cont{padding-left:calc(3*256px);font-size:24px;line-height:56px;color:#7f7f7f;margin-bottom:135px;}
.empty{font-size: 0 !important;}
#contlink{line-height:5px;}

*:focus{outline: none;}
#form{padding-left:calc(1*256px);position:relative;}
#form-inside{margin:108px 0 172px 0;width:calc(3*256px);}
form,fieldset{margin:0;padding:0;border:0px none;}
input.input{text-align:left;width:100%;height:76px;margin:0;margin:0 0 16px 0;font-size:16px;line-height:24px;font-family: 'Mukta', sans-serif;color:#7f7f7f;box-sizing:border-box;}
label.label{position:absolute;font-family: 'Mukta', sans-serif;color:#000;font-size:13px;padding:0 15px;margin:-10px 0 0 12px;background:#fff;}
.input-off{border:0px none; border-bottom:4px solid #000;background:none;padding:26px 0 22px 0;}
.label-off{display:none;}
.input-on{border:2px solid #000;background:#fff;padding:24px;}
label-on{display:block;}
.input-error{border-color:#ff0000;}

.container {display: block;position: relative;padding-left: 35px;margin-bottom: 12px;cursor: pointer;font-size: 12px;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}
input[type=checkbox]{position:absolute;opacity:0;cursor:pointer;height:0;width:0;}
.checkmark {position:absolute;top:0;left:0;height:18px;width:18px;background-color:#fff;border:2px solid #000;box-sizing:border-box;}
.container input:checked ~ .checkmark{background-color:#000;}
.checkmark:after{content:"";position:absolute;display:none;}
.container input:checked ~ .checkmark:after{display:block;}
.container .checkmark:after {
  left: 4px;
  top: 2px;
  width: 3px;
  height: 6px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

#checkbox{padding-left:3px;}
#checkbox-desc{font-size:12px;line-height:16px;color:#7f7f7f;padding-left:36px;margin-bottom:52px;}
#checkbox-desc a{line-height:5px;}

.chck-more-off{height:0;opacity:0;}
.chck-more-on{height:auto;opacity:1;}
.checkbox-more-off{}
.chekcbox-more-on{}

input[type="submit"]{z-index:20;position:relative;border:0px none;padding:24px 0;margin:0;width:100%;height:auto;text-align:center;font-family: 'Archivo Black', sans-serif;color:#fff;background:#000;font-size:16px;cursor:pointer;}

.tip {
    display: none;
    position: absolute;
    margin-top: -40px;
    left: 50%;
    margin-left:-90px;
    width: 180px;
    padding: 5px;
    z-index: 100;
    background: #000;
    color: #fff;
    text-align: center;
    box-sizing:border-box;
    font-size:12px;
    cursor:pointer;
}
.tip:before{
    content:'';
    display:block;
    width:0;
    height:0;
    position:absolute;
    margin-left:-8px;
    border-top: 8px solid black;
    border-bottom: 8px solid transparent; 
    border-right:8px solid transparent;
    border-left:8px solid transparent;
    left:50%;
    top:29px;
    cursor:pointer;
}
.tip-on{display:block;}

#footer{position:relative;margin:0;}
#footer-txt{position:absolute;left:256px;top:0;font-size:13px;line-height:16px;color:#7f7f7f;}
#footer img{padding-top:3px;}

#blackout{
    z-index:100;
    position:absolute;
    top:0;
    left:0;
    width:100%;
    min-height:100%;
    display:block;
    background:rgba(0,0,0,0.3);
    text-align:center;
    visibility: hidden;
    opacity: 1;
}
.blackout-on{
    visibility:visible !important;
    opacity:1;
}
.popup{
    text-align:left;
    font-size:24px;
    line-height:40px;
    background:#fff;
    box-sizing:border-box;
    border-radius: 8px;
    display:inline-block;
    visibility: hidden;
    opacity:0;
}
.popup-on{
    visibility: visible !important;
    opacity:1;
}
#popup-aboutme{
    margin:184px auto;
    width:95%;
    max-width:1408px;
    position:relative;
    padding:208px 128px;
}
#popup-form{
    position:fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    padding:104px 64px;
}

.close{width:24px;height:24px;position:absolute;top:32px;right:32px;cursor:pointer;background:url('/img/icon-x.svg') center center no-repeat;}
@media only screen and (max-width: 1600px) {
  #circle-txt {right:0;}
}

@media only screen and (max-width: 1470px) {
  h1,h2{font-size:70px}
}
@media only screen and (max-width: 1330px) {
  h1,h2{font-size:60px}
}
@media only screen and (max-width: 1270px) {
  #cont{padding-left:calc(2*256px);}
}
@media only screen and (max-width: 1216px) {
   #andrew{width:512px;height:549px;} 
   #form{padding-left:0;}
   #desc{padding-left:0;}
}
@media only screen and (max-width: 1128px) {
    h1,h2{font-size:50px}
}
@media only screen and (max-width: 1024px) {
    #top-content{background-image:url('/img/bg1-rwd.gif');}
    #content{background-image:url('/img/bg2-rwd.gif');}
    #top-content{padding:29px 0 340px;}
    #top-bar{height:39px;}
    #logo{width:139px;height:39px;background-image:url('img/logo-rwd.svg');}
    #menu-rwd{display:block;}
    #li-rwd{display:block;}
    #menu{display:block;background:#fff;height:100%;margin-right:0px;visibility:hidden;opacity:0;position:fixed;right:-100%;z-index:1000;top:0;width:85%;}
    .menu-on{visibility:visible !important;opacity:1 !important;right:0 !important;}
    #menu li{float:none;padding:10px 0;height:auto;}
    #menu li.menu{text-align:right;}
    #menu li.sm{float:left;}
    #top-content h3{margin-top:44px !important;line-height:52px;font-size:40px;}
    #top-content h2,#top-content h1{margin-top:0px !important;line-height:56px;font-size:48px;}
    #top-content h4{margin-top:18px !important;line-height:32px;font-size:24px;}
    #top-content a.fat{margin-top:34px !important;line-height:20px;font-size:16px;}
    #andrew{left:-32px;top:436px;width:440px;height:472px;}
    #arr{left:238px;bottom:-235px;}
    #circle-txt{width:168px;height:168px;left:357px;top:633px;}
    #content{padding-top:232px;padding-bottom:72px;}
    #clients{padding-top:16px;}
    .clients-logo{width:160px;}
    #szkolenie{line-height:40px;font-size:32px;padding-top:24px}
    #content h5{margin-bottom:18px;}
    #desc{padding-top:20px;padding-bottom:40px;}
    #desc ul li{line-height:24px;font-size:16px;background-position: 0 12px;padding-bottom:8px;}
    #desc2{margin-bottom:56px;}
    #cont{padding-left:0;line-height:32px;font-size:24px;margin-bottom:64px;}
    #cont h5{line-height: normal;margin-bottom:24px !important;}
    #form h3{line-height:40px !important;font-size:32px;}
    #form-inside{margin:48px 0 0 0;width:100%;}
    #checkbox-desc{margin-bottom:16px;}
    .checkbox-more-off{height:100px;}
    .checkbox-more-on{height:auto;}
    #footer{margin-top:85px;}
    #footer-txt{left:102px;}
    
    #popup-aboutme{margin:32px auto;padding:48px;line-height: 24px;font-size:16px;}
    .close{top:16px;right:16px;}
    #popup-aboutme h3{margin-bottom: 32px !important;line-height: 40px;font-size: 32px;}
    #popup-form{padding:40px;line-height: 24px;font-size:16px;}
}
@media only screen and (max-width: 588px) {
    #top-content{padding:29px 0 calc(224px + 56px);}
    #circle-txt{width:109px;height:109px;left:248px;top:calc(550px + 112px);}
    #andrew{left:-32px;top:calc(436px + 112px);width:306px;height:328px;}
    #arr{left:140px;bottom:-195px;}
}
@media only screen and (max-width: 410px) {
    #top-content{padding:29px 0 calc(224px + 56px);}
    #andrew{top:calc(436px + 112px + 56px);}
    #circle-txt{top:calc(550px + 112px + 56px);}
}
@media only screen and (max-width: 360px) {
    #menu li.menu{margin:0 12px;}
    #menu li.sm{margin:0 16px;}
}