﻿@media only screen and (min-width: 400px) {
    .hide-br {
        display: none;
    }
}

@media only screen and (max-width: 400px) {
    .Licenses-Achievements {
        width: 100%;
        grid-template-columns: 33.3% 33.3% 33.3%;
        padding-bottom: 30px
    }

    .Licenses-Achievements-card {
        width: 100%;
        height: 90px;
        font-size: 11px
    }
}

@media only screen and (max-width: 450px) {
    .part2-login .input-group-prepend img {
        height: 65px;
        width: 100%
    }

    .part2-login .input-group {
        display: block;
    }

        .part2-login .input-group .form-control {
            width: 100%;
            margin-top: 15px;
        }

    .part2-login .input-group {
        align-items: center;
        margin-top: 10px;
        border-radius: 10px;
    }
}

@media only screen and (max-width: 800px) and (min-width: 451px) {
    .part2-login .input-group .form-control {
        height: 72px;
    }

    .part2-login .input-group {
        align-items: center;
        margin: 10px 0 30px 0;
        border-radius: 10px;
    }
}

@media only screen and (min-width: 801px) {
    .part2-login .input-group .form-control {
        height: 72px;
    }

    .part2-login .input-group {
        align-items: center;
        margin: 10px 0 30px 0;
        border-radius: 10px;
    }
}

@media only screen and (min-width: 992px) {
    .newsview {
        margin: 119.5px auto 0 auto;
    }

    .projectpg-container {
        padding-top: 70px
    }

    .contactusview {
        padding-top: 50px
    }

    .viewport {
        padding-top: 30px;
        min-height: calc(100vh - 320px);
        margin-top: 119px;
    }

    .cardscontainer {
        display: grid;
        grid-template-columns: auto 500px;
    }

    .cardcontainer h5 {
        height: 10%
    }

    .cardcontainer .paragraf {
        overflow-y: scroll;
        font-size: 14px;
        line-height: 2.5;
        padding-left: 10px;
        height: 90%;
        text-align: justify;
        scrollbar-width: thin;
        scrollbar-color: #929292 #dddddd70;
    }

        .cardcontainer .paragraf::-webkit-scrollbar {
            width: 12px;
        }

        .cardcontainer .paragraf::-webkit-scrollbar-track {
            background: #dddddd70;
        }

        .cardcontainer .paragraf::-webkit-scrollbar-thumb {
            background-color: #929292;
            border-radius: 20px;
            border: 3px solid #929292;
        }

    .projectpg-container .row .cardcontainer, .projectpg-container .row .cardcontainer .card, .projectpg-container .row .cardcontainer img {
        height: 500px
    }

    .nav-item-mobile {
        display: none;
    }

    .navdropdown-desktop {
        display: inline-block;
    }

    footer {
        height: 260px;
        border-radius: 100% 100% 0 0;
        padding-top: 70px
    }

    .secoundary-nav {
        display: block;
        position: fixed;
        top: 0;
        width: 100vw;
        z-index: 3
    }

    #navbarDropdownh {
        z-index: 2
    }

    .main-navbar-container {
        display: block;
        position: fixed;
        top: 49.5px;
        width: 100vw;
        border-bottom: 0.5px solid #49494911;
        z-index: 2
    }

    .slidercontainer {
        margin-top: 119.5px
    }
}

@media only screen and (max-width: 991px) {
    .cardscontainer {
        display: flex;
        flex-direction: column
    }
        .cardscontainer .cardcontainer:first-child {
            order: 2
        }
        .cardscontainer .cardcontainer:last-child {
            order: 1;
            margin-bottom:10px
        }

    footer {
        border-radius: 0;
        padding-top: 20px
    }

    .viewport {
        padding-top: 30px;
        min-height: calc(100vh - 435px);
        margin:auto;
    }

    .navdropdown-desktop {
        display: none;
    }

    .projectpg-container .row {
        display: flex;
        flex-direction: column;
    }

        .projectpg-container .row .cardcontainer:first-child {
            margin-bottom: 10px;
        }

    .cardcontainer .paragraf {
        font-size: 13px;
        line-height: 2;
        text-align: justify;
    }

    .ceo-container {
        display: flex;
        flex-direction: column;
    }

    .ceo-img {
        order: 1;
    }

    .ceo-message {
        order: 2;
    }

    .ceo-img .card {
        width: 90%;
        margin: 0 auto 15px auto;
        border-radius: 10px;
        border: none;
        border-radius: 10px;
        box-shadow: 0px 0px 10px 3px #45454536;
    }

        .ceo-img .card img {
            width: 100%;
            border-radius: 10px;
        }

    .ceo-message .card {
        margin: auto;
        width: 90%;
        border: none;
        border-radius: 10px;
        box-shadow: 0px 0px 10px 3px #45454536;
        padding: 15px;
        justify-content: center;
        line-height: 2;
    }

    .ceo-message {
        height: fit-content;
    }

        .ceo-message .card p {
            line-height: 2.5;
            margin: 0;
            font-size: 16px;
        }

    .login-form-container {
        display: block;
    }

        .login-form-container .part1-login, .login-form-container .part1-login img {
            height: 200px;
            border-radius: 20px 20px 0px 0px;
        }

        .login-form-container .part2-login {
            height: fit-content;
            border-radius: 0px 0px 20px 20px;
        }

            .login-form-container .part2-login .portfolio-info .card {
                border-radius: 0px 0px 20px 20px;
            }

    .phone-numbers-container p {
        text-align: center;
    }

    .nav-container-after-login {
        position: absolute;
        top: 7px;
        left: 35px
    }

    .main-navbar {
        display: block;
    }

    .nav-form-container {
        justify-content: space-between;
        padding: 15px 0 10px 0;
    }

    .main-navbar .navbar-toggler {
        position: absolute;
        top: 5px;
        left: 0;
    }

    .input-login-container {
        position: absolute;
        top: 7px;
        left: 35px;
    }

    .searchinput {
        margin: 0;
        margin-left: 5px;
    }

    .searchbtn {
        margin-right: 5px;
    }

    .map-container,
    .googlecard {
        height: 200px;
    }
}

@media only screen and (min-width: 992px) {
    .ceo-container {
        width: 100%;
        margin: auto;
        box-shadow: 0px 0px 10px 3px #45454536;
        border-radius: 15px;
        background-color: white;
        padding: 35px 30px;
        text-align: right;
    }

    .ceo-container {
        display: flex;
        flex-direction: column;
        column-gap: 10px;
        width: 100%;
    }

    .ceo-img {
        height: fit-content;
        width: 65%;
        margin: 0 auto 30px auto;
        order: 1;
    }

        .ceo-img .card {
            border: none;
            box-shadow: 0px 0px 10px 3px #45454536;
        }

            .ceo-img .card img {
                border-radius: 10px;
            }

    .ceo-message {
        order: 2;
    }

        .ceo-message .card p:first-child {
            margin: 0;
        }

        .ceo-message .card, .ceo-message2 .card {
            border: none;
            border-radius: 10px;
            line-height: 3.5;
            justify-content: center;
            font-size: 16px
        }

        .ceo-message .p2 {
            display: none;
        }

    .login-form-container {
        display: grid;
        grid-template-columns: 60% 40%;
        margin: 90px 0;
    }

        .login-form-container .part1-login,
        .login-form-container .part2-login {
            height: 370px;
        }

            .login-form-container .part1-login, .login-form-container .part1-login img {
                border-radius: 0 20px 20px 0;
            }

            .login-form-container .part2-login .portfolio-info .card {
                border-radius: 20px 0 0 20px;
            }

    .phone-numbers-container {
        margin: auto;
        width: 92%;
    }

        .phone-numbers-container p {
            margin: 0;
        }

    .searchinput {
        width: 100%;
    }

    .searchbtn {
        margin: 0 7px 0 14px;
    }

    .callus {
        padding: 15px 20px;
        height: 580px;
    }

    .map-container,
    .googlecard {
        height: 580px;
    }
}

@media only screen and (max-width: 767px) and (min-width: 401px) {
    .Licenses-Achievements {
        width: 90%;
        grid-template-columns: 33% 33% 33%;
        padding-bottom: 20px
    }

    .Licenses-Achievements-card {
        width: 90%;
        height: 30vw;
        font-size: 13px
    }
}

@media only screen and (min-width: 768px) {

    .Licenses-Achievements {
        width: 70%;
        grid-template-columns: 33% 33% 33%;
    }

    .Licenses-Achievements-card {
        width: 150px;
        height: 180px;
        font-size: 14px;
        text-align: center;
        margin: auto
    }
}

@media only screen and (max-width: 801px) {
    .job-card-description {
        grid-template-columns: 100%;
    }
}

@media only screen and (min-width: 802px) {
    .job-card-description {
        grid-template-columns: 50% 50%;
    }
}

@media only screen and (max-width: 767px) and (min-width: 600px) {
    .nav-project-button {
        display: grid;
        grid-template-columns: repeat(4,1fr);
        grid-gap: 1%;
    }

    .clubmob {
        display: none;
    }

    .activityareas-slide .body .activity-items {
        text-align: right
    }

    .activityareas-slide .body .activity-item {
        display: block;
        padding: 7px 14px;
    }

    .activityareas-content {
        grid-template-columns: 40% auto;
        grid-gap: 20px;
        height: 380px;
    }

    .activityareas-slide .body .activity-item, .activityareas-slide .body .activity-items {
        width: 100px;
    }
    /*    .clubcollapse {
        right: 145px;
        top: 114px;
        position: absolute;
    }*/
    .dropdownk {
        position: relative;
        display: inline-block;
    }

    .dropdown-contentk a {
        display: block;
        cursor: pointer
    }

    .dropdownk:hover .dropdown-contentk {
        display: block;
        transition-duration: 10s
    }

    .dropdownk:hover .dropbtnk {
        background-color: #15107a;
        color: white;
    }

    .dropdown-contentk {
        display: none;
        position: absolute;
        z-index: 1;
        right: 105px;
        top: 0;
        transition-duration: 10s
    }

    .aa-btn {
        margin: 10px 0;
        padding: 28px 5%;
        text-align: right;
    }

    .activityareas-slide .header {
        padding-bottom: 20px;
        display: flex;
        justify-content: space-between;
        border-bottom: 0.5px solid rgba(128, 128, 128, 0.562);
        margin: 20px;
    }

        .activityareas-slide .header img {
            width: 20%;
        }

    .activityareas-slide h6 {
        padding: 10px 0;
        margin: 0;
        font-size: 14px;
        width: 75%;
    }

    .activityareas-slide .body {
        padding: 0 28px
    }

    .activityareas-btn {
        height: 340px;
    }

    .activityareas-container {
        margin: auto;
        padding: 80px 0;
    }

    .activityareas-slider {
        height: 380px;
    }

    .activityareas .Description h5 {
        padding-bottom: 20px;
    }

    .gallery-container .expandedImg {
        height: 300px
    }
}

@media only screen and (min-width: 768px) {
    .nav-project-button {
        display: grid;
        grid-template-columns: repeat(4,1fr);
        grid-gap: 1%;
    }

    .clubmob {
        display: none;
    }

    .activityareas-slide .body .activity-items {
        text-align: right
    }

    .activityareas-slide .body .activity-item {
        display: block;
        padding: 7px 14px;
    }

    .activityareas-content {
        grid-template-columns: 25% auto;
        grid-gap: 20px;
        height: 380px;
    }

    .activityareas-slide .body .activity-item, .activityareas-slide .body .activity-items {
        width: 200px;
    }
    /*    .clubcollapse {
        right: 250px;
        top: 139px;
        position: absolute;
    }*/
    .dropdownk {
        position: relative;
        display: inline-block;
    }

    .dropdown-contentk a {
        display: block;
        cursor: pointer
    }

    .dropdownk:hover .dropdown-contentk {
        display: block;
    }

    .dropdownk:hover .dropbtnk {
        background-color: #15107a;
        color: white;
    }

    .dropdown-contentk {
        display: none;
        position: absolute;
        z-index: 1;
        right: 205px;
        top: 0px;
    }

    .aa-btn {
        margin-bottom: 10px;
        padding: 0 5%;
        text-align: right;
        height: 95px
    }

        .aa-btn:last-child {
            margin: 0;
        }

    .activityareas-slide .header {
        padding: 40px 50px 30px 40px;
        display: flex;
        justify-content: space-between;
    }

    .activityareas-slide h6 {
        padding: 10px 0 5px 0;
        border-bottom: 0.5px solid rgba(128, 128, 128, 0.562);
        width: 75%;
    }

    .activityareas-slide .body {
        display: grid;
        grid-template-columns: 200px auto;
        grid-gap: 40px;
        padding-right: 40px;
    }

    .activityareas-btn {
        height: 380px;
    }

    .activityareas-container {
        margin: auto;
        padding: 80px 0;
    }

    .activityareas-slider {
        height: 380px;
    }

    .activityareas .Description h5 {
        padding-bottom: 30px;
    }

    .gallery-container .expandedImg {
        height: 450px
    }
}

@media only screen and (max-width: 599px) {
    .nav-project-button {
        display: grid;
        grid-template-columns: repeat(2,1fr);
        grid-gap: 1%;
    }

        .nav-project-button .navdropdown {
            margin-bottom: 4px
        }

    .card0 {
        grid-template-columns: 100%;
        grid-gap: 10px;
    }

    .card3 {
        height: fit-content;
    }

        .card3 .card {
            padding: 10px;
        }

        .card3 img {
            width: 50px;
            margin: 5px auto;
            padding: 5px
        }

        .card3 .card-body {
            font-size: 13px;
            padding: 5px
        }

        .card3 .card-title {
            margin: 0px;
            text-decoration: none
        }

        .card3 .card-text {
            width: 90%;
        }

        .card3 .clubs {
            margin: 7px 20px 5px 0;
        }

        .card3 .card {
            border-radius: 50px 0 50px 0;
        }
}

@media only screen and (max-width: 599px) {
    .last-news-container {
        display: block;
        margin: auto;
        padding: 0;
    }

        .last-news-container .last-news-card {
            width: 290px;
            margin: auto;
            padding: 0
        }

        .last-news-container .card {
            border: none;
            border-radius: 30px;
            box-shadow: 3px 3px 9px 3px #c2c2c2;
            margin-bottom: 15px;
        }

    .dropdown-contentk {
        display: none
    }

    .clubmob {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        width: 100%;
        margin: auto;
        justify-content: space-around;
        order: 4
    }

    .activityareas-slide .body .activity-itemss {
        width: 30%;
        text-align: center;
        margin: 0
    }

    .activityareas-slide .body ul {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        width: 100%;
        margin: auto;
        justify-content: space-around
    }

    .activityareas-slide .body .activity-item {
        padding: 7px 0;
        width: 48%
    }

    .activityareas-slide .body .dropdownk {
        order: 3;
        margin: 10px 0 5px 0;
    }

    .activityareas-slide .body .dropbtnk {
        border: none;
    }

    .clubmob {
        border: 0.5px solid #15107a;
        border-radius: 25px;
        padding: 10px 5px
    }

    .activityareas-btn {
        display: flex;
        flex-direction: column;
        grid-gap: 2.5px;
        justify-content: center;
        justify-content: space-around;
        margin: auto;
        width: 100%;
    }

    .activityareas-content {
        grid-template-columns: 100%;
        grid-gap: 5px;
    }

    .activityareas-slide .body .activity-items {
        width: 100%;
    }

    .clubcollapse {
        /*     right: 130px;
        top: 114px;
        position: absolute;*/
        display: none;
    }

    .aa-btn {
        margin: 2.5px auto;
        width: 100%;
        padding: 0 5%;
        font-size: 12px;
        height: 40px;
        text-align: center;
        width: 100%
    }

    .activityareas-slide .body .activity-item {
        text-align: center;
        width: 100%;
    }

    .activityareas-slide .header {
        padding-bottom: 20px;
        display: flex;
        justify-content: space-between;
        border-bottom: 0.5px solid rgba(128, 128, 128, 0.562);
        margin: 20px;
    }

        .activityareas-slide .header img {
            width: 20%;
            max-width: 50px
        }

    .activityareas-slide h6 {
        padding: 10px 0;
        margin: 0;
        font-size: 14px;
        width: 75%;
    }

    .activityareas-slide .body {
        padding: 0 5%;
        text-align: center
    }

    .activityareas-container {
        margin: auto;
        padding-top: 15px;
    }

    .activityareas-slider {
        height: 320px;
    }

    .activityareas .Description h5 {
        padding-bottom: 15px;
    }

    .activityareas-slide .body .activity-items {
        text-align: center;
    }

    .gallery-container .expandedImg {
        height: 200px
    }
}

@media only screen and (min-width: 600px) and (max-width: 994px) {

    .last-news-container {
        display: flex;
        flex-direction: row;
        justify-content: space-around;
        margin: auto;
        padding: 0;
        flex-wrap: wrap;
        max-width: 650px
    }

        .last-news-container .last-news-card {
            width: 300px;
        }

            .last-news-container .last-news-card:last-child {
                margin-top: 30px
            }

        .last-news-container .card {
            border: none;
            border-radius: 30px;
            box-shadow: 3px 3px 9px 3px #c2c2c2;
        }

    .card0 {
        grid-template-columns: 50% 50%;
        grid-gap: 5px;
    }

    .card3 {
        height: 365px;
        margin-bottom: 25px;
    }

        .card3 .card {
            padding: 10px;
        }

        .card3 a {
            text-decoration: none;
            display: none
        }

        .card3 img {
            width: 85px;
            margin: 85px auto 30px;
            padding: 20px
        }

        .card3 .card:hover img {
            width: 50px;
            margin: 15px auto;
            padding: 5px
        }

        .card3 .card-body {
            font-size: 13px;
            padding: 5px
        }

        .card3 .card-title {
            font-size: 16px;
            font-weight: bold;
            margin: 0px;
        }

        .card3 .card:hover .card-title {
            font-size: 14px;
            margin: 0px;
        }

        .card3 .card-text {
            font-size: 13px;
            margin: 0px;
            width: 70%;
            font-family: numfont;
            cursor: pointer
        }

        .card3 .clubs {
            font-size: 13px;
            margin: 7px 35px 5px 0;
        }

        .card3:nth-child(1) .card {
            border-radius: 50px 0 50px 0;
        }

        .card3:nth-child(3) .card {
            border-radius: 0 50px 0 50px;
        }

        .card3:nth-child(2) .card {
            border-radius: 0 50px 0 50px;
        }

        .card3:nth-child(4) .card {
            border-radius: 50px 0 50px 0;
        }
}

@media only screen and (min-width: 995px) {
    .last-news-container {
        margin: auto;
        display: flex;
        flex-direction: row;
        justify-content: space-around;
        max-width: 1000px
    }

        .last-news-container .last-news-card {
            width: 310px
        }

            .last-news-container .last-news-card .card {
                border: none;
                border-radius: 30px;
                box-shadow: 3px 3px 9px 3px #c2c2c2;
                margin-bottom: 15px;
            }

    .card0 {
        grid-template-columns: repeat(4,1fr);
        grid-gap: 5px;
    }

    .card3 {
        height: 350px;
        margin-bottom: 25px;
    }

        .card3 .card {
            padding: 10px;
        }

        .card3 a {
            text-decoration: none;
            display: none
        }

        .card3 img {
            width: 85px;
            margin: 85px auto 30px;
            padding: 20px
        }

        .card3 .card:hover img {
            width: 50px;
            margin: 15px auto;
            padding: 5px
        }

        .card3 .card-body {
            font-size: 13px;
            padding: 5px
        }

        .card3 .card-title {
            font-size: 16px;
            font-weight: bold;
            margin: 0px;
        }

        .card3 .card:hover .card-title {
            font-size: 13px;
            margin: 0px;
        }

        .card3 .card-text {
            font-size: 12px;
            margin: 0px;
            width: 70%;
            font-family: numfont;
            cursor: pointer
        }

        .card3 .clubs {
            font-size: 13px;
            margin: 7px auto 5px auto;
            text-align: right;
            min-width: 150px
        }


        .card3 .card {
            border-radius: 50px 0 50px 0;
            /* border-radius: 50% 20% / 10% 40%;*/
        }

    /*        .card3:nth-child(2) .card {
            border-radius: 50px 0 50px 0;
        }

        .card3:nth-child(3) .card {
            border-radius: 50px 0 0 50px;
        }

        .card3:nth-child(4) .card {
            border-radius: 0 50px 0 50px;
        }*/
}


@media only screen and (max-width: 750px){
    .fb-grid {
        grid-template-columns:100%;
    }

    .fb-button {
        width: 100%;
    }
    .fb-head {
        display: block;
    }
    .fb-head div {
        display: flex;
    }
}
@media only screen and (min-width: 751px) {
    .fb-grid {
        grid-template-columns: repeat(2,1fr);
    }
    .fb-button {
        width: 150px;
    }
    .fb-head {
        display: flex;
        justify-content: space-between;
        font-size: 13px
    }
        .fb-head div {
            display: grid;
            grid-template-columns: auto 80px;
        }
}