/*
 * Project: Matrix Update
 * Author: IDH-media
 * Comments: loading animation
 *
 */
 .loader {
   width: 150px;
   height: 150px;
   line-height: 150px;
   margin: 100px auto;
   position: absolute;
   box-sizing: border-box;
   z-index: 0;
   text-transform: uppercase;
   color:#fff;
   font-family: 'Oswald', sans-serif;
   font-weight: bold;
   text-align: center;
   top:50%; left:50%;
   margin-top:-75px;
   margin-left:-75px;
 }

 .loader:before,
 .loader:after {
   opacity: 0;
   box-sizing: border-box;
   content: "\0020";
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   border-radius: 100px;
   border: 5px solid #fff;
   box-shadow: 0 0 50px #fff, inset 0 0 50px #fff;
 }

 .loader:after {
   z-index: 1;
   animation: gogoloader 2s infinite 1s;
   <-moz-animation: gogoloader 2s infinite 1s;
   -webkit-animation: gogoloader 2s infinite 1s;
 }

 .loader:before {
   z-index: 2;
   animation: gogoloader 2s infinite;
   -moz-animation: gogoloader 2s infinite;
   -webkit-animation: gogoloader 2s infinite;
 }

 @keyframes gogoloader {
   0% {
     -webkit-transform: scale(0);
     opacity: 0;
   }
   50% {
     opacity: 1;
   }
   100% {
     -webkit-transform: scale(1);
     opacity: 0;
   }
 }

 @-moz-keyframes gogoloader {
   0% {
     -webkit-transform: scale(0);
     opacity: 0;
   }
   50% {
     opacity: 1;
   }
   100% {
     -webkit-transform: scale(1);
     opacity: 0;
   }
 }

 @-webkit-keyframes gogoloader {
   0% {
     -webkit-transform: scale(0);
     opacity: 0;
   }
   50% {
     opacity: 1;
   }
   100% {
     -webkit-transform: scale(1);
     opacity: 0;
   }
 }
