@font-face { font-family: 'Dinpro'; font-weight:300; src: url('/fonts/din-pro/din-pro-light.ttf'); }
@font-face { font-family: 'Dinpro'; font-weight:300; font-style:italic; src: url('/fonts/din-pro/din-pro-light-italic.ttf'); }
@font-face { font-family: 'Dinpro'; font-weight:400; src: url('/fonts/din-pro/din-pro.ttf'); }
@font-face { font-family: 'Dinpro'; font-weight:400; font-style:italic; src: url('/fonts/din-pro/din-pro-italic.ttf'); }
@font-face { font-family: 'Dinpro'; font-weight:500; src: url('/fonts/din-pro/din-pro-medium.ttf'); }
@font-face { font-family: 'Dinpro'; font-weight:500; font-style:italic; src: url('/fonts/din-pro/din-pro-medium-italic.ttf'); }
@font-face { font-family: 'Dinpro'; font-weight:700; src: url('/fonts/din-pro/din-pro-bold.ttf'); }
@font-face { font-family: 'Dinpro'; font-weight:700; font-style:italic; src: url('/fonts/din-pro/din-pro-bold-italic.ttf'); }
@font-face { font-family: 'Dinpro'; font-weight:800; src: url('/fonts/din-pro/din-pro-black.ttf'); }
@font-face { font-family: 'Dinpro'; font-weight:800; font-style:italic; src: url('/fonts/din-pro/din-pro-black-italic.ttf'); }

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { border: 0; font-family: inherit; font-size: 100%; font-style: inherit; font-weight: inherit; margin: 0; outline: 0; padding: 0; font-family: 'Dinpro', Arial, sans-serif; color: #000; }
:focus { outline: 0; }
body { line-height: 1; }
ul { list-style: none; }
table { border-collapse: collapse; border-spacing: 0; }
caption, th, td { font-weight: normal; text-align: left; }
blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }
a img { border: 0; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
html { height: 100%; width: 100%; }
a { text-decoration:none; }
strong, b { font-weight:700; }
.clear { clear:both; padding:0px !important; margin:0px !important; width:auto !important; height:auto !important; border:0px !important; float: none !important; background: none repeat scroll 0 0 transparent !important; min-height:auto !important; }
button { cursor:pointer; }
/* ------------- */

/* STEP 1 */ 

body { background:#fff; height: 100%; width: 100%; }
.wind { display:none; }
.box { position:relative; width:100%; }
	.whitehouse-wrapper { width:100%; position:relative; min-height:156px; }
	.header-wrapper { width:100%; position:fixed; top:0px; min-height:156px; z-index:9997; background:rgba(255,255,255,.9); box-shadow:0 1px 10px rgba(0,0,0,.2); -webkit-transition: 0.2s; -moz-transition: 0.2s; -o-transition: 0.2s; transition: 0.2s; }
    .header-wrapper.active { min-height:60px; }
        .header { margin:0 auto; position:relative; max-width:1383px; }
            .logo { position:absolute; left:0px; top:37px; -webkit-transition: 0.2s; -moz-transition: 0.2s; -o-transition: 0.2s; transition: 0.2s; }
            .header-wrapper.active .logo { top: 7px; }
                .logo > a:hover { opacity:0.8; }
                    .logo > a > img { -webkit-transition: 0.2s; -moz-transition: 0.2s; -o-transition: 0.2s; transition: 0.2s; width:230px; }
                    .header-wrapper.active .logo > a > img { width:120px; }
                
            .top-mob { position:absolute; right:20px; top:48px; display:none; cursor:pointer; }
            .header-wrapper.active .top-mob { top:17px; }
                .top-mob > span { background:#000; width:28px; height:3px; display:block; margin:4px 0; }
            .top-menu { position:absolute; right:0px; top:54px; -webkit-transition: 0.2s; -moz-transition: 0.2s; -o-transition: 0.2s; transition: 0.2s; }
                .header > p { font-size: 26px; color:#178D5F; font-weight:500; line-height:34px; text-transform: uppercase; text-align:center; margin-top:61px;width:100%; position:absolute; -webkit-transition: 0.2s; -moz-transition: 0.2s; -o-transition: 0.2s; transition: 0.2s; }
                .header-wrapper.active .header > p { font-size: 18px; margin-top: 13px; width: calc(100% - 460px); position: absolute; left: 120px; }
            #open_topmenu { width:0px; height:0px; opacity:0; float: left; }
            .header-wrapper.active .top-menu { top:6px; }
                .top-menu > ul > li { float:left; margin:0 0 0 3px; }
                .top-menu > ul > li > span { cursor:default; }
                .top-menu > ul > li > a, .top-menu > ul > li > span { padding:0 15px; display:block; line-height:48px; font-size:21px; color:#223344; border-radius:4px; font-weight:500; }

                .top-menu > ul > li u { line-height: 39px; font-size: 14px; position: relative; color: #999999; }
                    .top-menu > ul > li.active > a { color: #fff; background:#005447; }
                    .top-menu > ul > li:hover > span, .top-menu > ul > li.hover > a, .top-menu > ul > li.hover > span, .top-menu > ul > li:hover > a { background:#005447; color:#fff; }
                    .top-menu > ul > li:hover > span { border-radius: 4px 4px 0 0; }
                    .submenu { display:none; background:#fff; border:1px solid #b2b2b2; width:380px; position:absolute; }
                    .top-menu > ul > li:hover > span + .submenu { display:block; }
                        .submenu > li > a { display: block; font-weight: 400; font-size: 20px; line-height: 28px; color: #505050; text-decoration: none; border-bottom: 1px solid #B2B2B2; -webkit-transition: color .2s ease; transition: color .2s ease; padding: 14px 30px; }
                        .submenu > li > a:hover, .submenu > li > a.active { color:#178d5f; }
                    
	.topslide-wrapper { width:100%; position:relative; background:url('/img/topslide.jpg') no-repeat 50% 0; min-height: 441px; }
    .topslide-wrapper.topslide1 { background:url('/img/index-top.jpg') no-repeat 50% 0; height:600px; }
        .topslide-wrapper.topslide1 > .topslide > h1 { font-size:79px; line-height: 101px; color:#212121; font-weight: 500; text-transform:inherit; }
        .topslide-wrapper.topslide1 > .topslide > p { font-size: 48px; color:#fff; line-height:60px; text-transform:uppercase; max-width:600px; font-weight:500; text-align:center; display:table; margin:25px auto 0; }
        
    .topslide-wrapper.topslide2 { background:url('/img/topslide2.jpg') no-repeat 50% 0; height:432px; }
    .topslide-wrapper.topslide3 { background:url('/img/topslide3.jpg') no-repeat 50% 0; height:432px; }
    .topslide-wrapper.topslide4 { background:url('/img/topslide4.jpg') no-repeat 50% 0; }
    .topslide-wrapper.topslide5 { background:url('/img/topslide5.jpg') no-repeat 50% 0; }
    .topslide-wrapper.topslide6 { background:url('/img/topslide6.jpg') no-repeat 50% 0; }
    .topslide-wrapper.topslide7 { background:url('/img/topslide7.jpg') no-repeat 50% 0; }
    .topslide-wrapper.topslide8 { background:url('/img/topslide8.jpg') no-repeat 50% 0; }
    .topslide-wrapper.topslide9 { background:url('/img/topslide9.jpg') no-repeat 50% 0; }
    .topslide-wrapper.topslide10 { background:url('/img/topslide10.jpg') no-repeat 50% 0; }
    .topslide-wrapper.topslide11 { background:url('/img/topslide11.jpg') no-repeat 50% 0; }
    .topslide-wrapper.topslide12 { background:url('/img/topslide12.jpg') no-repeat 50% 0; }
    .topslide-wrapper.topslide13 { background:url('/img/topslide13.jpg') no-repeat 50% 0; }
    .topslide-wrapper.topslide14 { background:url('/img/topslide14.jpg') no-repeat 50% 0; }
    
        .topslide { margin:0 auto; position:relative; max-width:1383px; }
           .topslide > h1 { padding-top:170px; text-align:center; line-height:100px; font-size:75px; text-transform:uppercase; color:#ffffff; }
           .topslide2 h1, .topslide3 h1, .topslide4 h1, .topslide5 h1 { padding-top:120px; }
    
    .wdwo-wrapper { width:100%; position:relative; background:#ffffff; }
        .wdwo { margin:0 auto; position:relative; max-width:1383px; }
            .wdwo > h2 { font-size:60px; line-height:78px; color:#212121; text-align:center; text-transform:uppercase; font-weight: 500; padding:99px 20px 38px; }
            .wdwo > div { padding:0 0 77px 297px; position:relative; }
            .wdwo > div:before { content:''; position:absolute; left:0px; top:0px; background:url('/img/what-do-we-offer.png') no-repeat; width:257px; height:224px; }
                .wdwo > div > p { font-size: 25px; line-height: 35px; padding-bottom:14px; color:#000; }

    .services-include-wrapper { width:100%; position:relative; background:#E6EEEC; }
        .services-include { margin:0 auto; position:relative; max-width:1383px; min-height:170px; }
            .services-include > p { padding:60px 20px; font-size:38px; line-height:50px; color:#212121; font-weight:500; text-align:center; }

    .includes-wrapper { width:100%; position:relative; }
        .includes { margin:0 auto; position:relative; }
            .includes > div { width:50%; float:left; height:626px; position:relative; }
            .include1 { background:url('/img/consulting-service1.jpg') no-repeat 50% 50% / cover; }
            .include2 { background:url('/img/consulting-service2.jpg') no-repeat 50% 50% / cover; }
            .include3 { background:url('/img/consulting-service3.jpg') no-repeat 50% 50% / cover; }
            .include4 { background:url('/img/consulting-service4.jpg') no-repeat 50% 50% / cover; }
                .includes > div:nth-child(2n-1) > div { width:600px; float: right; }
                .includes > div:nth-child(2n) > div { width:490px; padding-left:110px; }
                    .includes h3 { font-size:32px; line-height:42px; font-weight:500; position:relative; text-transform:uppercase; }
                    .includes .include1 h3 { color:#fff; padding: 70px 0 30px 157px; margin-right: 100px; }
                    .includes .include1 h3:before { content:''; background:url('/img/cs-icon1.png') no-repeat; width:120px; height:120px; left:0px; top:70px; position:absolute; }

                    .includes .include2 h3 { color:#fff; padding: 96px 0 46px 157px; margin-right: 100px; }
                    .includes .include2 h3:before { content:''; background:url('/img/cs-icon2.png') no-repeat; width:135px; height:135px; left:0px; top:67px; position:absolute; }

                    .includes .include3 h3 { color:#212121; padding: 137px 0 46px 157px; margin-right: 100px; }
                    .includes .include3 h3:before { content:''; background:url('/img/cs-icon3.png') no-repeat; width:120px; height:120px; left:0px; top:119px; position:absolute; }
                    .includes .include3 p, .includes .include4 p { color:#212121; }
                    .includes .include3 a, .includes .include4 a { background:#005447; color:#fff; }
                    .includes .include3 a:hover, .includes .include4 a:hover { background:#006152; }

                    .includes .include4 h3 { color:#212121; padding: 134px 0 48px 157px; }
                    .includes .include4 h3:before { content:''; background:url('/img/cs-icon4.png') no-repeat; width:120px; height:120px; left:0px; top:119px; position:absolute; }
                    

                    .includes p { max-width:500px; font-size:18px; line-height:26px; font-weight:500; color:#fff; }
                    .includes a { display:table; position:absolute; bottom: 65px; font-weight:500; font-size:28px; line-height:36px; color:#005447; background:#E6EEEC; padding: 6px 25px; border-radius: 4px; -webkit-transition: 0.2s; -moz-transition: 0.2s; -o-transition: 0.2s; transition: 0.2s; }
                    .includes a:hover { background:#fff; }

    .wcss-wrapper { width:100%; position:relative; background:#ffffff; }
        .wcss { margin:0 auto; position:relative; max-width:1383px; }
            .wcss > h2 { font-size:38px; line-height:60px; color:#212121; text-align:center; text-transform:uppercase; font-weight: 500; padding:91px 20px 0px; }
            .wcss > div { padding:0 0 77px 283px; position:relative; }
            .wcss > div:before { content:''; position:absolute; left:0px; top:0px; background:url('/img/why-choose.png') no-repeat; width:257px; height:224px; }
                .wcss > div > p { padding-top:32px; font-size: 25px; line-height: 35px; padding-bottom:14px; color:#000; }

    .contact-toptext-wrapper { width:100%; position:relative; background:#ffffff; }
        .contact-toptext { margin:0 auto; position:relative; max-width:1383px; }
            .contact-toptext > p { font-size: 25px; line-height: 35px; color: #000000; text-align:center; padding:70px 20px 30px; }

	.projects-wrapper { width:100%; position:relative; min-height:210px; background:#fff; }
        .projects { margin:0 auto; position:relative; max-width:1383px; padding-bottom:100px; }
            .projects > h2 { padding-top:40px; text-align:center; line-height:78px; font-size:60px; text-transform:uppercase; color:#212121; }
            .projects > form { padding:40px 0 0px; margin:0 auto; display:table; }
                .form-blocks { width:912px; margin:0 15px; }
                    .form-blocks > p { font-size:25px; line-height:35px; color:#505050; padding-bottom:5px; }
                    .form-div { padding-bottom:5px; width:100%; position:relative; }
                    .form-div-double { padding-bottom:30px; }
                    .form-div-phone { float:left; width:33%; margin-right:31px; }
                    .form-div-email { float:left; width:calc(100% - 33% - 31px); }
                        .form-div > input[type=text] { background: #E6EEEC; border: 1px solid #505050; height:40px; z-index:2; color:#505050; width: calc(100% - 38px); padding: 0px 18px; font-size: 16px; }
                        .form-div > textarea { border: 1px solid #505050; height:169px; z-index:2; background: #E6EEEC; color:#505050; width: calc(100% - 38px); padding: 8px 18px 0; font-size: 16px; }
                        .form-div > label { color:#505050; font-size: 25px; line-height: 35px; padding-bottom:5px; }

                        .form-div > input[type=file] { display:none; }
                        .form-div > input[type=file] + label { float:left; border: 1px solid #d9d9d9; height: 50px; z-index: 2; background: #505050; color: #fff; font-size: 22px; line-height: 50px; position: relative; padding: 0 18px; left: auto; display: block; cursor: pointer; }
                        .form-div > input[type=file] + label:hover { opacity:0.8; }
                        .form-div > p { float:left; font-size: 14px; line-height: 50px; color: #000; padding-left:20px; }
                        .red_req { border: 1px solid #ff0000 !important; }
                    #submit { padding:0 45px; color:#fff; background:#005447; text-transform:uppercase; line-height:60px; font-size:32px; font-weight: 500; border-radius:4px; cursor:pointer; border:0px; margin:40px auto 0; display:table; }
                    #submit:hover { opacity:0.8; }
                    .form-mess { padding-top:20px;  height:20px; }
                        .form-mess > p { line-height:20px; font-size:14px; color:#223344; text-align: center; }
                    #filez { padding-top:20px; }
                    #filez > ul { top: -15px; position: relative; border-bottom: 1px solid #797979; }
                        #filez > ul > li { font-size:13px; line-height:19px; padding-bottom:3px; padding-left:5px; }
                    #file_total { padding-bottom:10px; font-size:14px; line-height:20px; font-weight:bold; position: relative; top: -10px; padding-left:5px; }
                    #file_total.green { color:#008800; }
                    #file_total.red { color:#ff0000; }
                    
	.footer-wrapper { width:100%; position:relative; min-height:332px; background:#e6eeec; }
        .footer { margin:0 auto; position:relative; max-width:1383px; }
            .footer > ul { padding-top:80px; display:table; margin:0 auto; }
                .footer > ul > li { float:left; margin:0 10px; }
                    .footer > ul > li > a { color:#505050; text-decoration:none; font-size:22px; line-height:28px; font-weight: 500; }
                    .footer > ul > li > a:hover { text-decoration:underline; }
                .logo-footer img { display:table; margin:0 auto; max-width:140px; }
                .logo-footer a:hover img { opacity:0.8; }
                .copyright { padding:52px 20px 20px; }
                    .copyright > p { color:#505050; text-align:center; font-weight: 500; font-size: 18px; line-height: 24px; }
/* recomendations */
    .rec-operations-wrapper { width:100%; position:relative; background:#fff; }
        .rec-operations { margin:0 auto; position:relative; max-width:1383px; }
            .rec-operations > p { padding:100px 20px 50px; color:#000; font-size: 25px; line-height:35px; }
            .rec-operations > h2 { font-weight: 500; font-size: 48px; line-height: 62px; text-align: center; color:#212121; padding:10px 20px 60px; text-transform:uppercase; }
            .rec-blocks { display:table; margin:0 auto; }
                .rec-blocks > div { float:left; margin-bottom:44px; width:436px; height:368px; background: #E6EEEC; position:relative; }
                .rec-blocks > div:before { position:absolute; content:''; }
                #rec1:before { top:35px; width:135px; height:135px; left:calc(50% - 67px); background:url('/img/recomendations/1.png') no-repeat; }
                #rec2:before { top:37px; width:140px; height:140px; left:calc(50% - 70px); background:url('/img/recomendations/2.png') no-repeat; }
                #rec3:before { top:43px; width:142px; height:144px; left:calc(50% - 71px); background:url('/img/recomendations/3.png') no-repeat; }
                #rec4:before { top:39px; width:160px; height:160px; left:calc(50% - 80px); background:url('/img/recomendations/4.png') no-repeat; }
                .rec-blocks > div:nth-child(2n-1) { clear:both; margin-right:44px; }
                    .rec-blocks > div > p { padding:202px 35px 20px; font-size:22px; line-height: 30px; text-align:center; }

    .rec-contact-wrapper { width:100%; position:relative; background:url('/img/recomendations/bottom.jpg') no-repeat 50% 50% / cover; }
    .rec-contact-wrapper.software-dev-img { background:url('/img/recomendations/software.jpg') no-repeat 50% 50% / cover; }
        .rec-contact { margin:0 auto; position:relative; max-width:1383px; padding:160px 0; }
            .rec-contact h2 { font-weight: 500; font-size: 60px; line-height: 78px; padding:20px 20px 50px; text-transform:uppercase; text-align:center; }
            .rec-contact > div { float:left; width:630px; }
            .rec-contact > div:first-child, .rec-contact > h2 + div { margin-right:110px; }
                .rec-contact > div > p { font-size:25px; line-height:35px; padding-bottom:10px; color:#000; }
                .rec-hide { display:none; }
            .rec-contact > p { text-align:center; padding-top:50px; line-height:50px; }
                .rec-contact > p strong { font-size:45px; color:#000; font-weight:500; }

/* cybersecurity */
    .cyber-blocks { display:table; margin:0 auto; }
        .cyber-blocks > div { float:left; margin-bottom:44px; width:427px; height:550px; background: #E6EEEC; position:relative; }
        .cyber-blocks > div:before { position:absolute; content:''; }
        #cyb1:before { top:29px; width:152px; height:152px; left:calc(50% - 76px); background:url('/img/cyber/1.png') no-repeat; }
        #cyb2:before { top:30px; width:150px; height:150px; left:calc(50% - 75px); background:url('/img/cyber/2.png') no-repeat; }
        #cyb3:before { top:30px; width:142px; height:144px; left:calc(50% - 75px); background:url('/img/cyber/3.png') no-repeat; }
        .cyber-blocks > div + div { margin-left:48px; }
            .cyber-blocks > div > h3 { padding:210px 35px 15px; color:#212121; font-weight: 500; font-size: 28px; line-height: 36px; text-align: center; }
            .cyber-blocks > div > p { padding:0px 35px 20px; font-size:18px; line-height: 26px; text-align:center; }

        .cyber-contact { max-width:1000px; display:table; margin:0 auto; text-align:center; font-size: 45px; line-height: 59px; padding:2px 20px 38px; }

/* annual */
    .annual-wrapper { width:100%; position:relative; background:url('/img/annual/annual.jpg') no-repeat 50% 50% / cover; }
        .annual { margin:0 auto; position:relative; max-width:1383px; }
            .annual > h2 { font-weight: 500; padding:100px 20px 40px; font-size: 60px; line-height: 78px; text-align: center; text-transform: uppercase; color: #212121; }
            .annual > p { font-weight: 500; font-size: 30px; line-height: 40px; text-align: center; text-transform: uppercase; color: #000; padding:0 20px 50px; }
            .annual-blocks { border: 2px solid #505050; border-radius: 3px; padding:55px; width:1030px; display:table; margin:0 auto; }
                .annual-blocks > div { position:relative; padding-top:137px; width:33%; float:left; }
                .annual-blocks > div:before { position:absolute; content:''; top:0px; }
                #ann4 { clear:both; margin-left:17%; }
                #ann1:before { background:url('/img/annual/1.png') no-repeat; width:125px; height:125px; left:calc(50% - 62px); }
                #ann2:before { background:url('/img/annual/2.png') no-repeat; width:125px; height:125px; left:calc(50% - 62px); }
                #ann3:before { background:url('/img/annual/3.png') no-repeat; width:120px; height:120px; left:calc(50% - 60px); }
                #ann4:before { background:url('/img/annual/4.png') no-repeat; width:140px; height:140px; left:calc(50% - 70px); }
                #ann5:before { background:url('/img/annual/5.png') no-repeat; width:130px; height:130px; left:calc(50% - 65px); }
                    .annual-blocks > div > p { font-size: 25px; line-height: 29px; text-align: center; color: #000; }

            .annual-end { font-size: 30px; line-height: 36px; color: #000; text-align:center; padding:50px 20px 100px; }

/* Page map */
	.pagemap-wrapper { width:100%; position:relative; background:#ffffff; }
        .pagemap { margin:0 auto; position:relative; max-width:1383px; padding:40px 0; }
            .pagemap > ol { display:table; margin:0 auto; }
                .pagemap > ol > li { margin:0 0 10px; }
                    .pagemap > ol > li > a { color:#0088cc; font-size:20px; line-height:28px; text-decoration:none; }
                    .pagemap > ol > li > a:hover, .pagemap > ul > li.active > a { text-decoration:underline; }

@media (max-width: 1640px) {
    .submenu { right: 135px; }
}

@media (max-width: 1403px) {
    .logo { left:20px; }
    .top-menu { right:20px; }
    
    .topslide > h1 { line-height: 80px !important; font-size: 60px !important; }
    .topslide-wrapper.topslide1 > .topslide > p { font-size:40px; line-height:50px; }

    /* index */
    .wdwo > h2, .wcss > h2 { font-size: 50px; line-height: 60px; }
    .wdwo > div > p, .wcss > div > p { font-size: 22px; line-height: 30px; padding-right: 20px; }

    .projects > h2 { padding-top: 70px; line-height: 60px; font-size: 48px; }
    .projects > p { font-size: 20px; line-height:28px; }
    
    /* recs */
    .rec-operations > h2 { font-size:40px; line-height:50px; }
    .rec-contact { display:table; padding: 80px 0; }
    .rec-contact > div { width: 430px; }
    .rec-contact > div > p { font-size: 20px; line-height: 28px; }
    .rec-contact > p strong { font-size: 34px; }

    /* cyber */
    .cyber-contact { font-size: 32px; line-height: 40px; }
    .cyber-blocks > div { width:300px; height:480px; }
    .cyber-blocks > div + div { margin-left:45px; }
    .cyber-blocks > div > h3 { font-size: 22px; line-height: 28px; }
    .cyber-blocks > div > p { font-size:14px; line-height: 20px; }


    .footer-wrapper { min-height: inherit; }
    
    .contact-privacy { padding:50px 20px; }
    .contact-privacy > h2 { font-size:24px; line-height:34px; }
    .contact-privacy > p { font-size:16px; line-height:26px; }
}

@media (max-width: 1300px) {
    .logo { top:12px; }
    .top-menu { top:32px; }
    .header > p { padding-top: 40px; }
    .header-wrapper.active .header > p { padding-top: 0px; }

    .includes > div { width: auto; float: none; height: auto; }
    .includes > div:nth-child(2n-1) > div, .includes > div:nth-child(2n) > div { width: auto; float: none; padding: 0 0 30px !important; }
    .includes h3 { padding: 190px 20px 30px !important; margin-right: auto !important; text-align: center !important; }
    .includes .include1 h3::before, .includes .include3 h3::before, .includes .include4 h3::before { left: calc(50% - 60px); top: 60px; }
    .includes .include2 h3::before { left: calc(50% - 67px); top: 54px; }
    .includes p { padding: 20px 20px 40px; max-width: inherit; }
    .includes a { display: table; position: relative; bottom: auto; margin:0 auto; }

    .rec-contact h2 { font-size:50px; line-height:60px; }
}

@media (max-width: 1200px) {
    .annual > h2 { padding:60px 20px 30px; font-size: 40px; line-height: 50px; }
    .annual > p { font-size: 24px; line-height: 32px; padding:0 20px 40px; }
    .annual-blocks { width:780px; padding:40px; }

    .annual-end { font-size: 24px; line-height: 32px; padding:40px 20px 60px; }
}

@media (max-width: 1120px) {
    .contact-toptext { width:auto; padding:50px 0 0; }
    .contact-toptext > p { font-size:26px; line-height:36px; padding: 0 20px; }
    .contact-toptext > p br { display:none; }
}

@media (max-width: 1000px) {
    .top-mob { display:block; }
    #open_topmenu + .top-menu { display:none; }
    #open_topmenu:checked + .top-menu { display:block; position: relative; right: auto; display: table; margin: 0 auto; padding: 0 0 55px; }
    .header-wrapper.active #open_topmenu:checked + .top-menu { padding: 52px 0 15px; }
    
    .submenu { right: auto; left: -32px; }
    .header > p { padding-top: 110px; position: relative; margin-top: 0; }
    .header-wrapper.active .header > p { width:calc(100% - 240px);}

    /* recomendations */
    .rec-blocks > div { float: none; }
    .rec-operations > p { padding:60px 20px 50px; font-size: 20px; line-height: 28px; }
    .rec-contact > div { width: auto; float: none; padding: 0 20px; }
    .rec-contact > div:first-child, .rec-contact > h2 + div { margin-right: auto; }
    
    /* cyber */
    .cyber-blocks > div { float:none; margin-bottom:40px; width:auto; height:auto; margin-left:auto !important; }


    .form-blocks { width: calc(100% - 30px); margin-bottom:30px; }
    .form-blocks > p { padding-bottom: 10px; text-align: center; }
    .rec-hide { display:inline; }
    .rec-show { display:none; }
}

@media (max-width: 900px) {
    .topslide-wrapper { height:auto !important; background-size:cover !important; min-height: inherit; }
    .topslide > h1 { padding: 120px 20px !important; line-height: 50px !important; font-size: 40px !important; }
    .topslide-wrapper.topslide1 > .topslide > h1 { padding:120px 20px 0px !important; }
    .topslide-wrapper.topslide1 > .topslide > p { font-size: 30px; line-height: 40px; padding-bottom: 80px; }

    .annual > h2 { padding:40px 20px 30px; font-size: 30px; line-height: 40px; }
    .annual > p { font-size: 22px; line-height: 28px; }
    .annual-blocks { width:auto; border:0px; }
    .annual-blocks > div { float:none; margin:0 0 40px; width: auto; }
        .annual-blocks > div > p { font-size: 16px; line-height: 24px; font-weight: 500; }
}

@media (max-width: 780px) {
    .whitehouse-wrapper , .header-wrapper { min-height:56px; }
    
    .logo { top: 15px; }
    .logo > a > img { width:70px; }
    .header > p { font-size: 14px; padding-top: 11px; margin-top: 0; }
    .top-mob { top:17px; }

    /* index */
    .wdwo > h2, .wcss > h2 { font-size: 30px; line-height: 40px; padding: 40px 20px 30px; }
    .wdwo > div::before, .wcss > div::before { left: calc(50% - 64px); width: 128px; height: 112px; background-size: contain !important; }
    .wdwo > div, .wcss > div { padding: 140px 20px 20px; }
    .wdwo > div > p, .wcss > div > p { font-size: 22px; line-height: 30px; padding-right: 20px; }
    .wcss > div > p { padding-top: 0; }
    
    .rec-contact > p { padding:50px 20px 0; }
    .rec-contact h2 { font-size:40px; line-height:50px; }

    .projects > h2 { padding: 50px 20px 0; line-height: 40px; font-size: 30px; }
    .projects > p { font-size: 16px; line-height: 24px; padding: 10px 0px 0px; }
    .form-blocks > p { padding-bottom:10px; }
    .form-div { padding-bottom: 10px; }
    .form-div > label { top:-4px; }
    .form-div > input[type="text"] { font-size:15px; padding: 8px 18px 0; }
    .form-div > textarea { font-size:15px; padding: 16px 18px 0; height: 100px; }
    .form-div > p { top:-5px; text-align:center; }

    .footer > ul { padding-top: 30px; }
    .copyright { padding: 22px 20px 20px; }
    .copyright p { text-align: center; line-height: 18px; }
    .logo-footer { padding-bottom: 20px; }
    

    .companymap-wrapper { height:600px; background-size:cover !important; }
        .companymap { padding:20px 0; }
            .companymap > h2 { font-size:30px; line-height:40px; padding:0 20px 10px; }
            .companymap > p { font-size: 14px; line-height: 20px; padding: 0 20px; }

            .map-flag-wrapper { bottom:20px; }
                .map-flags > div { float:left; margin:0 5px 10px !important; }
                .map-flags > div:nth-child(5n-4) { clear:both; }
                .map-flags > p { font-size: 16px; }

    .contact-toptext > p { font-size: 20px; line-height: 30px; }

    .howtostart .seo2-box > div { width: 340px; }

    .contact-privacy > h2 { font-size:20px; line-height:30px; }
    .contact-privacy > p { font-size:14px; line-height:20px; padding-top:10px; }
}

@media (max-width: 680px) {
    .header-wrapper.active .header > p { margin-top: auto; width: auto !important; position: relative; left: auto; padding-top: 60px; }
    #open_topmenu:checked + .top-menu { padding: 0px 0 15px !important; top:0px; }
    .top-menu > ul > li > a, .top-menu > ul > li > span { font-size:14px; }
    .submenu > li > a { font-size: 14px; line-height: 20px; padding: 8px 20px; }
    #open_topmenu { float: none; margin: 0; }
    
    .includes h3 { padding: 190px 20px 0px !important; font-size:24px; line-height:32px; }
    .includes p { font-size: 16px; line-height: 24px; }
}

@media (max-width: 500px) {
    .header > p { padding:50px 20px 0; width:auto; }
    .whitehouse-wrapper { min-height:100px; }
    .submenu { left:5px; width:calc(100% - 10px); }
    .topslide > h1 { padding: 60px 20px !important; line-height: 36px !important; font-size: 30px !important; }
    
    .wdwo > h2, .wcss > h2 { font-size: 24px; line-height: 32px; }
    .wdwo > div > p, .wcss > div > p { font-size: 16px; line-height: 24px; }

    .rec-blocks > div { width: 100%; height: auto; }
    .rec-operations > h2 { font-size:24px; line-height:32px; }
    .rec-contact > div > p { font-size: 16px; line-height: 24px; }
    .rec-contact > p { line-height: 36px; }
    .rec-contact > p strong { font-size: 28px; }
    .rec-contact h2 { font-size:24px; line-height:32px; padding:0 20px 10px; }
    .cyber-contact { font-size:24px; line-height:32px; }

    .annual-blocks { padding:0; }
    .annual > h2 { padding: 30px 20px 20px; font-size: 20px; line-height: 28px; }
    .annual-end { padding: 0px 20px 60px; }

    .form-div > label { font-size: 20px; line-height: 28px; }
    .form-div-double { padding-bottom:0px; }
    .form-div-phone { float:none; width:100%; margin-right:auto; }
    .form-div-email { float:none; width:100%; margin-right:auto; }

    .footer > ul > li > a { font-size:18px; line-height:26px; }
    .copyright p { font-size: 16px; line-height:24px; }
}

@media (max-width: 360px) {
    .whitehouse-wrapper { min-height: 134px; }
    .topslide > h1 { padding: 40px 20px !important; line-height: 32px !important; font-size: 24px !important; }
}