/*
Theme Name:         Km Group Company
Theme URI:          http://Km-Group.net/
Description:        Km Group Company theme framework is a WordPress starter theme based on HTML5 and Bootstrap..
Version:            1.0
Author:             Km Group Company
Author URI:         http://Km-Group.net/

License:            GNU General Public License v2 or later
License URI:        http://www.gnu.org/licenses/gpl-2.0.html

Tags: 				two-columns, three-columns, left-sidebar, right-sidebar, fixed-layout, responsive-layout, custom-background, custom-header, custom-menu, editor-style, post-formats, rtl-language-support, sticky-post, theme-options, translation-ready, accessibility-ready
Text Domain: 		Km Group Theme
Domain Path: 		Ar

Color scheme: #414143, #f49700, #3c5170;

*/
@charset "utf-8";
@-webkit-viewport{width:device-width;}
@-moz-viewport{width:device-width;}
@-ms-viewport{width:device-width;}
@-o-viewport{width:device-width;}
@viewport{width:device-width;}

/* Reset site */
*{outline:none;}
html, body{margin:0px;/*overflow-x:hidden !important;*/transition:all 0.3s ease-in 0s;outline:none !important;outline-color:transparent !important;background-color:#fff;}
h1, h2, h3, h4, h5{
margin:0;padding:0;font-family: 'Cairo', sans-serif;color:#19171a;

}
p{line-height: 1.5;font-size:14px;font-family: 'Cairo', tahoma, sans-serif;font-weight: 400;color: #676767;margin:0;padding:0;}

i{}
img, img a, img a:hover, img a:visited, img a:link{border:0px;}
a{font-family: 'Cairo', tahoma, sans-serif;color:inherit;transition:all 0.3s ease-in 0s;outline:none;outline-color:transparent;font-weight: 600;}
a:hover{border:0px;text-decoration:none;outline:none !important;outline-color:transparent !important;}
a, a:hover, a:link, a:active{text-decoration:none !important;border:0;outline:none !important;}
a:hover, a:focus{color: #f49700;}
ul, li{list-style-position: inside;font-family: 'Cairo', tahoma, sans-serif;}
ol, ul {list-style: none;margin: 0;padding: 0;}

/*Numbers*/
.num{
    font-family: 'Cairo', sans-serif !important;
    font-weight: 300 !important;
    letter-spacing: 0.5px;
    direction: ltr !important;
    float: left;
}
/* setup performance */
.right{float:right;}
.left{float:left;}
.center{margin:0% auto;}
.block{display:block;}
.absolute{position:absolute;}
.relative{position:relative;}
.noMove{margin:0 !important;padding:0 !important;}
.curved{-moz-border-radius:20px;-webkit-border-radius:20px;border-radius:20px;}


/* scrollbar */

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

/* forms setup */
input[type="text"], input[type="url"], input[type="email"], input[type="phone"], input[type="tel"], textarea {
    -moz-border-radius: 0px !important;
    -webkit-border-radius: 0px !important;
    border-radius: 0px !important;
    color:inherit;
    font-weight: 600;
}
input, textarea, select{
width:100%;
background-color:transparent;
border:none;
color:#000;
transition:all 0.3s;
width: 100%;
background-color: transparent;
border: none;
color: #777;
border-bottom: 1px solid #f5f5f5;
padding: 10px;
margin: 0px 0 15px;
transition: all 0.3s;
font-family: 'Cairo', tahoma, sans-serif;
}

textarea{max-height: 70px;max-width:100%;width: 100%;font-size:14px;}
input:focus, textarea:focus{border-bottom:1px solid #f49700 !important;}
input:hover, textarea:hover{border-bottom:1px solid #f49700 !important;}
input::-webkit-input-placeholder{font-size:13px !important;color: #a1a1a1 !important;}
input::-moz-placeholder{font-size:13px !important;color:#a1a1a1 !important;}
input:-ms-input-placeholder{font-size:13px !important;color:#a1a1a1 !important;}
input:-moz-placeholder{font-size:13px !important;color:#a1a1a1 !important;}
textarea::-webkit-input-placeholder{font-size:13px !important;color:#a1a1a1 !important;}
textarea::-moz-placeholder{font-size:13px !important;color:#a1a1a1 !important;}
textarea:-ms-input-placeholder{font-size:13px !important;color:#a1a1a1 !important;}
textarea:-moz-placeholder{font-size:13px !important;color:#a1a1a1 !important;}
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0;display:none;opactiy:0;}
input[type=number]{-moz-appearance:textfield;}
input[type=submit], a.global-button{
    display: block;
    width: auto;
    padding: 9px 20px !important;
    margin-top: 5px;
    font-family: 'Cairo', tahoma, sans-serif !important;
    font-size: 15px !important;
    -moz-border-radius:0px  !important;-webkit-border-radius:0px  !important;border-radius:0px !important;
    color: #fff !important;
    border: 1px solid #f49700 !important;
    text-align: center !important;
    line-height: 1 !important;
    background: #f49700 !important;
}
input[type=submit]:hover{background-color:#fff !important;border: 1px solid #f49700 !important;color: #f49700 !important;}
input[type=submit]:focus{background-color:#fff !important;border: 1px solid #f49700 !important;color: #f49700 !important;}

/* structure */
.wrapper{width:100%;position:relative;margin:0 auto;background-color:#fff;overflow-x: hidden;}
.vc_row{
    margin: 0 auto  !important;
}
/* header */
.top-bar{
    min-height: 45px;
    padding: 12px 0;
    background-color: #eee;
    color: #4e4e4e;
    width: 100%;
    font-size: 13px;
    margin: 0px;
    -webkit-transition:all .5s;
    -moz-transition:   all .5s;
    -ms-transition:    all .5s;
    -o-transition:     all .5s;
    transition:        all .5s;
}
.top-bar i{
    margin-right: 7px;
    float: left;
    margin-top: 3px;
}
.top-bar i.fa-phone{transform: rotate(110deg);}
.top-bar p{
    font-size: 13px;
    font-family: 'Cairo', tahoma, sans-serif;
    text-align: left;
}
.socials{float: right;}
.socials a i{
    margin-right: 20px;
    float: left;
}

.sb-data {
    margin: 0;
    padding: 0px;
    display: block;
    width: -moz-fit-content;
    width: fit-content;
    text-align: left;
    float: left;
    margin-right: 20px;
}
.sb-data i{color: #f49700;}

.sb-data p, .sb-data span{
    font-size: 13px;
}


/** End header **/

.section{
    width: 100%;
    padding: 0px 0 110px;
    margin: 0 auto;
}

/**HomePage intro**/
.sb-intro{
    width: 100%;
    position: relative;
    z-index: 2;
    background-color: transparent;
    padding: 110px 0;
}
.intro-box{padding-top: 90px;}
.intro-box h5{
    font-size: 18px;
    font-weight: 600;
    color: #f49700;
    margin-bottom: 15px !important;
}
.intro-box h2{
    font-size: 35px;
    font-weight: 700;
    color: #101010;
    margin-bottom: 22px !important;
}
.intro-box p{
    font-size: 18px;
    color: #818181;
    font-weight: 600;
}

.sb-intro-block{
    /*border: 1px solid #f5f5f5;*/
    background-color: #fff;
    min-height: 330px !important;
    display: inline-block;
    padding: 40px 0;
    transition: all 0.3s ease-in 0s;
    text-align: center;
    -moz-box-shadow: rgba(1,2,2,0.08) 0px 1px 1.96px 0.04px;
    -webkit-box-shadow: rgba(1,2,2,0.08) 0px 1px 1.96px 0.04px;
    box-shadow: rgba(1,2,2,0.08) 0px 1px 1.96px 0.04px;
    transition: all 0.2s ease-in-out 0s;
    transform: translateY(0)!important;
}

.sb-intro-block:hover{
    cursor: pointer;
    -moz-box-shadow: 0 10px 25px 5px rgba(0,0,0,0.2);
    -webkit-box-shadow: 0 10px 25px 5px rgba(0,0,0,0.2);
    box-shadow: 0 10px 25px 5px rgba(0,0,0,0.2);
    transform: translateY(-8px)!important;
    z-index: 2;
}

.sb-intro-block h3{
    font-size: 22px;
    margin-top: 40px;
    font-weight: 600;
    text-align: center;
    color: #101010;
}

.sb-intro-block p{
    font-size: 15px;
    margin-top: 30px;
    text-align: center;
    color: #97907d;
    padding: 0 15%;
}

.sb-intro a{
    display: block;
    margin: 0 auto;
    width: 70%;
    margin-top: 30px;
    padding: 10px 0;
    color: #ff9c00;
    font-size: 14px;
    font-weight:  600;
    border: 2px solid #ff9c00;
    text-transform: uppercase;
    text-align: center;
    line-height: 20px;
    transition: all 0.2s ease-in-out 0s;
    background-color: #fff;
}.sb-intro a:hover{background-color: #ff9c00;color: #fff;}

/*
.unique-block{
    top: -25px;
    -moz-box-shadow: 0 10px 25px 5px rgba(0,0,0,0.2);
    -webkit-box-shadow: 0 10px 25px 5px rgba(0,0,0,0.2);
    box-shadow: 0 10px 25px 5px rgba(0,0,0,0.2);
    transform: translateY(-8px)!important;
    z-index: 2;
}
*/




/**HomePage About**/
.sec-about{
    padding-top: 110px;
}
.sec-about h3{
    font-size: 35px;
    margin: 0px;
    margin-bottom: 35px;
    padding: 0px;
    text-align: center;
    color: #fff;
    font-weight: 700;
}
span.highlight{color: #ff9c00 !important;}

.sec-about p{
    font-size: 18px;
    margin-top: 20px;
    color: #b5b5b5;
    padding: 0;
    text-align: center;
    padding: 0 24.7% !important;
    margin-bottom: 35px;

}
.sec-about a{
    display: block;
    width: fit-content;
    -moz-width: fit-content;
    margin: 0 auto;
    margin-top: 30px;
    padding: 10px 35px;
    color: #f5f5f5;
    font-size: 14px;
    font-weight:  400;
    border: 2px solid #f5f5f5;
    text-transform: uppercase;
    text-align: center;
    line-height: 20px;
    transition: all 0.2s ease-in-out 0s;
    background-color: transparent;
    letter-spacing: 1px;
}.sec-about a:hover{background-color: #f5f5f5;color: #4e4e4e;}

/*
.slider-title{
    font-size: 33px  !important;
    font-family: 'Cairo', sans-serif !important;
    font-weight: 600  !important;
    color: #fff  !important;
    text-align: center  !important;
    line-height: inherit  !important;
    margin-bottom: 50px  !important;
}

.slider-text{
    font-size: 18px  !important;
    font-family: 'Cairo', sans-serif !important;
    color: #f0f0f0  !important;
    text-align: center  !important;
    line-height: 22px;
}

.slider-but{
    font-size: 16px  !important;
    font-family: 'Cairo', sans-serif !important;
    color: #fff  !important;
    text-align: center  !important;
}
*/

.sec-services{
    margin: 0 auto;
    padding-top: 110px;
}
.sec-services h5{
    font-size: 20px;
    font-weight: 600;
    color: #f49700;
    margin-bottom: 12px !important;
    text-align: center;
}
.sec-services h2{
    font-size: 35px;
    font-weight: 700;
    color: #101010;
    margin-bottom: 40px !important;
    text-align: center;
}
.sec-services p{
    font-size: 18px;
    color: #818181;
    font-weight: 600;
    text-align: center;
    padding: 0 30% 80px;

}
.sec-services h3{
    font-size: 21px;
    font-weight: 700;
    color: #222222;
    /*letter-spacing: 1px;*/

}
.sec-services h3::after{
    content: '';
    display: block;
    width: 43px;
    height: 2px;
    background: transparent;
    border: 0;
    border-bottom: 2px solid #f39e14;
    margin-top: 8px;
    transition: all 0.5s ease-in-out 0.1s;
}
.serv-block{
    width: 100%;
    height: auto;
    padding: 2% 5%;
    margin-bottom: 45px !important;
    transition: all 0.5s ease-in-out 0.1s;
}
.serv-block:hover{background: #f9f9f9;}
.serv-block:hover h3::after{width: 70%;}

.serv-block p{
    font-size: 18px;
    margin-top: 15px;
    text-align:left !important;
    color: #97907d;
    padding: 0;
}

.partner-box{
    padding: 80px 0;
    background-color: #f3f3f3;
}

.animating{
    -webkit-animation-duration: 17s;
    animation-duration: 17s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
    transition: all 0.7s ease-in-out 0.3s;
}
.bounce{
    -webkit-animation-name: bounce;
    animation-name: bounce;
    -webkit-animation-name: bounce;
    animation-name: bounce;
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
}

.partner-box h5{
    font-size: 20px;
    font-weight: 600;
    color: #f49700;
    padding-top: 40px;
    margin-bottom: 12px !important;
}
.partner-box h2{
    font-size: 35px;
    font-weight: 700;
    color: #101010;
    margin-bottom: 40px !important;
}
.partner-box a{
    display: block;
    width: 140px;
    margin-top: 60px;
    padding: 10px 0;
    color: #ff9c00;
    font-size: 14px;
    font-weight:  600;
    border: 2px solid #ff9c00;
    text-transform: uppercase;
    text-align: center;
    line-height: 20px;
    transition: all 0.2s ease-in-out 0s;
    background-color: transparent;
}.partner-box a:hover{background-color: #ff9c00;color: #fff;}


.products-box{
    padding: 110px 5% ;
}

.products-box h5{
    font-size: 20px;
    font-weight: 600;
    color: #f49700;
    padding-top: 40px;
    margin-bottom: 12px !important;
}
.products-box h2{
    font-size: 35px;
    font-weight: 700;
    color: #101010;
    margin-bottom: 40px !important;
}
.products-box p{
    font-size: 18px;
    color: #818181;
    font-weight: 600;

}
.products-box a{
    display: block;
    width: 140px;
    margin-top: 40px;
    padding: 10px 0;
    color: #ff9c00;
    font-size: 14px;
    font-weight:  600;
    border: 2px solid #ff9c00;
    text-transform: uppercase;
    text-align: center;
    line-height: 20px;
    transition: all 0.2s ease-in-out 0s;
    background-color: transparent;
}.products-box a:hover{background-color: #ff9c00;color: #fff;}

.products-block{
    background-color: #f3f3f3;
    padding: 30px;
    text-align: center;
    min-height: 330px;
    margin-bottom: 30px !important;
}
.products-block h3{
    font-size: 22px;
    font-weight: 600;
    color: #222;
    margin-top: 20px;
    text-align: center;
}


footer{
    min-height: 475px;
    background-color: #1a1a1a;
    width: 100%;
    padding: 90px 0;
    background-position: bottom center;
    background-repeat: no-repeat;
    color: #bebebe;
}
.footer-head{
    width: 100%;
    height: auto;
    min-height: 110px;
    border-bottom: 1px solid #585b60;
    padding-bottom: 40px;
}


.footer-blocks{
    width: 100%;
}


#about-widget, #links-widget, .address{
font-family: tahoma, 'Cairo', sans-serif;
font-size: 14px;
padding: 0 25% 0 0 ;
color: #a1a1a1;
}



h3.footer-head-title{
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 50px;
    color: #fcaf17;
    text-transform: uppercase;
}

footer p{
font-size: 14.5px;
color: #a1a1a1;
font-weight: 600;
}
footer span{
   margin-left: 5px;
}

footer p copy a, footer p copy a:hover{color: #f49700 !important;}

footer ul{
    margin: 0;
    padding: 0;
    display: block;
}

footer ul li{
    list-style-type: none;
    list-style-position: outside;
    font-size: 14px;

margin-bottom: 10px;
    display: block;
    width: 50%;
    float: left;
}
footer ul li a{color: #fff;font-weight: 700;s}   
footer ul li a:hover{color:#fcaf17;}

footer .soc a{
    color:#f49700;
}

footer input, footer textarea{padding:0 55px 0 10px ;border: 0;color: #a1a1a1;min-height: 52px;background-color: #262626;}
.copy{
    background-color: #fcaf17;
    background-image: url(images/footer-copy-img.png);
    background-repeat: no-repeat;
    background-position: center center;

}

.copy a, .copy p{
 color:#fff;
 font-weight: 700;
}

.subscribe-sb{
    padding: 5% 0;
}

.subscribe-sb h4{
    color: #f49700;
    font-size: 14px;
    line-height: 2.2em;
}

button.sub-button{
    position: absolute;
    top: 0;
    right: 0;
    border: 0;
    background-color: #fcaf17;
    color: #fff;
    width: 52px;
    height: 52px;
    text-align: center;
}

.copy{
    width: 100%;
    padding: 25px 0;
}

.copy .socials{float: right;}
.copy .socials a{
    width: 50px;
    height: 50px;
    background: #fdc75d;
    display: block;
    text-align: center;
    line-height: 50px;
    display: block;
    float: left;
    margin-right: 7px;
    font-size: 16px;
    font-weight: 700;
    transition: all 0.2s ease-in-out 0s;
}.copy .socials a i{float: none;margin: 0;padding: 0;}
.copy .socials a:hover{background: #fff;color: #fdc75d;}
.sub-block{
    position:relative;
    margin-top:25px;
}


/* end footer ((((End Home page)))) */
/*Pages*/

.servi-page h5{
    font-size: 20px;
    font-weight: 600;
    color: #f49700;
    margin-bottom: 12px !important;
    text-align: center;
}
.servi-page h3{
    font-size: 27px;
    font-weight: 700;
    color: #101010;
    margin-bottom: 40px !important;
    text-align: center;
}
.servi-page p{
    font-size: 18px;
    color: #818181;
    font-weight: 600;
    text-align: center;
    padding: 0 20% 80px;

}













a.main-colored-btn{
    display: block;
    width: fit-content;
    width: -moz-fit-content;
    margin: 0 auto;
    padding: 10px 20px;
    color: #fff;
    font-size: 14px;
    font-weight:  600;
    border: 2px solid #ff9c00;
    text-transform: uppercase;
    text-align: center;
    line-height: 20px;
    transition: all 0.2s ease-in-out 0s;
    background-color: #ff9c00;
}a.main-colored-btn a:hover{background-color: #fff;color: #222;border: 2px solid #222;}
/*
.main-transparent-btn{
    
}
*/





/* custom vc styles */
.wpb_button, .wpb_content_element, ul.wpb_thumbnails-fluid > li{margin-bottom: 0 !important;}

/* news ticker custom style */
.news-tickers{
    width: 100%;
    height: 70px;
    padding: 30px 0;
    min-height: 100px;
    background: #f49700;
}

h3.mtphr-dnt-title{
    float: left;
    width: 98px;
    padding: 15px;
    margin-right: 17px;
    font-family: 'Open Sans', sans-serif;
    font-size: 17px;
    -moz-border-radius:40px;-webkit-border-radius:40px;border-radius:40px;
    color: #41105b;
    border: 2px solid #41105b;
    text-transform: uppercase;
    text-align: center;
    line-height: 1; 
}

.mtphr-dnt-tick-container{
    margin-left: 35px;
margin-top: 2px;
}

.mtphr-dnt-tickm, .mtphr-dnt-tick a{
    color: #fff !important;
    font-family: 'Open Sans', sans-serif;
    font-size: 15px;
    font-weight: 600;
}
.mtphr-dnt-tick, .mtphr-dnt-default-tick, .mtphr-dnt-clearfix{color: #fff !important;} 
.mtphr-dnt-tick a:visited, .mtphr-dnt-tick a:focus, .mtphr-dnt-tick a:active, , .mtphr-dnt-tick a:hover{
    color: #fff !important;
}

.mtphr-dnt-nav-prev{
    float: right;
    left: auto  !important;
}

.mtphr-dnt .mtphr-dnt-nav{
    margin-top: -16px !important;
    right: -40%;
}

.mtphr-dnt-nav-next{
    right: -48% !important;
}

.mtphr-dnt-icon-arrow-left{
background-image: url(images/lft.png) !important;
    } .mtphr-dnt-icon-arrow-left:before{ content: none !important;}

.mtphr-dnt-icon-arrow-right{
background-image: url(images/rit.png) !important;
}.mtphr-dnt-icon-arrow-right:before{ content: none !important;}

.mtphr-dnt-nav i {
    width: 41px  !important;
    height: 41px  !important;
    margin: 0px 2px !important;
}

a.download-profile{
    padding: 10px 20px !important;
    margin: 0px  auto !important;
    font-family: 'Open Sans', sans-serif !important;
    font-size: 14px !important;
    font-weight: 500;
    -moz-border-radius:40px  !important;-webkit-border-radius:40px  !important;border-radius:40px !important;
    color: #41105b !important;
    border: 1px solid #41105b  !important;
    text-align: center !important;
    background: #fff  !important;
    transition:all 0.3s ease-in 0s;
text-align: center;
vertical-align: middle;
cursor: pointer;
box-sizing: border-box;
word-wrap: break-word;
width: -moz-fit-content;
max-width: fit-content;
width:  all;
display: block;
}a.download-profile:hover{background: #41105b  !important;color: #fff !important;}


.news-info{
    width: auto;
    width: -moz-fit-content;
    padding: 10px 20px !important;
    margin: 0px  auto !important;
    font-family: 'Open Sans', sans-serif !important;
    font-size: 14px !important;
    font-weight: 500;
    -moz-border-radius:40px  !important;-webkit-border-radius:40px  !important;border-radius:40px !important;
    color: #fff !important;
    border: none  !important;
    text-align: center !important;
    background: #41105b  !important;
    transition:all 0.3s ease-in 0s;
}

.news-info .vc_general.vc_btn3, .news-info .vc_general.vc_btn3:hover,  .news-info .vc_general.vc_btn3:active,  .news-info .vc_general.vc_btn3:focus{
    padding: 0;background: none;
border: none;
color: #fff;
font-family: 'Open Sans', sans-serif;
    font-size: 14px;
    font-weight: 600;
width: 100%;}

.news-info:hover{
background-color:#84c743 !important;
}

.news-tickers h1{
    font-size: 19px;
    font-family: 'Open Sans', sans-serif;
    font-weight: 500;
    color: #fff;
    line-height: 1.8;
}

/* About us */
.intro{
    padding: 100px 0px;
    width: 100%;
    position: relative;
    min-height: 600px;
}

.intro .about-us{
    position: relative;
    /*width: 100%;*/
    border: 1px solid #dcdcdc;
    padding: 30px;
    margin-bottom: 30px;
    min-height: 340px;
}

.intro h1{
    font-size: 26px;
    margin-bottom: 18px;
    font-family: 'Open Sans', sans-serif;
    font-weight: 600; 
}

.intro h3{
    font-size: 23px;
    margin-bottom: 55px;
    font-family: 'Open Sans', sans-serif;
    font-weight: 600;
    color: #b9b9b9;
}

.intro p{
    font-size: 13px;
    color: #676767;
    font-family: 'Open Sans', sans-serif;
    display: block;
    /*width: 115%;*/
}
.about-data{
    padding: 80px 0 100px 0;
}

.about-data h3{
    font-size: 23px;
    color: #000000;
    font-family: 'Open Sans', sans-serif;
    font-weight: 600;
    padding-bottom: 50px;
    line-height: 36px;
}

.about-data h4{
    font-size: 17px;
    color: #000000;
    font-family: 'Open Sans', sans-serif;
    padding-bottom: 20px;
}

.about-data h5{
    font-size: 13px;
    color: #000000;
    font-weight: 600;
    font-family: 'Open Sans', sans-serif;
    padding-bottom: 20px;
}

.about-data p{
    font-size: 13.5px;
    font-weight: 300;
    color: #676767;
    font-family: 'Open Sans', sans-serif;
    display: block;
    padding-bottom: 35px;
    
}


h3.desc{
margin-bottom: 0;
padding-bottom: 10px;
}
h4.desc{
font-size: 18px;
font-family: 'Open Sans', sans-serif;
font-weight: 600;
}
h5.desc{
margin-bottom: 50px;
padding-top: 40px;
font-family: 'Open Sans', sans-serif;
font-size: 13px;
color: #676767;
}
p.desc{
    
    display: flex;
}

.staff{
    
    margin:0 auto;
    
}

.staff img{
    max-width: 100%;
display: block;
height: auto;   
}
.one-staff{
    position: relative;
   background-color: #fff;
   min-height: 230px;
   transition: all 0.3s ease-in 0s;
    -moz-box-shadow: rgba(1,2,2,0.08) 0px 1px 1.96px 0.04px;
    -webkit-box-shadow: rgba(1,2,2,0.08) 0px 1px 1.96px 0.04px;
    box-shadow: rgba(1,2,2,0.08) 0px 1px 1.96px 0.04px;
    transition: all 0.2s ease-in-out 0s;
    transform: translateY(0)!important; 
}

.one-staff-data{
    width: 100%;
    height: 0%;
    position: absolute;
    margin: 0 auto;
    cursor: pointer;
    top: 0%;
    z-index: 1;
    background-color: #f49700;
    color: #fff;
    transition: all 0.3s;
    text-align: center;
    /*background: url(images/head-title.png);   
    background-position: 0px 0px;
    -webkit-animation: header linear 400s infinite;
    -moz-animation: header linear 400s infinite;
    -ms-animation: header linear 400s infinite;
    -o-animation: header linear 400s infinite;
    animation: header linear 400s infinite;*/
}   

.one-data{
    width: 100%;
    height: 100%;
    cursor: pointer;
    position: absolute;
    margin: 0 auto;
    padding: 30% 10% 10%;
    top: 0%;
    z-index: 2;
    opacity: 0;
    
    transition: all 0.2s;
}

.one-data p, .one-data h4, .one-data h5{color: #fff !important;text-align: center;margin-bottom: 10px;}
.one-data h5{margin-bottom: 20px;}

.one-staff:hover .one-staff-data{
    width: 100%;
    height: 100%;
    top: 0%;
    cursor: pointer;
}

.one-staff:hover .one-data{
    opacity: 1;
}

.one-data .shares{
    width: fit-content;
    width: -moz-fit-content;
    height: auto;
    margin: 20px auto;
    
}.one-data .shares a i{color: #fff;}

/*
.one-staff:hover{
        -moz-box-shadow: 0 10px 25px 5px rgba(0,0,0,0.2);
    -webkit-box-shadow: 0 10px 25px 5px rgba(0,0,0,0.2);
    box-shadow: 0 10px 25px 5px rgba(0,0,0,0.2);
    transform: translateY(-8px)!important;
}
*/
.staff-data{
    padding: 20px;
}

.staff-data h4{
padding-bottom: 5px !important;
}

.staff h5{
    font-size: 14px;
}

.staff-data h5{
    padding-bottom: 5px !important;
    font-size: 13px;
    color: #878787;
}

.staff-data p{margin-bottom: 0px !important;}

.abou-img{
max-height: 495px;
overflow: hidden;
width: 100%;
position: absolute;
left: 8%;
top: 0;
display: block;
}
.abou-img .wpb_single_image img{max-width: none;}
.contact-img{
max-height: 525px;
overflow: hidden;
width: 100%;
position: relative;
right: 2.3%;
top: 0;
display: block;
}
.contact-img .wpb_single_image img{max-width: none;}

.title-box{
width: 275px;
min-height: 213px;
padding: 43px;
background: #602680;
position: absolute;
top: 205px;
left: 2%;
z-index: 2;
opacity: 0.95;
}
.title-box h4{
    font-size: 15px;
    color: #fff;
    font-family: 'Open Sans', sans-serif;
    display: block;
    padding-bottom: 20px;
}
.title-box h5{
    font-size: 19px;
    line-height: 25px;
    font-weight: 600;
    color: #fff;
    font-family: 'Open Sans', sans-serif;
    display: block;
    padding-bottom: 35px;
}

.title-box a{color: #fff;}.title-box a:hover{color: #84c743;}
/* connect us */
.connect{
    background-color: #00aa68;
    width: 100%;
    height: 215px;
    overflow:hidden;
}
.text-in{
    position:relative;
    z-index:2;
    padding: 0 60px 0 0 ;
}

.connect h3{
    font-size: 20px;
    font-family: 'Open Sans', sans-serif;
    color: #fff;
    margin:57px 0 25px 0;
    text-transform: uppercase;
    
}
.connect p{
    font-size: 14.7px;
    font-family: 'Open Sans', sans-serif;
    font-weight: 300;
    color: #fff;
}
.contact-info{
    width:60%;
    padding:0  0 0 12%;
    float:left;
}
.contact-info h3{
    padding-left:40px;
    font-size: 18px;
    font-family: 'Open Sans', sans-serif;
    
}

.phone{
    width:100%;
    min-height:27px;
    padding-left:40px;
    background-image: url(images/phone.png);
    background-position:left;
    background-repeat:no-repeat;
    font-size:22px;
    color:#fff;
    text-align:left;
    direction:ltr;
}
.order-button{
    width: auto;
    float:right;
}
.order-button a{
    background-image:url(images/button.png);
    width:169px;
    height:54px;
    text-align:center;
    padding-top:15px;
    font-size:16px;
    color:#00aa68;
    font-family: 'Open Sans', sans-serif;
    display:block;
    margin-top: 90px;
    float:right;
}


.join-us{
    
    position: absolute;
    width:200%;
    height:100%;
    top:0;
    right:0;
    z-index:1;
    border-radius: 110px;
    border-top-left-radius: 110px;
    border-bottom-left-radius: 110px;

    background-color: #018e58;
    min-height: 215px;
    
}

.call-info{
    width: 50%;
    background-color: #00aa68;
    min-height: 215px;
}




/* services */

.services-block {
    position: relative;
    margin: 0 auto 30px auto;
    padding: 15px;
    width: 100%;
    overflow: hidden;
    background-color: #f5f5f5;
    transition: all 0.1s ease-in 0.1s;
    min-height: 295px;
}


.service-img:hover .services-block-data{
    width: 100%;
    height: 100%;
    top: 0%;
    
    cursor: pointer;
}

.services-block .hover img{
    width:100%;
}

.service-img:hover .services-data{
    opacity: 1;
    top: 0%;
}
.services-block:hover img{
-webkit-transform: scale(1.2) /*rotate(5deg)*/;
        transform: scale(1.2) /*rotate(5deg)*/;
}
.service-img{
    position: relative;
    width:100%;
    max-height:315px;
    overflow: hidden;
    transition: all 0.3s ease-in-out 0.3s;
    margin-bottom: 18px;
}  

.service-img img{
    max-width: 100%;
    height: auto;
    -webkit-transition: -webkit-transform 2s;
    transition: transform 2s;
}
    
.services-block h3 {
    font-size: 16px;
    margin: 0px;
    margin-bottom: 15px;
    padding: 0px;
    line-height: 1.5em;
    color: #3c5170;
    text-align: center;
}.services-block h3 a{font-family: inherit;}
    
.services-block p{

    font-size: 15px;
    margin: 0;
    margin-bottom: 8px;
}  
/*
.styled-block{
    background-color: rgb(34 34 34 / 85%) !important;
    padding: 75px 201px;
    width: fit-content;
    width: -moz-fit-content;
    margin: 0 auto;
}
.styled-block p{
    padding: 0 !important
}
*/

/* Service page */
.service-page{
    width: 100%;
}

.service-page h4{
    display: block;
    margin: 0 auto 20px;
}

.service-page p{
    display: block;
    margin: 0 auto;
    font-size: 17px;
    font-weight: 600;
    padding: 30px 0;
}





/* Contact page */
.contact-us{
    width: 100%;
}

.contact-us h4{
    width: 50%;
    display: block;
    margin: 0 auto;
    text-align: center;
    padding-bottom: 25px;
}

.contact-us h5{
    padding-bottom: 25px;
}

.contact-us span input{margin-bottom: 25px !important;}

.contact-us .head p{
    width: 50%;
    display: block;
    margin: 0 auto;
    text-align: center;
    padding-bottom: 50px;
}

.contact-us .block{
    margin-bottom: 50px !important;
}


.my-map{
    opacity: 0.5;
    width:100%;
    padding:0;
    min-height:600px;
}

.contact-home {
    -moz-box-shadow: 0 10px 25px 5px rgba(0,0,0,0.2);
    -webkit-box-shadow: 0 10px 25px 5px rgba(0,0,0,0.2);
    box-shadow: 0 10px 25px 5px rgba(0,0,0,0.2);
    position: absolute;
    z-index: 9;
    min-width: 500px;
    /* min-height: 500px; */
    right: 7%;
    top: 12%;
    padding: 4% 4% 0;
    background: rgb(247 247 247 / 60%);
}
.contact-home h2{
    padding-bottom: 40px;
}
.contact-home h5{
    color:#f49700;
    padding-bottom: 20px;
}
@media (max-width: 768px){
    .contact-home {
        min-width: 80%;
    }
}
@media (max-width: 520px){
    .contact-home {
        top: 15%;
        right: auto;
        left: 7%;
    }
    
}
@media (max-width: 400px){
    .my-map{display:none;}
    .contact-home {position: relative;left: auto;top: 0;}
}

.chaty-widget .i-trigger {
    bottom: 36px;
    left: 25px;
}/*    
.chaty-widget .chaty-widget-i {
    left: 25px;
    bottom: 35px;
}
*/



/* preload */
.pace .pace-progress {
    animation: 1s linear 0s normal none infinite running bi-gradient;
    background: #f49700;
    position: fixed;
    z-index: 2000;
    top: 0;
    right: 100%;
    width: 100%;
    height: 3px;
    z-index: 99;
}

.pace-inactive {
    display: none;
}

.pace-activity {
    background: rgba(0,0,0,0.0);
    height: 3px;
}

.pace{
  height: 100%;
position: absolute;
z-index: 99;
width: 100%;
}

.pace-running .wrapper{
    zoom:1;
    filter:alpha(opacity=10);
    opacity:0.0;
}
.pace-done .wrapper{
    zoom:1;
    filter:alpha(opacity=100);
    opacity:1;
    -webkit-transition:opacity 1s linear;
    -moz-transition:opacity 1s linear;
    -o-transition:opacity 1s linear;
    transition:opacity 1s linear;
}
.pace > h1.logo-text{
    display: block;
    width: 90px;
    height: 90px;
    background-image: url('images/icon.png');
    background-size: 100%;
    margin: 0 auto !important;
    position: relative;
    top: 35%;
    position: fixed;
left: 46.5%;
right: auto;
top: 49%;
}


/* search set */
.search-page{
    width: 100%;
}


.search-page h3{
    width: 100%;
    padding: 30px;
    text-align: center;
    font-size: 25px;
    color: #fff;
    background-color: #f49700;
    margin-bottom: 80px;
}

.search-page h4, .search-page p{
    margin-bottom: 5px;
}
article.post{
    margin-bottom: 30px;
    background-color: #f9f9f9;
    padding: 9px;
}

article.post img{
    margin-bottom: 10px;
}
.paginate{
    padding-top: 40px;
    margin: 0 auto;
    display: block;
width: -moz-fit-content;
width: fit-content;
}
/*span{margin-right: 10px;color: #fff;padding: 2px;background-color:  #f49700;}*/
.page-numbers{margin-right: 7px;}
a.page-numbers{-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;color: #181818;padding: 4px 6px;background-color:  #f0f0f0;}
span.current{-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;color: #fff;padding: 4px 6px;background-color:  #f49700;}


/**** Project pagr ****/
.page-project{
    width: 100%;
    padding-bottom: 110px;
}

.page-project h1{
    font-size: 28px;
    color: #3c5170;
    text-align: center;
    padding: 40px 0 20px;
}

.page-project h2{
    font-size: 22px;
    color: #3c5170;
    text-align: center;
    padding: 20px 0 40px;
}

.page-project p{
    text-align: justify;
    margin-bottom: 10px !important;
}    

.project-sidebar{
    min-height: 250px;
    border-right: 1px solid #f0f0f0;
    padding: 25px 25px 25px 0;
    margin-right: 10%;
}

.project-sidebar p{
color: #3c5170;
    }

.shares{
    margin: 30px 0;
}
.shares a{
    margin-left: 15px  !important;
    color: #c0c0c0  !important;
    font-size: 17px  !important;
}

.flexslider{
    max-height: 400px;
    overflow: hidden;
}

.flexslider .slides img{
    height: auto;
}

.other-portfolios{
    width: fit-content;
    width: -moz-fit-content;
    margin: 0 auto;
    min-width: 100px;
    margin-bottom: 75px;

}

.next-p, .prev-p{
    width: 35px;
    font-size:20px;
    text-align: center;
    color: #c0c0c0;
}

.proj-link{
    width: 30px;
    font-size:20px;
    text-align: center;
    margin: 0 auto;
    color: #f49700;
}

/****** Header pages Title *****/

.header{
    width: 100%;
}

.head-title{
    position: relative;
    top: 70px;
    width: 100%;
    background: url(images/head-title.png);   
    background-position: 0px 0px;
   text-align: center;
    max-height: 100%;
    height: 180px;
    -webkit-animation: header linear 400s infinite;
    -moz-animation: header linear 400s infinite;
    -ms-animation: header linear 400s infinite;
    -o-animation: header linear 400s infinite;
    animation: header linear 400s infinite;

}
@-webkit-keyframes header {     from { background-position: 0 0; }
                             to { background-position:  150% 0; }
}
@-moz-keyframes header {    from { background-position: 0 0; }
                          to { background-position: 150% 0; }
}
@-ms-keyframes header {     from { background-position: 0 0; }
                         to { background-position: 150% 0; }
} 
@-o-keyframes header {  from { background-position: 0 0; }
                        to { background-position: 150% 0; }
} 
@keyframes header {     from { background-position: 0 0; }
                     to { background-position: 150% 0; }
}

.head-title h1{
    font-family: 'Open Sans', sans-serif;
    font-weight: 600;
    font-size: 36px;
    color: #fff;
    padding-top: 45px;
    width: 100%;
   text-shadow: 0px 1px 1px #00653c;
}

.head-title p{
    font-family: 'Open Sans', sans-serif;
    font-weight: 500;
    font-size: 20px;
    color: #f8f8f8;
    padding-top: 13px;
    width: 100%;
   text-shadow: 0px 1px 1px #00653c;
}




.features ul{
    margin-left: 15px;
}
.features ul li{
    width: 50%;
    float: left;
}

.features ul li span{font-family: 'Open Sans', sans-serif; font-size: 15px;font-weight: 500;color: #181818;}
.features h3{
    font-family: 'Open Sans', sans-serif;
}

.feature-services{
    width: 100%;
    padding: 40px 0 0 0;
}

.feature-services h2{
    margin-bottom: 45px;
    padding-bottom: 0;
}

.feature-services ul{
    margin: 0px 0 35px 0;
}

.feature-services ul li{
    line-height: 27px;
    margin-left: 20px;
}

.feature-services p{
    padding: 0px 0 0 20px;
}

.serv-sections{
    width: 100%;
    padding: 100px 0 0px 0;
    text-align: center;
}

.serv-sections h2{
    font-size: 22px;
}

.section-img{
    position: relative;
    width: 205px;
    height: 205px;
    margin: 0 auto 30px auto;
    border: 4px solid #f1f1f1;
    overflow: hidden;
    -moz-border-radius: 100px;-webkit-border-radius: 100px;border-radius: 100px;
}

.section-img img{
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
}


.active-section{
    border: 4px solid #00aa68!important;
}
.active-img{
    z-index: 99999 !important;
}


.section-img:hover{border: 4px solid #00aa68;}


/* Gallery style */
.portfolio-section{position:relative;width:100%;}
.portfolio-section nav{margin:0 auto;max-width:630px;padding-bottom:35px;}
.portfolio-section nav a{text-transform:capitalize;color: #181818;padding:0px 25px;font-size:14px;font-weight:500;font-family:'Raleway', sans-serif !important;}
.portfolio-section nav a span{color:#181818;font-family:'Open sans', sans-serif;}
.portfolio-section h3{font-size:22px;font-weight:500;line-height:38px;text-transform:uppercase;letter-spacing:4px;padding-top:10px;color:#fff;}
.portfolio-section h3 b{font-weight:700;color: #181818;}
.portfolio-section h2{font-size:28px;font-weight:500;line-height:38px;text-transform:uppercase;letter-spacing:4px;padding-top:60px;color:#fff;}
.portfolio-section h2 b{font-weight:700;color:#fff;}
.portfolio-section p{font-weight:500;font-size:13.7px;padding-bottom:5px;color: #181818;}
.portfolio-section a{font-weight:500;font-size:12px;color: #181818;display: block;overflow: hidden;position: relative;}
.portfolio-section img{display:block;max-width:100%;height:auto;}
.portfolio-data{padding:5px 0 0 0px;}
.filters{float:right;margin-top:-136px;margin-right:-50px;}

.portlink{display:block;margin-top:40px;}

.port-summary{display:none;width:0%;height:0%;position:absolute;margin:0 auto;cursor:pointer;top:50%;left:50%;z-index:1;opacity:0;background-color:#f49700;;color:#fff;transition:all 0.3s;text-align:center;}
.port-data{display:none;width:100%;height:100%;cursor:pointer;position:absolute;margin:0 auto;padding-top:23%;top:0%;left:0%;z-index:2;opacity:0;color:#fff;transition:all 0.3s;text-align:center;}
.project i{font-style: normal;opacity: 0;text-align: center;line-height: 7.5em;background-color:rgba(6,3,19, 0.85);color:#f0f0f0;font-size:30px;display: block;position: absolute;z-index: 2;width: 100%;height: 100%;transition:all 0.3s;}
.project i.title{font-size: 20px;padding-top: 20%;}
.project{position:relative;}
.projecty:hover i{opacity:1;}

.project-status{
    position: absolute;
    background-color: #3c5170;
    color: #fff;
    font-family: 'Cairo', tahoma, sans-serif;
    padding: 4px;
    top:10px;
    right: 0px;
    z-index: 5;
    opacity: 0;
    transition:all 0.3s;
}

.project:hover .project-status{opacity:1;}

.project-links{max-width:280px;margin:0 auto;margin-bottom:150px;margin-top:100px;}
.project-links p{padding-bottom:0;margin:0 0 25px 0;line-height:1.7;text-align:center !important;}
.project-links h4{text-align:center !important;font-size:20px;}
a.project-link{font-size:11px;font-weight:500;color:#fff;text-align:center;min-width:39px;min-height:39px;display:block;float:left;margin:0 5px;background-color:#5e1fe4;text-transform:capitalize;padding:12px 15px;position:relative;cursor:pointer;}
a.project-link:hover{color:#fff !important;}
.project-alt{position:relative;width:170px;margin:0 auto;}
a.close-share{cursor:pointer;position:absolute;left:6px;top:-39px;font-size:16px;z-index:2;min-width:38px;min-height:38px;display:block;background-color:#5e1fe4;text-align:center;line-height:2.2;}
a.close-share:hover{color:#fff !important;background-color:#f49700;}
#share-project{position:absolute;top:40px;left:0;//opacity:;}
.projecty{transition: all 0.3s ease-in-out 0.3s;}
.projecty:hover img{
-webkit-transform: scale(1.2) rotate(0deg);
        transform: scale(1.2) rotate(0deg);
}

.projecty img{
    max-width: 100%;
    height: auto;
    -webkit-transition: -webkit-transform 1s;
    transition: transform 1s;
}



.button-group{
    width: -moz-fit-content;
    margin: 0 auto;
    width: fit-content;
    padding-bottom: 50px;
     
    padding-right: 10%;
    padding-left: 10%;
    text-align: center;
}
button.button{font-family: 'Cairo', tahoma, sans-serif;
    padding-bottom: 7px;
padding-left: 3px;
padding-right: 3px;font-size:14px;margin:0;padding:0;color:#464545;margin:0 25px;border:0;background-color:transparent;box-shadow:0 0 0 transparent;}
button.button:hover{color:#f49700;}
.is-checked{color:#f49700 !important;border-bottom: 2px solid #f49700 !important;}
.gutter-sizer { width: 4%; }

h4.desc a{
    margin-bottom: 15px  !important;
    display: block;
}
p.numb{
    position: absolute;
top: -25px;
left: -50px;
font-size: 90px;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif  !important;
color: #f8eefe;
transition:all 0.3s ease-in 0s;
}
p.numb2{
    position: absolute;
top: -25px;
left: -40px;
font-size: 90px;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif  !important;
    font-weight: 500;
color: #f8eefe;
transition:all 0.3s ease-in 0s;
}

.res-item{
    width: 100%;
    transition:all 0.3s ease-in 0s;
}

.res-item:hover p.numb{
    color: #f49700;
}
.res-item:hover p.numb2{
    color: #f49700;
}

.box-admis{
    position: relative;
   background-color: #fff;
   max-height: 230px;
   transition: all 0.3s ease-in 0s;
    -moz-box-shadow: rgba(1,2,2,0.08) 0px 1px 1.96px 0.04px;
    -webkit-box-shadow: rgba(1,2,2,0.08) 0px 1px 1.96px 0.04px;
    box-shadow: rgba(1,2,2,0.08) 0px 1px 1.96px 0.04px;
    transition: all 0.2s ease-in-out 0s;
    transform: translateY(0)!important;
    padding: 20px; 
    padding-top: 40px;
    border-bottom: 2px solid #f49700;
}

.box-admis h4{
    padding-bottom: 20px !important; 
}


.box-admis1{
    position: relative;
   background-color: #fff;
   transition: all 0.3s ease-in 0s;
    -moz-box-shadow: rgba(1,2,2,0.08) 0px 1px 1.96px 0.04px;
    -webkit-box-shadow: rgba(1,2,2,0.08) 0px 1px 1.96px 0.04px;
    box-shadow: rgba(1,2,2,0.08) 0px 1px 1.96px 0.04px;
    transition: all 0.2s ease-in-out 0s;
    transform: translateY(0)!important;
    padding: 40px; 
    border-bottom: 2px solid #f49700;
    min-height: 390px;
}

.box-admis1 h4{
    padding-bottom: 20px !important; 
}

.box-admis1 p{
    padding: 0;
}
.box-admis1 a{
    display: block;
    padding-top: 35px;
}

.counters{
    width: 80%;
    margin:0 auto  !important;
}

.donate-block{
    width: 50%;
    margin:0 auto  !important;
}

.numb-blocks{padding: 175px 75px 0 75px;}

.num-align{padding: 0 7% !important;}

/* Align data */
.view-on-mobile{display: none  !important;}
.fit-paragraph{width:90%;}
.padding-right-div{padding-right: 40px !important;}
.padding-left-div{padding-left: 40px !important;}
.padding-top-div{padding-top: 40px !important;}
.padding-bottom-div{padding-bottom: 35px !important;}
.padding-top-80{padding-top: 80px !important;}
.padding-bot-80{padding-bottom: 80px !important;}
.padding-top-100{padding-top: 100px !important;}
.padding-bot-100{padding-bottom: 100px !important;}
.padding-top-130{padding-top: 130px !important;}
.padding-bot-130{padding-bottom: 130px !important;}
.divider-div{margin-bottom: 30px;display: inline-block;}

.hidden-xl-lg-md{display: none !important;}.visible-xl-lg-md{display: block !important;}

.wpcf7-form label.error{color:red  !important;padding-left: 0  !important;}


/* top page button */
.ToTop{z-index: 2;width:40px;height:40px;padding:9px;text-align:center;background:#f49700;font-weight:bold;color:#fff;text-decoration:none;position:fixed;bottom: 1.7%;
right: 1%;display:none;box-shadow:0px 5px 11px -2px rgba(0, 0, 0, 0.18),
0px 4px 12px -7px rgba(0, 0, 0, 0.15);}
.ToTop:hover{text-decoration:none;color:#f49700;background: #f8f8f8;}
.ToTop:focus{text-decoration:none;color:#fff !important;background: #f49700 !important;}