/*
  ##Device = Desktops
  ##Screen = 1281px to higher resolution desktops
*/

@media (min-width: 1281px) {
    .hidden-lg {
        display: none !important;
    }

    .close-btn {
        display: none;
    }
    .english-link{
        display: none !important;
    }

}

/* 
  ##Device = Laptops, Desktops
  ##Screen = B/w 1025px to 1280px
*/

@media (min-width: 1025px) and (max-width: 1280px) {

    .hidden-md {
        display: none !important;
    }
    .english-link{
        display: none;
    }

    img {
        width: 100%;
    }

    .close-btn {
        display: none;
    }
    .calender img {
        width: 50px;
        height: 50px;
    }
    h1 {
        font-size: 23px;
    }
    .limit-lines {

        width: 380px;
    }

}

/* 
  ##Device = Tablets, Ipads (portrait)
  ##Screen = B/w 768px to 1024px
*/

@media (min-width: 768px) and (max-width: 1024px) {

    .hidden-sm {
        display: none !important;
    }

    .close-btn {
        display: none;
    }

    h1 {
        font-size: 18px;
    }

    .close-menu, .icons {
        display: none !important;
    }


    .limit-lines {
        width: 100%;
        overflow: hidden;
        box-sizing: border-box;
    }

    .staff p {

        font-size: 17px;
    }

    .div-title {
        font-size: 21px;
    }

    .div-description {
        color: white;
        font-size: 15px;
    }

    .plus {

        font-size: 15px;
    }

    .icon-plus-button {
        font-size: 21px;
    }

    .para-contact {
        font-size: 17px;
        font-weight: 900;
        line-height: 18px;
    }

    .s-contact li {
        padding: 1px;
    }

    .s-contact li a, .s-contact li button {
        font-size: 12px;
        width: 20px;
        height: 20px;
    }

    .h4, h4 {
        font-size: 16px;
    }

    p {
        font-size: 13px;
        line-height: 20px;

    }

    .font-26 {
        font-size: 22px;
    }

    .sign-now {
        top: 36%;
        left: 28%;
        font-size: 18px;
        padding-left: 27px;
        padding-right: 27px;
    }

    .say {
        position: absolute;
        bottom: 5%;
        right: 19%;
        font-size: 14px;
    }

    .statistics {
        color: #000000c2;
        font-size: 12px;
        padding-right: 7px;
        padding-left: 7px;
    }

    .form {
        bottom: 19px
    }

    .icon-sendd {
        bottom: 14px;
    }

    .cs {
        margin-top: 2%;
        border-radius: 2px;
        padding-left: 3px;
        font-size: 59px;
        color: white;
        border: none;
        float: left;
    }

    .info {
        margin-top: 4%;
        position: absolute;
        right: 12%;
    }

    .logo img {
        height: auto;

    }

    .homepage header .row {
        flex-wrap: nowrap;

    }

    .dropdowns {
        height: 70%;
        display: flex;
        align-items: flex-end;
        margin-top: 0;
        float: right;
    }

    .head-links > li > a {

        font-size: 10px;
    }

    .head-links a {
        padding: 2px;
    }

    .customer-services-area {
        display: flex;
        float: left;
        margin-top: 20px;
    }

    .font-50 {
        font-size: 37px;
    }

    .law {

        font-size: 11px;
    }

    .phone {
        font-size: 12px;

    }

    .sc li {
        padding: 1px !important;
    }

    .sc li a, .sc li button {
        font-size: 10px;
        width: 19px;
        height: 19px;
    }

    .pie-wrapper {
        width: 150px;
        height: 150px;
        border: 10px solid #ddd;
    }

    .pie-wrapper .pie {
        margin: -10px;
    }

    .pie-wrapper .pie .half-circle {
        width: 150px;
        height: 150px;
        border: 10px solid #ffcb05;

    }

    .pie-wrapper .label {
        top: 10%;
        left: -13%;
        font-size: 2em;
    }
    .bg1 , .img-bg{
        height: 400px;
    }
    .left-7 {
        left: 13%;
    }
    .img-bg2{
        display: none;
    }
    .gray-bg {
        height: 410px;
        width: 350px;
    }
    .s-1 {
        margin-top: 30px;
    }
    .calender img {
        width: 50px;
        height: 50px;
    }
    .ca {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        margin-top: 20px;
    }
    .gray-bg .more2{
        display: none;
    }
    .ca {
        width: fit-content;
    }
    #calender-slider {
        margin-top: -8px;
    }
}

/*
  ##Device = Low Resolution Tablets, Mobiles (Landscape)
  ##Screen = B/w 481px to 767px
*/

@media (min-width: 0px) and (max-width: 767px) {

    header {
        padding: 0;
    }

    .single-page__content {
        text-align: justify;
    }
    .gray-bg .more2{
        display: none;
    }
    .ca {
        width: fit-content;
    }


    h1 {
        font-size: 15px;
    }

    p {
        font-size: 11px;
        line-height: 25px;
    }

    .para {

        font-size: 12px;
    }

    .button {
        width: 50px;
        padding: 5px;
        margin-top: 58px;
        font-size: 12px;
    }

    .header-section .header-section__title {
        font-size: 30px;
    }

    .general-list li {
        margin-bottom: 5%;
    }

    .bg1 {
        height: 329px;
    }

    .bg1 h1 {

        padding-top: 20px;
    }

    .logo img {
        height: auto;
        display: block;
        margin-top: 0;
        width: 200px !important;
    }

    .limit-lines {
        box-sizing: border-box;
        margin-top: 5%;
    }

    .customer-services-area {

        display: none;
    }

    .dropdowns {

        margin-top: -57px;
    }

    .sc {

        float: left;
        margin-left: 8.1%;;
    }

    .hidden-xs {
        display: none;
    }

    .orang-bg {

        padding: 8%;
    }

    .title2 {
        margin-top: 19px;
        font-size: 28px;
        margin-bottom: 0;
    }

    .limit-lines, .limit-lines2 {

        width: 100%;
    }

    .read-more {
        position: absolute;
        bottom: 7%;
        right: 29px;
    }

    .orang-bg {
        height: 400px;
    }


    .top {
        top: 89%;
    }

    .left-7 {
        right: 0;
        left: 0;
        margin-right: 0;
        margin-left: 0;
    }

    .h-500 {
        height: 330px;
    }

    .img-bg, .img-bg2 {
        display: none;
    }

    .div-description {
        font-size: 12px;
    }

    .div-title {
        font-size: 16px;
    }

    .div-2 {
        padding: 15px;
        position: absolute;
        background: linear-gradient(0deg, #333 1%, hsla(0, 0%, 100%, 0));

    }

    .cs {

        font-size: 75px;
    }

    .img-bg3, .img-bg4 {

        margin-top: 3%;
    }

    .info {

        right: 45%;
    }

    .news-letter .row {
        flex-wrap: nowrap;
    }

    .para-contact {
        font-size: 14px;
    }

    .email-btn {
        margin-right: -10%;
    }

    .fb-section iframe {
        width: 100% !important;
    }

    .staff p {
        font-size: 15px;
    }

    .block-content h2 {

        font-size: 18px;
    }

    .stories-list a {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .contact-form {
        width: 100%;
    }

    .dark-bg a span {
        font-size: 13px;
    }

    .file {
        font-size: 14px;
    }


    .pl-8 {
        padding-left: 15px !important;
    }

    .ml--3 {
        margin-left: 0;
    }

    .pl-0 {
        padding-left: 15px !important;
    }

    .icon-back, .icon-right-arrow {
        font-size: 30px;
    }

    .dark-bg {

        margin-top: 3%;
    }

    .img-bg7 {
        margin-top: 0;
    }

    .sign-now {
        top: 30%;
    }

    .say {
        bottom: 21%;
        right: 24%;
    }

    .icon-plus-button {
        font-size: 21px;

    }

    .event {
        margin-bottom: 10%;
    }

    .plus {
        top: 0;
        align-items: center;
        justify-content: flex-end;
        position: inherit;
    }

    .plus, .plus2 {

        font-size: 15px;
    }

    .bg1 h1, .time, .pr-8 {

        padding-right: 4.7%;
    }

    .more {
        position: inherit;
    }

    .gray-bg .plus {
        display: flex;
        position: absolute;
        top: 27px;
    }

    .gray-bg .icon-plus-button {
        position: absolute;
        top: 2px;
        left: 10px;
    }

    .font-26 {
        font-size: 19px;
    }

    .h4, h4 {
        font-size: 1rem;
    }

    .mt-s-4 {
        margin-top: 1%;
    }

    .dropdown-content a {
        color: black;
        padding: 10px;
        text-decoration: none;
        display: inline-flex;
    }

    .gray-bg {
        height: 335px;
    }

    .done-by {
        text-align: left;
    }

    .f-list {
        margin-top: 3%;
        margin-bottom: 10%;
    }

    .header-section {

        height: 155px;
    }

    .header-section h1 {
        font-size: 35px;
    }

    .font-22 {
        font-size: 18px !important;
    }

    .mb-s-20 {
        margin-bottom: 20px;
    }

    .points {
        margin-right: 15px;
    }

    .points li {
        font-size: 12px;
    }

    .staff {
        display: flex;
    }

    footer, .homepage footer {

        padding: 20px;
    }

    footer ul li, footer ul li a {
        font-size: 12px;
    }

    .footer-bottom ul li {
        padding-left: 0;
    }

    .header-section .header-section__title {
        padding: 70px 50px;
    }

    .cr-s {
        position: absolute;
        top: 77px;
        padding: 5%;
        right: 0px;
    }

    .fax-sm {
        position: absolute;
        left: 35px;
        top: 42px;
    }

    .tab {
        color: #9E9E9E;
        border: 1px solid #9e9e9e99;
        border-radius: 10px;
        padding-left: 10px;
        padding-right: 10px;
        font-family: cairo-bold;
        height: 33px;
        padding-top: 4px;
        font-size: 15px;
        display: block;
        margin-bottom: 4%;
    }

    .staff {
        font-size: 15px;
    }

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

    .about-staff {
        display: block;
    }

    .rep-list li a {
        font-size: 13px;
    }

    .img-bg7 {
        height: 200px;
    }

    .dark-bg {
        height: 224px;
    }

    span {
        font-size: 12px;
    }

    .year {
        margin-top: 3%;
        margin-right: 0;
    }



    .font-20 {
        font-size: 16px !important;
    }

    .icon_select_mate {

        font-size: 13px;
    }

    .pl-pr {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    .head-links {
        display: block;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        z-index: 9999;
        background: white;
        height: 100%;
        margin-top: 0 !important;
        width: 65%;
    }

    .active {
        display: block;
    }

    .head-links > li {
        float: none;
        text-align: right;
        background: #f8f9fa;
        border-bottom: 1px solid #dee2e6;
        width: 100%;
    }

    .head-links li ul {
        width: 100%;
    }

    .head-links li li a {

        text-align: right;
        width: 100%;
    }

    .head-links > li > a {

        font-weight: 900;
        width: 100%;
    }

    .head-links > li > .parent {
        background-position: 95% 50%;
    }

    .head-links li li .parent {
        font-family: 'cairo';
    }

    .head-links ul {
        display: block;
        width: 100%;
    }

    .head-links > li.hover > ul, .head-links li li.hover ul {
        position: static;
        background: #ffffff;
        padding-top: 7px;
        padding-bottom: 7px;
    }

    .head-links > li.hover > ul {
        position: static;
        background: #dee2e647;
        padding-top: 7px;
        padding-bottom: 7px;
    }

    .head-links li li.hover ul {
        position: static;
        background: #ced4da66;
    }

    .head-links a {
        padding: 14px;
    }

    .head-links > li > a:hover, .head-links > li > a:focus {
        color: black !important;
    }

    .head-links li ul {

        border-bottom: none;

    }

    .icons {
        background: #eceff1;
        height: 25px;
        width: 25px;
        border-radius: 5px;
        position: fixed;
        left: 8px;
        z-index: 1;
        top: 170px;
    }

    .sm-menu {
        display: none;
        margin-left: 45%;
        position: fixed;
        right: 0;
        left: 0;
        background: #333333ba;
        width: 100%;
        height: 100%;
        z-index: 9999;
        top: 0;
    }

    .mt-sm {
        margin-top: -60px;
    }

    .sm-menu li {
        display: flex;
        justify-content: center;
        padding: 9px !important;
    }

    .sm-menu li a {
        color: #f8f9fa;
        font-size: 18px;
        width: 46px;
        height: 46px;
        display: flex;
        align-items: center;
        justify-content: center;
        text-decoration: none;
        transition: all 0.2s linear;
        outline: none;
        background: #ffcb05;
        border: 1px solid transparent;
    }

    .font-19 {
        font-size: 19px;
    }

    .s-block {
        display: flex;
        flex-direction: column;
    }

    .s-block-item {
        padding-left: 0;
    }

    .s-block-item + .s-block-item {
        padding-left: 0;
    }

    .pie-wrapper .pie {
        margin: -5px;
    }

    .pie-wrapper .pie .half-circle {
        border: 5px solid #ffcb05;
        clip: rect(0, 50px, 100px, 0);
        height: 100px;
        width: 100px;
    }

    .pie-wrapper {
        width: 100px;
        height: 100px;
        border: 5px solid #ddd;
    }

    .pie-wrapper .label {
        top: -5%;
        left: -42%;
        font-size: 2em;
    }

    .dark-bg, .img-bg7 {
        margin-right: 0;
    }

    .read-more {
        padding: 5px 10px;
        font-size: 11px;
        bottom: 8%;
        left: 0;
        right: 67%;
        margin-left: 16px;
    }

    .homepage .container, .homepage .col, .homepage .col-1, .homepage .col-10, .homepage .col-11, .homepage .col-12, .homepage .col-2, .homepage .col-3, .homepage .col-4, .homepage .col-5, .homepage .col-6, .homepage .col-7, .homepage .col-8, .homepage .col-9, .homepage .col-auto, .homepage .col-lg, .homepage .col-lg-1, .homepage .col-lg-10, .homepage .col-lg-11, .homepage .col-lg-12, .homepage .col-lg-2, .homepage .col-lg-3, .homepage .col-lg-4, .homepage .col-lg-5, .homepage .col-lg-6, .homepage .col-lg-7, .homepage .col-lg-8, .homepage .col-lg-9, .homepage .col-lg-auto, .homepage .col-md, .homepage .col-md-1, .homepage .col-md-10, .homepage .col-md-11, .homepage .col-md-12, .homepage .col-md-2, .homepage .col-md-3, .homepage .col-md-4, .homepage .col-md-5, .homepage .col-md-6, .homepage .col-md-7, .homepage .col-md-8, .homepage .col-md-9, .homepage .col-md-auto, .homepage .col-sm, .homepage .col-sm-1, .homepage .col-sm-10, .homepage .col-sm-11, .homepage .col-sm-12, .homepage .col-sm-2, .homepage .col-sm-3, .homepage .col-sm-4, .homepage .col-sm-5, .homepage .col-sm-6, .homepage .col-sm-7, .homepage .col-sm-8, .homepage .col-sm-9, .homepage .col-sm-auto, .homepage .col-xl, .homepage .col-xl-1, .homepage .col-xl-10, .homepage .col-xl-11, .homepage .col-xl-12, .homepage .col-xl-2, .homepage .col-xl-3, .homepage .col-xl-4, .homepage .col-xl-5, .homepage .col-xl-6, .homepage .col-xl-7, .homepage .col-xl-8, .homepage .col-xl-9, .homepage .col-xl-auto {
        padding-left: 7.5px !important;
        padding-right: 7.5px;
    }

    .single-page__content {
        overflow-x: auto;
    }

    .head-links {
        display: none;
    }

    .head-links > li.hover > ul .y-bg {
        display: none;
    }

    .y-bg {
        background: #ffcb05;
        padding: 4px;
    }

    .close-btn {
        background: #f8f9fa;
        border: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        width: 25px;
        height: 25px;

    }

    .w-15 {
        width: 80%;
    }

    .w-80 {
        width: 100%;
    }

    .w-5 {
        width: 50%;
    }

    .staff .staff-details {
        display: flex;
        flex-direction: column;
        width: 80%;
    }

    .img-staff {
        width: 30%;
    }

    .s-1 {
        margin-top: 100px;
    }
    .ca {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        margin-top: 20px;
    }
}

/*
  ##Device = Most of the Smartphones Mobiles (Portrait)
  ##Screen = B/w 320px to 479px
*/


