

/**page loader**/



#loader-wrapper {

  position: fixed;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  z-index:3000;

}



#loader{

  display: block;

  position: relative;

  left: 50%;

  top: 50%;

  width: 150px;

  height: 150px;

  margin: -75px 0 0 -75px;

  z-index: 1001;

      text-align: center;

}

#loader span{    color: #fff;

    margin: 26px 0 0 0;

    display: inline-block;

    font-size: 26px;}

@-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:#000;

  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+  */

}



