* {
    position: relative;
}

body {
    margin: 0;
    font-family: 'SF UI Display', Arial, Helvetica, sans-serif;
    font-weight: normal;
    font-style: normal;
    color: #FFFFFF;
    font-size: 1em;
    background-color: #212328;

}

html {
    scroll-behavior: smooth;
}

.yoomoney-payment-form {
    max-height: 600px;
    overflow: auto;
}

.root {
    height: 100vh;
    width: 100%;
    display: flex;
    flex-direction: column;

    position: absolute;
}

a,
a:active,
a:hover,
a:visited {
    text-decoration: none;
    cursor: pointer;
    text-align: center;
    outline: none;
    color: #FFFFFF;
}

p {
    margin: 0;
}

img {
    max-width: 100%;
}

.content {
    flex-grow: 1;
    background-size: 100%;

}

/* Шапка */

header {
    color: #FFFFFF;
    height: 150px;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    font-size: 16px;
    z-index: 10;
    font-family: 'SF UI Display';
    font-weight: 100;
    font-style: normal;
}

header>.blocks {
    max-width: 1400px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 50px 0 50px;
}

/* Меню */



nav {
    width: 100%;
    font-size: 16px;
    display: flex;
    justify-content: center;
}

nav>.blocks {
    max-width: 1170px;
    width: 100%;
    display: flex;
    align-items: center;
    padding: 0 50px 0 50px;
}

ul.menu {
    margin: 0;
    list-style: none;
    display: flex;
    justify-content: space-between;
    margin-left: auto;
}

ul.menu>li {
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 0 15px 0 15px;
    position: relative;
}

ul.menu>li>a {
    text-transform: uppercase;
    display: block;
    color: #FFFFFF;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
}

.menu-cont>li>a {
    height: auto !important;
}

ul.menu>li::after {
    display: block;
    content: "";
    height: 2px;
    width: 0%;
    margin-right: auto;
    background: rgb(213, 18, 171);
    background: linear-gradient(90deg, #509c85, #ffffff);
    background-size: 300% 300%;
    animation: animatedgradient 2s ease alternate infinite;
    transition: all .3s ease;
}

ul.menu>li:hover::after,
ul.menu>li.active::after {
    width: 50%;
}

/* Подвал */

footer {
    font-size: 1em;
    color: #FFFFFF;
    z-index: 10;
    width: 100%;
}

footer>div {
    margin-left: auto;
    margin-right: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: auto 10% 0 10%;
    border-top: 1px solid #FFFFFF;
    height: 100px;
    flex-wrap: wrap;
}

footer>.links>a {
    margin: 0 10px;
}

footer>.links>a::after {
    display: block;
    content: "";
    height: 2px;
    width: 0%;
    margin-right: auto;
    background: rgb(213, 18, 171);
    background: linear-gradient(90deg, #509c85, #ffffff);
    background-size: 300% 300%;
    animation: animatedgradient 2s ease alternate infinite;
    transition: all .3s ease;
}

footer>.links>a:hover::after {
    width: 50%;
}

.popup_pay .modal_body {
    background: #fffffff0 !important;
    color: #000000;
}

.popup_max {
    max-width: 900px !important;
}

.modal_body {
    border: 1px solid #FFFFFF;
    border-radius: 30px;
    min-height: 200px;
    background: rgba(26, 26, 29, 0.9);
}

.modal_body>*:first-child {
    margin-top: 40px;
}

.modal_body>*:last-child {
    margin-bottom: 40px;
}

.modal_body>* {
    margin-left: 40px;
    margin-right: 40px;
}

.modal_text {
    max-height: 50vh;
    overflow: auto;
}

/* Контент */

.page {
    display: flex;
    justify-content: center;
    overflow: hidden;
}

.page>.blocks {
    max-width: 1500px;
    display: flex;
    flex-direction: column;
    width: 100%;
}

.page>.blocks>div {
    z-index: 1;
    padding: 0 50px;
    margin-bottom: 50px;
}

/* Первый блок */

#desc {
    background: url(../resources/img/bg.png) no-repeat left top, linear-gradient(0deg, rgba(26,26,29,1) 0%, rgb(18 17 22 / 50%) 60%, #4fa78a59 100%), #1a1a1d;
    background-repeat: no-repeat;
    background-size: 100%;
    flex-direction: column;
    align-items: center;
}

#desc>.blocks {
    padding-bottom: 0 !important;
    min-height: 1689px;
    position: relative;
}

#desc>.blocks::before {
    content: '';
    display: block;
    width: 1200px;
    height: 1000px;
    /*background-image: url('../resources/img/illustration2.png');*/
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    right: -150px;
    top: 6%;
}


@media(max-width: 900px) {
    #desc>.blocks {}
}

.blockmail {
    max-width: 1500px;
}

.mail {
    display: flex;
    align-items: center;
    justify-content: center;
}

.mail p {
    font-size: 3em;
    font-weight: 100;
    padding: 0 50px;
}

.desc {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    flex-direction: column;
    width: 60%;
    height: 100%;
    margin-top: 20%;
}

.desc>p {
    font-size: 3em;
}

.title {
    font-weight: 800;
    font-style: normal;
    font-size: 3em;
}

.titlemin {
    font-size: 2em;
}

.service {
    margin-top: 20%;
}

.services {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.service_item {
    width: 45%;
    max-width: 50%;
    background-size: cover;
    min-height: 300px;
    margin-top: 4em;
    display: inline-flex;
    transition: all .3s ease;
    background-color: #5f5f5f;
    border-radius: 25px;
}

.s1,
.s4,
.s5 {

    background-image: -moz-linear-gradient(90deg, rgb(159, 207, 116) 0%, rgb(80, 156, 133) 99%);
    background-image: -webkit-linear-gradient(90deg, rgb(159, 207, 116) 0%, rgb(80, 156, 133) 99%);
    background-image: -ms-linear-gradient(90deg, rgb(159, 207, 116) 0%, rgb(80, 156, 133) 99%);

}


.service_right {
    position: absolute;
    max-width: 40%;
    width: 40%;
    right: 50px;
    bottom: -20px;
    z-index: 111;
}

.service_right>.projurl {
    height: 30px;
    border-radius: calc(100 * var(--borderWidth));
    max-width: 200px;
}

.service_right>.projurl::after {
    border-radius: calc(100 * var(--borderWidth));
}




.service_item:hover {
    -webkit-transform: rotateZ(2deg) !important;
    -ms-transform: rotateZ(2deg) !important;
    transform: rotateZ(2deg) !important;
}

.service_item:hover::after {
    -webkit-transform: rotateZ(-4deg);
    -ms-transform: rotateZ(-4deg);
    transform: rotateZ(-4deg);
}

.s1::after {
    background: url('../resources/img/s1.png') no-repeat right center;
}

.s2::after {
	 background: url('../resources/img/s6.png') no-repeat right center;
 
}

.s3::after {
	background: url('../resources/img/s5.png') no-repeat right center;
   
}

.s4::after {
    
	   background: url('../resources/img/s2.png') no-repeat right center;
}

.s5::after {
	background: url('../resources/img/s4.png') no-repeat right center;
    
}

.s6::after {
    background: url('../resources/img/s3.png') no-repeat right center;
}

.service_item::after {
    background-size: contain;
    content: attr(data-img);
    flex: 1 0;
    transition: all .3s ease;
}

.s_num {
    font-weight: 800;
    font-style: normal;
    font-size: 8em;
    -webkit-text-stroke: 1px #FFFFFF;
    -webkit-text-fill-color: transparent;
    margin: -.5em 0 .2em .1em;
}

.s_name {
    font-weight: 800;
    font-style: normal;
    font-size: 2em;
    margin: 0 0 20px 30px;
}

.s_desc {
    font-weight: 400;
    font-style: normal;
    font-size: 1em;
    margin: 0 0 12px 30px;
}

.s_desc:last-child {
    margin: 0 0 30px 30px;
}

.service_text {
    max-width: 60%;
    flex: 1 0;
}

/* Первый блок конец */

/* Проекты */

.projitem {
    display: flex;
    justify-content: center;
}

.projitem>div {
    width: 100%;
    max-width: calc(50% - 5vw);
}

.projimg {
    display: flex;
    align-items: center;
    justify-content: center;
}

.projslide {
    display: flex;
    flex-direction: column;
    transition: all .3s ease;
}

.projdesc {
    font-family: 'SF UI Display';
    font-weight: 100;
    font-style: normal;
    margin: 0 50px;
    margin-top: auto;
}

.thin {
    font-weight: 100;
}

.projtitle {
    text-align: center;
    font-size: 2em;
    margin-bottom: 20px;
}

.projdesc>.line {
    width: 100%;
    height: 2px;
    margin-bottom: 20px;
}

.projdesc>.projtext {
    font-size: .9em;
}

.projhref {
    display: flex;
    justify-content: center;
    margin: 35px 0 0px 0;
    flex-wrap: wrap;
}


.desc {
    overflow: visible !important;
}


.projurl {
    cursor: pointer;
    font-family: 'SF UI Display';
    font-weight: 100;
    font-style: normal;
    padding: 4px;
    color: #FFFFFF;
    display: inline-block;
    transition: all .7s ease;
    margin: 0px 40px 0px 0px;
    text-decoration: none;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    --borderWidth: 2px;
    background: #212328;
    position: relative;
    border-radius: calc(3 * var(--borderWidth));
}

.projurl::after {
    content: '';
    position: absolute;
    top: calc(-1 * var(--borderWidth));
    left: calc(-1 * var(--borderWidth));
    height: calc(100% + var(--borderWidth) * 2);
    width: calc(100% + var(--borderWidth) * 2);
    background: linear-gradient(16deg, #509c85, #ffffff);
    border-radius: calc(4 * var(--borderWidth));
    z-index: -1;
    background-size: 300% 300%;
    animation: animatedgradient 1s ease alternate infinite;
    transition: all .7s ease;
}

.projurl:hover::after {
    box-shadow: 0 0 1px #ffffff, 0 0 10px #ffffff, 0 0 20px #ffffff, 0 0 5px #509c85, 0 0 10px #509c85, 0 0 5px #509c85, 0 0 10px #509c85, 0 0 50px #509c85;
}

.bwhite.projurl::after {
    background: #FFFFFF;
}

.bwhite.projurl:hover::after {
    box-shadow: 0 0 1px #ffffff, 0 0 10px #ffffff, 0 0 20px #ffffff, 0 0 5px #ffffff, 0 0 10px #ffffff, 0 0 5px #ffffff, 0 0 10px #ffffff, 0 0 50px #ffffff;
}

.projurl span {
    display: block;
    padding: .5em 1em;
    border-radius: 6px;
}

.ptwo .projitem:nth-child(even) {
    flex-direction: row-reverse;
}

.pthree .projdesc {
    margin-bottom: auto;
}

.pthree .projitem:nth-child(even) {
    flex-direction: row-reverse;
}

/* Проекты конец */

/* Доп проекты */

.scrollup {
    cursor: pointer;
    width: 40px;
    height: 40px;
    opacity: 0.4;
    position: fixed;
    bottom: 40px;
    right: 40px;
    display: none;
    text-indent: -9999px;
    background: url('../resources/img/icon_top.png') no-repeat;
    z-index: 100;
    border-radius: 50px;
    transition: all .3s ease;
    box-shadow: 0 0 1px #ffffff, 0 0 10px #ffffff, 0 0 20px #ffffff, 0 0 5px #509c85, 0 0 10px #509c85, 0 0 5px #509c85, 0 0 10px #509c85, 0 0 50px #509c85;
}

.scrollup:hover {
    opacity: 0.8;
}

.colors {
    display: flex;
    flex-wrap: wrap;
}

.colors>span {
    height: 35px;
    width: 35px;
    border-radius: 25px;
    border: 1px solid #FFFFFF;
    margin: 10px;
    transition: all .2s ease;
}

.colors>span:first-of-type {
    animation: pulse 2s infinite;
}

.colors>span:first-of-type::before {
    display: block;
    content: "";
    height: 30px;
    width: 30px;
    margin-top: 15px;
    margin-left: 6px;
    background: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 22.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Capa_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 452.8 452.8' style='enable-background:new 0 0 452.8 452.8;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23FFFFFF;%7D%0A%3C/style%3E%3Cg%3E%3Cg%3E%3Cpath class='st0' d='M254.5,135c-5.5,0-10-4.5-10-10c0-34.8-28.3-63.1-63.1-63.1c-34.8,0-63.1,28.3-63.1,63.1c0,5.5-4.5,10-10,10 s-10-4.5-10-10c0-45.8,37.3-83.1,83.1-83.1c45.8,0,83.1,37.3,83.1,83.1C264.5,130.5,260,135,254.5,135z'/%3E%3C/g%3E%3Cg%3E%3Cpath class='st0' d='M291.2,169.1c-1,0-2-0.1-3-0.5c-5.3-1.6-8.2-7.2-6.6-12.5c3.1-10,4.7-20.5,4.7-31.2c0-57.9-47.1-105-105-105 s-105,47.1-105,105c0,10.6,1.6,21.1,4.7,31.2c1.6,5.3-1.3,10.9-6.6,12.5c-5.3,1.6-10.9-1.3-12.5-6.6c-3.7-12-5.6-24.5-5.6-37.1 c0-68.9,56.1-125,125-125s125,56.1,125,125c0,12.7-1.9,25.1-5.6,37.1C299.5,166.4,295.5,169.1,291.2,169.1z'/%3E%3C/g%3E%3Cg%3E%3Cpath class='st0' d='M182.6,104.4c12.4,0,24.2,9.5,24.2,21.2c0,0-0.1,89.9-0.1,112c0,0,0,0.1,0,0.1v4.6c0,2.2,1.8,4,4,4 c2.2,0,4-1.8,4-4v-1.2c0.2-13.3,11.1-24.1,24.5-24.1c13.5,0,24.5,11,24.5,24.5l0,17.7c0,2.2,1.8,3.9,3.9,3.9 c2.2,0,3.9-1.8,3.9-3.9l0-1c0-12.3,12-20.9,24.3-20.9c13.5,0,24.4,11,24.4,24.5l0,17.9c0,2.1,1.7,3.8,3.8,3.8s3.8-1.7,3.8-3.8 l0-1.4c0-11.2,12.1-19.8,24-19.8c13.5,0,24.5,11,24.5,24.5l0.1,45c0,41.8-16.3,104.8-116.4,104.8c-119.3,0-135.2-60.5-133.4-125.6 c0.4-15.7,14-25,25-25V311c0,3.6,2.5,4,3.3,4s3.2-0.4,3.2-4c0-3.5,0-182.1,0-182.1C158.1,115.3,169.1,104.4,182.6,104.4 M182.6,84.4c-24.5,0-44.5,20-44.5,44.5v135.6c-16.4,5.5-30.8,20.6-31.4,42.2c-0.9,33.8,1.8,76.5,31.9,107.4 c25.4,26.1,65.1,38.8,121.5,38.8c50.7,0,88.2-14.9,111.4-44.3c16.3-20.7,25-48.5,25-80.5l-0.1-45c0-24.5-20-44.4-44.5-44.4 c-5.6,0-11.2,1.1-16.5,3.1c-7.4-14.4-22.3-24.3-39.6-24.3c-6.2,0-12,1.2-17.3,3.3c-7.5-14-22.3-23.6-39.2-23.6 c-4.3,0-8.4,0.6-12.4,1.7c0-4.1,0-8.4,0-12.7l0-41.4c0-11.3,0-16.4,0-19.1h0C226.8,103.3,206.6,84.4,182.6,84.4L182.6,84.4z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A") no-repeat;
    background-size: contain;
}

.colors>span:hover {
    box-shadow: 0 0 5px #ffffff;
}


#kp_sec {
    width: 100%;
    background-image: url('../resources/img/kp_bg.png'), -moz-linear-gradient(90deg, rgb(159, 207, 116) 0%, rgb(80, 156, 133) 99%);
    background-image: url('../resources/img/kp_bg.png'), -webkit-linear-gradient(90deg, rgb(159, 207, 116) 0%, rgb(80, 156, 133) 99%);
    background-image: url('../resources/img/kp_bg.png'), -ms-linear-gradient(90deg, rgb(159, 207, 116) 0%, rgb(80, 156, 133) 99%);
    margin: 50px 0px;
}

.kp {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-direction: column;
    max-width: 500px;
    margin-bottom: 100px;
}

.kp h2 {
    font-size: 72px;
    font-weight: 400;
}

@media(max-width: 900px) {
    .kp h2 {
        font-size: 40px;
    }

    .kp {
        margin-bottom: 50px;
    }
}

.btns {
    display: flex;
}

.btn_1 {
    border-width: 2px;
    border-color: rgb(246, 246, 246);
    border-style: solid;
    border-radius: 10px;
    width: 165px;
    height: 48px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 30px;
}

.btn_2 {
    border-radius: 10px;
    background-color: rgb(255, 255, 255);
    width: 167px;
    height: 50px;
    color: #5f5f5f;
    display: flex;
    justify-content: center;
    align-items: center;
}



.port_style_1 {

    color: #f4f2f2;
    font-size: 60px;
    margin-right: 20px;
    font-weight: bold;
    text-transform: uppercase;
}

.port_style_2 {
    color: #212328;
    font-size: 60px;
    margin-right: 20px;
    font-weight: bold;
    text-shadow: 0px 0px 3px #ffffff;
    text-transform: uppercase;
}

.port_style_3 {
    color: #5f5f5f;
    font-size: 60px;
    margin-right: 20px;
    font-weight: bold;
    text-transform: uppercase;
}

.portfolio img {
    margin-top: 50px;
    width: 100%;
}

.portfolio .btn_1 {
    margin: 50px auto 0px;
}

.btn_port {
    border-radius: 25px;
    background-image: -moz-linear-gradient(90deg, rgb(159, 207, 116) 0%, rgb(80, 156, 133) 99%);
    background-image: -webkit-linear-gradient(90deg, rgb(159, 207, 116) 0%, rgb(80, 156, 133) 99%);
    background-image: -ms-linear-gradient(90deg, rgb(159, 207, 116) 0%, rgb(80, 156, 133) 99%);
    width: 191px;
    height: 55px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #ffffff;
    margin: 50px auto 0px auto;
    transition: 0.5s;
    font-size: 20px;
    font-weight: 500;
}


#more {
    opacity: 1 !important;
    height: unset !important;
    width: unset !important;
    position: unset !important;
}

#team {
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    background-size: cover;
    min-height: 50vh;
}

#portfolio {}

#contacts {
    background: url("../resources/img/nine.png") left top no-repeat;
    min-height: calc(100vh - 100px);
    font-weight: 100;
}

#portfolio>.blocks {
    margin: 25px 0;
}

#team>.blocks {
    margin: 25px 0;
}

#card {
    background: url("/resources/img/six.png") no-repeat center center, #212328;
    background-size: cover;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
}

#contacts>.blocks {
    margin-top: 10%;
}

.cblocks {
    display: flex;
    flex-wrap: wrap;
}

.cblocks>div {
    max-width: 50%;
    flex: 1 0;
    transition: all .3s ease;
}

.contact table {
    width: 100%;
    font-size: 1.2em;
    border-spacing: 0px 20px;
    vertical-align: top;
}

.input-row {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}

.input {
    border: none;
    border-bottom: 1px solid #767677;
    background-color: transparent;
    color: inherit;
    outline: none;
    flex: 1 0;
    font-weight: 100;
    margin-left: 1em;
    padding: .5em;
    margin-bottom: .5em;
    width: 100%
}

.input::-webkit-input-placeholder {
    color: #767677;
    text-align: right;
}

.checkbox {
    color: #767677;
}

.checkbox>input {
    margin-right: 10px;
}

.g-recaptcha {
    display: none;
}

.newclient {
    text-transform: none !important;
    color: #ffffff !important;
}

.wa_i {
    background: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 22.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Слой_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 682 682' style='enable-background:new 0 0 682 682;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23FFFFFF;%7D%0A%3C/style%3E%3Cpath class='st0' d='M582.6,99.2C518.5,35.4,433.3,0.2,342.4,0.2C155.3,0.2,2.9,151.7,2.8,338c0,59.5,15.6,117.7,45.3,168.9L0,682 l180-47c49.6,26.9,105.4,41.1,162.3,41.1h0.1c187.2,0,339.5-151.6,339.6-337.9C682,248,646.7,163.1,582.6,99.2z M342.4,619.1h-0.1 c-50.6,0-100.3-13.6-143.7-39.1l-10.3-6.1L81.5,601.7L110,498.1l-6.7-10.6C75.1,442.8,60.2,391.1,60.2,338 C60.2,183.2,186.9,57.2,342.5,57.2c75.4,0,146.3,29.3,199.5,82.4s82.6,123.6,82.6,198.7C624.6,493.1,498,619.1,342.4,619.1z M497.2,408.8c-8.5-4.2-50.2-24.6-58-27.5c-7.8-2.8-13.4-4.2-19.1,4.2c-5.7,8.4-21.9,27.5-26.9,33.1c-5,5.6-9.9,6.3-18.4,2.1 c-8.5-4.2-35.8-13.1-68.2-41.9c-25.2-22.4-42.2-50-47.2-58.5c-4.9-8.5,0-12.6,3.7-17.2c9.2-11.3,18.4-23.2,21.2-28.9 c2.8-5.6,1.4-10.6-0.7-14.8c-2.1-4.2-19.1-45.8-26.2-62.7c-6.9-16.5-13.9-14.2-19.1-14.5c-4.9-0.2-10.6-0.3-16.3-0.3 c-5.7,0-14.8,2.1-22.6,10.6c-7.8,8.5-29.7,28.9-29.7,70.4s30.4,81.7,34.6,87.3s59.8,90.9,144.9,127.5c20.2,8.7,36,13.9,48.4,17.8 c20.3,6.4,38.8,5.5,53.4,3.3c16.3-2.4,50.2-20.4,57.3-40.1c7.1-19.7,7.1-36.6,4.9-40.1C511.4,415.1,505.7,413,497.2,408.8z'/%3E%3C/svg%3E%0A") no-repeat;
}

.ig_i {
    background: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 22.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Слой_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 511 511' style='enable-background:new 0 0 511 511;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23FFFFFF;%7D%0A%3C/style%3E%3Cpath class='st0' d='M510.5,150.2c-1.2-27.2-5.6-45.8-11.9-62c-6.5-17.2-16.5-32.5-29.5-45.3c-12.8-13-28.3-23.1-45.2-29.4 c-16.3-6.3-34.8-10.7-62-11.9C334.5,0.3,325.8,0,256.4,0s-78.1,0.3-105.3,1.5c-27.2,1.2-45.8,5.6-62,11.9 C72,19.9,56.6,29.8,43.8,42.9c-13,12.8-23.1,28.3-29.4,45.2c-6.3,16.3-10.7,34.8-11.9,62c-1.3,27.4-1.6,36-1.6,105.4 s0.3,78.1,1.5,105.3c1.2,27.2,5.6,45.8,11.9,62c6.5,17.2,16.6,32.5,29.5,45.3c12.8,13,28.3,23.1,45.2,29.4 c16.3,6.3,34.8,10.7,62,11.9c27.2,1.2,35.9,1.5,105.3,1.5s78.1-0.3,105.3-1.5c27.2-1.2,45.8-5.6,62-11.9 c34.3-13.3,61.5-40.4,74.8-74.8c6.3-16.3,10.7-34.8,11.9-62c1.2-27.3,1.5-35.9,1.5-105.3S511.7,177.5,510.5,150.2z M464.5,358.9 c-1.1,25-5.3,38.4-8.8,47.4c-8.6,22.3-26.3,39.9-48.5,48.5c-9,3.5-22.6,7.7-47.4,8.8c-27,1.2-35,1.5-103.2,1.5s-76.4-0.3-103.2-1.5 c-25-1.1-38.4-5.3-47.4-8.8c-11.1-4.1-21.2-10.6-29.3-19.1c-8.5-8.3-15-18.3-19.1-29.3c-3.5-9-7.7-22.6-8.8-47.4 c-1.2-27-1.5-35-1.5-103.2s0.3-76.4,1.5-103.2c1.1-25,5.3-38.4,8.8-47.4C61.6,94,68.1,84,76.7,75.8c8.3-8.5,18.3-15,29.3-19.1 c9-3.5,22.6-7.7,47.4-8.8c27-1.2,35-1.5,103.2-1.5c68.3,0,76.4,0.3,103.2,1.5c25,1.1,38.4,5.3,47.4,8.8 c11.1,4.1,21.2,10.6,29.3,19.1c8.5,8.3,15,18.3,19.1,29.4c3.5,9,7.7,22.6,8.8,47.4c1.2,27,1.5,35,1.5,103.2S465.7,331.9,464.5,358.9 z'/%3E%3Cpath class='st0' d='M256.4,124.3c-72.5,0-131.3,58.8-131.3,131.3S184,386.8,256.4,386.8c72.5,0,131.3-58.8,131.3-131.3 S328.9,124.3,256.4,124.3z M256.4,340.7c-47,0-85.2-38.1-85.2-85.2s38.1-85.2,85.2-85.2c47,0,85.2,38.1,85.2,85.2 S303.5,340.7,256.4,340.7z'/%3E%3Cpath class='st0' d='M423.6,119.1c0,16.9-13.7,30.6-30.6,30.6c-16.9,0-30.6-13.7-30.6-30.6c0-16.9,13.7-30.6,30.6-30.6 C409.8,88.4,423.6,102.2,423.6,119.1z'/%3E%3C/svg%3E%0A") no-repeat;
}

.vk_i {
    background: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 22.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Bold' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 512 512' style='enable-background:new 0 0 512 512;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23FFFFFF;%7D%0A%3C/style%3E%3Cpath class='st0' d='M424.9,277.9c-8.3-10.5-5.9-15.1,0-24.4c0.1-0.1,68.4-94.5,75.5-126.5l0,0c3.5-11.7,0-20.2-16.9-20.2h-56 c-14.3,0-20.8,7.4-24.3,15.6c0,0-28.5,68.2-68.8,112.4c-13,12.8-19,16.9-26.1,16.9c-3.5,0-8.9-4.1-8.9-15.8V126.9 c0-14-4-20.2-15.8-20.2h-88c-8.9,0-14.3,6.5-14.3,12.6c0,13.3,20.2,16.3,22.3,53.7v81c0,17.7-3.2,21-10.4,21 c-19,0-65.2-68.5-92.6-146.9c-5.5-15.2-10.9-21.4-25.3-21.4h-56C3.2,106.7,0,114,0,122.3c0,14.5,19,86.9,88.5,182.5 C134.8,370,200,405.3,259.3,405.3c35.6,0,40-7.9,40-21.4c0-62.3-3.2-68.2,14.6-68.2c8.3,0,22.5,4.1,55.8,35.6 c38,37.3,44.3,54,65.6,54h56c16,0,24-7.9,19.4-23.3C500,349.4,428.1,282.4,424.9,277.9z'/%3E%3C/svg%3E%0A") no-repeat;
}

.fb_i {
    background: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 22.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Capa_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 150 150' style='enable-background:new 0 0 150 150;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23FFFFFF;%7D%0A%3C/style%3E%3Cg%3E%3Cpath id='f_1_' class='st0' d='M86.6,150V81.6h23l3.4-26.7H86.6v-17c0-7.7,2.1-13,13.2-13l14.1,0V1c-2.4-0.3-10.8-1-20.6-1 C73,0,59.1,12.4,59.1,35.2v19.7h-23v26.7h23V150H86.6z'/%3E%3C/g%3E%3C/svg%3E%0A") no-repeat;
}

.plus_i::before {
    display: block;
    content: "";
    height: 25px;
    width: 30px;
    background: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 22.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Слой_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 512 512' style='enable-background:new 0 0 512 512;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23ffffff;%7D%0A%3C/style%3E%3Cpath class='st0' d='M256,512C114.8,512,0,397.2,0,256S114.8,0,256,0s256,114.8,256,256S397.2,512,256,512z M256,32 C132.5,32,32,132.5,32,256s100.5,224,224,224s224-100.5,224-224S379.5,32,256,32z'/%3E%3Cpath class='st0' d='M368,272H144c-8.8,0-16-7.2-16-16s7.2-16,16-16h224c8.8,0,16,7.2,16,16S376.8,272,368,272z'/%3E%3Cpath class='st0' d='M256,384c-8.8,0-16-7.2-16-16V144c0-8.8,7.2-16,16-16s16,7.2,16,16v224C272,376.8,264.8,384,256,384z'/%3E%3C/svg%3E%0A") no-repeat;
}

.login_i::before {
    display: block;
    content: "";
    height: 25px;
    width: 30px;
    background: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 22.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Слой_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 512 512' style='enable-background:new 0 0 512 512;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23ffffff;%7D%0A%3C/style%3E%3Cpath class='st0' d='M256,512C114.8,512,0,397.2,0,256S114.8,0,256,0s256,114.8,256,256S397.2,512,256,512z M256,32 C132.5,32,32,132.5,32,256s100.5,224,224,224s224-100.5,224-224S379.5,32,256,32z'/%3E%3Cpath class='st0' d='M368,272H144c-8.8,0-16-7.2-16-16s7.2-16,16-16h224c8.8,0,16,7.2,16,16C384,264.8,376.8,272,368,272z'/%3E%3Cpath class='st0' d='M282.8,357.2c-4.1,0-8.2-1.6-11.3-4.7c-6.2-6.2-6.2-16.4,0-22.6l73.9-73.9l-73.9-73.9c-6.2-6.2-6.2-16.4,0-22.6 c6.2-6.2,16.4-6.2,22.6,0l85.2,85.2c6.2,6.2,6.2,16.4,0,22.6l-85.2,85.2C291,355.7,286.9,357.2,282.8,357.2z'/%3E%3C/svg%3E%0A") no-repeat;
}

.ic_m {
    display: block;
    background-size: contain;
    height: 16px;
    width: 16px;
    margin: 4px;
}

.ic_a {
    border-radius: 10px;
    border: 1.5px solid #FFFFFF;
    margin: 2px;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .2s ease;
}

.ic_a:hover {
    box-shadow: 0 0 5px #ffffff;
}

.rcard {
    max-width: 90%;
}

.homecont {
    margin-top: 50px;
}

.homecont>div {
    opacity: 0;
    height: 0;
    transition: all 0.3s ease-out;
    position: fixed;
}

.homecont>div.pact {
    opacity: 1;
    height: unset;
    overflow: unset;
    position: unset;
}

#more .li {
    display: flex;
    justify-content: center;
}

#more .line {
    width: 80% !important;
    height: 2px;
    margin-bottom: 0;
}

/* Доп проекты конец */

/* Меню */

.menu-cont {
    padding: 50px 50px 0 50px;
}

.mobile nav {
    position: fixed;
    left: 0;
    width: 100%;
    top: 0px;
    background-color: #212328;
    z-index: 2;
}

.mobile nav>.blocks {
    margin-top: 100px;
}

.mobile nav ul {
    padding: 15px 0;
    text-align: right;
    flex-direction: column;
}

.mobile nav ul li {
    display: inline-flex;
    padding-left: 20px;
}

.mobile>.blocks>.logo>img {
    width: 200px;
}

.mobile ul.menu {
    margin-left: unset;
    width: 100%;
    flex-wrap: wrap;
}

.top2 {
    display: none !important;
}

.butts {
    display: flex;
    justify-content: center;
    margin: 25px 0;
    flex-wrap: wrap;
}

.butts>*.buttact {
    background: #212328;
}

.butts>* {
    cursor: pointer;
    font-family: 'SF UI Display';
    font-weight: 100;
    font-style: normal;
    padding: 4px;
    color: #FFFFFF;
    display: inline-block;
    transition: all .7s ease;
    margin: 5px;
    width: fit-content;
    display: flex;
    align-items: center;
    justify-content: center;

    --borderWidth: 2px;
    background: #212328;
    position: relative;
    border-radius: calc(100 * var(--borderWidth));
}

.butts span {
    display: block;
    padding: .5em 1em;
    border-radius: 6px;
}

.butts>*::after {
    content: '';
    position: absolute;
    top: calc(-1 * var(--borderWidth));
    left: calc(-1 * var(--borderWidth));
    height: calc(100% + var(--borderWidth) * 2);
    width: calc(100% + var(--borderWidth) * 2);
    background: linear-gradient(16deg, #509c85, #ffffff);
    border-radius: calc(100 * var(--borderWidth));
    z-index: -1;
    background-size: 300% 300%;
    animation: animatedgradient 1s ease alternate infinite;
    transition: all .7s ease;

}

.butts>*:not(.buttact):hover {
    box-shadow: 0 0 1px #ffffff, 0 0 10px #ffffff, 0 0 20px #ffffff, 0 0 5px #ffffff, 0 0 10px #ffffff, 0 0 5px #ffffff, 0 0 10px #ffffff, 0 0 50px #ffffff;
}

.butts>*:not(.buttact)::after {
    background: #FFFFFF;
}

.butts>*.buttact:hover::after {
    box-shadow: 0 0 1px #ffffff, 0 0 10px #ffffff, 0 0 20px #ffffff, 0 0 5px #509c85, 0 0 10px #509c85, 0 0 5px #509c85, 0 0 10px #509c85, 0 0 50px #509c85;
}

.kitem {
    display: flex;
    flex-wrap: wrap;
}

.kimg {
    max-width: 30%;
    flex: 1 0;
    align-items: center;
}

.ktext {
    max-width: 100%;
    flex: 1 0;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.kapp {
    display: flex;
    flex-wrap: wrap;
    max-width: 520px;
}

.kapp>div {
    display: block;
    content: "";
    height: 53px;
    width: 53px;
    background-size: cover;
    margin: 10px;
    transition: all .3s ease;
}

.kapp>div:hover {
    -webkit-transform: rotateZ(5deg);
    -ms-transform: rotateZ(5deg);
    transform: rotateZ(5deg);
}

.kcolumn {
    display: flex;
    flex-wrap: wrap;
}

.kul {
    font-weight: 100;
    font-size: 1.2em;
}

.form>form {
    border: 1px solid #FFFFFF;
    border-radius: 30px;
    min-height: 200px;
}

input {
    outline: none;
}

input:-webkit-autofill {
    -webkit-box-shadow: inset 0 0 0 50px #212328 !important;
    -webkit-text-fill-color: #FFFFFF !important;
    color: #FFFFFF !important;
}

.form>form>*:first-child {
    margin-top: 40px;
}

.form>form>*:last-child {
    margin-bottom: 40px;
}


.form>form>* {
    margin-left: 40px;
    margin-right: 40px;
}

.ic_js {
    background: url('../resources/img/app/js.png');
}

.ic_nodejs {
    background: url('../resources/img/app/nodejs.png');
}

.ic_php {
    background: url('../resources/img/app/php.png');
}

.ic_swift {
    background: url('../resources/img/app/swift.png');
}

.ic_vs {
    background: url('../resources/img/app/vs.png');
}

.ic_andstudio {
    background: url('../resources/img/app/andstudio.png');
}

.ic_xcode {
    background: url('../resources/img/app/xcode.png');
}

.ic_filezilla {
    background: url('../resources/img/app/filezilla.png');
}

.ic_heidisql {
    background: url('../resources/img/app/heidisql.png');
}

.ic_phpstorm {
    background: url('../resources/img/app/phpstorm.png');
}

.ic_github {
    background: url('../resources/img/app/github.png');
}

.ic_openserver {
    background: url('../resources/img/app/openserver.png');
}

.ic_mysql {
    background: url('../resources/img/app/mysql.png');
}

.ic_postgresql {
    background: url('../resources/img/app/postgresql.png');
}

.ic_appcode {
    background: url('../resources/img/app/appcode.png');
}

.ic_telega {
    background: url('../resources/img/app/telega.png');
    width: 76px !important;
}

.ic_rookee {
    background: url('../resources/img/app/rookee.png');
    width: 92px !important;
}

.ic_comagic {
    background: url('../resources/img/app/comagic.png');
    width: 93px !important;
}

.ic_mytarget {
    background: url('../resources/img/app/mytarget.png');
    width: 109px !important;
}

.ic_powerbl {
    background: url('../resources/img/app/powerbl.png');
    width: 111px !important;
}

.ic_vk2 {
    background: url('../resources/img/app/vk.png');
    width: 40px !important;
}

.ic_yadirect {
    background: url('../resources/img/app/yadirect.png');
    width: 115px !important;
}

.ic_gads {
    background: url('../resources/img/app/gads.png');
    width: 128px !important;
}

.ic_dzen {
    background: url('../resources/img/app/dzen.png');
    width: 98px !important;
}

.ic_roistat {
    background: url('../resources/img/app/roistat.png');
    width: 103px !important;
}

.ic_ps {
    background: url('../resources/img/app/ps.png');
}

.ic_ai {
    background: url('../resources/img/app/ai.png');
}

.ic_lr {
    background: url('../resources/img/app/lr.png');
}

.ic_ae {
    background: url('../resources/img/app/ae.png');
}

.ic_corel {
    background: url('../resources/img/app/corel.png');
}

.ic_pinterest {
    background: url('../resources/img/app/pinterest.png');
}

.ic_canva {
    background: url('../resources/img/app/canva.png');
}

.ic_minter {
    background: url('../resources/img/app/minter.png');
    width: 160px !important;
}

.ic_smm {
    background: url('../resources/img/app/smm.png');
    width: 146px !important;
}

.ic_instaplus {
    background: url('../resources/img/app/instaplus.png');
    width: 100px !important;
}

.ic_freepik {
    background: url('../resources/img/app/freepik.png');
    width: 144px !important;
}

.ktheme {
    display: flex;
    align-items: center;
}

.ktheme:first-child {
    margin-left: 50px;
}

.ktheme>div {
    margin: 0 5px;
}

.ic_instagram {
    content: "";
    display: block;
    height: 32px;
    width: 32px;
    background: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 22.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Слой_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 64 64' style='enable-background:new 0 0 64 64;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bclip-path:url(%23SVGID_2_);%7D .st1%7Bclip-path:url(%23SVGID_4_);fill:url(%23SVGID_5_);%7D .st2%7Bclip-path:url(%23SVGID_4_);fill:%23FFFFFF;%7D%0A%3C/style%3E%3Cg id='Векторный_смарт-объект_1_'%3E%3Cg%3E%3Cdefs%3E%3Crect id='SVGID_1_' width='64' height='64'/%3E%3C/defs%3E%3CclipPath id='SVGID_2_'%3E%3Cuse xlink:href='%23SVGID_1_' style='overflow:visible;'/%3E%3C/clipPath%3E%3Cg class='st0'%3E%3Cdefs%3E%3Crect id='SVGID_3_' y='0' width='64' height='64'/%3E%3C/defs%3E%3CclipPath id='SVGID_4_'%3E%3Cuse xlink:href='%23SVGID_3_' style='overflow:visible;'/%3E%3C/clipPath%3E%3ClinearGradient id='SVGID_5_' gradientUnits='userSpaceOnUse' x1='-0.2308' y1='0.5978' x2='0.4349' y2='0.5978' gradientTransform='matrix(-80.4076 -80.4076 -80.4076 80.4076 88.2702 -7.8626)'%3E%3Cstop offset='0' style='stop-color:%23FEC053'/%3E%3Cstop offset='0.3273' style='stop-color:%23F2203E'/%3E%3Cstop offset='0.6485' style='stop-color:%23B729A8'/%3E%3Cstop offset='1' style='stop-color:%235342D6'/%3E%3C/linearGradient%3E%3Cpath class='st1' d='M1.7,17.7H3v28.7C3,54.4,9.7,61,18,61h28c8.3,0,15-6.6,15-14.7V17.7C61,9.6,54.3,3,46,3H18 C9.7,3,3,9.6,3,17.7H1.7H0.3c0-9.6,8-17.3,17.7-17.3h28c9.7,0,17.7,7.8,17.7,17.3v28.7c0,9.6-8,17.3-17.7,17.3H18 c-9.7,0-17.7-7.8-17.7-17.3l0-28.7H1.7z'/%3E%3Cpath class='st2' d='M40.4,14.1H23.6c-5.2,0-9.4,4.3-9.4,9.6v16.5c0,5.3,4.2,9.6,9.4,9.6h16.9c5.2,0,9.4-4.3,9.4-9.6V23.8 C49.9,18.5,45.6,14.1,40.4,14.1 M46.7,40c0,3.7-2.9,6.7-6.5,6.7H23.9c-3.6,0-6.5-3-6.5-6.7V24c0-3.7,2.9-6.7,6.5-6.7h16.3 c3.6,0,6.5,3,6.5,6.7V40z'/%3E%3Cpath class='st2' d='M32,22.8c-5,0-9,4.1-9,9.2s4,9.2,9,9.2s9-4.1,9-9.2S37,22.8,32,22.8 M32,37.9c-3.2,0-5.8-2.6-5.8-5.9 c0-3.3,2.6-5.9,5.8-5.9s5.8,2.6,5.8,5.9C37.8,35.3,35.2,37.9,32,37.9'/%3E%3Cpath class='st2' d='M43.5,22.3c0,1.1-0.9,2.1-2,2.1s-2-0.9-2-2.1c0-1.1,0.9-2.1,2-2.1S43.5,21.2,43.5,22.3'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A") no-repeat;
}

.ic_vk {
    content: "";
    display: block;
    height: 32px;
    width: 32px;
    background: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 22.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Слой_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 64 64' style='enable-background:new 0 0 64 64;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bclip-path:url(%23SVGID_2_);%7D .st1%7Bclip-path:url(%23SVGID_4_);fill:none;stroke:%2345668E;stroke-width:3.3287;stroke-miterlimit:10;%7D .st2%7Bclip-path:url(%23SVGID_4_);fill:%23FFFFFF;%7D%0A%3C/style%3E%3Cg id='Векторный_смарт-объект_1_'%3E%3Cg%3E%3Cdefs%3E%3Crect id='SVGID_1_' width='64' height='64'/%3E%3C/defs%3E%3CclipPath id='SVGID_2_'%3E%3Cuse xlink:href='%23SVGID_1_' style='overflow:visible;'/%3E%3C/clipPath%3E%3Cg class='st0'%3E%3Cdefs%3E%3Crect id='SVGID_3_' y='0' width='64' height='64'/%3E%3C/defs%3E%3CclipPath id='SVGID_4_'%3E%3Cuse xlink:href='%23SVGID_3_' style='overflow:visible;'/%3E%3C/clipPath%3E%3Cpath class='st1' d='M46.3,1.7H17.7C8.9,1.7,1.7,9,1.7,18v28c0,9,7.2,16.3,16,16.3h28.7c8.8,0,16-7.3,16-16.3V18 C62.3,9,55.1,1.7,46.3,1.7z'/%3E%3Cpath class='st2' d='M41.1,42.6h-0.1c-1.6-0.3-2.7-1.4-3.7-2.5c-0.5-0.6-1.3-2-2.3-1.8c-1.4,0.2-0.7,2.6-1.3,3.6 c-0.5,0.8-2.5,0.7-3.8,0.5c-4.3-0.5-6.5-2.8-8.5-5.2c-2.1-2.6-3.7-5.4-5.2-8.5c-0.5-1-1.1-2.1-1.1-3.3c0.7-0.6,1.8-0.4,3-0.4 c1,0,2.5-0.2,3.2,0.1c0.4,0.2,0.9,1.4,1.2,2.1c0.8,1.7,1.5,2.9,2.5,4.3c0.4,0.6,1.1,1.7,1.8,1.6c0.7-0.1,0.8-1.9,0.8-3.1 c0-1.3,0-2.9-0.4-3.6c-0.4-0.6-1-0.7-1.6-1c0.5-1.1,2-1.2,3.8-1.2c1.5,0,3.6-0.2,4.2,0.8c0.6,1,0.2,2.8,0.1,4.2 c0,1.5-0.3,3.1,0.7,3.8c0.8-0.1,1.3-0.9,1.7-1.5c1-1.4,1.7-2.5,2.5-4.3c0.3-0.7,0.7-1.9,1.3-2.2c0.9-0.3,2.3-0.1,3.7-0.1 c1.1,0,3-0.3,3.4,0.5c0.3,0.6-0.6,2.2-0.8,2.6c-1,1.6-2,2.7-3.1,4.1c-0.4,0.6-1.3,1.5-1.3,2.4c0,0.7,0.7,1.2,1.3,1.7 c1.2,1.1,2,1.9,2.9,3.1c0.4,0.5,1.1,1.4,1,2C46.8,43.3,42.5,42.2,41.1,42.6'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A") no-repeat;
}

.oneul>li {
    list-style-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='20px' height='21px'%3E%3Cimage x='0px' y='0px' width='20px' height='21px' xlink:href='data:img/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAVCAYAAABG1c6oAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAABmJLR0QA/wD/AP+gvaeTAAAAB3RJTUUH5gYJERkFCA98xQAABBRJREFUOMudlVuIVWUUx3/r23uffeacs8+Z23HUNEklR7SopDKikiKKwiiiQp8KwlBBC6WbRqn1UJJILyJGRCQVFVYWYhciDGpACmusBmtujo5O41yaObd9+VYPxyKxRPs/rfXw/dZ/Paz/J5zW41uflSM9R0gSK/kgYP6cdt2wcp1ygRKANc8/Id193Y6IpBR1AAsSu46TzJw+I1lyzQ3ce9td5wWXT776VHa8ucspXuq2qZveX51k++TR0pdAFdUyQk2QsNhStIuvvFpX3P/gOcHy+p7d8t6+D1JAYeGt7omen3NiPJ0UTfZOHC1v08QOCzIJVIEwk8kkl81baDeuXP+vYBPFMSAC4jdkNJ5+SQVRzamaZflZQUfjnOD9hqJ/s8I0RZtK5XL22+86UvesXu6uf+kZOQuYTqXrlaqJYyotxZBCS4yXUoxJjAhX+QXvnZZ5uQPNs7NrBC5CaI2jOPfLr13ppY884K7evP5vsMllswgoQpIkZkwEpl9cJp1JcD3F9RTHVUS0TVyeLi7Ifd/WntvpB84CoKhqg76Bfn/ZYw+ZPZ99LCafDUBEgSSJ5eTpObROjfB8xfMsqZTieYrngxHri6t3Ns7yD8y4PLuvbW7mDlRzE6WS13HoIOaW625Sz/UsSBLVbF+SCLWKEIfQ0GBJZQS/QWjIGXKBodDo0Njk0tLsSUuL215ocpaKSBZwT54aEhcgHwQMj5xKahW6wpqhVhWi0GDVJZVycYxgDBjAMQYjYGM7fvxIedfQQG0/igMISh1YCAo6PHIqKY9xOBMIYc0QhQY3ZU7DBCOKI4JjlMmRqKv7h/LbUZgcFmRUhTIQtxWn2LrDXKBAMtwddwatKaLQEMeGbN7BCH/DxGo0+Fvl8+M91S9AekD6FE6ATmQaMtGiBVdQd5jLK6hVK2EcuXFYE9dPu/UVBYwIUcUO9XZOvlsaT34UpFdhAPjdiExkM7lwybU32vtuv1vrwHwBEItqFEemEtYkaG41OAYcIzo6WDvY/1P5I2u1B6UPkeOgI67jVtqKbeHOzdv1LV4DqDtszBdA1QJxHDHueSZwHdCYyb6u0t6RwVoHQq8g/QhDIONp36/On9OebHl0wxknWAcGecSIokQ2NifzTWZGbdJ29h6a+DCsaQ8ivaDHgGExUgqyQXj9osV21fKHz7pnFyDIBqT9tK1Wq6HAN0k5+rq7s3QQtAwyCDoIMua4bnnalKnRjue26W5e/e88BFi1aZ3pP9afEaQJaFZVT0TKqjoqIn/4vl+bP7c92bJ2wznjy/2rmD1ztg4cP1azNhkTkSqCKBoax6k2BoXwja077XkF7D+bFRvXyvDosBPHsTHGkPI8O3XKtOSVjS9e8Fdwhta+8KQ89fIm+T9v/wQgk8wtEbJVCwAAAABJRU5ErkJggg==' /%3E%3C/svg%3E");
}

.twoul>li {
    list-style-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='20px' height='21px'%3E%3Cimage x='0px' y='0px' width='20px' height='21px' xlink:href='data:img/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAVCAYAAABG1c6oAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAABmJLR0QA/wD/AP+gvaeTAAAAB3RJTUUH5gYJERkFCA98xQAABBRJREFUOMudlVuIVWUUx3/r23uffeacs8+Z23HUNEklR7SopDKikiKKwiiiQp8KwlBBC6WbRqn1UJJILyJGRCQVFVYWYhciDGpACmusBmtujo5O41yaObd9+VYPxyKxRPs/rfXw/dZ/Paz/J5zW41uflSM9R0gSK/kgYP6cdt2wcp1ygRKANc8/Id193Y6IpBR1AAsSu46TzJw+I1lyzQ3ce9td5wWXT776VHa8ucspXuq2qZveX51k++TR0pdAFdUyQk2QsNhStIuvvFpX3P/gOcHy+p7d8t6+D1JAYeGt7omen3NiPJ0UTfZOHC1v08QOCzIJVIEwk8kkl81baDeuXP+vYBPFMSAC4jdkNJ5+SQVRzamaZflZQUfjnOD9hqJ/s8I0RZtK5XL22+86UvesXu6uf+kZOQuYTqXrlaqJYyotxZBCS4yXUoxJjAhX+QXvnZZ5uQPNs7NrBC5CaI2jOPfLr13ppY884K7evP5vsMllswgoQpIkZkwEpl9cJp1JcD3F9RTHVUS0TVyeLi7Ifd/WntvpB84CoKhqg76Bfn/ZYw+ZPZ99LCafDUBEgSSJ5eTpObROjfB8xfMsqZTieYrngxHri6t3Ns7yD8y4PLuvbW7mDlRzE6WS13HoIOaW625Sz/UsSBLVbF+SCLWKEIfQ0GBJZQS/QWjIGXKBodDo0Njk0tLsSUuL215ocpaKSBZwT54aEhcgHwQMj5xKahW6wpqhVhWi0GDVJZVycYxgDBjAMQYjYGM7fvxIedfQQG0/igMISh1YCAo6PHIqKY9xOBMIYc0QhQY3ZU7DBCOKI4JjlMmRqKv7h/LbUZgcFmRUhTIQtxWn2LrDXKBAMtwddwatKaLQEMeGbN7BCH/DxGo0+Fvl8+M91S9AekD6FE6ATmQaMtGiBVdQd5jLK6hVK2EcuXFYE9dPu/UVBYwIUcUO9XZOvlsaT34UpFdhAPjdiExkM7lwybU32vtuv1vrwHwBEItqFEemEtYkaG41OAYcIzo6WDvY/1P5I2u1B6UPkeOgI67jVtqKbeHOzdv1LV4DqDtszBdA1QJxHDHueSZwHdCYyb6u0t6RwVoHQq8g/QhDIONp36/On9OebHl0wxknWAcGecSIokQ2NifzTWZGbdJ29h6a+DCsaQ8ivaDHgGExUgqyQXj9osV21fKHz7pnFyDIBqT9tK1Wq6HAN0k5+rq7s3QQtAwyCDoIMua4bnnalKnRjue26W5e/e88BFi1aZ3pP9afEaQJaFZVT0TKqjoqIn/4vl+bP7c92bJ2wznjy/2rmD1ztg4cP1azNhkTkSqCKBoax6k2BoXwja077XkF7D+bFRvXyvDosBPHsTHGkPI8O3XKtOSVjS9e8Fdwhta+8KQ89fIm+T9v/wQgk8wtEbJVCwAAAABJRU5ErkJggg==' /%3E%3C/svg%3E");
}

.inst_but {
    flex-direction: column;
    align-items: center;
}

.inst_but>* {
    margin-bottom: 20px;
}

.inst_but>*:last-of-type {
    margin-bottom: 5px;
}

.hor_buts {
    margin-bottom: 40px !important;
}

.big_but {
    font-weight: 600;
}

.popup-fade {
    display: none;
    justify-content: center;
    position: fixed;
    width: 100%;
    top: 0;
    height: 100%;
    z-index: 300;
    max-height: 100vh;
}

.popup-fade:before {
    content: '';
    background: #000;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0.7;
    z-index: 301;
}

.popup {
    position: relative;
    padding: 20px;
    max-width: 500px;
    width: 100%;
    height: fit-content;
    z-index: 302;
    opacity: 1;
    margin: auto;
}

.popup>*>* {
    z-index: 303;
}

.popup .form>form {
    background: rgba(26, 26, 29, 0.9);
}

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

    .phonetext>p:first-child {
        font-size: 3em !important;
    }

    .service_item {
        width: 100%;
        max-width: 100%;
    }

    .ptwo .projitem:nth-child(even) {
        flex-direction: column;
    }

    .pthree .projitem:nth-child(even) {
        flex-direction: column;
    }

    .pone.projimg {
        display: none;
    }

    .projitem {
        flex-direction: column;
    }

    .projimg {
        max-width: 100% !important;
    }

    .projslide {
        margin-top: 50px;
        max-width: 100% !important;
    }

}


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

    .phones4>div:nth-of-type(3),
    .phones4>div:nth-of-type(4) {
        display: none;
    }

    .phones4>div {
        width: 30% !important;
    }

    .tablewidth {
        overflow-x: auto;
    }

    .phones3blocks {
        position: relative !important;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }

    .phones3blocks>div {
        position: relative !important;
        right: unset !important;
        left: unset !important;
        top: unset !important;
        bottom: unset !important;
        margin: 5px;
    }

    .phones2img {
        order: -1;
    }

    .phones {
        height: 25em !important;
    }

    .mail p {
        font-size: 1.5em;
    }

    .cblocks {
        flex-direction: column;
    }

    .cblocks>div {
        max-width: 100%;
    }

    .desc>p {
        font-size: 1.8em;
        text-align: center;
    }

    nav {
        font-size: 15px;
    }

    .blocks {
        width: auto;
    }
	
	.home_svg {
		right: 20%;
    	left: 20%;
		margin: 0 !important;
	}
	
	.desc > p {
		    font-size: 3em !important;
			text-align: center;
			margin: auto;
			margin-top: 20%;
	}

}

@media screen and (max-width: 700px) {
	.logo img {
		width: 60px !important;
		margin-left: 20px;
	}
	
	header.mobile .blocks .hamburger {
		right: 20px !important;
	}
	
	

    .desc {
        margin-top: 5%;
        margin-bottom: 0 !important;
    }

    .page>.blocks>div {
        margin-bottom: 0px;
        margin-top: 0px;
    }

    #services {
        margin-top: 300px;
    }

    .projhref {
        margin-top: 0px;
    }

    #desc>.blocks::before {
        width: 500px;
        height: 500px;
        left: calc(50% - 250px);
        top: 10%;
    }

    .shop .title {
        font-size: 3em !important;
    }

    .shop .desc {
        flex-direction: column !important;
        margin-top: 0px !important;
    }

    .top2 {
        margin-bottom: 0 !important;
    }

    .phones7 {
        flex-direction: column !important;
    }

    .phones7>div {
        max-width: 100% !important;
    }

    .phones {
        max-width: 100% !important;
        width: 100% !important;
        margin-bottom: 60vw;
    }

    .phones6 {
        max-width: 100% !important;
        width: 100% !important;
        margin-bottom: 60vw;
    }

    .phones>div {
        left: 12% !important;
    }

    .phones2>div {
        right: 2% !important;
    }

    .phones6>div {
        right: 30% !important;
    }

    .shop .desc>.phonetext {
        width: 100% !important;
        max-width: 100% !important;
    }

    .kitem {
        flex-direction: column;
    }

    .kimg {
        max-width: 100%;
    }

    .top1 {
        display: none;
    }

    .top2 {
        display: flex !important;
    }

    .top2>.projurl {
        margin: 5px 20px;
    }

    .projurl span {
        padding: .5em .5em;
    }
	
	.desc > p {
		margin-top: 45%;
	}
}

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

    .title {
        font-size: 2em;
    }

    .titlemin {
        font-size: 1.4em;
    }

    #desc {
        background-size: 180%;
    }

    .s_name {
        font-size: 1.2em;
    }

    .s_desc {
        font-size: .7em;
    }

    .page>.blocks>div {
        padding: 20px;
    }
	
	.desc > p {
		margin-top: 40%;
	}

}

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

    .mobile ul.menu-cont {
        justify-content: center;
    }

    .projurl {
        font-size: .8em;
    }

    .projdesc {
        margin: unset;
    }

    header>.blocks {
        padding: 0 25px 0 25px !important;
    }

    footer {
        font-size: 0.8em;
    }

}

/* Кнопка меню */

header.mobile .blocks .hamburger {
    -webkit-box-ordinal-group: 2;
    -webkit-order: 1;
    -ms-flex-order: 1;
    order: 1;
    display: flex;
    position: fixed;
    right: 50px;
}

.hamburger {
    display: none;
    width: 30px;
    height: 30px;
    margin-left: 30px;
    cursor: pointer;
    z-index: 200;
}

.hamburger svg {
    width: 30px;
    height: 30px;
    fill: #ffffff;
}

/* Конец кнопки меню */

/* Линия */

.line {
    background: rgb(213, 18, 171);
    background: linear-gradient(90deg, #509c85, #ffffff);
    width: 180px;
    height: 2px;
    margin-bottom: 50px;
    margin-top: 10px;
    background-size: 300% 300%;
    animation: animatedgradient 2s ease alternate infinite;
}

/* Линия конец */

#tooltip {
    z-index: 9999;
    position: absolute;
    display: none;
    top: 0px;
    left: 0px;
    width: auto;
    background-color: #509c85;
    padding: 5px 10px 5px 10px;
    color: #FFFFFF;
    border: 1px solid #509c85;
    border-radius: 5px;
    box-shadow: 0 1px 2px #509c85;
}

input[type="checkbox"]:checked,
input[type="checkbox"]:not(:checked),
input[type="radio"]:checked,
input[type="radio"]:not(:checked) {
    position: absolute;
    left: -9999px;
}

input[type="checkbox"]:checked+label,
input[type="checkbox"]:not(:checked)+label,
input[type="radio"]:checked+label,
input[type="radio"]:not(:checked)+label {
    display: inline-block;
    position: relative;
    padding-left: 28px;
    line-height: 20px;
    cursor: pointer;
}

input[type="checkbox"]:checked+label:before,
input[type="checkbox"]:not(:checked)+label:before,
input[type="radio"]:checked+label:before,
input[type="radio"]:not(:checked)+label:before {
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    width: 18px;
    height: 18px;
    border: 1px solid #767677;
    background-color: #212328;
}

input[type="checkbox"]:checked+label:before,
input[type="checkbox"]:not(:checked)+label:before {
    border-radius: 5px;
}

input[type="radio"]:checked+label:before,
input[type="radio"]:not(:checked)+label:before {
    border-radius: 100%;
}

input[type="checkbox"]:checked+label:after,
input[type="checkbox"]:not(:checked)+label:after,
input[type="radio"]:checked+label:after,
input[type="radio"]:not(:checked)+label:after {
    content: "";
    position: absolute;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

input[type="checkbox"]:checked+label:after,
input[type="checkbox"]:not(:checked)+label:after {
    left: 3.5px;
    top: 5px;
    width: 10px;
    height: 5px;
    border-radius: 1px;
    border-left: 3px solid #767677;
    border-bottom: 3px solid #767677;
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

input[type="radio"]:checked+label:after,
input[type="radio"]:not(:checked)+label:after {
    left: 5px;
    top: 5px;
    width: 10px;
    height: 10px;
    border-radius: 100%;
    background-color: #767677;
}

input[type="checkbox"]:not(:checked)+label:after,
input[type="radio"]:not(:checked)+label:after {
    opacity: 0;
}

input[type="checkbox"]:checked+label:after,
input[type="radio"]:checked+label:after {
    opacity: 1;
}

.form_big .input {
    font-size: 18px;
}

.form_big label {
    font-size: 18px;
}

.form_big .projurl span {
    font-size: 18px;
}

.pay_text {
    font-size: 16px;
}


@keyframes animatedgradient {
    0% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}

/* 
  @keyframes animatetop {
    0% {
      background-position:  100% 0%, 50% 10%, 100% 0%;
    }
    50% {
        background-position:  101% 1%, 51% 11%, 99% 0%;
    }
    100% {
        background-position:  100% 0%, 50% 10%, 100% 0%;
      }
  } */

@-webkit-keyframes pulse {
    0% {
        -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.4);
    }

    70% {
        -webkit-box-shadow: 0 0 0 8px rgba(109, 109, 109, 0);
    }

    100% {
        -webkit-box-shadow: 0 0 0 0 rgba(109, 109, 109, 0);
    }
}

@keyframes pulse {
    0% {
        -moz-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.4);
        box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.4);
    }

    70% {
        -moz-box-shadow: 0 0 0 8px rgba(109, 109, 109, 0);
        box-shadow: 0 0 0 8px rgba(109, 109, 109, 0);
    }

    100% {
        -moz-box-shadow: 0 0 0 0 rgba(109, 109, 109, 0);
        box-shadow: 0 0 0 0 rgba(109, 109, 109, 0);
    }
}


#cookiesf-using-message .message-content,
#cookiesf-using-message #accept-cookiesf-doc,
#cookiesf-using-message,
#cookiesf_doc_body #sh1,
#cookiesf_doc_body #sh2,
#cookiesf_doc_body #cookiesf_doc_msg {
    color: #fff !important;
}

#cookiesf_doc_body #cookiesf_doc_msg {
    font-family: 'SF UI Display' !important;
    border: none !important;
}

#cookiesf-using-message .messagecoo #accept-cookiesf {
    color: #000 !important;
    background-color: #ffffff !important;
    font-weight: 400 !important;
    text-shadow: none !important;
}

#cookiesf-using-message .cookiesf-content {
    background-color: #00000073 !important;
    border-radius: 10px !important;
    padding: 10px !important;
}

#cookiesf-using-message {
    background-color: #fff0 !important;
}

#cookiesf_doc_body {
    background-color: #7c7c7cd6 !important;
}

#cookiesf_doc_body #cookiesf_doc_msg {
    background-color: #00000073 !important;
    padding: 35px 35px 35px 35px !important;
}

#cookiesfpopupCloseButton {
    background: #ffffff00 !important;
    font-size: 15px !important;
    right: 0 !important;
    top: 0 !important;
}



/* --------------------------ПОРТФОЛИО------------------------ */

.block_title_porfolio {
    border-radius: 25px;
    background-image: -moz-linear-gradient(90deg, rgba(213,18,171,1), rgba(90,152,234,1));
    background-image: -webkit-linear-gradient(90deg, rgba(213,18,171,1), rgba(90,152,234,1));
    background-image: -ms-linear-gradient(90deg, rgba(213,18,171,1), rgba(90,152,234,1));
    position: relative;
    width: 100%;
    height: 309px;
    z-index: 16;
    text-align: center;
    margin: -250px auto 0px auto;
    display: flex;
    justify-content: center;
    align-items: center;
}

.block_title_porfolio h1 {
    font-size: 90px;
    color: #ffffff;
}




.portfolio_page .title {
    display: flex;
    align-items: center;
    margin-top: 100px;
    margin-bottom: 70px;
    margin-top: 0px;
}

.portfolio_page .title h2 {
    color: #ffffff;
    display: inline;
    position: relative;
}

.portfolio_page .title h2::before {
    display: block;
    content: '';
    background: rgb(213, 18, 171);
    background: linear-gradient(90deg, #509c85, #ffffff);
    background-size: 300% 300%;
    animation: animatedgradient 2s ease alternate infinite;
    width: 70%;
    height: 6px;
    position: absolute;
    bottom: -6px;
}

.portfolio_page .title p {
    font-size: 20px;
    font-weight: 300;
    margin: 20px 0px 0px 10px;
    color: #5f5f5f;
}

.container_porfolio {
    display: flex;
    flex-wrap: wrap;
    margin: 20px auto 0px auto;
    padding: 0px 25px;
    max-width: 1540px;
    width: auto;
}

.container {
    margin: 0 auto;
    padding: 0px 25px;
    max-width: 1500px;
    width: auto;
}

.port_block {
    width: calc(25% - 40px);
    margin: 20px;
}

.main_port_block {
    width: calc(33% - 40px);
    margin: 20px;
    border-radius: 25px;
}

.port_block img {
    max-width: 100%;
	width: 100%;
    position: unset;
    max-height: 230px;
	object-fit: cover;
	height: 100%;
}

.main_port_block {
    position: relative;
    overflow: hidden;
}

.main_port_block img {
    width: 100%;
    border-radius: 25px;
    position: unset;
	object-fit: cover;
    max-height: 311px;
	height: 100%;
}

.btn_port_item {
    bottom: 10px;
    right: 20px;
    position: absolute;
    z-index: 50;
    cursor: pointer;
    transition: 0.5s;
}

.btn_port_item:hover {
    transform: scale(1.05);
}

.btn_port_item img {
    width: 30px;
    height: unset;
}

.mfp-figure {
	max-width: 1600px !important;
	width: calc(100% - 200px);
	border-radius: 40px;
	margin:0px 100px !important;
}

img.mfp-img {
	border-radius: 40px;
}

.main_port_block a,
.port_block a {
    position: unset;
}

.main_sec_port {
    height: 450px !important;
}

.flex_item {
    color: white;
    display: flex;
    justify-content: space-between;
    position: absolute;
    opacity: 0;
    transition: 0.5s;
    background: linear-gradient(180deg, rgba(39, 37, 38, 0.7) 0%, rgba(39, 37, 38, 0) 145.17%);
    height: calc(100% - 40px);
    width: calc(100% - 40px);
    padding: 20px;
    border-radius: 22px;
	cursor: pointer;
}

.main_port_block:hover .flex_item {
    opacity: 1;
}

.port_block .flex_item {
	border-radius: 0px;
}

.port_block:hover .flex_item {
    opacity: 1;
}

.flex_item h3 {
    font-size: 24px;
    font-weight: 700;
    margin: 0px 0px 20px 0px;
}



.light {
    font-size: 12px;
    font-weight: 300;
}


.toptitle {
    font-size: 6em;
    font-family: 'SF UI Display';
    font-weight: bold;
    font-style: normal;
    
    color: white;
    margin-top: 100px;
	margin-bottom: 50px;
}

.line {
    
    width: 180px;
    height: 6px;
    margin-bottom: 50px;
    margin-top: 20px;
   
	
}

.toptitle::before {
    display: block;
	content: '';
	width: 180px;
	height: 6px;
	background: rgb(213, 18, 171);
    background: linear-gradient(90deg, #509c85, #ffffff);
	 background-size: 300% 300%;
    animation: animatedgradient 2s ease alternate infinite;
	position: absolute;
	bottom: -10px;
}



.p_zag {
    font-size: 22px;
    max-width: 1200px;
    margin: 0 auto;
}



.puncts {
    display: flex;
    padding-inline-start: 0px !important;
    margin-top: 100px;
    align-items: center;
    flex-wrap: wrap;
}

.puncts li {
    list-style-type: none;
    font-size: 28px;
    margin: 25px 30px 25px 0px;
}

.swiper-pagination-bullet {
    list-style-type: none !important;
    font-size: 28px !important;
    margin: 25px 30px 25px 0px !important;
    display: block;
}



.swiper-pagination-bullet-active {
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start !important;
    padding: 10px 40px !important;
    gap: 4px !important;
    background: linear-gradient(90deg, #509c85, #509c85) !important;
    box-shadow: 20px 20px 20px rgba(0, 0, 0, 0.45) !important;
    border-radius: 20px !important;
    width: unset !important;
    height: unset !important;
    opacity: unset !important;
}


@media (max-width: 1400px) {
    .main_port_block {
        width: calc(50% - 40px);
    }

    .main_port_block:nth-child(3) {
        display: none;
    }

    .port_block {
        width: calc(33% - 40px);
    }
}

@media (max-width: 1300px) {
	.home_svg {
		margin-top: 10%;
	}
}

.w_100_pr {
	width: 100% !important;
}

@media (max-width: 986px) {
	.swiper-pagination-bullet {
list-style-type: none !important;
font-size: 18px !important;
margin: 10px 30px 15px 0px !important;
display: block;
}
	.puncts {
		flex-direction: column;
		justify-content: flex-start;
		align-items: flex-start;
		margin-top: 20px;

	}
	.portfolio_page .title {
		margin-bottom: 0px;
	}
	.container_porfolio {
		padding: 0px 10px;
	}
	
	.top_title_mob {
		margin-top: 0px;
	}
	.mfp-figure {
		width: calc(100% - 20px);
		margin: 0px 10px !important;
	}
    .main_port_block {
        width: calc(100% - 20px);
        margin: 10px;
		height: 200px;
    }
    
    .port_block {
        width: calc(50% - 20px);
        margin: 10px;
		height: 100px;
    }
	
	
	
	.port_block .flex_item {
		padding: 5px;
		width: calc(100% - 10px);
		height: calc(100% - 10px);
	}
	.flex_item h3 {
		font-size: 18px;
		margin: 0px 0px 10px 0px;
	}
	.flex_item p {
		font-size: 12px;
	}

    .toptitle {
        font-size: 4em;
    }
    
    .p_zag {
        padding: 0px 25px;
    }
}




.swiper {
    max-width: 100%;
}



.port_style_1 {

    color: #f4f2f2;
    font-size: 60px;
    margin-right: 20px;
    font-weight: bold;
    text-transform: uppercase;
}

.port_style_2 {
    color: #212328;
    font-size: 60px;
    margin-right: 20px;
    font-weight: bold;
    text-shadow: 0px 0px 3px #ffffff;
    text-transform: uppercase;
}

.port_style_3 {
    color: #5f5f5f;
    font-size: 60px;
    margin-right: 20px;
    font-weight: bold;
    text-transform: uppercase;
}

.portfolio img {
    margin-top: 50px;
    width: 100%;
}

.portfolio .btn_1 {
    margin: 50px auto 0px;
}

.btn_port {
    border-radius: 25px;
    background-image: -moz-linear-gradient(90deg, #509c85, #ffffff);
    background-image: -webkit-linear-gradient(90deg, #509c85, #ffffff);
    background-image: -ms-linear-gradient(90deg, #509c85, #ffffff);
    width: 191px;
    height: 55px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #ffffff;
    margin: 50px auto 0px auto;
    transition: 0.5s;
    font-size: 20px;
    font-weight: 500;
}

.home_block {
	position: initial !important;
}

.home_svg {
    position: absolute;
    width: 60%;
    object-fit: contain;
    right: -20%;
}

@media (max-width: 502px) {
	.home_svg {
		width: 87% !important;
		left: 14% !important;
		top: 90px !important;
	}
}

.section_works {
	display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 100px;
    position: relative;
    max-width: 1400px;
}

.section_works img {
    width: 100%;
}

.block_text_abs {
    position: absolute;
    width: 100%;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
}

.block_text_abs .bl_left, .block_text_abs .bl_right {
    width: calc(50% - 85px);
}

.block_text_abs .bl_left {
    margin-left: 70px;
}

.block_text_abs .bl_right {
    margin-right: 70px;
}

.bl_right {
    text-align: right;
}

.block_text_abs .bl_left .bl:nth-child(1) {
    margin-bottom: 23%;
    margin-top: 5px;
}

.block_text_abs .bl_right .bl:nth-child(1) {
    margin-bottom: 20%;
    margin-top: 7px;
}

.bl p {
    font-weight: 400;
    font-size: 24px;
    color: #fff;
    line-height: 94.5%;
}

.bl a {
    font-weight: 400;
    font-size: 20px;
    color: #fff;
    opacity: 0.7;
}



@media (max-width: 1350px) {
    .bl p {
        font-size: 22px;
    }
}

@media (max-width: 1200px) {
    .bl p {
        font-size: 20px;
    }

    .bl a {
        font-size: 16px;
    }

 
}


@media (max-width: 997px) {
    .bl p {
        font-size: 12px;
    }

    .bl a {
        font-size: 12px;
    }

    .block_text_abs .bl_left, .block_text_abs .bl_right {
        width: calc(50% - 40px);
    }
    
    .block_text_abs .bl_left {
        margin-left: 40px;
    }
    
    .block_text_abs .bl_right {
        margin-right: 40px;
    }
}

@media (max-width: 600px) {
    .block_text_abs {
        flex-direction: column;
        top: 40%;
    }

    .block_text_abs .bl_left {
        margin-left: 0px;
        width: 100%;
        justify-content: center;
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .block_text_abs .bl_right {
        margin-right: 0px;
        width: 100%;
        justify-content: center;
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .block_text_abs .bl_left .bl:nth-child(1) {
        margin-bottom: 25%;
        margin-top: 0px;
    }

    .block_text_abs .bl_left .bl:nth-child(2) {
        margin-bottom: 22%;
    }

    .block_text_abs .bl_right .bl:nth-child(1) {
        margin-top: 0px;
        margin-bottom: 25%;
    }

    

    .bl_right {
        text-align: left;
    }

    .bl p {
        font-size: 16px;
    }

    .bl p br:nth-child(2){
        display: none;
    }

    .bl a {
        font-size: 14px;
    }
}

.open_900 {
    display: none;
}

@media (max-width: 600px) {
    .close_900 {
        display: none;
    }
    
    .open_900 {
        display: block;
    }
}

.open_gallery_2 div p {
	overflow: hidden;
    text-overflow: ellipsis;
    display: -moz-box;
    -moz-box-orient: vertical;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    line-clamp: 3;
    box-orient: vertical;
}

.open_gallery_3 div p {
	overflow: hidden;
    text-overflow: ellipsis;
    display: -moz-box;
    -moz-box-orient: vertical;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    line-clamp: 3;
    box-orient: vertical;
}

.open_gallery_4 div p {
	overflow: hidden;
    text-overflow: ellipsis;
    display: -moz-box;
    -moz-box-orient: vertical;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    line-clamp: 3;
    box-orient: vertical;
}

.open_gallery_5 div p {
	overflow: hidden;
    text-overflow: ellipsis;
    display: -moz-box;
    -moz-box-orient: vertical;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    line-clamp: 3;
    box-orient: vertical;
}

.open_gallery_6 div p {
	overflow: hidden;
    text-overflow: ellipsis;
    display: -moz-box;
    -moz-box-orient: vertical;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    line-clamp: 3;
    box-orient: vertical;
}