body {
        /*padding-top: 100px;
        padding-bottom: 20px;*/
    }

/* Set padding to keep content from hitting the edges */
    .body-content {
        /*padding-top: 100px;*/
        padding-right: 0px;
        overflow: hidden;
        background-color: #ededed;
        height:auto;
     }

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
    .dl-horizontal dt {
        white-space: normal;
    }

/* Set width on the form input elements since they're 100% wide by default */
    input,
    select,
    textarea {
        max-width: 280px;
    }

    a {
        text-decoration:none;
    }

    .topimage {
        height: 100px;
        width: auto;
        line-height: 100px;
    }

    .topimage > a > img {
        transition: all .5s ease-in-out;
    }

    .topimage:hover a img {
        transform: scale(1.03);
    }

    .topimage a img {
        height: 100px;
        width: auto;
        margin: auto;
    }

    .container1 {
        background-image: url("image/menubackgraund.jpg");
        background-repeat: no-repeat;
        width:100%;
        height:100px;
    }

    .hero-image {
        background-image: url("image/menubackgraund.jpg");
        background-position: center;
        background-size: cover;
        position: relative;
    }

    .navbar1 {
        top:0px;
        position: fixed;
        width:100%;
    }

    .navbar-inverse .navbar-nav > li > div {
        color: white;
        font-weight:bold;
        line-height:100px;
        cursor:pointer;
        margin-left:15px;
    }

    .navbar-inverse .navbar-nav > li:hover > div {
        color: black; /* #1659f8;*/
        font-weight: bold;
    }

    .marginnavbar {
        margin-left: 250px;
        transform-origin: 0 0;
    }

    .aboutworksItemtext {
        width: calc(100% - 50vw);
        padding: 10px;
        font-size: 18px;
        line-height: 25px;
        /*max-height: calc(100% - 100px);*/
    }

    .Add_container {
        height: 50px;
        width: 50px;
        position: fixed;
        bottom: 50px;
        right: 10px;
        cursor: pointer;
        z-index: 1;
        background-color: rgba(217, 137, 44);
        border-radius: 25px;
        text-align: center;
        overflow: hidden;
        padding: 0px 15px;
        transition: all .5s ease-in-out;
    }

    .Add_container:hover {
        width: 250px;
    }

    a {
        text-decoration: none;
        /*display: flex;*/
    }

    .Add_container1 {
        height: 50px;
        width: 50px;
        position: fixed;
        bottom: 70px;
        right: 10px;
        cursor: pointer;
        z-index: 1;
        background-color: rgba(233, 214, 0);
        border-radius: 25px;
        text-align: center;
        overflow: hidden;
        transition: all .5s ease-in-out;
        padding: 0px 15px;
    }

    .Add_container1:hover {
        width: 250px;
    }

    .advmainpanel_zindex_2 {
        z-index: 2;
    }

    .langeuage_container {
        height: 50px;
        width: 50px;
        position: fixed;
        bottom: 70px;
        right: 10px;
        border-radius: 25px;
        border: 2px solid #065ba8;
        cursor: pointer;
        z-index: 1;
        box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.3);
    }

    .dropdowncall1 {
        position: fixed;
        display: inline-block;
        z-index: 2;
        color: red;
        height: auto;
        width: 50px;
        bottom: 65px;
        right: 10px;
    }

    .popup {
        display: none; /* Hidden by default */
        position: fixed; /* Stay in place */
        z-index: 1; /* Sit on top */
        padding-top: 0px; /* Location of the box */
        left: 0;
        top: 0;
        width: 100%; /* Full width */
        height: 100%; /* Full height */
        overflow: auto; /* Enable scroll if needed */
        /*background-color: rgb(0,0,0);  /*Fallback color*/
        background-color: rgba(6, 91, 168,0.4); /* Black w/ opacity */
    }

    .popup-body {
        padding: 10px;
        background-color: #fefefe;
        box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
        border-radius: 5px;
    }
    /* Modal Content */
    .popup-content {
        position: relative;
        background-color: transparent;
        margin: auto;
        padding: 0;
        /*border: 1px solid #888;*/
        width: 90%;
        -webkit-animation-name: animatetop;
        -webkit-animation-duration: 0.4s;
        animation-name: animatetop;
        animation-duration: 0.4s
    }

    .popup-header {
        padding: 0px;
        background-color: transparent;
        color: white;
        display: flex;
        line-height: 22;
    }

    .popup-header i {
        font-size: 22px;
        /*margin-top: 0px;*/
        line-height: 22px;
        margin-right: 10px;
        line-height: 74px;
    }

    .popup-header h2 {
        font-size: 22px;
        margin-left: 0px;
        margin-right: 0px;
        line-height: 22px;
    }

    .socialitem1 {
        height: 100%;
        width: 100%;
        /*border-radius: 25px;*/
        background-repeat: no-repeat;
        background-position: center;
        background-size: contain;
        text-align: center;
        line-height: 50px;
        display: flex;
        text-decoration: none;
    }

    .socialitem1 i {
        font-size: 20px;
        color: rgba(0,0,0,0.9);
        line-height: 50px;
        bottom: 5px;
        margin-right: 20px;
        animation: shake 3s;
        animation-iteration-count: infinite;
    }

    .socialitem1 p {
        font-size: 15px;
        font-weight: bold;
        line-height: 50px;
        margin: auto;
        color: rgba(0,0,0,0.6);
    }

    .socialitem2 {
        height: 100%;
        width: 100%;
        background-repeat: no-repeat;
        background-position: center;
        background-size: contain;
        text-align: center;
        line-height: 50px;
        display: block;
        text-decoration: none;
    }

    .socialitem2 i {
        font-size: 20px;
        color: #065ba8;
        line-height: 50px;
        bottom: 5px;
        margin-right: 20px;
        animation: shake 4s;
        animation-iteration-count: infinite;
    }

    .socialitem2 p {
        font-size: 18px;
        font-weight: bold;
        line-height: 50px;
        margin: auto;
    }

    .languageitem {
        height: 100%;
        width: 100%;
        border-radius: 25px;
        background-repeat: no-repeat;
        background-position: center;
        background-size: contain;
    }

    .dropdown-content {
        display: none;
        position: relative;
        background-color: #ffffff29;
        box-shadow: 0px 8px 16px 0px rgba(255,255,255,0.3);
        height: 100%;
        width: 100%;
        border-radius: 25px;
    }

    .callBtnborder {
        height: 50px;
        width: 50px;
        margin-bottom: 5px;
        z-index: 2;
        cursor: pointer;
    }

    .Mailcontainer {
        height: auto;
        width: 100%;
        margin: auto;
    }

    .Mail_item_container {
        display: block;
        margin-top: 20px;
        margin-left: auto;
        margin-right: auto;
    }

    .Mail_item_container input {
        width: 100%;
        height: 22px;
        background-color: white;
        color: #065ba8;
        border: 0px;
        padding-left: 10px;
        font-weight: bold;
        margin-left: 0px;
        margin-right: 0px;
        display: block;
        max-width: 100%;
    }

    .Mail_item_container textarea {
        background-color: white;
        color: #065ba8;
        border: 0px;
        padding-left: 10px;
        padding-right: 10px;
        font-weight: bold;
        margin-left: auto;
        margin-right: auto;
        display: block;
    }

    .Mail_item {
        font-size: 18px;
        font-weight: bold;
        line-height: 18px;
        color: white;
        font-weight: bold;
    }

    .mailbutton {
        margin-left: auto;
        margin-right: auto;
        display: block;
        border-radius: 20px;
        width: 100px;
        height: 40px;
        margin-top: 10px;
        background-color: white;
        border: 0px;
        cursor: pointer;
    }

    .mailbutton i {
        color: #065ba8;
        font-size: 24px;
        font-weight: bold;
    }

    /* EIGHTH BUTTON */
    #eighth > li {
        transition: all .5s ease-in-out;
        text-decoration: none;
    }

    #eighth:hover li {
        text-shadow: 0 0 10px rgba(217, 137, 44, 1), 0 0 50px rgba(217, 137, 44, .8), 0 0 75px rgba(217, 137, 44, .6), 0 0 76px rgba(217, 137, 44, .4), 0 0 77px rgba(217, 137, 44, .5), 0 0 78px rgba(217, 137, 44, .4), 0 0 79px rgba(217, 137, 44, .3), 0 0 80px rgba(217, 137, 44, .2), 0 0 85px rgba(217, 137, 44, .1);
        text-decoration: none;
    }

/* EIGHTH BUTTON rgba(217, 137, 44)*/
    #eighth1 > a {
        transition: all .5s ease-in-out;
    }

    #eighth1:hover a {
        text-shadow: 0 0 10px rgba(6, 91, 168, 1), 0 0 50px rgba(6, 91, 168, .8), 0 0 75px rgba(6, 91, 168, .6), 0 0 76px rgba(6, 91, 168, .4), 0 0 77px rgba(6, 91, 168, .5), 0 0 78px rgba(6, 91, 168, .4), 0 0 79px rgba(6, 91, 168, .3), 0 0 80px rgba(6, 91, 168, .2), 0 0 85px rgba(6, 91, 168, .1);
    }

    .mainpanel {
        height: 60vw;
        width: 100%;
        position: relative;
        overflow: hidden;
    }

    .owlitemimg {
        height: auto;
        width: 100%;
        position: absolute;
        display: none;
        transition: transform .2s; /* Animation */
        transform: scale(1.5);
    }
    /*.menuitem > a{
        color: #065ba8;
    }*/
    /*.nav {
        padding-left: 0;
        margin-bottom: 0;
        list-style: none;
    }
    
    .nav > li {
        position: relative;
        display: block;
    }
    
    .nav > li > a {
        position: relative;
        display: block;
        padding: 0px 15px;
    }*/
    @keyframes shake {
        0% {
            transform: translate(1px, 1px) rotate(0deg);
        }

        10% {
            transform: translate(-1px, -2px) rotate(-3deg);
        }

        20% {
            transform: translate(-3px, 0px) rotate(3deg);
        }

        30% {
            transform: translate(3px, 2px) rotate(0deg);
        }

        40% {
            transform: translate(1px, -1px) rotate(3deg);
        }

        50% {
            transform: translate(-1px, 2px) rotate(-3deg);
        }

        60% {
            transform: translate(-3px, 1px) rotate(0deg);
        }

        70% {
            transform: translate(3px, 1px) rotate(-3deg);
        }

        80% {
            transform: translate(-1px, -1px) rotate(3deg);
        }

        90% {
            transform: translate(1px, 2px) rotate(0deg);
        }

        100% {
            transform: translate(1px, -2px) rotate(-3deg);
        }
    }
    /* MAIN panel slide */
    ul {
        margin: 0px;
        padding: 0px;
    }

    .cb-slideshow,
    .cb-slideshow:after {
        /*position: absolute;*/
        width: 100%;
        height: 100%;
        top: 100px;
        left: 0px;
    }

    .cb-slideshow:after {
            content: '';
            background: transparent url('../image/buildings/2012-2 краснодар ул дзержинского 64-2/1.jpg') center;
        }

    .cb-slideshow div {
         width: 100%;
         height: 70vw;
         max-height: 500px;
         position: absolute;
         top: 0px;
         left: 0px;
         color: transparent;
         background-size: cover;
         background-position: 50% 50%;
         background-repeat: none;
         opacity: 0;
         z-index: 0;
         -webkit-backface-visibility: hidden;
         -webkit-animation: imageAnimation 20s linear infinite 0s;
         -moz-animation: imageAnimation 20s linear infinite 0s;
         -o-animation: imageAnimation 20s linear infinite 0s;
         -ms-animation: imageAnimation 20s linear infinite 0s;
         animation: imageAnimation 20s linear infinite 0s;
    }

    .cb-slideshow div:nth-child(1) {
                background-image: url('../image/buildings/2021-1 крымская рожя жк ванил 1 очередь/1.jpg');
            }

    .cb-slideshow div:nth-child(2) {
                background-image: url('../image/buildings/2018-5 краснодар ул московская  118/1.jpg');
                -webkit-animation-delay: 5s;
                -moz-animation-delay: 5s;
                -o-animation-delay: 5s;
                -ms-animation-delay: 5s;
                animation-delay: 5s;
            }

    .cb-slideshow div:nth-child(3) {
                background-image: url('../image/buildings/2018-4 краснодар ул героя яцкова 1-10/1.jpg');
                -webkit-animation-delay: 10s;
                -moz-animation-delay: 10s;
                -o-animation-delay: 10s;
                -ms-animation-delay: 10s;
                animation-delay: 10s;
            }

    .cb-slideshow div:nth-child(4) {
        background-image: url('../image/buildings/2017-1 краснодар ул благоева 31/1.jpg');
        -webkit-animation-delay: 15s;
        -moz-animation-delay: 15s;
        -o-animation-delay: 15s;
        -ms-animation-delay: 15s;
        animation-delay: 15s;
    }
    /*.cb-slideshow div:nth-child(5)  {
    background-image: url('../image/buildings/2012-2 краснодар ул дзержинского 64-2/1.jpg');
    -webkit-animation-delay:     16s;
    -moz-animation-delay:        16s;
    -o-animation-delay:          16s;
    -ms-animation-delay:         16s;
    animation-delay:             16s;
}*/
    /* Show at least something when animations not supported */
    .no-cssanimations .cb-slideshow div {
        opacity: 1;
    }

    @-webkit-keyframes imageAnimation {
        0% {
            opacity: 0;
            -webkit-animation-timing-function: ease-in;
        }

        8% {
            opacity: 1;
            -webkit-animation-timing-function: ease-out;
        }

        17% {
            opacity: 1
        }

        30% {
            opacity: 0
        }


        100% {
            opacity: 0
        }
    }

    @-moz-keyframes imageAnimation {
        0% {
            opacity: 0;
            -moz-animation-timing-function: ease-in;
        }

        8% {
            opacity: 1;
            -moz-animation-timing-function: ease-out;
        }

        17% {
            opacity: 1
        }

        30% {
            opacity: 0
        }


        100% {
            opacity: 0
        }
    }

    @-o-keyframes imageAnimation {
        0% {
            opacity: 0;
            -o-animation-timing-function: ease-in;
        }

        8% {
            opacity: 1;
            -o-animation-timing-function: ease-out;
        }

        17% {
            opacity: 1
        }

        30% {
            opacity: 0
        }


        100% {
            opacity: 0
        }
    }

    @-ms-keyframes imageAnimation {
        0% {
            opacity: 0;
            -ms-animation-timing-function: ease-in;
        }

        8% {
            opacity: 1;
            -ms-animation-timing-function: ease-out;
        }

        17% {
            opacity: 1
        }

        30% {
            opacity: 0
        }


        100% {
            opacity: 0
        }
    }

    @keyframes imageAnimation {
        0% {
            opacity: 0;
            animation-timing-function: ease-in;
        }

        8% {
            opacity: 1;
            animation-timing-function: ease-out;
        }

        17% {
            opacity: 1
        }

        30% {
            opacity: 0
        }


        100% {
            opacity: 0
        }
    }

    .slideshow {
        position: relative;
        transition: all .3s ease-in-out;
        width: 50vw;
    }

    .slideshow img {
        position: absolute;
        width: 50vw;
        height: 100%;
        object-fit: cover;
    }
    /*-----------------*/
    .toppanel {
        position: relative;
        width: 100%;
        height: 56.25vw;
        margin-top: 100px;
        /*max-height: 500px;*/
    }

    .toppanel > div {
        position: absolute;
        height: 100%;
        width: 100%;
    }

    .aboutus {
        height: auto;
        width: 100%;
    }

    .abouttop {
        height: auto;
        width: 100%;
    }

    .divabout {
        height: auto;
        width: 100%;
        margin: auto;
        text-align: center;
    }

    .divabout > h2 {
        font-size: 30px;
        color: rgba(0,0,0,0.6);
    }

    .divunderline {
        height: 5px;
        width: 100%;
        background: rgb(237, 237, 237);
        background: linear-gradient(90deg, rgba(237, 237, 237,1) 0%, rgba(217,137,44,1) 50%, rgba(237, 237, 237,1) 100%);
        margin: auto;
    }

    .abouttext {
        padding: 30px 10vw 0px 10vw;
        height: auto;
        width: 100%;
        font-size: 18px;
        display: inline-block;
        text-align: justify;
        color: rgba(0,0,0,0.6);
    }

    .aboutworks {
        width: 100%;
        margin: auto;

        /*padding: 0px 10vw 0px 10vw;*/
    }

    .aboutworksItem {
        height: 45vw;
        max-height: calc((100vh - 100px)/3);
        position: relative;
        display: flex;
        justify-content: space-between;
        background-color: white;
        box-shadow: 10px 10px 5px #aaaaaa;
        cursor: pointer;
        transition: all 1s ease-in-out;
        overflow: hidden;
        margin-top: 20px;
        
    }

    .aboutworksItem a{
        display:flex;
    }
    
    .aboutworksItem:hover {
        transform: scale(1.015);
        /*transform: translateX(calc(100%))*/
    }

    .aboutworksItemtext p {
        margin: 0px;
        color:#606060;
    }

    #myVideo {
        position: absolute;
        /*right: 0;
        bottom: 0;*/
        width: 100%;
        height: auto;
    }
    
    .aboutbottom {
        height: auto;
        width: 100%;
        margin-bottom:50px;
    }

    .aboutworkscontact {
        padding: 10px;
        font-size: 18px;
        text-align: center;
    }

    .aboutworkscontact p {
        margin: 0px;
        color: rgba(0,0,0,0.6);
    }

    .aboutworksItem1 {
        /*height: 20vw;*/
        width:  100%;
        /*display: flex;*/
        background-color: white;
        /*margin-top:100px;*/
     }

    .slideshow1 {
        /*position: relative;*/
        transition: all .3s ease-in-out;
        width: 100%;
        height: 50vw;
        overflow: hidden;
        /*margin-top:100px;*/
    }

    .slideshow1 img {
        /*position: absolute;*/
        /*width: 100%;*/
        height: 100%;
        object-fit: cover;
        margin:auto;
    }

    .programs-item {
        position: relative;
        padding: 15px;
    }

    .programs-item:hover .image-item {
        -webkit-transform: scale(1.01);
        -ms-transform: scale(1.01);
        transform: scale(1.01);
    }

    .cover-item {
        background-color: rgba(0, 0, 0, 0.52);
        border-radius: 5px;
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        overflow: hidden;
        width: 100%;
        height: 100%;
        -webkit-transform: scale(0);
        -ms-transform: scale(0);
        transform: scale(0);
        -webkit-transition: .3s ease;
        transition: .3s ease;
    }

    .user-select {
        -moz-user-select: none;
        -webkit-user-select: none;
        -webkit-touch-callout: none;
        -ms-user-select: none;
        user-select: none;
    }

    /*.fon-item {
        width: 30vw;
        height: 20vw;
        /*border-radius: 5px;
        background-color: #fafafa; 
        overflow:hidden;
    }*/

    .imagecontainerdiv {
        height: 300px;
        width: 100%;
    }

    .image-item, .image-item1 {
        /*background-repeat: no-repeat;
            background-position: center;
            background-size: cover;*/
        /*background-image: url(../source/S_IT.png);*/
        /*width: 100%;*/
        height: 20vw;
        /*width: 100%;*/
        display: block;
        margin-left: auto;
        margin-right: auto;
        object-fit: cover;
        background: url(/image/sboxgif.gif) 50% no-repeat;
        background-size: 50px;
        -webkit-transition: .3s ease;
        transition: .3s ease;
    }

    .name-item {
        text-align: left;
        font-family: Sylfaen;
        font-size: 18px;
        color: white;
        margin: 0px;
        line-height: 50px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        font-family: Sylfaen;
        text-decoration: none;
        background-color: black;
        text-align: center;
        height: 50px;
    }

    /* Slideshow container */
    .slideshow-container {
        width: 100%;
        margin: auto;
        display: flex;
        /*height:200px;*/
    }

    .slideshow-container::-webkit-scrollbar {
        width: 10px;
        overflow-y: no-content;
    }
    
    .slideshow-container::-webkit-scrollbar-button {
        width: 10px;
    }
    
    .slideshow-container::-webkit-scrollbar-track {
        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
        border-radius: 10px;
    }
    
    .slideshow-container::-webkit-scrollbar-thumb {
        border-radius: 10px;
        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
    }

    .infopanel-column1-maker {
        display: flex;
        margin: auto;
        flex-wrap: nowrap;
        justify-content: center;
        height:20px;
        line-height:50px;
    }
    
    .maker-sit {
         font-size: 15px;
     }

    .aboutworksItemtext1 {
        width: 100%;
        padding: 10px;
        font-size: 12px;
        line-height: 16px;
    }

    .aboutworksItemtext1 > p{
        padding:0px;
        margin: 0px;
    }

    @media (max-width: 900px) {
        .aboutworksItemtext {
        padding: 5px;
        font-size: 14px;
        line-height: 16px;
    }

    .aboutworkscontact {
        font-size: 16px;
    }
}

@media (max-width: 768px) {
    .marginnavbar {
        margin-left: 0px;
        background-color: rgba(191, 191, 191, 0.74); /*rgba(128, 128, 128, 0.5);*/
    }
    .navbar-inverse .navbar-nav > li > div {
        line-height: 40px;
    }
    .toppanel > div > h1 {
        font-size: 6vw;
    }
    .toppanel > div > h2 {
        font-size: 5vw;
    }
    .aboutworkscontact {
        font-size: 14px;
    }
    .aboutworksItemtext {
        padding: 5px;
        font-size: 12px;
        line-height: 14px;
    }
    .slideshow1 img {
        width: 100%;
        height: auto;

    }
    .aboutworksItem {
        max-height: calc((100vh - 150px));
    }
    .abouttext {
        font-size: 14px;
    }
    .divabout > h2 {
        font-size: 18px;
    }
}

@media (max-width: 300px) {
    /*.marginnavbar {
            margin-left: 0px;
            background-color: rgba(128, 128, 128, 0.5);
        }
        .navbar-inverse .navbar-nav > li > a {
            line-height: 40px;
        }*/
    .topimage a img {
        height: auto;
        width: 200px;
        margin: auto;
    }
    .aboutworksItemtext {
        padding: 5px;
        font-size: 10px;
        line-height: 12px;
    }
}

.maker-sit > a{
    color:black;
    font-weight:bold;
    cursor:pointer;
}