body {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
        font-family: Queulatbold;
        width: 100%;
        height: 100%;
        background-color: #e9eef1;
    }
    
    @font-face {
        font-family: QueulatBold;
        src: url(../Font/Queulat-Bold.otf) format("OpenType");
    }
    
    @font-face {
        font-family: Queulat-Medium;
        src: url(../Fonts-2/Queulat-Medium.otf) format("OpenType");
    }
    
    @font-face {
        font-family: QueulatAlt-Black;
        src: url(../Font/QueulatAlt-Black.otf) format("OpenType");
    }
    
    @font-face {
        font-family: Queulat-Black;
        src: url(../Fonts-2/Queulat-Black.otf) format("OpenType");
    }
    
    @font-face {
        font-family: Queulat-BoldItalic;
        src: url(../Font/Queulat-BoldItalic.otf) format("OpenType");
    }
    
    @font-face {
        font-family: Queulat-MediumItalic;
        src: url(../Fonts-2/Queulat-MediumItalic.otf) format("OpenType");
    }
    
    .navbar {
        background: transparent;
    }
    
    #logo {
        height: 75px;
        width: 75px;
        margin-left: 10%;
        margin-top: 50px;
        position: absolute;
        font-size: 55px;
        color: #3fd5ad;
        font-style: bold;
    }

    .header-language {
        color: #010737;
        text-decoration: none;
        font-size: 26px;
        height: 100%;
        width: 100%;
        line-height: 60px;
        color: #fff;
        font-weight: 800;
        font-family: QueulatAlt-Black;
    }

     .header-language2 {
        color: #010737;
        text-decoration: none;
        font-size: 26px;
        height: 100%;
        width: 100%;
        line-height: 60px;
        color: #fff;
        font-weight: 800;
        font-family: QueulatAlt-Black;
    }

    /*.header-language::after {
     content: '';
     background-color: #000000;
     width: 50%;
       margin-left: 15px;
    margin-right: 10px;
     border-right: 3px solid #020837;
     top: 50%;

 } */

 #banner-arrow {
    height: 83px;
    width: 110px;
    margin-left: 10%;
    margin-top: 645px;
    position: absolute;
}

.banner-social {
    height: 100%;
    width: 100%;
    float: right;
    padding-top: 607px;
    padding-right: 15vw;
    text-align: center;
}

.banner-social a {
    text-decoration: none;
    color: #3fd5ae;
}

.banner-social a:hover {
    text-decoration: none;
    color: #fff;
}

.banner-social p {
    font-size: 25px;
    font-weight: 800;
    font-family: Queulatbold;
    text-align: right;
    line-height: 15px;
}

header {
    height: 768px;
    width: 100%;
    background-color: #141533;
    overflow: hidden;
}

#banner-text {
    color: #fff;
    height: 100%;
    width: 100%;
}

#banner-text h1 {
    font-size: 5vw;
    line-height: 85px;
    color: #d0dcde;
    font-weight: 800;
    font-family: Queulatbold;
    text-align: center;
}

#banner-text span {
    color: #d0dcde;
    font-family: Queulatbold;
}

.ml15 {
    text-transform: uppercase;
}

.ml15 .word {
    display: inline-block;
    line-height: 1em;
}

#services {
    width: 100%;
    height: 100%;
    background-color: #e9eef1;
    padding: 5% 0 5% 0;
    overflow: hidden;
}

#services-2 {
    height: 100%;
    background-color: #e9eef1;
}

.services-text {
    height: 100%;
}

.services-text h1 {
    font-size: 36px;
    line-height: 45px;
    color: #000000;
    font-weight: 800;
    font-family: QueulatAlt-Black;
    text-align: center;
}

.services-text span {
    color: #3fd5ad;
}

.png-texts {
    width: 251px;
    height: 168px;
    margin-top: 32px;
    padding-left: 0px;
    padding-right: 0px;
    text-align: center;
}

.png-texts h1 {
    font-size: 24px;
    line-height: 23px;
    color: #000000;
    font-weight: 800;
    font-family: QueulatAlt-Black;
    text-align: center;
}

.png-texts p {
    font-size: 13px;
    line-height: 23px;
    color: #000000;
    font-weight: 800;
    font-family: QueulatAlt-Black;
    text-align: center;
    padding-top: 10px;
}

.png-texts img {
    height: 75px;
    width: 75px;
}

#png-texts-2 {
    padding-right: 74px;
    padding-left: 74px;
}

#works {
    width: 100%;
    height: 100%;
    background-color: #e9eef1;
    overflow: hidden;
}

#works .row {
    height: 388px;
}

#works h3 {
    font-size: 40px;
    line-height: 55px;
    color: #e9eff0;
    font-weight: 800;
    font-family: Queulatbold;
}

#works p {
    font-size: 25px;
    line-height: 15px;
    color: #e9eff0;
    font-weight: 500;
    font-family: Queulatbold;
}

.works-detail {
    padding-top: 10%;
    padding-bottom: 10%;
    padding-left: 10%;
    padding-right: 10%;
    text-align: left;
}

.blue {
    background-color: #00a5d5;
    height: 388px;
    padding: 0;
}

.white {
    background-color: #e9eef1;
    height: 388px;
    padding: 0;
}

.blue-2 {
    background-color: #e9eef1;
    height: 388px;
    padding: 0;
}

.white-2 {
    background-color: #00a5d5;
    height: 388px;
    padding: 0;
}

#works img {
    width: 100%;
    height: 388px;
    object-fit: cover;
}

#view-project-button {
    padding: 0;
    height: 39px;
    width: 182px;
    border: 5px solid #020837;
}

.view-project button {
    height: 39px;
    width: 182px;
    border: 5px solid #020837;
    padding: 0;
    margin-top: 49px;
}

.btn-outline-dark:hover {
    background-color: #010737;
}

.btn-outline-dark:focus {
    box-shadow: 0 0 0 0.25rem rgba(0, 0, 0, 0);
}

#waiting {
    height: 100%;
    background-color: #010737;
    color: #fff;
    margin-bottom: 50px;
}

#waiting img {
    height: 47px;
    width: 183px;
    float: left;
    margin-left: 158px;
    margin-top: 51px;
}

#social {
    height: 100%;
    background-color: #010737;
    color: #fff;
}

#social-media-link a {
    text-decoration: none;
    color: #3fd5ad;
}

#social a:hover {
    color: #fff;
}

#mailto a {
    text-decoration: none;
    color: #fff;
}

#mailto a:hover {
    color: #3fd5ad;
}
/* header */

.wrapper {
    height: 100%;
    width: 40vw;
    position: relative;
    float: right;
}

.wrapper .menu-btn {
    position: absolute;
    right: 40%;
    top: 66px;
    background: transparent;
    color: #010737;
    height: 45px;
    width: 45px;
    z-index: 9999;
    border-radius: 5px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}

.wrapper .menu-btn .bar {
    background: #141533;
    color: #3fd5ad;
}

#btn:checked~.menu-btn {
    right: 32vw;
}

.wrapper .menu-btn i {
    position: absolute;
    font-size: 42px;
    transition: all 0.3s ease;
}

.wrapper .menu-btn i.fa-times {
    opacity: 0;
}

#btn:checked~.menu-btn i.fa-times {
    opacity: 1;
    transform: rotate(-180deg);
}

#btn:checked~.menu-btn i.fa-bars {
    opacity: 0;
    transform: rotate(180deg);
}

#sidebar {
    position: fixed;
    background: #3fd5ad;
    overflow: hidden;
    height: 100%;
    width: 40vw;
    right: -40vw;
    transition: all 0.3s ease;
    display: block;
}

#btn:checked~#sidebar {
    right: 0;
    position: absolute;
}

#sidebar .list-items {
    position: relative;
    background: #3fd5ad;
    width: 40vw;
    height: 100%;
    list-style: none;
    text-align: left;
    padding: 0;
    padding-top: 20vh;
    padding-bottom: 20vh;
    margin-left: 20%;
}

#sidebar .list-items li {
    line-height: 90px;
    transition: all 0.3s ease;
    width: 100%;
}

#sidebar .list-items #list-items-title {
    padding-top: 5%;
    text-align: left !important;
}

#sidebar .list-items h3 {
    font-size: 26px;
    color: #020837;
    font-weight: 800;
    font-family: QueulatAlt-Black;
    width: 100%;
}

#sidebar .list-items a:hover {
    color: #fff;
}

#sidebar .list-items li:first-child {
    border-top: none;
}

#sidebar .list-items li a {
    color: #010737;
    text-decoration: none;
    font-size: 55px;
    height: 100%;
    width: 100%;
    display: block;
    font-size: 55px;
    line-height: 60px;
    color: #020837;
    font-weight: 800;
    font-family: QueulatAlt-Black;
}



#info {
    font-weight: 800px;
    font-size: 25px;
    color: red;
}

#sidebar .list-items li a i {
    margin-right: 20px;
}

#sidebar .list-items .icons a:hover {
    background: #404040;
}

.list-items .icons a:first-child {
    margin-left: 0px;
}

.content {
    position: absolute;
    left: 50%;
    margin-top: 400px;
    transform: translate(-50%, -50%);
    color: #fff;
    text-align: center;
}
/* contact start */

#text-1 {
    font-size: 25px;
    line-height: 25px;
    color: #3fd5ae;
    font-weight: bold;
    font-style: italic;
    font-family: Queulatbold;
    padding-top: 10px;
}

#text-1 span {
    font-size: 18px;
    font-style: italic;
}

#text-2 {
    font-size: 50px;
    line-height: 50px;
    color: #020837;
    font-weight: 800;
    font-family: Queulatbold;
}

#text-3 {
    font-size: 15px;
    line-height: 15px;
    color: #020837;
    font-weight: 500;
    font-family: Queulat-Medium;
}

.contact-3 h3 {
    font-size: 35px;
    line-height: 35px;
    color: #e9eff0;
    font-weight: 800;
    font-family: QueulatAlt-Black;
}

.contact-3 p {
    font-size: 15px;
    line-height: 20px;
    color: #e9eff0;
    font-family: QueulatAlt-Black;
    padding-top: 5%;
}

.contact-inc {
    overflow: hidden;
}

.contact-inc .col {
    padding-top: 15vh;
    padding-bottom: 15vh;
}

#col-1 {
    background-color: #010737;
}

#col-2 {
    background-color: #3fd5ad;
}

#row-1 {
    padding-right: 0;
    padding-left: 0;
}

#col-3 {
    background-color: #11a7d7;
}

#col-4 {
    background-color: #23292f;
}

#row-2 {
    height: 40vh;
    padding-right: 0;
    padding-left: 0;
}

#group-4 {
    height: 100%;
    width: 100%;
}

#group-4-text {
    height: 100%;
    width: 50%;
    margin: auto;
    margin-top: 10%;
    margin-bottom: 10%;
}

#group-4-text h3 {
    font-size: 55px;
    line-height: 60px;
    color: #020837;
    font-weight: 800;
    font-family: QueulatAlt-Black;
    text-align: center;
}

#group-4-text span {
    color: #3fd5ad;
}

.mailto-gavia {
    color: #fff;
    text-decoration: none;
}

.mailto-gavia:hover {
    color: #fff;
    text-decoration: none;
}

.first-adress {
    width: 40%;
    display: inline-block;
}

.second-adress {
    width: 40%;
    display: inline-block;
}

.visit-bracer {
    height: 45px;
    border-left: 1px solid #fff;
    display: inline-block;
    margin-right: 10px;
    margin-left: 10px;
}
/* contact finish */
/* project detail start */

#detail-1 {
    height: 70vh;
    width: 100%;
    padding-top: 2%;
    padding-bottom: 2%;
}

#detail-1-text {
    float: left;
    padding-left: 9%;
    padding-top: 5%;
    width: 70%;
}

#top-text {
    font-size: 25px;
    line-height: 27px;
    color: #3fd5ae;
    font-weight: bold;
    font-family: Queulatbold;
}

#medium-text {
    font-size: 55px;
    line-height: 50px;
    color: #020837;
    font-weight: 800;
    font-family: Queulatbold;
}

#lower-text {
    font-size: 15px;
    line-height: 20px;
    color: #020837;
    font-weight: 500;
    font-family: Queulatbold;
    font-style: thin;
}

#detail-1-works {
    height: auto;
    width: 100%;
    float: left;
    padding: 5% 10% 5% 10%;
}

#detail-1-works .col {
    padding-left: 0px;
    float: left;
}

#detail-1-works h3 {
    font-size: 25px;
    line-height: 20px;
    color: #020837;
    font-weight: 800;
    font-family: Queulatbold;
    padding-top: 10px;
}

#detail-1-works p {
    font-size: 15px;
    line-height: 20px;
    color: #020837;
    font-weight: 500;
    font-family: Queulatbold;
    padding-top: 18px;
}

#detail-1-video {
    background-image: url(../img/detail/Background.png);
    background-size: cover;
    background-position: center;
    background-color: black;
    height: 246px;
    width: 100%;
    margin: 5% 0 5% 0;
}

.video-icon i {
    color: #fff;
    border: 5px dashed #fff;
    border-radius: 50%;
}

#detail-photos {
    overflow: hidden;
}

#detail-photos img {
    height: 100%;
    width: 100%;
}

.photos-text p {
    font-size: 15px;
    line-height: 20px;
    color: #020837;
    font-weight: 500;
    font-family: Queulatbold;
    text-align: left;
}

.photos-text-3 p {
    font-size: 15px;
    line-height: 20px;
    color: #020837;
    font-weight: 500;
    font-family: Queulatbold;
    text-align: center;
}
/* project detail finish */
/* about  start */

.about {
    height: 100%;
    width: 100%;
    background-color: #e9eef1;
    overflow: hidden;
    margin: 5% 0 5% 0;
    padding-left: 10%;
    padding-right: 10%;
}

.about-text-1 {
    width: 50vw;
    height: 100%;
    margin: 0 10% 90px 0;
}

.about-text-1 h6 {
    font-size: 25px;
    line-height: 27px;
    color: #3fd5ae;
    font-weight: bold;
    font-family: Queulatbold;
    /* float: left; */
}

.about-text-1 h3 {
    font-size: 55px;
    line-height: 60px;
    color: #020837;
    font-weight: 800;
    font-family: Queulatbold;
    padding-top: 3%;
}

.about-text-1 p {
    font-size: 15px;
    line-height: 20px;
    color: #020837;
    font-weight: 500;
    font-family: Queulatbold;
    float: left;
    padding-top: 3%;
}

.about-text-2 {
    height: 100%;
    width: 100vw;
    overflow: hidden;
}

.about-text-2 .row {
    height: 100%;
    width: 90vw;
    margin-top: 62px;
    --bs-gutter-x: 0rem;
}

.about-text-2 .col {
    height: 100%;
    margin: 5%;
}

.about-text-2 h3 {
    font-size: 25px;
    line-height: 30px;
    color: #020837;
    font-weight: 800;
    font-family: Queulatbold;
}

.about-text-2 ul {
    padding-left: 5%;
}

.about-text-2 p,
li {
    font-size: 15px;
    line-height: 20px;
    color: #020837;
    font-weight: 500;
    font-family: Queulatbold;
    padding-left: 0px;
}

.about-text-2 p {
    padding-top: 10px;
}

.about-text-2 li {
    font-style: italic;
    line-height: 25px;
}

.about-text-2 .col-4 {
    padding: 0 10% 0 0;
}

.box {
    width: auto;
}

.about-team {
    background: linear-gradient(to top, #e9eef1 35%, #3fd5ad 25%);
    height: 100%;
    width: 100%;
    padding-top: 100px;
    padding-bottom: 5%;
}

.team-text {
    width: 713px;
    height: 231px;
    margin: 0 auto 0 auto;
    padding-top: 5%;
}

.team-text p {
    font-size: 55px;
    line-height: 60px;
    color: #d0dcde;
    font-weight: 800;
    font-family: Queulatbold;
    text-align: center;
}

.team-text span {
    color: #020837;
}

.team-photos {
    height: 100%;
    margin-top: 5%;
}

.team-photos .row {
    height: auto;
    margin: auto;
}

#team-1 {
    margin-left: 1%;
    margin-right: 1%;
}

.section-2 {
    padding-top: 5%;
}

.section-3 {
    padding-top: 5%;
    padding-bottom: 5%;
}

.team-photos img {
    height: 185px;
    width: 185px;
    border: 10px solid #020837;
    border-radius: 50%;
}

.middle {
    transition: .5s ease;
    opacity: 0;
    position: absolute;
    text-align: center;
}

.profile-text {
    background-color: #e9efef;
    color: #020837;
    font-size: 15px;
    font-family: Queulatbold;
    height: 165px;
    width: 165px;
    border-radius: 50%;
    padding-top: 65px;
    margin-left: 10px;
    margin-top: 10px;
}

#team-1 p {
    padding-top: 10%;
    text-align: center;
}

#team-1:hover .image {
    opacity: 0.5;
}

#team-1:hover .middle {
    opacity: 0.9;
}

#team-2:hover .image {
    opacity: 0.3;
}

#team-2:hover .middle {
    opacity: 0.9;
}

#team-3:hover .image {
    opacity: 0.3;
}

#team-3:hover .middle {
    opacity: 0.9;
}

#team-4:hover .image {
    opacity: 0.3;
}

#team-4:hover .middle {
    opacity: 0.9;
}

#team-5:hover .image {
    opacity: 0.3;
}

#team-5:hover .middle {
    opacity: 0.9;
}
/* about  finish */
/* other-project  start */

.other-project {
    height: 100%;
    width: 100%;
    background-color: #e9eef1;
    padding-top: 94px;
    padding-bottom: 94px;
}

.other-project-text {
    height: 100%;
    width: 100%;
    padding-left: 10%;
    margin-right: 10%;
}

.other-project-text h4 {
    font-size: 25px;
    line-height: 30px;
    color: #3fd5ae;
    font-weight: medium;
    font-style: italic;
    font-family: Queulat-BoldItalic;
    padding-bottom: 20px;
}

.other-project-text h1 {
    font-size: 55px;
    line-height: 60px;
    color: #020837;
    font-weight: 800;
    font-family: Queulatbold;
    padding-bottom: 2%;
}

.other-project-text p {
    font-size: 15px;
    line-height: 20px;
    color: #020837;
    font-weight: lighter;
    font-family: Queulatbold;
}

.other-project-text span {
    font-size: 20px;
    line-height: 20px;
    color: #3fd5ae;
    font-family: Queulat-BoldItalic;
}

.other-project-mail {
    height: 100%;
    width: 100%;
    margin-top: 5%;
}

.mail-text {
    height: 100%;
    width: 100%;
    padding: 5% 15% 5% 15%;
}

.mail-text h3 {
    font-size: 55px;
    line-height: 60px;
    color: #020837;
    font-weight: 800;
    font-family: Queulatbold;
    text-align: center;
}

.mail-text p {
    font-size: 24px;
    line-height: 30px;
    color: #020837;
    font-weight: 500;
    font-family: Queulatbold;
    text-align: center;
}

.mail-text button {
    height: 51px;
    width: 252px;
    font-size: 25px;
    line-height: 35px;
    color: #020837;
    font-weight: 800;
    font-family: Queulatbold;
    text-align: center;
    border: 3px solid #020837;
}
/* other-project  finish */
/* other marks start */

.other-marks-map {
    height: 100%;
    width: 100%;
    background-color: #e9eef1;
    overflow: hidden;
}

.world-map {
    position: relative;
    height: 100%;
    width: 100%;
}

.world-map img {
    width: auto;
    height: auto;
}

.world-map .map-buttons {
    width: 80vw;
    position: absolute;
    top: 15%;
    left: 50%;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
}

.map-buttons button {
    height: 142px;
    width: 142px;
    border: 10px solid #3fd5ae;
    font-size: 20px;
    color: #020837;
    font-weight: 800;
    font-family: Queulatbold;
    text-align: center;
    background-color: rgb(63, 213, 174, 0.6);
}

#country-button {
    margin-right: 10vw;
}

#city-button {
    margin-right: 10vw;
}

.world-map button:hover {
    background-color: #3fd5ae;
    border: 10px solid #3fd5ae;
}

.references {
    height: 100%;
    width: 100%;
    padding-right: 5%;
    padding-left: 5%;
    background-color: #e9eef1;
}

.references-logos .row {
    margin-top: 3%;
    margin-left: 0;
}

.references-logos .col {
    box-shadow: saddlebrown;
    margin: 1%;
    height: 15vh;
    text-align: center;
    padding-top: 4vh;
    padding-bottom: 4vh;
}

.references-logos img {
    transition: all linear .4s;
    max-width: 60%;
    max-height: 60%;
    margin: 10%;
}

.other-logos {
    max-width: 55% !important;
    max-height: 55% !important;
}

.references-logos img:hover {
    transform: scale(1.3);
}
/* other marks finish*/
/* career  start*/

.career-text {
    background-color: #e9eef1;
    height: 100%;
    width: 50vw;
    margin: 5% 10% 5% 8%;
}

.career-text h3 {
    font-size: 24px;
    line-height: 30px;
    color: #3fd5ae;
    font-weight: bold;
    font-style: italic;
    font-family: Queulatbold;
}

.career-text span {
    font-size: 24px;
    color: #3fd5ae;
    font-weight: lighter;
    font-style: italic;
    font-family: Queulatbold;
}

.career-text p {
    font-size: 15px;
    line-height: 25px;
    color: #020837;
    font-weight: 500;
    font-family: Queulatbold;
}

.career-text h6 {
    font-size: 15px;
    line-height: 2px;
    color: #3fd5ae;
    font-weight: bold;
    font-family: Queulatbold;
    padding-top: 43px;
}

.career-social {
    height: 100%;
    border-top: 2px solid #3fd5ae;
    background-color: #e9eef1;
    width: 80vw;
    margin: 0 10% 3% 5%;
}

.career-social h2 {
    font-size: 25px;
    line-height: 20px;
    color: #3fd5ae;
    font-weight: 800;
    font-family: Queulatbold;
    padding: 4% 5% 0 5%;
}

.career-social p {
    width: 45vw;
    font-size: 15px;
    line-height: 20px;
    color: #000000;
    font-weight: 400;
    font-family: Queulatbold;
    padding-top: 2%;
    padding-left: 5%;
}

 .career-social p b{
     font-size: 18px;
    font-weight: 800;
    font-family: 'QueulatAlt-Black';
}
.career-social div {
    width: 45vw;
    font-size: 15px;
    line-height: 20px;
    color: #000000;
    font-weight: 400;
    font-family: Queulatbold;
    padding-top: 2%;
    padding-left: 5%;
}

.career-social button {
    padding: 0;
    width: 251px;
    height: 50px;
    border: 5px solid #020837;
    margin-top: 1%;
    margin-left: 5%;
}

.career-other-works {
    height: 65px;
    width: 1049px;
    margin: 0 159px 49px 149px;
}

.career-other-works-end {
    background-color: #fff;
    height: 118px;
    width: 1049px;
    margin: 0 159px 49px 149px;
    border-bottom: 2px solid #3fd5ae;
}

.career-other-works-end img {
    height: 20px;
    width: 20px;
    float: right;
    margin-top: 46px;
    margin-right: 74px;
}

.career-other-works img {
    height: 20px;
    width: 20px;
    float: right;
    margin-top: 20px;
    margin-right: 74px;
}

.career-other-works-text {
    width: 100%;
    height: 20px;
    font-size: 25px;
    line-height: 20px;
    color: #3fd5ae;
    font-weight: 800;
    font-family: Queulatmedium;
    padding-top: 43px;
    padding-left: 75px;
    padding-right: 74px;
    margin-bottom: 49px;
    border-top: 2px solid #3fd5ae;
}

.career-apply {
    text-decoration: none;
}

.career-other-works-text h2 {
    width: 100%;
    height: 20px;
    font-size: 25px;
    line-height: 20px;
    color: #3fd5ae;
    font-weight: 800;
    font-family: Queulatmedium;
}

.allplus {
    width: 0px!important;
    height: 0px!important;
    margin-top: 0px!important;
    padding: 0 !important;
    border: 0!important;
    margin-left: 0 !important;
    color: #3fd5ae!important;
    position: absolute!important;
    left: 90%!important;
}

.allminus {
    width: 0px !important;
    height: 0px !important;
    margin-top: 0px!important;
    margin-left: 0 !important;
    padding: 0 !important;
    border: 0!important;
    color: #3fd5ae!important;
    position: absolute!important;
    left: 90%!important;
    display: none;
}

.allplus:active:focus {
    box-shadow: none;
    background-color: transparent;
    border-color: transparent;
    color: transparent;
}

.minus:active:focus {
    box-shadow: none;
    background-color: transparent;
    border-color: transparent;
    color: transparent;
}

.minus:hover {
    background-color: transparent;
    border: none;
}

.minus:active {
    background-color: transparent;
    box-shadow: none;
}

.minus:hover {
    background-color: transparent;
    border: none;
}

.smm {
    display: none;
}

.mclass {
    display: none;
}

.apply {
    margin-right: 50%;
}

#social-media-menager-btn {
    display: none;
}

#social-media-menager-btn-2 {
    display: none;
}

#social-media-menager-btn-3 {
    display: none;
}

#social-media-menager-btn-4 {
    display: none;
}

#social-media-menager-btn-5 {
    display: none;
}
/* mark slider start*/

#mark-slider {
    width: 100%;
    background-color: #e9eef1;
    margin-bottom: 100px;
    overflow: hidden;
}

.slick-slider {
    width: 1048px;
    margin-top: 99px;
}

.slick-slide {
    width: 135px !important;
    outline: none !important;
}

.for_slick_slider {
    display: flex;
    width: 60vw;
}

.for_slick_slider .item {
    width: 145px;
    height: 100px;
    margin: 10px;
}

.for_slick_slider .item img {
    width: 140px;
    transition: all linear .4s;
    display: inline;
}

.for_slick_slider .slick-center img {
    color: red;
}

.for_slick_slider .slick-center img {
    transform: scale(1.7);
}

.slider-team-photos img {
    border: 5px solid #020837;
    border-radius: 50%;
}
/* mark slider finish*/
/*hover effect*/
/*hover effect*/
/* footer start */

footer {
    background-color: #020837;
}

footer h5 {
    font-size: 24px;
    line-height: 30px;
    color: #3fd5ae;
    font-weight: 800;
    font-family: Queulatbold;
    margin-top: 5%;
}

footer h5 a {
    font-size: 20px;
}

footer p {
    color: #fff;
    font-size: 28px;
    line-height: 40px;
    color: #e9eff0;
    font-weight: 800;
    font-family: QueulatAlt-Black;
}

.footer-mail {
    text-align: right;
    padding-right: 16%;
}

.footer-mail a {
    color: #fff;
}

.footer-mail a:hover {
    color: #3fd5ae;
}

footer img {
    margin-top: 5%;
    height: 6vh;
    width: auto;
}

footer a {
    text-decoration: none;
    color: #3fd5ae;
    padding: 1.5%;
}

footer a:hover {
    color: #fff;
}

#footer-left {
    padding-left: 10%;
}

#mailto {
    text-decoration: none;
    color: #fff;
}

#mailto:hover {
    color: #3fd5ae;
}
/* footer finish */
/* HOVER */

.hovereffect {
    width: 100%;
    height: 100%;
    float: left;
    overflow: hidden;
    position: relative;
    text-align: center;
    cursor: default;
}

.hovereffect .overlay {
    position: absolute;
    overflow: hidden;
    width: 80%;
    height: 80%;
    left: 10%;
    top: 10%;
    -webkit-transition: opacity 0.5s, -webkit-transform 0.5s;
    transition: opacity 0.5s, transform 0s;
    -webkit-transform: scale(0, 1);
    -ms-transform: scale(0, 1);
    transform: scale(0);
}

.hovereffect:hover .overlay {
    opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(0.9);
}

.hovereffect img {
    display: block;
    position: relative;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
}

.hovereffect:hover img {
    opacity: 0.7;
}

.hovereffect h2 {
    text-transform: uppercase;
    text-align: center;
    position: relative;
    background-color: transparent;
    color: #020837;
    padding: 4em 0;
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.8s, transform 0.8s;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
    cursor: pointer;
}

.hovereffect h2 i {
    padding: 1rem;
    border: 2px solid #020837;
    border-radius: 10px;
}

.overlay button {
    border: 5px solid #020837;
    color: #020837;
    margin-top: 10%;
}

.overlay button:hover {
    border: 5px solid #020837;
    background-color: #020837;
    color: #fff;
}

.hovereffect a,
.hovereffect p {
    color: #FFF;
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transition: opacity 0.5s, -webkit-transform 0.5s;
    transition: opacity 0.5s, transform 0.5s;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
}

.hovereffect:hover a,
.hovereffect:hover p,
.hovereffect:hover h2 {
    opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}
/*HOVER  FINISH*/
/*RESPONSIVE STARTt*/

@media screen and (min-width:1600px) {
    .about-team {
        background: linear-gradient(to top, #e9eef1 36%, #3fd5ad 25%);
        height: 100%;
        width: 100%;
        padding-top: 100px;
        padding-bottom: 5%;
    }
    .works-detail {
        padding-top: 10%;
    }
}
/*RESPONSIVE 1200PX START*/

@media screen and (max-width: 1200px) {
    .wrapper {
        width: 50vw;
    }
    #sidebar {
        width: 100vw;
        right: -100vw;
    }
    #sidebar .list-items {
        width: 100vw;
        padding: 0%;
        padding-top: 15%;
        padding-bottom: 15%;
        margin-left: 0;
        left: 35%;
    }
    #sidebar .list-items li {
        width: 100%;
    }
    #sidebar .list-items li a {
        font-size: 35px;
        width: 100%;
        line-height: 5vh;
    }
    #sidebar .list-items h3 {
        width: 100%;
    }
    .wrapper .menu-btn {
        right: 30%;
    }
    #btn:checked~.menu-btn {
        right: 0;
        padding-right: 175%;
    }
    #works {
        margin-top: 5%;
    }
    .visit-bracer {
        height: 55px;
    }
    .footer-bar-buttons .btn:first-child {
        margin-bottom: 10px;
    }
}
/*RESPONSIVE 1200PX fınısh*/
/*Responsive 992 Start*/

@media screen and (max-width: 992px) {
    .references-logos img {
        max-width: 80%;
        max-height: 80%;
    }
    .team-text p {
        font-size: 50px;
    }
}
/*Responsive 992 Start*/

@media screen and (max-width: 992px) {
    .wrapper {
        width: 50vw;
    }
    #sidebar {
        width: 100vw;
        right: -100vw;
    }
    #sidebar .list-items {
        width: 100vw;
        padding: 0%;
        padding-top: 20%;
        padding-bottom: 10%;
    }
    #sidebar .list-items li {
        width: 100%;
    }
    #sidebar .list-items li a {
        font-size: 35px;
        width: 100%;
        line-height: 5vh;
    }
    #sidebar .list-items h3 {
        width: 100%;
    }
    .wrapper .menu-btn {
        right: 30%;
    }
    #btn:checked~.menu-btn {
        right: 0;
        padding-right: 175%;
    }
    #btn:checked~#sidebar {
        right: 0;
    }
    #banner-text h1 {
        font-size: 65px;
        line-height: 60px;
    }
    /*REFERENCES START*/
    .map-buttons button {
        height: 102px;
        width: 102px;
        border: 7px solid #3fd5ae;
        font-size: 16px;
    }
    /*REFERENCES FINISH*/
    /*About Start*/
    #works .row {
        height: 100%;
    }
}
/*Responsive 768 START*/

@media screen and (max-width: 768px) {
    /*INDEX*/
    header {
        height: 90vh;
    }
    .wrapper {
        width: 50vw;
    }
    #sidebar {
        width: 100vw;
        right: -100vw;
    }
    #sidebar .list-items {
        width: 100vw;
        padding: 0%;
        /* padding-top: 50vw; */
        top: 25%;
    }
    #sidebar .list-items li {
        width: 100%;
    }
    #sidebar .list-items li a {
        font-size: 35px;
        width: 100%;
        line-height: 6vh;
    }
    #sidebar .list-items h3 {
        width: 100%;
        font-size: 18px;
    }
    .wrapper .menu-btn {
        right: 30%;
    }
    #btn:checked~.menu-btn {
        right: 0;
        padding-right: 175%;
    }
    #btn:checked~#sidebar {
        right: 0;
    }
    .services-text h1 {
        font-size: 25px;
        line-height: 30px;
    }
    #banner-text h1 {
        font-size: 40px;
        line-height: 55px;
    }
    .banner-social {
        display: none;
    }
    #banner-arrow {
        display: none;
    }
    .team-text {
        width: 100%;
        padding: 5%;
    }
    .team-text p {
        font-size: 35px;
    }
    /*REFERENCES START*/
    .references-logos img {
        max-width: 70%;
        max-height: 70%;
    }
    .map-buttons button {
        height: 82px;
        width: 82px;
        border: 5px solid #3fd5ae;
        font-size: 12px;
    }
    .slider-team-photos img {
        margin-right: 10%;
        height: 90px;
        width: 50px;
        border: 5px solid #020837;
        border-radius: 50%;
    }
    .about-text-1 h6 {
        font-size: 18px;
        line-height: 23px;
    }
    .team-photos {
        display: none;
    }
    .about-team {
        background: linear-gradient(to top, #e9eef1 30%, #3fd5ad 25%);
    }
    /*REFERENCES FINISH*/
    .first-adress {
        width: 100%;
        display: block;
    }
    .second-adress {
        width: 100%;
        display: block;
    }
    .visit-bracer {
        display: none;
    }
}
/*Responsive 768 FINISH*/
/*Responsive 600 START*/

@media screen and (max-width: 600px) {
    /*ABOUT*/
    .about-text-1 {
        width: 100%;
        height: 100%;
    }
    .about-text-1 h6 {
        font-size: 15px;
        line-height: 20px;
    }
    .about-text-1 h3 {
        font-size: 25px;
        line-height: 30px;
    }
    .about-text-2 .col-4 {
        flex: 1 0 100%;
        text-align: center;
    }
    .box {
        padding-top: 10%;
    }
    .about-text-2 ul {
        float: none;
        width: 25%;
        margin-left: 35%;
    }
    .team-text {
        width: 100%;
    }

    .team-text p {
            font-size: 30px;
            line-height: 55px;
        }

    /*SERVICES*/
    .services-text h1 {
        font-size: 20px;
        line-height: 25px;
    }
    .png-texts {
        width: 100vw;
        height: 100%;
        flex: 1 0 100%;
    }
    #png-texts-2 {
        padding-left: 0;
        padding-right: 0;
    }
    /*WORKS*/
    .works {
        overflow: hidden;
    }
    .blue {
        flex: 1 0 100%;
    }
    .blue-2 {
        flex: 1 0 100%;
    }
    .white {
        flex: 1 0 100%;
    }
    .white-2 {
        flex: 1 0 100%;
    }
    .for_slick_slider .item img {
        width: 100px;
        float: right;
    }
    .slick-slide {
        width: 100px;
    }
    #mark-slider {
        width: 100%;
        overflow: hidden;
    }
    .other-project {
        padding-top: 5%;
        padding-bottom: 5%;
    }
    .other-project-text {
        padding-left: 10%;
        padding-right: 10%;
    }
    .other-project-text h4 {
        font-size: 15px;
        line-height: 20px;
    }
    .other-project-text h1 {
        font-size: 35px;
        line-height: 40px;
        padding-bottom: 5%;
    }
    .other-project-text span {
        font-size: 15px;
    }
    .mail-text h3 {
        font-size: 40px;
        line-height: 45px;
    }
    .mail-text p {
        font-size: 15px;
        line-height: 30px;
        padding-top: 10% !important;
    }
    .mail-text button {
        width: auto;
        height: auto;
        margin-top: 1% !important;
    }
    /*FOOTER*/
    #footer-left {
        padding-left: 10%;
        padding-right: 10%;
    }
    footer p {
        font-size: 18px;
    }
    footer h5 {
        font-size: 15px;
    }
    .footer-mail {
        text-align: center;
        padding-right: 0;
    }
    /*REFERENCES*/
    .references-logos img {
        max-width: 60%;
        max-height: 5vh;
    }
    #country-button {
        margin-right: 5vw;
    }
    #city-button {
        margin-right: 5vw;
    }
    /*CAREER*/
    .career-text {
        width: 90vw;
        margin: 5%;
    }
    .career-text h3 {
        font-size: 15px;
    }
    .career-text h3 span {
        font-size: 15px;
    }
    .career-text p {
        font-size: 12px;
    }
    .career-social h2 {
        font-size: 15px;
    }
    .career-social p {
        width: 100%;
    }
    .career-social div {
        width: 100%;
    }
    .career-social button {
        width: 100px;
        height: 40px;
    }
    /*CONTACT*/
    #group-4-text {
        width: 100%;
    }
    /*PROJECT DETAIL*/
    #detail-1 {
        width: 100%;
    }
    #detail-1-text {
        width: 100%;
    }
    #detail-1-works {
        text-align: center;
    }
    #top-text {
        font-size: 20px;
    }
    #medium-text {
        font-size: 25px;
        line-height: 30px;
    }
    /*INDEX*/
    header {
        height: 80vh;
    }
    #banner-text h1 {
        font-size: 35px;
        line-height: 40px;
    }
    .wrapper {
        width: 50vw;
    }
    #sidebar {
        width: 100vw;
        right: -100vw;
    }
    #sidebar .list-items {
        width: 100vw;
        padding: 0%;
        top: 25%;
        left: 25%;
        margin-left: 0;
            /* padding-top: 50%;
            padding-bottom: 30%; */
        }
        #sidebar .list-items li {
            width: 100%;
        }
        #sidebar .list-items li a {
            font-size: 35px;
            width: 100%;
            line-height: 6vh;
        }
        #sidebar .list-items h3 {
            width: 100%;
        }
        .wrapper .menu-btn {
            right: 30%;
        }
        #btn:checked~.menu-btn {
            right: 0;
            padding-right: 175%;
        }
        #btn:checked~#sidebar {
            right: 0;
        }
        .banner-social p {
            font-size: 15px;
        }
        .banner-social {
            padding-top: 80vh;
        }


        /* responsive 600 can düzenlemeler */

        .team-text p {
            font-size: 30px;
            line-height: 45px;
        }
        #group-4-text h3 {
            font-size: 30px;
            line-height: 45px;
        } 

        .about-text-2 .row {
           margin-top: 0px; 
        }

        .box {
            padding-top: 3%;
        }

        .about-text-1 h3 {
            margin-bottom: -10px;
        }
        .about-text-1 h3 {
            line-height: 21px;
        }

        .mail-text p {
            line-height: 25px;
        }

        #sidebar .list-items {
            left: 21%;
        }


        .for_slick_slider .item {
            margin: auto;
        }

    }
    /*Responsive 600 FINISH*/
    /*Responsive  FINISH*/
    
    .MultiCarousel {
        float: left;
        overflow: hidden;
        padding: 15px;
        width: 100%;
        position: relative;
        margin-top: 10%;
    }
    
    .MultiCarousel .MultiCarousel-inner {
        transition: 1s ease all;
        float: left;
    }
    
    .MultiCarousel .MultiCarousel-inner .item {
        float: left;
    }
    
    .MultiCarousel .MultiCarousel-inner .item>div {
        text-align: center;
        padding: 10px;
        margin: 10px;
        background: none;
        color: #666;
    }
    
    .MultiCarousel .leftLst,
    .MultiCarousel .rightLst {
        /* position: relative; */
        border-radius: 50%;
        top: calc(33% - 20px);
    }
    
    .MultiCarousel .leftLst {
        left: -1%;
        margin-left: 45%;
    }
    
    .MultiCarousel .rightLst {
        right: -1%;
    }
    
    .rightLst i {
        border: 4px solid transparent;
        border-radius: 50%;
        color: #020837;
    }
    
    .leftLst i {
        border: 4px solid transparent;
        border-radius: 50%;
        color: #020837;
        /* position: relative; */
    }
    
    .MultiCarousel .leftLst.over,
    .MultiCarousel .rightLst.over {
        pointer-events: none;
        background: none;
    }
    
    @media screen and (max-width: 992px) {
        .MultiCarousel .leftLst {
            left: -1%;
            margin-left: 40%;
        }
    }
    
    @media screen and (max-width: 768px) {
        .MultiCarousel .leftLst,
        .MultiCarousel .rightLst {
            position: absolute;
        }
        .MultiCarousel .leftLst {
            left: -1%;
            margin-left: 5%;
        }
        .MultiCarousel .rightLst {
            margin-right: 5%;
        }
    }
    
    .pad15 img {
        width: 160px;
        height: 160px;
        object-fit: cover;
        border: 5px solid #020837;
        border-radius: 50%;
    }
    
    .pad15 p {
        color: #020837;
        font-size: 15px;
        font-family: Queulatbold;
    }
    
    .btn-link {
        color: #3fd5ae;
        border: none;
    }
    
    .btn-link:hover {
        color: #3fd5ae;
    }
    
    .btn-link:focus {
        box-shadow: 0 0 0 0;
    }
    /*Fixed bottom bar*/
    
    .fixed-bottom-bar {
        width: 100%;
        background-color: #020837;
        position: fixed;
        left: 0;
        bottom: 0;
        color: #fff;
        padding: 10px;
    }
    
    .fbb-box {
        margin-left: auto;
        margin-right: auto;
        text-align: center;
    }
    
    .fixed-bottom-bar p {
        display: inline-block;
        font-size: 14px;
        margin-bottom: 0;
    }
    
    .fixed-bottom-bar button {
        height: 30px;
        font-size: 13px;
        margin-left: 1%;
        background-color: #e9eef1;
        color: #020837;
    }
    
    .pp-box h3 {
        font-size: 40px;
    }
    
    .pp-box {
        margin: 1% 0 3% 0;
    }
    
    .pp-box .about-text-1 {
        width: 100%;
        margin: 0;
    }
    
    .pp-box .about-text-1 p {
        padding-top: 1%;
    }