/* ************************************************
 @project                   : KIAAI
 @company                   : Larsa LLC
 @year                      : 2017
 @frontend developer        : Hiba Almanakly
 @createdDate               : June, 2017
 ************************************************ */
 


 
 
body{
    
    background:url(https://kiaai.ae/sites/all/themes/kiaai/images/backg.png) !important;
    background-repeat:no-repeat !important;
    background-attachment:fixed !important;
    background-size:cover !important;
    
} 



.android, .ios{
  cursor:pointer;  
    
}
.android_box,.ios_box{
    
    width:100%;position:fixed;background:#fff;z-index:100000000000000000000;top:0;left:0;display:none;height:100%;

    
}

.android_close_btn, .ios_close_btn{
    
    width:30px;
    height:30px;
    position:absolute;
    right:20px;
    top:20px;
    background:url(https://kiaai.ae/sites/all/themes/kiaai/images/close-btn.png);
    background-repeat:no-repeat;
    background-position:center center;
    background-size:contain;
    cursor:pointer;
}




#floating_icons{
    
    position:fixed;bottom:5px;left:50%;transform:translateX(-50%);width:80%;z-index: 10000;display:none;
}

.js-tilt{
    
    cursor:pointer;
    
}
 
 .row-centered {
    text-align:center;
}
.col-centered {
    display:inline-block;
    float:none;
    /* reset the text-align */
    text-align:left;
    /* inline-block space fix */
    margin-right:-4px;
    text-align: center;
  
 
}

.overlay_bg{
  
  width:100%;height:100%;position:fixed;background:rgba(0,0,0,0.5);z-index:10000;top:0;left:0;display:none; 
    
}
.sdg_content{
   
   position:fixed;
   width:100%;
   height:100%;
   background:#fff;
   z-index:1000000000;
   top:0;
   left:0;
   display:none;
 
}

.sdg_wrapper{
    

   float:left;
  font-family:creg !important;
  
    
}
.closesdg{
    
    position:absolute;
    right:20px;
    top:20px;
    width:30px;
    height:30px;
   background:url(https://kiaai.ae/sites/all/themes/kiaai/images/close-btn.png);
   background-size:contain;
   background-repeat:no-repeat;
    z-index:10;
    cursor:pointer;
}
.sdg_header_ar h2,.sdg_header_ar h3{
    
  text-align:center;  
    
}
.sdg_header_ar h2{
    
    color:red;
    font-weight:bold;
}

.row-centered .col-sm-3{
    
    padding:0;
    
}
.search-icon{
    
    margin-top:-25px;
}
 
span.filterBy {
    background: url(../images/select-arrow.png) no-repeat 94% center/15px auto #fff;
}
.ar{
    direction: rtl;
}
body.ar .container{
    font-family: gelight !important;
}
.ar .contactinfo,
.ar .faqdetails{
    font-family: gelight, clight2;
}
.ar .poster .headerimage{
    background-position: 0% 100%;
}

.ar .leftimage2 {
    border: 1px solid #e8e8e8;
}
.ar .logo,
.ar .menucontainer,
.ar .menu,
.ar .leftsection{
    float: right;
    text-align: right;
}
.ar .leftsection{
    margin: 5vw 10% 0 0%;
    padding-left: 6%;
}
.ar .ulsubmenu{
    left: auto;
    right: 1vw;
}
.ar .menu{
    font-family: gelight;
}
.ar .menuli{
    border-right: none;
    border-left: 1px solid black;
    margin: 0 0.5%;
    padding: 0 1.2%;
}
.ar .menuli:before,
.ar .lisubmenu:before{
    display: none;
}
.ar .memberblock2 {
    padding: 3% 25% 0% 0%;
}
.ar .about {
    padding: 18% 10% 4% 4%;
}
.ar .pageimageoverlayleft {
    -o-transform:rotateY(180deg) !important;
    -ms-transform:rotateY(180deg) !important;
    -webkit-transform: rotateY(180deg) !important;
    -moz-transform: rotateY(180deg) !important;
    transform: rotateY(180deg) !important;
    left: initial;
    right: 0;
}
.ar .pageimageoverlayright{
    -o-transform:rotateY(180deg) !important;
    -ms-transform:rotateY(180deg) !important;
    -webkit-transform: rotateY(180deg) !important;
    -moz-transform: rotateY(180deg) !important;
    transform: rotateY(180deg) !important;
    right: initial;
    left: 0;
}
.ar .centertitleicon {
    padding-right: 0;
    padding-left: 3%;
    margin-right: 3%;
}
.ar .centertitleicon,
.ar .centertitle{
    vertical-align: middle;
}
.ar .centerdesc {
    padding: 0;
}
.ar .centerdesc2 {
    padding: 0% 5% 5%;
}
.ar .footerimage{
    -o-transform:rotateY(180deg);
    -ms-transform:rotateY(180deg);
    -webkit-transform: rotateY(180deg);
    -moz-transform: rotateY(180deg);
    transform: rotateY(180deg);
}
.ar .footercol1 {
    margin-left: 13%;
    margin-right: 0;
}
.ar .footercol2 {
    margin: 5vw 0 0 8%;
}
.ar .footercol3-1 {
    margin: 0 0 5% 17%;
}
.ar .footersearch1{
    overflow: hidden;
}
.ar .footersearch2:after {
    right: initial;
    left: 0;
}
.ar .social{
    text-align: left;
}
.ar .sidebartitle:before {
    -webkit-animation: toright2 0.4s ease-in-out forwards;
    -moz-animation: toright2 0.4s ease-in-out forwards;
    animation: toright2 0.4s ease-in-out forwards;
    left: initial;
    right: 0;
    top: -5px;
}
.ar .sidebarcontent:hover .sidebartitle:before{
    -webkit-animation: toleft2 0.4s ease-in-out forwards;
    -moz-animation: toleft2 0.4s ease-in-out forwards;
    animation: toleft2 0.4s ease-in-out forwards;
}
.ar .timing_sec .sidebartitle.margin2{
    margin-right: 12%;
    margin-left: 0;
}
.ar span.box_title {
    line-height: normal;
    min-height: auto;
    margin-bottom:15px;
}
.ar .boxes_section .leftimage{
        float: right;
    margin-left: 3%;
    margin-right: 0;
}
.ar .timing_sec{
     background: url(../images/timing.png);
}
@-webkit-keyframes toright2 {
    0%{
        width: 50%;
        right: 50%;
    }
    50%{
        width: 100%;
        right:0%;
    }
    100%{
        width: 4.5vw;
        right:0%;
    }
}

@-moz-keyframes toright2 {
    0%{
        width: 50%;
        right:50%;
    }
    50%{
        width: 100%;
        right:0%;
    }
    100%{
        width: 4.5vw;
        right:0%;
    }
}
@keyframes toright2 {
    0%{
        width: 50%;
        right:50%;
    }
    50%{
        width: 100%;
        right:0%;
    }
    100%{
        width: 4.5vw;
        right:0%;
    }
}
@-webkit-keyframes toleft2 {
    0%{
        width: 4.5vw;
        right:0%;
    }
    50%{
        width: 100%;
        right:0%;
    }
    100%{
        width:50%;
        right:50%;
    }
}
@-moz-keyframes toleft2 {
    0%{
        width: 4.5vw;
        right:0%;
    }
    50%{
        width: 100%;
        right:0%;
    }
    100%{
        width: 50%;
        right:50%;
    }
}
@keyframes toleft2 {
    0%{
        width: 4.5vw;
        right:0%;
    }
    50%{
        width: 100%;
        right:0%;
    }
    100%{
        width: 50%;
        right:50%;
    }
}

.ar .leftimagebar{
    margin-left: 3%;
    margin-right: 0;
}
.ar .leftimagebar2{
    margin-left: 2%;
    margin-right: 0;
}
.ar .leftimagebar4 {
    margin: 0 17% -8% 2%;
}
.ar .arleftimagebar{
    -o-transform:none;
    -ms-transform:none;
    -webkit-transform: none;
    -moz-transform:none;
    transform:none;
}
.ar .clipart{
    -moz-clip-path: polygon(0 10%, 100% 0%, 100% 90%, 0% 100%);
    -webkit-clip-path: polygon(0 10%, 100% 0%, 100% 90%, 0% 100%);
    clip-path: polygon(0 10%, 100% 0%, 100% 90%, 0% 100%);
}
.ar .clipartnews{
    -moz-clip-path: polygon(0 20%, 100% 0%, 100% 80%, 0% 100%);
    -webkit-clip-path: polygon(0 20%, 100% 0%, 100% 80%, 0% 100%);
    clip-path: polygon(0 20%, 100% 0%, 100% 80%, 0% 100%);
}

.ar .memberauther {
    margin-right: -25%;
    margin-left: -25%;
    text-align:center;
}
.ar .magazineimage {
    margin-left: 3.2vw;
    margin-right: 0;
}
.ar .magazineimage:nth-child(6) {
    margin-left: 0;
}
.ar .sectiontitle5{
    text-align: right;
}
.ar .sectiontitle{
    width: 100%;
}
.ar .contactcontainer input,
.ar .contactcontainer select,
.ar .contactcontainer textarea{
    margin: 0.5vw 0vw 0.5vw 1vw;
    float: right;
}
.ar .contactcontainer textarea {
    float: none !important;
}
.ar .publishedimage{
    margin-right: 0;
    margin-left: 3vw;
}
.ar .publishedimage:nth-child(3n+4) {
    margin-left: 0;
}
.ar .winnermainslider .publishedimage:nth-child(2n+3){
    margin-left: 0;
}

.ar .newstitle {
    width: 100%;
    margin: 2vw 0 2vw;
}
.ar .newsimage3 {
    margin: 0 4% 2%;
    width: 40%;
    display: inline-block;
}
.ar .rightcontent {
    margin-top: 6vw;
}

.ar .newspagecontent{
    margin: 6% 10%;
}


.ar .newspagecontent .clipart {
    -moz-clip-path: none;
    -webkit-clip-path:none;
    clip-path:none;
}
.ar .formcontainer input,
.ar .formcontainer select{
    text-align: right;
}
.ar .mainimage {
    width: 40%;
    margin: 5% 30% 2%;
}

/* slider style*/

.main__slider
{
    height: 100%;
    width:100%;
    position: relative;
}
.image_slide {
    position: absolute;
    background-size: cover;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    opacity: 0;
    z-index: 1;
    -webkit-transition: opacity ease-in-out 1s,transform ease-in-out 1s;
    -moz-transition: opacity ease-in-out 1s,transform ease-in-out 1s;
    -ms-transition: opacity ease-in-out 1s,transform ease-in-out 1s;
    -o-transition: opacity ease-in-out 1s,transform ease-in-out 1s;
    transition: opacity ease-in-out 1s,transform ease-in-out 1s;
    background-position: 0 100%;
    transform: scale(1.05);
}
.showing
{

    opacity: 1;
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -webkit-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}

.controls {
    display: none;
}
.nav_button
{
    position: absolute;
    top:50%;
    -moz-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width:60px;
    height:60px;
    background-size: 16px 34px;
    background-position: center center;
    background-repeat: no-repeat;
    cursor: pointer;
    z-index: 8;
}
.left_nav_button{
    left:0;
    background-image: url(../images/left_nav_button.png);
}
.right_nav_button
{
    right: 0;
    background-image: url(../images/right_nav_button.png);
}

.pgenation
{
    position: absolute;
    top:50%;
    right:80px;
    -moz-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 20;
}
.pgenation a
{
    width: 8px;
    height: 8px;
    border: solid 1px #b1abab;
    background: #b1abab;
    border-radius: 100%;
    margin: 2.5vw auto;
    position: relative;
    display: block;
    cursor: pointer;

}
.pgenation a:after{
    content: "";
    width: 8px;
    height: 8px;
    position: absolute;
    top: 0;
    left: 0;
    border: solid 1px #b1abab;
    border-radius: 100%;
    -moz-transition: all ease-in-out 0.3s;
    -webkit-transition: all ease-in-out 0.3s;
    -ms-transition: all ease-in-out 0.3s;
    -o-transition: all ease-in-out 0.3s;
    transition: all ease-in-out 0.3s;
    box-sizing: border-box;
}
.pgenation a.active:after{
    content: "";
    width: 18px;
    height: 18px;
    position: absolute;
    top: -5px;
    left: -5px;

}
.caption{
    line-height: 2;
    margin: auto;
    display: block;
    text-align: right;
    margin-top: 29.7%;
    margin-right: 16.5%;
    width: 82%;
}
.caption h1{
    font-size: 200%;
    color: #b1abab;
    line-height: 1.5;
    animation-duration: 2s;
}
.caption h2{
    color: #000;
    animation-duration: 2.3s;
}
.caption p{
    color: #000;
    animation-duration: 2.6s;
}
.caption a{
    color: #fff;
    display: inline-block;
    padding: 15px 40px;
    background-color: #282828;
    line-height: 1;
    letter-spacing: 1.2px;
    cursor: pointer;
    margin-top: 2%;
    padding-bottom: 18px;
    animation-duration: 2.9s;
}
._section
{
    width:60%;
    float:right;
}
.home_section{
    overflow: hidden;
    position: relative;
}

.main__slider .image_slide:first-child .caption
{

}
.main__slider .image_slide:first-child .caption h1,
.main__slider .image_slide:first-child .caption div:nth-child(1),
.main__slider .image_slide:first-child .caption div:nth-child(2)
{
    font-family: cblack;
    text-transform: uppercase;
    color: #25282b;  
}

.main__slider .image_slide:first-child .caption p,
.main__slider .image_slide:first-child .caption div:nth-child(3)
{
    text-transform: uppercase;
    padding-bottom: 2%;
} 

.main__slider img
{
    width: 80%;
    display: block;
    margin: -5% auto;
}
#block-block-1 div div:first-child
{
    font-size: 252%;
    line-height: 1.5;
}


#block-block-1 div div:nth-child(2)
{
    font-size: 134%;
    line-height: 1;
    font-family: gelight;
    color: #515557;
}

#block-block-1 div div:nth-child(3)
{
    font-size: 123%;
    line-height: 1.5;
    font-family: gelight;
    color: #515557;
    margin-top: 22px;
    text-align:justify;
}

.image_slide:last-child .caption div:first-child{
    font-size: 252%;
    line-height: 1.5;
    font-family:cblack;
}
.image_slide:last-child .caption div:nth-child(2){
    font-size: 134%;
    line-height: 1.4;
    font-family: gelight;
    color: #515557;
}

/* end slider style*/

/*  Start Awards Block */

.awardinnumbers {
    margin-bottom: 3%;
        clear: both;
}
.award-col {
    width: 25%;
    float: right;
    box-sizing: border-box;
    border-left: solid 1px #ac7a3c;
    border-right: none;
    padding: 0 15px;
    position: relative;
}
.award-col:first-child {
    padding-right: 0;
    padding-left: 30px;
}

.award-col:nth-child(4){
    border-left:none;
}

.award-col:nth-child(3) .mapBackground{
    background-size: 100% auto !important;
}
.award-col:nth-child(2) .mapBackground{
    background-size: 100% auto !important;
}
.award-col:nth-child(1) .mapBackground{
    background-size: 100% auto !important;
}




.mapBackground {
    width: 100%;
    height: 12vw;
    background-size: 60% auto;
    background-repeat: no-repeat;
    background-position: center center;
}

.award-col h2{
    color: #ac7a3c;
    font-weight: bold;
        font-size: 160%;
        text-align:center;
}
.counters {
    width: 50%;
    float: right;
    font-size: 110%;
    color: #ac7a3c;
}
.counters span{
    display: block;
    font-size: 100%;
        text-align:center;
}
.counters.blue-color{
     color: #8794a7;
     text-align:right;
}
.counters span.candidates-span {
    font-size: 200%;
    padding: 0;
    color: #8794a7;
}
.counters span.winners-span {
    font-size: 200%;
    padding: 0;
    color: #ac7a3c;

}
/* End Awards Block */
.closeSearch {
width: 30px;
    position: absolute;
    top: 20%;
    right: 15px;
    cursor: pointer;
    display: none;
    padding: 15px;
}


@media(max-width: 1024px){
    .mainSearchForm {
        position: fixed;
        top: 50%;
        width: 80%;
        left: 10%;
        border: solid 1px #000;
            z-index: 999;
    }
    .searchPopup {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0,0,0,0.8);
        z-index: 999;
        display: none;
}
.searchPopup.opened{
    display: block;
}
.search-icon {
    width: 3vw;
    margin: auto;

}
.search-icon img {
    max-width: 100%;
    cursor: pointer;
    display: block;
    margin: auto;
}
.closeSearch{
    display: none;
}
    .searchPopup.opened .closeSearch{
        display: block;
    }
}





@media only screen and (max-width: 2600px) {
    
      .y{
          
 
      }
     
 #mob{
        
        display:none;
    }
    #desk{
        
        display:block;
        
    }
    
}
 

@media only screen and (max-width: 600px) {
    
    .ar .newspagecontent h2, h3 {
   text-align:right !important;
}

    
    .android_box, .ios_box{
        
        height:1000px !important;
    
    }
    
    .android_box #sc,.ios_box #sc{
        
        position:relative !important;
        float:left !important;
        overflow:scroll !important;
        top:0 !important;
        transform:none !important;
        height: 550px;
        padding-bottom:100px;
    }
    
      #floating_icons {
              display:none !important;
      }
      .y{
          
        
      }
      
      body{
    
    background:none !important;
    
} 
    
    #mob{
        
        display:block !important;
    }
    #desk{
        
        display:none !important;
        
    }
    #log{
        
        max-width:300px !important;
    }

    
}
   
   
    