/**page loader**/

#loader-wrapper {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index:3000;
}

#loader{
  display: block;
  font-family: 'Clearlight';
  position: relative;
  /* left: 50%; */
  top: 40%;
  width: 100%;
  height: 150px;
  /* margin: -75px 0 0 -75px; */
  z-index: 1001;
      text-align: center;
}
/* Default font size */
#loader span {
  color: #000;
  font-family: 'Clearlight';
  display: inline-block;
  font-size: 180px;
}

/* Media query for tablets */
@media only screen and (max-width: 1024px) {
  #loader span {
      font-size: 120px; /* Adjust font size for tablets */
  }
}

/* Media query for mobile devices */
@media only screen and (max-width: 768px) {
  #loader span {
      font-size: 80px; /* Adjust font size for mobile devices */
  }
}
@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    /* Chrome, Opera 15+, Safari 3.1+ */
    -ms-transform: rotate(0deg);
    /* IE 9 */
    transform: rotate(0deg);
    /* Firefox 16+, IE 10+, Opera  */
  }
  100% {
    -webkit-transform: rotate(360deg);
    /* Chrome, Opera 15+, Safari 3.1+ */
    -ms-transform: rotate(360deg);
    /* IE 9 */
    transform: rotate(360deg);
    /* Firefox 16+, IE 10+, Opera  */
  }
}

@keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    /* Chrome, Opera 15+, Safari 3.1+ */
    -ms-transform: rotate(0deg);
    /* IE 9 */
    transform: rotate(0deg);
    /* Firefox 16+, IE 10+, Opera  */
  }
  100% {
    -webkit-transform: rotate(360deg);
    /* Chrome, Opera 15+, Safari 3.1+ */
    -ms-transform: rotate(360deg);
    /* IE 9 */
    transform: rotate(360deg);
    /* Firefox 16+, IE 10+, Opera  */
  }
}

#loader-wrapper .loader-section {
  position: fixed;
  top: 0;
  width: 51%;
  height: 100%;
  background:#FFF;
  z-index: 1000;
}

#loader-wrapper .loader-section.section-left {
  left: 0;
}

#loader-wrapper .loader-section.section-right {
  right: 0;
}


/* Loaded Styles */

.loaded #loader-wrapper .loader-section.section-left {
  -webkit-transform: translateX(-100%);
  /* Chrome, Opera 15+, Safari 3.1+ */
  -ms-transform: translateX(-100%);
  /* IE 9 */
  transform: translateX(-100%);
  /* Firefox 16+, IE 10+, Opera  */
  -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
  /* Android 2.1+, Chrome 1-25, iOS 3.2-6.1, Safari 3.2-6  */
  transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
  /* Chrome 26, Firefox 16+, iOS 7+, IE 10+, Opera, Safari 6.1+  */
}

.loaded #loader-wrapper .loader-section.section-right {
  -webkit-transform: translateX(100%);
  /* Chrome, Opera 15+, Safari 3.1+ */
  -ms-transform: translateX(100%);
  /* IE 9 */
  transform: translateX(100%);
  /* Firefox 16+, IE 10+, Opera  */
  -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
  /* Android 2.1+, Chrome 1-25, iOS 3.2-6.1, Safari 3.2-6  */
  transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
  /* Chrome 26, Firefox 16+, iOS 7+, IE 10+, Opera, Safari 6.1+  */
}

.loaded #loader {
  opacity: 0;
  -webkit-transition: all 0.3s ease-out;
  /* Android 2.1+, Chrome 1-25, iOS 3.2-6.1, Safari 3.2-6  */
  transition: all 0.3s ease-out;
  /* Chrome 26, Firefox 16+, iOS 7+, IE 10+, Opera, Safari 6.1+  */
}

.loaded #loader-wrapper {
  visibility: hidden;
  -webkit-transform: translateY(-100%);
  /* Chrome, Opera 15+, Safari 3.1+ */
  -ms-transform: translateY(-100%);
  /* IE 9 */
  transform: translateY(-100%);
  /* Firefox 16+, IE 10+, Opera  */
  -webkit-transition: all 0.3s 1s ease-out;
  /* Android 2.1+, Chrome 1-25, iOS 3.2-6.1, Safari 3.2-6  */
  transition: all 0.3s 1s ease-out;
  /* Chrome 26, Firefox 16+, iOS 7+, IE 10+, Opera, Safari 6.1+  */
}