@font-face{
    font-family:'AlmoniDLAAA';
    src:url('../fonts/AlmoniDLAAA.eot');
    src:url('../fonts/AlmoniDLAAA.eot?#iefix') format('embedded-opentype'),
    url('../fonts/AlmoniDLAAA.woff') format('woff'),
    url('../fonts/AlmoniDLAAA.ttf') format('truetype'),
    url('../fonts/AlmoniDLAAA.svg#OpenSansLight') format('svg');font-weight:normal;font-style:normal;
  }

  @font-face{
    font-family:'HyundaiSansHeadBold';
    src:url('../fonts/HyundaiSansHead-Bold.eot');
    src:url('../fonts/HyundaiSansHead-Bold.eot?#iefix') format('embedded-opentype'),
    url('../fonts/HyundaiSansHead-Bold.woff') format('woff'),
    url('../fonts/HyundaiSansHead-Bold.ttf') format('truetype'),
    url('../fonts/HyundaiSansHead-Bold.svg#OpenSansLight') format('svg');font-weight:normal;font-style:normal;
  }



/*------------------------- Main ------------------  */

.almoni-font{
  font-family:'AlmoniDLAAA';
}

/*   HTML elements  */

body,

html  {

  width: 100%;  

  margin: 0;

  padding:0;

  direction: rtl;

  font-size: 20px;

  font-family: AlmoniDLAAA;

  color: #666666;
  height: 100%;

  

}

p {

  font-weight: 300;

}

h1 {
  font-family: HyundaiSansHeadBold;
}


h1,
h2, 

h3, 

h4, 

h5,

h6 {

  font-weight: bold;
  margin-top: 0;
  margin-bottom: 0;

}

.title {
  color: #1C305D;
  font-weight: 100;
}
.sml-desc p{
  font-size:16px;
}



/*------------- End HTML elements ------------*/



/*----------- Strucature */



.clear {

  clear: both;

}



/*----------- End Strucature */





.width{

  width:100%;

}



/*---------------- align ----------------*/

.center-by-margin {

  margin: 0 auto;

}



.align-center {

  text-align: center;

}



.align-left {

  text-align: left;

}



.align-right {

  text-align: right;

}



.relative {

  position: relative;

}



.abs {

  position: absolute;

}



.top-left {

  left: 0;

  top:0;

}



.top-right {

  top: 0;

  right:0;

}

.show-on-mobile {

  display: none;

}

.bottom-left {

  left: 0;

  bottom:0;

}
.width-100{
   width:100%;
}


.bottom-right {

  bottom: 0;

  right:0;

}



.float-left {

  float: left;

}



.float-right {

  float: right;

}

.justify{

  text-align:justify;

}





/*---------------- End align ----------------*/













/*------------------ colors --------------*/

.fa {

font-size: 8px;
position: relative;
top:-2px;
}


.white {

  color: white

}



.black {

  color: black;

}



.primary-color { }

.secondary-color { }



/*------------------ end colors --------------*/






/*-----------Unknown Centering-------*/

.something-semantic {

  display: table;

  width: 100%;

}

.something-else-semantic {

  display: table-cell;

  text-align: center;

  vertical-align: middle;

}

/*-----------End Unknown Centering-------*/


/*-----------Form  -------*/


.form-wrapper {
    background: #fff;
    height: 734px;
    padding-top: 25px;
    border: 1px solid grey;
}

#form-1 {
  width: 90%;
  margin: 0 auto;
  height: 95%;
}
.form-wrapper h2 {
  margin-bottom: 15px;
}

.form-wrapper input{
    width: 100%;
    margin: 0 auto;
    margin-bottom: 20px;
    text-indent: 5%;
    padding: 0;
    text-align: center;
    border-radius: 0px;
    color: #000;
    height: 35px;
}

input::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #1c305d !important;
 font-weight:600;
  font-size:18px;

}

input::-moz-placeholder { /* Firefox 19+ */
  color: #1c305d !important;
 font-weight:600;
  font-size:18px;

}

input:-ms-input-placeholder { /* IE 10+ */
  color: #1c305d !important;
font-weight:600;
  font-size:18px;
}

input:-moz-placeholder { /* Firefox 18- */
  color: #1c305d !important;
 font-weight:600;
  font-size:18px;

}

.not-visible{
  display:none;
}

#formSubmit {
    background: #1C305D;
    color: #fff;
    width: 100%;
    margin-top: 10px;
    border-radius: 0;
    font-size: 21px;
}
.checkbox input[type=checkbox]{
    position: absolute;
    margin-right: -50% !important;
    margin-top: 20% !important
}
/*.select-style {
    border: 1px solid #ccc;
    width: 120px;
    border-radius: 3px;
    overflow: hidden;
    background: #fafafa url("img/icon-select.png") no-repeat 90% 50%;
}

.select-style select {
    padding: 5px 8px;
    width: 130%;
    border: none;
    box-shadow: none;
    background: transparent;
    background-image: none;
    -webkit-appearance: none;
}

.select-style select:focus {
    outline: none;
}*/


/*----------- End Form  -------*/




/*-----------App -------*/



.the-up{

  font-size:84px;

}

.the-middle{

  font-size:73px;

}

.the-down{

    font-size: 97px;

}


.tittle-main {
    line-height: 56px;
    padding-top: 2%;
    padding-right: 0%;
}


h2.title.white{

  font-size:26px;

  margin-top: 9%;

}

h3.title.white{
    font-size: 18px;
    margin-bottom: 10%;
    margin-top: 0;
    letter-spacing: 0;
    font-family: "Typograph2Regular", arial, serif!important;
    margin-top: 10px;

}


section#part-1{


    background-repeat: no-repeat;

    width: 100%;

    height: 768px;

    position: relative;

    top: 0px;

}
section {
  max-width: 1200px;
  width: 100%;
  margin: 0 auto;
}
section#part-2 {
    background-color: #fff;
    width: 100%;
    position: relative;
    bottom: 0px;
    margin: 0 auto;
    padding-right: 15px;
    padding-left: 15px;
}
.settings{
  margin-top:0.7%;
}

/*-----------owl -------*/






/*-----------End App -------*/

.col-md-5, .col-md-7, .col-md-12{
  margin: 0 auto !important;
  padding: 0px !important;
}


.Frog {
    position: absolute;
    bottom: 6%;
    right: 4%;
    max-width: 17%;
    z-index: 9;
        -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
 
/*---------------- Mobile   -------*/


h1,h3 {
  margin-top: 0;
  margin-bottom: 0;

}


h1 {
   font-size: 112px;
   margin-top: -6px;
   letter-spacing: 2px;
   color: #fff;
}

h3 {
    font-size: 65px;
    margin-top: -25px;
    

}


.show-on-mobile {

  display: none;

}

.blue-bg-footer {
  background: blue;
  padding: 5px 8px;
  color: #fff;
}

.red-bg-footer {
  background: red;
  padding: 5px;
  color: #000;
}
.show{
  display:block;
}
.hide{
  display:none;
}


.col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 ,
.col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9 {
  float: right;
}

.agree {
  width: 25px!important;
  height: 25px;
}

.main-text {
  text-align: left;
  color: #fff;
}

.main-text  h2{
  position: relative;
    left: 100px;
    font-size: 61px;
    top: -23px;
}

.agree-wrapper .col-xs-10 {
    text-align: right;
    font-size: 13px;
    color: #1C305D;
    position: relative;
    left: 8%;
    top: 11px;
    line-height: 14px;
    padding: 0px 7px;
}

.next-btn {
  position: absolute;
  right: 0;
      top: 300px;
}

.prev-btn {
  position: absolute;
  left: 0;
      top: 300px;
}


.form {
  padding: 10px;
}

.logo-wrapper img  {
  margin-top: 40px;
  margin-bottom: 40px;
  max-width: 80%;
}

.info {
    font-size: 15px;
    color: #000;
     position: relative; 
    margin-top: 14px;
    z-index:999999999999999;
}

.white-bg {
    background: url(../img/pas.png);
    height: 140px;
    width: 75%;
    position: absolute;
    bottom: 30px;
    right: 0;
      direction: rtl;
    text-align: right;
}
.first-carousel{
  display:block;
   
}
.second-carousel{
  display:none;
   
}
select{
      width: 100%;
    color: #1c305d !important;
    font-weight:600;
    text-align: center;
    margin: 0 auto;
    padding-top: 6px;
    padding-bottom: 6px;
    padding-right: 68px;
}
.carousel-btn-down{
      position: relative;
    top: -34px;
    right: 33%;
        z-index: 99999999999999999;
    cursor: pointer;
}
.carousel-btn-down img{
    cursor: pointer;
    color: #fff;
    z-index: 9;
    position: relative;
    -webkit-animation-name: fadeInOutDown;
    animation-name: fadeInOutDown;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-duration: 1.2s;
    animation-duration: 1.2s;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    


}
.show-1 {
    font-size: 16px;
    padding: 10px;
    width: 85%;
    color: #000;
}
.show-2 {
  font-size: 13px;
  padding: 10px;
  display: none;
  width: 85%;
  color: #000;
}

#part-1 .container  {
  position: absolute;
  top: 0;
  z-index: 99;
}
@media (max-width: 1199px){

.form-wrapper {
    height: 685px;
    padding-top: 10px;
  }
  .info {
    margin-top: -5px;
  }
  #formSubmit {
    font-size: 17px;
  }
}
@media (max-width: 1060px){
  .show-1 {
    font-size: 12px;
  }
  .form-wrapper {
    height: 602px;
    padding-top: 0px;
  }
  
  .info {
    margin-top: -31px;
  }
  .logo-wrapper img {
    margin-top: 23px;
    margin-bottom: 49px;
    
   }
}
@media( max-width: 1000px ){


  .show-on-mobile {
     display: block;
   }
  .hide-on-mobile {
    display:none;
  }
  .sml-desc p {
  text-align: right;
    position: absolute;
    bottom: -7px;
    right: 0;
    width: 100%;
    color: #fff;
    z-index: 9;
    font-size: 16px;

  }
  .sml-desc-mobile p{
    font-size: 12px;
    position: relative;
    top: 416px;
    left: -12px;
    color: #fff;
    z-index: 999;
  }
  section#part-2 {
     padding-right: 0px; 
     padding-left: 0px; 
  }
  .logo img{
    padding-top: 47px;
    float: left;
    width: 27%;
    padding-left: 2%;
  }
  h3 {
    font-size: 65px;
    margin-top: 5px;
    margin-bottom: 18%;
  }
  .btn-down img{
    width: 20%;
    position: absolute;
    bottom: 87%;
    left: 41%;
  }
  .click-in{
    border:2px solid black;
   font-size: 38px;
       margin-top: 1%;
  }
  .form-in{
    border:2px solid black;
   font-size: 38px;
   margin-top: 2%;
  }
  .prev-btn {
    position: absolute;
    left: 0%;
    top: 6%;
    z-index: 99;
  }
   .next-btn {
    position: absolute;
    left: 0%;
    top: 6%;
    z-index: 99;
  }
  .blue-rectangle{
    background-color:blue;
    width:20px;
    height: 20px;
    padding-left: 5px;
    padding-right: 5px;
  }
  .red-rectangle{
     background-color:red;
     width:20px;
    height: 20px;
    padding-left: 5px;
    padding-right: 5px;
  }
  .info-in{
        font-size: 13px;
    margin-top: 2%
  }
  #part-2 .form-wrapper-parent{
    display:none;
    
    
  }
  .close-form{

  }
  .form {
    border: 2px solid #dedede;
    padding: 14px;
    background-color: #fff;
  }
  .overlay {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.7);
  transition: opacity 500ms;
  visibility: hidden;
  opacity: 0;
}
.overlay:target {
  visibility: visible;
  opacity: 1;
}

.popup {
    margin: 10px auto;
    padding: 20px;
    background: #fff;
    border-radius: 5px;
    width: 100%;
    position: relative;
    transition: all 5s ease-in-out;
    margin-top: -4%;
}
.fixed-bottom-mobile{
  position:fixed;
  bottom:0px;
  left:0px;
  right:0px;
  background-color:#fff;
      z-index: 9999999999999;
}
}
@media(max-width:425px){
  .btn-down img {
    bottom: 88%;
  }
  .info-mobile{
        font-size: 12px;
    padding-top: 3%;
    
  }
  h1 {
    font-size: 83px;
    
  }
  .margin-bottom{
    margin-bottom:10%;
  }
  .show-1 {
    font-size: 13px;
    padding: 10px;
        float: right;
        width:100%;
}
.fixed-bottom-mobile{
  position:fixed;
  bottom:0px;
  left:0px;
  right:0px;
  background-color:#fff;
      z-index: 9999999999999;
}
.sml-desc-mobile {
    position: relative;
    top: 228px;
        z-index: 999;
    }
}
@media(max-width: 375px){
  .prev-btn {
     top: 6%;
  }
   .next-btn {
      top: 6%;
  }
  h1{
    font-size:90px;
  }
  h3{
    font-size:50px;
  }
  .btn-down img {
    bottom: 88.5%;
  }
  .sml-desc-mobile {
    position: relative;
    top: 202px;
        z-index: 999;
  }
}
@media(max-height: 480px){
  .title{
    font-size:20px !important;
  }
  select {
     padding-right: 31px;
  }
}
@media(max-width:320px){
  .btn-down img {
    bottom: 89%;
  }
  h2 .title{
    font-size:20px;
  }
  .form {
    padding-top: 0px;
   }
   .form-wrapper input {
      margin-bottom: 7px;
    }
    .sml-desc-mobile {
    font-size: 12px;
    position: relative;
    top: 170px;
    left: -12px;
    color: #fff;
        z-index: 999;
  }
}


.carousel-btn-down img.rotate-up {
  
      -ms-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
}
.btn-down img.rotate-up {
  
      -ms-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}


.owl-height {
    /* -webkit-transition: height 500ms ease-in-out; */
    -moz-transition: height 0 ease-in-out!important;
    -ms-transition: height 0 ease-in-out!important;
    -o-transition: height 0 ease-in-out!important;
    /* transition: height 500ms ease-in-out; */
}


label ,
.sml-form-text  {
  float: right;
  font-size: 12px;
  text-align: right;
  width: 100%;
  color: #1C305D;
}

input:focus { 
  outline: none !important;
    border:3px solid #2700ff;
    box-shadow: 0 0 10px #2700ff;
}

:focus  , 
.form-control:focus ,
input[type=file]:focus, input[type=checkbox]:focus, select:focus{
   outline: none !important;
    border:3px solid #2700ff;
    box-shadow: 0 0 10px #2700ff;
}


.mobileye {
    max-width: 65px;
    position: absolute;
    left: 125px;
    top: 0;
}

/*.second-carousel p {
  font-size: 15px;
}*/

.second-carousel  .carousel-btn-down {
    position: absolute;
    right: 30px;
    z-index: 99999;
    background: #dedede;
    top: 50px;
    width: 120px;
    cursor: pointer;
}
  /*------------------ animation -------------------*/
  @-webkit-keyframes fadeInOutDown {
    0% {
      opacity: 0;
      -webkit-transform: translate3d(0, -20%, 0);
              transform: translate3d(0, -20%, 0);
    }
    50% {
      opacity: 1;
    }
    100% {
      opacity: 0;
      -webkit-transform: translate3d(0, 20%, 0);
              transform: translate3d(0, 20%, 0);
    }
  }
  @keyframes fadeInOutDown {
    0% {
      opacity: 0;
      -webkit-transform: translate3d(0, -20%, 0);
              transform: translate3d(0, -20%, 0);
    }
    50% {
      opacity: 1;
    }
    100% {
      opacity: 0;
      -webkit-transform: translate3d(0, 20%, 0);
              transform: translate3d(0, 20%, 0);
    }
  }
  /*------------------End  animation -------------------*/






@media all and (max-width: 1000px){
  .logo {
    height: 100px;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999;
    background: white;
  }

  .logo img {
      padding-top: 47px;
      float: left;
      padding-left: 2%;
      max-width: 100px;
      height: initial;
  }

  .click-in ,
  .form-in   {
    width: 89%;
    margin: 0 auto;
    float: none;
    font-size: 30px;
    margin-bottom: 10px;
  }

  h3 {
      font-size: 29px!important;
      margin-bottom: 0!important;
  }

  section#part-2 {
    margin-bottom: 200px;
  }

  .form .logo {
    height: auto;
      position: relative;

  }
  .form-wrapper {
    height: 450px;
    padding-top: 0px;
    overflow: scroll;
}

.add-margin-top-on-mobile {
  margin-top: 100px;
}

  .custom-btn {
    display: none;
  }

 h1 {
    font-size: 75px;
}
}
.col-xs-10 label small{
  font-size: 12px;
}
.checkbox label {
    
    padding-left: 0px !important;
    
}
#part-2 .col-xs-10 small{
  font-size: 20px;
}
#part-2 .col-xs-10{
      margin-right: 63px;
}



@media all and (min-width: 1000px){ 
  .prev-btn {
      position: absolute;
      left: -402px;
      top: 300px;
  }
}




.sml-desc p {
  text-align: right;
    position: absolute;
    bottom: -7px;
    right: 0;
    width: 100%;
    color: #fff;
    z-index: 9;
    font-size: 16px;

}



@media (max-width: 1000px) { 
  .sml-desc-mobile {
      position: absolute;
      bottom: 0;
      right: 0;
      z-index: 9999999999;
      color: #fff;
      top: inherit!important;
  }

  .mobile-wrapper {
    position: relative;
  }

  .sml-desc-mobile p {
    top:0;
  }

  .sml-desc {
    display: none!important;
  }
}
a{
  color:#000;
}