/*!
 * Circular HTML5 Preloader
 * http://codecanyon.net/user/flashedge
 *
 * Version: 0.9.6
 * Updated: 13/07/15
 *
 * @license Copyright (c) 2015. All rights reserved.
 * @author: Emanuele Manco, hello@flashedge.net
 */

/* These styles are not mandatory and are only needed for a better design, 
   you can also style it on your own if you wish so. It's up to you! */

@import url(//fonts.googleapis.com/css?family=Roboto:100&text=0123456789%25:);
@import url(../css/animate.css); /* includes animations for the preloader */

.cp-wrapper {
    position: relative;
    text-align: center;
    vertical-align: middle;
    float: left;
    display:block;
    width:100%;
    min-height: 300px;
    height:auto;
    overflow: hidden;
    /*transition: all 0.5s ease-in;*/
}

.cp-preloader {
    display: inline-block;
    position: absolute;
    left:0;
    top:0;
    text-align: center;
    vertical-align: middle;
    width: 100%;
    height: 100%;
    float: left;
}

.cp-preloader>svg {
    vertical-align: middle;
    display: inline-block;
    
    position: relative;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.cp-preloader>svg>text {
    /* some nice styling for the number */
    /*font-family: 'Open Sans', sans-serif;*/
    font-family: 'Roboto', sans-serif;
    font-weight: 300;
    letter-spacing: -0.01em;
    
    /* make it unselectable */
    -moz-user-select: none; 
    -khtml-user-select: none; 
    -webkit-user-select: none; 
    -o-user-select: none; 
    cursor:default;
}

.cp-container {
    width:100%;
    height:100%;
    background-size: cover;
    vertical-align: middle;
}

.cp-container:before {
    content: "";
    display: inline-block;
    height: 100%;
    vertical-align: middle;
}

.cp-container>img {
    display:inline-block;
    vertical-align: middle;
    width:100%;
    height:auto;
}

/* overwrite animate.css behaviour */
.animated {
  -webkit-animation-duration: 0.5s;
  animation-duration: 0.5s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}