@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.css);
@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@200..1000&display=swap');

body {
    font-family: "Cairo", sans-serif !important;
    margin: 0;
    overflow-x: hidden;
    animation-duration: 0.3s;
    animation-fill-mode: both;
    animation-timing-function: ease-in;
    animation-name: fadeIn;
}

@keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

#preloader {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #fff;
    z-index: 99;
    height: 100%;
}

#status {
    width: 200px;
    height: 200px;
    /* background-color: ; */
    position: absolute;
    left: 44%;
    top: 44%;
    /* background-image: url(images/loader.png); */
    background-repeat: no-repeat;
    background-position: center;
    /* margin: -100px 0 0 -100px; */
}

#image-loader {
    width: 90px;
    height: 70px;
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: center;
}

::selection {
    /* background: #fff; */
    /* Safari */
}

::-moz-selection {
    background: #fff;
    /* Firefox */
}

.selection {
    color: #fff;
}

::-webkit-scrollbar {
    width: 4px;
    background: rgb(243, 235, 229);
}

::-webkit-scrollbar-button {
    background: rgb(187, 171, 155);
    height: 8px;
}

::-webkit-scrollbar-thumb {
    background: rgb(187, 171, 155);
}


a:hover, button:hover {
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

#headerholdert {
    width: 100%;
    /* <-- Changed path */
    background-size: cover;
    position: relative;
    top: 0px;
    background-repeat: no-repeat;
    height: 100vh;
}

#headerholder {
    max-width: 1240px;
    margin: 0 auto;
}

.fixedheader {
    z-index: 999;
    width: 92%;
    padding: 0 4%;
    left: 0;
    height: 120px;
    background: transparent;
}

#innerpages-header {
    width: 100%;
    position: relative;
    top: 0px;
    box-shadow: 0px 0px 8px #a7a199;
    background: -moz-linear-gradient(top, rgba(184, 216, 234) 3%, rgba(204, 236, 255, 1) 37%, rgba(226, 244, 255, 0.95) 49%, rgba(240, 249, 255, 0.93) 65%, rgba(252, 253, 255, 1) 91%);
    background: -webkit-linear-gradient(top, rgba(184, 216, 234) 3%, rgba(204, 236, 255, 1) 37%, rgba(226, 244, 255, 0.95) 49%, rgba(240, 249, 255, 0.93) 65%, rgba(252, 253, 255, 1) 91%);
    background: linear-gradient(to bottom, rgb(184, 216, 234) 3%, rgba(204, 236, 255, 1) 37%, rgba(226, 244, 255, 0.95) 49%, rgba(240, 249, 255, 0.93) 65%, rgb(255, 255, 255) 91%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ccecff', endColorstr='#87fcfdff', GradientType=0);
}


#innerpages-header .logo {
    margin-top: 12px;
}

.sticky {
    position: fixed;
    top: 0;
    background: -moz-linear-gradient(top, rgba(184, 216, 234) 3%, rgba(204, 236, 255, 1) 37%, rgba(226, 244, 255, 0.95) 49%, rgba(240, 249, 255, 0.93) 65%, rgba(252, 253, 255, 1) 91%);
    background: -webkit-linear-gradient(top, rgba(184, 216, 234) 3%, rgba(204, 236, 255, 1) 37%, rgba(226, 244, 255, 0.95) 49%, rgba(240, 249, 255, 0.93) 65%, rgba(252, 253, 255, 1) 91%);
    background: linear-gradient(to bottom, rgb(184, 216, 234) 3%, rgba(204, 236, 255, 1) 37%, rgba(226, 244, 255, 0.95) 49%, rgba(240, 249, 255, 0.93) 65%, rgb(255, 255, 255) 91%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ccecff', endColorstr='#87fcfdff', GradientType=0);
    box-shadow: 0px 0px 12px #0000002b;
    box-sizing: content-box !important;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-name: fadeInDown;
    animation-name: fadeInDown;
}

@-webkit-keyframes fadeInDown {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-20px);
        transform: translateY(-20px);
    }

    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

@keyframes fadeInDown {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-20px);
        -ms-transform: translateY(-20px);
        transform: translateY(-20px);
    }

    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
    }
}


.sticky .logo {
    right: 6%;
    margin-top: 23px !important;
}

.sticky .btns {
    margin: auto;
    align-items: center;
    justify-content: center;
    display: flex;
    top: 41px;
}

.image {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 45%;
    max-width: 650px;
    z-index: 3;
    margin-right: 2%;
}

#rotator {
    width: 100%;
    max-width: 600px;
    position: absolute;
    bottom: 9vh;
    right: 3%;
    z-index: 2;
}

.image img {
    width: 100%;
    height: auto;
    max-width: 650px;
}


.logo {
    margin-top: 20px;
    animation-duration: 0.3s;
    animation-fill-mode: both;
    animation-timing-function: ease-in;
    animation-name: fadeIn;
    position: relative;
    z-index: 3;
    /* z-index: 999999999999999999; */
    float: right;
}

.logo img {
    width: 100%;
    height: 100px !important;
    height: auto;
    max-width: 151px;
}


/*****************/

/*****CLOUDS****/
.sky {
    overflow: hidden !important;
    position: absolute;
    top: -100px;
    right: 0;
    height: 450px;
    width: 100%;
    z-index: 0;
    opacity: 0.8;
    mix-blend-mode: color-dodge;
}

.sticky .sky, #innerpages-header .sky {
    overflow: hidden !important;
    position: absolute;
    top: -70px;
    right: 0;
    height: 250px;
    width: 100%;
    z-index: 0;
    opacity: 0.8;
    mix-blend-mode: color-dodge;
}

.clouds_one {
    z-index: -1;
    background: url(images/cloud_one.png);
    position: absolute;
    right: 0;
    top: -60px;
    height: 100%;
    width: 300%;
    -webkit-animation: cloud_one 50s linear infinite;
    -moz-animation: cloud_one 50s linear infinite;
    -o-animation: cloud_one 50s linear infinite;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
}

.clouds_two {
    z-index: -1;
    background: url(images/cloud_two.png);
    position: absolute;
    right: 0;
    top: -60px;
    height: 100%;
    width: 300%;
    -webkit-animation: cloud_two 75s linear infinite;
    -moz-animation: cloud_two 75s linear infinite;
    -o-animation: cloud_two 75s linear infinite;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
}

.clouds_three {
    z-index: -1;
    background: url(images/cloud_three.png);
    position: absolute;
    right: 0;
    top: -60px;
    height: 100%;
    width: 300%;
    -webkit-animation: cloud_three 100s linear infinite;
    -moz-animation: cloud_three 100s linear infinite;
    -o-animation: cloud_three 100s linear infinite;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
}

.clouds_four {
    background: url(images/cloud_four.png);
    position: absolute;
    right: 0;
    top: -50px;
    height: 100%;
    width: 300%;
    -webkit-animation: cloud_three 100s linear infinite;
    -moz-animation: cloud_three 100s linear infinite;
    -o-animation: cloud_three 100s linear infinite;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
}



@-webkit-keyframes cloud_one {
    0% {
        right: 0
    }

    100% {
        right: -200%
    }
}

@-webkit-keyframes cloud_two {
    0% {
        right: 0
    }

    100% {
        right: -200%
    }
}

@-webkit-keyframes cloud_three {
    0% {
        right: 0
    }

    100% {
        right: -200%
    }
}



@-moz-keyframes cloud_one {
    0% {
        right: 0
    }

    100% {
        right: -200%
    }
}

@-moz-keyframes cloud_two {
    0% {
        right: 0
    }

    100% {
        right: -200%
    }
}

@-moz-keyframes cloud_three {
    0% {
        right: 0
    }

    100% {
        right: -200%
    }
}

/*****CLOUDS****/
/*******MENU******/

.dl-menuwrapper {
    width: 42%;
    max-width: 300px;
    float: left;
    position: fixed;
    z-index: 5;
    -webkit-perspective: 1000px;
    -moz-perspective: 1000px;
    perspective: 1000px;
    -webkit-perspective-origin: 50% 200%;
    -moz-perspective-origin: 50% 200%;
    perspective-origin: 50% 200%;
    left: 0;
}

.dl-menuwrapper:first-child {
    margin-right: 100px;
}

.dl-menuwrapper button {
    background: #b68a35;
    color: #fff;
    border-radius: 4px;
    font-family: "cairo";
    border: none;
    /* width: 48px; */
    height: 33px;
    position: absolute;
    cursor: pointer;
    outline: none;
    margin: 42px 0 0 150px;
    font-size: 15px;
    line-height: 34px;
    padding: 0 10px 0 37px;
}

.dl-menuwrapper button:hover, .dl-menuwrapper button.dl-active {
    background: #b68a35;
}

.dl-menuwrapper ul {
    background: #b68a35;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0aa263', endColorstr='#0f482f', GradientType=0);
}

.dl-menuwrapper button:after {
    content: '';
    position: absolute;
    width: 19px;
    height: 2px;
    background: #fff;
    top: 9px;
    left: 10px;
    box-shadow: 0 6px 0 #fff, 0 12px 0 #fff;
}

.dl-menuwrapper ul {
    padding: 0;
    list-style: none;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    transform-style: preserve-3d;
    min-height: 94vh;
}

.dl-menuwrapper li {
    position: relative;
    border-bottom: 1px solid #0000000f;
}

.dl-menuwrapper li a {
    display: block;
    position: relative;
    padding: 15px 20px;
    font-size: 16px;
    line-height: 20px;
    font-weight: 300;
    color: #fff;
    outline: none;
    text-align: right;
    text-decoration: none;
}

.no-touch .dl-menuwrapper li a:hover {
    background: rgba(255, 248, 213, 0.1);
}

.dl-menuwrapper li.dl-back>a {
    padding-left: 30px;
    background: rgba(0, 0, 0, 0.1);
}

.dl-menuwrapper li.dl-back:after, .dl-menuwrapper li>a:not(:only-child):after {
    position: absolute;
    top: 0;
    line-height: 50px;
    speak: none;
    -webkit-font-smoothing: antialiased;
    /* content: "\e000"; */
    content: "►";
}

.dl-menuwrapper li.dl-back:after {
    left: 10px;
    color: rgba(212, 204, 198, 0.3);
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    transform: rotate(180deg);
}

.dl-menuwrapper li>a:after {
    left: 10px;
    color: rgba(0, 0, 0, 0.15);
}

.dl-menuwrapper .dl-menu {
    margin: 0;
    position: absolute;
    width: 100%;
    opacity: 0;
    pointer-events: none;
    -webkit-transform: translateY(10px);
    -moz-transform: translateY(10px);
    transform: translateY(10px);
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    backface-visibility: hidden;
    min-height: 94vh;
    height: 100vh;
    max-height: 100vh;
    overflow: auto;
}

.dl-menuwrapper .dl-menu.dl-menu-toggle {
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.dl-menuwrapper .dl-menu.dl-menuopen {
    opacity: 1;
    pointer-events: auto;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    transform: translateY(0px);
}

/* Hide the inner submenus */
.dl-menuwrapper li .dl-submenu {
    display: none;
}

/* 
When a submenu is openend, we will hide all li siblings.
For that we give a class to the parent menu called "dl-subview".
We also hide the submenu link. 
The opened submenu will get the class "dl-subviewopen".
All this is done for any sub-level being entered.
*/
.dl-menu.dl-subview li,
.dl-menu.dl-subview li.dl-subviewopen>a,
.dl-menu.dl-subview li.dl-subview>a {
    display: none;
}

.dl-menu.dl-subview li.dl-subview,
.dl-menu.dl-subview li.dl-subview .dl-submenu,
.dl-menu.dl-subview li.dl-subviewopen,
.dl-menu.dl-subview li.dl-subviewopen>.dl-submenu,
.dl-menu.dl-subview li.dl-subviewopen>.dl-submenu>li {
    display: block;
}

/* Dynamically added submenu outside of the menu context */
.dl-menuwrapper>.dl-submenu {
    position: absolute;
    width: 100%;
    top: 0px;
    left: 0;
    margin: 0;
}

/* Animation classes for moving out and in */

.dl-menu.dl-animate-out-1 {
    -webkit-animation: MenuAnimOut1 0.4s;
    -moz-animation: MenuAnimOut1 0.4s;
    animation: MenuAnimOut1 0.4s;
}

.dl-menu.dl-animate-out-2 {
    -webkit-animation: MenuAnimOut2 0.3s ease-in-out;
    -moz-animation: MenuAnimOut2 0.3s ease-in-out;
    animation: MenuAnimOut2 0.3s ease-in-out;
}

.dl-menu.dl-animate-out-3 {
    -webkit-animation: MenuAnimOut3 0.4s ease;
    -moz-animation: MenuAnimOut3 0.4s ease;
    animation: MenuAnimOut3 0.4s ease;
}

.dl-menu.dl-animate-out-4 {
    -webkit-animation: MenuAnimOut4 0.4s ease;
    -moz-animation: MenuAnimOut4 0.4s ease;
    animation: MenuAnimOut4 0.4s ease;
}

.dl-menu.dl-animate-out-5 {
    -webkit-animation: MenuAnimOut5 0.4s ease;
    -moz-animation: MenuAnimOut5 0.4s ease;
    animation: MenuAnimOut5 0.4s ease;
}

@-webkit-keyframes MenuAnimOut1 {
    50% {
        -webkit-transform: translateZ(-250px) rotateY(30deg);
    }

    75% {
        -webkit-transform: translateZ(-372.5px) rotateY(15deg);
        opacity: .5;
    }

    100% {
        -webkit-transform: translateZ(-500px) rotateY(0deg);
        opacity: 0;
    }
}

@-webkit-keyframes MenuAnimOut2 {
    100% {
        -webkit-transform: translateX(-100%);
        opacity: 0;
    }
}

@-webkit-keyframes MenuAnimOut3 {
    100% {
        -webkit-transform: translateZ(300px);
        opacity: 0;
    }
}

@-webkit-keyframes MenuAnimOut4 {
    100% {
        -webkit-transform: translateZ(-300px);
        opacity: 0;
    }
}

@-webkit-keyframes MenuAnimOut5 {
    100% {
        -webkit-transform: translateY(40%);
        opacity: 0;
    }
}

@-moz-keyframes MenuAnimOut1 {
    50% {
        -moz-transform: translateZ(-250px) rotateY(30deg);
    }

    75% {
        -moz-transform: translateZ(-372.5px) rotateY(15deg);
        opacity: .5;
    }

    100% {
        -moz-transform: translateZ(-500px) rotateY(0deg);
        opacity: 0;
    }
}

@-moz-keyframes MenuAnimOut2 {
    100% {
        -moz-transform: translateX(-100%);
        opacity: 0;
    }
}

@-moz-keyframes MenuAnimOut3 {
    100% {
        -moz-transform: translateZ(300px);
        opacity: 0;
    }
}

@-moz-keyframes MenuAnimOut4 {
    100% {
        -moz-transform: translateZ(-300px);
        opacity: 0;
    }
}

@-moz-keyframes MenuAnimOut5 {
    100% {
        -moz-transform: translateY(40%);
        opacity: 0;
    }
}

@keyframes MenuAnimOut1 {
    50% {
        transform: translateZ(-250px) rotateY(30deg);
    }

    75% {
        transform: translateZ(-372.5px) rotateY(15deg);
        opacity: .5;
    }

    100% {
        transform: translateZ(-500px) rotateY(0deg);
        opacity: 0;
    }
}

@keyframes MenuAnimOut2 {
    100% {
        transform: translateX(-100%);
        opacity: 0;
    }
}

@keyframes MenuAnimOut3 {
    100% {
        transform: translateZ(300px);
        opacity: 0;
    }
}

@keyframes MenuAnimOut4 {
    100% {
        transform: translateZ(-300px);
        opacity: 0;
    }
}

@keyframes MenuAnimOut5 {
    100% {
        transform: translateY(40%);
        opacity: 0;
    }
}

.dl-menu.dl-animate-in-1 {
    -webkit-animation: MenuAnimIn1 0.3s;
    -moz-animation: MenuAnimIn1 0.3s;
    animation: MenuAnimIn1 0.3s;
}

.dl-menu.dl-animate-in-2 {
    -webkit-animation: MenuAnimIn2 0.3s ease-in-out;
    -moz-animation: MenuAnimIn2 0.3s ease-in-out;
    animation: MenuAnimIn2 0.3s ease-in-out;
}

.dl-menu.dl-animate-in-3 {
    -webkit-animation: MenuAnimIn3 0.4s ease;
    -moz-animation: MenuAnimIn3 0.4s ease;
    animation: MenuAnimIn3 0.4s ease;
}

.dl-menu.dl-animate-in-4 {
    -webkit-animation: MenuAnimIn4 0.4s ease;
    -moz-animation: MenuAnimIn4 0.4s ease;
    animation: MenuAnimIn4 0.4s ease;
}

.dl-menu.dl-animate-in-5 {
    -webkit-animation: MenuAnimIn5 0.4s ease;
    -moz-animation: MenuAnimIn5 0.4s ease;
    animation: MenuAnimIn5 0.4s ease;
}

@-webkit-keyframes MenuAnimIn1 {
    0% {
        -webkit-transform: translateZ(-500px) rotateY(0deg);
        opacity: 0;
    }

    20% {
        -webkit-transform: translateZ(-250px) rotateY(30deg);
        opacity: 0.5;
    }

    100% {
        -webkit-transform: translateZ(0px) rotateY(0deg);
        opacity: 1;
    }
}

@-webkit-keyframes MenuAnimIn2 {
    0% {
        -webkit-transform: translateX(-100%);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateX(0px);
        opacity: 1;
    }
}

@-webkit-keyframes MenuAnimIn3 {
    0% {
        -webkit-transform: translateZ(300px);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateZ(0px);
        opacity: 1;
    }
}

@-webkit-keyframes MenuAnimIn4 {
    0% {
        -webkit-transform: translateZ(-300px);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateZ(0px);
        opacity: 1;
    }
}

@-webkit-keyframes MenuAnimIn5 {
    0% {
        -webkit-transform: translateY(40%);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateY(0);
        opacity: 1;
    }
}

@-moz-keyframes MenuAnimIn1 {
    0% {
        -moz-transform: translateZ(-500px) rotateY(0deg);
        opacity: 0;
    }

    20% {
        -moz-transform: translateZ(-250px) rotateY(30deg);
        opacity: 0.5;
    }

    100% {
        -moz-transform: translateZ(0px) rotateY(0deg);
        opacity: 1;
    }
}

@-moz-keyframes MenuAnimIn2 {
    0% {
        -moz-transform: translateX(-100%);
        opacity: 0;
    }

    100% {
        -moz-transform: translateX(0px);
        opacity: 1;
    }
}

@-moz-keyframes MenuAnimIn3 {
    0% {
        -moz-transform: translateZ(300px);
        opacity: 0;
    }

    100% {
        -moz-transform: translateZ(0px);
        opacity: 1;
    }
}

@-moz-keyframes MenuAnimIn4 {
    0% {
        -moz-transform: translateZ(-300px);
        opacity: 0;
    }

    100% {
        -moz-transform: translateZ(0px);
        opacity: 1;
    }
}

@-moz-keyframes MenuAnimIn5 {
    0% {
        -moz-transform: translateY(40%);
        opacity: 0;
    }

    100% {
        -moz-transform: translateY(0);
        opacity: 1;
    }
}

@keyframes MenuAnimIn1 {
    0% {
        transform: translateZ(-500px) rotateY(0deg);
        opacity: 0;
    }

    20% {
        transform: translateZ(-250px) rotateY(30deg);
        opacity: 0.5;
    }

    100% {
        transform: translateZ(0px) rotateY(0deg);
        opacity: 1;
    }
}

@keyframes MenuAnimIn2 {
    0% {
        transform: translateX(-100%);
        opacity: 0;
    }

    100% {
        transform: translateX(0px);
        opacity: 1;
    }
}

@keyframes MenuAnimIn3 {
    0% {
        transform: translateZ(300px);
        opacity: 0;
    }

    100% {
        transform: translateZ(0px);
        opacity: 1;
    }
}

@keyframes MenuAnimIn4 {
    0% {
        transform: translateZ(-300px);
        opacity: 0;
    }

    100% {
        transform: translateZ(0px);
        opacity: 1;
    }
}

@keyframes MenuAnimIn5 {
    0% {
        transform: translateY(40%);
        opacity: 0;
    }

    100% {
        transform: translateY(0);
        opacity: 1;
    }
}

.dl-menuwrapper>.dl-submenu.dl-animate-in-1 {
    -webkit-animation: SubMenuAnimIn1 0.4s ease;
    -moz-animation: SubMenuAnimIn1 0.4s ease;
    animation: SubMenuAnimIn1 0.4s ease;
}

.dl-menuwrapper>.dl-submenu.dl-animate-in-2 {
    -webkit-animation: SubMenuAnimIn2 0.3s ease-in-out;
    -moz-animation: SubMenuAnimIn2 0.3s ease-in-out;
    animation: SubMenuAnimIn2 0.3s ease-in-out;
}

.dl-menuwrapper>.dl-submenu.dl-animate-in-3 {
    -webkit-animation: SubMenuAnimIn3 0.4s ease;
    -moz-animation: SubMenuAnimIn3 0.4s ease;
    animation: SubMenuAnimIn3 0.4s ease;
}

.dl-menuwrapper>.dl-submenu.dl-animate-in-4 {
    -webkit-animation: SubMenuAnimIn4 0.4s ease;
    -moz-animation: SubMenuAnimIn4 0.4s ease;
    animation: SubMenuAnimIn4 0.4s ease;
}

.dl-menuwrapper>.dl-submenu.dl-animate-in-5 {
    -webkit-animation: SubMenuAnimIn5 0.4s ease;
    -moz-animation: SubMenuAnimIn5 0.4s ease;
    animation: SubMenuAnimIn5 0.4s ease;
}

@-webkit-keyframes SubMenuAnimIn1 {
    0% {
        -webkit-transform: translateX(50%);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateX(0px);
        opacity: 1;
    }
}

@-webkit-keyframes SubMenuAnimIn2 {
    0% {
        -webkit-transform: translateX(100%);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateX(0px);
        opacity: 1;
    }
}

@-webkit-keyframes SubMenuAnimIn3 {
    0% {
        -webkit-transform: translateZ(-300px);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateZ(0px);
        opacity: 1;
    }
}

@-webkit-keyframes SubMenuAnimIn4 {
    0% {
        -webkit-transform: translateZ(300px);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateZ(0px);
        opacity: 1;
    }
}

@-webkit-keyframes SubMenuAnimIn5 {
    0% {
        -webkit-transform: translateZ(-200px);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateZ(0);
        opacity: 1;
    }
}

@-moz-keyframes SubMenuAnimIn1 {
    0% {
        -moz-transform: translateX(50%);
        opacity: 0;
    }

    100% {
        -moz-transform: translateX(0px);
        opacity: 1;
    }
}

@-moz-keyframes SubMenuAnimIn2 {
    0% {
        -moz-transform: translateX(100%);
        opacity: 0;
    }

    100% {
        -moz-transform: translateX(0px);
        opacity: 1;
    }
}

@-moz-keyframes SubMenuAnimIn3 {
    0% {
        -moz-transform: translateZ(-300px);
        opacity: 0;
    }

    100% {
        -moz-transform: translateZ(0px);
        opacity: 1;
    }
}

@-moz-keyframes SubMenuAnimIn4 {
    0% {
        -moz-transform: translateZ(300px);
        opacity: 0;
    }

    100% {
        -moz-transform: translateZ(0px);
        opacity: 1;
    }
}

@-moz-keyframes SubMenuAnimIn5 {
    0% {
        -moz-transform: translateZ(-200px);
        opacity: 0;
    }

    100% {
        -moz-transform: translateZ(0);
        opacity: 1;
    }
}

@keyframes SubMenuAnimIn1 {
    0% {
        transform: translateX(50%);
        opacity: 0;
    }

    100% {
        transform: translateX(0px);
        opacity: 1;
    }
}

@keyframes SubMenuAnimIn2 {
    0% {
        transform: translateX(100%);
        opacity: 0;
    }

    100% {
        transform: translateX(0px);
        opacity: 1;
    }
}

@keyframes SubMenuAnimIn3 {
    0% {
        transform: translateZ(-300px);
        opacity: 0;
    }

    100% {
        transform: translateZ(0px);
        opacity: 1;
    }
}

@keyframes SubMenuAnimIn4 {
    0% {
        transform: translateZ(300px);
        opacity: 0;
    }

    100% {
        transform: translateZ(0px);
        opacity: 1;
    }
}

@keyframes SubMenuAnimIn5 {
    0% {
        transform: translateZ(-200px);
        opacity: 0;
    }

    100% {
        transform: translateZ(0);
        opacity: 1;
    }
}

.dl-menuwrapper>.dl-submenu.dl-animate-out-1 {
    -webkit-animation: SubMenuAnimOut1 0.4s ease;
    -moz-animation: SubMenuAnimOut1 0.4s ease;
    animation: SubMenuAnimOut1 0.4s ease;
}

.dl-menuwrapper>.dl-submenu.dl-animate-out-2 {
    -webkit-animation: SubMenuAnimOut2 0.3s ease-in-out;
    -moz-animation: SubMenuAnimOut2 0.3s ease-in-out;
    animation: SubMenuAnimOut2 0.3s ease-in-out;
}

.dl-menuwrapper>.dl-submenu.dl-animate-out-3 {
    -webkit-animation: SubMenuAnimOut3 0.4s ease;
    -moz-animation: SubMenuAnimOut3 0.4s ease;
    animation: SubMenuAnimOut3 0.4s ease;
}

.dl-menuwrapper>.dl-submenu.dl-animate-out-4 {
    -webkit-animation: SubMenuAnimOut4 0.4s ease;
    -moz-animation: SubMenuAnimOut4 0.4s ease;
    animation: SubMenuAnimOut4 0.4s ease;
}

.dl-menuwrapper>.dl-submenu.dl-animate-out-5 {
    -webkit-animation: SubMenuAnimOut5 0.4s ease;
    -moz-animation: SubMenuAnimOut5 0.4s ease;
    animation: SubMenuAnimOut5 0.4s ease;
}

@-webkit-keyframes SubMenuAnimOut1 {
    0% {
        -webkit-transform: translateX(0%);
        opacity: 1;
    }

    100% {
        -webkit-transform: translateX(50%);
        opacity: 0;
    }
}

@-webkit-keyframes SubMenuAnimOut2 {
    0% {
        -webkit-transform: translateX(0%);
        opacity: 1;
    }

    100% {
        -webkit-transform: translateX(100%);
        opacity: 0;
    }
}

@-webkit-keyframes SubMenuAnimOut3 {
    0% {
        -webkit-transform: translateZ(0px);
        opacity: 1;
    }

    100% {
        -webkit-transform: translateZ(-300px);
        opacity: 0;
    }
}

@-webkit-keyframes SubMenuAnimOut4 {
    0% {
        -webkit-transform: translateZ(0px);
        opacity: 1;
    }

    100% {
        -webkit-transform: translateZ(300px);
        opacity: 0;
    }
}

@-webkit-keyframes SubMenuAnimOut5 {
    0% {
        -webkit-transform: translateZ(0);
        opacity: 1;
    }

    100% {
        -webkit-transform: translateZ(-200px);
        opacity: 0;
    }
}

@-moz-keyframes SubMenuAnimOut1 {
    0% {
        -moz-transform: translateX(0%);
        opacity: 1;
    }

    100% {
        -moz-transform: translateX(50%);
        opacity: 0;
    }
}

@-moz-keyframes SubMenuAnimOut2 {
    0% {
        -moz-transform: translateX(0%);
        opacity: 1;
    }

    100% {
        -moz-transform: translateX(100%);
        opacity: 0;
    }
}

@-moz-keyframes SubMenuAnimOut3 {
    0% {
        -moz-transform: translateZ(0px);
        opacity: 1;
    }

    100% {
        -moz-transform: translateZ(-300px);
        opacity: 0;
    }
}

@-moz-keyframes SubMenuAnimOut4 {
    0% {
        -moz-transform: translateZ(0px);
        opacity: 1;
    }

    100% {
        -moz-transform: translateZ(300px);
        opacity: 0;
    }
}

@-moz-keyframes SubMenuAnimOut5 {
    0% {
        -moz-transform: translateZ(0);
        opacity: 1;
    }

    100% {
        -moz-transform: translateZ(-200px);
        opacity: 0;
    }
}

@keyframes SubMenuAnimOut1 {
    0% {
        transform: translateX(0%);
        opacity: 1;
    }

    100% {
        transform: translateX(50%);
        opacity: 0;
    }
}

@keyframes SubMenuAnimOut2 {
    0% {
        transform: translateX(0%);
        opacity: 1;
    }

    100% {
        transform: translateX(100%);
        opacity: 0;
    }
}

@keyframes SubMenuAnimOut3 {
    0% {
        transform: translateZ(0px);
        opacity: 1;
    }

    100% {
        transform: translateZ(-300px);
        opacity: 0;
    }
}

@keyframes SubMenuAnimOut4 {
    0% {
        transform: translateZ(0px);
        opacity: 1;
    }

    100% {
        transform: translateZ(300px);
        opacity: 0;
    }
}

@keyframes SubMenuAnimOut5 {
    0% {
        transform: translateZ(0);
        opacity: 1;
    }

    100% {
        transform: translateZ(-200px);
        opacity: 0;
    }
}

/* No JS Fallback */
.no-js .dl-menuwrapper .dl-menu {
    position: relative;
    opacity: 1;
    -webkit-transform: none;
    -moz-transform: none;
    transform: none;
}

.no-js .dl-menuwrapper li .dl-submenu {
    display: block;
}

.no-js .dl-menuwrapper li.dl-back {
    display: none;
}

.no-js .dl-menuwrapper li>a:not(:only-child) {
    background: rgba(0, 0, 0, 0.1);
}

.no-js .dl-menuwrapper li>a:not(:only-child):after {
    content: '';
}

/* Colors for demos */

/* Demo 1 */
.demo-1 .dl-menuwrapper button {
    background: #c62860;
}

.demo-1 .dl-menuwrapper button:hover,
.demo-1 .dl-menuwrapper button.dl-active,
.demo-1 .dl-menuwrapper ul {
    background: #9e1847;
}

/* Demo 2 */
.demo-2 .dl-menuwrapper button {
    background: #e86814;
}

.demo-2 .dl-menuwrapper button:hover,
.demo-2 .dl-menuwrapper button.dl-active,
.demo-2 .dl-menuwrapper ul {
    background: #D35400;
}

/* Demo 3 */
.demo-3 .dl-menuwrapper button {
    background: #08cbc4;
}

.demo-3 .dl-menuwrapper button:hover,
.demo-3 .dl-menuwrapper button.dl-active,
.demo-3 .dl-menuwrapper ul {
    background: #00b4ae;
}

/* Demo 4 */
.demo-4 .dl-menuwrapper button {
    background: #90b912;
}

.demo-4 .dl-menuwrapper button:hover,
.demo-4 .dl-menuwrapper button.dl-active,
.demo-4 .dl-menuwrapper ul {
    background: #79a002;
}

/* Demo 5 */
.demo-5 .dl-menuwrapper button {
    background: #744783;
}

.demo-5 .dl-menuwrapper button:hover,
.demo-5 .dl-menuwrapper button.dl-active,
.demo-5 .dl-menuwrapper ul {
    background: #643771;
}

li.menutitle {
    text-align: center;
    background: #b68a35;
    padding: 1px 0;
    color: #ffffff;
    font-size: 18px;
}

/***********************/

.btns {
    display: inline-block;
    position: relative;
    z-index: 3;
    margin: 42px 0 0 90px;
}

.btns div {
    display: inline-block;
    margin: 0 5px;
    background-size: 17px;
    direction: rtl;
}

.btns a {
    text-decoration: none;
    color: #ffffff;
    font-size: 14px;
    padding: 3px 8px;
    border-radius: 4px;
    border: 1px solid #6e4c3e;
    line-height: 30px;
    text-shadow: 1px 1px 0px #43302f63;
    text-align: right;
    display: inline-block;
}


.lang a {
    background-size: 17px;
}

.lang, .downapp a {
    background: #6e4c3e;
    border-radius: 4px;
}

.btns img {
    padding: 5px 0;
    height: 30px;
    vertical-align: middle;
}

.lang:hover, .downapp:hover {
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

a:hover {
    text-decoration: none !important;
}

.downapp span {
    font-size: 14px;
    display: inline-block;
    background: #674c41;
    color: white;
    top: 2px;
    position: relative;
    border-radius: 4px;
    margin: 0 0 0 7px;
}

.lang:hover, .downapp a:hover {
    background: #865d4d;
    background-size: 17px;
}

/*.lang {
    background: #5c424236 url(images/en.png) no-repeat left 5px center;
    width: 94px;
}*/

/*.downapp{background: #5c424236 url(images/app.png) no-repeat left 5px center;
    }*/


.app, .lang-II {
    margin: 30px 10px;
    margin-top: 78px;
    color: #fbf8f5;
    direction: rtl;
}

li.menutitle p {
    padding-top: 20px;
}

.app span {
    color: white !important;
}

.app a, .lang-II a {
    text-decoration: none;
    color: #ffffff;
    font-size: 15px;
    padding: 3px 10px 3px 30px;
    border: 1px solid #fff;
    font-weight: bold;
}

.app a {
    background-size: 22px;
    margin: 0 5px;
}

.app span {
    line-height: 50px;
}

.lang-II a {
    background: #00000000 url(images/en.png) no-repeat left 5px center;
    background-size: 24%;
    margin: 5px;
    color: #ffffff;
}

.app a:hover {
    color: #b68a35;
    background: #fff url(images/app-g.png) no-repeat left center;
    background-size: 22px;
}

.lang-II a:hover {
    color: #ffffff;
    background: #ffffff12 url(images/en.png) no-repeat left 5px center;
    background-size: 24%;
}

/***************************
LATEST STYLE**************/

#latest {
    width: 100%;
    /* max-width: 1240px; */
    margin: 0 auto;
    text-align: center;
    padding: 100px 0 150px 0;
    /*background: #efece9ad;*/
}

.slider-cont {
    width: 96%;
    max-width: 1100px;
    margin: 0 auto;
}

.line {
    outline-width: 1px;
    outline-color: #b68a35;
    outline-style: double;
    outline-offset: 10px;
    padding-bottom: 0px;
    right: 0;
    top: 8%;
    width: 96%;
    padding: 30px 0px;
    height: 52%;
    position: absolute;
    max-height: 500px;
    background: #f9f6f1;
}

#latest h3 {
    margin: 50px auto;
    line-height: 1;
    padding: 0px 28px;
    width: 140px;
    color: #664543;
    font-size: 24px;
    background-size: 20px;
}

#latest h3:hover, .title h3:hover {
    color: #b68a35;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}


.main-btn {
    text-decoration: none;
    font-size: 16px;
    border-radius: 4px;
    padding: 6px 15px;
    color: #ffffff;
    background: #a88c70;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    white-space: nowrap;
}

.main-btn:hover {
    background: #8f7c69;
    text-shadow: 0px 0px 2px #4e1818;
    color: #fff;
    text-decoration: none;
}

.c-morebtn {
    text-align: center;
    clear: both;
}

/************************/

/***************
Services Section
***************/

.services {
    width: 100%;
    /* max-width: 1170px; */
    /* margin: 150px auto !important; */
    text-align: center;
    direction: rtl;
    background: #ffffff78 url(images/hg.jpg) no-repeat top center;
    margin: 0 auto;
    background-blend-mode: color-dodge;
    /* background-size: cover; */
    box-shadow: inset 0px -190px 180px 31px #ffffff;
}


.service-cont {
    padding: 40px 0;
}

/*.proj{
	width:32.33%;
	margin-left:1%;
}*/

.servicetitle {
    font-size: 18px !important;
    margin: 0;
    color: #88745f;
}

.title {
    font-size: 22px;
    color: #664543;
}

.title h3 {
    margin: 0;
    padding: 50px 0;
}

p.servicedesc {
    font-size: 14px;
    color: #675a59;
    padding: 10px 20px;
    margin: 0;
    line-height: 1.5;
    max-height: 90px;
    overflow: hidden;
}

a.servicelink img {
    margin: 10px auto;
}

a.servicelink:hover {
    opacity: 0.7;
}

/*.proj {
    width: 33.33%;
    margin-left: 1.5%;
    float: right;
	margin: 35px 0;
}*/

.service {
    width: 33%;
    margin-left: 1.5%;
    margin: 35px 0;
    clear: both;
    display: table-cell;
    vertical-align: top;
    padding: 100px 0 0px 0;

    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.service:hover {
    background-size: 90px !important;
}



#last {
    margin-left: 0 !important;
}

/**********************/


#footer {
    margin: 110px 0 0;
    width: 100%;
    padding: 10px 0 0;
    background: #fff;
    background: #dfd8ce8a;
    direction: rtl;
}

.links {
    width: fit-content;
    margin: 0 auto;
    text-align: center;
}

.links ul {
    padding: 0;
    list-style: none;
}

.links ul li {
    display: inline-block;
    padding: 8px;
}

.links a {
    color: #664543;
    font-size: 13px;
    text-decoration: none;
}

.links a:hover {
    color: #b68a35;
}

.footer-social-icons {
    width: 135px;
    display: block;
    margin: 0 auto;
    text-align: center;
    padding-left: 20px;
}

.social-icon {
    color: #fff;
}

ul.social-icons {
    margin: 10px auto;
    padding: 0;
}

.social-icons li {
    vertical-align: middle;
    display: inline;
}

.social-icons a {
    color: #5c4242;
    text-decoration: none;
    font-size: 19px;
}

.social-icons a:hover {
    color: #fff;
}

.fa-facebook {
    padding: 6px 12px;
    ;
    -o-transition: .3s;
    -ms-transition: .3s;
    -moz-transition: .3s;
    -webkit-transition: .3s;
    transition: .3s;
}

.fa-twitter {
    padding: 6px 8px;
    -o-transition: .3s;
    -ms-transition: .3s;
    -moz-transition: .3s;
    -webkit-transition: .3s;
    transition: .3s;
}

.fa-instagram {
    padding: 6px 8px;
    -o-transition: .3s;
    -ms-transition: .3s;
    -moz-transition: .3s;
    -webkit-transition: .3s;
    transition: .3s;
}

.fa-instagram:hover, .fa-twitter:hover, .fa-facebook:hover {
    background-color: #b68a35;
}



.copyrights {
    text-align: center;
    line-height: 3;
    background: #dcd7d1de;
    font-size: 12px;
}

.copyrights span {
    color: #635c4c;
}


/************************
Vision Page ************/

#iconsblocks {
    margin: 40px auto;
    width: 96%;
    max-width: 1170px;
    background: url(https://github.com/omarosamaali/Leon-Agency/blob/main/filter.jpg?raw=true) no-repeat top center fixed;
    background-size: cover;
    outline-width: 1px;
    outline-offset: -24px;
    outline-color: #bbab9b;
    outline-style: solid;
    box-shadow: inset 0px -2px 0px #fdfbf9;
}

.goalsimg {
    margin: 30px 0px 0 -80px;
}


ul#alliconsandtext {
    width: 100%;
    list-style: none;
    padding: 0;
    margin: 0;
}

ul#alliconsandtext>.text-left, .text-right, .icon-left, .icon-right {
    display: inline-block;
    width: 50%;
    height: 300px;
    overflow: hidden;
    padding: 2%;
}

li.text-right, li.icon-right {
    float: right;
}

.text-left, .text-right {
    background: rgba(33, 15, 10, 0.8);
}

li.text-left, .text-right {
    text-align: right;
}

.icon-left, .icon-right {
    text-align: center;
}

.icon-left {
    text-align: center;
    background: rgb(255, 255, 255);
    background: -moz-linear-gradient(left, rgba(255, 255, 255, 1) 10%, rgba(239, 225, 202, 1) 60%);
    background: -webkit-linear-gradient(left, rgba(255, 255, 255, 1) 10%, rgba(239, 225, 202, 1) 60%);
    background: linear-gradient(to right, rgb(255, 255, 255) 10%, rgb(239, 225, 202) 60%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#efe1ca', GradientType=1);
}

li.icon-right {
    text-align: center;
    background: rgb(239, 225, 202);
    background: -moz-linear-gradient(left, rgba(239, 225, 202, 1) 40%, rgba(255, 255, 255, 1) 90%);
    background: -webkit-linear-gradient(left, rgba(239, 225, 202, 1) 40%, rgba(255, 255, 255, 1) 90%);
    background: linear-gradient(to right, rgba(239, 225, 202, 1) 40%, rgba(255, 255, 255, 1) 90%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#efe1ca', endColorstr='#ffffff', GradientType=1);
}

.icon-holder {
    max-width: 256px;
    height: max-content;
    margin: 0 auto;
    text-align: center;
}

.icon-right span, .icon-left span {
    display: none;
}

.icon-holder img {
    width: 100%;
    height: auto;
}

.main-titles {
    margin: 0;
    font-size: 18px;

    color: #b5dc86;
    direction: rtl;
}

.info {
    clear: both;
    font-size: 14px;
    line-height: 2;
    color: #ffffff;
    text-shadow: 0px 1px 0px #000;
    font-weight: normal;
    margin: 0;
    direction: rtl;
    list-style-type: square;
    max-height: 240px;
    overflow: auto;
}

.text-holder {
    width: 94%;
    margin: 10px auto;
}

/*********************************/
#in-cont {
    height: 100%;
    /* background: #dcd2c5; */
}

.page {
    width: 94%;
    max-width: 1170px;
    margin: 40px auto;
    direction: rtl;
    background: #5a4238;
    display: table;
}

h2.info {
    line-height: 1.2;
}

.box {
    width: 31%
}

.inn-title h2 {
    color: #6e4c3e8f;
    font-weight: bold;
    font-size: 14px;
    padding: 0;
    margin: 0 auto;
    text-align: right;
    max-width: 1140px;
    width: 98%;
    text-align: right;
    margin: auto !important;
    justify-content: flex-start;
    display: flex;
    align-items: center;
    gap: 9px;
}

.inn-title {
    margin: 0px auto;
    position: relative;
    width: 100%;
    padding: 20px 20px;
    background: rgb(247, 245, 237);
    box-shadow: inset 0px 3px 4px #e4e2d896;
    direction: rtl;
}

.inn-title span a {
    color: #6e4c3e;
    text-decoration: none;
}

.text {
    width: 45%;
    float: right;
    margin: 0;
    padding: 2%;
    height: 480px;
    overflow: hidden;
    position: relative;
    z-index: 0;
    outline-width: 1px;
    outline-offset: -8px;
    outline-color: #a07e66;
    outline-style: solid;

}



.grad {
    background: rgb(252, 240, 179);
    background: -moz-linear-gradient(-45deg, rgba(252, 240, 179, 1) 1%, rgba(115, 160, 32, 1) 100%);
    background: -webkit-linear-gradient(-45deg, rgba(252, 240, 179, 1) 1%, rgba(115, 160, 32, 1) 100%);
    background: linear-gradient(153deg, rgba(249, 234, 179, 0.77) 14%, rgba(255, 255, 255, 0.14) 48%, rgb(51, 115, 17) 120%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fcf0b3', endColorstr='#73a020', GradientType=1);
    width: 100%;
    height: 100%;
    outline-color: #fff;
    outline-offset: -10px;
    outline-style: solid;
    outline-width: 1px;
}

.bg {
    height: 400px;
    background: url(images/filter.jpg) no-repeat center center;
    background-size: cover;
}

.image-holder {
    margin: 40px 0;
    max-height: 480px;
    float: left;
    text-align: center;
    overflow: hidden;
    width: 50%;
}

/****************************
PDF Pages*******************/

.pdfviewer {
    background: rgb(90, 66, 56);
    background: -moz-linear-gradient(left, rgb(90, 66, 56) 40%, rgb(160, 126, 102) 90%);
    background: -webkit-linear-gradient(left, rgb(90, 66, 56) 40%, rgb(160, 126, 102) 90%);
    background: linear-gradient(to right, rgb(90, 66, 56) 40%, rgb(160, 126, 102) 90%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#efe1ca', endColorstr='#ffffff', GradientType=1);
    padding: 2%;
    width: 47%;
    float: left;
    max-width: 1043px;
    position: relative;
    z-index: 2;
    height: 480px;
}

.pdf {
    background-size: contain;
    background-blend-mode: color-burn;
    color: #fff;
    font-size: 14px;
    line-height: 2;
    text-align: justify;
    padding: 8px;
    margin: 0 0 20px;
    max-height: 360px;
    overflow: auto;
}

.down-btn {
    text-align: right;
    padding: 0 8px;
}

/*************************
NEWS********************/

div#sear-cont {
    width: 96%;
    max-width: 1170px;
    margin: 80px auto;
}

.container {
    width: 98%;
    padding-right: 0px;
    padding-left: 0px;
    margin-right: auto;
    margin-left: auto;
}

.col-lg-2::after, col-lg-2::before {
    box-sizing: border-box !important;
}

#sear-cont .container-fluid {
    margin-bottom: 100px;
}

button.startsearch.btn {
    height: 46px;
    border-radius: 4px;
    background: #a88c70;
    width: 90px;
    color: #fff;
}

#sear-cont select.form-control {
    line-height: 2 !important;
    color: #5d6b78 !important;
    border-radius: 3px;
    height: 46px;
}

.form-control {
    line-height: 2;
}

#sear-cont select.form-control:focus, .form-control:focus {
    outline: none !important;
    box-shadow: none !important;
    border: 1px solid #019db0;
}

.overlay {
    position: absolute;
    background: rgba(64, 47, 40, 0.79);
    width: 100%;
    height: 100%;
    text-align: center;
    padding-top: 100px;
    opacity: 0;
    -webkit-transition: opacity .3s ease-in-out;
    -moz-transition: opacity .3s ease-in-out;
    -o-transition: opacity .3s ease-in-out;
    transition: opacity .3s ease-in-out;
}

.overlay-cont {
    width: 100%;
    height: 235px;
    overflow: hidden;
    position: relative;
}

.overlay:hover {
    opacity: 1;
}

.overlay img {
    width: initial !important;
}

.overlay a {
    width: 45px !important;
    display: inline-block !important;
}

img.result {
    width: 100%;
    height: auto;
    min-width: 360px;
}

ul#box-container h2 {
    margin: 0 13px;
    font-size: 14px;
    font-weight: bold;
    color: #4f4c4d;
    padding: 10px 0;
}

#box-container {
    margin: 0 auto;
    padding: 0;
    text-align: right;
}

.box {
    vertical-align: top;
    list-style-type: none;
    width: 31%;
    display: inline-block;
    margin-bottom: 60px;
    margin-left: 1%;
    margin-right: 1%;
    height: 100%;
    overflow: hidden;
    box-shadow: 0 0 0px 0 rgba(0, 0, 0, 0.2), 0 1px 2px 0px rgba(0, 0, 0, 0.24);
    border-radius: 3px;
}

.res {
    width: 98%;
    max-width: 1170px;
    margin: 60px auto;
}

.news-title {
    direction: rtl;
    position: relative;
    font-size: 17px;

    color: #008850;
    margin: 10px 0px;
    text-align: right;
    line-height: 1.5;
    overflow: hidden;
    text-decoration: none;
}

a.news-title:hover {
    color: #a77a21;
    text-decoration: none;
}

.res-title {
    padding: 15px;
}

.res-description {
    direction: rtl;
    position: relative;
    font-size: 14px;
    color: #675a59b0;
    margin: 0 15px;
    text-align: justify;
    line-height: 1.5;
    max-height: 160px;
    overflow: auto;

}


.date {
    font-size: 13px;
    color: #675a59b0;
    line-height: 2;
}



.box:nth-child(2n+1) {}

.box:nth-child(2n+0) {}

.box a img {
    -webkit-back-visibility: hidden;
    display: block;
    width: 100%;
    height: auto;
    vertical-align: bottom
}

@media screen and (max-width: 540px) {
    .box {
        width: 100% !important;
        margin-left: 0;
        margin-right: 0
    }
}

@media (max-width: 850px) {
    .box {
        width: 47.6%;
        float: none !important;
    }
}

/****************************
Contact Us******************/

.address {
    width: 46%;
    float: right;
    padding-right: 2%;
}

.address ul {
    padding: 0;
    border-bottom: 1px solid #a07e663b;
    width: 95%;
    margin: 20px auto;
}

.address li {
    line-height: 34px;
    font-size: 15px;
    color: #ffffff;
    list-style: none;
}

.fa-mobile {
    font-size: 18px;
    vertical-align: middle;
}

.fa-envelope {
    font-size: 14px;
}

.address span {
    color: #b5dc86;
}

.address .fa {
    color: #b5dc86;
}

.map {
    background: #a07e66;
    padding: 1%;
    position: relative;
    z-index: 2;
    margin: 0 auto;
    width: 50%;
    float: left;
    text-align: center;
}

/*******
Contact us page social icons
******/


ul.social-set {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    /*justify-content: center;*/
    list-style: none;
    margin: 0;
    padding: 0;
    height: auto;
    width: auto;
    border: none;
}

ul.social-set li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

/* Font Awesome icons */
a.sociali {
    font-size: 25px;
    line-height: 40px;
    padding: 3px 0;
    width: 50px;
    height: 40px;
    text-align: center;
    vertical-align: middle;
    display: list-item;
    background: #a07e66;
    color: #fff;
    margin-right: 10px;
    margin-bottom: 10px !important;
}

ul.social-set .fa {
    color: #fff;
}

a.sociali:hover, a.sociali:focus {
    background: #b68a35;
}

#amazingcarousel-1 blockquote {
    position: relative;
    color: #401e0b;
    text-align: right;
    direction: rtl;
    margin: 8px 24px;
    font-size: 21px;
    padding-bottom: 10px;
}

#amazingcarousel-1 p {
    color: #b68a35;
    display: block;
    position: relative;
    margin: 0;
    padding: 3px 18px;
    text-align: right;
    font-size: 14px;
    direction: rtl;
    background: #6d4f4524;
}

/* arrows */

#amazingcarousel-1 .amazingcarousel-prev {
    left: 80%;
    top: 0%;
    margin-left: 4px;
    margin-top: -16px;
}

#amazingcarousel-1 .amazingcarousel-next {
    right: 0%;
    top: 0%;
    margin-right: 4px;
    margin-top: -16px;
}

@media all and (min-width: 800px) {

    .amazingslider-img-box-2 {
        display: block;
        position: absolute;
        left: 0px;
        top: 0px;
        width: 50% !important;
        height: 100% !important;
        max-width: none !important;
    }
}


@media all and (max-width: 800px) {
    .amazingslider-img-box-2 {
        display: block;
        position: absolute;
        left: 0px;
        top: 0px;
        width: 100% !important;
        height: 100% !important;
        max-width: none !important;
    }
}

.amazingslider-text-wrapper-2 {
    direction: rtl;
    font-family: 'cairo', sans-serif;
}

.service-img {
    width: 90px;
    margin-bottom: 20px;
}

.container-btns-sidebar {
    width: fit-content;
    padding: 8px !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.container-btns-sidebar:hover {
    background-color: orange !important;
    color: unset !important;
}

#submit {
    background-color: unset !important;
    color: white !important;
    font-weight: normal !important;
}

@media (min-width: 835px) {
    .lang-II.mobile-btn {
        display: none !important;
    }
}