.navbar-right{
  float: left!important;    padding-left: 50px;
}

@font-face {
    font-family: 'Gotham Rounded Book';
    src: url('../fonts/GothamRounded-Book.woff2') format('woff2'),
        url('../fonts/GothamRounded-Book.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Gotham Rounded';
    src: url('../fonts/GothamRounded-MediumItalic.woff2') format('woff2'),
        url('../fonts/GothamRounded-MediumItalic.woff') format('woff');
    font-weight: 500;
    font-style: italic;
}

@font-face {
    font-family: 'Gotham Rounded Book';
    src: url('../fonts/GothamRounded-BookItalic.woff2') format('woff2'),
        url('../fonts/GothamRounded-BookItalic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'Gotham Rounded';
    src: url('../fonts/GothamRounded-LightItalic.woff2') format('woff2'),
        url('../fonts/GothamRounded-LightItalic.woff') format('woff');
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: 'Gotham Rounded';
    src: url('../fonts/GothamRounded-Bold.woff2') format('woff2'),
        url('../fonts/GothamRounded-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Gotham Rounded';
    src: url('../fonts/GothamRounded-BoldItalic.woff2') format('woff2'),
        url('../fonts/GothamRounded-BoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
}

@font-face {
    font-family: 'Gotham Rounded Book';
    src: url('../fonts/GothamRounded-Book.woff2') format('woff2'),
        url('../fonts/GothamRounded-Book.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Gotham Rounded';
    src: url('../fonts/GothamRounded-MediumItalic.woff2') format('woff2'),
        url('../fonts/GothamRounded-MediumItalic.woff') format('woff');
    font-weight: 500;
    font-style: italic;
}

@font-face {
    font-family: 'Gotham Rounded';
    src: url('../fonts/GothamRounded-Bold.woff2') format('woff2'),
        url('../fonts/GothamRounded-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Gotham Rounded';
    src: url('../fonts/GothamRounded-Medium.woff2') format('woff2'),
        url('../fonts/GothamRounded-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Gotham Rounded';
    src: url('../fonts/GothamRounded-Light.woff2') format('woff2'),
        url('../fonts/GothamRounded-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Gotham Rounded';
    src: url('../fonts/GothamRounded-Light.woff2') format('woff2'),
        url('../fonts/GothamRounded-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Gotham Rounded';
    src: url('../fonts/GothamRounded-BoldItalic.woff2') format('woff2'),
        url('../fonts/GothamRounded-BoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
}

@font-face {
    font-family: 'Gotham Rounded';
    src: url('../fonts/GothamRounded-Medium.woff2') format('woff2'),
        url('../fonts/GothamRounded-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Gotham Rounded Book';
    src: url('../fonts/GothamRounded-BookItalic.woff2') format('woff2'),
        url('../fonts/GothamRounded-BookItalic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'Gotham Rounded';
    src: url('../fonts/GothamRounded-LightItalic.woff2') format('woff2'),
        url('../fonts/GothamRounded-LightItalic.woff') format('woff');
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: 'Droid Arabic Kufi';
    src: url('../fonts/DroidArabicKufi.woff2') format('woff2'),
        url('../fonts/DroidArabicKufi.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Droid Arabic Kufi';
    src: url('../fonts/DroidArabicKufi-Bold.woff2') format('woff2'),
        url('../fonts/DroidArabicKufi-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}


@media (min-width: 1200px){
.container {
    /*width: 1336px;*/
}

}
.built{
 color: #fff;font-style: italic;font-weight: normal;text-align: center;margin-top: 15px;
 z-index: 1;position: relative;
}
body {
    opacity: 1;
    transition: 1s opacity;
}
body.fade-out {
    opacity: 0;
    transition: none;
}
body,
html {
  height: 100%;
  margin: 0;
  font-family: 'Gotham Rounded';
  font-style: 300;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.download-section{
  display: none
}

.grayscale * {
    filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
    filter: gray; /* IE6-9 */
    transition: all 0.5s linear;
        -webkit-filter: blur(1px);
        filter: blur(1px);
}

/*wave*/

@keyframes move_wave {
    0% {
        transform: translateX(0) translateZ(0) scaleY(1)
    }
    50% {
        transform: translateX(-25%) translateZ(0) scaleY(0.55)
    }
    100% {
        transform: translateX(-50%) translateZ(0) scaleY(1)
    }
}
@keyframes move_wave_top {
    0% {
        transform: translateX(0) translateZ(0) scaleY(1)
    }
    50% {
        transform: translateX(25%) translateZ(0) scaleY(0.55)
    }
    100% {
        transform: translateX(50%) translateZ(0) scaleY(1)
    }
}
.waveWrapper {
    overflow: hidden;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0px;
    margin: auto;
}
.waveWrapperInner {
    position: absolute;
    width: 100%;
    overflow: hidden;
    height: 100%;
    bottom: 0px;
    /*background-image: linear-gradient(to top, #86377b 20%, #27273c 80%);*/
}
.bgTop {
    z-index: 15;
    opacity: 0.5;
}
.bgMiddle {
    z-index: 10;
    opacity: 0.75;
}
.bgBottom {
    z-index: 1;
}
.card-block{
  display: block;
}
.wave {
    position: absolute;
    left: 0;
    width: 200%;
    height: 100%;
    background-repeat: repeat no-repeat;
    background-position: 0 bottom;
    transform-origin: center bottom;
}
.waveTop {
    background-size: 50% 100px;
}
.waveAnimation .waveTop {
  animation: move_wave_top 9s;
   -webkit-animation: move_wave_top 9s;
   -webkit-animation-delay: 1s;
   animation-delay: 1s;
   animation-iteration-count: 1;
}
.waveMiddle {
    background-size: 50% 120px;
}
.waveAnimation .waveMiddle {
    /*animation: move_wave_top 9s linear ;*/
    animation-iteration-count: 1;
}
.waveBottom {
    background-size: 50% 100px;
}
.waveAnimation .waveBottom {
    animation: move_wave 9s linear ;
    animation-iteration-count: infinite;
}


/*wave*/


/*carousel*/


/* Carousel Fading slide */
.carousel-fade .carousel-inner {  }
.carousel-fade .carousel-control { z-index: 2; }  
.carousel-fade .item {
  opacity: 0;
  -webkit-transition-property: opacity;
  -moz-transition-property: opacity;
  -o-transition-property: opacity;
  transition-property: opacity;
  }

  .carousel-fade .next.left,
  .carousel-fade .prev.right,
  .carousel-fade .item.active { opacity: 1; }

  .carousel-fade .active.left,
  .carousel-fade .active.right {
    left: 0;
    opacity: 0;
    z-index: 1;
    }


/* Safari Fix */
@media all and (transform-3d), (-webkit-transform-3d) {
    .carousel-fade .carousel-inner > .item.next,
    .carousel-fade .carousel-inner > .item.active.right {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.prev,
    .carousel-fade .carousel-inner > .item.active.left {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.next.left,
    .carousel-fade .carousel-inner > .item.prev.right,
    .carousel-fade .carousel-inner > .item.active {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
}


.carousel-control.left,.carousel-control.right{
  background-image: none;
}

/*carousel*/


body{overflow-x:hidden;}
.navbar {
  overflow: hidden;
   background-color: #fff; 
  position: fixed;
  top: 0;
  width: 100%;
  /*padding: 25px 25px 50px;*/
}
.innersection .navbar{
  position: static;
  /*background: #fff*/
}
.swiper-wrapper{
  transition-timing-function: linear !important;
}
 .navbar {
  /*padding: 30px 15px 18px;*/
  padding: 14px 15px;
  margin-bottom: 0
}
 .navbar-nav>li>a{}
.last-list{position: relative;top:-10px;}
.navbar-brand {
  padding: 0
}

.navbar {
  /*min-height: 100px*/
}

.navbar-brand>img {
  width: 210px
}
.flex-sm{
  display: flex;align-items:center;
}
.object-section{}
.hero .container{
  z-index: 16
}

.hero ,.soccer-section,.object-section,.role-section,.work-section{
  background: url("../images/hero2.png") #fff;
 /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#3826b0+0,b062d1+100 */
/*background: #3826b0;
background: -moz-linear-gradient(left, #3826b0 0%, #b062d1 100%); 
background: -webkit-linear-gradient(left, #3826b0 0%,#b062d1 100%);
background: linear-gradient(to right, #3826b0 0%,#b062d1 100%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3826b0', endColorstr='#b062d1',GradientType=1 ); */
  height: 75%;
  /* Center and scale the image nicely */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  /*background-attachment: fixed;*/
}
.each-stat .circle{
  position: relative;
}
.counter-value{
  position: relative;top: 14px
}
.each-stat .circle span.percentage{
  position: relative;top: 10px
}
.each-stat .circle:after {
  content: '';
  width: 0; 
  height: 0; 
    border-left: 13px solid transparent;
    border-right: 13px solid transparent;
    border-top: 13px solid #F2F3F5;
       position: absolute;
    bottom: -10px;
}
.heat-hero{
  background: url("../images/SliderImage@2x.png") #fff;
  /*height: 50%;*/
  /* Center and scale the image nicely */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  /*background-attachment: fixed;*/
  padding-top: 100px;
  padding-bottom: 100px;   
}
.auto{
  margin: 0 auto
}
.navbar-default .navbar-nav>.active>a{
  background-color: transparent;
}
body.aboutpage{
  /*background: #EEF2F6*/
}
.heat-hero,.aboutx-hero{
  display: flex;align-items:center;
}
.aboutx-hero{
  background: url("../images/BannerRed@2x.png");
  height:70%;
  /* Center and scale the image nicely */
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  /*background-attachment: fixed;*/
  padding-top: 0px;
  padding-bottom: 0; 
  position: relative;
  top: -138px
}

.audit-hero a.btn-audit{
  min-width: 136px;min-height: 34px;
    border-radius: 4px; background-color: #FFFFFF; 
     /*box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2), 0 2px 4px 0 rgba(100,100,100,0.2);*/
      color: #5D3BBD; font-family: "Gotham Rounded";  font-size: 14px;  font-weight: bold;  
      letter-spacing: 1px;
       /*line-height: 17px;  */
       text-align: center; text-shadow: 0 0 1px rgba(27,141,90,0.5);
}
.audit-hero a.btn-audit:hover{
  transition: all 0.5s linear;box-shadow: 0 3px 10px 0 rgba(256,256,256,0.5);
}
.heat-hero a.btn-audit{
  min-width: 136px;min-height: 34px;
    border-radius: 4px; background-color: #FFFFFF; 
     /*box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2), 0 2px 4px 0 rgba(100,100,100,0.2);*/
      color: #e94a6b; font-family: "Gotham Rounded";  font-size: 14px;  font-weight: bold;  
      letter-spacing: 1px;
       /*line-height: 17px;  */
       text-align: center; text-shadow: 0 0 1px rgba(27,141,90,0.5);
}
.usability-hero a.btn-audit{
    color: #08597A;
}
.surveys-hero a.btn-audit{
  color: #0E80B5;
}
.audit-hero.design-hero a.btn-audit{
  color: #DF811F;
}
.audit-hero.analytics-hero a.btn-audit{
  color:#2B8993
}
.audit-hero,.usability-hero{
  background: url("../images/audit/SliderImage.png") #fff;
  /*height: 50%;*/
  /* Center and scale the image nicely */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  /*background-attachment: fixed;*/
  padding-top: 100px;
  padding-bottom: 100px;   

}
.audit-hero{
   background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  /*background-attachment: fixed;*/
  padding-top: 100px;
  padding-bottom: 20px; 
}

.moh-hero{
   background: url("../images/bannermoh@2x.png") #fff;
  height: 80%;
  /* Center and scale the image nicely */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  /*background-attachment: fixed;*/
  padding-top: 50px;
  padding-bottom: 100px;   

}
.usability-hero{
  background: url("../images/usability@2x.png") #fff;
   background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  /*background-attachment: fixed;*/
  padding-top: 100px;
  padding-bottom: 20px; 
  }
  .surveys-hero{
     background: url("../images/surveys@2x.png") #fff;
      background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  /*background-attachment: fixed;*/
  padding-top: 100px;
  padding-bottom: 20px; 
  }
  .analytics-hero{
     background: url("../images/analyticsImage@2x.png") #fff;
      background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  /*background-attachment: fixed;*/
  padding-top: 100px;
  padding-bottom: 20px; 
  }
  .design-he
  .surveys-hero{
     background: url("../images/surveys@2x.png") #fff;
      background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  /*background-attachment: fixed;*/
  padding-top: 100px;
  padding-bottom: 20px; 
  }
  .design-hero{
     background: url("../images/designshero@2x.png") #fff;
      background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  /*background-attachment: fixed;*/
  padding-top: 100px;
  padding-bottom: 20px; 
  }
  .audit-hero, .usability-hero,.survey-hero,.heat-hero,.design-hero{
margin-top: 78px
  }
    width: 65px;
  .cx-moh-section img {
  }
  .cx-moh-section h1{
    color: #2E3444; font-family: "Gotham Rounded";  font-size: 22px;  font-weight: 500; line-height: 27px;
  }
  .cx-moh-section p{
      color: #2E3444; font-family: "Gotham Rounded";  font-size: 15px;  font-weight: 300;   line-height: 20px;
}
.audit-hero,.usability-hero,.design-hero{
  display: block;
  align-items:center;
}
.audit-hero.moh-hero{
  display: flex;align-items:flex-start;
}
.form-group label.hint{
  position: relative;top:30px;color: #8A93A3!important;font-weight: 300
}
label.hint i{
  position: relative;top:-2px;display: inline-block;padding-right: 3px
}label.hint i img{
  width: 13px;opacity: 0.5
}
.heat-map{
  background: url("../images/Heatmapbg@2x.png") #fff;
  /*height: 50%;*/
  /* Center and scale the image nicely */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  /*background-attachment: fixed;*/
  padding-top: 80px;
  padding-bottom: 80px;   display: flex;align-items:center;    margin: 100px auto;
}
.audit-map,.usability-map{
   background: url("../images/audit/bg_cost.png") #fff;
  /*height: 50%;*/
  /* Center and scale the image nicely */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  /*background-attachment: fixed;*/
  padding-top: 80px;
  padding-bottom: 80px;   display: flex;align-items:center;    margin: 100px auto;
}
.audit-map{
  padding-top: 40px;
  padding-bottom: 40px; 
}
.usability-map{
   background: url("../images/uxmap@2x.png") #fff;
  /*height: 50%;*/
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  /*background-attachment: fixed;*/
  padding-top: 50px;
  padding-bottom: 50px;   display: flex;align-items:center;    margin: 100px auto;
}
.design-map{
  display: none!important;
   background: url("../images/deign-map@2x.png") #fff;
  /*height: 50%;*/
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  /*background-attachment: fixed;*/
  padding-top: 50px;
  padding-bottom: 50px;   display: flex;align-items:center;    margin: 100px auto;
}
.analytics-map{
   background: url("../images/map7@2x.png") #fff;
  /*height: 50%;*/
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  /*background-attachment: fixed;*/
  padding-top: 50px;
  padding-bottom: 50px;   display: flex;align-items:center;    margin: 100px auto;
}
.survey-map{
  background: url("../images/survey-map@2x.png") #fff;
   background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  /*background-attachment: fixed;*/
  padding-top: 40px;
  padding-bottom: 40px; display: flex;align-items:flex-end;
}
.heat-map .media,.audit-map .media,.usability-map .media{
      display: flex;
    align-items: center;
}
.heat-map .media-left img,.audit-map .media-left img,.usability-map .media-left img{
  margin-right: 50px;
}
.survey-map .media{
  overflow: visible;
}
.survey-map .media-left{
  position: relative;
  /*bottom: -40px*/
}
.heat-map h1,.audit-map h1,.usability-map h1{
  margin-top: 0;
  color: #FFFFFF; font-family: "Gotham Rounded";  font-size: 30px;  font-weight: 500; line-height: 43px;
}
.custom-select.bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn){
  /*width: 50%;float: left;margin-right: 15px*/
}
.bootstrap-select>.dropdown-toggle{

}
.no-rgt-margin{
  margin-right: 0!important
}
.heat-map .media-body p,.audit-map .media-body p,.usability-map .media-body p{
  margin-bottom: 0;
  color: #FFFFFF; font-family: "Gotham Rounded";  font-size: 15px;  font-weight: 300;   line-height: 25px;
}

.statistics {
  display: flex; justify-content:space-between;
}
.cx-benefit-section{
  padding-top: 80px;padding-bottom: 80px;
}
.cx-benefit-section h1{
  margin-top: 0;margin-bottom: 60px;
  color: #2D3445; font-family: "Gotham Rounded";  font-size: 30px;  font-weight: 500; line-height: 43px;
}
.each-stat{
  /*margin-bottom: 15px*/
}
.cx-aboutus-section{
  background: #fff;
  /*display: none*/
}
.cx-aboutus-section h1{
  color: #2E3444; font-family: "Gotham Rounded";  font-size: 28px;  font-weight: 500; line-height: 43px;  text-align: center;
}

.cx-aboutus-section h2{
  color: #474B54; font-family: "Gotham Rounded";  font-size: 22px;  font-weight: 300; line-height: 31px;  text-align: center;
}

.each-stat .circle{
  margin: 0 auto 18px;
    display: flex;align-items:center;justify-content:center;
    flex-direction:column;
  border-radius: 50%;
  background-color: #F2F3F5;
  width: 100px;height: 100px;
  color: #2C314A; font-family: "Gotham Rounded";  font-size: 24px;  font-weight: 500;  line-height: 30px;  text-align: center;
}
.each-stat .circle span.percentage{
    color: #2C314A; font-family: "Gotham Rounded";  font-size: 17px;  font-weight: 300;   line-height: 30px;  text-align: center;display: block
}
.each-stat  p{
color: #2C3149; font-family: "Gotham Rounded";  font-size: 15px;  font-weight: 300;   line-height: 21px;  text-align: center;
}
.moh-hero img.img-responsive{
  max-width: 150px
}
.position{
  position: relative;
  text-align: right;
}
.moh-hero .position img{
  max-width: 275px;
  position: absolute;
  right: 0;    
  /*top: -75px;*/
}
.audit-hero.moh-hero h1.maintag{
  margin-bottom: 0;
  color: #F8E71C; 
  font-family: "Gotham Rounded";  font-size: 18px;  font-weight: bold;
    letter-spacing: 4.46px; line-height: 50px;text-transform: uppercase;
}
.audit-hero.moh-hero h1{
    color: #FFFFFF; font-family: "Gotham Rounded";  font-size: 25px;  font-weight: 500; line-height: 30px;
}
.audit-hero.moh-hero p{
    opacity: 0.85;  color: #FFFFFF; font-family: "Gotham Rounded";  font-size: 16px;  font-weight: 300;
}
.heat-hero h1,.audit-hero h1{

  color: #FFFFFF;
  font-family: "Gotham Rounded";
  font-size: 42px;
  font-weight: 500;
  line-height: 43px;
  text-align: center;
  text-shadow: 0 2px 4px rgba(0,0,0,0.14);
margin-top: 0
}
.audit-hero.moh-hero h1,.audit-hero.moh-hero p{
  text-align: left;
}
.cx-aboutus-section{
  position: relative;
  /*top:200px;*/
}
.heat-hero.aboutx-hero h1{
/*margin-bottom: 80px*/
}
.cx-about-section{
  position: relative;
  top: -115px;
/* padding-top: 80px;*/
    padding-bottom: 80px;
    background: url("../images/masking2@2x.png") no-repeat 0 bottom;
    background-size: contain;
    /*background-position: bottom;*/
}
.mainpanel{

}
.cx-aboutus-section {
    position: relative;
    top: -90px;
    padding-top: 50px;
    padding-bottom: 0px
}
.processImgs{
    position: relative;
    /*margin: 15px auto*/
}
.processImgs .graphImg{
  position: absolute;
  left:-50px;
  right: 0;
  margin: 0 auto;
  width: 219px;
}
.processImgs .graphImg2{
   width: 163px;    left: 5px;
}
.processsteps{
  display: flex;flex-direction:row;
  margin: 50px auto
}
.processstep{
  flex-grow: 1;
}
.processstep img.processIcon{
  width: 84px;
  margin: 25px auto
}
.processstep h1{
    color: #6933CD; font-family: "Gotham Rounded";  font-size: 18px;  font-weight: 500;  line-height: 22px;
}
.processstep h1.purple{
  color: #6933CD
}
a.uxlabs{
  color: #4a30b5;text-decoration: underline;

}
.cx-about-section h2.offices{
  font-style: italic;margin-bottom: 30px;margin-top: 30px;font-weight: 500
}
.gal-flex{
  display: flex;
      justify-content: space-between;
    align-items: flex-end;
}
.gal-flex  .gal img{
  width: 70px;margin-bottom: 20px;
}
.gal{
  position: relative;
}
.gal:after{
  content:"";
  position: absolute;
  width: 4px;height: 4px;
  opacity: 0.7; background-color: #2E3444;bottom:0;right: 0;border-radius: 50%;
      bottom: 12px;
    right: -34px;
}
.gal:last-child:after{
  background-color: transparent;
}
.gal-flex .gal  p {
      color: #2E3444;
    font-family: "Gotham Rounded";
    font-size: 13px;
    font-weight: 500;
    line-height: 8px;text-align: center;
}
.mainpanel{
  background-color: #EEF2F6;
    /*background-color: red*/
 background: rgba(238,242,246,1);
background: -moz-linear-gradient(top, rgba(238,242,246,1) 0%, rgba(238,242,246,1) 82%, rgba(255,255,255,1) 85%, rgba(255,255,255,0) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(238,242,246,1)), color-stop(82%, rgba(238,242,246,1)), color-stop(85%, rgba(255,255,255,1)), color-stop(100%, rgba(255,255,255,0)));
background: -webkit-linear-gradient(top, rgba(238,242,246,1) 0%, rgba(238,242,246,1) 82%, rgba(255,255,255,1) 85%, rgba(255,255,255,0) 100%);
background: -o-linear-gradient(top, rgba(238,242,246,1) 0%, rgba(238,242,246,1) 82%, rgba(255,255,255,1) 85%, rgba(255,255,255,0) 100%);
background: -ms-linear-gradient(top, rgba(238,242,246,1) 0%, rgba(238,242,246,1) 82%, rgba(255,255,255,1) 85%, rgba(255,255,255,0) 100%);
background: linear-gradient(to bottom, rgba(238,242,246,1) 0%, rgba(238,242,246,1) 82%, rgba(255,255,255,1) 85%, rgba(255,255,255,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eef2f6', endColorstr='#ffffff', GradientType=0 );
}
a.uxlabs:focus,a.uxlabs:active,a.uxlabs:visited,a.uxlabs:hover{
      color: #4a30b5!important;
}
.cx-about-section h1{
  color: #E4669A; font-family: "Gotham Rounded";  font-size: 18px;  font-weight: bold;   line-height:20px; text-align: center;
  letter-spacing: 4.46px;text-transform: uppercase;margin-top: 0
}
.cx-about-section h2{
    color: #2E3444; color: #2E3444; font-family: "Gotham Rounded";  font-size: 20px;  font-weight: 300;   line-height: 28px;  text-align: center;
}
.cx-about-section h4{
    color: #2E3444; font-family: "Gotham Rounded";  font-size: 22px;  font-weight: 500; line-height: 30px;
}
hr.line{
  border-bottom: 1px solid #DCE3E8;margin-left: 15px;margin-right: 15px
}
.logoboxes{
  margin: 100px auto;
  display: flex
}
.box-container{
  border: 1px solid #E5EDF3;  border-radius: 5px; background-color: #FFFFFF; 
  margin: 0 auto;padding: 50px 25px;width: 350px;position: relative;
  cursor: pointer;
}
.box-container a.learn-btn{
  position: absolute;
  right: 30px;
  bottom: -18px;
  visibility:hidden;
}
.box-container:hover{
  border: none;
   box-shadow: 0 6px 6px 0 rgba(0,62,100,0.09);
    transition: all 1s linear;
}
.box-container:hover a.learn-btn{
   visibility:visible;
    transition: all 1s linear;
}


hr {
    border-bottom: 1px solid #DCE3E8;
    margin-left: 15px;
    margin-right: 15px;
}
.box-container.active{
  /*border: 1px solid #fff*/
}
.box-container h1{
  color: #2E3444; font-family: "Gotham Rounded";  font-size: 17px;  font-weight: 500;  line-height: 24px;
}
.box-container p{
    color: #2E3444; font-family: "Gotham Rounded";  font-size: 16px;  font-weight: 300;  line-height: 24px;
}
.countries{
  /*border: 1px solid #DCE3E8;*/
}
.heat-hero p,.audit-hero p{
 
  color: #FFFFFF;
  font-family: "Gotham Rounded";
  font-size: 18px;
  font-weight: 300;
  /*letter-spacing: -0.42px;*/
  line-height: 27px;
  text-align: center;
  text-shadow: 0 2px 4px  rgba(0,0,0,0.14);

}
.flex_container{
  margin: 30px auto
}
.small-box{
  width:75%;
  padding:  25px 100px;
    border-radius: 6px; background-color: #F1F2F4;  box-shadow: 0 6px 36px 0 rgba(0,62,100,0.09);
  margin: 30px auto 30px;
  color: #2E3444; font-family: "Gotham Rounded";  font-size: 17px;  font-style: italic; font-weight: 300;  line-height: 23px;  text-align: center;
}
.arrow-flex.flex-small{
      padding-bottom: 16px;
}
.cx-about-section p{
    color: #2E3444; font-family: "Gotham Rounded";  font-size: 16px;  font-weight: 300;  line-height: 22px;
}

.innersection .arrow-flex.flex-small p{
  color: #2E3444; font-family: "Gotham Rounded";  font-size: 15px;  font-weight: 500;   line-height: 8px;
}
.innersection .arrow-flex.flex-small img{
  width: 11px
}

.aboutx-hero h1{
  margin-top:250px;margin-bottom: 90px
}
.aboutx-hero img.img-responsive{
  position: relative;
}
.audit-hero p,.heat-hero p{
  margin-bottom: 35px
}
.soccer-section,.work-section{height: 80%;display: flex;align-items:center;}
.soccer-section,.object-section,.role-section,.work-section{background: url("../images/play-soccer.png") no-repeat #422bb2 fixed;
position: relative;top: 110px;
padding-top: 50px ;
padding-bottom: 50px;
background-size: cover
}
.object-section,.role-section{
  background: url("../images/paralympic-bg.png") no-repeat #422bb2 fixed;
  background-size: cover;
  display: flex;
  align-items: center
}
.role-section{
  background: url("../images/massparticipation-bg.png") no-repeat #422bb2 fixed;
  background-size: cover;
}


.work-section{
   background: url("../images/work.png") no-repeat #422bb2 fixed;
  background-size: cover;
}
body {
  margin: 0;
  padding: 0;
  background-color: #fff;
}

header nav {
  /* text-align: right; */
  /* background: rgba(0,0,0,0.6); */
  color: white;
  font-size: 1em;
  position: fixed;
  width: 100%;
}


.navbar>.container .navbar-brand, .navbar>.container-fluid .navbar-brand{
  margin-left: 0
}
.swiper-container-2{
  margin-top: 50px
}
.navbar-default .navbar-nav>.active>a,
.navbar-default .navbar-nav>.active>a:focus,
.navbar-default .navbar-nav>.active>a:hover,.navbar-default .navbar-nav>a:hover,
.navbar-nav>.active>a {
 /* background-color: #fff;*/
  color: #fff;
  transition: all 0.5s linear;
}
.navbar-default .navbar-nav>li:hover>a{
 color: #fff;
  transition: all 0.5s linear;
}
.navbar-default .navbar-nav>li>a {
 color: #fff;
  text-transform: uppercase;font-size: 14px;  font-weight: 500; letter-spacing: 1px;
}

.navbar-default .navbar-nav>li>a.btn-warning{
  border: 1px solid #ECECF2;  border-radius: 4px; background-color: #FFFFFF;color: #7243C0;
}

.full-width{width: 100%}
nav .btn-primary {
  border-radius: 30px;
  background: rgba(228, 155, 37, 1);
  background: -moz-linear-gradient(left, rgba(228, 155, 37, 1) 0%, rgba(232, 71, 146, 1) 100%);
  background: -webkit-gradient(left top, right top, color-stop(0%, rgba(228, 155, 37, 1)), color-stop(100%, rgba(232, 71, 146, 1)));
  background: -webkit-linear-gradient(left, rgba(228, 155, 37, 1) 0%, rgba(232, 71, 146, 1) 100%);
  background: -o-linear-gradient(left, rgba(228, 155, 37, 1) 0%, rgba(232, 71, 146, 1) 100%);
  background: -ms-linear-gradient(left, rgba(228, 155, 37, 1) 0%, rgba(232, 71, 146, 1) 100%);
  background: linear-gradient(to right, rgba(228, 155, 37, 1) 0%, rgba(232, 71, 146, 1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e49b25', endColorstr='#e84792', GradientType=1);
  border: none;
  font-size: 13px
}

.navbar-default {
  z-index: 100px
}

.container {
  position: relative;
}

.hero {
  display: flex;
  align-items: center;
}
.navbar-brand a{top: 0}
.add-margin {
  /*margin-left: 100px;*/
  position: relative;
    top: 6px;
}

.nav>li>a {
 padding: 8px 10px 
}
.macbook{
  /*width: 100%*/
  position: absolute;bottom: -100px;
    z-index: 1;
}
.fullimg{

  position: relative;z-index: 2
}
.form-control,.btn-group .btn-default{
  height: 36px;border: 1px solid #d4dee7;    box-shadow: none;outline:none; 
}
.form-control{
  /*height: 40px*/
}

.multiselect-selected-text, .filter-option{
  /* color: #474B54;
   opacity: 0.5*/
}
.macbook:before{
  /*content: url(../images/Rectangle@2x.png);
  position: absolute;bottom: 0;
  left:0;right: 0;margin: 0 auto*/
}
.hero ul {
  margin: 0 0 25px 0;
  padding: 0
}
.card img.img-responsive{
  /*height: 175px;width: 100%*/
}
.portfolio-image{
  display: block;
    width: 100%;
    height: 175px;
}
.swiper-slide{background: transparent!important;}
.portfolio-image img{
      width: 100%;
    object-fit: cover;
    height: 100%;
}
.navbar-default .navbar-nav>li>a.btn.btn-success{
  margin:0 10px;background:#33BC7F;color: #fff;border: none;box-shadow: none
}
.navbar-default .navbar-nav>li>a.btn{
  width: 140px
}
.navbar-default .navbar-nav>li>a.btn-warning{
  width: 110px
}
.navbar-default .container{top:4px;}
.hero .container .row .btn-success{
  padding: 10px 15px;border: none;
  min-width: 170px;
  /*text-transform: uppercase;*/
    font-size: 15px;  background-color: #33BC7F;
    font-weight: 500;
    letter-spacing: 1px;
  border-radius: 4px; 
   /*box-shadow: 0 2px 3px 0 rgba(188,188,188,0.1), 0 2px 3px 0 rgba(188,188,188,0.1);*/
   color: #fff
}
.hero h1 {
  color: #FFFFFF;  font-size: 30px;  font-weight: 500; line-height: 40px;margin-bottom: 25px;margin-top: 0
}
.hero .row{
  display: flex;align-items:center;
}
.hero p{
  margin-bottom: 0
}
.hero p.para {
opacity: 0.8; color: #FFFFFF; font-size: 21px;  font-weight: 300; letter-spacing: -0.63px;  line-height: 31px;
margin-bottom: 35px
}

.hero ul li {
  list-style-type: none;
  /*background-color: rgba(0,0,0,0.3);*/
  font-size: 28px;
  color: #fff;
  font-weight: bold;
  margin-bottom: 3px;
  padding: 10px 10px;
  position: relative;
  display: inline-block
}

.navbar-default {
  z-index: 100
}

.hero {
  position: relative;
}

.navbar-nav>li>a {
  font-size: 16px
}

.btn-default,.hero .btn-default {
  border-radius: 30px;
  background-color: transparent;
  font-size: 12px;
  border: 1px solid #C9CED6;
}

.btn-default,
.btn-primary {
  height: 36px;
  /*line-height: 4px!important;*/
  margin: 5px 10px
}

h3.confirm{
  color: #0A2D19; font-size: 18px;  font-weight: bold;  line-height: 23px;  text-shadow: 0 2px 24px 0 rgba(0,0,0,0.5);margin-bottom: 30px;
    margin-top: 0;

  }


  .cv-box{
      border: 2px dashed #E9EBEE;
      padding: 25px
  }
.input-group-addon{background: transparent;border:1px solid #E1E4E8;}
.cv-box label{
  display: block;
  margin-bottom: 10px
}
.cv-icon{position: relative;top:10px;}
  .upload-btn-wrapper {
  position: relative;
  overflow: hidden;
  display: inline-block;
}

 .upload-btn-wrapper .btn {
  border: 1px solid #0BB07B; 
   border-radius: 30px!important;
   color:#008a5c;
  background-color: white;
  padding:10px 35px;
  
  font-size: 14px;
  /*font-weight: bold;*/
  cursor: pointer
}

.upload-btn-wrapper input[type=file] {
  /*font-size: 100px;*/
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
}
 input[type=text] {
  font-weight: normal;
 }
::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #474B54;opacity: 0.5;font-weight: normal;
}
::-moz-placeholder { /* Firefox 19+ */
  color: #474B54;opacity: 0.5;font-weight: normal;
}
:-ms-input-placeholder { /* IE 10+ */
  color: #474B54;opacity: 0.5;font-weight: normal;
}
:-moz-placeholder { /* Firefox 18- */
  color: #474B54;opacity: 0.5;font-weight: normal;
}
select option{
  color: #474B54;opacity: 0.5;font-weight: normal;
}
.navbar-default .navbar-toggle,.navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover {
        background-color: #b22bfb;    border-color: #b22bfb;
}
.bs-caret .caret{
  border: none
}
.hint{display: block;color: #9E9E9E;  font-size: 12px;  line-height: 15px;margin-top: 8px}
.btn-group .btn-default{border:1px solid #E1E4E8 ;border-radius: 4px;
    height: 36px;
margin-top: 0;margin-bottom: 0
  }
.navbar-default {
  background-color: transparent;
  border: none;border-radius: 0
}

.hero .btn-default,
.hero .btn-primary {
  margin-right: 0;
  min-width: 250px;
  line-height: 35px!important;
  font-size: 19px;
  padding: 10px 10px;
  min-height: 56px;
}

.hero .btn-default {
  padding: 10px
}

.hero .btn-default {
  background-color: transparent;
  font-size: 12px;
  border: 1px solid #C9CED6;margin: 0;
  color: #fff;
  position: relative;
  /*width: 325px*/
}

.hero .btn-default span {
  position: absolute;
  right: 0;
  top: 0
}

.active {
  background: rgba(255, 255, 255, 0);
}

#toTop img {
  width: 50px;
}

#toTop img:hover {
  cursor: pointer;
}

nav img {
  z-index: 1000;
  /* height: 2.5em; */
  /* position: absolute;
    left: 40px;
    top: 10px; */
  transition: all 0.5s linear;
}

.dark {
  background: rgba(0, 76, 50, 0.1);
  min-height: auto;
  border-radius: 0;
  transition: all 1s ease-in-out
}
.btn-warning{
  border:1px solid #000;background: #fff
}
.navbar.darks {
  padding: 14px 15px 14px;transition: all 0.5s ease-in-out
}
.navbar-brand>img.onscrolllogo,.innersection .navbar-brand>img.onloadlogo{display: none}
.darks .onloadlogo{
  display: none; transition: all 0.5s ease-in-out
}
.innersection .navbar{
  position: fixed;
  transition: all 0.5s linear
}
.innersection .darks.navbar{
  /*position: fixed;*/
  transition: all 0.5s linear
}
.darks .navbar-brand>img.onscrolllogo,.innersection .navbar-brand>img.onscrolllogo{
  display: block; transition: all 0.5s ease-in-out
}
.navbar-default.darks  .navbar-nav>li>a,.innersection .navbar-default .navbar-nav>li>a{
    opacity: 0.8;
    color: #14181E;
    transition: all 1s ease-in-out
}
.darks {
-webkit-box-shadow: 1px 2px 3px 0px rgba(0,0,0,0.15);
-moz-box-shadow: 1px 2px 3px 0px rgba(0,0,0,0.15);
box-shadow: 1px 2px 3px 0px rgba(0,0,0,0.15);

/* background: rgba(58,39,176,1);
background: -moz-linear-gradient(left, rgba(58,39,176,1) 0%, rgba(170,95,207,1) 100%);
background: -webkit-gradient(left top, right top, color-stop(0%, rgba(58,39,176,1)), color-stop(100%, rgba(170,95,207,1)));
background: -webkit-linear-gradient(left, rgba(58,39,176,1) 0%, rgba(170,95,207,1) 100%);
background: -o-linear-gradient(left, rgba(58,39,176,1) 0%, rgba(170,95,207,1) 100%);
background: -ms-linear-gradient(left, rgba(58,39,176,1) 0%, rgba(170,95,207,1) 100%);
background: linear-gradient(to right, rgba(58,39,176,1) 0%, rgba(170,95,207,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3a27b0', endColorstr='#aa5fcf', GradientType=1 );*/
  transition: all 1s ease-in-out
}
.navbar-default.darks{
  background: #fff;opacity: 1; transition: all 0.5s ease-in-out
}
.innerPage .dark {
  background: rgba(0, 76, 50, 1);
  min-height: auto;
  border-radius: 0;
  transition: all 1s ease-in-out
}
.inner-header {
  background: rgba(75, 87, 87, 1);
  min-height: auto;
  border-radius: 0;
  transition: all 1s ease-in-out
}

.card {
  border-radius: 4px;
  background-color: #FFFFFF;
  box-shadow: 0 0 1px 0 rgba(10, 31, 68, 0.1), 0 18px 18px 0 rgba(10, 31, 68, 0.12);
  -webkit-box-shadow: 0 0 1px 0 rgba(10, 31, 68, 0.1), 0 18px 18px 0 rgba(10, 31, 68, 0.12);
  -moz-box-shadow: 0 0 1px 0 rgba(10, 31, 68, 0.1), 0 18px 18px 0 rgba(10, 31, 68, 0.12);
margin-bottom: 25px;
min-height: 350px;cursor: pointer;

}
.portfolio-image{
  position: relative;
overflow: hidden;
}
.portfolio-image img{
    -moz-transition: all 0.3s;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
.card:hover img {
  -moz-transform: scale(1.5);
  -webkit-transform: scale(1.5);
  transform: scale(1.5);
}
.benefits-section,
.vision-section {
  padding-top: 100px;padding-bottom: 100px;
   /*border-bottom: 1px solid #dce3e8;*/
}
.benefits-section .container{
  border-bottom: 1px solid #dce3e8;
  padding-bottom: 100px;
}.benefits-section {
  /*margin-bottom: 50px;*/
}
.benefits-section h1{margin-top: 0}
.vision-section h1 span {
  display: inline-block;
}
.vision-section h2 {
    color: #000; font-family: "Gotham Rounded";  font-size: 30px;  font-weight: 500; line-height: 43px;margin-top: 50px
}
.vision-section h1 {
  color: #000;  font-size: 30px;  font-weight: 500; line-height: 43px;margin-bottom: 15px
}.vision-section p{
    color: #474B54; font-size: 18px;  font-weight: 300;   line-height: 30px;    margin-bottom: 40px;
}

.vision-section {
  background: url("../images/BGGray@2x.png") no-repeat right bottom;
 padding: 50px 0 0;
    background-size: contain;
    /*margin: 100px 0;*/
}

.vision-section ul li:last-child {
  margin-bottom: 0
}

.vision-section ul li {
  margin-bottom: 50px
}

.vision-img {
  width: 175px;
  margin: 0px auto
}
.swiper-box{
  position: relative;
}
.swiper-box .col-md-4,.swiper-box .col-md-8{
  padding-left: 0;padding-right: 0
}
.swiper-box .swiper-inner {
  background-color: #FE3B56;  box-shadow: 0 4px 11px 0 rgba(63,71,73,0.08);
  padding: 60px 25px 60px 130px;      min-height: 300px;

}
.swiper-box .swiper-inner-2 {
    /*background-color: #4a29b8;*/
}
.swiper-box .swiper-inner-3 {
    /*background-color: #00bc7b;*/
}
.custom-swiper .swiper-button-next,.custom-swiper .swiper-container-rtl .swiper-button-prev{
  right: 0
}
.carousel-control{
  opacity: 1
}
.slider-counter {
  position: absolute;
  top: 40px;
  right: 25px;
  z-index: 1;
  min-width: 60px;
  padding: 6px;
  text-align: center;
  /*letter-spacing: .1em;*/
  background:transparent;
  color: #fff;
   font-family: "Gotham Rounded";  font-size: 26px;  font-weight: 300; line-height: 43px;
}
.slider-counter span{
  color: #fff;opacity: 0.7
}
.slider-counter span:first-child{
  color: #fff;opacity: 1
}
.slider-counter span:first-child{
  font-size: 35px;font-weight: 500
}
.swiper-container.custom-swiper{}
.swiper-box .swiper-inner{
  position: relative;margin-top: 40px
}
.customer-section .person img.img-responsive{
  position: absolute;left: 0;z-index: 2;top: 0px
}
.customer-section .swiper-box h1{
color: #FFFFFF; font-family: "Gotham Rounded";  font-size: 24px;  font-weight: 500; line-height: 43px;margin-top: 0;margin-bottom: 0px
}
.customer-section .swiper-box p{
    color: #FFFFFF; font-family: "Gotham Rounded";  font-size: 15px;  font-weight: 300;   line-height: 22px; margin-bottom: 0 
}
.swiper-button-next, .swiper-container-rtl .swiper-button-prev,.swiper-button-prev, .swiper-container-rtl .swiper-button-next{
  background: transparent;
}
.custom-swiper .swiper-button-next, .swiper-container-rtl .swiper-button-prev{
  background-image:url("../images/right@2x.png");
/*background: transparent;*/
}
.custom-swiper .swiper-button-prev, .swiper-container-rtl .swiper-button-next{
  /*background-image:url("../images/right@2x.png");*/
  background-image:url("../images/left@2x.png");
/*background: transparent;*/
}
#hero-carousel{
  position: relative;
}
.custom-swiper .swiper-button-next,.custom-swiper .swiper-button-prev,
.carousel-control.left,.carousel-control.right
{
top: inherit;
    bottom: 0px;
}
.carousel-control.left{
  left: inherit;right: 54px
}
.carousel-control.left img,.carousel-control.right img,.carousel-control.left ,.carousel-control.right {
    width: 54px;height: 54px;display: inline-block;
}
.design-pricing{
  padding-top: 80px;padding-bottom: 80px
}
.custom-swiper .swiper-button-prev{
  left: inherit;right: 54px
}
.swiper-button-next, .swiper-button-prev{width: 54px;height: 54px;background-size:54px 54px;}
.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled{opacity: 0.6}
.vision-section .flex-list {
  display: flex;
  flex-direction: row;
  align-items: center;
}
.news-section-container{padding-right: 15px ;padding-left: 0}
.news-section-container img.img-responsive{width: 100%}
.vision-section h1 span:nth-child(1) {
  color: #0A2D19;
 
  font-size: 96px;
  font-weight: 900;
  line-height: 96px;
  text-shadow: 0 2px 29px 0;
  display: inline-block;
}
.news-section h3{
    color: #474B54; font-family: "Gotham Rounded";  font-size: 19px;  font-weight: 300;line-height: 30px;
}
.vision-section h1 {
  margin-top: 0
}

.vision-section h1 span:nth-child(2) {
  color: #317850;
 
  font-size: 95px;
  font-weight: 900;
  line-height: 95px;
  display: inline-block;
}

.vision-section ul li span {
  display: inline;
  color: #0A2D19;
 
  color: #0A2D19;
 
  font-size: 20px;
  line-height: 24px;
  padding-right: 15px
}

.vision-section ul li span:nth-child(1) {
  color: #0A2D19;
 
  font-size: 40px;
  font-weight: 900;
  line-height: 50px;
}


.card h2 {
  display: block;
  /* Fallback for non-webkit */
  display: -webkit-box;
  color: #53627C;
 
  font-size: 16px;
  font-weight: bold;
  line-height: 21px;
  margin-top: 5px;
   /*text-align: justify;*/
  -webkit-line-clamp: 1px;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  height: 43px;
}
.card p.location-in{
 display: -webkit-box;
   /*text-align: justify;*/
  -webkit-line-clamp: 1px;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  height: 36px;
}
.card a.btn,
a.primary-btn {
  border: 1px solid #0BB07B;
  padding: 8px 30px;
  color: #0BB07B;    line-height: 11px;
    height: 30px;    
}
.innerPage .card a.btn{margin: 10px 0 0;}
.dropdown a.btn-default{margin: 10px auto;display: inherit;padding: 8px 12px}
.price{ 
position: relative;top: 16px;
  color: #8A94A6; font-size: 18px;  font-weight: 500; line-height: 16px;}
.card .inner {
  padding: 10px 10px
}
.card .inner p i{display: inline-block;padding-right: 5px;padding-bottom: 5px;color: #0BB07B;    font-size: 16px;}
.full-width{width: 100%}
.primary-btn {
  margin: 50px auto
}
.dropdown a span{display: inline-block;margin-left: 5px}
.card p {
  margin-bottom: 5px;
  color: #8A94A6;
 
  font-size: 12px;
  font-weight: 500;
  line-height: 16px;
}

button.btn-primary,button.btn-primary:focus,
button.btn-primary:active,button.btn-primary:active:focus
{font-family: "Kanun AR+LT";  font-size: 14px; 
 font-weight: 500; line-height: 20px; 
  text-align: center;border-radius: 30px;
  background: #008a5c;
  height: 44px;border-color: #008a5c}

button.btn-primary:hover{background: #fff;border-color: #008a5c;color:#008a5c;}

#radioBtn .notActive{
    color: #008a5c;
    background-color: #fff;
}
.checkbox p{  color: #8A94A6; font-size: 12px;  font-weight: 500; line-height: 16px;}
.checkbox label span.label-txt{display: inline-block;padding-left: 10px;}
/**/

/* Create a custom checkbox */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #eee;
}

/* On mouse-over, add a grey background color */
.participate-section:hover input ~ .checkmark {
  background-color: #fff;
}

/* When the checkbox is checked, add a blue background */
.participate-section input:checked ~ .checkmark {
  background-color: #4C29DB;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.participate-section input:checked ~ .checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
.participate-section .checkmark:after {
 left: 7px;
    top: 3px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}


/**/
.checkbox label{ color: #8A93A3;  font-family: "Gotham Rounded";  font-size: 15px;  font-weight: 300; line-height: 21px;}

.contact-section .checkbox label{
  color: #787D82; font-family: "Gotham Rounded";  font-size: 13px;  font-weight: 300;  line-height: 19px;
}

#radioBtn a{min-width:135px;}
a.radio-btn{padding: 12px }
#radioBtn2.btn-group,.btn-group.bg-radio {display: block;margin-bottom: 30px}
#radioBtn2 a,.bg-radio a{width:50% }
#radioBtn .btn-primary,#radioBtn2 .btn-primary,.bg-radio .btn-primary{height: auto;margin: 0;    border-color: #008a5c;}
#radioBtn .btn-primary.active,#radioBtn2 .btn-primary,.bg-radio .btn-primary{background: #008a5c}
#radioBtn .btn-primary.notActive,#radioBtn2 .btn-primary.notActive,.bg-radio .btn-primary.notActive{background: #fff;
  color:#008a5c;

}
.volunteer-section{margin-top: 104px}
.breadcrumb{padding: 8px 0}
.breadcrumb li a{font-family: "Kanun AR+LT";  font-size: 14px;  
 line-height: 18px; color: #8A94A6;}
.breadcrumb li i{font-weight: bold;}
 .breadcrumb li.active{font-weight: bold;color: #8A94A6;}
 .forms h1{
 
  color: #0A2D19;
 
  font-size: 43px;
  font-weight: bold;
  line-height: 58px;
  text-shadow: 0 2px 24px 0 rgba(0,0,0,0.5);
  margin-bottom: 30px;
}
.soccer-section .soccer-flex{display: flex}
.soccer-section h1,.object-section h1,.role-section h1{
  color: #FFFFFF;
 
  font-size: 54px;
  font-weight: 900;
  line-height: 70px;
  text-shadow: 0 2px 24px 0 rgba(0,0,0,0.5);margin-top: 0;
  margin-bottom:25px;
}
.bottom-section p{margin-bottom: 25px}
.pad-rgt{padding-right: 25px}
.pad-lft{padding-left: 25px}
.basic-section.has-border{ border-right: 1px solid #E9E9E9;}
.basic-section h1{
    color: #8A94A6; font-size: 58px;  font-weight: 900; line-height: 73px;  text-shadow: 0 2px 24px 0 rgba(0,0,0,0.5);
}
.bottom-section p{
    color: #0A1F44; font-size: 16px;  line-height: 28px;
}
.bottom-section li span{
   color: #0A1F44; font-size: 16px;  line-height: 28px;
}
.bottom-section li{padding-bottom: 25px}
.bottom-section li{

}

.top-section img{width: 230px}

.media-body{
  text-align: left;
}
.media-object{
  margin-right: 50px
}
.download-section{
  padding: 25px 0
}
.ads-section{
  padding-top: 80px;padding-bottom: 80px
}
.footer-logo{
  max-width: 200px
}
.copyright{
    color: rgba(20,24,30,0.5); font-family: "Gotham Rounded";  font-size: 13px;  font-weight: 300; line-height: 16px;
}
.innersection .copyright,.copyright{
  color: #fff
}
.socialicons{
  text-align: right;display: none
}
.socialicons i.fa{
  color: #858b8f;    font-size: 20px;
}
.innersection .socialicons i.fa{
  color: #fff
}

.saudi-inner{
  padding-top: 80px;padding-bottom: 80px
}
.foot-section{
 /* padding: 150px 0 0;
  background: url("../images/Footer@2x.png") no-repeat center center;
  background-size: cover;*/
}
.innersection .foot-section,.foot-section{
  background: url("../images/Footer@3x.svg") no-repeat center center;background-size:cover;padding: 310px 0 50px;    
  /*margin-top: 50px;*/
}
.innersection.paymentpages .foot-section{
  background: url("../images/Footer1@3x.svg") no-repeat center center ;background-size:cover;padding: 310px 0 0;
}
.foot-section .container{
  top:15px
}
.foot-section ul li a{
    color: #2E3239; font-family: "Gotham Rounded";  font-size: 14px;  font-weight: 300; letter-spacing: 0.16px; line-height: 31px;
}
.foot-section h3 {
  margin-top: 0;text-transform: uppercase;
  color: #2E3239; font-family: "Gotham Rounded";  font-size: 14px;  font-weight: 500; line-height: 17px;
}
.innersection .foot-section h3,.foot-section h3, .innersection .foot-section ul li a,.foot-section ul li a{
  color: #fff
}
.foot-section ul {
  padding-left: 0
}
.foot-section ul li{
  list-style-type: none;
}
.download-section h1{
     margin-bottom: 15px;
  font-size: 30px;  font-weight: 500; line-height: 37px;
  color: #000;
}
.ads-section h1,.swiper-wrapper{
  margin-bottom: 75px
}
.ads-section h1{
  /*margin-bottom: 60px*/
}
.media-body p{
margin-bottom: 25px;
    color: #474B54; font-family: "Gotham Rounded";  font-size: 16px;  font-weight: 300;   line-height: 26px;
    
}

h4 span.autor{
  display: inline-block;padding-right: 25px;
  color: #3022AD; font-family: "Gotham Rounded";  font-size: 15px;  font-weight: 500; line-height: 18px;
}

.media-body h4{
     font-family: "Gotham Rounded";  font-size: 15px;
}
h4.media-heading{

  color: #000;font-weight: 500
}
.bottom-section li span img{margin-right: 15px}
.active-section{margin-top: 125px;padding: 75px}
.basic-section{position: relative;}
.top-section span{position: absolute;top:-50px;}
.top-section{    display: flex;
    align-items: center;
    justify-content: space-between;
  }
   
.top-section{
  margin-bottom: 25px
}

    .top-section h1{
      margin-top: 0;
      color: #8A94A6; font-size: 58px;  font-weight: 900; line-height: 73px;  text-shadow: 0 2px 24px 0 rgba(0,0,0,0.5);
    }
.top-section span{  opacity: 0.3; color: #A6AEBC; font-size: 178px; font-weight: 900; line-height: 223px;}
.soccer-section h1 span{display: block;}
.role-section{margin-bottom: 100px;}
.soccer-section .breadcrumb{
  margin-bottom: 75px
}
.vision-logo{position: absolute;z-index: 0;left: 30%}
.work-section .breadcrumb{
  margin-bottom: 0px
}
.work-section{overflow: hidden;}
.flex-container{display: flex;
  /*margin-top: 50px;   */
   justify-content: flex-end;}

.object-section .flex-container,.role-section .flex-container {margin-top: 0}
.flex-container div{flex: 1;max-width: 225px;}
.soccer-section p,.object-section p,.role-section p{
    color: #FFFFFF; font-size: 24px;  line-height: 30px;
}
.info-box{
  background-color: rgba(10,45,25,0.8);
  padding: 30px 25px;
  /*margin-bottom: 25px*/
    border: 1px solid #154429;

}
.info-box h3{
    color: #FFFFFF; font-size: 24px;  font-weight: 900; line-height: 30px;margin-top: 0
  }
.info-box p{color: #FFFFFF;  font-size: 14px;  line-height: 18px;margin-bottom: 0}
.soccer-section h3{
    color: #FFFFFF; font-size: 24px;  line-height: 30px;
}
a.terms{
  color: #4A30B5;
}
.soccer-section .breadcrumb li.active,.soccer-section .breadcrumb li a,.soccer-section .breadcrumb li i.fa{color: #fff}
.form-group label{ color: #3B3D3F;  font-family: "Gotham Rounded";  
font-size: 14px;  font-weight: 500; line-height: 16px;
margin-bottom: 8px}
.form-group label span{
  margin-top: 12px;
  opacity: 0.6; color: #000;
   font-family: "Gotham Rounded";  
   font-size: 12px;  font-weight: 300; 
   line-height: 18px;display: block;
}
.form-group input.form-control,textarea{
color: #000;
    font-family: "Gotham Rounded";
    font-size: 14px;
    font-weight: 500;
    line-height: 24px;

 }

.footer-section .form-group input.form-control{
  height: 44px;border-radius: 30px;
}
.swiper-button-next, .swiper-button-prev{top: 10%}



.forms .form-group{margin-bottom: 30px}
.forms button.main-btn{margin: 25px auto}
button.bs-placeholder{margin: 0}
.forms{padding-top: 35px;padding-bottom: 15px;padding-right: 35px}
.multiselect-container{width: 100%}
textarea{min-height: 90px}
.breadcrumb{background: transparent;}
.breadcrumb>li+li:before{content: ""}
.breadcrumb li i.fa{display: inline-block;margin-left: 10px}
.volunteer-info li i img{width: 18px}
.volunteer-info{
width: 80%;margin: 50px auto;
  padding: 25px; background-color: rgba(0,0,0,0.8);position: absolute;top: 0;left: 0;right: 0}
.volunteer-info h3,.volunteer-info p, .volunteer-info *{color: #fff}
.volunteer-info ul li i{display: inline-block;margin-right: 10px}
.volunteer-info ul li{font-family: "Kanun AR+LT"; font-size: 16px;  
line-height: 24px;width: 47%;margin-bottom: 10px}



.info-section {
  /* background: #fefefe; */
  /*background:rgba(0,39,26,0.6);*/
  position: relative;
  top:-100px;
  padding-top: 0px;
  /*padding-bottom: 150px;*/
  color: #fff;
background: -moz-linear-gradient(270deg, rgba(0,38,26,0.6) 0%, rgba(0,38,26,0.97) 17%, rgba(255,255,255,0.97) 17%, rgba(255,255,255,1) 100%); /* ff3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0,38,26,0.6)), color-stop(16%, rgba(0,38,26,0.97)), color-stop(17%, rgba(255,255,255,0.97)), color-stop(100%, rgba(255,255,255,1))); /* safari4+,chrome */
background: -webkit-linear-gradient(270deg, rgba(0,38,26,0.6) 0%, rgba(0,38,26,0.97) 17%, rgba(255,255,255,0.97) 17%, rgba(255,255,255,1) 100%); /* safari5.1+,chrome10+ */
background: -o-linear-gradient(270deg, rgba(0,38,26,0.6) 0%, rgba(0,38,26,0.97) 17%, rgba(255,255,255,0.97) 17%, rgba(255,255,255,1) 100%); /* opera 11.10+ */
background: -ms-linear-gradient(270deg, rgba(0,38,26,0.6) 0%, rgba(0,38,26,0.97) 17%, rgba(255,255,255,0.97) 17%, rgba(255,255,255,1) 100%); /* ie10+ */
background: linear-gradient(180deg, rgba(0,38,26,0.6) 0%, rgba(0,38,26,0.97) 17%, rgba(255,255,255,0.97) 17%, rgba(255,255,255,1) 100%); /* w3c */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00261A', endColorstr='#FFFFFF',GradientType=0 ); /* ie6-9 */
}



.innerPage .info-section{background: transparent;position: static;margin-top: 150px}
.flex a i.fa {
  display: inline-block;
  padding-left: 10px
}

.absolute {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0
}

.bootstrap-select.btn-group.show-tick .dropdown-menu li.selected a span.check-mark{
  color: #2196F3
}
.info-section h1{margin: 40px auto}
.flex {
  display: flex;
  flex-direction: column;
  position: absolute;
  flex: 1;
  /*width: 100%;*/
  top: 0;
  /*align-items: flex-start;*/
  justify-content: space-between;
  height: 100%;
  right: 0;left: 0
}

.pseudo:before {
  content: "";
  background: #009e60;
  top: 0;
  left: 0;
  right: 14px;
  bottom: 0;
  position: absolute;
}
.trail-form{
  padding: 50px 60px;
    background-color: #fff;
-webkit-box-shadow: 0px 3px 9px 0px rgba(63,71,73,0.15);
-moz-box-shadow: 0px 3px 9px 0px rgba(63,71,73,0.15);
box-shadow: 0px 3px 9px 0px rgba(63,71,73,0.15);

}
.form-panel{
  width: 60%;margin: 0 auto
}
.form-panel-full{
  width: 80%
}

.form-panel h3{
    color: #000000; font-family: "Gotham Rounded";  font-size: 20px;  font-weight: 500; line-height: 16px;margin-top: 0;margin-bottom: 20px
}
.form-panel-full img{
  margin: 0px auto 20px
}
.participate-section  .form-panel-full h1{
    color: #FE3B56; font-family: "Gotham Rounded";  font-size: 37px;  font-weight: 500; line-height: 43px;  text-align: center;
margin-bottom: 20px!important
}

 .participate-section  .form-panel-full p{
color: #2E3444; font-family: "Gotham Rounded";  font-size: 16px;  font-weight: 300;  line-height: 24px;  text-align: center;
margin-bottom: 35px;

  }
.form-group-custom{
  margin-bottom: 25px
}
.form-group-custom .checkbox{
  margin-top: 0;margin-bottom: 0
}
.form-headings{
  width: 64%;margin: 0 auto
}
.contact-section .trail-form{
  border-radius: 7px; background-color: #FFFFFF;  box-shadow: 0 6px 36px 0 rgba(0,62,100,0.09);
  padding: 50px 0 ;
  width: 71%;margin: 0 auto
}
.contact-new-section .full-form{
  width: 100%;
}
.contact-new-section .form-headings{
  width: 100%
}
.contact-new-section .form-panel{
   width: 100%
}
.contact-new-section .trail-form{
    padding: 35px 45px
}
.conditions{
  margin-top: 20px;
  color: #787D82; font-family: "Gotham Rounded";  font-size: 13px;  font-weight: 300;  line-height: 19px;
}
.checkboxes .checkbox{
  margin-top: 0;margin-bottom: 0;padding-bottom: 10px
}
.contact-new-section .trail-form{
  width: 100%
}
.checkboxes{
  display: flex;
    align-items: flex-start;
    margin-bottom: 30px;
    flex-direction: column;
}
.trail-form .form-group{
  margin-bottom: 25px
}
.trail-form .form-group.form-group-no-btm{
  margin-bottom: 10px
}
.swiper-pagination-bullet{
  /*width: 0*/
  /*background-color: #E0E6ED;*/
}.swiper-container-2.swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction{
      bottom: 100px;
    /*left: -350px;*/
}
.swiper-container-2 .swiper-pagination{
  text-align: left;
}
.swiper-pagination-bullet-active{
  width: 30px;height: 10px; background-color: #4A30B5;
  border-radius: 4px;position: relative;top:1px;
  transition:all 0.1s ease-in-out;
}
.swiper-container-2 .swiper-slide.swiper-slide-active img.img-responsive{
  /*position: re*/
  position: relative;
  right: -50px
}
.media-left{position: relative;}
.media-left::after{
  content:  url(../images/Quote@3x.svg);
  position: absolute;right: 10px;
    top: 0;
}
.heat-map .media-left::after,.audit-map .media-left::after,.usability-map .media-left::after{
content: '';
}
.top,
.links {
  position: relative;
  z-index: 2
}
.benefit-card p.learn {
    color: #6772E5; font-family: "Gotham Rounded";  font-size: 14px;  font-weight: bold;  line-height: 17px;
    visibility:hidden;margin-bottom: 0
}
.myfooter{border-top: 1px solid rgba(220,227,232,0.2);padding-top: 25px;padding-bottom: 15px;padding-right: 15px;padding-left: 15px;
margin-top: 15px;
/*background: #f1f3f6*/
}
.innersection .myfooter,.my-footer{
    border-top: 1px solid rgba(220,227,232,0.2);  
}
.myfooter .col-md-6{
  padding-left: 0;padding-right: 0
}
.ux{
  width: 150px
}
.benefit-card{  
  cursor: pointer;
  text-align: center;margin: 40px auto 0;padding: 15px
}
.nomargin{margin: 0 auto}
.benefit-card:hover{
  border-radius: 7px; background-color: #FFFFFF;  box-shadow: 0 6px 36px 0 rgba(0,62,100,0.09);
  transition:all 0.5s ease-in-out;
}
.benefit-card:hover p.learn {
  visibility:visible;transition:all 0.5s ease-in-out;
}
.benefit-card h3{
  margin-top: 10px;margin-bottom: 5px;
    color: #000; font-family: "Gotham Rounded";  font-size: 18px;  font-weight: 500;  line-height: 30px; 
}
.benefit-card p{
    color: #474B54; font-family: "Gotham Rounded";  font-size: 16px;  font-weight: 300;   line-height: 24px;
}
.auto-margin{
  margin: 0 auto
}
.participate-section{
      background: url(../images/GrayBG@2x.png) #fff;
    /*height: 100%;*/
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: 100%;
     /*background-attachment: fixed; */
}
.participate-section.contact-section{
background: #f4f5f5;
background-image: none;
}
.viewbtn{
display: block;margin: 25px auto;
 color: #14181E; font-size: 14px;  font-weight: bold;  letter-spacing: 0.82px; line-height: 17px;}
.benefit-card img{
  margin:0 auto;
}
.news-section h1,.vision-section h1 {
  margin-top: 0;
color: #000;  font-size: 36px;  font-weight: 300; line-height: 43px;
  margin-bottom: 15px;

}

.news-section p{
/*color: #474B54; font-family: "Gotham Rounded";  font-size: 21px;  font-weight: 300; line-height: 30px;*/
 }

.ads-section{

}
.ads-section img{    margin-bottom: 8px;}
.icon {
  position:relative;
  text-align:center;
  width:0px;
  height:0px;
  padding:20px;
 /* border-top-right-radius:  20px;
  border-top-left-radius:   20px;
  border-bottom-right-radius: 20px;
  border-bottom-left-radius:  20px; 
  -moz-border-radius:     20px 20px 20px 20px;
  -webkit-border-radius:    20px 20px 20px 20px;
  -khtml-border-radius:     20px 20px 20px 20px;  
  */
  border-radius: 50%;
  color:#FFFFFF;
}
.icon i {
  font-size:20px;
  position:absolute;
  left:9px;
  top:10px;
}

.twitterAccount{
  background: #49b3f4;padding: 15px;color:#fff;
}
.twitterAccount img{margin-right: 15px;margin-bottom: 15px;    position: relative;
    top: 4px;}
.twitterAccount span{display: inline-block;margin-right: 5px}
.twitterAccount span i{font-size:30px;position: relative;top: 16px}
.twitterAccount span.title{  color: #fff; font-size: 20px;  font-weight: bold;  line-height: 23px;}
.twitterAccount p{  font-size: 18px;  line-height: 26px;margin-bottom: 0}
.w-150{width: 150px}
.icon.social {
  float:right;
  margin:50px 10px 0 0;
  cursor:pointer;
  background:transparent; ;
  color:#317850;
  transition: 0.5s;
  -moz-transition: 0.5s;
  -webkit-transition: 0.5s;
  -o-transition: 0.5s;  
  border: 2px solid #317850
}

.footer-section .icon.social,.forms .icon.social{
    float:left;
}


.icon.social:hover {
  background:#317850 ;
  color:#fff;
  transition: 0.5s;
  -moz-transition: 0.5s;
  -webkit-transition: 0.5s;
  -o-transition: 0.5s;
 /* -webkit-filter: drop-shadow(0 1px 10px rgba(0,0,0,.8));
  -moz-filter:  drop-shadow(0 1px 10px rgba(0,0,0,.8));
  -ms-filter:     drop-shadow(0 1px 10px rgba(0,0,0,.8));
  -o-filter:    drop-shadow(0 1px 10px rgba(0,0,0,.8));
  filter:       drop-shadow(0 1px 10px rgba(0,0,0,.8));   */
}
.icon.social.fb i {
  left:14px;
  top:10px;
}
.icon.social.tw i {
  left:11px;
}
.icon.social.in i {
  left:11px;
}

.forms h2 span{
  color: #0A2D19;
 
  font-size: 23px;
  line-height: 28px;
  text-shadow: 0 2px 24px 0 rgba(0,0,0,0.5);position: relative;
    top: 6px;
    display: inline-block;
    margin-right: 15px;

}
.welcome-box{
 text-align: center;
  border: 10px solid #008956;
  background-color: #FFFFFF;
  box-shadow: 0 2px 34px 0 rgba(170,170,170,0.5);
  padding: 25px;

}
.footer-logo{}
.welcome-box p.greet{ color: #0A2D19; font-size: 28px;  line-height: 36px;
width: 80%;margin: 0 auto;position: relative;
}
.lft{position: absolute;left: -20px;top: 15px}
.rgt{position: absolute;right: -20px;top: -15px}
.signup{margin-top: 25px}
.signup p{  color: #0A2D19; font-size: 14px;  font-weight: bold;  line-height: 18px;}
.name{  
position: absolute;left: 0;right: 0;margin: 0 auto;
  color: #0A2D19; font-family: "Chez Vous"; font-size: 35px; line-height: 58px;
top: 145px
}
.signup p:nth-child(1){position: relative;}
.welcome-box p span,.signup a{font-weight: bold;color: #008956}
.relative{position: relative;}
.forms h2 .icon.social{margin: 0 5px 0 0}

.bootstrap-select .dropdown-toggle:focus{
  
  outline:1px auto #4A30B5 !important;    background-color: #fff;
}
.padding-sm-right{padding-right: 8px}
.padding-sm-left{padding-left: 8px}
.participate-section{padding-top: 80px;padding-bottom: 80px}
.innersection .participate-section{
  padding-top: 80px;padding-bottom: 80px
}
.innersection .participate-section.contact-section{
padding: 75px 0 75px;margin-top: 80px

}
img.guy{
  position: relative;
  /*top: -130px*/
}
.participate-section h1,.ads-section h1{
  /*text-transform: uppercase;*/
   margin-top: 0;margin-bottom: 15px;
    color: #000; font-family: "Gotham Rounded";  font-size: 30px;  font-weight: 500; line-height: 37px;text-align: center;
}
.participate-section h1,.pricing-section h1{
  color: #000; font-family: "Gotham Rounded";  font-size: 36px;  font-weight: 300; line-height: 43px;  text-align: center;
  margin-top: 0;margin-bottom: 0
}
.participate-section h2,.pricing-section h2{

color: #474B54; font-family: "Gotham Rounded";  font-size: 18px;  font-weight: 300;  line-height: 28px;  text-align: center;margin-bottom: 80px
 
}
.participate-section.contact-new-section h2{
  color: #212529; font-family: "Gotham Rounded";  font-size: 20px;  font-weight: 500; line-height: 29px;
}
.participate-section.contact-new-section img{margin-bottom: 50px}
.participate-section.contact-section h2{
/*width: 90%;*/
margin:0 auto 50px 
}
.ads-section h2,.download-section h2{
  color: #474B54; font-family: "Gotham Rounded";  font-size: 19px;  font-weight: 300;  line-height: 30px;margin-top: 0;margin-bottom: 50px 
}
.participate-section p{
      width: 90%;
    margin: 0 auto;
    color: #474B54; font-family: "Gotham Rounded";  font-size: 16px;  font-weight: 300;  line-height: 24px;  text-align: center;
}
.participate-section h1 span{
  font-size: 109px; font-weight: 900; line-height: 149px; color: #317850;display: inline
}
.participate-section p{}
.pad-right-1 {
  padding-right: 1px
}
.no-pad-right{padding-right: 0}
.no-pad-left{padding-left: 0px}
.pad-left-1 {
  padding-left: 1px
}

.pad-0 {
  padding: 1px
}

.no-padding {
  padding: 0
}

.flex a:hover {
  text-decoration: none;
  background-color: rgba(144, 144, 144, 0.50);
  transition: all 0.5s linear;
}

.flex a {
  color: #FFFFFF;
 
  font-size: 14px;
  font-weight: bold;
  letter-spacing: 0.5px;
  line-height: 18px;
  min-height: 72px;
  background-color: rgba(144, 144, 144, 0.26);
  padding: 0 12px;
  display: block;
  display: flex;
  flex-direction: row;
  align-items: center;
}
.dir-arrow{width: 75px}

.justify-content-center {
  justify-content: center;
}

.flex h1,
.flex a {
  color: #fff
}
.flex-small{
  display: flex;
  align-items:flex-start;
  justify-content:flex-start;
  padding-bottom: 20px;

}
.benefits-section h2{
  margin-bottom: 50px;
}
a:focus,a:active,.learn-btn:focus,.learn-btn:active{
  color:#fff;
}
.learn-btn{
  border-radius: 4px; background-color: #4A30B5; 
   /*box-shadow: 0 11px 15px 0 rgba(187,170,254,0.58);*/

  color: #fff;font-family: "Gotham Rounded";  font-size: 14px;
    font-weight: bold;  line-height: 14px;padding: 10px 35px ; 
}
.btn-block.learn-btn{
  line-height:0px;padding: 20px;    margin: 30px 0 0;height: 48px
}
.trail-form .btn-block.learn-btn{
margin: 0 auto
}
.learn-btn:hover,a.btn-default:hover{
 background-color: #4C29DB;color: #fff; transition: all 0.5s linear;box-shadow: 0 11px 15px 0 rgba(187,170,254,0.58);
}
.btn-default.active.focus, .btn-default.active:focus, .btn-default.active:hover, .btn-default:active.focus, .btn-default:active:focus, .btn-default:active:hover, .open>.btn-default.dropdown-toggle.focus, .open>.btn-default.dropdown-toggle:focus, .open>.btn-default.dropdown-toggle:hover{
  background-color: transparent;
}
.btn-success:hover{
 
  transition: all 0.5s linear;
}.btn-warning:hover{


}
.visa{
  position: relative;
}
.visa img{
  position: absolute;
  top:10px;left: 8px
}
.visa input.form-control{
  padding-left: 43px
}

.flex-small img{margin-right: 50px;width: 32px}
.customer-section{
padding-top: 80px;padding-bottom: 130px;
background: url("../images/BGGrayL@2x.png") no-repeat ;
    background-size: cover;
}
.customer-section.customer-section-2{
  background:transparent;padding-bottom: 80px
}
.customer-section .container .row{
  display: flex;
    align-items: center;
}
.competitive-section{
  background: url("../images/BGGrayR@2x.png") no-repeat center ; background-size: cover;
}
.customer-section.analytics-section{
  /*background: url("../images/BGGrayL@2x.png") no-repeat center -92px;*/
}
.customer-section img.img-responsive{
  max-height: 260px;margin:  0 auto
}
.customer-section.competitive-section img.img-responsive,.customer-section.revenue-section img.img-responsive{
max-height: 260px
}
.customer-section.analytics-section img.img-responsive{
  max-height: none
}
.customer-section h1{
  margin-top: 0;margin-bottom: 20px;
    color: #2E3444; font-family: "Gotham Rounded";  font-size: 22px;  font-weight: 500; line-height: 31px;
}
.customer-section h1.types{
    margin-top: 0;
    margin-bottom: 60px;
    color: #2D3445;
    font-family: "Gotham Rounded";
    font-size: 30px;
    font-weight: 500;
    line-height: 43px;

}
.innersection .flex-small img
{
  width: 17px;margin-right: 15px;    position: relative;
    top: 4px;
}
.flex-small p{  color: #474B54; font-family: "Gotham Rounded";  font-size: 18px;  font-weight: 300;   line-height: 30px;}

.innersection .flex-small p{line-height: 24px;
  color: #474B54; font-family: "Gotham Rounded";  font-size: 16px;  font-weight: 300;  
}

.flex h1 {
  padding: 25px;
  color: #FFFFFF;
 
  font-size: 50px;
  font-weight: 900;
  line-height: 60px;
}
.saudi-section .list-inline li{
  position: relative;
}
.saudi-section .list-inline li:nth-child(2){
  top: -9px
}
.saudi-section .list-inline li:nth-child(3){
  top: 2px
}
.saudi-section .list-inline li:nth-child(4){
  top: 7px
}
.saudi-section .container{
  border-bottom: 1px solid #dce3e8
}
.saudi-section.saudi-inner .container{
  border: none
}
.saudi-section h1 {
 color: #000;
 
font-size: 30px;  font-weight: 500; line-height: 43px;margin-top: 0!important

}
.saudi-section {position: relative;top:0px;}
.aboutpage .saudi-section{
  top:-90px;
  background: #fff
}
.aboutpage .saudi-section h1{
  /*margin-top: 50px!important*/
}
.saudi-section h2{
  margin-top: 5px;
    color: #474B54;   font-size: 19px;  font-weight: 300;  line-height: 31px;  text-align: center;
}
.saudi-section p strong{


  color: #0A1F44;
 
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;

}
.saudi-section h1 span.nth-h1 {
  color: #0A2D19;
 
  font-size: 100px;
  font-weight: 900;
  line-height: 85px;
  text-shadow: 0 2px 29px 0 rgba(0, 0, 0, 0.5);

}

.saudi-section h1 span.nth-h2 {
  color: #317850;
 
  font-size: 118px;
  font-weight: 900;
  line-height: 100px;
/*display: block;*/
}

.saudi-section h2 {
  /*margin-top: 0*/
}

.saudi-section h2 strong {
  font-weight: bold
}

.saudi-section p {
  color: #8A94A6;
 
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
}

.saudi-section ul {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-direction: row;
}

.saudi-section ul li {

  /*border-radius: 50%;*/
}

.saudi-section ul li span {
  color: #317850;
 
  font-size: 12px;
  font-weight: normal;
  line-height: 18px;
  text-align: center;
  -webkit-box-shadow: -1px 7px 19px 2px rgba(0,0,0,0.11);
-moz-box-shadow: -1px 7px 19px 2px rgba(0,0,0,0.11);
box-shadow: -1px 7px 19px 2px rgba(0,0,0,0.11);
}

.saudi-section ul li:nth-child(2) span {
  border-radius: 18px
}

.saudi-section ul li:nth-child(3) span {
  border-radius: 0px
}

.saudi-section ul li:nth-child(4) span {
  /*width: 0;
  height: 0;
  border-left: 40px solid transparent;
  border-right: 40px solid transparent;
  border-bottom: 80px solid #fff;
  background: transparent;
  border-radius: 0;*/
border-radius: 0;
  -webkit-clip-path: polygon(50% 0%, 100% 38%, 82% 100%, 18% 100%, 0% 38%);
clip-path: polygon(50% 0%, 100% 38%, 82% 100%, 18% 100%, 0% 38%);

}
.saudi-section ul li:nth-child(4) span:after{
/*  content: "";
  -webkit-box-shadow: -1px 7px 19px 2px rgba(0,0,0,0.44);
-moz-box-shadow: -1px 7px 19px 2px rgba(0,0,0,0.44);
box-shadow: -1px 7px 19px 2px rgba(0,0,0,0.44);
*/

}
.saudi-section ul li:nth-child(4) span.text-info{border: 0;position: absolute;}
.flex-list li {
  display: flex;
  padding-right: 5px;
  padding-left: 5px;
  flex-direction: row;
  align-items: center;
}

.saudi-section ul li {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 140px;height: 140px
}

.saudi-section ul li span {
  font-weight: bold;
  background: #fff;
  width: 90px;
  height: 90px;
  border-radius: 50%;
  display: inline-block;
  display: flex;
  justify-content: center;
  align-items: center;
    /*box-shadow: 0 2px 28px 0 rgba(0,0,0,0.5);}*/
    padding:14px 
}

.love {
  display: inline-block;
  margin: 0 5px
}

.footer-section a {
  color: #fff
}

.footer-section li {
  list-style-type: none
}

.foote-section ul {
  margin-bottom: 0
}

.footer-section {
  background-color: #002e17;
  padding-top: 50px;
  padding-bottom: 25px
}
.footer-section hr{


  border: 1px solid #154429;margin: 50px auto;color: #154429



}

.footer-section .icon.social{color: #00a15b}
.news-section {
  /*background: url("../images/latest-news-bg.png") no-repeat;*/
  padding: 80px 0 80px 0;background-size: 100% 100%;
}
.saudi-section h1{
  /*background: url("../images/sidebar.png") no-repeat right center*/
}
.news-box {
  background: #009e60
}
.news-section .flex{padding: 25px;
  /*width: 90%*/
}
.news-section-container{margin-bottom:15px}
.top p{ color: #FFFFFF; font-size: 10px;  font-weight: 500; letter-spacing: 1.67px; line-height: 13px;}
.top h4{color: #0A2D19; font-size: 22px;  line-height: 32px;}


.news-section .links{background: transparent;
align-self:flex-end;
}
.news-section .links a{color: #00865A;  font-size: 12px;  font-weight: 500; line-height: 16px;  text-align: center; background-color: #FFFFFF;
border-radius: 50px;min-height: 33px;width:100px

}
.partition h3{margin-top: 0;  color: #FFFFFF; font-size: 18px;  font-weight: 500; line-height: 23px;}
.partition{border-right:1px solid #154429;padding: 15px 0 }

.partition-3{padding-right: 15px}
.contacts li{  color: rgba(255,255,255,0.5); font-size: 12px;  line-height: 16px;padding-bottom: 15px;font-weight: normal;}
.contacts li i.fa{display: inline-block;margin-right: 15px;
position: relative;
    top: -1px;

}
.partition ul li{display: block;padding-bottom: 5px}
.contacts li i img{width: 15px;margin-bottom: 3px}
.partition ul li a{ color: rgba(255,255,255,0.5); font-size: 12px;  line-height: 16px;}

.form-control-feedback i.fa img{
width: 18px;
    position: relative;
    top: 4px;
    left: -5px;

}
h3.signup-section{margin-bottom: 25px}
.footer-section button{
  margin: 0 5px;
    height: 44px;
    padding: 5px 20px;
}
 
 .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:#007b51;
 top: inherit;
    bottom: 0;
 }
 .swiper-container-horizontal>.swiper-pagination-progressbar, .swiper-container-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{
  height: 5px;top: inherit;bottom: 0
 }
    .swiper-container {
      width: 100%;
      height: 100%;
    }
    .swiper-slide {
      /*text-align: center;*/
      font-size: 18px;
      background: #fff;
      /* Center slide text vertically */
      display: -webkit-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      -webkit-justify-content: center;
      justify-content: center;
      -webkit-box-align: flex-start;
      -ms-flex-align: flex-start;
      -webkit-align-items: flex-start;
      align-items: flex-start;
    }
  





.news-flex{
  display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-align-content: stretch;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
}
a.hasBorder{border-right: 1px solid #0A1F44;}
.navbar-default .navbar-nav>li>a{text-align: center;}
.navbar-default .navbar-nav>li>a.btn-default{height: auto;padding: 5px 20px;margin: 5px 25px}
.lang{padding-top: 0!important;padding-bottom: 5px!important}
.navbar-brand{position: relative;top: 0px}
/*.navbar-default .navbar-nav>li:hover>a{color: rgba(255,255,255,0.7)}*/

.navbar-default .navbar-nav>li>a:focus, .navbar-default .navbar-nav>li>a:hover{
  /*color: rgba(255,255,255,0.7)*/
}
.benefits-section h1{
margin-bottom: 0;
text-transform: uppercase;
  color: #E2689A; font-family: Helvetica; font-size: 18px;  font-weight: bold;  letter-spacing: 4.46px; line-height: 60px
}
.margin-left{
      margin-left: 84px;
}
.benefits-section h2{
    margin-bottom: 50px;
  color: #000; font-family: "Gotham Rounded";  font-size: 25px;  font-weight: 500; line-height: 35px;margin-top: 0;
}
.speed-meter{padding: 25px 0 0}
button.btn-default{color: #fff}
.partition input{border-radius: 30px}


/**/


body .dropdown-menu {
  border-radius: 0;
}
body .multiselect-native-select {
  position: relative;
}
body .multiselect-native-select select {
  border: 0 !important;
  clip: rect(0 0 0 0) !important;
  height: 1px !important;
  margin: -1px -1px -1px -3px !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: absolute !important;
  width: 1px !important;
  left: 50%;
  top: 30px;
}
body .multiselect-container {
  position: absolute;
  list-style-type: none;
  margin: 0;
  padding: 0;
}
body .multiselect-container .input-group {
  margin: 5px;
}
.multiselect-selected-text,.filter-option{width: 100%;
      font-size: 14px;
    font-weight: 500;
    line-height: 24px;
    color: #000;
    display: inline-block;
    text-align: left;
  }
.btn-group.open .dropdown-toggle{background: transparent;box-shadow: none;}

.btn .caret{position: relative;
    right: 15px;
/*color: #8A94A6;*/
background: url("../images/select.png ") no-repeat;
width: 8px;
    height: 5px;
  }
.form-control, .btn-group .btn-default:hover .btn .caret{
  /*color: transparent;*/
}
.bootstrap-select.btn-group .dropdown-toggle .caret{
     top: 50%;
    right: 10px;
}
body .multiselect-container li {
  padding: 3px;
}
body .multiselect-container li .multiselect-all label {
  font-weight: 700;
}
.dropdown-menu>.active>a, .dropdown-menu>.active>a:focus, 
.dropdown-menu>.active>a:hover{
background-color: transparent;
}
body .multiselect-container li a label{line-height: 21px;}
body .multiselect-container li a {
  padding: 0;
}
body .multiselect-container li a label {
  margin: 0;
  height: 100%;
  cursor: pointer;
  font-weight: 400;
  padding: 3px 20px 3px 40px;
}
body .multiselect-container li a label input[type=checkbox] {
  margin-bottom: 5px;
}
body .multiselect-container li a label.radio {
  margin: 0;
}
body .multiselect-container li a label.checkbox {
  margin: 0;
}
body .multiselect-container li.multiselect-group label {
  margin: 0;
  padding: 3px 20px 3px 20px;
  height: 100%;
  font-weight: 700;
}
body .multiselect-container li.multiselect-group-clickable label {
  cursor: pointer;
}
body .btn-group .btn-group .multiselect.btn {
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
}
body .form-inline .multiselect-container label.checkbox {
  padding: 3px 20px 3px 40px;
}
body .form-inline .multiselect-container label.radio {
  padding: 3px 20px 3px 40px;
}
body .form-inline .multiselect-container li a label.checkbox input[type=checkbox] {
  margin-left: -20px;
  margin-right: 0;
}
body .form-inline .multiselect-container li a label.radio input[type=radio] {
  margin-left: -20px;
  margin-right: 0;
}


/**/

/**/
label.container-box{padding-left: 35px}

.container-box {
    display: block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 22px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* Hide the browser's default checkbox */
.container-box input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

/* Create a custom checkbox */
.checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 20px;
    width: 20px;
    background-color: #fff;border: 1px solid #d4dee7;margin-right: 15px;
    display: inline-block;    border-radius: 2px;
}

/* On mouse-over, add a grey background color */
.container-box:hover input ~ .checkmark {
    background-color: #ccc;
}
.has-Border:after{
content: "";
position: absolute;right: 0;
  border-right: 1px solid #585858;top: 18px;
    height: 35px;}
/* When the checkbox is checked, add a blue background */
.container-box input:checked ~ .checkmark {
    background-color: #2196F3;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the checkmark when checked */
.container-box input:checked ~ .checkmark:after {
    display: block;
}

/* Style the checkmark/indicator */
.container-box .checkmark:after {
    left: 8px;
    top: 4px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}


/**/
.footer-txt{line-height: 40px}
.footer-sharek img,.footer-halayalla img{    display: inline-block;
    margin-left: 15px;    width: 60px;}.footer-halayalla img{width:125px;text-align: right}
.footer-sharek,.footer-halayalla{font-size: 12px;text-align: right;}
.copyrights{  background-color: #072012;padding: 15px;color: #fff}
.navbar-default .navbar-toggle{border-color:#fff;}
.navbar-default .navbar-toggle .icon-bar{background-color: #fff}
.darks.navbar-default .navbar-toggle{border-color:#b22bfb;}
.darks.navbar-default .navbar-toggle{background-color:#b22bfb;}


/* Box colors */


/* Common button styles */
.button {
  float: left;
  min-width: 150px;
  max-width: 250px;
  display: block;
  margin: 1em;
  padding: 1em 2em;
  border: none;
  background: none;
  color: inherit;
  vertical-align: middle;
  position: relative;
  z-index: 1;
  -webkit-backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
}
.button:focus {
  outline: none;
}
.button > span {
  vertical-align: middle;
}

/* Text color adjustments (we could stick to the "inherit" but that does not work well in Safari) */
.bg-1 .button {
  color: #37474f;
  border-color: #37474f;
}
.bg-2 .button {
  color: #ECEFF1;
  border-color: #ECEFF1;
}
.bg-3 .button {
  color: #fff;
  border-color: #fff;
}

/* Sizes */
.button--size-s {
  font-size: 14px;
}
.button--size-m {
  font-size: 16px;
}
.button--size-l {
  font-size: 18px;
}

/* Typography and Roundedness */
.button--text-upper {
  letter-spacing: 2px;
  text-transform: uppercase;
}
.button--text-thin {
  font-weight: 300;
}
.button--text-medium {
  font-weight: 500;
}
.button--text-thick {
  font-weight: 600;
}
.button--round-s {
  border-radius: 5px;
}
.button--round-m {
  border-radius: 15px;
}
.button--round-l {
  border-radius: 40px;
}

/* Borders */
.button--border-thin {
  border: 1px solid;
}
.button--border-medium {
  border: 2px solid;
}
.button--border-thick {
  border: 3px solid;
}



/* Nina */
.button--nina {
  padding: 0 2em;
  background: #008a5c;
  color: #fff;
  overflow: hidden;
  -webkit-transition: background-color 0.3s;
  transition: background-color 0.3s;
}
.button--nina.button--inverted {
   background: transparent;
  /*background: #fff;*/
  /*color: #008a5c;*/
color:#fff;
  border:1px solid #C9CED6;
}
.button--nina > span {
  display: inline-block;
  padding: 1em 0;
  opacity: 0;
  color: #fff;
  -webkit-transform: translate3d(0, -10px, 0);
  transform: translate3d(0, -10px, 0);
  -webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
  transition: transform 0.3s, opacity 0.3s;
  -webkit-transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
  transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
}
.button--nina::before {
  content: attr(data-text);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 1em 0;
  -webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
  transition: transform 0.3s, opacity 0.3s;
  -webkit-transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
  transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
}
.button--nina:hover {
  background-color: #008a5c;
}
.button--nina:hover::before {
  opacity: 0;
  -webkit-transform: translate3d(0, 100%, 0);
  transform: translate3d(0, 100%, 0);
}
.button--nina:hover > span {
  opacity: 1;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}
.button--nina:hover > span:nth-child(1) {
  -webkit-transition-delay: 0.045s;
  transition-delay: 0.045s;
}
.button--nina:hover > span:nth-child(2) {
  -webkit-transition-delay: 0.09s;
  transition-delay: 0.09s;
}
.button--nina:hover > span:nth-child(3) {
  -webkit-transition-delay: 0.135s;
  transition-delay: 0.135s;
}
.button--nina:hover > span:nth-child(4) {
  -webkit-transition-delay: 0.18s;
  transition-delay: 0.18s;
}
.button--nina:hover > span:nth-child(5) {
  -webkit-transition-delay: 0.225s;
  transition-delay: 0.225s;
}
.button--nina:hover > span:nth-child(6) {
  -webkit-transition-delay: 0.27s;
  transition-delay: 0.27s;
}
.button--nina:hover > span:nth-child(7) {
  -webkit-transition-delay: 0.315s;
  transition-delay: 0.315s;
}
.button--nina:hover > span:nth-child(8) {
  -webkit-transition-delay: 0.36s;
  transition-delay: 0.36s;
}
.button--nina:hover > span:nth-child(9) {
  -webkit-transition-delay: 0.405s;
  transition-delay: 0.405s;
}
.button--nina:hover > span:nth-child(10) {
  -webkit-transition-delay: 0.45s;
  transition-delay: 0.45s;
}
.button--nina:hover > span:nth-child(11) {
  -webkit-transition-delay: 0.45s;
  transition-delay: 0.45s;
}
.button--nina:hover > span:nth-child(12) {
  -webkit-transition-delay: 0.45s;
  transition-delay: 0.45s;
}
.button--nina:hover > span:nth-child(13) {
  -webkit-transition-delay: 0.45s;
  transition-delay: 0.45s;
}
.button--nina:hover > span:nth-child(14) {
  -webkit-transition-delay: 0.45s;
  transition-delay: 0.45s;
}
.button--nina:hover > span:nth-child(15) {
  -webkit-transition-delay: 0.45s;
  transition-delay: 0.45s;
}
.button--nina:hover > span:nth-child(16) {
  -webkit-transition-delay: 0.45s;
  transition-delay: 0.45s;
}




.swiper-container-3.swiper-container-horizontal>.swiper-pagination-bullets,.swiper-container-4.swiper-container-horizontal>.swiper-pagination-bullets{
bottom: 30px
}
.swiper-container-3  img,.swiper-container-4  img{
   -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
  filter: grayscale(100%);opacity: 0.8
}

.participate-section h1{
  margin-bottom: 20px
}
.participate-section.contact-section h1{
  margin-bottom: 10px
}
.participate-section.contact-new-section h1{
    text-align: left;margin-bottom: 60px
}.participate-section.contact-new-section p{
  text-align: left;width: 100%
}
/*parachute*/
.parachute {
  margin: 0px auto;
  /*width: 400px;*/
  animation: xAxis 30s infinite cubic-bezier(0.02, 0.01, 0.11, 1);
}
.parachute__img {
  animation: yAxis 30s infinite cubic-bezier(0.02, 0.01, 0.11, 1);
}
.parachute__img:before {
 
}

.plane {
 
}

@keyframes yAxis {
  50% {
    animation-timing-function: cubic-bezier(0.02, 0.01, 0.21, 1);
    transform: translateY(-50px);
  }
}
@keyframes xAxis {
  50% {
    animation-timing-function: cubic-bezier(0.3, 0.27, 0.07, 1.64);
    transform: translateX(200px);
  }
}
@keyframes swing {
  0% {
    transform: rotate(5deg);
  }
  100% {
    transform: rotate(-5deg);
  }
}
@keyframes right {
  0% {
    left: -108px;
  }
  100% {
    left: calc(100% + 108px);
  }
}

/*parachute*/


/*article section*/.audit_progress{
  display: flex;
  margin-top: 75px;
}
.audit_steps img{
width: 30px;
}
.audit_steps h3{
color: #FFFFFF; font-family: "Gotham Rounded";  font-size: 14px;  font-weight: 500; letter-spacing: -0.33px;  line-height: 15px;  text-shadow: 0 2px 4px 0 rgba(0,0,0,0.14);
}
.audit_steps:nth-child(1) img{
  top:2px;position: relative;
}
.audit_steps:nth-child(1) img{
  width: 17px;
}
.audit_steps:nth-child(1) {
  width: 100px;
}
.custom_width{
  width: 80%
}
.audit_steps:nth-child(5)::after {
  /*width: 100px;*/
  right: -2px
}
.audit_steps{
  /*padding-right: 15px*/
}
.audit_steps:nth-child(5),.audit_steps:nth-child(1){
  /*padding-right: 0*/
}
.audit_steps{
  position: relative;
}
.audit_steps::after{
  content: "";
  position: absolute;
    background: #fff;
    height: 1px;
    /* width: 69%; */
    top: 13px;
    left: 40px;
    right: 10px;
}
.audit_steps:nth-child(1)::after {
  /*width: 50px;*/
left: 17px;
}
.audit_steps p{
  color: #FFFFFF; font-family: "Gotham Rounded";  font-size: 13px;  font-weight: 300; letter-spacing: -0.3px; line-height: 15px;  text-shadow: 0 2px 4px 0 rgba(0,0,0,0.14);margin-bottom: 0;text-align: left;
}
.form-inline-tag{
  position: relative;
}
.form-inline-tag{
  width: 60%;float: left;margin-right: 15px;
}
.article-section{
  padding-top: 80px;
  padding-bottom: 80px;
}
.article-section h1{
    color: #000; font-family: "Gotham Rounded";  font-size: 29px;  font-weight: 500; line-height: 43px;
    margin-top: 0
}
.article-section p{
  margin-bottom: 35px;
  color: #474B54; font-family: "Gotham Rounded";  font-size: 16px;  font-weight: 300;  line-height: 24px;
}
.check_icon span{
  display: inline-block;padding-right: 10px
}
.article-section p.mydesc{
  margin-top: 18px;margin-bottom: 12px;
  color: #000; font-family: "Gotham Rounded";  font-size: 12px;  font-weight: 300; line-height: 18px;
}
/*article section*/
/*pricing*/
.snip1255 {
  
 
}
.snip1255 .plan {
  text-align: center;
  margin: 0 auto;
  /*width: 25%;*/
  position: relative;
  /*float: left;*/
    border: 1px solid #E7E0EC;  border-radius: 4px; background-color: #FAF6FD;  
    /*box-shadow: 0 3px 9px 0 rgba(113,100,113,0.12);*/
  padding: 30px 35px 30px;
}
.snip1255 .plan:hover ,
.snip1255 .plan.hover  {
  /*-webkit-transform: scale(1.1);
  transform: scale(1.1);*/
  /*z-index: 3;*/
  /*background: #fff*/
}
.snip1255 .plan.hover .featured{

}
.snip1255 .plan{
  position: relative;
  z-index: 1;
   text-rendering: optimizeLegibility;
}
.snip1255 .plan.featured{
 -webkit-transform: scale(1.05);
  transform: scale(1.05);
  position: relative;z-index: 2;
    transform-origin:top ;
}
.snip1255 .plan.featured * { /* the children */
 /*  transform: scaleX(1); 
   -webkit-transform: scaleX(1);*/

}
.snip1255 .plan.featured > ul{
/*  -webkit-transform: scaleX(1);
  transform: scaleX(1);*/
}
.snip1255 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.25s ease-out;
  transition: all 0.25s ease-out;
}
.snip1255 header {
  position: relative;
  /*background-color: #262626;*/
  margin-bottom:25px;
  /*padding: 20px 20px;*/
}
.snip1255 header b {
    color: #9956CB; font-family: "Gotham Rounded";  font-size: 16px;  font-weight: 300; line-height: 43px;
  display: inline-block;    position: relative;
    left: 1px;
    top: -3px;
}
.snip1255 .plan-title {
  color: #2C323A; font-family: "Gotham Rounded";  font-size: 17px;  font-weight: 500;  line-height: 24px;  text-align: center;
}
.snip1255 .plan.featured header{
  margin-top: 35px
}
.snip1255 .plan-cost {
  /*margin: 8px 0;*/
}
.snip1255 .plan-price {
  color: #ac48f2; font-family: "Gotham Rounded";  font-size: 34px;  font-weight: 500; line-height: 43px;  text-align: center;
}
.snip1255 .plan.featured .plan-price{
    color:#4a29b8;
}
.snip1255 .plan-type {
   color: #14181E;  font-family: "Gotham Rounded";  font-size: 13px;  font-weight: 300; line-height: 21px;text-transform: uppercase;
}
.plan-features-2{
  /*min-height: 250px; */
}
.swiper-container-2 .swiper-pagination span:nth-child(5) ,.swiper-container-2 .swiper-pagination span:nth-child(6),.swiper-container-2 .swiper-pagination span:nth-child(7),
.swiper-container-2 .swiper-pagination span:nth-child(8),.swiper-container-2 .swiper-pagination span:nth-child(9),
.swiper-container-2 .swiper-pagination span:nth-child(10) ,.swiper-container-2 .swiper-pagination span:nth-child(11),
.swiper-container-2 .swiper-pagination span:nth-child(12)  
    {
  /*display: none!important*/
}

/**/
.usability-pricing .snip1255 .plan .plan-features{

}
.usability-pricing .snip1255 .plan-1 .plan-features-2{
  min-height: 250px;
}
.usability-pricing .snip1255 .plan.featured .plan-features-2{
  min-height: 255px
}

.pricing-section{
  padding-bottom: 100px
}
.audits-pricing .snip1255 .plan-1 .plan-features-2 {
    min-height: 373px
}
.audits-pricing .snip1255 .plan.featured .plan-features-2{
  min-height:330px
}
.audits-pricing .snip1255 .plan-2 .plan-features-2{
      min-height: 215px;
}




.survey-pricing .snip1255 .plan-1 .plan-features-2{
  min-height: 155px;
}
.survey-pricing .snip1255 .plan.featured .plan-features-2{
  min-height: 150px
}
.survey-pricing .snip1255 .plan-2 .plan-features-2{
  min-height: 120px;
}




.design-pricing .snip1255 .plan-1 .plan-features-2{
      min-height: 289px;
}
.design-pricing .snip1255 .plan.featured .plan-features-2{
  min-height: 240px
}
.design-pricing .snip1255 .plan-2 .plan-features-2{
  /*min-height: 120px;*/
}


/**/
.snip1255 .plan.featured .plan-features-2{
 /*min-height: 360px; */
}
.snip1255 .plan-features {
 
  padding: 0;
}
.snip1255 .plan-features li {
  list-style-type: none;
  /*border-top: 1px solid rgba(0, 0, 0, 0.2);*/
 color: #2E3444;  font-family: "Gotham Rounded";  font-size: 12px;  font-weight: 300;  line-height: 18px;text-align: left;margin-bottom: 10px
}
.snip1255 .plan-features.plan-features-2 li{
 color: #2E3444;
}
.snip1255 .plan-features.plan-features-2 li strong{
  color: #2C3341; font-family: "Gotham Rounded";  font-size: 15px;  font-weight: bold;  line-height: 17px;
}
.snip1255 .plan-features li:nth-child(even) {
  /*background: rgba(0, 0, 0, 0.08);*/
}
.snip1255 .plan-features i {
  margin-right: 8px;
  opacity: 0.4;
}
hr.cx_border{
  margin: 25px auto;border-top: 1px solid #e0d4e9
}
a.btn-default{
  border: 1px solid #4A30B5;  border-radius: 4px;
   /*box-shadow: 0 11px 15px 0 rgba(187,170,254,0.2);*/
  color: #4A30B5; font-family: "Gotham Rounded";  font-size: 14px;  font-weight: 500;   text-align: center;min-width: 146px;
}
a.btn-default.learn-btn{
  color: #fff;line-height: normal;
}
.snip1255 .plan-select {
  /*background-color: #191919;*/
  margin-top: 40px  
}
.snip1255 .plan-select a {
  
}
.plan.featured{
  position: relative;
}
.popular{
  position: absolute;  
        right: -5px;
    top: -3px;
    width: 75px
}
.snip1255 .plan-select a:hover {
  /*background-color: #262626;*/
}
.snip1255 .featured {
  margin-top: -30px;
  background-color: #fff;
  color: #ffffff;
  border: none;
  box-shadow: 0 3px 9px 0 rgba(63,71,73,0.15);
  /*box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);*/
  /*z-index: 1;*/
}
.snip1255 .featured .plan-select a {
  /*padding: 35px 25px;*/
}
@media only screen and (max-width: 767px) {
  .snip1255 .plan {
    /*width: 50%;*/
  }
  .snip1255 .plan-title,
  .snip1255 .plan-select a {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  .snip1255 .plan-select a,
  .snip1255 .featured .plan-select a {
    /*padding: 20px;*/
  }
  .snip1255 .featured {
    margin-top: 0;
  }
}
@media only screen and (max-width: 440px) {
  .snip1255 .plan {
    width: 100%;
  }
}

/*pricing*/



/*tooltip*/
.plan-features{
  position: relative;
  /*min-height: 300px*/
}
.tooltip{
  opacity: 1;
display: none!important;
  /*display: inline-block;*/
  position: relative;
    left: 6px;top: -1px
   
}.tooltip img{ width: 12px;}
.tooltip:hover span {
opacity: 1;
filter: alpha(opacity=100);
top: -6em;
/*left: 20em;*/
z-index: 99;
-webkit-transition: all 0.2s ease;
-moz-transition: all 0.2s ease;
-o-transition: all 0.2s ease;
transition: all 0.2s ease;
}

.box b {
  color: #fff;
}

.tooltip span {
  background: none repeat scroll 0 0 #000; /*-- some basic styling */
  color: #fff;border-radius: 2px;
  /*font-family: 'Helvetica';*/
  font-size: 0.8em;
  font-weight: normal;
  line-height: 1.5em;
  padding: 16px 15px;
  width: 240px;
  top: -4em;  /*-- this is the original position of the tooltip when it's hidden */
  /*left: 20em;*/
  margin-left: 0; 
  /*-- set opacity to 0 otherwise our animations won't work */
  opacity: 0;
  filter: alpha(opacity=0);   
  position: absolute;
  text-align: center; 
  z-index: 2;
  text-transform: none;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease-in-out;
}

.tooltip span:after {
  border-color: #222 rgba(0, 0, 0, 0);
  border-style: solid;
  border-width: 15px 15px 0;
  bottom: -15px;
  content: "";
  display: block;
  left: 31px;
  position: absolute;
  width: 0;
}


/*tooltip*/

/*rubberband */


header .darks .menuDots li, .innersection .menuDots li {
  cursor: pointer;
  display: inline-block;
  position: relative;
  /*padding: 0 16px;*/
}
header .darks .menuDots li span, .innersection .menuDots li span {
  /*font-size: 20px;*/
  display: block;
}
header .darks .menuDots li i, .innersection .menuDots li i {
  display: block;
  position: absolute;
 /* width: 24px;
  height: 24px;*/
  border-radius: 100%;
  background-color: #b22bfb;
  margin-left: auto;
  margin-right: auto;
  left: 0;
  right: 0;
  bottom: -60px;
  z-index: -1;
 /* -webkit-animation: rubberBandReverse 0.4s ease-in forwards;
  animation: rubberBandReverse 0.4s ease-in  forwards;*/
}
header .darks .menuDots li::before, header .darks .menuDots li::after, .innersection .menuDots li::before,  .innersection .menuDots li::after {
  content: '';
  display: block;
  position: absolute;
  width: 100%;
  height: 24px;
  background-color: #b22bfb;
  margin-left: auto;
  margin-right: auto;
  left: 0;
  right: 0;
}
header .darks .menuDots li::after, .innersection .menuDots li::after{
  background-color: transparent;
}
header .darks .menuDots li::before, .innersection .menuDots li::before {
  top: -50px;
}
header .darks .menuDots li::after, .innersection .menuDots li::after {
  bottom: -24px;
}
header .darks .menuDots li:hover i, .innersection .menuDots li:hover i {
  /*-webkit-animation: rubberBand 0.4s ease-out both;
  animation: rubberBand 0.4s ease-out both;*/
}
header .darks .menuDots li:hover span, .innersection .menuDots li:hover span{
  color: #b22bfb;
}
header .darks .menuDots .square {
 
}
header .darks .menuDots .square::before, .innersection .menuDots .square::before {
  content: none;
}
header .darks .menuDots li:nth-child(1) i, header .darks .menuDots li:nth-child(1)::before, .innersection .menuDots li:nth-child(1) i,  .innersection .menuDots li:nth-child(1)::before {
  /*background-color: #b22bfb;*/
}

main {
  /*display: block;*/
 /* position: absolute;
  top: 60px;
  left: 20px;
  right: 20px;
  bottom: 20px;
  background-color: #b22bfb;*/
}



@-webkit-keyframes rubberBand {
  0% {

    width: 28px;
    height: 28px;
    border-radius: 100%;
    -webkit-transform: scale(1, 1) translateY(0px);
    transform: scale(1, 1) translateY(0px);
  }
  50% {
    width: 22px;
    height: 22px;
    border-radius: 100%;
    -webkit-transform: scale(0.5, 1.5) translateY(-41px);
    transform: scale(0.5, 1.5) translateY(-41px);
  }
  100% {

    width: 100%;
    height: 4px;
    border-radius: 0;

    -webkit-transform: scale(1, 1) translateY(-118px);
    transform: scale(1, 1) translateY(-118px);
  }
}
@-webkit-keyframes rubberBandReverse {
  100% {
    width: 28px;
    height: 28px;
    border-radius: 100%;
    -webkit-transform: scale(1, 1) translateY(0);
    transform: scale(1, 1) translateY(0);
  }
  50% {
    width: 22px;
    height: 22px;
    border-radius: 100%;
    -webkit-transform: scale(0.5, 1.5) translateY(-41px);
    transform: scale(0.5, 1.5) translateY(-41px);
  }
  0% {
    width: 100%;
    height: 2px;
    border-radius: 0;
    -webkit-transform: scale(1, 1) translateY(-112px);
    transform: scale(1, 1) translateY(-112px);
  }
}

/*rubberband*/
/*falldown*/
@keyframes float {

  from {
    transform: scale(0.8);
  }

  to {
    transform: translatey(-20px);
    transform: scale(1);
  }
}

.in-view {
  animation: float 9s ease-in-out infinite;
  animation-iteration-count: 1;
}



@keyframes slideDown {
  0% {
    transform: translateY(-100%);
    color: transparent;
  }

  50% {
    transform: translateY(8%);
  }

  65% {
    transform: translateY(4%);
  }

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

@keyframes textShow {
  0% {
    color: transparent;
  }
  100% {
    color: #2c3149;
  }
}

.slideDown2 {
  animation-name: slideDown;
  -webkit-animation-name: slideDown;
  animation-duration: 2s;
  -webkit-animation-duration: 2s;
  animation-timing-function: ease;  
  -webkit-animation-timing-function: ease;   
  visibility: visible !important;
}


.slideDown3 {
  animation-name: slideDown;
  -webkit-animation-name: slideDown;
  animation-duration: 3s;
  -webkit-animation-duration: 3s;
  animation-timing-function: ease;
  -webkit-animation-timing-function: ease;
  visibility: visible !important;
}

.slideDown4 {
  animation-name: slideDown;
  -webkit-animation-name: slideDown;
  animation-duration: 4s;
  -webkit-animation-duration: 4s;
  animation-timing-function: ease;
  -webkit-animation-timing-function: ease;
  visibility: visible !important;
}

.slideDown5 {
  animation-name: slideDown;
  -webkit-animation-name: slideDown;

  animation-duration: 5s;
  -webkit-animation-duration: 5s;

  animation-timing-function: ease;
  -webkit-animation-timing-function: ease;

  visibility: visible !important;
}

.textShow2 {
  animation-name: textShow;
  -webkit-animation-name: textShow;
  animation-duration: 6s;
  -webkit-animation-duration: 6s;
}

.textShow3 {
  animation-name: textShow;
  -webkit-animation-name: textShow;
  animation-duration: 8s;
  -webkit-animation-duration: 8s;
}

.textShow4 {
  animation-name: textShow;
  -webkit-animation-name: textShow;
  animation-duration: 10s;
  -webkit-animation-duration: 10s;
}

.textShow5 {
  animation-name: textShow;
  -webkit-animation-name: textShow;
  animation-duration: 12s;
  -webkit-animation-duration: 12s;
}



/*falldown*/


/*input aniamtion*/
.form-group{
  position: relative;
}
.form-control:focus{outline: none;outline-style:none;
box-shadow:none;
border-color:transparent;}
.form-control{border: 0; border: 1px solid #d4dee7}

.form-control ~ .focus-border{position: absolute; bottom: 0; left: 0; width: 0; height: 2px; background-color: #4A30B5; 
border: none;outline-style:none;
box-shadow:none;
border-color:transparent;
  transition: 0.4s;

}
.form-control:focus ~ .focus-border{width: 100%; transition: 0.4s;}


/*input animation*/



/*ringign*/

.phonering-alo-phone.phonering-alo-static {
    opacity:.6
}

.phonering-alo-phone.phonering-alo-hover,.phonering-alo-phone:hover {
    opacity:1
}

.phonering-alo-ph-circle {
  margin: 0 auto;
    width:130px;
    height:130px;
    top:-40px;
    left:0px;right: 0;
    position:absolute;
    background-color:transparent;
    border-radius:100% !important;
    border:2px solid rgba(254,59,86,0.4);
    border:2px solid #bfebfc 9;
    opacity:.1;
    -webkit-animation:phonering-alo-circle-anim 1.2s infinite linear;
    animation:phonering-alo-circle-anim 1.2s infinite linear;
    transition:all .5s;
    animation-delay: 0.5s; -webkit-animation-delay: 0.5s;
    -webkit-transform-origin:50% 50%;
    -ms-transform-origin:50% 50%;
    transform-origin:50% 50%
}
.phonering-alo-ph-circle2 {
  margin: 0 auto;
    width:100px;
    height:100px;
    top:-25px;
    left:0px;right: 0;
    position:absolute;
    background-color:transparent;
    border-radius:100% !important;
    border:2px solid rgba(254,59,86,0.4);
    border:2px solid #bfebfc 9;
    opacity:.1;
    -webkit-animation:phonering-alo-circle-anim2 1.2s infinite linear;
    animation:phonering-alo-circle-anim2 1.2s infinite linear;
    -webkit-animation-delay: 0.8s;
    animation-delay: 0.8s;
    transition:all .5s;
    -webkit-transform-origin:50% 50%;
    -ms-transform-origin:50% 50%;
    transform-origin:50% 50%
}
.flex-row{
  display: flex;
  align-items:center;
}
.phonering-alo-ph-circle3 {
  margin: 0 auto;
    width:70px;
    height:70px;
    top:-10px;
    left:0px;right: 0;
    position:absolute;
    background-color:transparent;
    border-radius:100% !important;
    border:2px solid rgba(254,59,86,0.4);
    border:2px solid #bfebfc 9;
    opacity:.1;
    -webkit-animation:phonering-alo-circle-anim2 1.2s infinite linear;
    animation:phonering-alo-circle-anim2 1.2s infinite linear;
    /*-webkit-animation-delay: 0.8s;
    animation-delay: 0.8s;*/
    transition:all .5s;
    -webkit-transform-origin:50% 50%;
    -ms-transform-origin:50% 50%;
    transform-origin:50% 50%
}




.outer-circle{
  position: relative;width: 100%
}
 h4.message-thank{
  color: #14181E; font-family: "Gotham Rounded";  font-size: 23px;  font-weight: 300; line-height: 32px;  text-align: center;margin-top: 50px
}
.phonering-alo-ph-circle-fill {
    width:100px;
    height:100px;
    top:50px;
    left:50px;
    position:absolute;
    background-color: #000;
    border-radius:100% !important;
    border:2px solid transparent;
    -webkit-animation:phonering-alo-circle-fill-anim 2.3s infinite ease-in-out;
    animation:phonering-alo-circle-fill-anim 2.3s infinite ease-in-out;
    transition:all .5s;
    -webkit-transform-origin:50% 50%;
    -ms-transform-origin:50% 50%;
    transform-origin:50% 50%
}

.phonering-alo-phone.phonering-alo-active .phonering-alo-ph-circle-fill {
    -webkit-animation:phonering-alo-circle-fill-anim 1.7s infinite ease-in-out!important;
    animation:phonering-alo-circle-fill-anim 1.7s infinite ease-in-out!important
}

.phonering-alo-phone.phonering-alo-static .phonering-alo-ph-circle-fill {
    -webkit-animation:phonering-alo-circle-fill-anim 2.3s infinite ease-in-out!important;
    animation:phonering-alo-circle-fill-anim 2.3s infinite ease-in-out!important;
    opacity:0!important
}




.phonering-alo-ph-img-circle {
    width:50px;
    height:50px;margin: 0 auto;
    top:70px;
    left:70px;
    /*position:absolute;*/
    background:rgba(30,30,30,0.1) url(../images/Call@2x.png) no-repeat center center;
    border-radius:100% !important;
    border:2px solid transparent;
    -webkit-animation:phonering-alo-circle-img-anim 1s infinite ease-in-out;
    animation:phonering-alo-circle-img-anim 1s infinite ease-in-out;
    -webkit-transform-origin:50% 50%;
    -ms-transform-origin:50% 50%;
    transform-origin:50% 50%
}



@-webkit-keyframes phonering-alo-circle-anim {
    0% {
        -webkit-transform:rotate(0) scale(0) skew(1deg);
        -webkit-opacity:.1
    }

    50% {
        -webkit-transform:rotate(0) scale(.7) skew(1deg);
        -webkit-opacity:.5
    }

    100% {
        -webkit-transform:rotate(0) scale(1) skew(1deg);
        -webkit-opacity:.1
    }
}
@-webkit-keyframes phonering-alo-circle-anim2 {
    0% {
        -webkit-transform:rotate(0) scale(0) skew(1deg);
        -webkit-opacity:.1
    }

    50% {
        -webkit-transform:rotate(0) scale(.7) skew(1deg);
        -webkit-opacity:.5
    }

    100% {
        -webkit-transform:rotate(0) scale(1) skew(1deg);
        -webkit-opacity:.1
    }
}

@-webkit-keyframes phonering-alo-circle-fill-anim {
    0% {
        -webkit-transform:rotate(0) scale(.7) skew(1deg);
        opacity:.2
    }

    50% {
        -webkit-transform:rotate(0) scale(1) skew(1deg);
        opacity:.2
    }

    100% {
        -webkit-transform:rotate(0) scale(.7) skew(1deg);
        opacity:.2
    }
}


@-webkit-keyframes phonering-alo-circle-fill-anim {
    0% {
        -webkit-transform:rotate(0) scale(.3) skew(1deg);
        opacity:.2
    }

    50% {
        -webkit-transform:rotate(0) scale(1) skew(1deg);
        opacity:.2
    }

    100% {
        -webkit-transform:rotate(0) scale(.3) skew(1deg);
        opacity:.2
    }
}

@-webkit-keyframes phonering-alo-circle-img-anim {
    0% {
        -webkit-transform:rotate(0) scale(1) skew(1deg)
    }

    10% {
        -webkit-transform:rotate(-25deg) scale(1) skew(1deg)
    }

    20% {
        -webkit-transform:rotate(25deg) scale(1) skew(1deg)
    }

    30% {
        -webkit-transform:rotate(-25deg) scale(1) skew(1deg)
    }

    40% {
        -webkit-transform:rotate(25deg) scale(1) skew(1deg)
    }

    50% {
        -webkit-transform:rotate(0) scale(1) skew(1deg)
    }

    100% {
        -webkit-transform:rotate(0) scale(1) skew(1deg)
    }
}

@-webkit-keyframes fadeInRight {
    0% {
        opacity:0;
        -webkit-transform:translate3d(100%,0,0);
        -ms-transform:translate3d(100%,0,0);
        transform:translate3d(100%,0,0)
    }

    100% {
        opacity:1;
        -webkit-transform:none;
        -ms-transform:none;
        transform:none
    }
}

@keyframes fadeInRight {
    0% {
        opacity:0;
        -webkit-transform:translate3d(100%,0,0);
        -ms-transform:translate3d(100%,0,0);
        transform:translate3d(100%,0,0)
    }

    100% {
        opacity:1;
        -webkit-transform:none;
        -ms-transform:none;
        transform:none
    }
}

@-webkit-keyframes fadeOutRight {
    0% {
        opacity:1
    }

    100% {
        opacity:0;
        -webkit-transform:translate3d(100%,0,0);
        -ms-transform:translate3d(100%,0,0);
        transform:translate3d(100%,0,0)
    }
}

@keyframes fadeOutRight {
    0% {
        opacity:1
    }

    100% {
        opacity:0;
        -webkit-transform:translate3d(100%,0,0);
        -ms-transform:translate3d(100%,0,0);
        transform:translate3d(100%,0,0)
    }
}

@-webkit-keyframes phonering-alo-circle-anim {
    0% {
        -webkit-transform:rotate(0) scale(.5) skew(1deg);
                transform:rotate(0) scale(.5) skew(1deg);
        opacity:.1
    }

    30% {
        -webkit-transform:rotate(0) scale(.7) skew(1deg);
                transform:rotate(0) scale(.7) skew(1deg);
        opacity:.5
    }

    100% {
        -webkit-transform:rotate(0) scale(1) skew(1deg);
                transform:rotate(0) scale(1) skew(1deg);
        opacity:.1
    }
}

@keyframes phonering-alo-circle-anim {
    0% {
        -webkit-transform:rotate(0) scale(.5) skew(1deg);
                transform:rotate(0) scale(.5) skew(1deg);
        opacity:.1
    }

    30% {
        -webkit-transform:rotate(0) scale(.7) skew(1deg);
                transform:rotate(0) scale(.7) skew(1deg);
        opacity:.5
    }

    100% {
        -webkit-transform:rotate(0) scale(1) skew(1deg);
                transform:rotate(0) scale(1) skew(1deg);
        opacity:.1
    }
}

@-webkit-keyframes phonering-alo-circle-fill-anim {
    0% {
        -webkit-transform:rotate(0) scale(.7) skew(1deg);
                transform:rotate(0) scale(.7) skew(1deg);
        opacity:.2
    }

    50% {
        -webkit-transform:rotate(0) scale(1) skew(1deg);
                transform:rotate(0) scale(1) skew(1deg);
        opacity:.2
    }

    100% {
        -webkit-transform:rotate(0) scale(.7) skew(1deg);
                transform:rotate(0) scale(.7) skew(1deg);
        opacity:.2
    }
}

@keyframes phonering-alo-circle-fill-anim {
    0% {
        -webkit-transform:rotate(0) scale(.7) skew(1deg);
                transform:rotate(0) scale(.7) skew(1deg);
        opacity:.2
    }

    50% {
        -webkit-transform:rotate(0) scale(1) skew(1deg);
                transform:rotate(0) scale(1) skew(1deg);
        opacity:.2
    }

    100% {
        -webkit-transform:rotate(0) scale(.7) skew(1deg);
                transform:rotate(0) scale(.7) skew(1deg);
        opacity:.2
    }
}

@-webkit-keyframes phonering-alo-circle-img-anim {
    0% {
        -webkit-transform:rotate(0) scale(1) skew(1deg);
                transform:rotate(0) scale(1) skew(1deg)
    }

    10% {
        -webkit-transform:rotate(-25deg) scale(1) skew(1deg);
                transform:rotate(-25deg) scale(1) skew(1deg)
    }

    20% {
        -webkit-transform:rotate(25deg) scale(1) skew(1deg);
                transform:rotate(25deg) scale(1) skew(1deg)
    }

    30% {
        -webkit-transform:rotate(-25deg) scale(1) skew(1deg);
                transform:rotate(-25deg) scale(1) skew(1deg)
    }

    40% {
        -webkit-transform:rotate(25deg) scale(1) skew(1deg);
                transform:rotate(25deg) scale(1) skew(1deg)
    }

    50% {
        -webkit-transform:rotate(0) scale(1) skew(1deg);
                transform:rotate(0) scale(1) skew(1deg)
    }

    100% {
        -webkit-transform:rotate(0) scale(1) skew(1deg);
                transform:rotate(0) scale(1) skew(1deg)
    }
}

@keyframes phonering-alo-circle-img-anim {
    0% {
        -webkit-transform:rotate(0) scale(1) skew(1deg);
                transform:rotate(0) scale(1) skew(1deg)
    }

    10% {
        -webkit-transform:rotate(-25deg) scale(1) skew(1deg);
                transform:rotate(-25deg) scale(1) skew(1deg)
    }

    20% {
        -webkit-transform:rotate(25deg) scale(1) skew(1deg);
                transform:rotate(25deg) scale(1) skew(1deg)
    }

    30% {
        -webkit-transform:rotate(-25deg) scale(1) skew(1deg);
                transform:rotate(-25deg) scale(1) skew(1deg)
    }

    40% {
        -webkit-transform:rotate(25deg) scale(1) skew(1deg);
                transform:rotate(25deg) scale(1) skew(1deg)
    }

    50% {
        -webkit-transform:rotate(0) scale(1) skew(1deg);
                transform:rotate(0) scale(1) skew(1deg)
    }

    100% {
        -webkit-transform:rotate(0) scale(1) skew(1deg);
                transform:rotate(0) scale(1) skew(1deg)
    }
}


/*ringign*/

.media-body ul.list-inline{
  margin-top: 25px;display: flex;flex-direction:row;justify-content:space-between;
}
.media-body ul.list-inline li{
  color:#fff;
}

.snip1255 .plan-features.plan-features-list li{
  display: flex;align-items:center;
}
.snip1255 .plan-features.plan-features-2.plan-features-list li{
align-items:flex-start;
}
span.li-icon{
  display: inline-block;margin-right: 15px;
}
span.li-icon img{
  width: 12px;height: 12px;
      position: relative;
    top: -2px;

}
.snip1255 .plan.featured span.li-icon img{
  width: 12px;
}
ul.plan-features-2 span.li-icon img{
 width: 8px;height: 8px;
}
.snip1255 .plan.featured .plan-features-2 span.li-icon img{
   width: 8px;
}
.li-icon-disable{
 /*-webkit-filter: grayscale(100%); 
  filter: grayscale(100%);opacity: 0.5*/
}
span.li-text{

}


/*international Input*/

.intl-tel-input {
  position: relative;
  display: block; }
  .intl-tel-input * {
    box-sizing: border-box;
    -moz-box-sizing: border-box; }
  .intl-tel-input .hide {
    display: none; }
  .intl-tel-input .v-hide {
    visibility: hidden; }
  .intl-tel-input input, .intl-tel-input input[type=text], .intl-tel-input input[type=tel] {
    position: relative;
    z-index: 0;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-right: 36px;
    margin-right: 0; }
  .intl-tel-input .flag-container {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    padding: 1px; }
  .intl-tel-input .selected-flag {
    z-index: 1;
    position: relative;
    width: 36px;
    height: 100%;
    padding: 0 0 0 8px; }
    .intl-tel-input .selected-flag .iti-flag {
      position: absolute;
      top: 0;
      bottom: 0;
      margin: auto; }
    .intl-tel-input .selected-flag .iti-arrow {
      position: absolute;
      top: 50%;
      margin-top: -2px;
      right: 6px;
      width: 0;
      height: 0;
      border-left: 3px solid transparent;
      border-right: 3px solid transparent;
      border-top: 4px solid #555; }
      .intl-tel-input .selected-flag .iti-arrow.up {
        border-top: none;
        border-bottom: 4px solid #555; }
  .intl-tel-input .country-list {
    position: absolute;
    z-index: 2;
    list-style: none;
    text-align: left;
    padding: 0;
    margin: 0 0 0 -1px;
    box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.2);
    background-color: white;
    border: 1px solid #CCC;
    white-space: nowrap;
    max-height: 200px;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch; }
    .intl-tel-input .country-list.dropup {
      bottom: 100%;
      margin-bottom: -1px; }
    .intl-tel-input .country-list .flag-box {
      display: inline-block;
      width: 20px; }
    @media (max-width: 500px) {
      .intl-tel-input .country-list {
        white-space: normal; } }
    .intl-tel-input .country-list .divider {
      padding-bottom: 5px;
      margin-bottom: 5px;
      border-bottom: 1px solid #CCC; }
    .intl-tel-input .country-list .country {
      padding: 5px 10px; }
      .intl-tel-input .country-list .country .dial-code {
        color: #999; }
    .intl-tel-input .country-list .country.highlight {
      background-color: rgba(0, 0, 0, 0.05); }
    .intl-tel-input .country-list .flag-box, .intl-tel-input .country-list .country-name, .intl-tel-input .country-list .dial-code {
      vertical-align: middle; }
    .intl-tel-input .country-list .flag-box, .intl-tel-input .country-list .country-name {
      margin-right: 6px; }
  .intl-tel-input.allow-dropdown input, .intl-tel-input.allow-dropdown input[type=text], .intl-tel-input.allow-dropdown input[type=tel], .intl-tel-input.separate-dial-code input, .intl-tel-input.separate-dial-code input[type=text], .intl-tel-input.separate-dial-code input[type=tel] {
    padding-right: 6px;
    padding-left: 52px;
    margin-left: 0; }
  .intl-tel-input.allow-dropdown .flag-container, .intl-tel-input.separate-dial-code .flag-container {
    right: auto;
    left: 0; }
  .intl-tel-input.allow-dropdown .selected-flag, .intl-tel-input.separate-dial-code .selected-flag {
    width: 46px; }
  .intl-tel-input.allow-dropdown .flag-container:hover {
    cursor: pointer; }
    .intl-tel-input.allow-dropdown .flag-container:hover .selected-flag {
      background-color: rgba(0, 0, 0, 0.05); }
  .intl-tel-input.allow-dropdown input[disabled] + .flag-container:hover, .intl-tel-input.allow-dropdown input[readonly] + .flag-container:hover {
    cursor: default; }
    .intl-tel-input.allow-dropdown input[disabled] + .flag-container:hover .selected-flag, .intl-tel-input.allow-dropdown input[readonly] + .flag-container:hover .selected-flag {
      background-color: transparent; }
  .intl-tel-input.separate-dial-code .selected-flag {
    background-color: rgba(0, 0, 0, 0.05);
    display: table; }
  .intl-tel-input.separate-dial-code .selected-dial-code {
    display: table-cell;
    vertical-align: middle;
    padding-left: 28px; }
  .intl-tel-input.separate-dial-code.iti-sdc-2 input, .intl-tel-input.separate-dial-code.iti-sdc-2 input[type=text], .intl-tel-input.separate-dial-code.iti-sdc-2 input[type=tel] {
    padding-left: 66px; }
  .intl-tel-input.separate-dial-code.iti-sdc-2 .selected-flag {
    width: 60px; }
  .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-2 input, .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-2 input[type=text], .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-2 input[type=tel] {
    padding-left: 76px; }
  .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-2 .selected-flag {
    width: 70px; }
  .intl-tel-input.separate-dial-code.iti-sdc-3 input, .intl-tel-input.separate-dial-code.iti-sdc-3 input[type=text], .intl-tel-input.separate-dial-code.iti-sdc-3 input[type=tel] {
    padding-left: 74px; }
  .intl-tel-input.separate-dial-code.iti-sdc-3 .selected-flag {
    width: 68px; }
  .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-3 input, .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-3 input[type=text], .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-3 input[type=tel] {
    padding-left: 84px; }
  .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-3 .selected-flag {
    width: 78px; }
  .intl-tel-input.separate-dial-code.iti-sdc-4 input, .intl-tel-input.separate-dial-code.iti-sdc-4 input[type=text], .intl-tel-input.separate-dial-code.iti-sdc-4 input[type=tel] {
    padding-left: 82px; }
  .intl-tel-input.separate-dial-code.iti-sdc-4 .selected-flag {
    width: 76px; }
  .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-4 input, .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-4 input[type=text], .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-4 input[type=tel] {
    padding-left: 92px; }
  .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-4 .selected-flag {
    width: 86px; }
  .intl-tel-input.separate-dial-code.iti-sdc-5 input, .intl-tel-input.separate-dial-code.iti-sdc-5 input[type=text], .intl-tel-input.separate-dial-code.iti-sdc-5 input[type=tel] {
    padding-left: 90px; }
  .intl-tel-input.separate-dial-code.iti-sdc-5 .selected-flag {
    width: 84px; }
  .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-5 input, .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-5 input[type=text], .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-5 input[type=tel] {
    padding-left: 100px; }
  .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-5 .selected-flag {
    width: 94px; }
  .intl-tel-input.iti-container {
    position: absolute;
    top: -1000px;
    left: -1000px;
    z-index: 1060;
    padding: 1px; }
    .intl-tel-input.iti-container:hover {
      cursor: pointer; }

.iti-mobile .intl-tel-input.iti-container {
  top: 30px;
  bottom: 30px;
  left: 30px;
  right: 30px;
  position: fixed; }

.iti-mobile .intl-tel-input .country-list {
  max-height: 100%;
  width: 100%; }
  .iti-mobile .intl-tel-input .country-list .country {
    padding: 10px 10px;
    line-height: 1.5em; }

.iti-flag {
  width: 20px; }
  .iti-flag.be {
    width: 18px; }
  .iti-flag.ch {
    width: 15px; }
  .iti-flag.mc {
    width: 19px; }
  .iti-flag.ne {
    width: 18px; }
  .iti-flag.np {
    width: 13px; }
  .iti-flag.va {
    width: 15px; }
  @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .iti-flag {
      background-size: 5652px 15px; } }
  .iti-flag.ac {
    height: 10px;
    background-position: 0px 0px; }
  .iti-flag.ad {
    height: 14px;
    background-position: -22px 0px; }
  .iti-flag.ae {
    height: 10px;
    background-position: -44px 0px; }
  .iti-flag.af {
    height: 14px;
    background-position: -66px 0px; }
  .iti-flag.ag {
    height: 14px;
    background-position: -88px 0px; }
  .iti-flag.ai {
    height: 10px;
    background-position: -110px 0px; }
  .iti-flag.al {
    height: 15px;
    background-position: -132px 0px; }
  .iti-flag.am {
    height: 10px;
    background-position: -154px 0px; }
  .iti-flag.ao {
    height: 14px;
    background-position: -176px 0px; }
  .iti-flag.aq {
    height: 14px;
    background-position: -198px 0px; }
  .iti-flag.ar {
    height: 13px;
    background-position: -220px 0px; }
  .iti-flag.as {
    height: 10px;
    background-position: -242px 0px; }
  .iti-flag.at {
    height: 14px;
    background-position: -264px 0px; }
  .iti-flag.au {
    height: 10px;
    background-position: -286px 0px; }
  .iti-flag.aw {
    height: 14px;
    background-position: -308px 0px; }
  .iti-flag.ax {
    height: 13px;
    background-position: -330px 0px; }
  .iti-flag.az {
    height: 10px;
    background-position: -352px 0px; }
  .iti-flag.ba {
    height: 10px;
    background-position: -374px 0px; }
  .iti-flag.bb {
    height: 14px;
    background-position: -396px 0px; }
  .iti-flag.bd {
    height: 12px;
    background-position: -418px 0px; }
  .iti-flag.be {
    height: 15px;
    background-position: -440px 0px; }
  .iti-flag.bf {
    height: 14px;
    background-position: -460px 0px; }
  .iti-flag.bg {
    height: 12px;
    background-position: -482px 0px; }
  .iti-flag.bh {
    height: 12px;
    background-position: -504px 0px; }
  .iti-flag.bi {
    height: 12px;
    background-position: -526px 0px; }
  .iti-flag.bj {
    height: 14px;
    background-position: -548px 0px; }
  .iti-flag.bl {
    height: 14px;
    background-position: -570px 0px; }
  .iti-flag.bm {
    height: 10px;
    background-position: -592px 0px; }
  .iti-flag.bn {
    height: 10px;
    background-position: -614px 0px; }
  .iti-flag.bo {
    height: 14px;
    background-position: -636px 0px; }
  .iti-flag.bq {
    height: 14px;
    background-position: -658px 0px; }
  .iti-flag.br {
    height: 14px;
    background-position: -680px 0px; }
  .iti-flag.bs {
    height: 10px;
    background-position: -702px 0px; }
  .iti-flag.bt {
    height: 14px;
    background-position: -724px 0px; }
  .iti-flag.bv {
    height: 15px;
    background-position: -746px 0px; }
  .iti-flag.bw {
    height: 14px;
    background-position: -768px 0px; }
  .iti-flag.by {
    height: 10px;
    background-position: -790px 0px; }
  .iti-flag.bz {
    height: 14px;
    background-position: -812px 0px; }
  .iti-flag.ca {
    height: 10px;
    background-position: -834px 0px; }
  .iti-flag.cc {
    height: 10px;
    background-position: -856px 0px; }
  .iti-flag.cd {
    height: 15px;
    background-position: -878px 0px; }
  .iti-flag.cf {
    height: 14px;
    background-position: -900px 0px; }
  .iti-flag.cg {
    height: 14px;
    background-position: -922px 0px; }
  .iti-flag.ch {
    height: 15px;
    background-position: -944px 0px; }
  .iti-flag.ci {
    height: 14px;
    background-position: -961px 0px; }
  .iti-flag.ck {
    height: 10px;
    background-position: -983px 0px; }
  .iti-flag.cl {
    height: 14px;
    background-position: -1005px 0px; }
  .iti-flag.cm {
    height: 14px;
    background-position: -1027px 0px; }
  .iti-flag.cn {
    height: 14px;
    background-position: -1049px 0px; }
  .iti-flag.co {
    height: 14px;
    background-position: -1071px 0px; }
  .iti-flag.cp {
    height: 14px;
    background-position: -1093px 0px; }
  .iti-flag.cr {
    height: 12px;
    background-position: -1115px 0px; }
  .iti-flag.cu {
    height: 10px;
    background-position: -1137px 0px; }
  .iti-flag.cv {
    height: 12px;
    background-position: -1159px 0px; }
  .iti-flag.cw {
    height: 14px;
    background-position: -1181px 0px; }
  .iti-flag.cx {
    height: 10px;
    background-position: -1203px 0px; }
  .iti-flag.cy {
    height: 14px;
    background-position: -1225px 0px; }
  .iti-flag.cz {
    height: 14px;
    background-position: -1247px 0px; }
  .iti-flag.de {
    height: 12px;
    background-position: -1269px 0px; }
  .iti-flag.dg {
    height: 10px;
    background-position: -1291px 0px; }
  .iti-flag.dj {
    height: 14px;
    background-position: -1313px 0px; }
  .iti-flag.dk {
    height: 15px;
    background-position: -1335px 0px; }
  .iti-flag.dm {
    height: 10px;
    background-position: -1357px 0px; }
  .iti-flag.do {
    height: 14px;
    background-position: -1379px 0px; }
  .iti-flag.dz {
    height: 14px;
    background-position: -1401px 0px; }
  .iti-flag.ea {
    height: 14px;
    background-position: -1423px 0px; }
  .iti-flag.ec {
    height: 14px;
    background-position: -1445px 0px; }
  .iti-flag.ee {
    height: 13px;
    background-position: -1467px 0px; }
  .iti-flag.eg {
    height: 14px;
    background-position: -1489px 0px; }
  .iti-flag.eh {
    height: 10px;
    background-position: -1511px 0px; }
  .iti-flag.er {
    height: 10px;
    background-position: -1533px 0px; }
  .iti-flag.es {
    height: 14px;
    background-position: -1555px 0px; }
  .iti-flag.et {
    height: 10px;
    background-position: -1577px 0px; }
  .iti-flag.eu {
    height: 14px;
    background-position: -1599px 0px; }
  .iti-flag.fi {
    height: 12px;
    background-position: -1621px 0px; }
  .iti-flag.fj {
    height: 10px;
    background-position: -1643px 0px; }
  .iti-flag.fk {
    height: 10px;
    background-position: -1665px 0px; }
  .iti-flag.fm {
    height: 11px;
    background-position: -1687px 0px; }
  .iti-flag.fo {
    height: 15px;
    background-position: -1709px 0px; }
  .iti-flag.fr {
    height: 14px;
    background-position: -1731px 0px; }
  .iti-flag.ga {
    height: 15px;
    background-position: -1753px 0px; }
  .iti-flag.gb {
    height: 10px;
    background-position: -1775px 0px; }
  .iti-flag.gd {
    height: 12px;
    background-position: -1797px 0px; }
  .iti-flag.ge {
    height: 14px;
    background-position: -1819px 0px; }
  .iti-flag.gf {
    height: 14px;
    background-position: -1841px 0px; }
  .iti-flag.gg {
    height: 14px;
    background-position: -1863px 0px; }
  .iti-flag.gh {
    height: 14px;
    background-position: -1885px 0px; }
  .iti-flag.gi {
    height: 10px;
    background-position: -1907px 0px; }
  .iti-flag.gl {
    height: 14px;
    background-position: -1929px 0px; }
  .iti-flag.gm {
    height: 14px;
    background-position: -1951px 0px; }
  .iti-flag.gn {
    height: 14px;
    background-position: -1973px 0px; }
  .iti-flag.gp {
    height: 14px;
    background-position: -1995px 0px; }
  .iti-flag.gq {
    height: 14px;
    background-position: -2017px 0px; }
  .iti-flag.gr {
    height: 14px;
    background-position: -2039px 0px; }
  .iti-flag.gs {
    height: 10px;
    background-position: -2061px 0px; }
  .iti-flag.gt {
    height: 13px;
    background-position: -2083px 0px; }
  .iti-flag.gu {
    height: 11px;
    background-position: -2105px 0px; }
  .iti-flag.gw {
    height: 10px;
    background-position: -2127px 0px; }
  .iti-flag.gy {
    height: 12px;
    background-position: -2149px 0px; }
  .iti-flag.hk {
    height: 14px;
    background-position: -2171px 0px; }
  .iti-flag.hm {
    height: 10px;
    background-position: -2193px 0px; }
  .iti-flag.hn {
    height: 10px;
    background-position: -2215px 0px; }
  .iti-flag.hr {
    height: 10px;
    background-position: -2237px 0px; }
  .iti-flag.ht {
    height: 12px;
    background-position: -2259px 0px; }
  .iti-flag.hu {
    height: 10px;
    background-position: -2281px 0px; }
  .iti-flag.ic {
    height: 14px;
    background-position: -2303px 0px; }
  .iti-flag.id {
    height: 14px;
    background-position: -2325px 0px; }
  .iti-flag.ie {
    height: 10px;
    background-position: -2347px 0px; }
  .iti-flag.il {
    height: 15px;
    background-position: -2369px 0px; }
  .iti-flag.im {
    height: 10px;
    background-position: -2391px 0px; }
  .iti-flag.in {
    height: 14px;
    background-position: -2413px 0px; }
  .iti-flag.io {
    height: 10px;
    background-position: -2435px 0px; }
  .iti-flag.iq {
    height: 14px;
    background-position: -2457px 0px; }
  .iti-flag.ir {
    height: 12px;
    background-position: -2479px 0px; }
  .iti-flag.is {
    height: 15px;
    background-position: -2501px 0px; }
  .iti-flag.it {
    height: 14px;
    background-position: -2523px 0px; }
  .iti-flag.je {
    height: 12px;
    background-position: -2545px 0px; }
  .iti-flag.jm {
    height: 10px;
    background-position: -2567px 0px; }
  .iti-flag.jo {
    height: 10px;
    background-position: -2589px 0px; }
  .iti-flag.jp {
    height: 14px;
    background-position: -2611px 0px; }
  .iti-flag.ke {
    height: 14px;
    background-position: -2633px 0px; }
  .iti-flag.kg {
    height: 12px;
    background-position: -2655px 0px; }
  .iti-flag.kh {
    height: 13px;
    background-position: -2677px 0px; }
  .iti-flag.ki {
    height: 10px;
    background-position: -2699px 0px; }
  .iti-flag.km {
    height: 12px;
    background-position: -2721px 0px; }
  .iti-flag.kn {
    height: 14px;
    background-position: -2743px 0px; }
  .iti-flag.kp {
    height: 10px;
    background-position: -2765px 0px; }
  .iti-flag.kr {
    height: 14px;
    background-position: -2787px 0px; }
  .iti-flag.kw {
    height: 10px;
    background-position: -2809px 0px; }
  .iti-flag.ky {
    height: 10px;
    background-position: -2831px 0px; }
  .iti-flag.kz {
    height: 10px;
    background-position: -2853px 0px; }
  .iti-flag.la {
    height: 14px;
    background-position: -2875px 0px; }
  .iti-flag.lb {
    height: 14px;
    background-position: -2897px 0px; }
  .iti-flag.lc {
    height: 10px;
    background-position: -2919px 0px; }
  .iti-flag.li {
    height: 12px;
    background-position: -2941px 0px; }
  .iti-flag.lk {
    height: 10px;
    background-position: -2963px 0px; }
  .iti-flag.lr {
    height: 11px;
    background-position: -2985px 0px; }
  .iti-flag.ls {
    height: 14px;
    background-position: -3007px 0px; }
  .iti-flag.lt {
    height: 12px;
    background-position: -3029px 0px; }
  .iti-flag.lu {
    height: 12px;
    background-position: -3051px 0px; }
  .iti-flag.lv {
    height: 10px;
    background-position: -3073px 0px; }
  .iti-flag.ly {
    height: 10px;
    background-position: -3095px 0px; }
  .iti-flag.ma {
    height: 14px;
    background-position: -3117px 0px; }
  .iti-flag.mc {
    height: 15px;
    background-position: -3139px 0px; }
  .iti-flag.md {
    height: 10px;
    background-position: -3160px 0px; }
  .iti-flag.me {
    height: 10px;
    background-position: -3182px 0px; }
  .iti-flag.mf {
    height: 14px;
    background-position: -3204px 0px; }
  .iti-flag.mg {
    height: 14px;
    background-position: -3226px 0px; }
  .iti-flag.mh {
    height: 11px;
    background-position: -3248px 0px; }
  .iti-flag.mk {
    height: 10px;
    background-position: -3270px 0px; }
  .iti-flag.ml {
    height: 14px;
    background-position: -3292px 0px; }
  .iti-flag.mm {
    height: 14px;
    background-position: -3314px 0px; }
  .iti-flag.mn {
    height: 10px;
    background-position: -3336px 0px; }
  .iti-flag.mo {
    height: 14px;
    background-position: -3358px 0px; }
  .iti-flag.mp {
    height: 10px;
    background-position: -3380px 0px; }
  .iti-flag.mq {
    height: 14px;
    background-position: -3402px 0px; }
  .iti-flag.mr {
    height: 14px;
    background-position: -3424px 0px; }
  .iti-flag.ms {
    height: 10px;
    background-position: -3446px 0px; }
  .iti-flag.mt {
    height: 14px;
    background-position: -3468px 0px; }
  .iti-flag.mu {
    height: 14px;
    background-position: -3490px 0px; }
  .iti-flag.mv {
    height: 14px;
    background-position: -3512px 0px; }
  .iti-flag.mw {
    height: 14px;
    background-position: -3534px 0px; }
  .iti-flag.mx {
    height: 12px;
    background-position: -3556px 0px; }
  .iti-flag.my {
    height: 10px;
    background-position: -3578px 0px; }
  .iti-flag.mz {
    height: 14px;
    background-position: -3600px 0px; }
  .iti-flag.na {
    height: 14px;
    background-position: -3622px 0px; }
  .iti-flag.nc {
    height: 10px;
    background-position: -3644px 0px; }
  .iti-flag.ne {
    height: 15px;
    background-position: -3666px 0px; }
  .iti-flag.nf {
    height: 10px;
    background-position: -3686px 0px; }
  .iti-flag.ng {
    height: 10px;
    background-position: -3708px 0px; }
  .iti-flag.ni {
    height: 12px;
    background-position: -3730px 0px; }
  .iti-flag.nl {
    height: 14px;
    background-position: -3752px 0px; }
  .iti-flag.no {
    height: 15px;
    background-position: -3774px 0px; }
  .iti-flag.np {
    height: 15px;
    background-position: -3796px 0px; }
  .iti-flag.nr {
    height: 10px;
    background-position: -3811px 0px; }
  .iti-flag.nu {
    height: 10px;
    background-position: -3833px 0px; }
  .iti-flag.nz {
    height: 10px;
    background-position: -3855px 0px; }
  .iti-flag.om {
    height: 10px;
    background-position: -3877px 0px; }
  .iti-flag.pa {
    height: 14px;
    background-position: -3899px 0px; }
  .iti-flag.pe {
    height: 14px;
    background-position: -3921px 0px; }
  .iti-flag.pf {
    height: 14px;
    background-position: -3943px 0px; }
  .iti-flag.pg {
    height: 15px;
    background-position: -3965px 0px; }
  .iti-flag.ph {
    height: 10px;
    background-position: -3987px 0px; }
  .iti-flag.pk {
    height: 14px;
    background-position: -4009px 0px; }
  .iti-flag.pl {
    height: 13px;
    background-position: -4031px 0px; }
  .iti-flag.pm {
    height: 14px;
    background-position: -4053px 0px; }
  .iti-flag.pn {
    height: 10px;
    background-position: -4075px 0px; }
  .iti-flag.pr {
    height: 14px;
    background-position: -4097px 0px; }
  .iti-flag.ps {
    height: 10px;
    background-position: -4119px 0px; }
  .iti-flag.pt {
    height: 14px;
    background-position: -4141px 0px; }
  .iti-flag.pw {
    height: 13px;
    background-position: -4163px 0px; }
  .iti-flag.py {
    height: 11px;
    background-position: -4185px 0px; }
  .iti-flag.qa {
    height: 8px;
    background-position: -4207px 0px; }
  .iti-flag.re {
    height: 14px;
    background-position: -4229px 0px; }
  .iti-flag.ro {
    height: 14px;
    background-position: -4251px 0px; }
  .iti-flag.rs {
    height: 14px;
    background-position: -4273px 0px; }
  .iti-flag.ru {
    height: 14px;
    background-position: -4295px 0px; }
  .iti-flag.rw {
    height: 14px;
    background-position: -4317px 0px; }
  .iti-flag.sa {
    height: 14px;
    background-position: -4339px 0px; }
  .iti-flag.sb {
    height: 10px;
    background-position: -4361px 0px; }
  .iti-flag.sc {
    height: 10px;
    background-position: -4383px 0px; }
  .iti-flag.sd {
    height: 10px;
    background-position: -4405px 0px; }
  .iti-flag.se {
    height: 13px;
    background-position: -4427px 0px; }
  .iti-flag.sg {
    height: 14px;
    background-position: -4449px 0px; }
  .iti-flag.sh {
    height: 10px;
    background-position: -4471px 0px; }
  .iti-flag.si {
    height: 10px;
    background-position: -4493px 0px; }
  .iti-flag.sj {
    height: 15px;
    background-position: -4515px 0px; }
  .iti-flag.sk {
    height: 14px;
    background-position: -4537px 0px; }
  .iti-flag.sl {
    height: 14px;
    background-position: -4559px 0px; }
  .iti-flag.sm {
    height: 15px;
    background-position: -4581px 0px; }
  .iti-flag.sn {
    height: 14px;
    background-position: -4603px 0px; }
  .iti-flag.so {
    height: 14px;
    background-position: -4625px 0px; }
  .iti-flag.sr {
    height: 14px;
    background-position: -4647px 0px; }
  .iti-flag.ss {
    height: 10px;
    background-position: -4669px 0px; }
  .iti-flag.st {
    height: 10px;
    background-position: -4691px 0px; }
  .iti-flag.sv {
    height: 12px;
    background-position: -4713px 0px; }
  .iti-flag.sx {
    height: 14px;
    background-position: -4735px 0px; }
  .iti-flag.sy {
    height: 14px;
    background-position: -4757px 0px; }
  .iti-flag.sz {
    height: 14px;
    background-position: -4779px 0px; }
  .iti-flag.ta {
    height: 10px;
    background-position: -4801px 0px; }
  .iti-flag.tc {
    height: 10px;
    background-position: -4823px 0px; }
  .iti-flag.td {
    height: 14px;
    background-position: -4845px 0px; }
  .iti-flag.tf {
    height: 14px;
    background-position: -4867px 0px; }
  .iti-flag.tg {
    height: 13px;
    background-position: -4889px 0px; }
  .iti-flag.th {
    height: 14px;
    background-position: -4911px 0px; }
  .iti-flag.tj {
    height: 10px;
    background-position: -4933px 0px; }
  .iti-flag.tk {
    height: 10px;
    background-position: -4955px 0px; }
  .iti-flag.tl {
    height: 10px;
    background-position: -4977px 0px; }
  .iti-flag.tm {
    height: 14px;
    background-position: -4999px 0px; }
  .iti-flag.tn {
    height: 14px;
    background-position: -5021px 0px; }
  .iti-flag.to {
    height: 10px;
    background-position: -5043px 0px; }
  .iti-flag.tr {
    height: 14px;
    background-position: -5065px 0px; }
  .iti-flag.tt {
    height: 12px;
    background-position: -5087px 0px; }
  .iti-flag.tv {
    height: 10px;
    background-position: -5109px 0px; }
  .iti-flag.tw {
    height: 14px;
    background-position: -5131px 0px; }
  .iti-flag.tz {
    height: 14px;
    background-position: -5153px 0px; }
  .iti-flag.ua {
    height: 14px;
    background-position: -5175px 0px; }
  .iti-flag.ug {
    height: 14px;
    background-position: -5197px 0px; }
  .iti-flag.um {
    height: 11px;
    background-position: -5219px 0px; }
  .iti-flag.un {
    height: 14px;
    background-position: -5241px 0px; }
  .iti-flag.us {
    height: 11px;
    background-position: -5263px 0px; }
  .iti-flag.uy {
    height: 14px;
    background-position: -5285px 0px; }
  .iti-flag.uz {
    height: 10px;
    background-position: -5307px 0px; }
  .iti-flag.va {
    height: 15px;
    background-position: -5329px 0px; }
  .iti-flag.vc {
    height: 14px;
    background-position: -5346px 0px; }
  .iti-flag.ve {
    height: 14px;
    background-position: -5368px 0px; }
  .iti-flag.vg {
    height: 10px;
    background-position: -5390px 0px; }
  .iti-flag.vi {
    height: 14px;
    background-position: -5412px 0px; }
  .iti-flag.vn {
    height: 14px;
    background-position: -5434px 0px; }
  .iti-flag.vu {
    height: 12px;
    background-position: -5456px 0px; }
  .iti-flag.wf {
    height: 14px;
    background-position: -5478px 0px; }
  .iti-flag.ws {
    height: 10px;
    background-position: -5500px 0px; }
  .iti-flag.xk {
    height: 15px;
    background-position: -5522px 0px; }
  .iti-flag.ye {
    height: 14px;
    background-position: -5544px 0px; }
  .iti-flag.yt {
    height: 14px;
    background-position: -5566px 0px; }
  .iti-flag.za {
    height: 14px;
    background-position: -5588px 0px; }
  .iti-flag.zm {
    height: 14px;
    background-position: -5610px 0px; }
  .iti-flag.zw {
    height: 10px;
    background-position: -5632px 0px; }

.iti-flag {
  width: 20px;
  height: 15px;
  box-shadow: 0px 0px 1px 0px #888;
  background-image: url("../images/flags.png");
  background-repeat: no-repeat;
  background-color: #DBDBDB;
  background-position: 20px 0; }
  @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .iti-flag {
      background-image: url("../images/flags@2x.png"); } }

.iti-flag.np {
  background-color: transparent; }


/*international Input*/


@media screen and (max-width:1440px){
  .hero, .soccer-section, .object-section, .role-section, .work-section{
    /*background-size: cover;height: 100%*/
  }
  .macbook{
    display: none;
  }
  .fullimg{
    max-width: 500px;margin: 0 auto
  }
  .add-margin{
    top: 3
  }
}

@media screen and (max-width:1366px) {


.snip1255 .plan-price{
  font-size: 24px;
    font-weight: 500;
    line-height: 34px;
}

  .aboutx-hero{
    top: -193px;
  }
.hero{
  /*height: 70%*/
}
.saudi-section h1{
  font-size: 24px;margin-bottom: 0
}
.saudi-section h2{
  margin-bottom: 0
}.swiper-container-3{

}
.hero p.para{
  font-size: 18px;line-height: 28px;margin-bottom: 15px
}
.hero h1 {
   
    font-size: 22px;line-height: 32px;
    font-weight: 500;
   margin-bottom: 15px
}
  .swiper-container-2.swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction{
   bottom: 0;left: inherit; 
  }
.swiper-container-2 .swiper-slide.swiper-slide-active img.img-responsive{
  right: inherit;
}

.volunteer-info ul li{width: 100%}
  
 




.saudi-section h1 {
 
       /*margin-right: 55px;*/

}

.participate-section h1{}
.participate-section h1 span{

}
}
@media screen and (max-width: 1200px){
.audits-pricing .snip1255 .plan-1 .plan-features-2,
.audits-pricing .snip1255 .plan-2 .plan-features-2,
.audits-pricing .snip1255 .plan.featured .plan-features-2,

{
/*min-height: 205px;*/
min-height: auto
}
.design-pricing .snip1255 .plan-1 .plan-features-2,
.design-pricing .snip1255 .plan.featured .plan-features-2{
  
}
.survey-pricing .snip1255 .plan-1 .plan-features-2 {
    min-height: 138px;
}

.usability-pricing .snip1255 .plan-1 .plan-features-2{
      min-height: 321px;
}
.usability-pricing .snip1255 .plan.featured .plan-features-2 {
    min-height: 300px;
}
  .media-body ul.list-inline{
    flex-wrap: wrap;
  }
   .media-body ul.list-inline li{
    flex: 0 50%;
   }
  .cx-aboutus-section{
    top:0;
  }
.innersection .arrow-flex.flex-small p{
  line-height: 18px
}
   .aboutx-hero{
       top: 0;
    height: 100%;
    background-size: cover;
   }
   .aboutx-hero h1{
    margin-top: 50px
   }
   .cx-about-section{
    top: 0
   }
  .navbar-right{
    padding-left: 0
  }
  .customer-section .person img.img-responsive{
    position: static;margin-bottom: 0
  }
  .slider-counter{
    background: #fff;color: #FE3B56
  }
  .slider-counter span{
    color: #FE3B56;opacity: 0.7
  }
  .slider-counter span:first-child{
    color: #FE3B56
  }
  .swiper-box .swiper-inner{
    padding: 60px 25px 60px 25px;min-height: 425px;
  }
  .custom-swiper .swiper-button-next, .custom-swiper .swiper-button-prev{
    bottom: 74px
  }
  .swiper-box .col-md-4{
    display: none
  }
  .swiper-box .col-md-4, .swiper-box .col-md-8{
    width: 100%
  }
  .innersection .navbar-default .navbar-collapse{
background-color: #fff
  }
  .navbar-default .navbar-collapse{
background-color: transparent;
  }
  header .darks .menuDots li span,.innersection .menuDots li span{
    text-align: left;
  }
  header .darks .menuDots li i, .innersection .menuDots li i{
  display: none;
}
header .darks .menuDots li,.innersection .menuDots li{display: block;}
header .darks .menuDots li::before, header .darks .menuDots li::after,
.innersection .menuDots li::before, .innersection .menuDots li::after
{
  background-color: transparent;height: auto;
}
}
@media screen and (max-width: 1280px){
  .navbar-default .navbar-nav>li>a{
    font-size: 13px
  }
  .soccer-section h1,.object-section h1,.role-section h1 {
    font-size: 45px;
    line-height: 60px;
}
.soccer-section{top: 90px}
.navbar{
  /*padding: 19px 25px 35px*/
}
.navbar-brand>img{width: 210px;}
.navbar-brand{top:-2px}.darks.navbar-default .navbar-toggle{
  position: relative;top: -2px
}
  .nav>li>a{padding-left: 10px;padding-right:10px}
.saudi-section h1{
  /*background: transparent;}*/
 
}
.participate-section h1{}
.participate-section h1 span{}
}

@media screen and (max-width:1024px) {
  .slideDown5,.slideDown4,.slideDown3,.slideDown2{
   animation:none;
 -webkit-animation-name:none;
  }
  .in-view{
    animation:none; -webkit-animation-name:none;
  }
  .form-group label.hint{
    top:20px;
  }
  .twitterAccount p{  font-size: 15px;  line-height: 23px;}
.footer-section .form-group input.form-control{width: 100%}
  .footer-logo{}
.footer-section button{margin-top: 10px}

.saudi-section h2{}

.navbar-nav>li>a{font-size:12px }
  
.signup p:nth-child(1){top: 0px}
.navbar-brand{    top: 8px; }


  .forms{padding-top: 15px;padding-bottom: 15px}
.add-margin{ margin-left:0}
.navbar-brand>img{width: 210px}

.navbar-nav>li>a{padding-top: 15px}
.flex h1{font-size: 30px;line-height: 40px}
.flex a{font-size: 10px}
a.hasBorder{border:none;}
.saudi-section ul{
    flex-wrap:wrap;
    justify-content: space-between; 
    /*margin-bottom: 25px;*/
  }
.saudi-section ul li{margin-bottom: 15px}
}


@media screen and (max-width: 991px){
  .foot-section .text-center{
    text-align: left;
  }
  .swiper-container-2 .swiper-pagination{
    text-align: center;
  }
.snip1255 .featured{
  margin-top: 0
}
  .usability-pricing .snip1255 .plan-1 .plan-features-2,
.usability-pricing .snip1255 .plan.featured .plan-features-2{
  min-height: auto
}
.audits-pricing .snip1255 .plan-1 .plan-features-2,
.audits-pricing .snip1255 .plan.featured .plan-features-2{
  min-height: auto

}
.heat-map .media-left, .audit-map .media-left {
    display: block;
}
.heat-map .media-left img, .audit-map .media-left img {
    margin: 0 auto 50px;
}
.snip1255 .plan.featured {
    -webkit-transform: none;
    transform: none;
   
}
  .aboutpage .saudi-section{
    top: 0
  }
  .small-box{
    width: 100%;
    padding: 25px
  }
  .swiper-box .swiper-inner{
    margin-top: 0
  }
  .snip1255 .plan-features li{
        font-size: 14px;
    font-weight: 300;
    line-height: 22px;
  }
  .outer-circle{
        margin-top: 85px;
  }
  .flex-row{
    display: block;
  }
  .form-group label.hint{
    top:0;
  }
  .contact-section .trail-form{
    width: 100%
  }
  .form-headings{
    width: 80%
  }
  .form-panel{
    width: 85%
  }
  .heat-hero h1, .audit-hero h1{
    font-size: 23px;line-height: 30px
  }
  .heat-hero p, .audit-hero p{
    font-size: 15px;line-height: 25px
  }
  .heat-hero p:nth-child(3), .audit-hero p:nth-child(3){
margin-bottom: 0
  }
  .design-hero p:nth-child(3){
    margin-bottom: 35px
  }
  .audit_steps p{
    font-size: 13px;line-height: 18px
  }
  .customer-section .container .row{
    display: block;
  }
  .navbar-toggle{

  }
  .media-body ul.list-inline{
    /*flex-direction:column;*/
  }
  .audit-hero, .usability-hero, .design-hero{

  }
  .design-hero p{

  }
  .audit-hero a.btn-audit{
    font-size: 11px;    line-height: 20px;
  }
  .heat-map .media,.audit-map .media,.survey-map .media{display: block;text-align: center;}
  .heat-map h1, .audit-map h1, .usability-map h1, .survey-map h1,
.heat-map .media-body p, .audit-map .media-body p, .usability-map .media-body p,

.customer-section h1,.article-section h1,.article-section p,.cx-about-section p
   {
text-align: center;
  }

  .article-section p.mydesc,
.swiper-inner h1
  {
    text-align: left
  }
  .survey-map{
    display: block;
  }
  .trail-form{
    padding: 25px 15px
  }
  .customer-section img.img-responsive{
    margin-bottom: 50px
  }
  .fullimg{
    max-width: 100%
  }
  .macbook{display: none;}
  .learn-btn{
    font-size: 13px
  }
.myfooter .col-md-6{
  padding-left: 15px;padding-right: px
}
  .footer-logo{
    margin-bottom: 25px
  }
.myfooter{
  border: 0
}
.news-section h1,.vision-section h1{
  margin-top: 25px
}
.vision-section h2,.ads-section h2{
   font-size: 20px;
}
.vision-section h1,.news-section h1,.ads-section h1,.download-section h1,.ads-section h1{    font-size: 23px;line-height: 35px}
.benefits-section img{
  margin-bottom: 50px
}

  .hero p.para{
    font-size: 17px;
  }
  .hero .container .row .btn-success{
    margin-bottom: 25px;
  }
.waveWrapper{
  display: none!important;
}
.hero h1{
  font-size: 23px;
    /*font-weight: 500;*/
    line-height: 30px;    margin-top: 15px;
}
 .navbar-default .navbar-nav>li>a.btn,.navbar-default .navbar-nav>li>a.btn.btn-success{
  margin: 15px 10px;text-align: center;
}
.swiper-container-2{
  margin-top: 0
}
.copyright{
  padding-top: 15px;padding-bottom: 15px
}
.socialicons{
  text-align: left;
}

  .hero .container .row{
  display: block;
}
.benefits-section img,.vision-section img{}
.basic-section.has-border{border-right:0;}
.pad-lft{padding-left: 0}
.pad-rgt{padding-right: 0}
  .active-section{padding: 25px}
.flex-container{justify-content: flex-start;}
.soccer-section .breadcrumb{margin-top: 50px}
.flex-container div{max-width: 50%}
.flex-container{display: flex;
  margin-top: 50px;   
   /*justify-content: flex-end;*/
 }
.object-section .flex-container:nth-child(1), .role-section .flex-container:nth-child(1){margin-top: 50px;  }
  .soccer-section h1,.object-section h1,.role-section h1{font-size: 38px;line-height: 53px}
  .soccer-section .breadcrumb{margin-bottom: 50px}
.soccer-section {
    top: 75px;height: auto;
}
.role-section{margin-bottom: 75px;}
.signup p:nth-child(1){top:13px;}

.navbar {
    /*padding: 25px ;*/
}
.navbar-nav>li>a {
    padding-top: 5px;
    padding-bottom: 5px;
}
  .icon.social {
  float:left;
}


.volunteer-section .no-padding{
  /*padding: 0 15px*/
}
.forms{padding-right: 0}
.partition{border-right: none;}

.navbar-brand>img {
    width: 140px;
}
.navbar-brand {
    /*top: 18px;*/
}
.innerPage .navbar{padding: 15px}
  .benefits-section h1{
    /*font-size: 38px;line-height: 48px;*/
    margin-bottom: 25px;line-height: 30px;}
    .benefits-section h2{
      font-size: 23px;
      }.margin-left{
        margin-left:  auto;margin-right: auto;    text-align: center;
    
      }
  .dark{background: rgba(0, 76, 50, 1)}
.vision-img{margin: 50px auto}
  .vision-section .flex-list{flex-direction:column;}
  .padding-sm-right{padding: 0}
  .vision-section h1,.vision-section h1 span:nth-child(1) {display: block;}
  .card img{width: 100%}
  
.saudi-section ul li{width: 200px;height: 160px;margin-bottom: 25px}
.saudi-section h1{}
.saudi-section h1 span.nth-h1{display: block;}
.saudi-section h1 span.nth-h2{}

}



@media screen and (max-width: 768px){
.benefits-section h1,.benefits-section h2{
  text-align: center;
}
  .cx-about-section h4{
    text-align: center;
  }

.snip1255 .plan.featured{
      -webkit-transform: none;
    transform: none;
}
.center-block{
  margin-bottom: 25px
}
  .navbar-default .navbar-toggle{
    top: 4px
  }
  .audit_progress{
    flex-direction:column;
  }
  .audit_steps::after{
  /*   -ms-transform: rotate(90deg); 
  -webkit-transform: rotate(90deg); 
  transform: rotate(90deg);*/
  width: 1px;height: 35px;margin: 0 auto
  }
  .audit_steps{
    width: 100%;margin: 0 auto;text-align: center;
  }
  .audit_steps img{
    margin: 25px auto
  }.audit_steps p{
    text-align: center;
  }
  .audit_steps:nth-child(1)::after{
    left: 0;top: 44px;
  }
  .audit_steps:nth-child(6)::after{
    background: transparent;content: none;
  }
  .audit_steps{
    overflow: hidden;
  }
  .audit_steps::after{
    top: 58px;
    left: 0;
    right: 0;
    bottom: 50px;
  }
  .custom_width{
    width: 100%
  }
  .statistics{
    flex-wrap: wrap;

  }
  .each-stat{
    flex: 0 50%;margin-bottom: 50px
  }
.navbar-toggle{
  margin-top: 0
}
.built{
  color: #000
}
  .navbar-default {
    background: #693ebd;min-height: auto;position: static;margin-bottom: 0
  }
 .innersection .navbar-default {
    background: #fff
  }
  .innersection .navbar-default .navbar-toggle{
background-color: #b22bfb;    border-color: #b22bfb;
  }
  .hero, .soccer-section, .object-section, .role-section, .work-section{
    /*height: auto*/
  }
  .soccer-section .breadcrumb{margin-top: 0}
.soccer-section p,.object-section p,.role-section p{font-size: 16px;line-height: 22px}
.soccer-section p,.object-section p,.role-section p{font-size: 13px}
  .soccer-section h1,.soccer-section h3,.object-section h1,.role-section h1{font-size: 20px;line-height: 35px}
  .soccer-section .breadcrumb{margin-bottom: 25px}
.navbar-collapse{padding-left: 0;}

.navbar-default .navbar-nav>li>a{text-align: left}
  .saudi-section h1{
  background: transparent;    font-size: 23px;margin-top: 50px!important}

  .partition{height: auto!important}
  .footer-sharek,.footer-halayalla{text-align: left;}
  .navbar-brand{top: 8px  ;}
  .navbar-toggle{}
  .info-section h1{font-size: 25px}
  .info-section h1 span img{width: 50px}
  .news-section{
    /*background-size: auto*/
  }
  .navbar-default .navbar-nav>li>a.btn-default{text-align: center;}
  
  .volunteer-info p{line-height: 24px}
  .signup img{width: 100%}
  .lft{left: -30px}
  .rgt{right: -30px}
}


@media screen and (max-width:640px) {
  .news-section-container{padding-right: 0}
  .benefits-section img.img-responsive{width: 100%}
}


@media screen and (max-width:480px) {

  .customer-section .swiper-box h1{
    line-height: 30px;
    margin-bottom: 10px;
        font-size: 20px;
  }
  .swiper-container-1 .media-object{
    margin-right: 0
  }
    .swiper-container-1 .media-left{
      display: block;
    }
     .swiper-container-1 .media-left img{
      margin-left: auto;margin-right: auto
     }
    .swiper-container-1 .media-body p{
      text-align: center;
     }
     .swiper-container-1 .media-left::after{
      left: 0;right: inherit;    top: inherit;
    bottom: -10px;
     }

     .swiper-container-1 .swiper-slide{
      width: 100%!important
     }
.flex-small{
  align-items: center;
    justify-content: center;
    padding-bottom: 20px;
    flex-direction: column;
}

  .flex-small img{
    margin-right: 0
  }
  .flex-small p{
    text-align: center;
  }

  .arrow-flex.flex-small{
      flex-direction: row;
          align-items: flex-start;
    justify-content: flex-start;
  }
  .innersection .arrow-flex.flex-small p{
    text-align: left;
  }
.snip1255 .plan.featured{
      -webkit-transform: none;
    transform: none;
}
.ux {
    width: 125px;
}



  .lft_section p,.participate-section.contact-new-section p{margin-bottom: 50px;
text-align: center;    width: 80%;
  }
  .contact-new-section .trail-form{
    padding: 25px
  }
   .hero .container .row {
      display: flex;
    flex-direction: column-reverse;} 
    .hero .container .row img.img-responsive{
      margin-top:50px 
    }
  .survey-map .media-left{
    position: static;
  }
  .form-inline-tag{
    width: 100%;margin-bottom: 25px
  }
  .form-horizontal .learn-btn{
    width: 100%
  }
  .checkbox label{
    font-size: 12px;line-height: 20px;
  }
.built{
  color: #fff
}
.heat-map .media-left,.audit-map .media-left {
  display: block;
}
.heat-map .media-left img,.audit-map .media-left img{
      margin: 0 auto 50px;
}
  .swiper-slide{
  display: block;
}
.download-section img{
  margin-bottom: 15px
}
.swiper-container-2 .swiper-slide.swiper-slide-active img.img-responsive{
  margin-top: 50px
}
.learn-btn{
  padding:10px 15px;display: block; 
}.margin-left,.hero .container .row .btn-success{
      
    display: block;
      }
 .navbar-default .navbar-toggle{margin-right: 0;margin-top: 0}
  .basic-section{margin-bottom: 50px}
  .active-section{margin-top: 50px}
  .basic-section h1{    font-size: 30px;
    font-weight: 900;
    line-height: 40px;}
.top-section{margin-bottom: 25px}
    .top-section img{width: 150px}
    .active-section{padding: 0}
.flex-container div{max-width: 100%}
.flex-container{    flex-direction: column;}
.soccer-section .breadcrumb{margin-top: 0}
.info-box{padding: 15px}
  .soccer-section {
    top: 0px;
}
.role-section{margin-bottom: 0px;}
  .forms h2 span{font-size: 18px}
.info-section h1{font-size: 20px}
.swiper-button-next, .swiper-button-prev{


}

.innerPage .info-section{margin-top: 50px}
.volunteer-section{margin-top: 25px}
.volunteer-info{width: 90%}
.saudi-section ul li{width: 150px;height: 150px;margin-bottom: 25px}
.price{font-size: 12px;top: 18px;}
  .forms h1{font-size: 35px;line-height: 45px}
#radioBtn a{ font-size: 10px; }
  #radioBtn2 a,.bg-radio {
    /*min-width: 175px;*/
    font-size: 10px;
}
.forms{padding-right: 0}
.navbar-brand{    top:2px; }
  .navbar-default .navbar-nav>li>a{text-align: left}
#navbar{margin-top: 15px}

.lang{margin-top: 15px!important}

  .card .img-responsive{width: 100%}
  .collage{width: 100%}
  .participate-section h1{}
.participate-section h1 span{}
.participate-section p{font-weight: normal;}
.participate-section .icon.social{margin-top: 10px}

  .vision-section h1{padding: 0 15px}
  .vision-section .flex-list{flex-direction:column;}
  .vision-img{margin-bottom: 50px}
.benefits-section, .vision-section{padding-top: 0px}
  
  .saudi-section{
    /*top: -75px;*/
    position: relative;}
  .saudi-section h1{text-align: center;}
  .saudi-section h2{font-size: 19px}
  .navbar{padding: 15px}
.dark{background: rgba(14, 40, 31, 0.7)}


  .hero h1{text-align: center;
    /*padding: 25px;*/
  }
  .hero p {text-align: center;font-size: 19px;margin-bottom: 30px }.hero p span{display: block;text-align: center;margin-bottom: 25px}
  .navbar-default {

    position: static;
  }
  .partition-2{display: none}
  .padding-sm-right{padding: 0}
  .footer-section li {
    display: block;
    /*text-align: center;*/
  }
  .footer-section li img {
    margin: 25px auto
  }
  .footer-section li i img{margin: 0 auto 5px}
  .hero {
    display: block;height: 120%
  }
  .hero-button {
    position: static;
  }
  .navbar-default {
    margin-bottom: 0
  }
  .hero .visible-xs img {
    width: 150px;
    margin: 0 auto 50px;
  }
  .add-margin {
    margin-right: 0
  }
  .navbar-default .navbar-nav>li>a {
    /*color: #fff;*/
  }
  .navbar-default {
    min-height: auto
  }
  .navbar-toggle {
    float: right;
  }
  ul.text-left {
    padding: 0
  }
  .navbar .visible-xs a.btn-primary {
    float: left;
  }
  .navbar-brand>img {
    position: relative;
  }
  .navbar a.btn-primary.visible-xs {
    position: relative;
    top: 10px;
  }
  .navbar-brand {
    height: auto
  }
  .navbar-brand>img {}
  .navbar-default .navbar-toggle {}
  .navbar-default {
    background: #693ebd;
    /*background: rgba(0, 0, 0, 0.7)*/
/*    background: rgba(58,39,176,1);
background: -moz-linear-gradient(left, rgba(58,39,176,1) 0%, rgba(170,95,207,1) 100%);
background: -webkit-gradient(left top, right top, color-stop(0%, rgba(58,39,176,1)), color-stop(100%, rgba(170,95,207,1)));
background: -webkit-linear-gradient(left, rgba(58,39,176,1) 0%, rgba(170,95,207,1) 100%);
background: -o-linear-gradient(left, rgba(58,39,176,1) 0%, rgba(170,95,207,1) 100%);
background: -ms-linear-gradient(left, rgba(58,39,176,1) 0%, rgba(170,95,207,1) 100%);
background: linear-gradient(to right, rgba(58,39,176,1) 0%, rgba(170,95,207,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3a27b0', endColorstr='#aa5fcf', GradientType=1 );*/
  }
  .navbar-default a.btn-default {
    line-height: 12px!important
  }
  .navbar .visible-xs a.btn-primary {
    display: inline-block!important;
    width: 70px;
    line-height: 22px!important;
  }
  .hero-button a ul li {
    font-size: 12px
  }
  .hero-button a {
    margin: 50px auto 0px;
    width: 80%;
    padding: 8px 50px
  }
  .info-section {
    padding-bottom: 50px;
    padding-top: 0px
  }

.saudi-section ul li{margin-bottom: 25px}
.news-section-container{padding-right: 0}
.footer-logo{width: 100%}

.copyrights,.footer-section{}

}

@media screen and (max-width:360px) {


.info-section{top: 0}
.saudi-section ul li {
    width: 130px;
    height: 130px;
    
}

.volunteer-info{position: static;}
#radioBtn2 a,.bg-radio{
  font-size: 8px
}
  }