/*	-----------------------------------
	Animation Speeds
	----------------------------------- */
.animated.very-slow {
    -webkit-animation-duration: 3s;
    -moz-animation-duration: 3s;
    -ms-animation-duration: 3s;
    -o-animation-duration: 3s;
    animation-duration: 3s;
}

.animated.slow {
    -webkit-animation-duration: 2s;
    -moz-animation-duration: 2s;
    -ms-animation-duration: 2s;
    -o-animation-duration: 2s;
    animation-duration: 2s;
}

.animated.fast {
    -webkit-animation-duration: .5s;
    -moz-animation-duration: .5s;
    -ms-animation-duration: .5s;
    -o-animation-duration: .5s;
    animation-duration: .5s;
}

.animated.very-fast {
    -webkit-animation-duration: .250s;
    -moz-animation-duration: .250s;
    -ms-animation-duration: .250s;
    -o-animation-duration: .250s;
    animation-duration: .250s;
}

.animated.paused {
    -webkit-animation-play-state: paused;
    -moz-animation-play-state: paused;
    -o-animation-play-state: paused;
    animation-play-state: paused;
}

.animated.play {
    -webkit-animation-play-state: running;
    -moz-animation-play-state: running;
    -o-animation-play-state: running;
    animation-play-state: running;
}

/*	-----------------------------------
	Key Frames
	----------------------------------- */
@-webkit-keyframes speedIn {
    0% {
        -webkit-transform: translateX(100%) skewX(-10deg);
        opacity: 0;
    }

    40% {
        -webkit-transform: translateX(-20%) skewX(10deg);
        opacity: 1;
    }

    80% {
        -webkit-transform: translateX(0%) skewX(-2deg);
        opacity: 1;
    }

    100% {
        -webkit-transform: translateX(0%) skewX(0deg);
        opacity: 1;
    }
}

@-moz-keyframes speedIn {
    0% {
        -moz-transform: translateX(100%) skewX(-10deg);
        opacity: 0;
    }

    40% {
        -moz-transform: translateX(-20%) skewX(10deg);
        opacity: 1;
    }

    80% {
        -moz-transform: translateX(0%) skewX(-2deg);
        opacity: 1;
    }

    100% {
        -moz-transform: translateX(0%) skewX(0deg);
        opacity: 1;
    }
}

@-o-keyframes speedIn {
    0% {
        -o-transform: translateX(100%) skewX(-10deg);
        opacity: 0;
    }

    40% {
        -o-transform: translateX(-20%) skewX(10deg);
        opacity: 1;
    }

    80% {
        -o-transform: translateX(0%) skewX(-2deg);
        opacity: 1;
    }

    100% {
        -o-transform: translateX(0%) skewX(0deg);
        opacity: 1;
    }
}

@keyframes speedIn {
    0% {
        transform: translateX(100%) skewX(-10deg);
        opacity: 0;
    }

    40% {
        transform: translateX(-20%) skewX(10deg);
        opacity: 1;
    }

    80% {
        transform: translateX(0%) skewX(-2deg);
        opacity: 1;
    }

    100% {
        transform: translateX(0%) skewX(0deg);
        opacity: 1;
    }
}

@-webkit-keyframes contentHighlight {
    0% {
        background-color: #FFFFED;
    }
}

@-moz-keyframes contentHighlight {
    0% {
        background-color: #FFFFED;
    }
}

@-o-keyframes contentHighlight {
    0% {
        background-color: #FFFFED;
    }
}

@keyframes contentHighlight {
    0% {
        background-color: #FFFFED;
    }
}

@-webkit-keyframes shiftSpriteUp {
    0% {
        background-position: 0 0;
    }

    100% {
        background-position: 0 -24px;
    }
}

@-moz-keyframes shiftSpriteUp {
    0% {
        background-position: 0 0;
    }

    100% {
        background-position: 0 -24px;
    }
}

@-o-keyframes shiftSpriteUp {
    0% {
        background-position: 0 0;
    }

    100% {
        background-position: 0 -24px;
    }
}

@keyframes shiftSpriteUp {
    0% {
        background-position: 0 0;
    }

    100% {
        background-position: 0 -24px;
    }
}

@-webkit-keyframes shiftSpriteDown {
    0% {
        background-position: 0 -24px;
    }

    100% {
        background-position: 0 0;
    }
}

@-moz-keyframes shiftSpriteDown {
    0% {
        background-position: 0 -24px;
    }

    100% {
        background-position: 0 0;
    }
}

@-o-keyframes shiftSpriteDown {
    0% {
        background-position: 0 -24px;
    }

    100% {
        background-position: 0 0;
    }
}

@keyframes shiftSpriteDown {
    0% {
        background-position: 0 -24px;
    }

    100% {
        background-position: 0 0;
    }
}

/*@-webkit-keyframes bounceOutLeft {
	0% {
		-webkit-transform: translateX(0);
	}
	20% {
		opacity: 1;
		-webkit-transform: translateX(20px);
	}
	100% {
		opacity: 0;
	    display: none;
		-webkit-transform: translateX(-2000px);
	}
}
@-moz-keyframes bounceOutLeft {
	0% {
		-moz-transform: translateX(0);
	}
	20% {
		opacity: 1;
		-moz-transform: translateX(20px);
	}
	100% {
		opacity: 0;
	    display: none;
		-moz-transform: translateX(-2000px);
	}
}
@-o-keyframes bounceOutLeft {
	0% {
		-o-transform: translateX(0);
	}
	20% {
		opacity: 1;
		-o-transform: translateX(20px);
	}
	100% {
		opacity: 0;
	    display: none;
		-o-transform: translateX(-2000px);
	}
}*/
@-moz-keyframes pulsing {
 0% {
    -moz-transform: scale(0);
    opacity: 0.0;
    opacity: .3;
 }
 25% {
    -moz-transform: scale(0);
    opacity: 0.1;
    opacity: .4;
 }
 50% {
    -moz-transform: scale(0.1);
    opacity: 0.6;
 }
 75% {
    -moz-transform: scale(0.5);
    opacity: 0.5;
    opacity: 1;
 }
 100% {
    -moz-transform: scale(1);
    opacity: 0.0;
    opacity: .3;
 }
}

@-webkit-keyframes pulsing {
 0% {
    -webkit-transform: scale(0);
    opacity: 0.0;
    opacity: .3;
 }
 25% {
    -webkit-transform: scale(0);
    opacity: 0.1;
    opacity: .4;
 }
 50% {
    -webkit-transform: scale(0.1);
    opacity: 0.3;
    opacity: .6;
 }
 75% {
    -webkit-transform: scale(0.5);
    opacity: 0.5;
    opacity: 1;
 }
 100% {
    -webkit-transform: scale(1);
    opacity: 0.0;
    opacity: .3;
 }
}
@keyframes pulsing {
 0% {
    -moz-transform: scale(0);
    opacity: 0.0;
    opacity: .3;
 }
 25% {
    -moz-transform: scale(0);
    opacity: 0.1;
    opacity: .4;
 }
 50% {
    -moz-transform: scale(0.1);
    opacity: 0.3;
    opacity: .6;
 }
 75% {
    -moz-transform: scale(0.5);
    opacity: 0.5;
    opacity: 1;
 }
 100% {
    -moz-transform: scale(1);
    opacity: 0.0;
    opacity: .3;
 }
}
/*	-----------------------------------
	Animations
	----------------------------------- */
.blindExpand {
    -webkit-animation-name: blindExpand;
    -moz-animation-name: blindExpand;
    -o-animation-name: blindExpand;
    animation-name: blindExpand;
    -webkit-animation-timing-function: ease-in;
    -moz-animation-timing-function: ease-in;
    -o-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
}

.blindCollapse {
    -webkit-animation-name: blindCollapse;
    -moz-animation-name: blindCollapse;
    -o-animation-name: blindCollapse;
    animation-name: blindCollapse;
    -webkit-animation-timing-function: ease-out;
    -moz-animation-timing-function: ease-out;
    -o-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
    overflow: hidden;
}

.speedIn {
    -webkit-animation-name: speedIn;
    -moz-animation-name: speedIn;
    -o-animation-name: speedIn;
    animation-name: speedIn;
    -webkit-animation-timing-function: ease-out;
    -moz-animation-timing-function: ease-out;
    -o-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
}

.contentHighlight {
    -webkit-animation-name: contentHighlight;
    -moz-animation-name: contentHighlight;
    -o-animation-name: contentHighlight;
    animation-name: contentHighlight;
    -webkit-animation-timing-function: ease-in-out;
    -moz-animation-timing-function: ease-in-out;
    -o-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
}
/*	-----------------------------------
	Transitions
	----------------------------------- */
/*
.transition {
    transition: 1s ease-out;
    -webkit-transition: 1s ease-out;
    -moz-transition: 1s ease-out;
}

    .transition.very-slow {
        -webkit-transition-duration: 3s;
        -moz-transition-duration: 3s;
        -ms-transition-duration: 3s;
        -o-transition-duration: 3s;
        transition-duration: 3s;
    }

    .transition.slow {
        -webkit-transition-duration: 2s;
        -moz-transition-duration: 2s;
        -ms-transition-duration: 2s;
        -o-transition-duration: 2s;
        transition-duration: 2s;
    }

    .transition.fast {
        -webkit-transition-duration: .5s;
        -moz-transition-duration: .5s;
        -ms-transition-duration: .5s;
        -o-transition-duration: .5s;
        transition-duration: .5s;
    }

    .transition.very-fast {
        -webkit-transition-duration: .250s;
        -moz-transition-duration: .250s;
        -ms-transition-duration: .250s;
        -o-transition-duration: .250s;
        transition-duration: .250s;
    }
*/
.spring {
    /* http://matthewlein.com/ceaser/ */
    -webkit-transition-timing-function: cubic-bezier(0.295, 1.470, 0.505, 0.595);
    -moz-transition-timing-function: cubic-bezier(0.295, 1.470, 0.505, 0.595);
    -ms-transition-timing-function: cubic-bezier(0.295, 1.470, 0.505, 0.595);
    -o-transition-timing-function: cubic-bezier(0.295, 1.470, 0.505, 0.595);
    transition-timing-function: cubic-bezier(0.295, 1.470, 0.505, 0.595);
}

.outShiftUpIn {
    -webkit-animation: bounceOut 1s, shiftSpriteUp .001s 1s both, speedIn 1s 1.001s;
    -moz-animation: bounceOut 1s, shiftSpriteUp .001s 1s both, speedIn 1s 1.001s;
    -o-animation: bounceOut 1s, shiftSpriteUp .001s 1s both, speedIn 1s 1.001s;
    animation: bounceOut 1s, shiftSpriteUp .001s 1s both, speedIn 1s 1.001s;
}

.outShiftDownIn {
    -webkit-animation: bounceOut 1s, shiftSpriteDown .001s 1s both, speedIn 1s 1.001s;
    -moz-animation: bounceOut 1s, shiftSpriteDown .001s 1s both, speedIn 1s 1.001s;
    -o-animation: bounceOut 1s, shiftSpriteDown .001s 1s both, speedIn 1s 1.001s;
    animation: bounceOut 1s, shiftSpriteDown .001s 1s both, speedIn 1s 1.001s;
}

.transition.expanded,
.transition.collapsed {
    overflow: hidden;
    clear: both;
}

.expanded {
}

.collapsed {
    height: 0;
    /*overflow: hidden;*/
    display: none;
}

































.wrap {
    position: relative;
    margin: 0 auto;
    width: 80px;
    height: 90px;
}

.loader {
    position: absolute;
    top: 0;
    z-index: 10;
    width: 50px;
    height: 50px;
    border: 15px solid;
    border-radius: 50%;
    border-top-color: rgba(44,44,44,0);
    border-right-color: rgba(55,55,55,0);
    border-bottom-color: rgba(66,66,66,0);
    border-left-color: rgba(33,33,33,0);
    -webkit-animation: loadEr 3s infinite;
}

@-webkit-keyframes loadEr {
    0% {
        border-top-color: rgba(44,44,44,0);
        border-right-color: rgba(55,55,55,0);
        border-bottom-color: rgba(66,66,66,0);
        border-left-color: rgba(33,33,33,0);
    }

    10.4% {
        border-top-color: rgba(44,44,44,0.5);
        border-right-color: rgba(55,55,55,0);
        border-bottom-color: rgba(66,66,66,0);
        border-left-color: rgba(33,33,33,0);
    }

    20.8% {
        border-top-color: rgba(44,44,44,0);
        border-right-color: rgba(55,55,55,0);
        border-bottom-color: rgba(66,66,66,0);
        border-left-color: rgba(33,33,33,0);
    }

    31.2% {
        border-top-color: rgba(44,44,44,0);
        border-right-color: rgba(55,55,55,0.5);
        border-bottom-color: rgba(66,66,66,0);
        border-left-color: rgba(33,33,33,0);
    }

    41.6% {
        border-top-color: rgba(44,44,44,0);
        border-right-color: rgba(55,55,55,0);
        border-bottom-color: rgba(66,66,66,0);
        border-left-color: rgba(33,33,33,0);
        transform: rotate(40deg);
    }

    52% {
        border-top-color: rgba(44,44,44,0);
        border-right-color: rgba(55,55,55,0);
        border-bottom-color: rgba(66,66,66,0.5);
        border-left-color: rgba(33,33,33,0);
    }

    62.4% {
        border-top-color: rgba(44,44,44,0);
        border-right-color: rgba(55,55,55,0);
        border-bottom-color: rgba(66,66,66,0);
        border-left-color: rgba(33,33,33,0);
    }

    72.8% {
        border-top-color: rgba(44,44,44,0);
        border-right-color: rgba(55,55,55,0);
        border-bottom-color: rgba(66,66,66,0);
        border-left-color: rgba(33,33,33,0.5);
    }
}

.loaderbefore {
    width: 50px;
    height: 50px;
    border: 15px solid #ddd;
    border-radius: 50%;
    position: absolute;
    top: 0;
    z-index: 9;
}

.circular {
    position: absolute;
    top: -15px;
    left: -15px;
    width: 70px;
    height: 70px;
    border: 20px solid;
    border-radius: 50%;
    border-top-color: #333;
    border-left-color: #fff;
    border-bottom-color: #333;
    border-right-color: #fff;
    opacity: 0.2;
    -webkit-animation: poof 5s infinite;
}

@-webkit-keyframes poof {
    0% {
        transform: scale(1,1) rotate(0deg);
        opacity: 0.9;
    }

    50% {
        transform: scale(4,4) rotate(360deg);
        opacity: 0;
    }
}

.another {
    opacity: 0.1;
    transform: rotate(90deg);
    -webkit-animation: poofity 5s infinite;
    -webkit-animation-delay: 1s;
}

@-webkit-keyframes poofity {
    0% {
        transform: scale(1,1) rotate(90deg);
        opacity: 0.7;
    }

    50% {
        transform: scale(4,4) rotate(-360deg);
        opacity: 0;
    }
}

.text {
    /*position: absolute;
    top: 95px;
    left: 8px;*/
    text-transform: uppercase;
    color: #888;
    -webkit-animation: opaa 10s infinite;
}

@-webkit-keyframes opaa {
    0% {
        opacity: 1;
    }

    10% {
        opacity: 0.5;
    }

    15% {
        opacity: 1;
    }

    30% {
        opacity: 1;
    }

    65% {
        opacity: 0.3;
    }

    90% {
        opacity: 0.8;
    }
}


.text {
    color: #0099f8;
}
.loaderbefore {
    border-color: #0099f8;
}
.circular {
    border-top-color: #0099f8;
    border-bottom-color: #0099f8;
}