@import url(reset.css);
@import url(fonts.css);

html {background: #10152d;}
body {font-size: 14px; font-family: 'Geologica', sans-serif; font-weight: 300; font-weight: 400; background: #10152d; color: #fff; overflow-x: hidden; min-height: 100%; min-width: 1366px;}

body * {-webkit-transition:all 0.2s ease;-o-transition:all 0.2s ease;-moz-transition:all 0.2s ease;-ms-transition:all 0.2s ease;}


.clear {clear: both;width: 0px;height: 0px;overflow: hidden;font-size: 0px;line-height: 0px;}

a {-webkit-transition:all 0.2s ease;-o-transition:all 0.2s ease;-moz-transition:all 0.2s ease;-ms-transition:all 0.2s ease;
    text-decoration: none; color: #fff;
    -webkit-appearance: none;
}
a:hover {text-decoration: none; color: #78ff00;}

b, strong {font-weight: 600;}

body img {max-width: 100%;}


input, textarea, select {font-family: 'Geologica', sans-serif; -webkit-appearance: none; -webkit-appearance: none; border-radius: 0;
  -webkit-transition:all 0.2s ease;-o-transition:all 0.2s ease;-moz-transition:all 0.2s ease;-ms-transition:all 0.2s ease; font-weight: 300;
}

.btn {color: #fff; position: relative; text-align: center; display: inline-block; font-family: 'GothamPro-Bold', sans-serif; font-weight: 500;
  -webkit-appearance: none; border: 2px solid #0071ff; background: #0071ff; font-size: 15px; padding: 16px 20px 14px 20px; text-transform: uppercase; font-weight: bold; height: auto; color: #fff; border-radius: 50px; cursor: pointer; text-align: center;
  -webkit-transition:all 0.2s ease;-o-transition:all 0.2s ease;-moz-transition:all 0.2s ease;-ms-transition:all 0.2s ease;
}
.btn:hover {text-decoration: none; background: #78ff00; color: #000; border-color: #78ff00;}
.btn:hover:before {background-color: #000;}

.btn-white {color: #101f3e; background: #fff; border-color: #fff;}
.btn-white:hover {color: #fff; background: #101f3e; border-color: #101f3e;}

.btn-blank {color: #8e0000; background: transparent;}
.btn-blank:hover {color: #fff; background: #8e0000; border-color: #8e0000;}

.btn-super-big {font-size: 17px;}

.btn-phone {}
.btn-phone:before {content: ""; position: absolute; margin: auto; left: 19px; top: 0; bottom: 0; width: 16px; height: 16px;
  background-color: #fff;
  -webkit-mask-image: url(../images/phone.svg);
  mask-image: url(../images/phone.svg);
  mask-size: contain;
  -webkit-mask-size: contain;
}
.btn-chat {padding-left: 54px;}
.btn-chat:before {content: ""; position: absolute; margin: auto; left: 18px; top: 0; bottom: 0; width: 22px; height: 16px;
  background-color: #fff;
  -webkit-mask-image: url(../images/question.svg);
  mask-image: url(../images/question.svg);
  mask-size: contain;
  -webkit-mask-size: contain;
}
/*.btn-phone:hover:before {background-color: #b32222;}*/
.btn-wa {}
.btn-wa:before {content: ""; position: absolute; margin: auto; left: 19px; top: 0; bottom: 0; width: 16px; height: 16px;
  background-color: #fff;
  -webkit-mask-image: url(../images/wh.svg);
  mask-image: url(../images/wh.svg);
  mask-size: contain;
  -webkit-mask-size: contain;
}
/*.btn-wa:hover:before {background-color: #b32222;}*/


.pull-left {float: left;}
.pull-right {float: right;}

.desktop {display: block;}
.mobile {display: none!important;}

.cont {padding: 0 10px; position: relative; margin: 0 auto; max-width: 1486px;}


.flex {display: flex;}
.flex-justify {justify-content: space-between;}
.flex-center {align-items: center;}
.flex-wrap {flex-wrap: wrap;}

header {position: absolute; left: 0; top: 0; width: 100%;}
header .top {padding: 34px 0 26px 0;}
header .top span {font-size: 15px; line-height: 20px;}
header .top .contacts {}
header .top .contacts .mail {font-size: 15px; line-height: 20px;}
header .phone {font-size: 17px; line-height: 20px; font-family: "GothamPro-Bold"; position: relative; padding: 0 0 0 20px; margin: 0 0 0 61px;}
header .phone:before {content: ""; position: absolute; left: 0; top: 1px; width: 14px; height: 14px; 
  background-color: #fff;
  -webkit-mask-image: url(../images/phone.svg);
  mask-image: url(../images/phone.svg);
  mask-size: contain;
  -webkit-mask-size: contain;
}
header .phone:hover:before {
  background-color: #78ff00;
}
.header-cont {}
.header-cont .logo {width: 240px; height: 61px; background: url(../images/logo.png) no-repeat; background-size: contain;}
.header-cont ul {}
.header-cont ul li {margin: 0 24px;}
.header-cont ul li a {font-size: 16px; line-height: 20px; font-family: "GothamPro-Bold"; text-transform: uppercase;}
.header-cont ul li a.green {color: #78ff00; position: relative; padding-left: 20px;}
.header-cont ul li a.green:before {content: ""; width: 6px; height: 6px; border-radius: 4px; background: #78ff00; position: absolute; margin: auto; left: 0; top: 0; bottom: 0;}
.header-cont .btn {}

header .c-hamburger {
        -webkit-transition: background 0.3s;
        transition: background 0.3s;display: block;position: relative;margin: 0;padding: 0 0 0 20px;height: 20px;appearance: none;box-shadow: none;border-radius: none;border: none;cursor: pointer;transition: background 0.3s;margin: 0px 0px 0px 0px;}
header .c-hamburger:focus {outline: none;}
header .c-hamburger:hover{background: transparent;}
header .c-hamburger.is-active{background: transparent;}
header .c-hamburger.is-active {width: 0px;}
header .c-hamburger span {display: block;position: absolute;top: 10px;left: 0;width: 20px;height: 2px; border-radius: 3px; background: transparent;}
header .c-hamburger span::before,
header .c-hamburger span::after {position: absolute;display: block;left: 0;width: 100%;height: 2px;background-color: #fff;content: "";}
header .c-hamburger span::before {top: -5px;}
header .c-hamburger span::after {bottom: -5px;}
header .c-hamburger b {display: block; font-weight: 500; padding: 6px 0 0 0;}
header .c-hamburger--htx {background-color: transparent;opacity: 1;}
header .c-hamburger--htx span {transition: background 0s 0.3s;}
header .c-hamburger--htx span::before,.c-hamburger--htx span::after {transition-duration: 0.3s, 0.3s;transition-delay: 0.3s, 0s;}
header .c-hamburger--htx span::before {transition-property: top, transform;}
header .c-hamburger--htx span::after {transition-property: bottom, transform;}
header .c-hamburger--htx.is-active span {background: none;}
header .c-hamburger--htx.is-active span::before {top: 0;transform: rotate(45deg);}
header .c-hamburger--htx.is-active span::after {bottom: 0;transform: rotate(-45deg);}
header .c-hamburger--htx.is-active span::before,
header .c-hamburger--htx.is-active span::after {transition-delay: 0s, 0.3s;}

.slider {background: #12376a url(../images/advokat.jpg) left center no-repeat; background-size: cover; padding: 241px 0 0 0; margin: 0 0 64px 0;}
.slider-cont {display: flex; justify-content: right}
.slider-item {position: relative; width: 723px; height: 796px;}
.slider-item .text {}
.slider-item .text .label {font-size: 15px; line-height: 20px; font-family: "GothamPro-Bold"; text-transform: uppercase; margin: 0 0 32px 0;}
.slider-item .text h1 {font-size: 60px; line-height: 63px; font-family: "GothamPro-Bold"; text-transform: uppercase; margin: 0 0 44px 0;}
.slider-item .text .citat {background: #0071ff; color: #fff; font-size: 18px; line-height: 26px; position: relative; border-radius: 50px; padding: 39px 40px 41px 50px; margin: 0 0 39px 0;}
.slider-item .text .citat:before {content: ""; position: absolute; right: 20px; bottom: 20px; width: 37px; height: 32px;
  background-color: #fff;
  -webkit-mask-image: url(../images/quote.svg);
  mask-image: url(../images/quote.svg);
  mask-size: contain;
  -webkit-mask-size: contain;
}
.slider-item .text .short {font-size: 18px; line-height: 26px;}

.columns {padding: 0 0 32px 0;}
.columns-cont {}
.columns .column {width: 48.6%;}
.columns .column h3 {font-size: 26px; line-height: 35px; font-family: "GothamPro-Bold"; text-transform: uppercase; margin: 0 0 32px 0;}
.columns .column .short {}
.columns .column .short.bg {background: #0071ff; color: #fff; position: relative; border-radius: 50px; padding: 39px 30px 14px 50px; margin: 0 0 50px 0;}
.columns .column .short p {font-size: 18px; line-height: 26px; margin: 0 0 26px 0;}

.opyt {margin: 0 0 50px 0;}
.opyt h4 {font-size: 26px; line-height: 35px; font-family: "GothamPro-Bold"; text-transform: uppercase; margin: 0 0 32px 0;}
.opyt .text-cont-bg {background: #0071ff; color: #fff; position: relative; border-radius: 50px; padding: 50px 40px 49px 50px;}
.opyt .text-cont {margin: 0 0 40px 0;}
.opyt .text-cont .item {width: 31%;}
.opyt .text-cont .item b {display: block; font-size: 60px; line-height: 65px; font-family: "GothamPro-Bold"; margin: 0 0 20px 0;}
.opyt .text-cont .item img {height: 65px; display: block;}
.opyt .text-cont .item p {font-size: 18px; line-height: 26px;}
.opyt .btn {padding: 19px 31px; font-size: 16px;}

.seo {margin: 0 0 59px 0;}
.seo h4 {font-size: 26px; line-height: 35px; font-family: "GothamPro-Bold"; text-transform: uppercase; margin: 0 0 17px 0;}
.seo .text {font-size: 18px; line-height: 26px;}
.seo .text p {}

.publications {}
.publications h4 {font-size: 26px; line-height: 35px; font-family: "GothamPro-Bold"; text-transform: uppercase; margin: 0 0 32px 0;}
.publications-list {flex-wrap: wrap; margin: 0 0 19px 0;}
.publications-list .item {background: #0071ff; color: #fff; position: relative; border-radius: 50px; padding: 39px 40px 14px 50px; height: 222px; position: relative; width: 265px; margin: 0 22px 15px 0;}
.publications-list .item:nth-child(4n) {margin-right: 0;}
.publications-list .item:before {content: ""; position: absolute; right: 46px; bottom: 46px; width: 22px; height: 22px;
  background-color: #fff;
  -webkit-mask-image: url(../images/right.svg);
  mask-image: url(../images/right.svg);
  mask-size: contain;
  -webkit-mask-size: contain;
}
.publications-list .item p {font-size: 18px; line-height: 24px;}
.publications .btn {padding: 19px 31px; font-size: 16px;}

footer {padding: 65px 0 0 0;}
footer .top {}
footer .top .left {width: 330px;}
footer .top .left b {display: block; font-size: 26px; line-height: 35px; font-family: "GothamPro-Bold"; text-transform: uppercase; margin: 0 0 17px 0;}
footer .top .left .email {font-size: 17px; line-height: 20px; color: #0071ff;}
footer .top .left .phone {font-size: 17px; line-height: 20px; font-family: "GothamPro-Bold"; position: relative; padding: 0 0 0 20px; margin: 0 0 15px 0px; display: inline-block;}
footer .top .left .phone:before {content: ""; position: absolute; left: 0; top: 1px; width: 14px; height: 14px; 
  background-color: #fff;
  -webkit-mask-image: url(../images/phone.svg);
  mask-image: url(../images/phone.svg);
  mask-size: contain;
  -webkit-mask-size: contain;
}
footer .top .left .phone:hover:before {
  background-color: #78ff00;
}
footer .top .citat {background: #0071ff; color: #fff; font-size: 18px; line-height: 26px; position: relative; border-radius: 50px; padding: 39px 40px 41px 50px; margin: 0 0 39px 0; width: calc(100% - 466px);}
footer .top .citat:before {content: ""; position: absolute; right: 20px; bottom: 20px; width: 37px; height: 32px;
  background-color: #fff;
  -webkit-mask-image: url(../images/quote.svg);
  mask-image: url(../images/quote.svg);
  mask-size: contain;
  -webkit-mask-size: contain;
}
footer .center {padding: 36px 0 87px 0;}
footer .center .logo {width: 240px; height: 61px; background: url(../images/logo.png) no-repeat; background-size: contain; margin: 0 117px 0 0;}
footer .center ul {}
footer .center ul li {margin: 0 24px;}
footer .center ul li a {font-size: 16px; line-height: 20px; font-family: "GothamPro-Bold"; text-transform: uppercase;}
footer .center ul li a.green {color: #78ff00; position: relative; padding-left: 20px;}
footer .center ul li a.green:before {content: ""; width: 6px; height: 6px; border-radius: 4px; background: #78ff00; position: absolute; margin: auto; left: 0; top: 0; bottom: 0;}
footer .bottom {padding: 0 0 33px 0;}
footer .bottom span {}
footer .bottom a {}
footer .bottom .bd {}





@media screen and (max-width: 800px) {
	.desktop {display: none!important;}
	.mobile {display: block!important;}	
    
  body {min-width: 100%;}
  .cont {width: auto; padding: 0 20px;}

  .header-cont .logo {width: 140px; height: 35px;}
  header {padding: 16px 0;}
  header .phone {font-size: 13px; margin-left: 0;}

  .slider {padding-top: 129px; background: #12376a url(../images/slider-bg.jpg) no-repeat center; background-size: auto 100%; margin: 0 0 52px 0;}
  .slider-item {text-align: center; width: 100%; height: auto;}
  .slider-item .text .label {margin-bottom: 24px;}
  .slider-item .text h1 {font-size: 40px; line-height: 46px; margin: 0 0 355px 0;}
  .slider-item .text .citat {text-align: left; border-radius: 25px; padding: 29px 30px 29px 30px; font-size: 14px; line-height: 20px; position: relative;}
  .slider-item .text .citat:before {right: 12px; bottom: 11px; width: 23px; height: 20px;}
  .slider-item .text .citat:after {content: ""; position: absolute; margin: auto; left: 0; right: 0; top: 0; margin-top: -297px; width: 240px; height: 297px; background: url(../images/advokat-slider.png) no-repeat; background-size: contain;}
  .slider-item .text .short {font-size: 15px; line-height: 20px;}

  .columns-cont {flex-wrap: wrap;}
  .columns .column {width: 100%;}
  .opyt .text-cont {flex-wrap: wrap;}
  .opyt .text-cont .item {width: 100%;}
  .columns .column h3 {font-size: 15px; line-height: 25px; text-align: center;}
  .columns .column .short.bg {border-radius: 25px; padding: 29px 20px 10px 30px; font-size: 14px; line-height: 20px;}
  .columns .column .short.bg p {text-align: left;}
  .columns .column .short p {font-size: 14px; line-height: 20px; margin: 0 0 20px 0; text-align: center;}

  .opyt h4 {font-size: 15px; line-height: 25px; text-align: center;}
  .opyt .text-cont-bg {border-radius: 25px;}
  .opyt .text-cont .item b {font-size: 37px; line-height: 37px; text-align: center; margin-bottom: 13px;}
  .opyt .text-cont .item p {font-size: 14px; line-height: 20px; margin: 0 0 16px 0; text-align: center;}
  .opyt .text-cont .item img {margin:  0 auto; height: 57px;}
  .opyt .btn {margin: 0 auto; display: block;}

  .seo h4 {font-size: 15px; line-height: 25px; text-align: center; margin-bottom: 31px;}
  .seo .text {font-size: 14px; line-height: 20px; margin: 0 20px 0 20px; text-align: center;}

  .publications h4 {font-size: 15px; line-height: 25px; text-align: center; margin-bottom: 31px;}
  .publications-list .item {width: calc(50% - 40px); padding: 15px; border-radius: 25px; margin-right: 20px;}
  .publications-list .item:nth-child(2n) {margin-right: 0;}
  .publications-list .item p {font-size: 14px; line-height: 20px;}
  .publications-list .item:before {right: 16px; bottom: 16px;}
  .publications .btn {display: block;}

  footer .top .left {width: 100%; text-align: center; margin-bottom: 40px;}
  footer .top .left b {font-size: 15px; line-height: 25px; text-align: center; margin-bottom: 31px;}
  footer .top {flex-wrap: wrap;}
  footer .top {width: 100%;}
  footer .top .citat {text-align: left; border-radius: 25px; padding: 29px 30px 29px 30px; font-size: 14px; line-height: 20px; width: 100%;}
  footer .top .citat:before {right: 12px; bottom: 11px; width: 23px; height: 20px;}
  footer .center .logo {display: block; margin: 0 auto 30px auto; width: 170px; height: 43px;}
  footer .center {flex-wrap: wrap; text-align: center;}
  footer .center ul {flex-wrap: wrap;}
  footer .center ul li {margin: 0 0 25px 0; width: 100%;}
  footer .bottom {flex-wrap: wrap; text-align: center; font-size: 12px;}
  footer .bottom span {margin-bottom: 20px; width: 100%;}
  footer .bottom a {display: block; margin-bottom: 20px; width: 100%;}

}
































