/* start fonts */

@font-face { /*font-family: 'Brandon-reg', Verdana, Tahoma;*/
    font-family: "Brandon-reg";
    src: url(../fonts/custom/BrandonGrotesque-Regular.ttf) format("truetype");
}
@font-face { /*font-family: 'Cairo', sans-serif;*/
    font-family: "Cairo";
    src: url(../fonts/custom/Cairo-ExtraLight.ttf) format("truetype");
}
/* end fonts */
/*---------------------------------------------------------------------------------------*/
/* start main rules */

body { font-size: 16px; font-family: 'Cairo', sans-serif; overflow: hidden; }

.body_hidden{overflow: hidden !important;}

.nicescroll-rails{ opacity: 1 !important; filter: alpha(opacity=0) !important; z-index: 9999 !important; }

.nicescroll-rails div{ 
    width: 6px!important; 
    background-color: rgb(255, 193, 7)!important; 
    border:none!important; 
    border-radius: 0 !important; 
}

::selection { background: #ffc104; }

::-moz-selection { background: #ffc104; }

.upper-bar, .upper-bar .bar-links li, .menu, .menu .menu-logo img, .menu .menu-links li a,
.langs-icon, .full-menu ul li a, .full-menu ul li a:after, .scroll-button span, .scroll-button .mouse-body,
.our-clients img, .our-team .team .team-list li, .latest-pro .pro .overlay-pro, .new-pro .pro-btn,
.footer .footer-links li, .footer .footer-snap img, .our-services .ser-btn, .lang_form select,
.our-services .services-info .services-group .services-btn, .contact-info .contact-links li, .windows .window-btn,
.custom_file .upload-btn, .contact-btn, .our-team .facebook_icon, .our-team .twitter_icon,
.our-team .instagram_icon, .our-team .youtube_icon, .our-team .gplus_icon, .fb_icon, .tw_icon,
.ins_icon, .yt_icon, .gp_icon, .footer .totop_btn, .under-footer .develope_link{
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}


.aslider .slide-one, .aslider .slide-two, .aslider .slide-three, .aslider .slide-four, .skills .skill-img, .testimonials,
.our-clients .client-img, .our-team,.contact_header, .career_header, .about_header, .aboutus .mission-details .mission_one,
.aboutus .mission-details .mission_two, .aboutus .mission-details .mission_three, .manage_header, .manage .manage-details .manage_one,
.manage .manage-details .manage_two, .manage .manage-details .manage_three, .manage .manage-details .manage_four,
.manage .manage-details .manage_five, .manage .manage-details .manage_six, .projects_header, .projects .projects-details .project_one,
.projects .projects-details .project_two, .projects .projects-details .project_three, .projects .projects-details .project_four,
.projects .projects-details .project_five, .projects .projects-details .project_six, .services_header,
.services .servone_img_one .image_one, .services .servone_img_two .image_two, .services .servtwo_img,
.services .servthree_img_one .image_one, .services .servthree_img_two .image_two{
    -ms-background-size:cover !important;
    background-size:cover !important;
}

.right{ text-align: right !important;}

.clearfix{clear: both;}

.float_r{float: right;}

.icon_divider:before, .icon_divider:after{ background: url(../images/divider.png) no-repeat; }

.icon_divider_two:before, .icon_divider_two:after{ background: url(../images/divider2.png) no-repeat; }

.icon_divider, .icon_divider_two {
    width: 7px;
    height: 7px;
    border: #cdcdcd 1px solid;
    border-radius: 100%;
    position: relative;
    display: inline-block;
    margin: 24px auto 19px auto;
}

.icon_divider:before, .icon_divider:after, .icon_divider_two:before, .icon_divider_two:after{
    content: '';
    width: 150px;
    height: 1px;
    position: absolute;
    display: block;
    top: 2px;
}

.icon_divider:before, .icon_divider_two:before { left: -151px; }

.icon_divider:after, .icon_divider_two:after { background-position: right; left: 6px; }

.thumbnail { padding: 2px; background-color: #575757; }

.fb_icon:hover{color: #5567a9;}
.tw_icon:hover{color: #1da1f2;}
.ins_icon:hover{color: #7e3db0;}
.yt_icon:hover{color: #fe0000;}
.gp_icon:hover{color: #dc4a38;}

/* end main rules */
/*----------------------------------start index page-------------------------------------*/
/* start header */

header{ position: fixed; top: 0; width: 100%; z-index: 9999; }

.upper-bar{
    height: 40px;
    color: #FFF;
    border-bottom: 1px solid rgba(255,255,255,0.2);
}

.upper-bar .tips p{ 
    direction: rtl;
    display: inline-block;
    margin-right: 15px;
    margin-bottom: 0;
    padding: 0 20px 0;
    line-height: 40px;
    border-right: 1px solid rgba(255,255,255,0.2);
}

.upper-bar .tips p:nth-of-type(2),
.upper-bar .tips p:nth-of-type(3){

    border-left: 1px solid rgba(255,255,255,0.2);
}

.upper-bar .bar-links{ margin: 0; margin-top: 9px; }

.upper-bar .bar-links li{ display: inline-block; margin-right: 12px; cursor: pointer; }

.menu{ padding: 4px 0 8px; }

.menu .menu-logo img{ cursor: pointer;}

.menu .menu-logo img:hover{ margin-left: 30px !important;}

.menu .menu-links{ margin-top: 12px; display: inline-block; margin-left: calc(33% - 259px); }

.menu .menu-links li{ display: inline-block; margin-right: 15px; }

.menu .menu-links li:last-of-type{ margin-right: 0; }

.menu .menu-links li a{ text-decoration: none; font-size: 18px; color: #FFF; }

.menu .menu-links li a:hover{ color: #fac855;}

.menu .small_logo{
    position: fixed;
    width: 50px;
    left: 30px;
    -webkit-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}

.menu .small_logo:hover{
-webkit-box-shadow: inset 1px 1px 2px rgba(0,0,0,.075), 0px 0px 8px rgb(249, 249, 249);
box-shadow: inset 1px 1px 2px rgba(0,0,0,.075), 0px 0px 8px rgb(249, 249, 249);
}

.a_active{ color: #fac855 !important;}

.lang_form{ display: inline-block; float: right; margin: 6px 10px 0; }

.lang_form select{
    background-color: transparent;
    color: #ffc104;
    border: none;
    outline: none;
    cursor: pointer;
    padding: 0 10px;
    font-family: 'Brandon-reg', Verdana, Tahoma;
}

.lang_form select:hover{ color: #e9b003; }

select {
    -webkit-appearance: none;
    -moz-appearance: none;
    text-indent: 1px;
    text-overflow: '';
}

select::-ms-expand { display: none; }

.langs-icon {
    margin-top: 18px;
    font-size: 14px;
    text-decoration: none;
    color: #FFF;
    cursor: pointer;
    margin-right: 57px;
}

.langs-icon:hover{ color: #fac855; text-decoration: none;}

.toggle-button{
    width: 34px;
    height: 34px;
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 99999;
    display: none;
    -webkit-transition: all .5s cubic-bezier(.7,0,.3,1);
    -o-transition: all .5s cubic-bezier(.7,0,.3,1);
    transition: all .5s cubic-bezier(.7,0,.3,1);
}

.toggle-button .lines{
    position: relative;
    width: 100%;
    height: 4px;
    background-color: #fac855;
    display: block;
    top: 50%;
    margin-top: -2px;
    -webkit-transition: all .3s cubic-bezier(.7,0,.3,1);
    -o-transition: all .3s cubic-bezier(.7,0,.3,1);
    transition: all .3s cubic-bezier(.7,0,.3,1);
}

.toggle-button .lines:after,
.toggle-button .lines:before {
    content: '';
    position: absolute;
    left: 0;
    width: 100%;
    height: 4px;
    background-color: #fac855;
    display: block;
    -webkit-transition: all .3s cubic-bezier(.7,0,.3,1);
    -o-transition: all .3s cubic-bezier(.7,0,.3,1);
    transition: all .3s cubic-bezier(.7,0,.3,1);
}

.toggle-button .lines:after { top: 10px; }

.toggle-button .lines:before { top: -10px; }

.toggle-button:hover .lines:after {
    -webkit-transform: translateY(2px)rotate(0);
    -ms-transform: translateY(2px)rotate(0);
    transform: translateY(2px)rotate(0);
}

.toggle-button:hover .lines:before {
    -webkit-transform: translateY(-2px)rotate(0);
    -ms-transform: translateY(-2px)rotate(0);
    transform: translateY(-2px)rotate(0);
}

.toggle-button.toggle {
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

.line-opacity{ background-color: transparent !important; }

.toggle-button.toggle .lines:before {
    -webkit-transform: translateY(0)rotate(-45deg);
    -ms-transform: translateY(0)rotate(-45deg);
    transform: translateY(0)rotate(-45deg);
    top:0;
}

.toggle-button.toggle .lines:after {
    -webkit-transform: translateY(0)rotate(45deg);
    -ms-transform: translateY(0)rotate(45deg);
    transform: translateY(0)rotate(45deg);
    top:0;
}

.toggle-button.toggle:hover .lines:before {
    -webkit-transform: translateY(0)rotate(-52deg);
    -ms-transform: translateY(0)rotate(-52deg);
    transform: translateY(0)rotate(-52deg);
}

.toggle-button.toggle:hover .lines:after {
    -webkit-transform: translateY(0)rotate(52deg);
    -ms-transform: translateY(0)rotate(52deg);
    transform: translateY(0)rotate(52deg);
}

.full-menu{
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left:0;
    z-index: 10000;
    display: none;
    background-color: #1d252b;
}
    
.full-menu ul{ color: #000; text-align: center; font-size: 35px; }

.full-menu ul li{ padding-top: 10px; }

.full-menu ul li a{
    color: #e5dddd;
    padding-bottom: 10px;
    font-size: 35px;
    text-decoration: none;
    display: inline-block;
}

.full-menu ul li a:after{ border-bottom: 1.15px solid #ebab19; content: ''; display: block; width: 0%; }

.full-menu ul li:hover a:after{ width: 100%; }

/* end header */

/* start slider */

.carousel{ overflow: hidden; }

.carousel .overlay{
    background:rgba(1, 5, 9, 0.5);
    width: 100%;
    height:100%;
    position: absolute;
    z-index: 200;
}

.aslider .slogen, .aslider .slogen-head{ position: absolute; width: 100%; text-align: center;}

.aslider .slogen{ color: #FFF; font-size: 70px; }

.aslider .slogen-head{ color: #fcf267; font-size: 60px; }

.aslider .full-width{ width: 100%; height: 100%; z-index: 100; }

.aslider .slide-one,
.aslider .slide-two,
.aslider .slide-three,
.aslider .slide-four{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-animation: zoomin 60s ease-in-out 0s infinite alternate ;
    animation: zoomin 60s ease-in-out 0s infinite alternate;  
}

.aslider .slide-one{ background:url('../images/img1.jpg') no-repeat center center ; }

.aslider .slide-two{ background:url('../images/img2.jpg') no-repeat center center ; }

.aslider .slide-three{ background:url('../images/img3.jpg') no-repeat center center ; }

.aslider .slide-four{ background:url('../images/img4.jpg') no-repeat center center ; }

.scroll-button{
    width: 150px;
    position: absolute;
    bottom:20px;
    left: calc(50% - 75px);
    cursor: pointer;
    z-index: 300;
}

.scroll-button:hover .mouse-body{background-color: #FFF;}

.scroll-button:hover span{
    -webkit-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2);
    opacity: 0;
    filter: alpha(opacity=0);
}

.scroll-button span{
    position: absolute;
    font-size: 15px;
    left: 36px;
    font-weight: bold;
    top: 23px;
    color: #ffffff;
}

.scroll-button .mouse-body{
    width: 27px;
    height: 49px;
    border:2px solid #b3b3b3;
    margin: auto;
    border-radius: 14px;
}

.scroll-button .mouse-body .mouse-wheel{
    width: 6px;
    height: 7px; 
    border: 2px solid #b3b3b3;
    background-color: #b3b3b3;
    margin: auto;
    border-radius: 14px;
    margin-top: 5px;
    -webkit-animation: flashing_scroll 2s ease infinite ;
    animation: flashing_scroll 2s ease infinite ;
}

/* end slider */

/* start small windows */

.windows{ padding-top: 80px; }

.windows .window-one,
.windows .window-two,
.windows .window-three{
    float: right;
    text-align: right;
}

.windows img{ max-width: 100%; }

.windows h4{ font-weight: bold; font-size: 21px;}

.windows .window-btn{
    display: inline-block;
    text-align: center;
    height: 35px;
    background-color: #ffc104;
    border: 1px solid #ffc104;
    margin-top: 10px;
    color: #FFF;
    border-radius: 30px;
    padding: 6px 30px;
    outline: none;
    font-size: 16px;
    cursor: pointer;
    text-decoration: none;
}

.windows .window-btn:hover { background-color: #FFF; color: #bbbdbf; border: 1px solid #bbbdbf; }

/* end small windows */

/* start our skills */

.skills{ margin-top: 80px; }

.skills .skills_main_p{direction: rtl;}

.skills .skill-img{ height: 750px; background:url('../images/skill-img.jpg') no-repeat center center ; }

.skills .skill-info{ text-align: center; }

.skills .skill-info .row{ margin: 20px 0; }

.skills .skill-info .row div{
    float: right;
    text-align: right;
}

.skills .skill-info h6{ font-style: italic; font-size: 22px;}

.skills .skill-info h2{ font-size: 37px; margin-bottom: 0; }

.skills .skill-details p{ text-align: right; }

.skills .skill-details h4{ text-align: right; font-weight: bold; }

/* end our skills */

/* start testimonials */

.testimonials{ background:url('../images/home.jpg') no-repeat center center fixed ; color: #fff; }

.testimonials .test-header{ margin: 55px 0; }

.testimonials .test-header h6{ font-style: italic; font-size: 22px; }

.testimonials .test-header h2{ font-size: 37px; margin-bottom: 0; }

.testimonials .test-header p{ direction: rtl; }

.testimonials .testi-row{ margin: 50px 0; }

.testimonials .testi-row .testi-box-head div {float: right; text-align: right;}

.testimonials .testi-photo{ max-width: 100%;}

.testimonials .testi-p{ margin: 20px 0 20px; text-align: justify; font-size: 15px; direction: rtl;}

.testimonials .group-span{ padding: 13px 0 0 10px; }

.testimonials .testi-span{ display: block; font-weight: bold; }

.testimonials .testi-span2{ display: block; font-style: italic; font-size: 14px; }

/* end testimonials */

/* start our clients */

.our-clients{ overflow:hidden; margin-top: 0; width: 100%; background-color: #f9f9f9; }

.our-clients .client-img{ background:url('../images/clients-img.jpg') no-repeat center center ; }

.our-clients h6{ font-style: italic; font-size: 22px; padding-top: 30px; }

.our-clients h2{ font-size: 37px; margin-bottom: 0; }

.our-clients p{ margin: 17px 0 30px; }

.our-clients .client-row{ padding: 0; }

.our-clients img{ max-width: 80%; }

.our-clients img:hover{ opacity: 0.8; filter: alpha(opacity=80);}

/* end our clients */

/* start our team */

.our-team{ padding-bottom: 50px; background:url('../images/home.jpg') no-repeat center center fixed; color: #fff; }

.our-team .team-header{ margin: 55px 0; }

.our-team .team-header h6{ font-style: italic; font-size: 22px; }

.our-team .team-header h2{ font-size: 37px; margin-bottom: 0; }

.our-team .team{
    margin-bottom: 20px;
    background-color: #fff;
    color: #000;
    padding: 10px 10px 30px;
    text-align: center;
}

.our-team .team h4{ font-size: 18px; font-weight: bold; }

.our-team .team h5{ font-size: 13px; font-style: italic; margin-top: -6px; }

.our-team .team .team-photo{ width: 50%; margin: 20px 0; }

.our-team .team .team-list li{ display: inline-block; padding: 0 4px; color: #ffc104; cursor: pointer; }

.our-team .facebook_icon{color: #5567a9;}
.our-team .twitter_icon{color: #1da1f2;}
.our-team .instagram_icon{color: #7e3db0;}
.our-team .youtube_icon{color: #fe0000;}
.our-team .gplus_icon{color: #dc4a38;}

.our-team .facebook_icon:hover,
.our-team .twitter_icon:hover,
.our-team .instagram_icon:hover,
.our-team .youtube_icon:hover,
.our-team .gplus_icon:hover{opacity: 0.8; filter: alpha(opacity=80);}

/* end our team */

/* start our services */

.our-services{ padding: 80px 0 0; }

.our-services .services-info .services-group,
.our-services .services-info .cards-box{
    float: right;
    text-align: right;
    direction: rtl;
}

.our-services .services-info .services-group h6{ font-style: italic; font-size: 22px; }

.our-services .services-info .services-group h2{ font-size: 37px; margin-bottom: 23px; }

.our-services .services-info .services-group p{ text-align: justify; }

.our-services .services-info .services-group .services-btn {
    width: 52%;
    text-align: center;
    height: 42px;
    background-color: #ffc104;
    border: 1px solid #ffc104;
    margin-top: 20px;
    color: #FFF;
    border-radius: 30px;
    padding: 10px 10px;
    outline: none;
    font-size: 16px;
    cursor: pointer;
}

.our-services .services-info .services-btn:hover { background-color: #FFF; color: #bbbdbf; border: 1px solid #bbbdbf; }

.our-services .card{
    width: 100%;
    height: 155px;
    position: relative;
    margin:50px auto;
    border-radius: 5px;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-transition: all 750ms ease-in-out;
    -o-transition: all 750ms ease-in-out;
    transition: all 750ms ease-in-out;
}

.our-services .card > div{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #FFF;
    color: #777;
    border-radius: 5px;
    border:1px solid #ccc;
    text-align: center;
}

.our-services .card:hover{
    -webkit-transform: rotateY(-180deg);
    -ms-transform: rotateY(-180deg);
    transform: rotateY(-180deg);
}

.our-services .card .front{ -webkit-backface-visibility: hidden; backface-visibility: hidden; z-index: 2; padding-top: 19px; }

.our-services .card .back{
    z-index: 1;
    -webkit-transform: rotateY(180deg);
    -ms-transform: rotateY(180deg);
    transform: rotateY(180deg);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    padding: 20px;
}

.our-services .card .serv-img{ width: 35px; }

.our-services .card h3{ font-size: 21px; font-weight: bold; }

.our-services .card h6{ font-size: 18px; }

.our-services .ser-btn{
    display: inline-block;
    width: 200px;
    text-align: center;
    height: 42px;
    background-color: #ffc104;
    border: 1px solid #ffc104;
    margin-top: 20px;
    color: #FFF;
    border-radius: 30px;
    padding: 10px 10px;
    outline: none;
    font-size: 16px;
    cursor: pointer;
    text-decoration: none;
}

.our-services .ser-btn:hover { background-color: #FFF; color: #bbbdbf; border: 1px solid #bbbdbf; }

/* end our services */

/* start latest projects */

.latest-head{ text-align: center; }

.latest-head h4{ color: #333743; font-style: italic; }

.latest-head h2{ color: #333743; padding-bottom: 30px; }

.latest-pro .pro{ overflow: hidden; float: right;}

.latest-pro .pro img{ width: 100%; border-radius: 5px;}

.latest-pro .pro .overlay-pro{
    text-align: center;
    width: calc(100% - 30px);
    height: 100%;
    position: absolute;
    z-index: 50;
    color: transparent;
    border-radius: 5px;
}

.latest-pro .pro .overlay-pro:hover{ background-color: rgba(54, 49, 50, 0.8); color: #FFF; }

/* end latest projects */

/* start new project */

.new-pro{ margin-bottom: 45px; }

.new-pro h2{ font-size: 44px; }

.new-pro h4{ font-style: italic; }

.new-pro .pro-btn{
    display: inline-block;
    width: 200px;
    text-align: center;
    height: 42px;
    background-color: #ffc104;
    border: 1px solid #ffc104;
    margin-top: 20px;
    color: #FFF;
    border-radius: 30px;
    padding: 10px 10px;
    outline: none;
    font-size: 16px;
    cursor: pointer;
    text-decoration: none;
}

.new-pro .pro-btn:hover { background-color: #FFF; color: #bbbdbf; border: 1px solid #bbbdbf; }

/* end new project */

/* start footer */

.footer{
    font-size: 14px;
    background-color: #1d252b;
    color: #FFF;
    padding: 100px 0 50px;
    border-bottom: 2px solid #33383e;
    position: relative;
}

.footer .curve{
    content: "";
    display: block;
    position: absolute;
    left: calc(50% - 200px);
    top: -25px;
    width: 0;
    height: 0;
    border-style: solid;
    border-color: transparent #1d252b transparent rgb(29, 37, 43);
    border-width: 25px 200px;
}

.footer .shape_right{
    position: absolute;
    width: calc(50% - 200px);
    height: 27px;
    background-color: #1d252b;
    top: -25px;
    right: 0;
}

.footer .shape_left{
    position: absolute;
    width: calc(50% - 200px);
    height: 27px;
    background-color: #1d252b;
    top: -25px;
    left: 0;
}

.footer .totop_btn{
    width: 50px;
    height: 50px;
    background-color: rgb(255, 193, 4);
    border-radius: 50%;
    border: 1px solid #ffc104;
    position: absolute;
    top: -25px;
    left: calc(50% - 25px);
    cursor: pointer;
    text-align: center;
    line-height: 50px;
    font-size: 20px;
}

.footer .totop_btn:hover{
    color: #ffc104;
    background-color: #ffffff;
    border: 1px solid #ffc104;
}

.footer .wave_one,
.footer .wave_two{
    width: 50px;
    height: 50px;
    background-color: transparent;
    border: 1px solid #ffc104;
    border-radius: 50%;
    position: absolute;
    top: -25px;
    left: calc(50% - 25px);
}

.footer .wave_one{
    -webkit-animation: wave 3s ease-in-out 0s infinite  ;
    animation: wave 3s ease-in-out 0s infinite ;  
}

.footer .wave_two{
    -webkit-animation: wave 3s ease-in-out 1s infinite  ;
    animation: wave 3s ease-in-out 1s infinite ;  
}

.footer .detail{ color: #919499; }

.footer .detail ul{ padding: 0;}

.footer .detail ul li:first-of-type{ margin: 0; }

.footer h4{ margin-bottom: 25px; color: #919499; }

.footer .footer-info{background: url(../images/earth.png) no-repeat center center; -ms-background-size: contain; background-size: contain;}

.footer .footer-info,
.footer .footer-snap,
.footer .foot_logo,
.footer .small-map{
    float: right;
    text-align: right;
    direction: rtl;
}

.footer .footer-info h4{ margin-bottom: 8px; }

.footer .footer-info .row{ padding: 15px 0; border-bottom: 2px solid #33383e;}

.footer .footer-info .row div{
    float: right;
}

.footer .footer-info .row:last-child{ margin-bottom: 0; border:none; }

.footer .footer-links li{ display: inline-block; margin-right: 10px; cursor: pointer; }

.footer .foot-img-con{ padding: 0 5px; }

.footer .footer-snap img{ width: 100%; padding: 1px; margin-bottom: 10px;}

.footer .footer-snap img:hover{ opacity: 0.6; filter: alpha(opacity=60);}

.footer .foot_logo{ padding-left: 37px; }

.footer .foot_logo img{ width: 100% }

.footer .small-map #mapa{ height: 190px; border: 3px solid #575757; border-radius: 5px;}

.under-footer{ font-size: 14px; background-color: #1d252b; color: #FFF; line-height: 70px; position: relative;}

.under-footer .develope_link{ text-decoration: none; color: #fff; }

.under-footer .develope_link:hover{ color: #ffc104; }

/* end footer */

/* start oberlay loading section */

.loading-overlay{
    background-color: #FFF;
    position:fixed;
    left:0;
    top:0;
    width:100%;
    height:100%;
    z-index:99999;
}

.spinner {
    width: 70px;
    text-align: center;
    position: absolute;
    top: calc(50% - 23.2px);
    left: calc(50% - 35px);
}

.spinner > div {
  width: 18px;
  height: 18px;
  background-color: #333;

  border-radius: 100%;
  display: inline-block;
  -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
  animation: sk-bouncedelay 1.4s infinite ease-in-out both;
}

.spinner .bounce1 { -webkit-animation-delay: -0.32s; animation-delay: -0.32s; }

.spinner .bounce2 { -webkit-animation-delay: -0.16s; animation-delay: -0.16s; }

.loading-overlay .spinner-logo{
    position: absolute;
    left: calc(50% - 93.5px);
    top: calc(50% - 50px);
    -webkit-animation: flashing_logo 5s ease-in-out 0s infinite alternate ;
    animation: flashing_logo 5s ease-in-out 0s infinite alternate;
}

/* end oberlay loading section */

/* end index page */

/*===================================================================================================*/

/*----------------------------------start contact us page-------------------------------------*/

#map { height: 400px; width: 100%; }

.contact_con{ overflow: hidden; }

.contact_header{ width: 100%; height: 500px; background:url('../images/contact/contact_header.jpg') no-repeat center center fixed ; }

.custom-control{
    margin-bottom: 15px;
    border-radius: 20px;
    height: 40px;
    padding-left: 30px;
}

.custom-textarea{
    height: 117px;
    border-radius: 20px;
    margin-bottom: 15px;
    resize: none;
    padding-left: 30px;
}

.custom-control:focus,
.custom-textarea:focus {
    border-color: #ffc104;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgb(255, 193, 4);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgb(255, 193, 4);
}

.contact-btn{
    display: inline-block;
    width: 130px;
    text-align: center;
    height: 42px;
    background-color: #ffc104;
    border: 1px solid #ffc104;
    margin-top: 20px;
    margin-bottom: 22px;
    color: #FFF;
    border-radius: 30px;
    padding: 10px 10px;
    outline: none;
    font-size: 16px;
    cursor: pointer;
}

.contact-btn:hover{ background-color: #FFF; color: #bbbdbf; border: 1px solid #bbbdbf; }

.contact-info{ margin: 40px 0; }

.contact-info .form-box,
.contact-info .info,
.contact-info .info .row div{
    float: right;
    direction: rtl;
}

.contact-info .form-group{ margin-bottom: 0; position: relative; }

.contact-info .form-group .astrisk{
    position: absolute;
    height: 0;
    left: 20px;
    top: 10px;
    font-size: 22px;
    color: #ffc104;
}

.contact-info h3{ margin: 0 0 30px 2px;}

.contact-info .info .row{ padding: 15px 0; border-bottom: 1px solid #e4e5e5; }

.contact-info .info .row:first-of-type{ padding: 0px 0 15px ;}

.contact-info .info .row:last-child{ margin-bottom: 0; border:none; }

.contact-info .contact-links{ padding: 0 }

.contact-info .contact-links li:first-of-type{margin:0}

.contact-info .contact-links li{ display: inline-block; margin-right: 10px; cursor: pointer;}

.custom-alert{
    border-radius: 21px;
    line-height: 30px;
    padding: 15px 35px 15px 20px;
}

.custom-alert-two{
    color: #c61a1a;
    padding-left: 14px;
    margin-top: -10px;
    margin-bottom: 6px;
    font-size: 15px;
    display: none;
}

.custom-alert-three{
    color: #c61a1a;
    padding-left: 14px;
    margin-top: -10px;
    margin-bottom: 6px;
    font-size: 15px;
    display: none;
}

.custom-alert-four{
    color: #c61a1a;
    padding-left: 14px;
    margin-top: -10px;
    margin-bottom: 6px;
    font-size: 15px;
    display: none;
}

.success-span{
    color: #103897;
    font-size: 17px;
    background-color: #ffc104;
    border-radius: 7px;
    padding: 3px 33px 3px 13px;
}

.suc-close{ margin-top: 4px; }

/*----------------------------------start career page-------------------------------------*/

.career_con{ overflow: hidden; }

.career_header{ width: 100%; height: 500px; background:url('../images/contact/employee.jpg') no-repeat center center fixed ; }

.career-info{ margin: 40px 0; }

.career-info .career-box{ float: right; direction: rtl; }

.career-info .career-box p{ margin: 0 0 43px; text-align: justify; font-size: 17px; font-weight: bold;}

.career-info h3{ margin: 0 0 30px 2px; }

.career-info .form-group { margin-bottom: 0; position: relative; }

.career-info .form-group .astrisk {
    position: absolute;
    height: 0;
    left: 20px;
    top: 10px;
    font-size: 22px;
    color: #ffc104;
}

.emp_file:focus{ outline: none !important;}

.emp_file{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    padding: 9px 0 0 78px;
    opacity: 0;
    filter: alpha(opacity=0);
}

.custom_file{
    position: relative;
    margin-bottom: 15px;
    border-radius: 20px;
    height: 40px;
    padding-right: 30px;
    display: block;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}

.custom_file .upload-btn {
    color: #ffffff;
    background-color: #ffc104;
    padding: 10px 40px 9px 40px;
    border-radius: 0px 20px 20px 0px;
    display: inline-block;
    position: absolute;
    right: -1px;
    top: 0;
    cursor: pointer;
}

.custom_file .upload-btn:hover { background-color: #efbd24;}

.custom_file .upload-name{
    color: #f00;
    padding-top: 5px;
    display: inline-block;
    position: absolute;
    right: 190px;
    top: 0;
    height: 90%;
    overflow: hidden;
    width: calc(100% - 230px);
    border: none;
    outline: none;
    background-color: transparent;
} 

/*----------------------------------start about page-------------------------------------*/

.about_con{ overflow: hidden; }

.about_header{ width: 100%; height: 500px; background:url('../images/contact/tools3.jpg') no-repeat center center fixed ; }

.aboutus{ background-color: #ecedef; padding-top: 40px; }

.aboutus .arrow{ text-align: center; color: #deaa0b; }

.aboutus h2{
    text-align: center;
    font-size: 50px;
    font-weight: 200;
    color: #333;
    margin: 0 45px;
}

.aboutus .icon_divider_two,
.aboutus .icon_divider{
    display: block;
    margin: 10px auto 19px auto;
}

.about_overlay{ width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.71); }

.aboutus .cols{ overflow: hidden; padding: 0; float: right; }

.aboutus .about-words p{
    font-size: 20px;
    margin: 0 50px 50px;
    text-align: justify;
    direction: rtl;
    font-weight: bold;
}

.mission-details span{
    color: #fac855;
    font-size: 20px;
    display: block;
    text-align: center;
    padding-top: 25px;
}

.aboutus .mission-details .mission_one,
.aboutus .mission-details .mission_two,
.aboutus .mission-details .mission_three{
    height: 640px;
    padding:0;
}

.aboutus .mission_one{
    background:url('../images/contact/mission1.jpg') no-repeat center center ;
}

.aboutus .mission_two{
    background:url('../images/contact/mission2.jpg') no-repeat center center ;
}

.aboutus .mission_three{
    background:url('../images/contact/mission3.jpg') no-repeat center center ;
}

/*----------------------------------start management page-------------------------------------*/

.manage_con{ overflow: hidden; }

.manage_header{ width: 100%; height: 500px; background:url('../images/contact/manage.jpg') no-repeat center center fixed ; }

.manage{ background-color: #ecedef; padding-top: 27px; }

.manage .arrow{ text-align: center; color: #deaa0b; }

.manage h2{
    text-align: center;
    font-size: 50px;
    font-weight: 200;
    color: #333;
    margin: 0 45px;
}

.manage .icon_divider_two,
.manage .icon_divider{
    display: block;
    margin: 10px auto 19px auto;
}

.manage_overlay{
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.71);
    position: absolute;
    top: 0;
    left: 0;
}

.manage-details span{
    color: #fac855;
    font-size: 20px;
    display: block;
    text-align: center;
    padding-top: 25px;
}

.manage-details p{
    color: #fff;
    padding: 0 30px;
    text-align: justify;
    direction: rtl;
    text-align: center;
}

.manage .manage-details .manage_one,
.manage .manage-details .manage_two,
.manage .manage-details .manage_three,
.manage .manage-details .manage_four,
.manage .manage-details .manage_five,
.manage .manage-details .manage_six{
    height: 600px;
    padding:0;
}

.manage .cols{ overflow: hidden; padding: 0; float: right; }

.manage .manage_one{
    background:url('../images/contact/design.jpg') no-repeat center center ;
}

.manage .manage_two{
    background:url('../images/contact/deploye.jpg') no-repeat center center ;
}

.manage .manage_three{
    background:url('../images/contact/control.jpg') no-repeat center center ;
}

.manage .manage_four{
    background:url('../images/contact/measure.jpg') no-repeat center center ;
}

.manage .manage_five{
    background:url('../images/contact/review.jpg') no-repeat center center ;
}

.manage .manage_six{
    background:url('../images/contact/improve.jpg') no-repeat center center ;
}

/*----------------------------------start projects page-------------------------------------*/

.projects_con{ overflow: hidden; }

.projects_header{ width: 100%; height: 500px; background:url('../images/contact/projects.jpg') no-repeat center center fixed ; }

.projects{ background-color: #ecedef; padding-top: 27px; }

.projects .arrow{ text-align: center; color: #deaa0b; }

.projects h2{
    text-align: center;
    font-size: 50px;
    font-weight: 200;
    color: #333;
    margin: 0 45px;
}

.projects .icon_divider_two,
.projects .icon_divider{
    display: block;
    margin: 10px auto 19px auto;
}

.projects_overlay{
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.71);
    position: absolute;
    top: 0;
    left: 0;
}

.projects-details span{
    color: #fac855;
    font-size: 20px;
    display: block;
    text-align: center;
    padding-top: 25px;
}

.projects-details p{ color: #fff; padding: 0 30px; text-align: justify; }

.projects .projects-details .project_one,
.projects .projects-details .project_two,
.projects .projects-details .project_three,
.projects .projects-details .project_four,
.projects .projects-details .project_five,
.projects .projects-details .project_six{
    height: 600px;
    padding:0;
}

.projects .cols{ overflow: hidden; padding: 0; float: right; }

.projects .project_one{
    background:url('../images/contact/pro1.jpg') no-repeat center center ;
}

.projects .project_two{
    background:url('../images/contact/pro2.jpg') no-repeat center center ;
}

.projects .project_three{
    background:url('../images/contact/pro3.jpg') no-repeat center center ;
}

.projects .project_four{
    background:url('../images/contact/pro4.jpg') no-repeat center center ;
}

.projects .project_five{
    background:url('../images/contact/pro5.jpg') no-repeat center center ;
}

.projects .project_six{
    background:url('../images/contact/pro6.jpg') no-repeat center center ;
}

/*----------------------------------start services page-------------------------------------*/

.services_con{ overflow: hidden; }

.services_header{ width: 100%; height: 500px; background:url('../images/contact/services.jpg') no-repeat center center fixed ; }

.servi_overlay{
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.71);
    position: absolute;
    top: 0;
    left: 0;
}

.services{ background-color: #ecedef; padding-top: 27px; }

.services .services-title{ margin-bottom: 18px; }

.services .arrow{ text-align: center; color: #deaa0b; }

.services h2{
    text-align: center;
    font-size: 50px;
    font-weight: 200;
    color: #333;
    margin: 0 45px;
}

.ser_cols{ float: right; }

.services .icon_divider_two { display: block; margin: 10px auto 19px auto; }

.services .serv_icon{ width: 40px; padding: 55px 0; }

.services p { padding: 10px; }

.services .serv_span{ position: absolute; bottom: 20px; left: calc(50% - 9.2px); }

.services .servone_img_one,
.services .servone_img_two,
.services .servtwo_img,
.services .servthree_img_one,
.services .servthree_img_two{
    padding: 0;
}

.services .servone_img_one .image_one,
.services .servone_img_two .image_two,
.services .servtwo_img,
.services .servthree_img_one .image_one,
.services .servthree_img_two .image_two{
    height: 600px;
    padding:0;
}

.services .servone_img_one .image_one{ background:url('../images/contact/ser1.jpg') no-repeat center center ; }

.services .servone_img_two .image_two{ background:url('../images/contact/ser2.jpg') no-repeat center center ; }

.services .servone_details{ text-align: center; height: 600px; }

.services .servtwo_details_one{ text-align: center; height: 600px; }

.services .servtwo_img{ background:url('../images/contact/ser3.jpg') no-repeat center center ; }

.services .servtwo_details_two{ text-align: center; height: 600px; }

.services .servthree_img_one .image_one{ background:url('../images/contact/ser4.jpg') no-repeat center center ; }

.services .servthree_img_two .image_two{ background:url('../images/contact/ser5.jpg') no-repeat center center ; }

.services .servthree_details{ text-align: center; height: 600px; }

/*===================================================================================================*/
/*===========================================media query=============================================*/
/*===================================================================================================*/

/*****************/
/* large screen */
/*****************/

@media (min-width:992px) and (max-width: 1199px) { 

    .footer .footer-info .row { padding: 12px 0; }

    .footer .detail { font-size: 12px; }

    .our-services .card h6 { font-size: 14px; }

    .testimonials .testi-row .testi-box-head div{ padding-top: 0; }

    .footer .small-map #mapa{ height: 160px; }

}


/*****************/
/* small screen */
/*****************/

@media(min-width:768px) and (max-width:991px) {

    /* start header */ 

    .upper-bar, .menu .menu-links, .langs-icon{ display: none ; }

    .menu{ padding: 7px !important; }

    .toggle-button{ display: block !important; }

    .full-menu ul li { padding-top: 0; }

    .full-menu ul li a { padding-bottom: 2px; font-size: 30px; }

    .lang_form {margin: 5px 40px 0;}

    /* end header */

    /* start slider */ 

    .aslider .slogen-head{ font-size: 40px;}

    .aslider .slogen{ font-size: 36px; }

    /* end slider */

    /* start skills */

    .skills .skill-info .row div{ margin-left: -80px; }

    /* end skills */

    /* start testimonials */

    .testimonials .testi-row .testi-box-head div { float: none; text-align: center; }

    .testimonials .group-span, .testimonials .testi-row .col-md-3, .testimonials .testi-p{ text-align: center; }

    .testimonials .testi-p {font-size: 13px;}


    /* end testimonials */

    /* start services */

    .our-services .services-info .services-group{float: none; text-align: center;}

    .our-services .services-group{ text-align: center; }

    .our-services .services-info .services-btn{ margin: 22px auto 0 }

    .our-services .card h6 { font-size: 14px; }

    /* end services */

    /* start project */

    .latest-pro .pro { margin-bottom: 20px; }

    /* end project */

    /* start footer */

    .footer .foot_logo img {width: 80%;}

    .footer .small-map #mapa{ height: 240px; }

    .under-footer { line-height: 30px; text-align: center; padding: 10px 0; }

    .under-footer span{ float: none !important; margin:auto; }

    .under-footer .develope_link{float: none !important;}

    /* end footer */

    /*************************contact page******************************************/

    .contact-info .form-box, .contact-info .info{float: none !important;}

    /*************************about page******************************************/

    .aboutus .cols{ float: none !important; }

    /*************************projects page******************************************/

    .projects .cols{ float: none !important; }

    /*************************manage page******************************************/

    .manage .cols{ float: none !important; }

    /*************************services page******************************************/

    .ser_cols{ float: none !important; }

}

/**************************/
/* mobile screen portrait */
/**************************/

@media(min-width:481px) and (max-width:767px){
  
/* start header */ 

    .upper-bar, .menu .menu-links, .langs-icon{ display: none; }

    .menu{ padding: 7px !important; }

    .toggle-button{ display: block !important; }

    .full-menu ul li { padding-top: 0; }

    .full-menu ul li a { padding-bottom: 2px; font-size: 30px; }

    .lang_form {margin: 5px 40px 0;}

/* end header */ 

/* start slider */ 

    .aslider .slogen-head{ font-size: 40px;}

    .aslider .slogen{ font-size: 36px; }

/* end slider */

/* start windows */

    .windows img { margin: auto; }

    .windows h4 { text-align: center; font-size: 16px; }

    .windows p{ text-align: center; font-size: 14px; }

    .windows .window-btn{ display: block; width: 60%; margin: 15px auto; padding: 6px 0;  font-size: 14px;}

    .windows .window-three p{ margin-bottom: 10px; }

    .windows .window-one, .windows .window-two, .windows .window-three{float: none;}

/* end windows */

/* start skills */

    .skills .skill-info{ padding: 20px 50px; }

    .skills .skill-details h4, .skills .skill-details p { text-align: center; }

    .skills .skill-info .row div {float: none; text-align: center;}

/* end skills */

/* start testimonilas */

    .testimonials .testi-photo { width: 30%; }

    .testimonials .testi-row { text-align: center; }

    .testimonials .testi-p { text-align: center; padding-bottom: 20px; }

    .testimonials .testi-row .testi-box-head div {float: none; text-align: center;}

/* end testimonilas */

/* start clients */

    .our-clients .client-info { padding: 0 25px; }

/* end clients */

/* start team */

    .our-team .team-header { margin: 55px 0px 20px; }

    .our-team .team-header h2 { font-size: 26px; }

    .our-team .team { width: 80%; margin: 20px auto; color: #000; padding: 10px; text-align: center; }

    .our-team .team ul{ font-size: 22px; margin-top: 50px; }

/* end team */

/* start services */

    .our-services { padding: 40px 0 0; }

    .our-services .services-info .services-btn{ margin: 20px auto; }

    .our-services .services-info .services-group{ text-align: center; }

/* end services */

/* start projects */

    .latest-pro .pro { margin: 20px 0; }

    .new-pro h2 { font-size: 25px; }

/* end projects */

/* start footer */

    .footer h4{ text-align: center; }

    .footer .footer-info .row { font-size: 18px; }

    .footer .footer-snap { margin-bottom: 30px; }

    .footer .footer-snap img { margin: 0 auto 20px; }

    .footer .foot_logo { margin-bottom: 0; font-size: 18px; }

    .under-footer { line-height: 30px; text-align: center; padding: 10px 0; }

    .under-footer span{ float: none !important; margin:auto; }

    .under-footer .develope_link{float: none !important;}

/* end footer */

    /*************************contact page******************************************/

    .contact-info .form-box, .contact-info .info{float: none !important;}


    /*************************about page******************************************/

    .aboutus .cols{ float: none !important; }

    /*************************projects page******************************************/

    .projects .cols{ float: none !important; }

    /*************************manage page******************************************/

    .manage .cols{ float: none !important; }

    /*************************services page******************************************/

    .ser_cols{ float: none !important; }

}


/**************************************************************************************************************/
/**************************/
/* mobile screen portrait */
/**************************/

@media screen and (max-width: 480px){
  
/* start header */ 

    .upper-bar, .menu .menu-links, .langs-icon{ display: none; }

    .menu{ padding: 7px !important; }

    .toggle-button{ display: block !important; }

    .full-menu ul li { padding-top: 0; }

    .full-menu ul li a { padding-bottom: 2px; font-size: 30px; }

    .lang_form {margin: 5px 40px 0;}

/* end header */ 

/* start slider */ 

    .aslider .slogen-head{ font-size: 40px; }

    .aslider .slogen{ font-size: 35px; }

/* end slider */

/* start windows */

    .windows .window-btn{ display: block; width: 35%; margin: 15px auto; padding: 6px 0; }

    .windows p{ text-align: center;}

    .windows .window-three p{ margin-bottom: 32px; }

    .windows h4 {text-align: center ;}

/* end windows */

/* start skills */

    .skills .skill-info{ padding: 20px 50px; }

    .skills .skill-details h4, .skills .skill-details p { text-align: center; }

    .skills .skill-info .row div{float: none; text-align: center;}

/* end skills */

/* start testimonilas */

    .testimonials .testi-photo { width: 30%; }

    .testimonials .testi-row { text-align: center; }

    .col-xxs { width: 100%; }

    .testimonials .testi-p { text-align: center; padding-bottom: 20px; }

    .testimonials .testi-row .testi-box-head div{float: none; text-align: center;}

/* end testimonilas */

/* start clients */

    .our-clients .client-info { padding: 0 25px; }

/* end clients */

/* start team */

    .our-team .team-header { margin: 55px 0px 20px; }

    .our-team .team-header h2 { font-size: 26px; }

    .our-team .team { width: 80%; margin: 20px auto; color: #000; padding: 10px; text-align: center; }

    .our-team .team ul{ font-size: 22px; margin-top: 50px; }

/* end team */

/* start services */

    .our-services { padding: 40px 0 0; }

    .our-services .services-info .services-btn{ margin: 20px auto; }

    .our-services .services-info .services-group{ text-align: center; }

/* end services */

/* start projects */

    .latest-pro .pro { margin: 20px 0; }

    .new-pro h2 { font-size: 25px; }

/* end projects */

/* start footer */

    .footer h4{ text-align: center; }

    .footer .footer-info .row { font-size: 18px; }

    .footer .footer-snap { margin-bottom: 30px; }

    .footer .footer-snap img { margin: 0 auto 20px; }

    .footer .foot_logo { padding: 0 35px; margin-bottom: 50px; font-size: 18px; }

    .footer .small-map #mapa{ height: 240px; }

    .under-footer { line-height: 30px; text-align: center; padding: 10px 0;}

    .under-footer span{ float: none !important; margin:auto; }

    .under-footer .develope_link{float: none !important;}

/* end footer */

    /*************************career page******************************************/

    .custom_file .upload-btn{ padding: 10px 15px 9px 10px !important; }

    .custom_file .upload-name { right: 130px !important; width: calc(100% - 160px) !important; }

    /*************************contact page******************************************/

    .contact-info .form-box,
    .contact-info .info{
        float: none !important;
    }

    .contact-info .info .row div{ float: right !important; }

    /*************************about page******************************************/

    .aboutus .cols{ float: none !important; }

    .aboutus .about-words p { font-size: 18px !important; margin: 0 30px 50px !important; }

    /*************************projects page******************************************/

    .projects .cols{ float: none !important; }

    /*************************manage page******************************************/

    .manage .cols{ float: none !important; }


    /*************************services page******************************************/

    .ser_cols{ float: none !important; }

    .services p { font-size: 13px !important; }
}

/*===================================================================================================*/
/*=======================================animate mothions============================================*/

@-webkit-keyframes flashing_logo {
  from, 50%, to {
    opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transform: scale(1);
            transform: scale(1);
  }

  25%, 75% {
    opacity: 0.8;
    filter: alpha(opacity=80);
    -webkit-transform: scale(1.04);
            transform: scale(1.04);
  }
}

@keyframes flashing_logo {
  from, 50%, to {
    opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transform: scale(1);
            transform: scale(1);
  }

  25%, 75% {
    opacity: 0.8;
    filter: alpha(opacity=80);
    -webkit-transform: scale(1.04);
            transform: scale(1.04);
  }
}

/**********************************************************/

@-webkit-keyframes flashing_scroll {
  0%{
    -webkit-transform:translate3d(0,0,0);
            transform:translate3d(0,0,0);
    }

  100%{
    -webkit-transform:translate3d(0,150%,0);
            transform:translate3d(0,150%,0);
    }
}

@keyframes flashing_scroll {
  0%{
    -webkit-transform:translate3d(0,0,0);
            transform:translate3d(0,0,0);
    }

  100%{
    -webkit-transform:translate3d(0,150%,0);
            transform:translate3d(0,150%,0);
    }
}

/*===================================================================================================*/

@-webkit-keyframes zoomin {
  from, 50%, to {
    -webkit-transform: scale(1);
            transform: scale(1);
  }

  25%, 75% {
    -webkit-transform: scale(1.1);
            transform: scale(1.1);
  }
}

@keyframes zoomin {
  from, 50%, to {
    -webkit-transform: scale(1);
            transform: scale(1);
  }

  25%, 75% {
    -webkit-transform: scale(1.1);
            transform: scale(1.1);
  }
}

/*===================================================================================================*/

@-webkit-keyframes sk-bouncedelay {
  0%, 80%, 100% { 
    -webkit-transform: scale(0); 
            transform: scale(0);
  } 40% { 
    -webkit-transform: scale(1.0); 
            transform: scale(1.0);
  }
}

@keyframes sk-bouncedelay {
  0%, 80%, 100% { 
    -webkit-transform: scale(0); 
            transform: scale(0);
  } 40% { 
    -webkit-transform: scale(1.0); 
            transform: scale(1.0);
  }
}

/*===================================================================================================*/

@-webkit-keyframes wave {
  0% {
            -webkit-transform: scale(1);
                    transform: scale(1);
            opacity: 1;
            filter: alpha(opacity=100);
  }

  100% {
            -webkit-transform: scale(1.8);
                    transform: scale(1.8);
            opacity: 0;
            filter: alpha(opacity=0);
  }
}
@keyframes wave {
  0% {
            -webkit-transform: scale(1);
                    transform: scale(1);
            opacity: 1;
            filter: alpha(opacity=100);
  }

  100% {
            -webkit-transform: scale(1.8);
                    transform: scale(1.8);
            opacity: 0;
            filter: alpha(opacity=0);
  }
}

/*===================================================================================================*/
/*===================================================================================================*/