@font-face {
    font-family: HelveticaNeue;
    src: url(../fonts/HelveticaNeueLT_Arabic_55_Roman.ttf);
}

@font-face {
    font-family: HelveticaNeueThin;
    src: url(../fonts/HelveticaNeueLT_Arabic_55_Roman.ttf);
}

@font-face {
    font-family: HelveticaNeueBold;
    src: url(../fonts/HelveticaNeueLT_Arabic_75_Bold.ttf);
}

@font-face {
    font-family: HelveticaNeueRegular;
    src: url(../fonts/HelveticaNeueLT_Arabic_55_Roman.ttf);
}

@font-face {
    font-family: pillGothicThin;
    src: url(../fonts/PillGothic300mg-Thin.ttf);
}

@font-face {
    font-family: myriadPro;
    src: url(../fonts/myriadPro_Cond.otf);
}

@font-face {
    font-family: pillGothicBold;
    src: url(../fonts/PillGothic300mg-Bold.ttf);
}

@font-face {
    font-family: pillGothicRegular;
    src: url(../fonts/PillGothic300mg-Regular.ttf);
}




/* -------------------------------- 

Primary style

-------------------------------- */

a:hover, a:active, a:focus {
  outline: 0;
}

a {
   outline: 0;
}


*, *::after, *::before {
  box-sizing: border-box;
}

html {
  font-size: 62.5%;
}

body {
  font-size: 1.6rem;
  color: #ffffff;
  background-color: #000;
}
body::before {
  /* never visible - this is used in jQuery to check the current MQ */
  content: 'mobile';
  display: none;
}
@media only screen and (min-width: 80px) {
  body::before {
    /* never visible - this is used in jQuery to check the current MQ */
    content: 'desktop';
  }
}

a {
  color: #267481;
  text-decoration: none;
}



/* -------------------------------- 

Main Components 

-------------------------------- */
@media only screen and (min-width: 80px) {
  body[data-hijacking="on"] {
    overflow: hidden;
  }
}

.cd-section {
  height: 100vh;
  position:relative;
}

.cd-section2 {
  height: 50vh;
  position:relative;
}
.cd-section:first-of-type > div {
  background-color: #000;
}
.cd-section:first-of-type > div::before {
  /* alert -> all scrolling effects are not visible on small devices */
  content: 'Effects not visible on mobile!';
  position: absolute;
  width: 100%;
  text-align: center;
  top: 20px;
  z-index: 2;
  font-weight: bold;
  font-size: 1.3rem;
  text-transform: uppercase;
  color: #000;
}
.cd-section:nth-of-type(2) > div {
  background-color: #000;
}
.cd-section:nth-of-type(3) > div {
  background-color: #000;
}
.cd-section:nth-of-type(4) > div {
  background-color: #000;
}
.cd-section:nth-of-type(5) > div {
  background-color: #000;
}
[data-animation="parallax"] .cd-section > div, [data-animation="fixed"] .cd-section > div, [data-animation="opacity"] .cd-section > div {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}
[data-animation="parallax"] .cd-section:first-of-type > div, [data-animation="fixed"] .cd-section:first-of-type > div, [data-animation="opacity"] .cd-section:first-of-type > div {
  background-image: url("");
}
[data-animation="parallax"] .cd-section:nth-of-type(2) > div, [data-animation="fixed"] .cd-section:nth-of-type(2) > div, [data-animation="opacity"] .cd-section:nth-of-type(2) > div {
  background-image: url("");
}
[data-animation="parallax"] .cd-section:nth-of-type(3) > div, [data-animation="fixed"] .cd-section:nth-of-type(3) > div, [data-animation="opacity"] .cd-section:nth-of-type(3) > div {
  background-image: url("");
}
[data-animation="parallax"] .cd-section:nth-of-type(4) > div, [data-animation="fixed"] .cd-section:nth-of-type(4) > div, [data-animation="opacity"] .cd-section:nth-of-type(4) > div {
  background-image: url("");
}
[data-animation="parallax"] .cd-section:nth-of-type(5) > div, [data-animation="fixed"] .cd-section:nth-of-type(5) > div, [data-animation="opacity"] .cd-section:nth-of-type(5) > div {
  background-image: url("");
}
@media only screen and (min-width: 80px) {
  .cd-section h2 {
    font-size: 4rem;
    font-weight: 300;
  }
  [data-hijacking="on"] .cd-section {
    opacity: 0;
    visibility: hidden;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
  }
  [data-hijacking="on"] .cd-section > div {
    visibility: visible;
  }
  [data-hijacking="off"] .cd-section > div {
    opacity: 0;
  }
  [data-animation="rotate"] .cd-section {
    /* enable a 3D-space for children elements */
    -webkit-perspective: 1800px;
    -moz-perspective: 1800px;
    perspective: 1800px;
  }
  [data-hijacking="on"][data-animation="rotate"] .cd-section:not(:first-of-type) {
    -webkit-perspective-origin: center 0;
    -moz-perspective-origin: center 0;
    perspective-origin: center 0;
  }
  [data-animation="scaleDown"] .cd-section > div, [data-animation="gallery"] .cd-section > div, [data-animation="catch"] .cd-section > div {
    box-shadow: 0 0 0 rgba(25, 30, 46, 0.4);
  }
  [data-animation="opacity"] .cd-section.visible > div {
    z-index: 1;
  }
}

@media only screen and (min-width: 80px) {
  .cd-section:first-of-type > div::before {
    display: none;
  }
}
@media only screen and (min-width: 80px) {
  .cd-section > div {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    /* Force Hardware Acceleration */
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    -o-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
  }
  [data-hijacking="on"] .cd-section > div {
    position: absolute;
  }
  [data-animation="rotate"] .cd-section > div {
    -webkit-transform-origin: center bottom;
    -moz-transform-origin: center bottom;
    -ms-transform-origin: center bottom;
    -o-transform-origin: center bottom;
    transform-origin: center bottom;
  }
}

.cd-vertical-nav {
  /* lateral navigation */
  position: fixed;
  z-index: 1;
  right: 3%;
  top: 50%;
  bottom: auto;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  display: block;
}

/*.cd-vertical-nav-home {
    right: 50%  !important;
    bottom: -16px  !important;
    top: inherit !important; 
}

*/

.cd-vertical-nav a {
  display: block;
  height: 40px ;
  width: 40px ;
  /* image replace */
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  /*background: url(../img/cd-icon-arrow.png) no-repeat center center;*/
}



.cd-vertical-nav a.cd-prev {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
  margin-bottom: 10px;
}
.cd-vertical-nav a.inactive {
  visibility: hidden;
  opacity: 0;
  -webkit-transition: opacity 0.2s 0s, visibility 0s 0.2s;
  -moz-transition: opacity 0.2s 0s, visibility 0s 0.2s;
  transition: opacity 0.2s 0s, visibility 0s 0.2s;
}

#bottomnav{
  width:40px;
  height:80px;
  /* background-color:#F35E3F; */
  z-index: 1;
  position: fixed;
  right: 3%;
  top: 50%;
  bottom: auto;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  display: block;
}
#bottomnav-up{
  width:40px;
  height:50%;
  background: url(../img/cd-icon-arrow.png) no-repeat center center;
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
  cursor:pointer;
}
#bottomnav-down{
  width:40px;
  height:50%;
  background: url(../img/cd-icon-arrow.png) no-repeat center center;
  cursor:pointer;
}


.navbar-header a{
  cursor: pointer
}

.videodiv{
  width: 100%;
  height: 100%;
}

#sec01{
	width:100%;
	height:100%;
	background-color:#000;
	background-repeat:no-repeat;
	/*background-attachment: fixed;*/
	background-position: center center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}
#sec02{
  width:100%;
  height:100%;
  background-image:url(../img/Page-02.jpg);
  background-repeat:no-repeat;
  /*background-attachment: fixed;*/
  background-position: center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
#sec03{
	width:100%;
  height:100%;
 /* background-image:url(../img/Page-03.jpg);*/
  background-repeat:no-repeat;
  /*background-attachment: fixed;*/
  background-position: center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
	
}
#sec04{
	width:100%;
	height:100%;
	background-image:url(../img/Page-04.jpg);
	background-repeat:no-repeat;
	/*background-attachment: fixed;*/
	background-position: center center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}
#sec05{
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.5);
    background-repeat: no-repeat;
    /* background-attachment: fixed; */
    background-position: center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
#sec06{
	width:100%;
	height:100%;
	background-image:url(../img/Page-06.jpg);
	background-repeat:no-repeat;
	/*background-attachment: fixed;*/
	background-position: center center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}

#sec07{
  width:100%;
  height:100%;
  background-image:url(../img/Page-07.jpg);
  background-repeat:no-repeat;
  /*background-attachment: fixed;*/
  background-position: center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;

}

#sec08{
  width:100%;
  height:100%;
/* background-image:url(../img/page-08.jpg);*/
  background-repeat:no-repeat;
  /*background-attachment: fixed;*/
  background-position: bottom bottom;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  /*z-index:3;*/
}

#sec09{
  width:100%;
  height:100%;
  /*background-color:#000;*/
  background-repeat:no-repeat;
  /*background-attachment: fixed;*/
  background-position: center center;
  -webkit-background-size: inherit;
  -moz-background-size: inherit;
  -o-background-size: inherit;
  background-size: inherit;
 
}

#sec10{
  width:100%;
  height:40%;
  top:60%;
 background-image:url(../img/page-10.jpg);
  background-repeat:no-repeat;
  /*background-attachment: fixed;*/
  background-position: bottom bottom;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
 
}



 .layer h1{
  font-family: HelveticaNeueThin,Arial;
  font-size: 45px;
  color: #ffffff;
  text-transform: uppercase;
  text-align:right;
 }

 .layer h2{
  font-family: HelveticaNeueRegular,Arial;
  font-size: 48px;
  color: #ffffff;
  font-weight: bold;
  text-transform: uppercase;
  line-height: 52px;
  text-align:right;
 }

 .navbar{
  margin-bottom: 0 !important;
 }

 .navbar-nav {
    margin: 0 155px 0 0;
}

 .navbar-nav>li>a {
    padding-top: 28px;
    padding-bottom: 22px;
    font-family: HelveticaNeueThin,Arial ;
    font-weight: normal !important;
    /*line-height: 1;*/
    cursor: pointer;
    color:#ffffff !important;
    font-size: 22px;

}

.navbar-brand {
    padding: 5px 20px !important;
    height: auto !important;
}

.navbar-default {
  background-color: transparent; 
  border-color: transparent;
    
  
}

.navbar-default .navbar-nav>li>span {
    color: #ffffff;
    font-family: HelveticaNeueThin,Arial;
    text-transform: lowercase;
    font-size: 25px;
    cursor: pointer;
    margin: 24px 0px 24px 44px;
}

.navbar-fixed-bottom .navbar-collapse, .navbar-fixed-top .navbar-collapse{
  max-height: none !important;
}

.navbar-collapse.in{
  max-height: none !important;
}

.mainlogo {
    float: right;
    margin-top: 16px;
}

#homeVideo{
    position: absolute;
    right: 0;
    bottom: 0;
    top:0;
    right:0;
    width: 100%;
    height: 100%;
    background-size: 100% 100%;
    background-color: black; /* in case the video doesn't fit the whole page*/
   
    background-position: center center;
    background-size: contain;
    object-fit: cover; /*cover video background */
    z-index:3;
}

#mapVideo{
    position: relative;
    right: 0;
    bottom: 0;
    top:0;
    right:0;
    width: 100%;
    height: 100%;
    background-size: 100% 100%;
    background-color: black; /* in case the video doesn't fit the whole page*/
    
    background-position: center center;
    background-size: contain;
    object-fit: inherit; /*cover video background */
    z-index:1;
}

_:-ms-lang(x), _:-webkit-full-screen, #homeVideo{ position: relative; }




  /* Layer with position absolute in order to have it over the video
  * --------------------------------------- */
  
  .layer {
    position: absolute;
    z-index: 4;
    top: 16%;
    text-align: left;
    right: 10%;
}

  /*solves problem with overflowing video in Mac with Chrome */
  #section0{
    overflow: hidden;
  }


  /* Bottom menu
  * --------------------------------------- */
  #infoMenu li a {
    color: #fff;
  }

  .home_botm_wr{
    background: url(../img/home_bottom_svg.png) no-repeat;
    width: 100%;
    height: 44px;
    z-index: 9999999;
    position: absolute;
    bottom: 0;
  }

    .frame-1 {
      -vendor-animation-duration: 4s;
      -webkit-animation-duration: 4s;
      -moz-animation-duration: 4s;
      -vendor-animation-delay: 2s;
      -webkit-animation-delay: 2s;
      -moz-animation-delay: 2s;

    }

    .frame-2 {
      -vendor-animation-duration: 4s;
      -webkit-animation-duration: 4s;
      -moz-animation-duration: 4s;
      -vendor-animation-delay: 2.5s;
      -webkit-animation-delay: 2.5s;
      -moz-animation-delay: 2.5s;
    }

    .frame-3 {
     -vendor-animation-duration: 5s;
      -webkit-animation-duration: 5s;
      -moz-animation-duration: 5s;
      -vendor-animation-delay: 3s;
      -webkit-animation-delay: 3s;
      -moz-animation-delay: 3s;
    }

    .frame-4 {
     -vendor-animation-duration: 4s;
      -webkit-animation-duration: 4s;
      -moz-animation-duration: 4s;
      -vendor-animation-delay: 3.5s;
      -webkit-animation-delay: 3.5s;
      -moz-animation-delay: 3.5s;
    }

    .frame-5 {
     -vendor-animation-duration: 4s;
      -webkit-animation-duration: 4s;
      -moz-animation-duration: 4s;
      -vendor-animation-delay: 4.2s;
      -webkit-animation-delay: 4.2s;
      -moz-animation-delay: 4.2s;
    }

     .frame-6 {
     -vendor-animation-duration: 3s;
      -webkit-animation-duration: 3s;
      -moz-animation-duration: 3s;
      -vendor-animation-delay: .25s;
      -webkit-animation-delay: .25s;
      -moz-animation-delay: .25s;
    }

     .frame-7 {
     -vendor-animation-duration: 4.75s;
      -webkit-animation-duration: 4.75s;
      -moz-animation-duration: 4.75s;
      -vendor-animation-delay: .58s;
      -webkit-animation-delay: .58s;
      -moz-animation-delay: .58s;
    }

    .frame-8 {
    -webkit-animation: breathing 2s ease-out infinite normal;
    animation: breathing 2s ease-out infinite normal;
   
    }

   .frame-b {
    -webkit-animation: breathingc 1.5s ease-in infinite normal;
    animation: breathingc 1.5s ease-in infinite normal;
   
    }

     .frame-t {
    -webkit-animation: breathingt 2s ease-out infinite normal;
    animation: breathingt 2s ease-out infinite normal;
   
    }


  

    .frame-8-1 {
      -webkit-animation-iteration-count: none !important; 
      -vendor-animation-iteration-count: none !important; 
      -moz-animation-iteration-count: none !important; 
    }

  @-webkit-keyframes breathing {
  0% {
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
  }

  25% {
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
  }

  60% {
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
  }

  100% {
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
  }
}

@keyframes breathing {
  0% {
    -webkit-transform: scale(0.8);
    -ms-transform: scale(0.8);
    transform: scale(0.8);
  }

  25% {
    -webkit-transform: scale(1.3);
    -ms-transform: scale(1.3);
    transform: scale(1.3);
  }

  60% {
    -webkit-transform: scale(0.8);
    -ms-transform: scale(0.8);
    transform: scale(0.8);
  }

  100% {
    -webkit-transform: scale(0.8);
    -ms-transform: scale(0.8);
    transform: scale(0.8);
  }
}

@-webkit-keyframes breathingc {
  0% {
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
  }

  25% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  60% {
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
  }

  100% {
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
  }
}

@keyframes breathingc {
  0% {
    -webkit-transform: scale(1.05);
    -ms-transform: scale(1.05);
    transform: scale(1.05);
  }

  25% {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }

  60% {
    -webkit-transform: scale(1.05);
    -ms-transform: scale(1.05);
    transform: scale(1.05);
  }

  100% {
    -webkit-transform: scale(1.05);
    -ms-transform: scale(1.05);
    transform: scale(1.05);
  }
}

@-webkit-keyframes breathingt {
  0% {
    -webkit-transform: scale(0.7);
    transform: scale(0.7);
  }

  25% {
    -webkit-transform: scale(1.4);
    transform: scale(1.4);
  }

  60% {
    -webkit-transform: scale(0.7);
    transform: scale(0.7);
  }

  100% {
    -webkit-transform: scale(0.7);
    transform: scale(0.7);
  }
}

@keyframes breathingt {
 0% {
    -webkit-transform: scale(0.7);
    transform: scale(0.7);
  }

  25% {
    -webkit-transform: scale(1.4);
    transform: scale(1.4);
  }

  60% {
    -webkit-transform: scale(0.7);
    transform: scale(0.7);
  }

  100% {
    -webkit-transform: scale(0.7);
    transform: scale(0.7);
  }
}
  

    @-webkit-keyframes pulsate {
    0% {-webkit-transform: scale(0.1, 0.1); opacity: 0.0;}
    50% {opacity: 1.0;}
    100% {-webkit-transform: scale(1.2, 1.2); opacity: 0.0;}
    }

    @-moz-keyframes pulsate {
    0% {-moz-transform: scale(0.1, 0.1); opacity: 0.0;}
    50% {opacity: 1.0;}
    100% {-moz-transform: scale(1.2, 1.2); opacity: 0.0;}
    }

 
    .frame-9 {
     -vendor-animation-duration: 1s;
      -webkit-animation-duration: 1s;
      -moz-animation-duration: 1s;
      -vendor-animation-delay: .4s;
      -webkit-animation-delay: .4s;
      -moz-animation-delay: .4s;
    }

     .layer_2 {
     -vendor-animation-duration: 2s;
      -webkit-animation-duration: 2s;
      -moz-animation-duration: 12s;
      -vendor-animation-delay: 1s;
      -webkit-animation-delay: .1s;
      -moz-animation-delay: 1s;
    }

     .frame-10 {
    -vendor-animation-duration: 4s;
      -webkit-animation-duration:4s;
      -moz-animation-duration: 4s;
      -vendor-animation-delay: .25s;
      -webkit-animation-delay: .25s;
      -moz-animation-delay: .25s;
    }

    .frame-11 {
     -vendor-animation-duration: 1s;
      -webkit-animation-duration: 1s;
      -moz-animation-duration: 1s;
      -vendor-animation-delay: .4s;
      -webkit-animation-delay: .4s;
      -moz-animation-delay: .4s;
    }

    .frame-12 {
     -vendor-animation-duration: 0.1s;
      -webkit-animation-duration: 0.1s;
      -moz-animation-duration: 0.1s;
      -vendor-animation-delay: 0.1s;
      -webkit-animation-delay: 0.1s;
      -moz-animation-delay: 0.1s;
    }

    .frame-13 {
     -vendor-animation-duration: 0.9s;
      -webkit-animation-duration: 0.9s;
      -moz-animation-duration: 0.9s;
      -vendor-animation-delay: .4s;
      -webkit-animation-delay: .4s;
      -moz-animation-delay: .4s;
    }

     .frame-14 {
     -vendor-animation-duration: 0.5s !important;
      -webkit-animation-duration: 0.5s !important;
      -moz-animation-duration: 0.5s !important;
      -vendor-animation-delay: 0.0s !important;
      -webkit-animation-delay: 0.0s !important;
      -moz-animation-delay: 0.0s !important;
    }

    .frame-15 {
     -vendor-animation-duration: .5s !important;
      -webkit-animation-duration: .5s !important;
      -moz-animation-duration: .5s !important;
      -vendor-animation-delay: 1s !important;
      -webkit-animation-delay: 1s !important;
      -moz-animation-delay: 1s !important;
    }

    .frame-16 {
      -vendor-animation-duration: .5s !important;
      -webkit-animation-duration: .5s !important;
      -moz-animation-duration: .5s !important;
      -vendor-animation-delay: 1.1s !important;
      -webkit-animation-delay: 1.1s !important;
      -moz-animation-delay: 1.1s !important;
    }

    .frame-17 {
     -vendor-animation-duration: .5s !important;
      -webkit-animation-duration: .5s !important;
      -moz-animation-duration: .5s !important;
      -vendor-animation-delay: 1.2s !important;
      -webkit-animation-delay: 1.2s !important;
      -moz-animation-delay: 1.2s !important;
    }

    .frame-18 {
     -vendor-animation-duration: .5s !important;
      -webkit-animation-duration: .5s !important;
      -moz-animation-duration: .5s !important;
      -vendor-animation-delay: 1.3s !important;
      -webkit-animation-delay: 1.3s !important;
      -moz-animation-delay: 1.3s !important;
    }

    .frame-19 {
    -vendor-animation-duration: .5s !important;
      -webkit-animation-duration: .5s !important;
      -moz-animation-duration: .5s !important;
      -vendor-animation-delay: 1.4s !important;
      -webkit-animation-delay: 1.4s !important;
      -moz-animation-delay: 1.4s !important;
    }

    .frame-20 {
    -vendor-animation-duration: .5s !important;
      -webkit-animation-duration: .5s !important;
      -moz-animation-duration: .5s !important;
      -vendor-animation-delay: 1.5s !important;
      -webkit-animation-delay: 1.5s !important;
      -moz-animation-delay: 1.5s !important;
    }

    .frame-21 {
      -vendor-animation-duration: .5s !important;
      -webkit-animation-duration: .5s !important;
      -moz-animation-duration: .5s !important;
      -vendor-animation-delay: 1.6s !important;
      -webkit-animation-delay: 1.6s !important;
      -moz-animation-delay: 1.6s !important;
    }

    .frame-22 {
     -vendor-animation-duration: .5s !important;
      -webkit-animation-duration: .5s !important;
      -moz-animation-duration: .5s !important;
      -vendor-animation-delay: 1.7s !important;
      -webkit-animation-delay: 1.7s !important;
      -moz-animation-delay: 1.7s !important;
    }

    .frame-23 {
     -vendor-animation-duration: 1s;
      -webkit-animation-duration: 1s;
      -moz-animation-duration: 1s;
      -vendor-animation-delay: .4s;
      -webkit-animation-delay: .4s;
      -moz-animation-delay: .4s;
    }

    .frame-25 {
     -vendor-animation-duration: 1s;
      -webkit-animation-duration: 1s;
      -moz-animation-duration: 1s;
      -vendor-animation-delay: .4s;
      -webkit-animation-delay: .4s;
      -moz-animation-delay: .4s;
    }

 .frame-26 {
     -vendor-animation-duration: 6s;
      -webkit-animation-duration: 6s;
      -moz-animation-duration: 6s;
      -vendor-animation-delay: .6s;
      -webkit-animation-delay: .6s;
      -moz-animation-delay: .6s;
    }


.glyphicon {
      position: relative !important;
      top: 1px;
      display: inline-block;
      font-family: HelveticaNeueThin,Arial !important;
      font-weight: normal !important;
      line-height: 1;
      cursor: pointer
      
  }

  /* page 2  */

  .page2_bot{
    margin-top:18px;

  }

  .layer_2_1 {
    width: 100%;
    padding: 2% 9%;
    margin: 5% auto 0;
  }

  .layer_2_1_text_wr{ width:955px; height: 158px; }

  .layer_2_1 h1{
    font-family: HelveticaNeueThin,Arial;
    font-size: 25px;
    color: #ffffff;
    text-align: right;
    width: 580px;
    line-height: 36px;
    float: right;
    margin-bottom: 30px;
  }

  .layer_2_1 h1 b{
    font-family: HelveticaNeueRegular,Arial;
  }

  .layer_2_2 {
    z-index: 99999;
    margin-right: 30px;
    text-align: left;
    background: rgba(0,52,113,0.6);
    height: 1px;
    width: 1px;
    padding: 1.5%;
    left: 0;
    float: left;
    display: none;
  }

  .layer_2_2 h2{
    font-family: HelveticaNeueRegular,Arial;
    font-size: 19px;
    padding: 15px 0 9px;
    display: none;
    text-align: right;
    font-weight: bold;
    line-height: 28px;
    padding-top: 0;

   }

   .layer_2_2 ul{
    font-family: HelveticaNeueThin,Arial;
    font-size: 18px;
    padding: 0 16px 9px;
    display: none;
    text-align: right;
   }

   .layer_2_2 ul li{
    list-style: initial;
    line-height: 25px;
    font-size:8px;
   }

   .layer_2_2 ul li span{ font-family: HelveticaNeueRegular,Arial; font-size: 17px;}

   .hl {

    font-weight: bold;
   }

  /* page 3  */

.layer_2, .layer_1_1{
    position: absolute;
    z-index: 99999;
    margin-left: 0;
    top: 13%;
    text-align: left;
    background: rgba(0,52,113,0.6);
    height: 1px;
    width: 1px;
    padding: 36px;
    right: 10%;
    display: none;
}

.layer_2 ul{
    font-family: HelveticaNeueThin, Arial;
    font-size: 17px;
    color: rgb(255, 255, 255);
    text-align: right;
    line-height: 25px;
    margin-left: 16px;
    padding-right: 13px;
    margin-top: 10px;
}

.layer_2 ul li {
    list-style: initial;
    line-height: 25px;
    font-size: 8px;
}

.layer_2 ul li span{
    font-size: 17px;
}

.layer_4_1{
    position: absolute;
    z-index: 99999;
    margin-left: 52%;
    top: 35%;
    text-align: left;
    background: rgba(0,52,113,0.4);
    height: 1px;
    width: 1px;
    padding: 2%;
    left: 0;
    display: none;
}

.layer_10_1 {
    position: absolute;
    z-index: 99999;
    /* margin-left: 10%; */
    text-align: left;
    background: rgba(0,52,113,0.4);
    height: 1px;
    width: 1px;
    padding: 3%;
    left: 0;
    display: none;
}

.parent {
    width: 100%;
    height: 100%;
}

.layer_2.clicked, .layer_1_1.clicked, .layer_2_2.clicked{
    height: 100%;
    width: 100%;
    transition: width 2s, height 2s;
  -moz-transition: width 2s, height 2s;
  -webkit-transition: width 2s, height 2s; 
  -o-transition: width 2s, height 2s; 
}



 .layer_10_1.clicked {
    height: 320px;
    width: 337px;
    transition: width 2s, height 2s;
  -moz-transition: width 2s, height 2s;
  -webkit-transition: width 2s, height 2s; 
  -o-transition: width 2s, height 2s; 
}

.layer_4_1.clicked {
    height: 287px;
    width: 500px;
    transition: width 2s, height 2s;
  -moz-transition: width 2s, height 2s;
  -webkit-transition: width 2s, height 2s; 
  -o-transition: width 2s, height 2s; 
}

.layer_2 h1, .layer_1_1 h1, .layer_4_1 h1{
    font-family: HelveticaNeueThin,Arial;
    font-size: 49px;
    color: #ffffff;
    display: none;
    text-align: right;
 }

 .layer_2 h2, .layer_1_1 h2, .layer_4_1 h2{
    font-family: HelveticaNeueBold,Arial;
    font-size: 50px;
    color: #ffffff;
    font-weight: bold;
    line-height: 68px;
    margin-bottom: 16px;
    display: none;
    text-align: right;
 }

 .layer_2 p, .layer_1_1 p, .layer_4_1 p, .layer_10_1 p{
    font-family: HelveticaNeueThin,Arial;
    font-size: 17px;
    color: #ffffff;
    width: 100%;
    line-height: 27px;
    display: none;
    text-align: right;
 }

 .page_2_link{
    background: url(../img/plus-up.png) no-repeat;
    width: 64px;
    height: 64px;
    float: right;
    display: block;
    margin-top: 15px;
    display: none;
 }

 .page_1_1_link{
    background: url(../img/plus-up.png) no-repeat;
    width: 64px;
    height: 64px;
    float: right;
    display: block;
    margin-top: -16px;
    display: none;
 }

 .page_4_1_link{
    background: url(../img/plus-up.png) no-repeat;
    width: 64px;
    height: 64px;
    float: right;
    display: block;
    margin-top: -10px;
    display: none;
 }

.main_nav{
    position: relative;
    width: 100%;
    height: 100px;

 }

 .ln_wr{
   background: url(../img/navi_btm_bg.png) no-repeat;
   width: 100%;
   height: 24px;
   position: absolute;
   display: none;
   z-index: 9999;
  margin-top: 74px;
 }

 .navi_show{
  background: url(../img/main-menu.png) no-repeat;
  width: 48px;
  height: 36px;
  right:0;
  position: fixed;
  margin:90px 26px 0;
  z-index: 994;
  display: none;
  cursor: pointer;
 

 }

 .navi_show_hover{
  background: url(../img/Plus-Over.gif) no-repeat !important;
  width: 100px !important;
  height: 100px !important;
  margin: 100px 9px 100px 10px !important;

 }

 .navi-main{
  padding-left: 0 !important;
  padding-right: 0 !important;
  background: #272723;
  display: none;
  position: absolute;
  width: 100%;
  z-index: 999999;
 }

 .mouse_point{
    background:  url(../img/scrolldown.png) no-repeat !important;
    width: 47px;
    height: 55px;
    position: absolute;
    right: 3%;
    z-index: 999999;
    bottom: 49%;
    z-index: 999999999;
    cursor: pointer;
 }

 #navbar li ul
{
  display: none;
  position: absolute;
  top: 100%;
  background: #272723;
  list-style: none;
  margin: 0;
  padding: 16px;
  width: 182px;
}

#navbar li:hover ul
{
   display: block;
}

#navbar li ul li a{
  font-family: HelveticaNeueThin,Arial !important;
  font-weight: normal !important;
  line-height: 1;
  cursor: pointer;
  color: #818285 ;
  font-size: 22px;
  text-decoration: none;
  margin-bottom:10px;
}

#navbar li ul li a:hover{
  color: #ffffff ;
}

#navbar li ul li{
   margin-bottom:10px;
}


 /* page 03 */

 .layer_3 {
    text-align: center;
    width: 100%;
    padding: 3% 10%;
    margin: 3% auto 0;
    display: none;
}

.layer_3 h1 {
    font-family: HelveticaNeueThin,Arial;
    font-size: 59px;
    color: #ffffff;
    text-align: center;
}


.layer_3 h2 {
    font-family: HelveticaNeueThin,Arial;
    font-size: 20px;
    color: #ffffff;
    width: 100%;
    line-height: 28px;
    text-align: center;
    padding: 0px 21%;
    margin-top: 4px;
}

.layer_3 h3 {
    font-family: HelveticaNeueThin,Arial;
    font-size: 24px;
    color: #ffffff;
    width: 100%;
    line-height: 28px;
    text-align: center;
    padding: 0px 19%;
    margin-top: 180px;
}


/* page 03 */

 .layer_5_1 {
    text-align: center;
    width: 100%;
    padding: 2%;
    margin: 3.5% auto 0;
    display: none;
}

.layer_5_1 h1 {
    font-family: HelveticaNeueThin,Arial;
    font-size: 70px;
    color: #ffffff;
    text-align: center;
    margin-bottom: 113px;
}


/* page 05 */

 .layer_5 {
    text-align: center;
    width: 100%;
    padding: 2%;
    margin: 33% auto 0;
    display: none;
}

.layer_5 h1 {
    font-family: HelveticaNeueThin,Arial;
    font-size: 100px;
    color: #ffffff;
    text-align: center;
}


/* page 06 */

 .layer_6 {
    text-align: center;
    width: 90%;
    padding: 5% 2% 2% 2%;
    margin: 0 auto 0;
    
}

.layer_6 h1 {
    font-family: HelveticaNeueThin,Arial;
    font-size: 61px;
    color: #ffffff;
    text-align: center;
}

.layer_6 h2 {
    font-family: HelveticaNeueThin,Arial;
    font-size: 20px;
    color: #ffffff;
    text-align: center;
    line-height: 27px;
    margin-top: 15px;
	margin-bottom:50px;
}

.brands{
    margin: 14px 0;
    display: none;
    position: relative;
    -webkit-transform: translate(-50%,-50%); /* Safari and Chrome */
    -moz-transform: translate(-50%,-50%); /* Firefox */
    -ms-transform: translate(-50%,-50%); /* IE 9 */
    -o-transform: translate(-50%,-50%); /* Opera */
    transform: translate(-50%,-50%);
}

.pic{
	width: 100%;
    height: 100%; 

}

.pic img {
    -webkit-transition: all 0.4s ease; /* Safari and Chrome */
  	-moz-transition: all 0.4s ease; /* Firefox */
  	-o-transition: all 0.4s ease; /* IE 9 */
  	-ms-transition: all 0.4s ease; /* Opera */
  	transition: all 0.4s ease;
}

.pic:hover img {
    -webkit-transform:scale(1.1); /* Safari and Chrome */
    -moz-transform:scale(1.1); /* Firefox */
    -ms-transform:scale(1.1); /* IE 9 */
    -o-transform:scale(1.1); /* Opera */
     transform:scale(1.1);
}


.pic:hover, .pic-caption:hover{cursor: pointer;}

/* page 07 */

 .layer_7 {
    text-align: center;
    padding: 2%;
    margin: 4% 0 0 6%;
    display: block;
    vertical-align: top;
    position: absolute;
    z-index: 9999;
    width: 33%;
}

.layer_7 h1 {
    font-family: HelveticaNeueThin,Arial;
    font-size: 70px;
    color: #ffffff;
    text-align: right;
}

.layer_7 h2 {
    font-family: HelveticaNeueThin,Arial;
    font-size: 20px;
    color: #ffffff;
    text-align: right;
    line-height: 27px;
    margin-top: 15px;
    width: 490px;
}


/* page 08 */

 .layer_8 {
    text-align: center;
    width: 90%;
    padding: 2%;
    margin: 1% auto; 
}

.layer_8 h1 {
    font-family: HelveticaNeueThin,Arial;
    font-size: 70px;
    color: #ababab;
    text-align: center;
    margin-bottom: 18px;
}

.layer_8 h2 {
    font-family: HelveticaNeueRegular,Arial;
    font-size: 18px;
    color: #ababab;
    text-align: center;
    clear: both;
    margin-top: 15px;
}

.layer_8 ul{
    margin: 0 auto 0;
    display: inline-block;
}

.layer_8 ul li{
  float: left;
}

.layer_8 ul li a {
    font-family: HelveticaNeueRegular,Arial;
    font-size: 22px;
    color: #ababab;
    text-align: left;
    line-height: 27px;
    margin: 15px;
    text-decoration: none;
    cursor:pointer;
}

.statiscs_wr{
    margin: 122px auto;
    width: 1399px; 
}



.wrapper{
  width:1424px;
  height:auto;
  margin:0 auto;
}

.main-back{
 /* width:100%;*/
  height:313px;
  text-align:center;
  float:left;
  margin-right: 38px;
}

.main-back-last{
 /* width:100%;*/
  height:313px;
  text-align:center;
  float:left;
}

.main-back-circle{
  position: absolute;
  width: 90%;
  height: 53px;
  background: rgba(36,81,101,0.7);
  background-repeat: no-repeat;
  border-radius: 210px;
}

.anim-count{
 /* width:213px;*/
  height:auto;
  padding-top:250px;
  font-size:20px;
  text-transform:uppercase;
  font-family: HelveticaNeueRegular,Arial;



}
.anim-count span{
  font-size:50px;
}
/*.................Animation 01..............................*/
#anim1-1{
    position: absolute;
    width: 100%; 
    height: 100%;
/*  background-image:url(../img/stat-anim/1/middle-circle.png);*/
  background-repeat:no-repeat;
  -webkit-animation-name: rotate1-1; 
    -webkit-animation-duration: 5s; 
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: rotate1-1; 
    -moz-animation-duration: 5s; 
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    animation-name: rotate1-1; 
    animation-duration: 5s; 
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

@-webkit-keyframes rotate1-1 {
    from {-webkit-transform: rotate(360deg);}
    to {-webkit-transform: rotate(0deg);}
}

@-moz-keyframes rotate1-1 {
    from {-moz-transform: rotate(360deg);}
    to {-moz-transform: rotate(0deg);}
}

@keyframes rotate1-1 {
    from {transform: rotate(360deg);}
    to {transform: rotate(0deg);}
}

#anim1-2{
  position:absolute;
  width: 100%;
  height:100%;
  /*background-image:url(../img/stat-anim/1/Other-Circles.png);*/
  background-repeat:no-repeat;
  -webkit-animation-name: rotate1-2; 
    -webkit-animation-duration: 5s; 
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: rotate1-2; 
    -moz-animation-duration: 5s; 
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    animation-name: rotate1-2; 
    animation-duration: 5s; 
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}
@-webkit-keyframes rotate1-2 {
    from {-webkit-transform: rotate(0deg);}
    to {-webkit-transform: rotate(360deg);}
}

@-moz-keyframes rotate1-2 {
    from {-moz-transform: rotate(0deg);}
    to {-moz-transform: rotate(360deg);}
}

@keyframes rotate1-2 {
    from {transform: rotate(0deg);}
    to {transform: rotate(360deg);}
}

#anim1-3{
  position:absolute;
  width:100%;
  height:100%;
  /*background-image:url(../img/stat-anim/1/logo.png);*/
  background-repeat:no-repeat;
}

/*...................Animation 02............................*/

#anim2-1{
    position: absolute;
    width: 100%; 
    height: 100%;
  /*background-image:url(../img/stat-anim/2/circles.png);*/
  background-repeat:no-repeat;
  -webkit-animation-name: rotate2-1; 
    -webkit-animation-duration: 5s; 
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: rotate2-1; 
    -moz-animation-duration: 5s; 
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    animation-name: rotate2-1; 
    animation-duration: 5s; 
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

@-webkit-keyframes rotate2-1 {
    from {-webkit-transform: rotate(0deg);}
    to {-webkit-transform: rotate(360deg);}
}

@-moz-keyframes rotate2-1 {
    from {-moz-transform: rotate(0deg);}
    to {-moz-transform: rotate(360deg);}
}

@keyframes rotate2-1 {
    from {transform: rotate(0deg);}
    to {transform: rotate(360deg);}
}

#anim2-2{
  position:absolute;
  width:100%;
  height:100%;
  /*background-image:url(../img/stat-anim/2/logo.png);*/
  background-repeat:no-repeat;
}

/*...................Animation 03............................*/
#anim3-1{
    position: absolute;
    width: 100%; 
    height: 100%;
  /*background-image:url(../img/stat-anim/3/4.png);*/
  background-repeat:no-repeat;
  -webkit-animation-name: rotate3-1; 
    -webkit-animation-duration: 6s; 
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: rotate3-1; 
    -moz-animation-duration: 6s; 
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    animation-name: rotate3-1; 
    animation-duration: 6s; 
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

@-webkit-keyframes rotate3-1 {
    from {-webkit-transform: rotate(0deg);}
    to {-webkit-transform: rotate(360deg);}
}

@-moz-keyframes rotate3-1 {
    from {-moz-transform: rotate(0deg);}
    to {-moz-transform: rotate(360deg);}
}

@keyframes rotate3-1 {
    from {transform: rotate(0deg);}
    to {transform: rotate(360deg);}
}

#anim3-2{
    position: absolute;
    width: 100%; 
    height: 100%;
  /*background-image:url(../img/stat-anim/3/3.png);*/
  background-repeat:no-repeat;
  -webkit-animation-name: rotate3-2; 
    -webkit-animation-duration: 6s; 
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: rotate3-2; 
    -moz-animation-duration: 6s; 
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    animation-name: rotate3-2; 
    animation-duration: 6s; 
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

@-webkit-keyframes rotate3-2 {
    from {-webkit-transform: rotate(360deg);}
    to {-webkit-transform: rotate(0deg);}
}

@-moz-keyframes rotate3-2 {
    from {-moz-transform: rotate(360deg);}
    to {-moz-transform: rotate(0deg);}
}

@keyframes rotate3-2 {
    from {transform: rotate(360deg);}
    to {transform: rotate(0deg);}
}

#anim3-3{
    position: absolute;
    width: 100%; 
    height: 100%;
  /*background-image:url(../img/stat-anim/3/2.png);*/
  background-repeat:no-repeat;
  -webkit-animation-name: rotate3-3; 
    -webkit-animation-duration: 6s; 
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: rotate3-3; 
    -moz-animation-duration: 6s; 
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    animation-name: rotate3-3; 
    animation-duration: 6s; 
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

@-webkit-keyframes rotate3-3 {
    from {-webkit-transform: rotate(360deg);}
    to {-webkit-transform: rotate(0deg);}
}

@-moz-keyframes rotate3-3 {
    from {-moz-transform: rotate(360deg);}
    to {-moz-transform: rotate(0deg);}
}

@keyframes rotate3-3 {
    from {transform: rotate(360deg);}
    to {transform: rotate(0deg);}
}
#anim3-4{
  position:absolute;
  width:100%;
  height:100%;
  /*background-image:url(../img/stat-anim/3/01.png);*/
  background-repeat:no-repeat;
}

/*...................Animation 04............................*/

#anim4-1{
    position: absolute;
    width: 100%; 
    height: 100%;
  /*background-image:url(../img/stat-anim/4/5.png);*/
  background-repeat:no-repeat;
  -webkit-animation-name: rotate4-1; 
    -webkit-animation-duration: 7s; 
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: rotate4-1; 
    -moz-animation-duration: 7s; 
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    animation-name: rotate4-1; 
    animation-duration: 7s; 
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

@-webkit-keyframes rotate4-1 {
    from {-webkit-transform: rotate(360deg);}
    to {-webkit-transform: rotate(0deg);}
}

@-moz-keyframes rotate4-1 {
    from {-moz-transform: rotate(360deg);}
    to {-moz-transform: rotate(0deg);}
}

@keyframes rotate4-1 {
    from {transform: rotate(360deg);}
    to {transform: rotate(0deg);}
}

#anim4-2{
    position: absolute;
    width: 100%; 
    height: 100%;
 /* background-image:url(../img/stat-anim/4/4.png);*/
  background-repeat:no-repeat;
  -webkit-animation-name: rotate4-2; 
    -webkit-animation-duration: 7s; 
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: rotate4-2; 
    -moz-animation-duration: 7s; 
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    animation-name: rotate4-2; 
    animation-duration: 7s; 
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

@-webkit-keyframes rotate4-2 {
    from {-webkit-transform: rotate(0deg);}
    to {-webkit-transform: rotate(360deg);}
}

@-moz-keyframes rotate4-2 {
    from {-moz-transform: rotate(0deg);}
    to {-moz-transform: rotate(360deg);}
}

@keyframes rotate4-2 {
    from {transform: rotate(0deg);}
    to {transform: rotate(360deg);}
}

#anim4-3{
    position: absolute;
    width: 100%; 
    height: 100%;
  /*background-image:url(../img/stat-anim/4/3.png);*/
  background-repeat:no-repeat;
  -webkit-animation-name: rotate4-3; 
    -webkit-animation-duration: 7s; 
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: rotate4-3; 
    -moz-animation-duration: 7s; 
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    animation-name: rotate4-3; 
    animation-duration: 7s; 
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

@-webkit-keyframes rotate4-3 {
    from {-webkit-transform: rotate(360deg);}
    to {-webkit-transform: rotate(0deg);}
}

@-moz-keyframes rotate4-3 {
    from {-moz-transform: rotate(360deg);}
    to {-moz-transform: rotate(0deg);}
}

@keyframes rotate4-3 {
    from {transform: rotate(360deg);}
    to {transform: rotate(0deg);}
}

#anim4-4{
    position: absolute;
    width: 100%; 
    height: 100%;
  /*background-image:url(../img/stat-anim/4/2.png);*/
  background-repeat:no-repeat;
  -webkit-animation-name: rotate4-4; 
    -webkit-animation-duration: 7s; 
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: rotate4-4; 
    -moz-animation-duration: 7s; 
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    animation-name: rotate4-4; 
    animation-duration: 7s; 
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

@-webkit-keyframes rotate4-4 {
    from {-webkit-transform: rotate(0deg);}
    to {-webkit-transform: rotate(360deg);}
}

@-moz-keyframes rotate4-4 {
    from {-moz-transform: rotate(0deg);}
    to {-moz-transform: rotate(360deg);}
}

@keyframes rotate4-4 {
    from {transform: rotate(0deg);}
    to {transform: rotate(360deg);}
}

#anim4-5{
  position:absolute;
  width:100%;
  height:100%;
  /*background-image:url(../img/stat-anim/4/1.png);*/
  background-repeat:no-repeat;
}
/*...................Animation 05............................*/

#billion{
  text-transform:none;
  font-size:35px;
}
#doller{
  font-size:50px;
}
#anim5-1{
  position:absolute;
  width:100%;
  height:100%;
  /*background-image:url(../img/stat-anim/5/1.png);*/
  background-repeat:no-repeat;
}
#anim5-2{
  position:absolute;
  width:100%;
  height:100%;
  /*background-image:url(../img/stat-anim/5/2.png);*/
  background-repeat:no-repeat;
}
#anim5-count-number0{
  font-size:50px;
}

/*...................Animation 06............................*/

#mwh{
  font-size:50px;
  text-transform:none;
}
#anim6-1{
    position: absolute;
    width: 100%; 
    height: 100%;
  /*background-image:url(../img/stat-anim/6/2.png);*/
  background-repeat:no-repeat;
  -webkit-animation-name: rotate6-1; 
    -webkit-animation-duration: 7s; 
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: rotate6-1; 
    -moz-animation-duration: 7s; 
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    animation-name: rotate6-1; 
    animation-duration: 7s; 
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

@-webkit-keyframes rotate6-1 {
    from {-webkit-transform: rotate(0deg);}
    to {-webkit-transform: rotate(360deg);}
}

@-moz-keyframes rotate6-1 {
    from {-moz-transform: rotate(0deg);}
    to {-moz-transform: rotate(360deg);}
}

@keyframes rotate6-1 {
    from {transform: rotate(0deg);}
    to {transform: rotate(360deg);}
}

#anim6-2{
  position: absolute;
    /* top: -150px; */
    /* left: 150px; */
    width: 100%;
    height: 100%;
    /* background-image: url(../img/stat-anim/6/1.png); */
    background-repeat: no-repeat;
    /* opacity: 0; */
}

.map_grow{
   /* margin-top: 108px;
    width: 500px;
    display: inline-block;
    position: absolute;
    margin-right: 163px;
    right: 0;
    top:0;*/
    margin:16% 0 0 12%;
}

.map_grow img{
  /*width:474px;*/
}



.ripple{
  background-image:url(../img/714.gif);
  background-repeat:no-repeat;
  width:20px;
  height: 20px;
}


#ripple1{
  position: absolute;
  margin: 40px 0 0 213px;
}

#ripple2{
  position: absolute;
  margin: 106px 0 0 277px;

}

#ripple3{
  position: absolute;
  margin:246px 0 0 121px;

}

#ripple4{
  position: absolute;
  margin: 138px 0 0 372px;

}

#ripple5{
  position: absolute;
  margin: 228px 0 0 404px;

}

#ripple6{
  position: absolute;
  margin: 312px 0 0 303px;

}

.pluspre{
 position: fixed; 
 left: 0; 
 top: 55.5%;
 z-index: 999; 
 width: 100%; 
 height: 100%; 
 right:0;
 font-family: HelveticaNeueThin,Arial;
 font-size: 22px;
 color: #ffffff;
 text-align: center;

}

.loading_plus{
    -webkit-animation: pulsate 1s ease-out;
    -vendor-animation: pulsate 1s ease-out;
    -moz-animation: pulsate 1s ease-out;
    -webkit-animation-iteration-count: infinite;
    -vendor-animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
 
    -vendor-animation-delay: .4s;
    -webkit-animation-delay: .4s;
    -moz-animation-delay: .4s;
    -vendor-animation-duration: 2.75s;
    -webkit-animation-duration: 2.75s;
    -moz-animation-duration: 2.75s;
}

.js div#preloader_wr { position: fixed; left: 0; top: 0; z-index: 999; width: 100%; height: 100%;  background: #000000 center center; }

#preloader{
  background: url('../img/plus-up.png') no-repeat center center; 
  top: 50%;
  position: fixed;
  right: 0;
  left: 0;
  z-index: 99999;
  height: 50px;

}

#preloader_wr h1{
    font-family: pillGothicThin,Arial;
    font-size: 29px;
    color: #ffffff;
    text-align: center;
    top: 60%;
    position: fixed;
    right: 0;
    left: 0;
}

#preloader_wr h2{
    font-family: pillGothicThin,Arial;
    font-size: 19px;
    color: #ffffff;
    text-align: center;
    top: 86%;
    position: fixed;
    right: 0;
    left: 0;
}

.mask{
    display: none;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background:#444;
    opacity: .7;    
}

.brands:hover .mask{
    display:block;
}

/* page-2-slider */

.caption1{
    position:absolute;
    top:0px;
    left:0px;
    z-index:10;
    width: 100%;
   color:white;
    background-image: none;
    background-repeat: repeat;
    background-attachment: scroll;
    background-position: 0% 0%;
    background-size: auto auto;
    /*background: none repeat scroll 0% 0% rgba(80, 80, 80, 0.75);*/
   /* background-color: rgba(80, 80, 80, 0.75);*/
}

.caption2{
    position:absolute;
    top:0px;
    left:0px;
    z-index:10;
    width: 100%;
   color:white;
    background-image: none;
    background-repeat: repeat;
    background-attachment: scroll;
    background-position: 0% 0%;
    background-size: auto auto;
    font
}

.layer_9 {
    text-align: center;
    width: 875px;
    margin: 85px auto 15px;
    display: none;
}

.layer_9 h1 {
    font-family: HelveticaNeueThin,Arial;
    font-size: 69px;
    color: #ffffff;
    text-align: right;
    margin-left: -9px;
}

.layer_9 h2 {
    font-family: HelveticaNeueThin,Arial;
    font-size: 20px;
    color: #ffffff;
    text-align: right;
    line-height: 27px;
    margin-top: 30px;
    width: 100%;
    margin-bottom: 22px
}

.layer_10 {
    width: 100%;
    background: rgba(0,52,113,0.4);
    display: block;

}

.layer_10_content{
    width: 875px;
    margin: 0 auto 0;
    position: relative;

}



.page_10_1_link {
    background: url(../img/plus-up.png) no-repeat;
    width: 64px;
    height: 64px;
    float: right;
    display: block;
    margin-top: -29px;
    display: block;
}

.layer_10_1 h2{
    font-family: HelveticaNeueThin,Arial;
    font-size: 23px;
    color: #ffffff;
    display: block;
    margin-top: 18px;
    margin-left: 23px;

}

.about_li{
      margin: 19px 0 0 0;
      display: none;

}


.layer_10_content iframe {
     margin-left: 337px;
     width:538px;
     display:none;
}

.page4_con{
  width:70%;
  margin: 0 auto;
}

.com_vi{
  display: none;
}

.bxslider img, .bxslider2 img{
  width: 100% !important; 
  background-repeat: no-repeat !important; background-position: center center !important; -webkit-background-size: cover !important; -moz-background-size: cover !important; -o-background-size: cover !important; background-size: cover !important;
}

.container1{
  width:26%;
  margin: 0 auto;
}



/* timeline */

.timeline{
    width: 966px;
    padding: 0 0 50px 0;
    margin: 40px auto 0 auto;
    height: 444px;
    position: relative;
    display: none;
}

.plusmark-small{
    background: url(../img/cross.svg);
    width: 22px;
    height: 22px;
    z-index: 1;
    background-size: 22px 22px;
    display: block;
    text-indent: -9999px;
}

.plusmark-big{
    background: url(../img/cross.svg);
    width: 31px;
    height: 31px;
    z-index: 1;
    background-size: 31px 31px;
    display: block;ss
   text-indent: -9999px;
}

.plus1-1{
  margin: 41px 0 0 31px;
  position: absolute;
  cursor:pointer; 
  transition: all .2s ease-in-out; 
  z-index: 999;
}

.plus1{
  margin:65px 0 0 72px;
  position: absolute;
  cursor:pointer; 
  transition: all .2s ease-in-out; 
}

.plus2{
  margin: 86px 0 0 108px;
  position: absolute;
  cursor:pointer; 
  transition: all .2s ease-in-out; 
  z-index: 999;
}

.plus3{
  margin: 116px 0 0 134px;
  position: absolute;
  cursor:pointer; 
  transition: all .2s ease-in-out; 
}

.plus4{
  margin: 131px 0 0 165px;
  position: absolute;
  cursor:pointer;
  transition: all .2s ease-in-out;  
}

.plus5{
  margin: 151px 0 0 211px;
  position: absolute;
  cursor:pointer;
  transition: all .2s ease-in-out;  
}

.plus6{
  margin:150px 0 0 265px;
  position: absolute;
  cursor:pointer;
  transition: all .2s ease-in-out;  
}

.plus7{
  margin: 190px 0 0 290px;
  position: absolute;
  cursor:pointer; 
  transition: all .2s ease-in-out; 
}

.plus8{
  margin: 140px 0 0 349px;
  position: absolute;
  cursor:pointer; 
  transition: all .2s ease-in-out; 
}

.plus9{
  margin: 130px 0 0 449px;
  position: absolute;
  cursor:pointer; 
  transition: all .2s ease-in-out; 
}

.plus10{
  margin: 160px 0 0 387px;
  position: absolute;
  cursor: pointer;
  transition: all .2s ease-in-out; 
}

.plus11{
  margin: 181px 0 0 493px;
  position: absolute;
  cursor:pointer; 
  transition: all .2s ease-in-out; 
}

.plus12{
  margin: 148px 0 0 531px;
  position: absolute;
  cursor:pointer; 
  transition: all .2s ease-in-out; 
}

.plus13{
  margin: 194px 0 0 589px;
  position: absolute;
  cursor:pointer; 
  transition: all .2s ease-in-out; 
}

.plus14{
  margin: 208px 0 0 625px;
  position: absolute;
  cursor:pointer; 
  transition: all .2s ease-in-out; 
}

.plus15{
  margin:178px 0 0 645px;
  position: absolute;
  cursor:pointer; 
  cursor:pointer; 
  transition: all .2s ease-in-out; 
}

.plus16{
  margin:186px 0 0 730px;
  position: absolute;
  cursor:pointer; 
  transition: all .2s ease-in-out; 
}

.plus17{
  margin:148px 0 0 780px;
  position: absolute;
  cursor:pointer; 
  transition: all .2s ease-in-out; 
}

.plus18{
  margin:102px 0 0 815px;
  position: absolute;
  cursor:pointer; 
  transition: all .2s ease-in-out; 
}

.plus19{
  margin: 62px 0 0 854px;
  position: absolute;
  cursor:pointer; 
  transition: all .2s ease-in-out; 
}

.plus20{
  margin:15px 0 0 860px;
  position: absolute;
  cursor:pointer; 
  transition: all .2s ease-in-out; 
}

.year-1971{
  position: absolute;
  margin: 125px 0 0 52px;
  z-index: 9999;

}

.year-1988{
  position: absolute;
  margin: 3px 0 0 68px;
  z-index: 9999;

}

.year-1982{
  position: absolute;
  margin: 192px 0 0 209px;
  z-index: 9999;

}

.year-1990{
  position: absolute;
  margin: 203px 0 0 329px;
  z-index: 99999;

}

.year-2000{
  position: absolute;
  margin:149px 0 0 583px;
  z-index: 9999;
}

.year-2010{
  position: absolute;
  margin: 57px 0 0 800px;
  z-index: 9999;

}

.timeline-year{
  font-family: HelveticaNeueRegular,Arial;
  font-size: 24px;
  color: #ffffff;

}

.timeline_plus{
    -webkit-animation: pulsate 5s ease-out;
    -vendor-animation: pulsate 5s ease-out;
    -moz-animation: pulsate 5s ease-out;
    -webkit-animation-iteration-count: infinite;
    -vendor-animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;

    -vendor-animation-delay: .1s;
    -webkit-animation-delay: .1s;
    -moz-animation-delay: .1s;
    -vendor-animation-duration: 2.75s;
    -webkit-animation-duration: 2.75s;
    -moz-animation-duration: 2.75s;
}

.remove_samll_plus{
  display: none;

}

.plus2all_hover{
    position: absolute;
    margin: 5.3% 0 0 6%;
    width: 74px;
    height: 40px;
    cursor: pointer;

}
.plus1-1 { transition: all .2s ease-in-out; }
.plus1 { transition: all .2s ease-in-out; }
.plus2 { transition: all .2s ease-in-out; }
/*.plus2:hover { transform: scale(3); cursor:pointer; }*/

.plus6 { transition: all .2s ease-in-out; }
/*.plus6:hover { transform: scale(3); cursor:pointer; }*/

.plus10 { transition: all .2s ease-in-out; }
/*.plus10:hover { transform: scale(3); cursor:pointer; }*/

.plus15 { transition: all .2s ease-in-out; }
/*.plus15:hover { transform: scale(3); cursor:pointer; }*/

.plus20 { transition: all .2s ease-in-out; }
/*.plus20:hover { transform: scale(3); cursor:pointer; }*/

.plus6all_hover{
    position: absolute;
    margin: 13% 0 0 13%;
    width: 74px;
    height: 40px;
    cursor: pointer;

}

.plus10all_hover{
    position: absolute;
    margin: 14.5% 0 0 47.4%;
    width: 74px;
    height: 40px;
    cursor: pointer;

}

.plus15all_hover{
    position: absolute;
    margin: 18.5% 0 0 69%;
    width: 74px;
    height: 33px;
    cursor: pointer;

}

.plus20all_hover{
    position: absolute;
    margin: -1.5% 0 0 94%;
    width: 74px;
    height: 33px;
    cursor: pointer;
}

.plus20all, .plus15all{
  cursor: pointer;

}

.plus1-1all-big{
    position: absolute;
    margin: -58px 0 0 232px;
    display: none;
    z-index: 99;
}

.plus2all-big{
    position: absolute;
    margin: 142px 0 0 85px;
    display: none;
    z-index: 99;
}

.plus6all-big{
  display: block;
  position: absolute;
  margin: 206px 0 0 241px;
  display: none;
  z-index: 1;
}

.plus10all-big{
  position: absolute;
  margin: 215px 0 0 364px;
  display: none;
  z-index: 9999;
}

.plus15all-big{
    position: absolute;
    margin: 230px 0 0 427px;
    display: none;
    z-index: 99;
}


.plus20all-big{
  position: absolute;
  margin:70px 0 0 617px;
  display: none;
  z-index: 1;
}

.plusmark-bigger{
    background: url(../img/plus_bigger.png) no-repeat;
    width: 75px;
    height: 75px;
    z-index: 99994;
}

.yeardata h1{
   font-size: 24px;
   margin-bottom: 15px;
   font-family: HelveticaNeueRegular,Arial;
}

.yeardata ul{
  list-style: inherit;
  clear: both;
  margin-right: 26px;
}

.yeardata ul li{
  line-height: 19px;
  margin-left:15px;
  font-size: 10px;
}

.yeardata ul li span{
  font-size: 15px;
}


.year_1988_data{
    background: rgba(5,62,110,0.9);
    padding: 1px 11px 70px;
    font-family: HelveticaNeueThin,Arial;
    font-size: 14px;
    color: #ffffff;
    width: 194px;
    position: absolute;
    margin: -8px 0 0 -180px;
    z-index: 99999;
}

.year_1988_data h1{
  float: right;  

}

.year_1971_data{
    background: rgba(5,62,110,0.9);
    padding: 30px 11px 14px;
    font-family: HelveticaNeueThin,Arial;
    font-size: 14px;
    color: #ffffff;
    width: 136px;
    position: absolute;
    margin: -29px 0 0 -108px;
    z-index: 99999;
}

.year_1971_data h1{
  float: right;  

}

.year_1982_data{
    background: rgba(5,62,110,0.9);
    padding: 43px 11px 16px;
    font-family: HelveticaNeueThin,Arial;
    font-size: 14px;
    color: #ffffff;
    width: 218px;
    position: absolute;
    margin: -29px 0 0 -190px;
    z-index: 99999;
}

.year_1982_data h1{
  float: right;  

}

.year_1990_data{
    background: rgba(5,62,110,0.9);
    padding: 45px 11px 16px;
    font-family: HelveticaNeueThin,Arial;
    font-size: 14px;
    color: #ffffff;
    width: 212px;
    position: absolute;
    margin: -29px 0 0 -184px;
    z-index: 99999;
}

.year_1990_data h1{
  float: right;  

}

.year_2000_data{
    background: rgba(5,62,110,0.9);
    padding: 11px 11px 16px;
    font-family: HelveticaNeueThin,Arial;
    font-size: 14px;
    color: #ffffff;
    width: 176px;
    position: absolute;
    margin: -143px 0 0 47px;
}

.year_2000_data h1{
  margin-top: 15px;
  margin-bottom:0 !important;   

}

.year_2000_data ul{
    padding-bottom: 37px;
}

.year_2010_data{
    background: rgba(5,62,110,0.9);
    padding: 11px 11px 20px;
    font-family: HelveticaNeueThin,Arial;
    font-size: 14px;
    color: #ffffff;
    width: 222px;
    position: absolute;
    margin: -28px 0 0 26px;
}

.year_2010_data ul{
  padding-top: 36px;
}

.md-trigger {
    border: none;
    background: url(../img/you_video_bg.jpg) no-repeat;
    width: 547px;
    height: 320px;
    margin-left: 337px;
    display: none;
 
}

#billion { margin-left: 10px; vertical-align: top; display: inline-block; margin-top: -4px;}

.ac_text { margin-top: 11px; line-height: 30px; }

.bx-viewport, .bx-wrapper{
    position:relative;
    width:100%;
    height:100% !important;
    top:0;
    left:0;
}

.bxslider, .bxslider li, .bxslider2, .bxslider2 li{
     height: 100vh !important;
}

.bxslider li, .bxslider2 li{
    width: 100% !important;
    height: 100% !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    -webkit-background-size: cover !important;
    -moz-background-size: cover !important;
    -o-background-size: cover !important;
    background-size: cover !important;
}

.bxslider li img{
    width: 100% !important;
    height: 100% !important; 
    background-repeat: no-repeat !important;
    background-position: center center !important;
    -webkit-background-size: cover !important;
    -moz-background-size: cover !important;
    -o-background-size: cover !important;
    background-size: cover !important;

}

.home_i{
    padding: 20px 19px 19px !important;
}

.lan_s_e{
    font-family: pillGothicThin,Arial !important;
    margin-left:65px;
    padding: 34px 2px 0 !important;
    margin-right: 12px;
    font-size: 25px !important;

}

.lan_s{
  padding: 28px 2px 0 !important;
  margin-right: 10px;
  margin-top: -6px;
}

.lan_wr{
  margin-left:80px;
}

/*contact*/

#contactpage {
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-position: center center;
    -webkit-background-size: inherit;
    -moz-background-size: inherit;
    -o-background-size: inherit;
    background-size: inherit;
    background-image: url(../img/talk.jpg);
    background-size: cover;
}

.layer_con {
    text-align: center;
    margin: 4% 0 0 0;
    display: inline-block;
    vertical-align: top;
    position: absolute;
    z-index: 9999;
    width: 100%;
}

.layer_con h1 {
    font-family: HelveticaNeueThin,Arial;
    font-size: 69px;
    color: #ffffff;
    text-align: center;
    margin-top: 23px;
    margin-bottom: 0;
  }

.layer_con h2 {
    font-family: HelveticaNeueThin,Arial;
    font-size: 18px;
    color: #ffffff;
    text-align: center;
    line-height: 27px;
    margin-top: 0px;
}

.con_b_wr{ width: 100%;position: fixed; bottom: 0; background: rgba(0,0,0,0.7);}

.con_b_wr_l{ width: 50%; float: left;}

.con_b_l_con{    float: right; width: 100%;}

.con_b_wr_main{  width: 100%; float: left;     padding: 2% 2% 2%;}

.con_b_wr_r{ width: 50%; float: left;}

.con_b_l_con h1{
    font-family: HelveticaNeueThin,Arial;
    font-size: 40px;
    color: #ffffff;
    display: inline-block;
    vertical-align: top;
    margin: 0;

}

.con_dtl{
   display: inline-block;
   vertical-align: top;
   margin-left: 30px;
   width: 56%;
   float: left;
   margin-top: 10px;
}

.con_dtl h3{
  font-family: HelveticaNeueBold,Arial;
  font-size: 20px;
  color: #ffffff;
  text-align: left;
  margin-top: 10px;
}

.con_dtl p{
  font-family: HelveticaNeueThin,Arial;
  font-size: 14px;
  color: #a0a0a0;
  text-align: right;
  line-height: 21px;
  text-transform: uppercase;
}

.con_dtl h4{
  font-family: HelveticaNeueThin,Arial;
  font-size: 15px;
  color: #ffffff;
  text-align: left;

}

.con_dtl h5{
  font-family: HelveticaNeueThin,Arial;
  font-size: 15px;
  color: #a0a0a0;
  margin-top:24px;
  text-align: right;
  margin: 18px 0 8px;
}

.con_b_wr_dark{
  background: rgba(27,26,26,0.9); 
}

.form-group {
    margin-bottom: 12px;
    width: 100%;
}

.form-group input:placeholder-shown {
    color: #a0a0a0 !important;
}

.form-control {
    background: transparent;
    color: #a0a0a0 !important;
    border-radius: 0;
    font-family: HelveticaNeueRegular,Arial;
    font-size: 14px;
    border: 1px solid #a4a4a3 !important;
    height: 37px;
    padding: 1px 12px 4px 9px;
    text-align: right;
    direction: rtl !important;
    unicode-bidi: bidi-override !important;
}

textarea.form-control{  resize:vertical ; height: auto; }

.list-unstyled{ text-align: right; }

#submit_btn {
    width: 100%;
    background: #a4a4a3;
    border: 2px solid #a4a4a3;
    color: #282828;
    font-size: 14px;
    border-radius: 0;
     font-family: HelveticaNeueRegular,Arial;
    text-align: center;
    margin-top: 16px;
    font-weight: 400;
    padding:2px 12px 6px;
}

textarea {
    padding: 4px 12px 23px 12px !important;
}

.row_clr{
  padding-left: 0;
  padding-right: 0;
}

#location-canvas {
    width: 100%;
    height: 525px;
    margin: 0px;
    padding: 0px;
}

.has-error .checkbox, .has-error .checkbox-inline, .has-error .control-label, .has-error .help-block, .has-error .radio, .has-error .radio-inline, .has-error.checkbox label, .has-error.checkbox-inline label, .has-error.radio label, .has-error.radio-inline label{
   color: #b00703 !important;
   font-weight: bold;
   font-size: 12px;
   text-align: left;

}



/* -------------------------------- 

Brands

-------------------------------- */


.page_wr {
    width: 100%;
    position: relative;
}

.main_bg_l{width:100%;}

/*.brand_logo{
    text-align: center;
    padding: 2%;
    margin: 8%;
    display: inline-block;
    vertical-align: top;
    position: absolute;
    bottom:13%;
}*/


.layer_brand_hd {
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-position: center center;
    -webkit-background-size: inherit;
    -moz-background-size: inherit;
    -o-background-size: inherit;
    background-size: inherit;
    background-image: url(../img/brand1-header.jpg);
}

.layer_brand_des{
    background: #ffffff;
	text-align:right;

}

.brand_content {
    width: 80%;
    padding: 3% 4%;
    margin: 0 auto 0;
}

.brand_content_info {
    
    width: 100%;
    padding: 3% 0;
    margin: 0 auto 0;
}

.brand_content h1{
    font-family: HelveticaNeueThin,Arial;
    font-size:75px;
    text-align: right;
	/* width:90%; */
}

.orengerie h1{ color: #F5A100;  }

.baharain h1{ color: #92342F;  }

/* .baharain h2{ width:90%;} */

.geant h1{ color: #EC392D;  }

.gulfmart h1{ color: #058F45; }
/* .gulfmart h2{ */
	/* width:90%; */
/* } */

.redtag h1{ color: #D20A10; font-family:HelveticaNeueThin,Arial; }

.twenty4 h1{ color: #f04c24; }

/* .twenty4 h2{ width:90%;} */

/* .geant h2{ */
	/* width:90%; */
/* } */



.layer_brand_des p{
    font-family: HelveticaNeueThin,Arial;
    color: #585757;
    font-size:20px;
    margin-top: 18px;
    text-align: right;
    /* width:90%; */
}

.brand_infography{
    width:100%;
}
#redtag_stores{
	/* width:90%; */
}

.info_orengerie{ background: rgb(244,156,0);}

.info_bahrain{ background: rgb(146,52,47);}

.info_geant{ background: rgb(14,129,106);}

.info_gulfmart{ background: rgb(5,143,69);}

.info_redtag{ background: rgb(57,57,56); }

.info_twenty4{ background: rgb(240,76,36); }

.brand_infography h1{
    font-family: HelveticaNeueThin,Arial;
    color: #ffffff;
    font-size:75px;
    text-align: center;
}

.anim-count-brands {
    height: auto;
    padding-top: 14px;
    font-size: 19px;
    text-transform: uppercase;
    font-family: HelveticaNeueThin,Arial;
    padding-left: 0;
}

.anim-count-brands span {
    font-size: 29px;
}

.brand_content_info .main-back{
    margin-top:40px;
}

.brand_content a{
  font-family: pillGothicBold,Arial;
  color: #000000;
  font-size:20px;
  margin-top:20px;
}

.brand_content h2{

    margin-top: 0px;
    margin-bottom: 0px;
}

.brand_icon{ height: 68px; }

.office_c{font-size:14px !important;}

.brand_content_info .main-back{ height: 195px; }

.mouse_point_brands{
    background: url(../img/scrolldown.png) no-repeat !important;    
    width: 47px;
    height: 55px;
    position: absolute;
    right: 3%;
    z-index: 999999;
    bottom: 49%;
    z-index: 999999999;
    cursor: pointer;
    margin-right: auto;
    margin-left: auto;
}

.cd-top {
  display: inline-block;
  height: 64px;
  width: 64px;
  position: fixed;
  bottom: 40px;
  left: 10px;
  /*box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);*/
  /* image replacement properties */
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  background: url(../img/small-up-arrows-in-a-circle.png) no-repeat center 50%;
  visibility: hidden;
  opacity: 0;
  -webkit-transition: opacity .3s 0s, visibility 0s .3s;
  -moz-transition: opacity .3s 0s, visibility 0s .3s;
  transition: opacity .3s 0s, visibility 0s .3s;
}
.cd-top.cd-is-visible, .cd-top.cd-fade-out, .no-touch .cd-top:hover {
  -webkit-transition: opacity .3s 0s, visibility 0s 0s;
  -moz-transition: opacity .3s 0s, visibility 0s 0s;
  transition: opacity .3s 0s, visibility 0s 0s;
}
.cd-top.cd-is-visible {
  /* the button becomes visible */
  visibility: visible;
  opacity: 1;
}
.cd-top.cd-fade-out {
  /* if the user keeps scrolling down, the button is out of focus and becomes less visible */
  opacity: .5;
}
.no-touch .cd-top:hover {
  /* background-color: #e86256; */
  opacity: 1;
}

.br_text{ line-height:27px; }




/* -------------------------------- 

About

-------------------------------- */


.about_sec1 {
  display: block;
  width: 1155px;
  margin: 0 auto 0;
  height: 100%;
  position: absolute;
  color: white;
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  transform-style: preserve-3d;
}

.brand_logo{
    display: block;
    width: 80%;
    /* margin: 0 auto 0 58%; */
    height: 100%;
    position: absolute;
    color: white;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    transform-style: preserve-3d;
    margin-left: auto;
    margin-right: auto;
    right: 0;
    left: 0;
    padding: 0 4%;
}

.brand_logo img{
  position: relative;
  top: 50%;
  margin-top: 0;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  float: right;
}



.about_sec1 h1{
  font-size: 40px;
  font-family: HelveticaNeueRegular,Arial;
  font-weight: 300;
  color: #ffffff;
  line-height: 48px;
  position: relative;
  top: 50%;
  margin-top: 0;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  text-align: right;
}

.about2{ padding:3% 0; background: #ffffff; }

.about_sec2{
    /*position: absolute;
    padding-right: 15px;
    padding-left: 15px;*/
}

.about_sec2 h1{
    font-size: 38px;
    font-family: HelveticaNeueThin,Arial;
    font-weight: 300;
    color: #004685;
    text-align: right;
    line-height: 52px;
}

.about_sec2 h1 span{  font-family: HelveticaNeueBold,Arial; }
 
.sec2_b{ width:100%; margin:50px 0; }

.sec2_l p{
    font-family: HelveticaNeueThin,Arial;
    color: #6D6E70;
    width: 90%;
    font-size: 20px;
    text-align: right;
    float: right;
    line-height: 30px;
}

.nopadding{
  padding-right: 0;
  padding-left: 0;
}

.sec3_wr{ background: #ededed; padding: 2% 0; }

.about3{ background: #ededed; padding:0; }

.sec3_l h1{ 
  font-size: 46px;
  font-family: HelveticaNeueRegular,Arial;
  color: #004685;
  margin-bottom: 0;
  text-align: right;
   margin-right: 126px;
}

.sec3_l h2{ 
    font-size: 241px;
    font-family: HelveticaNeueBold,Arial;
    color: #004685;
    margin: 0px 0 0 -12px;
    padding: 0;
    vertical-align: top;
    line-height: 27px;
    text-align: right;
}

.sec3_r{ margin: 5% 0; }

.sec3_r h1{ 
    font-size: 29px;
    font-family: HelveticaNeueBold,Arial;
    color: #6D6E70;
    line-height: 20px;
    text-align: right;
}

.sec3_r h1 span{ font-family: HelveticaNeueBold,Arial; }

.about_sec4 {
  display: block;
  width: 1155px;
  margin: 0 auto 0;
  height: 100%;
  position: absolute;
  color: white;
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  transform-style: preserve-3d;
}

.about_sec4 a{cursor:pointer;}

.about_sec4 h1{
    font-size: 38px;
    font-family: HelveticaNeueThin,Arial;
    color: #ffffff;
    position: relative;
    top: 50%;
    margin-top: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    text-align: right;
    line-height: 57px;
}

.about_sec4 h1 span{ font-family: HelveticaNeueBold,Arial; }

.team_wr{ margin-top:-1px;  display:inline-block;}

.team_c{
    position: absolute;
    bottom: 0px;
    width: 100%;
    padding: 6px 14px;
    background: rgba(6,6,7,0.5);
    z-index: 2;

}

.team_c h1{
        font-size: 29px;
    font-family: HelveticaNeueThin,Arial;
    color: #ffffff;
    line-height: 22px;
    margin-bottom: 4px;
    text-align: right;
    margin-top: 10px;
   
}

.team_c h2{
    font-size: 15px;
    font-family: HelveticaNeueRegular,Arial;
    color: #ffffff;
    line-height: 22px;
    /* display: inline-block; */
    margin-top: 17px;
    margin-bottom: 18px;
    text-align: right;
   
}

.team_plus{     
    float: right;
    margin-top: 27px;
}

.about6 {
    padding: 2% 0 3%;
    background: #ffffff;
    clear:both;
}

.team_des{
    width: 74%;
    float: left;
}

.mgteam{ padding-left: 40px; margin-top: 12px; }
 
.mgteam h1{
    font-size: 33px;
    font-family: HelveticaNeueThin,Arial;
    color: #6D6E70;
    margin-top: 23px;
    margin-bottom: 3px;
}

.mgteam h2{
    font-size: 22px;
    font-family: HelveticaNeueRegular,Arial;
    color: #6D6E70;
    margin-top: 4px;
    text-align: right;

}

.mgteam h3{
    font-size: 23px;
    font-family: HelveticaNeueRegular,Arial;
    color: #6D6E70;
    margin-top: 25px;
    line-height: 33px;
    text-align: right;
}

.sec2_r p{
    font-family: HelveticaNeueThin,Arial;
    color: #6D6E70;
    width: 100%;
    font-size: 20px;
    float: left;
    text-align: right;
    line-height: 30px;
}

.about_footer{  background: #004685; height: 52px; padding: 3px; margin-top: -1px;}

.about_footer h1{ 
    font-family: pillGothicThin,Arial;
    color: #ffffff;
    font-size: 15px;
    float: right;
}

.u_team {color:#ffffff; text-decoration: underline; margin-top:50px;}

.team_pl{ background: rgba(6,6,7,0.5); display: block;}

.team_pl img{ width:100%; }

.number_trigger{ position: absolute;width:100px; height:50px; bottom:50%; }

.next_brand {
    position: absolute;
    bottom: 58px;
    background: #ffffff;
    opacity: 0.9;
    padding: 20px 0 20px 20px;
    width: 280px;
    right: 130px;
}

.next_br_img{width: 57%; margin-right: 19px;}

.next_br_img { border: 1px solid #b1b0b0; }

.brand_co{ 
  /* margin-right: 130px; */
	/*padding-left:7%; */
}

.team3, .team4{ display: none; }

.line_br{margin-top:14px; }

.overlay{
    width:100%;
    height:100%;
    position:absolute;
    background: rgba(6,6,7,0.4);
    background-size:cover;
    z-index:1;
    display:block;
}

#team1 .overlay{ display: none; }

.last_item{ margin-right: 0 !important; }

.next_br_wr{ background: #272724; height:50px; }

.next_br_wr h1{ 
    font-family: HelveticaNeueThin,Arial;
    color: #ffffff;
    font-size: 18px;
    float: left;
    padding-right: 50px;
    margin: 18px 0 0;
}

.next_br_wr h1 img{ margin-right: 12px; margin-top: -5px; margin-left: 34px; }

#anim5-count-number, #anim4-count-number,  #anim5-count-number1{ margin-left:10px; }

#anim1-count-number, #anim2-count-number, #anim3-count-number, #anim4-count-number, #anim5-count-number, #anim6-count-number, #anim5-count-number1, #anim5-count-number2{ font-family: pillGothicRegular,Arial; font-size: 42px; }

.layer_2_1_wr{  width: 975px; float: right;}

.page2_bot_wr{ vertical-align: top; }

.layer_2_wr{ position:absolute;  z-index: 99999;  width: 100%; padding: 2% 9%; margin: 5% auto 0; }

#plus-anim3{ font-family: pillGothicRegular,Arial; }


@media screen and  (min-width: 435px) {
  .main-back-circle{ height:57px; }
  .anim-count span {font-size: 15px;}
   #doller {font-size: 15px;}
   #anim5-count-number0 {font-size: 15px;}
   #mwh {font-size: 15px; }
   .anim-count { padding-top: 106px;}
   #billion{font-size: 15px;}
   .anim-count {font-size: 15px;}
   .main-back {margin-right: 11px;}
}

@media screen and  (min-width: 435px) {
  .main-back-circle{ height:57px; }
  .anim-count span {font-size: 15px;}
   #doller {font-size: 15px;}
   #anim5-count-number0 {font-size: 15px;}
   #mwh {font-size: 15px; }
   .anim-count { padding-top: 106px;}
   #billion{font-size: 15px;}
   .anim-count {font-size: 15px;}
   .main-back {margin-right: 11px;}
}

@media screen and  (min-width: 480px) {
  .main-back-circle{ height:64px; }
  .anim-count span {font-size: 15px;}
   #doller {font-size: 29px;}
   #anim5-count-number0 {font-size: 15px;}
   #mwh {font-size: 15px; }
   .anim-count { padding-top: 106px;}
   #billion{font-size: 15px;}
   .anim-count {font-size: 15px;}
   .main-back {margin-right: 13px;}
}

@media screen and  (min-width: 540px) {
  .main-back-circle{ height:70px; }
  .anim-count span {font-size: 15px;}
   #doller {font-size: 15px;}
   #anim5-count-number0 {font-size: 15px;}
   #mwh {font-size: 15px; }
   .anim-count { padding-top: 106px;}
   #billion{font-size: 15px;}
   .anim-count {font-size: 15px;}
   .main-back {margin-right: 15px;}
}

@media screen and  (min-width: 580px) {
  .main-back-circle{ height:77px; }
  .anim-count span {font-size: 16px;}
   #doller {font-size: 16px;}
   #anim5-count-number0 {font-size: 16px;}
   #mwh {font-size: 16px; }
   .anim-count { padding-top: 116px;}
   #billion{font-size: 16px;}
   .anim-count {font-size: 16px;}
   .main-back {margin-right: 16px;}
}

@media screen and  (min-width: 640px) {
  .main-back-circle{ height:87px; }
  .anim-count span {font-size: 18px;}
   #doller {font-size: 18px;}
   #anim5-count-number0 {font-size: 18px;}
   #mwh {font-size: 18px; }
   .anim-count { padding-top: 116px;}
   #billion{font-size: 18px;}
   .anim-count {font-size: 16px;}
   .main-back {margin-right: 18px;}
}

@media screen and  (min-width: 688px) {
  .main-back-circle{ height:92px; }
  .anim-count span {font-size: 21px;}
   #doller {font-size: 21px;}
   #anim5-count-number0 {font-size: 21px;}
   #mwh {font-size: 21px; }
   .anim-count { padding-top: 122px;}
   #billion{font-size: 21px;}
   .main-back {margin-right: 20px;}

}

@media screen and  (min-width: 752px) {
  .main-back-circle{ height:104px; }
  .anim-count span {font-size: 29px;}
   #doller {font-size: 29px;}
   #anim5-count-number0 {font-size: 29px;}
   #mwh {font-size: 29px; }
   .anim-count { padding-top: 169px;}
   #billion{font-size: 29px;}
   .main-back {margin-right: 22px;}
}


@media screen and  (min-width: 768px) {
  .main-back-circle{ height:110px; }
   .anim-count span {font-size: 23px;}
   #doller {font-size: 23px;}
   #anim5-count-number0 {font-size: 23px;}
   #mwh {font-size: 23px; }
   .anim-count { padding-top: 169px;}
   #billion{font-size: 23px;}
   .main-back {margin-right: 23px;}
   .navbar-nav {margin: 0 55px 0 0;}
   .layer_2.clicked, .layer_1_1.clicked {height: 442px; width: 380px;}
   .about_sec1 { width: 740px; }
   .about_sec4 { width: 740px; }
   .layer_7{ width: 49%; }
}

@media screen and  (min-width: 992px) {
  .navbar-nav {margin: 0 33px 0 0;}
  .main-back-circle{ height:142px; }
  .anim-count span {font-size: 26px;}
   #doller {font-size: 36px;}
   #anim5-count-number0 {font-size: 36px;}
   #mwh {font-size: 36px; }
   .main-back { margin-right:38px;}
   .layer_2.clicked, .layer_1_1.clicked {  height: 488px; width: 473px; }
   .about_sec1 { width: 960px; }
   .about_sec4 { width: 960px; }
   .team_des { width: 74%; }
   .team_c h1 { font-size: 24px; }
   .team_c h2 { font-size: 13px; }
   .sec3_l h2 { font-size: 213px; }
   .layer_7{ width: 49%; }

 }

   @media screen and  (min-width: 1024px) {
   .layer_2_2.clicked {  height: 263px;width:306px; }
   .page_2_link{margin-top:16px;}
   .layer_2_1 { padding: 2% 7% 2% 6%; }
   .layer_2_2{ margin-right: 18px; }
   .cd-top { height: 64px; width: 64px; right: 30px; bottom: 30px; bottom: 60px;}
    .layer_7{ width: 49%; }
   

}


@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
  .navbar-nav {margin: 0 127px 0 0;}
  .layer{top: 31%; }
  .layer h1{ font-size: 72px; }
  .layer h2 { font-size: 75px; line-height: 97px;}
  .navi_show{margin: 111px 46px 0px 0px;}
  .parent {width: 34%; height: 520px;}
  .layer_2.clicked, .layer_1_1.clicked { height: 497px;width: 427px; }
  .layer_2, .layer_1_1 {margin-left: 10%; }
  .layer_2 h1, .layer_1_1 h1, .layer_4_1 h1{ font-size:49px;}
  .layer_2 h2, .layer_1_1 h2, .layer_4_1 h2{font-size:50px;}
  .main-back-circle{ height:142px; }

   .anim-count span {font-size: 23px;}
   #doller {font-size: 36px;}
   #anim5-count-number0 {font-size: 36px;}
   #mwh {font-size: 36px; }
   .anim-count { padding-top: 169px;}
   .main-back { margin-right:28px;}
   .layer_2_2.clicked { height: 304px; width: 306px; margin-right: 25px; padding: 1.5%;}
   .layer_2_1 { padding: 2% 5% 2% 5%; }
   .page_2_link{margin-top:16px;}
   .layer_3 h1{font-size: 59px;}
   .layer_6{ padding: 8.5% 2% 2% 2%;}
   .layer_3 {margin: 6% auto 0;}
   .year_2010_data {width: 137px;}
   .layer_5_1 {margin: 6% auto 0;}
   .layer_7{ width: 44%; }
   

}


@media screen and (min-width : 1199px) {
  .layer{top: 25%; }
  .layer h1{ font-size: 72px; }
  .layer h2 { font-size: 75px; line-height: 97px; }
  .navi_show{margin: 111px 46px 0px 0px;}
  .parent {width: 34%; height: 520px;}
  .layer_2.clicked, .layer_1_1.clicked { height: 497px; width: 473px;}
  .layer_2, .layer_1_1 {margin-left: 10%; }
  .layer_2 h1, .layer_1_1 h1, .layer_4_1 h1{ font-size:49px;}
  .layer_2 h2, .layer_1_1 h2, .layer_4_1 h2{font-size:50px;}
  .main-back-circle{ height:172px; }
  .anim-count span {font-size: 38px;}
   #doller {font-size: 50px;}
   #anim5-count-number0 {font-size: 50px;}
   #mwh {font-size: 50px; }
   .anim-count { padding-top: 200px; font-size: 19px;}
   .main-back { margin-right: 47px;}
   .brand_co .main-back { margin-right: 41px;}
   #plus-anim3{font-size: 29px;}
   #billion {font-size: 32px;}
   .main-back { margin-right:47px;}
   .layer_2_2.clicked {  height: 280px;width: 300px; }
   .timeline{margin:-38px auto 0 auto;}
   .about_sec1 { width: 1155px; }
   .about_sec4 { width: 1155px; }
   .team_c h1 { font-size: 29px; }
   .team_c h2 { font-size: 15px; }
   .sec3_l h2 { font-size: 241px; }
   .layer_7{ width: 40%; }

}​






/*@media only screen and (min-width : 992px) and (max-width : 1199px){

  .layer{top: 31%; }
  .layer h1{ font-size: 75px; }
  .layer h2 { font-size: 95px; line-height: 97px;}
  .navi_show{margin: 120px 26px;}
  .parent {width: 34%; height: 520px;}
  .layer_2.clicked, .layer_1_1.clicked { height: 438px; width: 347px;}
  .layer_2, .layer_1_1 {margin-left: 10%; }
  .layer_2 h1, .layer_1_1 h1, .layer_4_1 h1{ font-size:90px;}
  .layer_2 h2, .layer_1_1 h2, .layer_4_1 h2{font-size:90px;}
  .main-back-circle{ height:142px; }
 

}




@media only screen and (max-width:767px){
    .main-back-circle{ height:108px; }
}​



@media only screen and (min-width:767px) and (max-width:991px){
    .main-back-circle{ height:120px; }
}​*/



/*@media only screen and (min-width : 2824px) {
  .layer{top: 31%; }
  .layer h1{ font-size: 75px; }
  .layer h2 { font-size: 95px; line-height: 97px;}
  .navi_show{margin: 120px 26px;}
  .parent {width: 34%; height: 520px;}
  .layer_2.clicked, .layer_1_1.clicked { height: 438px; width: 347px;}
  .layer_2, .layer_1_1 {margin-left: 10%; }
  .layer_2 h1, .layer_1_1 h1, .layer_4_1 h1{ font-size:90px;}
  .layer_2 h2, .layer_1_1 h2, .layer_4_1 h2{font-size:90px;}
  .main-back-circle{height:172px;}
 
}*/





/*@media only screen and (min-width : 1200px) {
  .main-back-circle{height:193px;}

}*/


.ldlogin { display: none !important; }