/* BEGIN VARIABLES */
/* basic design grid unit */
/* image path */
/* END VARIABLES */
::-webkit-scrollbar {
width: 8px;
height: 8px;
background-color: #f5f5f5;
}
::-webkit-scrollbar-track {
/*-webkit-box-shadow: inset 0 0 6px #000;*/
border-radius: 0px;
background-color: #ccc;
}
::-webkit-scrollbar-thumb {
border-radius: 0px;
/*-webkit-box-shadow: inset 0 0 6px #000;*/
background-color: #333;
}
/* BEGIN FONTS */
/* Futura */
@font-face {
font-family: 'Futura Bold';
src: url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/futura/futuralt-bold-webfont.eot');
src: url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/futura/futuralt-bold-webfont.eot#iefix') format('embedded-opentype'), url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/futura/futuralt-bold-webfont.woff') format('woff'), url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/futura/futuralt-bold-webfont.ttf') format('truetype'), url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/futura/futuralt-bold-webfont.svg#futura_ltbold') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'Futura Light';
src: url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/futura/futuralt-light-webfont.eot');
src: url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/futura/futuralt-light-webfont.eot#iefix') format('embedded-opentype'), url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/futura/futuralt-light-webfont.woff') format('woff'), url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/futura/futuralt-light-webfont.ttf') format('truetype'), url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/futura/futuralt-light-webfont.svg#futura_ltlight') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'Futura';
src: url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/futura/futuralt-webfont.eot');
src: url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/futura/futuralt-webfont.eot#iefix') format('embedded-opentype'), url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/futura/futuralt-webfont.woff') format('woff'), url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/futura/futuralt-webfont.ttf') format('truetype'), url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/futura/futuralt-webfont.svg#futura_ltregular') format('svg');
font-weight: normal;
font-style: normal;
}
/* Proxima Nova */
@font-face {
font-family: 'Proxima Nova Bold';
src: url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/proxima_nova/proximanova-bold-webfont.eot');
src: url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/proxima_nova/proximanova-bold-webfont.eot#iefix') format('embedded-opentype'), url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/proxima_nova/proximanova-bold-webfont.woff') format('woff'), url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/proxima_nova/proximanova-bold-webfont.ttf') format('truetype'), url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/proxima_nova/proximanova-bold-webfont.svg#proxima_nova_rgbold') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'Proxima Nova';
src: url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/proxima_nova/proximanova-light-webfont.eot');
src: url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/proxima_nova/proximanova-light-webfont.eot#iefix') format('embedded-opentype'), url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/proxima_nova/proximanova-light-webfont.woff') format('woff'), url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/proxima_nova/proximanova-light-webfont.ttf') format('truetype'), url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/proxima_nova/proximanova-light-webfont.svg#proxima_nova_ltlight') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'Proxima Nova Italic';
src: url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/proxima_nova/proximanova-lightit-webfont.eot');
src: url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/proxima_nova/proximanova-lightit-webfont.eot#iefix') format('embedded-opentype'), url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/proxima_nova/proximanova-lightit-webfont.woff') format('woff'), url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/proxima_nova/proximanova-lightit-webfont.ttf') format('truetype'), url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/proxima_nova/proximanova-lightit-webfont.svg#proxima_novalight_italic') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'Proxima Nova Semi-Bold';
src: url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/proxima_nova/proximanova-sbold-webfont.eot');
src: url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/proxima_nova/proximanova-sbold-webfont.eot#iefix') format('embedded-opentype'), url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/proxima_nova/proximanova-sbold-webfont.woff') format('woff'), url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/proxima_nova/proximanova-sbold-webfont.ttf') format('truetype'), url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/proxima_nova/proximanova-sbold-webfont.svg#proxima_nova_ltsemibold') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'Proxima Nova Semi-Bold Italic';
src: url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/proxima_nova/proximanova-sboldit-webfont.eot');
src: url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/proxima_nova/proximanova-sboldit-webfont.eot#iefix') format('embedded-opentype'), url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/proxima_nova/proximanova-sboldit-webfont.woff') format('woff'), url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/proxima_nova/proximanova-sboldit-webfont.ttf') format('truetype'), url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/proxima_nova/proximanova-sboldit-webfont.svg#proxima_novasemibold_italic') format('svg');
font-weight: normal;
font-style: normal;
}
/* Open Sans */
@font-face {
font-family: 'Open Sans Bold';
src: url('fonts/Open_Sans/OpenSans-Bold.ttf');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'Open Sans';
src: url('fonts/Open_Sans/OpenSans-Regular.ttf');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'Open Sans Italic';
src: url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/Open_Sans/OpenSans-Italic.ttf');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'Open Sans Semi-Bold';
src: url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/Open_Sans/OpenSans-Semibold.ttf');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'Open Sans Semi-Bold Italic';
src: url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/Open_Sans/OpenSans-SemiboldItalic.ttf');
font-weight: normal;
font-style: normal;
}
/* Montserrat */
@font-face {
font-family: 'Montserrat Bold';
src: url('fonts/Montserrat/Montserrat-Bold.ttf');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'Montserrat';
src: url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/css/fonts/Montserrat/Montserrat-Regular.ttf');
font-weight: normal;
font-style: normal;
}
/* END FONTS */
/* BEGIN MIXINS */
/*
* For border mixins, I am setting @color as the first param
* because this will be the most frequently customized, so in
* most cases we can leave out the other two params in calls
* to the mixin
*/
.panel .panel-heading .panel-title {
padding-top: 15px;
}
.panel .panel-title {
text-transform: uppercase;
font-size: 1.2em;
}
.panel .panel-body table {
margin-bottom: 0px;
}
.breadcrumb {
background: none;
padding-left: 0px;
}
.page-header h1 {
margin-top: 0px;
}
.progress {
margin-bottom: 0px;
height: 10px;
}
.carousel.carousel-instant .item {
/*-webkit-transition: opacity 0.05s ease-in-out;
-moz-transition: opacity 0.05s ease-in-out;
-ms-transition: opacity 0.05s ease-in-out;
-o-transition: opacity 0.05s ease-in-out;
transition: opacity 0.05s ease-in-out;*/
opacity: 1;
}
.carousel.carousel-instant .active.item {
opacity: 1;
}
.carousel.carousel-instant .active.left,
.carousel.carousel-instant .active.right {
left: 0;
z-index: 2;
opacity: 0;
filter: alpha(opacity=0);
}
.carousel.carousel-instant .next,
.carousel.carousel-instant .prev {
left: 0;
z-index: 1;
}
.carousel.carousel-instant .carousel-control {
z-index: 3;
}
.accordion-toggle {
display: block;
}
.progress {
background-color: #ddd;
}
.pagination li a span.loading {
display: none;
}
.pagination li.loading a {
background-color: #fff;
border: 1px solid #ddd;
background: url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/img/loading_pagination.gif') center center no-repeat;
}
.pagination li.loading a span.page-number {
opacity: 0;
}
.pagination li.loading a:hover {
background-color: #fff;
border: 1px solid #ddd;
}
.nav.nav-pills li a {
padding: 3px 20px;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
-moz-background-clip: padding;
-webkit-background-clip: padding-box;
background-clip: padding-box;
border: 1px solid #ddd;
background-color: #fff;
color: #bbb;
-webkit-transition: initial;
-moz-transition: initial;
-o-transition: initial;
-ms-transition: initial;
transition: initial;
}
.nav.nav-pills li a:hover {
background-color: #999;
color: #fff;
}
.nav.nav-pills li.active a,
.nav.nav-pills li.active a:hover,
.nav.nav-pills li.active a:active {
background-color: #006cab;
color: #fff !important;
border: none;
}
.btn {
text-transform: uppercase;
-webkit-transition: initial;
-moz-transition: initial;
-o-transition: initial;
-ms-transition: initial;
transition: initial;
/*&.btn-default {
&:hover,
&:active {
background-color: @brand-success;
color: #fff;
}
}*/
}
#content > .row {
margin: 0px;
}
/* animation sets */
/* move from / to */
.pt-page-moveToLeft {
-webkit-animation: moveToLeft .6s ease both;
animation: moveToLeft .6s ease both;
}
.pt-page-moveFromLeft {
-webkit-animation: moveFromLeft .6s ease both;
animation: moveFromLeft .6s ease both;
}
.pt-page-moveToRight {
-webkit-animation: moveToRight .6s ease both;
animation: moveToRight .6s ease both;
}
.pt-page-moveFromRight {
-webkit-animation: moveFromRight .6s ease both;
animation: moveFromRight .6s ease both;
}
.pt-page-moveToTop {
-webkit-animation: moveToTop .6s ease both;
animation: moveToTop .6s ease both;
}
.pt-page-moveFromTop {
-webkit-animation: moveFromTop .6s ease both;
animation: moveFromTop .6s ease both;
}
.pt-page-moveToBottom {
-webkit-animation: moveToBottom .6s ease both;
animation: moveToBottom .6s ease both;
}
.pt-page-moveFromBottom {
-webkit-animation: moveFromBottom .6s ease both;
animation: moveFromBottom .6s ease both;
}
/* fade */
.pt-page-fade {
-webkit-animation: fade .7s ease both;
animation: fade .7s ease both;
}
/* move from / to and fade */
.pt-page-moveToLeftFade {
-webkit-animation: moveToLeftFade .7s ease both;
animation: moveToLeftFade .7s ease both;
}
.pt-page-moveFromLeftFade {
-webkit-animation: moveFromLeftFade .7s ease both;
animation: moveFromLeftFade .7s ease both;
}
.pt-page-moveToRightFade {
-webkit-animation: moveToRightFade .7s ease both;
animation: moveToRightFade .7s ease both;
}
.pt-page-moveFromRightFade {
-webkit-animation: moveFromRightFade .7s ease both;
animation: moveFromRightFade .7s ease both;
}
.pt-page-moveToTopFade {
-webkit-animation: moveToTopFade .7s ease both;
animation: moveToTopFade .7s ease both;
}
.pt-page-moveFromTopFade {
-webkit-animation: moveFromTopFade .7s ease both;
animation: moveFromTopFade .7s ease both;
}
.pt-page-moveToBottomFade {
-webkit-animation: moveToBottomFade .7s ease both;
animation: moveToBottomFade .7s ease both;
}
.pt-page-moveFromBottomFade {
-webkit-animation: moveFromBottomFade .7s ease both;
animation: moveFromBottomFade .7s ease both;
}
/* move to with different easing */
.pt-page-moveToLeftEasing {
-webkit-animation: moveToLeft 0.7s ease-in-out both;
animation: moveToLeft 0.7s ease-in-out both;
}
.pt-page-moveToRightEasing {
-webkit-animation: moveToRight 0.7s ease-in-out both;
animation: moveToRight 0.7s ease-in-out both;
}
.pt-page-moveToTopEasing {
-webkit-animation: moveToTop 0.7s ease-in-out both;
animation: moveToTop 0.7s ease-in-out both;
}
.pt-page-moveToBottomEasing {
-webkit-animation: moveToBottom 0.7s ease-in-out both;
animation: moveToBottom 0.7s ease-in-out both;
}
/********************************* keyframes **************************************/
/* move from / to */
@-webkit-keyframes moveToLeft {
to {
-webkit-transform: translateX(-100%);
}
}
@keyframes moveToLeft {
to {
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
}
@-webkit-keyframes moveFromLeft {
from {
-webkit-transform: translateX(-100%);
}
}
@keyframes moveFromLeft {
from {
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
}
@-webkit-keyframes moveToRight {
to {
-webkit-transform: translateX(100%);
}
}
@keyframes moveToRight {
to {
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
}
@-webkit-keyframes moveFromRight {
from {
-webkit-transform: translateX(100%);
}
}
@keyframes moveFromRight {
from {
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
}
@-webkit-keyframes moveToTop {
to {
-webkit-transform: translateY(-100%);
}
}
@keyframes moveToTop {
to {
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
}
}
@-webkit-keyframes moveFromTop {
from {
-webkit-transform: translateY(-100%);
}
}
@keyframes moveFromTop {
from {
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
}
}
@-webkit-keyframes moveToBottom {
to {
-webkit-transform: translateY(100%);
}
}
@keyframes moveToBottom {
to {
-webkit-transform: translateY(100%);
transform: translateY(100%);
}
}
@-webkit-keyframes moveFromBottom {
from {
-webkit-transform: translateY(100%);
}
}
@keyframes moveFromBottom {
from {
-webkit-transform: translateY(100%);
transform: translateY(100%);
}
}
/* fade */
@-webkit-keyframes fade {
to {
opacity: 0.3;
}
}
@keyframes fade {
to {
opacity: 0.3;
}
}
@-webkit-keyframes fullFadeOut {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes fullFadeIn {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
/* move from / to and fade */
@-webkit-keyframes moveToLeftFade {
to {
opacity: 0.3;
-webkit-transform: translateX(-100%);
}
}
@keyframes moveToLeftFade {
to {
opacity: 0.3;
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
}
@-webkit-keyframes moveFromLeftFade {
from {
opacity: 0.3;
-webkit-transform: translateX(-100%);
}
}
@keyframes moveFromLeftFade {
from {
opacity: 0.3;
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
}
@-webkit-keyframes moveToRightFade {
to {
opacity: 0.3;
-webkit-transform: translateX(100%);
}
}
@keyframes moveToRightFade {
to {
opacity: 0.3;
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
}
@-webkit-keyframes moveFromRightFade {
from {
opacity: 0.3;
-webkit-transform: translateX(100%);
}
}
@keyframes moveFromRightFade {
from {
opacity: 0.3;
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
}
@-webkit-keyframes moveToTopFade {
to {
opacity: 0.3;
-webkit-transform: translateY(-100%);
}
}
@keyframes moveToTopFade {
to {
opacity: 0.3;
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
}
}
@-webkit-keyframes moveFromTopFade {
from {
opacity: 0.3;
-webkit-transform: translateY(-100%);
}
}
@keyframes moveFromTopFade {
from {
opacity: 0.3;
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
}
}
@-webkit-keyframes moveToBottomFade {
to {
opacity: 0.3;
-webkit-transform: translateY(100%);
}
}
@keyframes moveToBottomFade {
to {
opacity: 0.3;
-webkit-transform: translateY(100%);
transform: translateY(100%);
}
}
@-webkit-keyframes moveFromBottomFade {
from {
opacity: 0.3;
-webkit-transform: translateY(100%);
}
}
@keyframes moveFromBottomFade {
from {
opacity: 0.3;
-webkit-transform: translateY(100%);
transform: translateY(100%);
}
}
/* scale and fade */
.pt-page-scaleDown {
-webkit-animation: scaleDown .7s ease both;
animation: scaleDown .7s ease both;
}
.pt-page-scaleUp {
-webkit-animation: scaleUp .7s ease both;
animation: scaleUp .7s ease both;
}
.pt-page-scaleUpDown {
-webkit-animation: scaleUpDown .5s ease both;
animation: scaleUpDown .5s ease both;
}
.pt-page-scaleDownUp {
-webkit-animation: scaleDownUp .5s ease both;
animation: scaleDownUp .5s ease both;
}
.pt-page-scaleDownCenter {
-webkit-animation: scaleDownCenter 0.4s ease-in both;
animation: scaleDownCenter 0.4s ease-in both;
}
.pt-page-scaleUpCenter {
-webkit-animation: scaleUpCenter 0.4s ease-out both;
animation: scaleUpCenter 0.4s ease-out both;
}
/********************************* keyframes **************************************/
/* scale and fade */
@-webkit-keyframes scaleDown {
to {
opacity: 0;
-webkit-transform: scale(0.8);
}
}
@keyframes scaleDown {
to {
opacity: 0;
-webkit-transform: scale(0.8);
transform: scale(0.8);
}
}
@-webkit-keyframes scaleUp {
from {
opacity: 0;
-webkit-transform: scale(0.8);
}
}
@keyframes scaleUp {
from {
opacity: 0;
-webkit-transform: scale(0.8);
transform: scale(0.8);
}
}
@-webkit-keyframes scaleUpDown {
from {
opacity: 0;
-webkit-transform: scale(1.2);
}
}
@keyframes scaleUpDown {
from {
opacity: 0;
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
}
@-webkit-keyframes scaleDownUp {
to {
opacity: 0;
-webkit-transform: scale(1.2);
}
}
@keyframes scaleDownUp {
to {
opacity: 0;
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
}
@-webkit-keyframes scaleDownCenter {
to {
opacity: 0;
-webkit-transform: scale(0.7);
}
}
@keyframes scaleDownCenter {
to {
opacity: 0;
-webkit-transform: scale(0.7);
transform: scale(0.7);
}
}
@-webkit-keyframes scaleUpCenter {
from {
opacity: 0;
-webkit-transform: scale(0.7);
}
}
@keyframes scaleUpCenter {
from {
opacity: 0;
-webkit-transform: scale(0.7);
transform: scale(0.7);
}
}
/* rotate sides first and scale */
.pt-page-rotateRightSideFirst {
-webkit-transform-origin: 0% 50%;
transform-origin: 0% 50%;
-webkit-animation: rotateRightSideFirst 0.8s both ease-in;
animation: rotateRightSideFirst 0.8s both ease-in;
}
.pt-page-rotateLeftSideFirst {
-webkit-transform-origin: 100% 50%;
transform-origin: 100% 50%;
-webkit-animation: rotateLeftSideFirst 0.8s both ease-in;
animation: rotateLeftSideFirst 0.8s both ease-in;
}
.pt-page-rotateTopSideFirst {
-webkit-transform-origin: 50% 100%;
transform-origin: 50% 100%;
-webkit-animation: rotateTopSideFirst 0.8s both ease-in;
animation: rotateTopSideFirst 0.8s both ease-in;
}
.pt-page-rotateBottomSideFirst {
-webkit-transform-origin: 50% 0%;
transform-origin: 50% 0%;
-webkit-animation: rotateBottomSideFirst 0.8s both ease-in;
animation: rotateBottomSideFirst 0.8s both ease-in;
}
/* flip */
.pt-page-flipOutRight {
-webkit-transform-origin: 50% 50%;
transform-origin: 50% 50%;
-webkit-animation: flipOutRight 0.5s both ease-in;
animation: flipOutRight 0.5s both ease-in;
}
.pt-page-flipInLeft {
-webkit-transform-origin: 50% 50%;
transform-origin: 50% 50%;
-webkit-animation: flipInLeft 0.5s both ease-out;
animation: flipInLeft 0.5s both ease-out;
}
.pt-page-flipOutLeft {
-webkit-transform-origin: 50% 50%;
transform-origin: 50% 50%;
-webkit-animation: flipOutLeft 0.5s both ease-in;
animation: flipOutLeft 0.5s both ease-in;
}
.pt-page-flipInRight {
-webkit-transform-origin: 50% 50%;
transform-origin: 50% 50%;
-webkit-animation: flipInRight 0.5s both ease-out;
animation: flipInRight 0.5s both ease-out;
}
.pt-page-flipOutTop {
-webkit-transform-origin: 50% 50%;
transform-origin: 50% 50%;
-webkit-animation: flipOutTop 0.5s both ease-in;
animation: flipOutTop 0.5s both ease-in;
}
.pt-page-flipInBottom {
-webkit-transform-origin: 50% 50%;
transform-origin: 50% 50%;
-webkit-animation: flipInBottom 0.5s both ease-out;
animation: flipInBottom 0.5s both ease-out;
}
.pt-page-flipOutBottom {
-webkit-transform-origin: 50% 50%;
transform-origin: 50% 50%;
-webkit-animation: flipOutBottom 0.5s both ease-in;
animation: flipOutBottom 0.5s both ease-in;
}
.pt-page-flipInTop {
-webkit-transform-origin: 50% 50%;
transform-origin: 50% 50%;
-webkit-animation: flipInTop 0.5s both ease-out;
animation: flipInTop 0.5s both ease-out;
}
/* rotate fall */
.pt-page-rotateFall {
-webkit-transform-origin: 0% 0%;
transform-origin: 0% 0%;
-webkit-animation: rotateFall 1s both ease-in;
animation: rotateFall 1s both ease-in;
}
/* rotate newspaper */
.pt-page-rotateOutNewspaper {
-webkit-transform-origin: 50% 50%;
transform-origin: 50% 50%;
-webkit-animation: rotateOutNewspaper 0.5s both ease-in;
animation: rotateOutNewspaper 0.5s both ease-in;
}
.pt-page-rotateInNewspaper {
-webkit-transform-origin: 50% 50%;
transform-origin: 50% 50%;
-webkit-animation: rotateInNewspaper 0.5s both ease-out;
animation: rotateInNewspaper 0.5s both ease-out;
}
/* push */
.pt-page-rotatePushLeft {
-webkit-transform-origin: 0% 50%;
transform-origin: 0% 50%;
-webkit-animation: rotatePushLeft .8s both ease;
animation: rotatePushLeft .8s both ease;
}
.pt-page-rotatePushRight {
-webkit-transform-origin: 100% 50%;
transform-origin: 100% 50%;
-webkit-animation: rotatePushRight .8s both ease;
animation: rotatePushRight .8s both ease;
}
.pt-page-rotatePushTop {
-webkit-transform-origin: 50% 0%;
transform-origin: 50% 0%;
-webkit-animation: rotatePushTop .8s both ease;
animation: rotatePushTop .8s both ease;
}
.pt-page-rotatePushBottom {
-webkit-transform-origin: 50% 100%;
transform-origin: 50% 100%;
-webkit-animation: rotatePushBottom .8s both ease;
animation: rotatePushBottom .8s both ease;
}
/* pull */
.pt-page-rotatePullRight {
-webkit-transform-origin: 100% 50%;
transform-origin: 100% 50%;
-webkit-animation: rotatePullRight .5s both ease;
animation: rotatePullRight .5s both ease;
}
.pt-page-rotatePullLeft {
-webkit-transform-origin: 0% 50%;
transform-origin: 0% 50%;
-webkit-animation: rotatePullLeft .5s both ease;
animation: rotatePullLeft .5s both ease;
}
.pt-page-rotatePullTop {
-webkit-transform-origin: 50% 0%;
transform-origin: 50% 0%;
-webkit-animation: rotatePullTop .5s both ease;
animation: rotatePullTop .5s both ease;
}
.pt-page-rotatePullBottom {
-webkit-transform-origin: 50% 100%;
transform-origin: 50% 100%;
-webkit-animation: rotatePullBottom .5s both ease;
animation: rotatePullBottom .5s both ease;
}
/* fold */
.pt-page-rotateFoldRight {
-webkit-transform-origin: 0% 50%;
transform-origin: 0% 50%;
-webkit-animation: rotateFoldRight .7s both ease;
animation: rotateFoldRight .7s both ease;
}
.pt-page-rotateFoldLeft {
-webkit-transform-origin: 100% 50%;
transform-origin: 100% 50%;
-webkit-animation: rotateFoldLeft .7s both ease;
animation: rotateFoldLeft .7s both ease;
}
.pt-page-rotateFoldTop {
-webkit-transform-origin: 50% 100%;
transform-origin: 50% 100%;
-webkit-animation: rotateFoldTop .7s both ease;
animation: rotateFoldTop .7s both ease;
}
.pt-page-rotateFoldBottom {
-webkit-transform-origin: 50% 0%;
transform-origin: 50% 0%;
-webkit-animation: rotateFoldBottom .7s both ease;
animation: rotateFoldBottom .7s both ease;
}
/* unfold */
.pt-page-rotateUnfoldLeft {
-webkit-transform-origin: 100% 50%;
transform-origin: 100% 50%;
-webkit-animation: rotateUnfoldLeft .7s both ease;
animation: rotateUnfoldLeft .7s both ease;
}
.pt-page-rotateUnfoldRight {
-webkit-transform-origin: 0% 50%;
transform-origin: 0% 50%;
-webkit-animation: rotateUnfoldRight .7s both ease;
animation: rotateUnfoldRight .7s both ease;
}
.pt-page-rotateUnfoldTop {
-webkit-transform-origin: 50% 100%;
transform-origin: 50% 100%;
-webkit-animation: rotateUnfoldTop .7s both ease;
animation: rotateUnfoldTop .7s both ease;
}
.pt-page-rotateUnfoldBottom {
-webkit-transform-origin: 50% 0%;
transform-origin: 50% 0%;
-webkit-animation: rotateUnfoldBottom .7s both ease;
animation: rotateUnfoldBottom .7s both ease;
}
/* room walls */
.pt-page-rotateRoomLeftOut {
-webkit-transform-origin: 100% 50%;
transform-origin: 100% 50%;
-webkit-animation: rotateRoomLeftOut .8s both ease;
animation: rotateRoomLeftOut .8s both ease;
}
.pt-page-rotateRoomLeftIn {
-webkit-transform-origin: 0% 50%;
transform-origin: 0% 50%;
-webkit-animation: rotateRoomLeftIn .8s both ease;
animation: rotateRoomLeftIn .8s both ease;
}
.pt-page-rotateRoomRightOut {
-webkit-transform-origin: 0% 50%;
transform-origin: 0% 50%;
-webkit-animation: rotateRoomRightOut .8s both ease;
animation: rotateRoomRightOut .8s both ease;
}
.pt-page-rotateRoomRightIn {
-webkit-transform-origin: 100% 50%;
transform-origin: 100% 50%;
-webkit-animation: rotateRoomRightIn .8s both ease;
animation: rotateRoomRightIn .8s both ease;
}
.pt-page-rotateRoomTopOut {
-webkit-transform-origin: 50% 100%;
transform-origin: 50% 100%;
-webkit-animation: rotateRoomTopOut .8s both ease;
animation: rotateRoomTopOut .8s both ease;
}
.pt-page-rotateRoomTopIn {
-webkit-transform-origin: 50% 0%;
transform-origin: 50% 0%;
-webkit-animation: rotateRoomTopIn .8s both ease;
animation: rotateRoomTopIn .8s both ease;
}
.pt-page-rotateRoomBottomOut {
-webkit-transform-origin: 50% 0%;
transform-origin: 50% 0%;
-webkit-animation: rotateRoomBottomOut .8s both ease;
animation: rotateRoomBottomOut .8s both ease;
}
.pt-page-rotateRoomBottomIn {
-webkit-transform-origin: 50% 100%;
transform-origin: 50% 100%;
-webkit-animation: rotateRoomBottomIn .8s both ease;
animation: rotateRoomBottomIn .8s both ease;
}
/* cube */
.pt-page-rotateCubeLeftOut {
-webkit-transform-origin: 100% 50%;
transform-origin: 100% 50%;
-webkit-animation: rotateCubeLeftOut 0.6s both ease-in;
animation: rotateCubeLeftOut 0.6s both ease-in;
}
.pt-page-rotateCubeLeftIn {
-webkit-transform-origin: 0% 50%;
transform-origin: 0% 50%;
-webkit-animation: rotateCubeLeftIn 0.6s both ease-in;
animation: rotateCubeLeftIn 0.6s both ease-in;
}
.pt-page-rotateCubeRightOut {
-webkit-transform-origin: 0% 50%;
transform-origin: 0% 50%;
-webkit-animation: rotateCubeRightOut 0.6s both ease-in;
animation: rotateCubeRightOut 0.6s both ease-in;
}
.pt-page-rotateCubeRightIn {
-webkit-transform-origin: 100% 50%;
transform-origin: 100% 50%;
-webkit-animation: rotateCubeRightIn 0.6s both ease-in;
animation: rotateCubeRightIn 0.6s both ease-in;
}
.pt-page-rotateCubeTopOut {
-webkit-transform-origin: 50% 100%;
transform-origin: 50% 100%;
-webkit-animation: rotateCubeTopOut 0.6s both ease-in;
animation: rotateCubeTopOut 0.6s both ease-in;
}
.pt-page-rotateCubeTopIn {
-webkit-transform-origin: 50% 0%;
transform-origin: 50% 0%;
-webkit-animation: rotateCubeTopIn 0.6s both ease-in;
animation: rotateCubeTopIn 0.6s both ease-in;
}
.pt-page-rotateCubeBottomOut {
-webkit-transform-origin: 50% 0%;
transform-origin: 50% 0%;
-webkit-animation: rotateCubeBottomOut 0.6s both ease-in;
animation: rotateCubeBottomOut 0.6s both ease-in;
}
.pt-page-rotateCubeBottomIn {
-webkit-transform-origin: 50% 100%;
transform-origin: 50% 100%;
-webkit-animation: rotateCubeBottomIn 0.6s both ease-in;
animation: rotateCubeBottomIn 0.6s both ease-in;
}
/* carousel */
.pt-page-rotateCarouselLeftOut {
-webkit-transform-origin: 100% 50%;
transform-origin: 100% 50%;
-webkit-animation: rotateCarouselLeftOut .8s both ease;
animation: rotateCarouselLeftOut .8s both ease;
}
.pt-page-rotateCarouselLeftIn {
-webkit-transform-origin: 0% 50%;
transform-origin: 0% 50%;
-webkit-animation: rotateCarouselLeftIn .8s both ease;
animation: rotateCarouselLeftIn .8s both ease;
}
.pt-page-rotateCarouselRightOut {
-webkit-transform-origin: 0% 50%;
transform-origin: 0% 50%;
-webkit-animation: rotateCarouselRightOut .8s both ease;
animation: rotateCarouselRightOut .8s both ease;
}
.pt-page-rotateCarouselRightIn {
-webkit-transform-origin: 100% 50%;
transform-origin: 100% 50%;
-webkit-animation: rotateCarouselRightIn .8s both ease;
animation: rotateCarouselRightIn .8s both ease;
}
.pt-page-rotateCarouselTopOut {
-webkit-transform-origin: 50% 100%;
transform-origin: 50% 100%;
-webkit-animation: rotateCarouselTopOut .8s both ease;
animation: rotateCarouselTopOut .8s both ease;
}
.pt-page-rotateCarouselTopIn {
-webkit-transform-origin: 50% 0%;
transform-origin: 50% 0%;
-webkit-animation: rotateCarouselTopIn .8s both ease;
animation: rotateCarouselTopIn .8s both ease;
}
.pt-page-rotateCarouselBottomOut {
-webkit-transform-origin: 50% 0%;
transform-origin: 50% 0%;
-webkit-animation: rotateCarouselBottomOut .8s both ease;
animation: rotateCarouselBottomOut .8s both ease;
}
.pt-page-rotateCarouselBottomIn {
-webkit-transform-origin: 50% 100%;
transform-origin: 50% 100%;
-webkit-animation: rotateCarouselBottomIn .8s both ease;
animation: rotateCarouselBottomIn .8s both ease;
}
/* sides */
.pt-page-rotateSidesOut {
-webkit-transform-origin: -50% 50%;
transform-origin: -50% 50%;
-webkit-animation: rotateSidesOut 0.5s both ease-in;
animation: rotateSidesOut 0.5s both ease-in;
}
.pt-page-rotateSidesIn {
-webkit-transform-origin: 150% 50%;
transform-origin: 150% 50%;
-webkit-animation: rotateSidesIn 0.5s both ease-out;
animation: rotateSidesIn 0.5s both ease-out;
}
/* slide */
.pt-page-rotateSlideOut {
-webkit-animation: rotateSlideOut 1s both ease;
animation: rotateSlideOut 1s both ease;
}
.pt-page-rotateSlideIn {
-webkit-animation: rotateSlideIn 1s both ease;
animation: rotateSlideIn 1s both ease;
}
/********************************* keyframes **************************************/
/* rotate sides first and scale */
@-webkit-keyframes rotateRightSideFirst {
40% {
-webkit-transform: rotateY(15deg);
opacity: .8;
-webkit-animation-timing-function: ease-out;
}
100% {
-webkit-transform: scale(0.8) translateZ(-200px);
opacity: 0;
}
}
@keyframes rotateRightSideFirst {
40% {
-webkit-transform: rotateY(15deg);
transform: rotateY(15deg);
opacity: .8;
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
100% {
-webkit-transform: scale(0.8) translateZ(-200px);
transform: scale(0.8) translateZ(-200px);
opacity: 0;
}
}
@-webkit-keyframes rotateLeftSideFirst {
40% {
-webkit-transform: rotateY(-15deg);
opacity: .8;
-webkit-animation-timing-function: ease-out;
}
100% {
-webkit-transform: scale(0.8) translateZ(-200px);
opacity: 0;
}
}
@keyframes rotateLeftSideFirst {
40% {
-webkit-transform: rotateY(-15deg);
transform: rotateY(-15deg);
opacity: .8;
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
100% {
-webkit-transform: scale(0.8) translateZ(-200px);
transform: scale(0.8) translateZ(-200px);
opacity: 0;
}
}
@-webkit-keyframes rotateTopSideFirst {
40% {
-webkit-transform: rotateX(15deg);
opacity: .8;
-webkit-animation-timing-function: ease-out;
}
100% {
-webkit-transform: scale(0.8) translateZ(-200px);
opacity: 0;
}
}
@keyframes rotateTopSideFirst {
40% {
-webkit-transform: rotateX(15deg);
transform: rotateX(15deg);
opacity: .8;
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
100% {
-webkit-transform: scale(0.8) translateZ(-200px);
transform: scale(0.8) translateZ(-200px);
opacity: 0;
}
}
@-webkit-keyframes rotateBottomSideFirst {
40% {
-webkit-transform: rotateX(-15deg);
opacity: .8;
-webkit-animation-timing-function: ease-out;
}
100% {
-webkit-transform: scale(0.8) translateZ(-200px);
opacity: 0;
}
}
@keyframes rotateBottomSideFirst {
40% {
-webkit-transform: rotateX(-15deg);
transform: rotateX(-15deg);
opacity: .8;
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
100% {
-webkit-transform: scale(0.8) translateZ(-200px);
transform: scale(0.8) translateZ(-200px);
opacity: 0;
}
}
/* flip */
@-webkit-keyframes flipOutRight {
to {
-webkit-transform: translateZ(-1000px) rotateY(90deg);
opacity: 0.2;
}
}
@keyframes flipOutRight {
to {
-webkit-transform: translateZ(-1000px) rotateY(90deg);
transform: translateZ(-1000px) rotateY(90deg);
opacity: 0.2;
}
}
@-webkit-keyframes flipInLeft {
from {
-webkit-transform: translateZ(-1000px) rotateY(-90deg);
opacity: 0.2;
}
}
@keyframes flipInLeft {
from {
-webkit-transform: translateZ(-1000px) rotateY(-90deg);
transform: translateZ(-1000px) rotateY(-90deg);
opacity: 0.2;
}
}
@-webkit-keyframes flipOutLeft {
to {
-webkit-transform: translateZ(-1000px) rotateY(-90deg);
opacity: 0.2;
}
}
@keyframes flipOutLeft {
to {
-webkit-transform: translateZ(-1000px) rotateY(-90deg);
transform: translateZ(-1000px) rotateY(-90deg);
opacity: 0.2;
}
}
@-webkit-keyframes flipInRight {
from {
-webkit-transform: translateZ(-1000px) rotateY(90deg);
opacity: 0.2;
}
}
@keyframes flipInRight {
from {
-webkit-transform: translateZ(-1000px) rotateY(90deg);
transform: translateZ(-1000px) rotateY(90deg);
opacity: 0.2;
}
}
@-webkit-keyframes flipOutTop {
to {
-webkit-transform: translateZ(-1000px) rotateX(90deg);
opacity: 0.2;
}
}
@keyframes flipOutTop {
to {
-webkit-transform: translateZ(-1000px) rotateX(90deg);
transform: translateZ(-1000px) rotateX(90deg);
opacity: 0.2;
}
}
@-webkit-keyframes flipInBottom {
from {
-webkit-transform: translateZ(-1000px) rotateX(-90deg);
opacity: 0.2;
}
}
@keyframes flipInBottom {
from {
-webkit-transform: translateZ(-1000px) rotateX(-90deg);
transform: translateZ(-1000px) rotateX(-90deg);
opacity: 0.2;
}
}
@-webkit-keyframes flipOutBottom {
to {
-webkit-transform: translateZ(-1000px) rotateX(-90deg);
opacity: 0.2;
}
}
@keyframes flipOutBottom {
to {
-webkit-transform: translateZ(-1000px) rotateX(-90deg);
transform: translateZ(-1000px) rotateX(-90deg);
opacity: 0.2;
}
}
@-webkit-keyframes flipInTop {
from {
-webkit-transform: translateZ(-1000px) rotateX(90deg);
opacity: 0.2;
}
}
@keyframes flipInTop {
from {
-webkit-transform: translateZ(-1000px) rotateX(90deg);
transform: translateZ(-1000px) rotateX(90deg);
opacity: 0.2;
}
}
/* fall */
@-webkit-keyframes rotateFall {
0% {
-webkit-transform: rotateZ(0deg);
}
20% {
-webkit-transform: rotateZ(10deg);
-webkit-animation-timing-function: ease-out;
}
40% {
-webkit-transform: rotateZ(17deg);
}
60% {
-webkit-transform: rotateZ(16deg);
}
100% {
-webkit-transform: translateY(100%) rotateZ(17deg);
}
}
@keyframes rotateFall {
0% {
-webkit-transform: rotateZ(0deg);
transform: rotateZ(0deg);
}
20% {
-webkit-transform: rotateZ(10deg);
transform: rotateZ(10deg);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
40% {
-webkit-transform: rotateZ(17deg);
transform: rotateZ(17deg);
}
60% {
-webkit-transform: rotateZ(16deg);
transform: rotateZ(16deg);
}
100% {
-webkit-transform: translateY(100%) rotateZ(17deg);
transform: translateY(100%) rotateZ(17deg);
}
}
/* newspaper */
@-webkit-keyframes rotateOutNewspaper {
to {
-webkit-transform: translateZ(-3000px) rotateZ(360deg);
opacity: 0;
}
}
@keyframes rotateOutNewspaper {
to {
-webkit-transform: translateZ(-3000px) rotateZ(360deg);
transform: translateZ(-3000px) rotateZ(360deg);
opacity: 0;
}
}
@-webkit-keyframes rotateInNewspaper {
from {
-webkit-transform: translateZ(-3000px) rotateZ(-360deg);
opacity: 0;
}
}
@keyframes rotateInNewspaper {
from {
-webkit-transform: translateZ(-3000px) rotateZ(-360deg);
transform: translateZ(-3000px) rotateZ(-360deg);
opacity: 0;
}
}
/* push */
@-webkit-keyframes rotatePushLeft {
to {
opacity: 0;
-webkit-transform: rotateY(90deg);
}
}
@keyframes rotatePushLeft {
to {
opacity: 0;
-webkit-transform: rotateY(90deg);
transform: rotateY(90deg);
}
}
@-webkit-keyframes rotatePushRight {
to {
opacity: 0;
-webkit-transform: rotateY(-90deg);
}
}
@keyframes rotatePushRight {
to {
opacity: 0;
-webkit-transform: rotateY(-90deg);
transform: rotateY(-90deg);
}
}
@-webkit-keyframes rotatePushTop {
to {
opacity: 0;
-webkit-transform: rotateX(-90deg);
}
}
@keyframes rotatePushTop {
to {
opacity: 0;
-webkit-transform: rotateX(-90deg);
transform: rotateX(-90deg);
}
}
@-webkit-keyframes rotatePushBottom {
to {
opacity: 0;
-webkit-transform: rotateX(90deg);
}
}
@keyframes rotatePushBottom {
to {
opacity: 0;
-webkit-transform: rotateX(90deg);
transform: rotateX(90deg);
}
}
/* pull */
@-webkit-keyframes rotatePullRight {
from {
opacity: 0;
-webkit-transform: rotateY(-90deg);
}
}
@keyframes rotatePullRight {
from {
opacity: 0;
-webkit-transform: rotateY(-90deg);
transform: rotateY(-90deg);
}
}
@-webkit-keyframes rotatePullLeft {
from {
opacity: 0;
-webkit-transform: rotateY(90deg);
}
}
@keyframes rotatePullLeft {
from {
opacity: 0;
-webkit-transform: rotateY(90deg);
transform: rotateY(90deg);
}
}
@-webkit-keyframes rotatePullTop {
from {
opacity: 0;
-webkit-transform: rotateX(-90deg);
}
}
@keyframes rotatePullTop {
from {
opacity: 0;
-webkit-transform: rotateX(-90deg);
transform: rotateX(-90deg);
}
}
@-webkit-keyframes rotatePullBottom {
from {
opacity: 0;
-webkit-transform: rotateX(90deg);
}
}
@keyframes rotatePullBottom {
from {
opacity: 0;
-webkit-transform: rotateX(90deg);
transform: rotateX(90deg);
}
}
/* fold */
@-webkit-keyframes rotateFoldRight {
to {
opacity: 0;
-webkit-transform: translateX(100%) rotateY(90deg);
}
}
@keyframes rotateFoldRight {
to {
opacity: 0;
-webkit-transform: translateX(100%) rotateY(90deg);
transform: translateX(100%) rotateY(90deg);
}
}
@-webkit-keyframes rotateFoldLeft {
to {
opacity: 0;
-webkit-transform: translateX(-100%) rotateY(-90deg);
}
}
@keyframes rotateFoldLeft {
to {
opacity: 0;
-webkit-transform: translateX(-100%) rotateY(-90deg);
transform: translateX(-100%) rotateY(-90deg);
}
}
@-webkit-keyframes rotateFoldTop {
to {
opacity: 0;
-webkit-transform: translateY(-100%) rotateX(90deg);
}
}
@keyframes rotateFoldTop {
to {
opacity: 0;
-webkit-transform: translateY(-100%) rotateX(90deg);
transform: translateY(-100%) rotateX(90deg);
}
}
@-webkit-keyframes rotateFoldBottom {
to {
opacity: 0;
-webkit-transform: translateY(100%) rotateX(-90deg);
}
}
@keyframes rotateFoldBottom {
to {
opacity: 0;
-webkit-transform: translateY(100%) rotateX(-90deg);
transform: translateY(100%) rotateX(-90deg);
}
}
/* unfold */
@-webkit-keyframes rotateUnfoldLeft {
from {
opacity: 0;
-webkit-transform: translateX(-100%) rotateY(-90deg);
}
}
@keyframes rotateUnfoldLeft {
from {
opacity: 0;
-webkit-transform: translateX(-100%) rotateY(-90deg);
transform: translateX(-100%) rotateY(-90deg);
}
}
@-webkit-keyframes rotateUnfoldRight {
from {
opacity: 0;
-webkit-transform: translateX(100%) rotateY(90deg);
}
}
@keyframes rotateUnfoldRight {
from {
opacity: 0;
-webkit-transform: translateX(100%) rotateY(90deg);
transform: translateX(100%) rotateY(90deg);
}
}
@-webkit-keyframes rotateUnfoldTop {
from {
opacity: 0;
-webkit-transform: translateY(-100%) rotateX(90deg);
}
}
@keyframes rotateUnfoldTop {
from {
opacity: 0;
-webkit-transform: translateY(-100%) rotateX(90deg);
transform: translateY(-100%) rotateX(90deg);
}
}
@-webkit-keyframes rotateUnfoldBottom {
from {
opacity: 0;
-webkit-transform: translateY(100%) rotateX(-90deg);
}
}
@keyframes rotateUnfoldBottom {
from {
opacity: 0;
-webkit-transform: translateY(100%) rotateX(-90deg);
transform: translateY(100%) rotateX(-90deg);
}
}
/* room walls */
@-webkit-keyframes rotateRoomLeftOut {
to {
opacity: .3;
-webkit-transform: translateX(-100%) rotateY(90deg);
}
}
@keyframes rotateRoomLeftOut {
to {
opacity: .3;
-webkit-transform: translateX(-100%) rotateY(90deg);
transform: translateX(-100%) rotateY(90deg);
}
}
@-webkit-keyframes rotateRoomLeftIn {
from {
opacity: .3;
-webkit-transform: translateX(100%) rotateY(-90deg);
}
}
@keyframes rotateRoomLeftIn {
from {
opacity: .3;
-webkit-transform: translateX(100%) rotateY(-90deg);
transform: translateX(100%) rotateY(-90deg);
}
}
@-webkit-keyframes rotateRoomRightOut {
to {
opacity: .3;
-webkit-transform: translateX(100%) rotateY(-90deg);
}
}
@keyframes rotateRoomRightOut {
to {
opacity: .3;
-webkit-transform: translateX(100%) rotateY(-90deg);
transform: translateX(100%) rotateY(-90deg);
}
}
@-webkit-keyframes rotateRoomRightIn {
from {
opacity: .3;
-webkit-transform: translateX(-100%) rotateY(90deg);
}
}
@keyframes rotateRoomRightIn {
from {
opacity: .3;
-webkit-transform: translateX(-100%) rotateY(90deg);
transform: translateX(-100%) rotateY(90deg);
}
}
@-webkit-keyframes rotateRoomTopOut {
to {
opacity: .3;
-webkit-transform: translateY(-100%) rotateX(-90deg);
}
}
@keyframes rotateRoomTopOut {
to {
opacity: .3;
-webkit-transform: translateY(-100%) rotateX(-90deg);
transform: translateY(-100%) rotateX(-90deg);
}
}
@-webkit-keyframes rotateRoomTopIn {
from {
opacity: .3;
-webkit-transform: translateY(100%) rotateX(90deg);
}
}
@keyframes rotateRoomTopIn {
from {
opacity: .3;
-webkit-transform: translateY(100%) rotateX(90deg);
transform: translateY(100%) rotateX(90deg);
}
}
@-webkit-keyframes rotateRoomBottomOut {
to {
opacity: .3;
-webkit-transform: translateY(100%) rotateX(90deg);
}
}
@keyframes rotateRoomBottomOut {
to {
opacity: .3;
-webkit-transform: translateY(100%) rotateX(90deg);
transform: translateY(100%) rotateX(90deg);
}
}
@-webkit-keyframes rotateRoomBottomIn {
from {
opacity: .3;
-webkit-transform: translateY(-100%) rotateX(-90deg);
}
}
@keyframes rotateRoomBottomIn {
from {
opacity: .3;
-webkit-transform: translateY(-100%) rotateX(-90deg);
transform: translateY(-100%) rotateX(-90deg);
}
}
/* cube */
@-webkit-keyframes rotateCubeLeftOut {
50% {
-webkit-animation-timing-function: ease-out;
-webkit-transform: translateX(-50%) translateZ(-200px) rotateY(-45deg);
}
100% {
opacity: .3;
-webkit-transform: translateX(-100%) rotateY(-90deg);
}
}
@keyframes rotateCubeLeftOut {
50% {
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
-webkit-transform: translateX(-50%) translateZ(-200px) rotateY(-45deg);
transform: translateX(-50%) translateZ(-200px) rotateY(-45deg);
}
100% {
opacity: .3;
-webkit-transform: translateX(-100%) rotateY(-90deg);
transform: translateX(-100%) rotateY(-90deg);
}
}
@-webkit-keyframes rotateCubeLeftIn {
0% {
opacity: .3;
-webkit-transform: translateX(100%) rotateY(90deg);
}
50% {
-webkit-animation-timing-function: ease-out;
-webkit-transform: translateX(50%) translateZ(-200px) rotateY(45deg);
}
}
@keyframes rotateCubeLeftIn {
0% {
opacity: .3;
-webkit-transform: translateX(100%) rotateY(90deg);
transform: translateX(100%) rotateY(90deg);
}
50% {
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
-webkit-transform: translateX(50%) translateZ(-200px) rotateY(45deg);
transform: translateX(50%) translateZ(-200px) rotateY(45deg);
}
}
@-webkit-keyframes rotateCubeRightOut {
50% {
-webkit-animation-timing-function: ease-out;
-webkit-transform: translateX(50%) translateZ(-200px) rotateY(45deg);
}
100% {
opacity: .3;
-webkit-transform: translateX(100%) rotateY(90deg);
}
}
@keyframes rotateCubeRightOut {
50% {
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
-webkit-transform: translateX(50%) translateZ(-200px) rotateY(45deg);
transform: translateX(50%) translateZ(-200px) rotateY(45deg);
}
100% {
opacity: .3;
-webkit-transform: translateX(100%) rotateY(90deg);
transform: translateX(100%) rotateY(90deg);
}
}
@-webkit-keyframes rotateCubeRightIn {
0% {
opacity: .3;
-webkit-transform: translateX(-100%) rotateY(-90deg);
}
50% {
-webkit-animation-timing-function: ease-out;
-webkit-transform: translateX(-50%) translateZ(-200px) rotateY(-45deg);
}
}
@keyframes rotateCubeRightIn {
0% {
opacity: .3;
-webkit-transform: translateX(-100%) rotateY(-90deg);
transform: translateX(-100%) rotateY(-90deg);
}
50% {
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
-webkit-transform: translateX(-50%) translateZ(-200px) rotateY(-45deg);
transform: translateX(-50%) translateZ(-200px) rotateY(-45deg);
}
}
@-webkit-keyframes rotateCubeTopOut {
50% {
-webkit-animation-timing-function: ease-out;
-webkit-transform: translateY(-50%) translateZ(-200px) rotateX(45deg);
}
100% {
opacity: .3;
-webkit-transform: translateY(-100%) rotateX(90deg);
}
}
@keyframes rotateCubeTopOut {
50% {
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
-webkit-transform: translateY(-50%) translateZ(-200px) rotateX(45deg);
transform: translateY(-50%) translateZ(-200px) rotateX(45deg);
}
100% {
opacity: .3;
-webkit-transform: translateY(-100%) rotateX(90deg);
transform: translateY(-100%) rotateX(90deg);
}
}
@-webkit-keyframes rotateCubeTopIn {
0% {
opacity: .3;
-webkit-transform: translateY(100%) rotateX(-90deg);
}
50% {
-webkit-animation-timing-function: ease-out;
-webkit-transform: translateY(50%) translateZ(-200px) rotateX(-45deg);
}
}
@keyframes rotateCubeTopIn {
0% {
opacity: .3;
-webkit-transform: translateY(100%) rotateX(-90deg);
transform: translateY(100%) rotateX(-90deg);
}
50% {
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
-webkit-transform: translateY(50%) translateZ(-200px) rotateX(-45deg);
transform: translateY(50%) translateZ(-200px) rotateX(-45deg);
}
}
@-webkit-keyframes rotateCubeBottomOut {
50% {
-webkit-animation-timing-function: ease-out;
-webkit-transform: translateY(50%) translateZ(-200px) rotateX(-45deg);
}
100% {
opacity: .3;
-webkit-transform: translateY(100%) rotateX(-90deg);
}
}
@keyframes rotateCubeBottomOut {
50% {
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
-webkit-transform: translateY(50%) translateZ(-200px) rotateX(-45deg);
transform: translateY(50%) translateZ(-200px) rotateX(-45deg);
}
100% {
opacity: .3;
-webkit-transform: translateY(100%) rotateX(-90deg);
transform: translateY(100%) rotateX(-90deg);
}
}
@-webkit-keyframes rotateCubeBottomIn {
0% {
opacity: .3;
-webkit-transform: translateY(-100%) rotateX(90deg);
}
50% {
-webkit-animation-timing-function: ease-out;
-webkit-transform: translateY(-50%) translateZ(-200px) rotateX(45deg);
}
}
@keyframes rotateCubeBottomIn {
0% {
opacity: .3;
-webkit-transform: translateY(-100%) rotateX(90deg);
transform: translateY(-100%) rotateX(90deg);
}
50% {
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
-webkit-transform: translateY(-50%) translateZ(-200px) rotateX(45deg);
transform: translateY(-50%) translateZ(-200px) rotateX(45deg);
}
}
/* carousel */
@-webkit-keyframes rotateCarouselLeftOut {
to {
opacity: .3;
-webkit-transform: translateX(-150%) scale(0.4) rotateY(-65deg);
}
}
@keyframes rotateCarouselLeftOut {
to {
opacity: .3;
-webkit-transform: translateX(-150%) scale(0.4) rotateY(-65deg);
transform: translateX(-150%) scale(0.4) rotateY(-65deg);
}
}
@-webkit-keyframes rotateCarouselLeftIn {
from {
opacity: .3;
-webkit-transform: translateX(200%) scale(0.4) rotateY(65deg);
}
}
@keyframes rotateCarouselLeftIn {
from {
opacity: .3;
-webkit-transform: translateX(200%) scale(0.4) rotateY(65deg);
transform: translateX(200%) scale(0.4) rotateY(65deg);
}
}
@-webkit-keyframes rotateCarouselRightOut {
to {
opacity: .3;
-webkit-transform: translateX(200%) scale(0.4) rotateY(65deg);
}
}
@keyframes rotateCarouselRightOut {
to {
opacity: .3;
-webkit-transform: translateX(200%) scale(0.4) rotateY(65deg);
transform: translateX(200%) scale(0.4) rotateY(65deg);
}
}
@-webkit-keyframes rotateCarouselRightIn {
from {
opacity: .3;
-webkit-transform: translateX(-200%) scale(0.4) rotateY(-65deg);
}
}
@keyframes rotateCarouselRightIn {
from {
opacity: .3;
-webkit-transform: translateX(-200%) scale(0.4) rotateY(-65deg);
transform: translateX(-200%) scale(0.4) rotateY(-65deg);
}
}
@-webkit-keyframes rotateCarouselTopOut {
to {
opacity: .3;
-webkit-transform: translateY(-200%) scale(0.4) rotateX(65deg);
}
}
@keyframes rotateCarouselTopOut {
to {
opacity: .3;
-webkit-transform: translateY(-200%) scale(0.4) rotateX(65deg);
transform: translateY(-200%) scale(0.4) rotateX(65deg);
}
}
@-webkit-keyframes rotateCarouselTopIn {
from {
opacity: .3;
-webkit-transform: translateY(200%) scale(0.4) rotateX(-65deg);
}
}
@keyframes rotateCarouselTopIn {
from {
opacity: .3;
-webkit-transform: translateY(200%) scale(0.4) rotateX(-65deg);
transform: translateY(200%) scale(0.4) rotateX(-65deg);
}
}
@-webkit-keyframes rotateCarouselBottomOut {
to {
opacity: .3;
-webkit-transform: translateY(200%) scale(0.4) rotateX(-65deg);
}
}
@keyframes rotateCarouselBottomOut {
to {
opacity: .3;
-webkit-transform: translateY(200%) scale(0.4) rotateX(-65deg);
transform: translateY(200%) scale(0.4) rotateX(-65deg);
}
}
@-webkit-keyframes rotateCarouselBottomIn {
from {
opacity: .3;
-webkit-transform: translateY(-200%) scale(0.4) rotateX(65deg);
}
}
@keyframes rotateCarouselBottomIn {
from {
opacity: .3;
-webkit-transform: translateY(-200%) scale(0.4) rotateX(65deg);
transform: translateY(-200%) scale(0.4) rotateX(65deg);
}
}
/* sides */
@-webkit-keyframes rotateSidesOut {
to {
opacity: 0;
-webkit-transform: translateZ(-500px) rotateY(90deg);
}
}
@keyframes rotateSidesOut {
to {
opacity: 0;
-webkit-transform: translateZ(-500px) rotateY(90deg);
transform: translateZ(-500px) rotateY(90deg);
}
}
@-webkit-keyframes rotateSidesIn {
from {
opacity: 0;
-webkit-transform: translateZ(-500px) rotateY(-90deg);
}
}
@keyframes rotateSidesIn {
from {
opacity: 0;
-webkit-transform: translateZ(-500px) rotateY(-90deg);
transform: translateZ(-500px) rotateY(-90deg);
}
}
/* slide */
@-webkit-keyframes rotateSlideOut {
25% {
opacity: .5;
-webkit-transform: translateZ(-500px);
}
75% {
opacity: .5;
-webkit-transform: translateZ(-500px) translateX(-200%);
}
100% {
opacity: .5;
-webkit-transform: translateZ(-500px) translateX(-200%);
}
}
@keyframes rotateSlideOut {
25% {
opacity: .5;
-webkit-transform: translateZ(-500px);
transform: translateZ(-500px);
}
75% {
opacity: .5;
-webkit-transform: translateZ(-500px) translateX(-200%);
transform: translateZ(-500px) translateX(-200%);
}
100% {
opacity: .5;
-webkit-transform: translateZ(-500px) translateX(-200%);
transform: translateZ(-500px) translateX(-200%);
}
}
@-webkit-keyframes rotateSlideIn {
0%,
25% {
opacity: .5;
-webkit-transform: translateZ(-500px) translateX(200%);
}
75% {
opacity: .5;
-webkit-transform: translateZ(-500px);
}
100% {
opacity: 1;
-webkit-transform: translateZ(0) translateX(0);
}
}
@keyframes rotateSlideIn {
0%,
25% {
opacity: .5;
-webkit-transform: translateZ(-500px) translateX(200%);
transform: translateZ(-500px) translateX(200%);
}
75% {
opacity: .5;
-webkit-transform: translateZ(-500px);
transform: translateZ(-500px);
}
100% {
opacity: 1;
-webkit-transform: translateZ(0) translateX(0);
transform: translateZ(0) translateX(0);
}
}
/* animation delay classes */
.pt-page-delay100 {
-webkit-animation-delay: .1s;
animation-delay: .1s;
}
.pt-page-delay180 {
-webkit-animation-delay: .180s;
animation-delay: .180s;
}
.pt-page-delay200 {
-webkit-animation-delay: .2s;
animation-delay: .2s;
}
.pt-page-delay300 {
-webkit-animation-delay: .3s;
animation-delay: .3s;
}
.pt-page-delay400 {
-webkit-animation-delay: .4s;
animation-delay: .4s;
}
.pt-page-delay500 {
-webkit-animation-delay: .5s;
animation-delay: .5s;
}
.pt-page-delay700 {
-webkit-animation-delay: .7s;
animation-delay: .7s;
}
.pt-page-delay1000 {
-webkit-animation-delay: 1s;
animation-delay: 1s;
}
.cbutton {
position: relative;
overflow: visible;
-webkit-transition: color 0.7s;
transition: color 0.7s;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
.cbutton.cbutton--click,
.cbutton:focus {
outline: none;
}
.cbutton::after {
position: absolute;
top: 50%;
left: 50%;
margin: -25px 0 0 -25px;
width: 50px;
height: 50px;
border-radius: 50%;
content: '';
opacity: 0;
pointer-events: none;
}
/* Individual Effects */
/* Effect Boris */
@-webkit-keyframes anim-effect-boris {
0% {
-webkit-transform: scale3d(0.3, 0.3, 1);
transform: scale3d(0.3, 0.3, 1);
}
25%,
50% {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: scale3d(1.2, 1.2, 1);
transform: scale3d(1.2, 1.2, 1);
}
}
@keyframes anim-effect-boris {
0% {
-webkit-transform: scale3d(0.3, 0.3, 1);
transform: scale3d(0.3, 0.3, 1);
}
25%,
50% {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: scale3d(1.2, 1.2, 1);
transform: scale3d(1.2, 1.2, 1);
}
}
/* Jelena */
@-webkit-keyframes anim-effect-jelena {
0% {
opacity: 1;
-webkit-transform: scale3d(0.5, 0.5, 1);
transform: scale3d(0.5, 0.5, 1);
}
to {
opacity: 0;
-webkit-transform: scale3d(1.2, 1.2, 1);
transform: scale3d(1.2, 1.2, 1);
}
}
@keyframes anim-effect-jelena {
0% {
opacity: 1;
-webkit-transform: scale3d(0.5, 0.5, 1);
transform: scale3d(0.5, 0.5, 1);
}
to {
opacity: 0;
-webkit-transform: scale3d(1.2, 1.2, 1);
transform: scale3d(1.2, 1.2, 1);
}
}
/* Radomir */
@-webkit-keyframes anim-effect-radomir {
0% {
opacity: 1;
-webkit-transform: scale3d(0.4, 0.4, 1);
transform: scale3d(0.4, 0.4, 1);
}
80% {
box-shadow: inset 0 0 0 2px rgba(111, 148, 182, 0.8);
opacity: 0.1;
}
100% {
box-shadow: inset 0 0 0 2px rgba(111, 148, 182, 0.8);
opacity: 0;
-webkit-transform: scale3d(1.2, 1.2, 1);
transform: scale3d(1.2, 1.2, 1);
}
}
@keyframes anim-effect-radomir {
0% {
opacity: 1;
-webkit-transform: scale3d(0.4, 0.4, 1);
transform: scale3d(0.4, 0.4, 1);
}
80% {
box-shadow: inset 0 0 0 2px rgba(111, 148, 182, 0.8);
opacity: 0.1;
}
100% {
box-shadow: inset 0 0 0 2px rgba(111, 148, 182, 0.8);
opacity: 0;
-webkit-transform: scale3d(1.2, 1.2, 1);
transform: scale3d(1.2, 1.2, 1);
}
}
/* Sanja */
@-webkit-keyframes anim-effect-sanja {
0% {
opacity: 1;
-webkit-transform: scale3d(0.5, 0.5, 1);
transform: scale3d(0.5, 0.5, 1);
}
25% {
opacity: 1;
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
100% {
opacity: 0;
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@keyframes anim-effect-sanja {
0% {
opacity: 1;
-webkit-transform: scale3d(0.5, 0.5, 1);
transform: scale3d(0.5, 0.5, 1);
}
25% {
opacity: 1;
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
100% {
opacity: 0;
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
/* Novak */
@-webkit-keyframes anim-effect-novak {
0% {
opacity: 1;
-webkit-transform: scale3d(0.1, 0.1, 1);
transform: scale3d(0.1, 0.1, 1);
}
100% {
opacity: 0;
-webkit-transform: scale3d(8, 8, 1);
transform: scale3d(8, 8, 1);
}
}
@keyframes anim-effect-novak {
0% {
opacity: 1;
-webkit-transform: scale3d(0.1, 0.1, 1);
transform: scale3d(0.1, 0.1, 1);
}
100% {
opacity: 0;
-webkit-transform: scale3d(8, 8, 1);
transform: scale3d(8, 8, 1);
}
}
/* Ilinka */
@-webkit-keyframes anim-effect-ilinka {
0% {
opacity: 1;
}
100% {
opacity: 0;
}
}
@keyframes anim-effect-ilinka {
0% {
opacity: 1;
}
100% {
opacity: 0;
}
}
/* Marin */
@-webkit-keyframes anim-effect-marin {
0% {
opacity: 1;
}
100% {
box-shadow: inset 0 0 0 3px rgba(111, 148, 182, 0.8);
opacity: 0;
-webkit-transform: scale3d(0.75, 0.75, 1);
transform: scale3d(0.75, 0.75, 1);
}
}
@keyframes anim-effect-marin {
0% {
opacity: 1;
}
100% {
box-shadow: inset 0 0 0 3px rgba(111, 148, 182, 0.8);
opacity: 0;
-webkit-transform: scale3d(0.75, 0.75, 1);
transform: scale3d(0.75, 0.75, 1);
}
}
/* Nikola */
@-webkit-keyframes anim-effect-nikola {
0% {
opacity: 0;
-webkit-transform: scale3d(0.2, 0.2, 1);
transform: scale3d(0.2, 0.2, 1);
}
50% {
opacity: 1;
-webkit-transform: scale3d(1.2, 1.2, 1);
transform: scale3d(1.2, 1.2, 1);
}
100% {
opacity: 0;
-webkit-transform: scale3d(0.8, 0.8, 1);
transform: scale3d(0.8, 0.8, 1);
}
}
@keyframes anim-effect-nikola {
0% {
opacity: 0;
-webkit-transform: scale3d(0.2, 0.2, 1);
transform: scale3d(0.2, 0.2, 1);
}
50% {
opacity: 1;
-webkit-transform: scale3d(1.2, 1.2, 1);
transform: scale3d(1.2, 1.2, 1);
}
100% {
opacity: 0;
-webkit-transform: scale3d(0.8, 0.8, 1);
transform: scale3d(0.8, 0.8, 1);
}
}
/* Tamara */
@-webkit-keyframes anim-effect-tamara {
0% {
box-shadow: 0 0 0 3px rgba(111, 148, 182, 0.3);
opacity: 1;
-webkit-transform: scale3d(0.6, 0.6, 1);
transform: scale3d(0.6, 0.6, 1);
}
100% {
box-shadow: 0 0 0 100px rgba(111, 148, 182, 0);
opacity: 0;
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@keyframes anim-effect-tamara {
0% {
box-shadow: 0 0 0 3px rgba(111, 148, 182, 0.3);
opacity: 1;
-webkit-transform: scale3d(0.6, 0.6, 1);
transform: scale3d(0.6, 0.6, 1);
}
100% {
box-shadow: 0 0 0 100px rgba(111, 148, 182, 0);
opacity: 0;
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
/* Zoran */
@-webkit-keyframes anim-effect-zoran {
0% {
opacity: 0.2;
}
50% {
opacity: 1;
-webkit-transform: scale3d(0.6, 1, 1);
transform: scale3d(0.6, 1, 1);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
100% {
opacity: 0.3;
-webkit-transform: scale3d(1.1, 1.1, 1);
transform: scale3d(1.1, 1.1, 1);
}
}
@keyframes anim-effect-zoran {
0% {
opacity: 0.2;
}
50% {
opacity: 1;
-webkit-transform: scale3d(0.6, 1, 1);
transform: scale3d(0.6, 1, 1);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
100% {
opacity: 0.3;
-webkit-transform: scale3d(1.1, 1.1, 1);
transform: scale3d(1.1, 1.1, 1);
}
}
/* Ivana */
@-webkit-keyframes anim-effect-ivana-1 {
0% {
opacity: 1;
-webkit-transform: scale3d(0.5, 0.5, 1);
transform: scale3d(0.5, 0.5, 1);
}
100% {
opacity: 0;
-webkit-transform: scale3d(1.1, 1.1, 1);
transform: scale3d(1.1, 1.1, 1);
}
}
@keyframes anim-effect-ivana-1 {
0% {
opacity: 1;
-webkit-transform: scale3d(0.5, 0.5, 1);
transform: scale3d(0.5, 0.5, 1);
}
100% {
opacity: 0;
-webkit-transform: scale3d(1.1, 1.1, 1);
transform: scale3d(1.1, 1.1, 1);
}
}
@-webkit-keyframes anim-effect-ivana-2 {
0% {
opacity: 1;
-webkit-transform: scale3d(0.5, 0.5, 1);
transform: scale3d(0.5, 0.5, 1);
}
50%,
100% {
opacity: 0;
-webkit-transform: scale3d(1.2, 1.2, 1);
transform: scale3d(1.2, 1.2, 1);
}
}
@keyframes anim-effect-ivana-2 {
0% {
opacity: 1;
-webkit-transform: scale3d(0.5, 0.5, 1);
transform: scale3d(0.5, 0.5, 1);
}
50%,
100% {
opacity: 0;
-webkit-transform: scale3d(1.2, 1.2, 1);
transform: scale3d(1.2, 1.2, 1);
}
}
/* Marko */
@-webkit-keyframes anim-effect-marko {
0% {
opacity: 1;
}
50% {
box-shadow: inset 0 0 0 35px rgba(111, 148, 182, 0.1);
opacity: 1;
}
100% {
box-shadow: inset 0 0 0 35px rgba(111, 148, 182, 0.1);
opacity: 0;
-webkit-transform: scale3d(1.1, 1.1, 1);
transform: scale3d(1.1, 1.1, 1);
}
}
@keyframes anim-effect-marko {
0% {
opacity: 1;
}
50% {
box-shadow: inset 0 0 0 35px rgba(111, 148, 182, 0.1);
opacity: 1;
}
100% {
box-shadow: inset 0 0 0 35px rgba(111, 148, 182, 0.1);
opacity: 0;
-webkit-transform: scale3d(1.1, 1.1, 1);
transform: scale3d(1.1, 1.1, 1);
}
}
/* Stoja */
@-webkit-keyframes anim-effect-stoja-1 {
0% {
opacity: 1;
-webkit-transform: scale3d(0.3, 0.3, 1);
transform: scale3d(0.3, 0.3, 1);
}
100% {
opacity: 0;
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@keyframes anim-effect-stoja-1 {
0% {
opacity: 1;
-webkit-transform: scale3d(0.3, 0.3, 1);
transform: scale3d(0.3, 0.3, 1);
}
100% {
opacity: 0;
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@-webkit-keyframes anim-effect-stoja-2 {
0% {
opacity: 1;
-webkit-transform: scale3d(0.5, 0.5, 1);
transform: scale3d(0.5, 0.5, 1);
}
100% {
opacity: 0;
-webkit-transform: scale3d(1.5, 1.5, 1);
transform: scale3d(1.5, 1.5, 1);
}
}
@keyframes anim-effect-stoja-2 {
0% {
opacity: 1;
-webkit-transform: scale3d(0.5, 0.5, 1);
transform: scale3d(0.5, 0.5, 1);
}
100% {
opacity: 0;
-webkit-transform: scale3d(1.5, 1.5, 1);
transform: scale3d(1.5, 1.5, 1);
}
}
/* Azra */
@-webkit-keyframes anim-effect-azra {
0% {
opacity: 0;
-webkit-transform: scale3d(0.2, 0.2, 1) translate3d(0, 100%, 0);
transform: scale3d(0.2, 0.2, 1) translate3d(0, 100%, 0);
}
50% {
opacity: 0.7;
-webkit-transform: scale3d(0.5, 0.5, 1) translate3d(0, 100%, 0);
transform: scale3d(0.5, 0.5, 1) translate3d(0, 100%, 0);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
100% {
opacity: 0;
-webkit-transform: scale3d(0.5, 0.5, 1) translate3d(0, 200%, 0);
transform: scale3d(0.5, 0.5, 1) translate3d(0, 200%, 0);
}
}
@keyframes anim-effect-azra {
0% {
opacity: 0.5;
-webkit-transform: scale3d(0.2, 0.2, 1) translate3d(0, 100%, 0);
transform: scale3d(0.2, 0.2, 1) translate3d(0, 100%, 0);
}
100% {
opacity: 0;
-webkit-transform: scale3d(0.5, 0.5, 1) translate3d(0, 200%, 0);
transform: scale3d(0.5, 0.5, 1) translate3d(0, 200%, 0);
}
}
/* Dejan */
@-webkit-keyframes anim-effect-dejan-1 {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: rotate3d(0, 0, 1, -90deg);
transform: rotate3d(0, 0, 1, -90deg);
}
}
@keyframes anim-effect-dejan-1 {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: rotate3d(0, 0, 1, -90deg);
transform: rotate3d(0, 0, 1, -90deg);
}
}
@-webkit-keyframes anim-effect-dejan-2 {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: rotate3d(0, 0, 1, 90deg);
transform: rotate3d(0, 0, 1, 90deg);
}
}
@keyframes anim-effect-dejan-2 {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: rotate3d(0, 0, 1, 90deg);
transform: rotate3d(0, 0, 1, 90deg);
}
}
@-webkit-keyframes anim-effect-dejan-3 {
0% {
-webkit-transform: scale3d(0.4, 0.4, 1);
transform: scale3d(0.4, 0.4, 1);
}
50% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
100% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@keyframes anim-effect-dejan-3 {
0% {
-webkit-transform: scale3d(0.4, 0.4, 1);
transform: scale3d(0.4, 0.4, 1);
}
50% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
100% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@-webkit-keyframes anim-effect-dejan-4 {
0% {
opacity: 1;
-webkit-transform: scale3d(0.1, 0.1, 1);
transform: scale3d(0.1, 0.1, 1);
}
80% {
opacity: 0.7;
-webkit-transform: translate3d(0, -70px, 0) scale3d(1, 1, 1);
transform: translate3d(0, -70px, 0) scale3d(1, 1, 1);
}
100% {
opacity: 0;
-webkit-transform: translate3d(0, -60px, 0) scale3d(1, 1, 1);
transform: translate3d(0, -60px, 0) scale3d(1, 1, 1);
}
}
@keyframes anim-effect-dejan-4 {
0% {
opacity: 1;
-webkit-transform: scale3d(0.1, 0.1, 1);
transform: scale3d(0.1, 0.1, 1);
}
80% {
opacity: 0.7;
-webkit-transform: translate3d(0, -70px, 0) scale3d(1, 1, 1);
transform: translate3d(0, -70px, 0) scale3d(1, 1, 1);
}
100% {
opacity: 0;
-webkit-transform: translate3d(0, -60px, 0) scale3d(1, 1, 1);
transform: translate3d(0, -60px, 0) scale3d(1, 1, 1);
}
}
/* Filipa */
@-webkit-keyframes anim-effect-filipa-left {
0% {
opacity: 0.7;
-webkit-transform: scale3d(0.2, 0.2, 1);
transform: scale3d(0.2, 0.2, 1);
}
100% {
opacity: 0;
-webkit-transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, -135deg);
transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, -135deg);
}
}
@keyframes anim-effect-filipa-left {
0% {
opacity: 0.7;
-webkit-transform: scale3d(0.2, 0.2, 1);
transform: scale3d(0.2, 0.2, 1);
}
100% {
opacity: 0;
-webkit-transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, -135deg);
transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, -135deg);
}
}
@-webkit-keyframes anim-effect-filipa-right {
0% {
opacity: 0.7;
-webkit-transform: scale3d(0.2, 0.2, 1);
transform: scale3d(0.2, 0.2, 1);
}
100% {
opacity: 0;
-webkit-transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, 135deg);
transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, 135deg);
}
}
@keyframes anim-effect-filipa-right {
0% {
opacity: 0.7;
-webkit-transform: scale3d(0.2, 0.2, 1);
transform: scale3d(0.2, 0.2, 1);
}
100% {
opacity: 0;
-webkit-transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, 135deg);
transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, 135deg);
}
}
/* Lazar */
@-webkit-keyframes anim-effect-lazar-1 {
0%,
25% {
opacity: 1;
-webkit-transform: perspective(1000px) rotate3d(0, 1, 0, 0deg);
transform: perspective(1000px) rotate3d(0, 1, 0, 0deg);
}
100% {
opacity: 0;
-webkit-transform: perspective(1000px) rotate3d(0, 1, 0, 180deg);
transform: perspective(1000px) rotate3d(0, 1, 0, 180deg);
}
}
@keyframes anim-effect-lazar-1 {
0%,
25% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: perspective(1000px) rotate3d(0, 1, 0, 180deg);
transform: perspective(1000px) rotate3d(0, 1, 0, 180deg);
}
}
@-webkit-keyframes anim-effect-lazar-2 {
0% {
opacity: 1;
}
100% {
opacity: 0;
}
}
@keyframes anim-effect-lazar-2 {
0% {
opacity: 1;
}
100% {
opacity: 0;
}
}
/* Jagoda */
@-webkit-keyframes anim-effect-jagoda-1 {
0%,
100% {
opacity: 0;
}
40%,
60% {
opacity: 1;
}
}
@keyframes anim-effect-jagoda-1 {
0%,
100% {
opacity: 0;
}
40%,
60% {
opacity: 1;
}
}
@-webkit-keyframes anim-effect-jagoda-2 {
0% {
-webkit-transform: scale3d(0.5, 0.5, 1);
transform: scale3d(0.5, 0.5, 1);
}
100% {
-webkit-transform: scale3d(1.4, 1.4, 1);
transform: scale3d(1.4, 1.4, 1);
}
}
@keyframes anim-effect-jagoda-2 {
0% {
-webkit-transform: scale3d(0.5, 0.5, 1);
transform: scale3d(0.5, 0.5, 1);
}
100% {
-webkit-transform: scale3d(1.4, 1.4, 1);
transform: scale3d(1.4, 1.4, 1);
}
}
/* Simo */
@-webkit-keyframes anim-effect-simo-1 {
0%,
100% {
-webkit-transform: scale3d(0, 0, 1);
transform: scale3d(0, 0, 1);
opacity: 0;
}
5%,
95% {
opacity: 1;
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@keyframes anim-effect-simo-1 {
0%,
100% {
-webkit-transform: scale3d(0, 0, 1);
transform: scale3d(0, 0, 1);
opacity: 0;
}
5%,
95% {
opacity: 1;
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@-webkit-keyframes anim-effect-simo-2 {
0%,
5%,
95%,
100% {
opacity: 0;
}
10%,
90% {
opacity: 1;
}
}
@keyframes anim-effect-simo-2 {
0%,
5%,
95%,
100% {
opacity: 0;
}
10%,
90% {
opacity: 1;
}
}
@-webkit-keyframes anim-effect-simo-3 {
100% {
-webkit-transform: rotate3d(0, 0, 1, 360deg);
transform: rotate3d(0, 0, 1, 360deg);
}
}
@keyframes anim-effect-simo-3 {
100% {
-webkit-transform: rotate3d(0, 0, 1, 360deg);
transform: rotate3d(0, 0, 1, 360deg);
}
}
/* Milan */
@-webkit-keyframes anim-effect-milan-1 {
0% {
-webkit-transform: perspective(1000px) rotate3d(1, 1, 1, 0deg);
transform: perspective(1000px) rotate3d(1, 1, 1, 0deg);
}
100% {
-webkit-transform: perspective(1000px) rotate3d(1, 1, 1, 360deg);
transform: perspective(1000px) rotate3d(1, 1, 1, 360deg);
}
}
@keyframes anim-effect-milan-1 {
0% {
-webkit-transform: perspective(1000px) rotate3d(1, 1, 1, 0deg);
transform: perspective(1000px) rotate3d(1, 1, 1, 0deg);
}
100% {
-webkit-transform: perspective(1000px) rotate3d(1, 1, 1, 360deg);
transform: perspective(1000px) rotate3d(1, 1, 1, 360deg);
}
}
@-webkit-keyframes anim-effect-milan-2 {
0% {
-webkit-transform: perspective(1000px) rotate3d(-1, -1, -1, 0deg);
transform: perspective(1000px) rotate3d(-1, -1, -1, 0deg);
}
100% {
-webkit-transform: perspective(1000px) rotate3d(-1, -1, -1, 360deg);
transform: perspective(1000px) rotate3d(-1, -1, -1, 360deg);
}
}
@keyframes anim-effect-milan-2 {
0% {
-webkit-transform: perspective(1000px) rotate3d(1, -1, 1, 0deg);
transform: perspective(1000px) rotate3d(1, -1, 1, 0deg);
}
100% {
-webkit-transform: perspective(1000px) rotate3d(1, -1, 1, 360deg);
transform: perspective(1000px) rotate3d(1, -1, 1, 360deg);
}
}
@-webkit-keyframes anim-effect-milan-3 {
0%,
100% {
opacity: 0;
}
25%,
75% {
opacity: 1;
}
}
@keyframes anim-effect-milan-3 {
0%,
100% {
opacity: 0;
}
25%,
75% {
opacity: 1;
}
}
/* Zorka */
@-webkit-keyframes anim-effect-zorka-1 {
0% {
opacity: 0.1;
}
50% {
opacity: 0.175;
}
100% {
opacity: 0;
}
}
@keyframes anim-effect-zorka-1 {
0% {
opacity: 0.1;
}
50% {
opacity: 0.175;
}
100% {
opacity: 0;
}
}
@-webkit-keyframes anim-effect-zorka-2 {
100% {
-webkit-transform: translate3d(40px, 0, 0) scale3d(0.8, 0.8, 1);
transform: translate3d(40px, 0, 0) scale3d(0.8, 0.8, 1);
}
}
@keyframes anim-effect-zorka-2 {
100% {
-webkit-transform: translate3d(40px, 0, 0) scale3d(0.8, 0.8, 1);
transform: translate3d(40px, 0, 0) scale3d(0.8, 0.8, 1);
}
}
@-webkit-keyframes anim-effect-zorka-3 {
100% {
-webkit-transform: translate3d(-40px, 0, 0) scale3d(0.8, 0.8, 1);
transform: translate3d(-40px, 0, 0) scale3d(0.8, 0.8, 1);
}
}
@keyframes anim-effect-zorka-3 {
100% {
-webkit-transform: translate3d(-40px, 0, 0) scale3d(0.8, 0.8, 1);
transform: translate3d(-40px, 0, 0) scale3d(0.8, 0.8, 1);
}
}
/* Stana */
@-webkit-keyframes anim-effect-stana {
0%,
100% {
opacity: 1;
}
50% {
opacity: 0.3;
-webkit-animation-timing: ease-out;
animation-timing: ease-out;
}
}
@keyframes anim-effect-stana {
0%,
100% {
opacity: 1;
}
50% {
opacity: 0.3;
-webkit-animation-timing: ease-out;
animation-timing: ease-out;
}
}
html {
background: #008bcc;
/* Old browsers */
}
html.admin {
background: #ba3232;
/* Old browsers */
}
html.admin body {
background: #a00200;
/* Old browsers */
background: -moz-linear-gradient(top, #a00200 0%, #ba3232 100%);
/* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #a00200), color-stop(100%, #ba3232));
/* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #a00200 0%, #ba3232 100%);
/* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #a00200 0%, #ba3232 100%);
/* Opera 11.10+ */
background: -ms-linear-gradient(top, #a00200 0%, #ba3232 100%);
/* IE10+ */
background: linear-gradient(to bottom, #a00200 0%, #ba3232 100%);
/* W3C */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#a00200', endColorstr='#ba3232', GradientType=0);
/* IE6-9 */
}
html.admin body #left-column #nav li a:hover,
html.admin body #left-column #nav li a.open,
html.admin body #left-column #nav li a.open + ol,
html.admin body #left-column #nav li a.selected,
html.admin body #left-column #nav li a.selected + ol {
background-color: #7A0000;
}
html.admin body #left-column #nav li a.selected {
border-color: #ff1a00;
}
body {
background: #006baa;
/* Old browsers */
background: -moz-linear-gradient(top, #006baa 0%, #008bcc 100%);
/* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #006baa), color-stop(100%, #008bcc));
/* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #006baa 0%, #008bcc 100%);
/* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #006baa 0%, #008bcc 100%);
/* Opera 11.10+ */
background: -ms-linear-gradient(top, #006baa 0%, #008bcc 100%);
/* IE10+ */
background: linear-gradient(to bottom, #006baa 0%, #008bcc 100%);
/* W3C */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#006baa', endColorstr='#008bcc', GradientType=0);
/* IE6-9 */
color: #fff;
padding: 0px 15px !important;
font-family: 'Open Sans', 'Helvetica Neue', Helvetica, sans-serif;
/* BEGIN BASIC STYLE CLASSES */
/* END BASIC STYLE CLASSES */
/* BEGIN UTILITY CLASSES */
/* END UTILITY CLASSES */
/* BEGIN VENDOR CLASSES */
/* BEGIN TABLESORTER */
/* END TABLESORTER */
/* BEGIN ANGULAR */
/* END ANGULAR */
/* BEGIN NOUISLIDER */
/* END NOUISLIDER */
/* BEGIN CSS TOGGLE SWITCH */
/* END CSS TOGGLE SWITCH */
/* END VENDOR CLASSES */
}
body #wrapper {
position: relative;
}
body #logo a {
display: inline-block;
font-size: 1.5em;
letter-spacing: 0.5em;
font-family: 'Montserrat Bold', 'Helvetica Neue', Helvetica, sans-serif !important;
color: #fff;
text-transform: uppercase;
}
body #logo a small {
font-family: 'Montserrat', 'Helvetica Neue', Helvetica, sans-serif !important;
font-size: .6em;
display: block;
letter-spacing: .4em;
}
body #vm-logo {
font-size: 1.5em;
letter-spacing: 0.5em;
color: #272650;
font-family: 'Montserrat Bold', 'Helvetica Neue', Helvetica, sans-serif;
}
body #header-bar a {
color: #272650;
font-family: 'Open Sans Bold', 'Helvetica Neue', Helvetica, sans-serif;
}
body #header-bar a:hover {
color: #00aeff;
}
body #header-bar #logo a {
margin: 10px 0px;
text-transform: uppercase;
}
body #header-bar #logo a:hover {
color: #272650;
}
body #header-bar #breadcrumb {
padding-top: 15px;
}
body #header-bar #aux-nav {
padding-top: 15px;
}
body #header-bar #aux-nav li {
display: inline-block;
padding-left: 10px;
}
@media (max-width: 991px) {
body #header-bar #header-nav .nav > li > a {
padding-left: 5px;
padding-right: 5px;
}
}
@media (max-width: 767px) {
body #header-bar .navbar-toggle {
background-color: #999999;
float: right;
}
body #header-bar .navbar-toggle .icon-bar {
background-color: #ffffff;
}
body #header-bar .nav > li > a {
color: #272650 !important;
}
body #header-bar .nav > li:hover {
background-color: #666666;
}
body #header-bar .nav > li:hover > a {
color: #fff !important;
}
}
body #left-column #logo a {
margin-top: 20px;
}
body #left-column #nav {
margin: 15px -15px 0px -15px;
}
body #left-column #nav li {
margin-top: 0px;
}
body #left-column #nav li .glyphicon,
body #left-column #nav li i.fa {
font-size: 1.6em;
float: left;
margin-right: 5px;
}
body #left-column #nav li .top-level-text {
float: left;
margin-top: 3px;
margin-left: 5px;
}
body #left-column #nav li a {
color: #fff;
font-family: 'Open Sans', 'Helvetica Neue', Helvetica, sans-serif;
position: relative;
padding: 15px 20px;
/*&.selected,
&.selected + ol {
&:after {
width: 0;
height: 0;
border-top: 10px solid transparent;
border-bottom: 10px solid transparent;
border-right:10px solid #fff;
position: absolute;
right: 0px;
top: 14px;
content: '';
}
}*/
}
body #left-column #nav li a:hover,
body #left-column #nav li a.open,
body #left-column #nav li a.open + ol,
body #left-column #nav li a.selected,
body #left-column #nav li a.selected + ol {
background-color: #015C8C;
}
body #left-column #nav li a:hover,
body #left-column #nav li a.selected {
color: #fff;
}
body #left-column #nav li a:active {
color: #aaa;
}
body #left-column #nav li a + ol li a {
padding-left: 50px;
border-top: none;
}
body #left-column #nav li a.selected {
border-left: 5px solid #00aeff;
padding-left: 15px;
}
body #left-column #nav li a.open + ol li a.selected {
padding-left: 45px !important;
}
body #content {
background-color: #fefefe;
color: #333;
padding: 1em 2em;
position: relative;
min-height: 500px;
padding-bottom: 100px;
-webkit-border-bottom-left-radius: 4px;
-moz-border-radius-bottomleft: 4px;
border-bottom-left-radius: 4px;
-moz-background-clip: padding;
-webkit-background-clip: padding-box;
background-clip: padding-box;
}
body #content .page-header {
position: relative;
margin-top: 10px;
}
body #content .page-header h1 {
text-transform: uppercase;
font-size: 1.6em;
}
body #content .page-header .aux-page-header-content {
position: absolute;
right: 0px;
bottom: 20px;
}
body #content .page-header .aux-page-header-content .exam-state {
text-transform: uppercase;
}
body #content .base-loading-message {
position: absolute;
top: 0px;
left: 0px;
width: 100%;
padding-top: 240px;
z-index: 9999;
}
body #content .panel-loading-message {
padding: 30px 0px;
}
body #content .fade-in {
display: block;
opacity: 0;
-webkit-transition: opacity 0.25s ease-in;
-moz-transition: opacity 0.25s ease-in;
-o-transition: opacity 0.25s ease-in;
-ms-transition: opacity 0.25s ease-in;
transition: opacity 0.25s ease-in;
}
body #content .fade-in.in {
opacity: 1;
}
body #content .paginated-elm.loading {
opacity: .3;
}
body footer {
font-size: .85em;
color: #333;
border-top: 1px solid #f5f5f5;
padding-top: 30px;
margin-top: 30px;
position: absolute;
bottom: 20px;
width: 95%;
}
body.simple #content,
body.no-sidebar #content {
margin: 0px -15px;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
border-radius: 0px;
-moz-background-clip: padding;
-webkit-background-clip: padding-box;
background-clip: padding-box;
}
body.simple #content .page-header,
body.no-sidebar #content .page-header {
margin-top: 36px;
}
body.simple #header-bar #aux-nav {
color: #272650;
}
body.simple #header-bar #aux-nav a {
color: #272650;
}
body.simple #header-bar #aux-nav a:hover {
color: #00aeff;
}
body.no-sidebar #header-bar #logo a {
color: #fff;
}
body.no-sidebar #header-bar #logo a small {
display: inline;
margin-left: -10px;
}
body.no-sidebar #header-bar #aux-nav {
color: #fff;
}
body.no-sidebar #header-bar #aux-nav a {
color: #fff;
}
body.no-sidebar #header-bar #aux-nav a:hover {
color: #00aeff;
}
body h1,
body h2,
body h3,
body h4 {
font-family: 'Open Sans Semi-Bold', 'Helvetica Neue', Helvetica, sans-serif;
}
body h1.bold,
body h2.bold,
body h3.bold,
body h4.bold {
font-family: 'Open Sans Semi-Bold', 'Helvetica Neue', Helvetica, sans-serif;
}
body h1.light,
body h2.light,
body h3.light,
body h4.light {
font-family: 'Open Sans', 'Helvetica Neue', Helvetica, sans-serif;
}
body h1.label,
body h2.label,
body h3.label,
body h4.label {
color: #ccc;
text-transform: uppercase;
font-size: .85em;
display: block;
padding: 0px;
text-align: left;
}
body h1.no-top-margin,
body h2.no-top-margin,
body h3.no-top-margin,
body h4.no-top-margin {
margin-top: 0px !important;
}
body h1 {
font-size: 2em;
}
body h2 {
font-size: 1.6em;
}
body h3 {
font-size: 1.2em;
}
body h4 {
font-size: 1em;
}
body a {
/*color: #00a2ff;*/
color: #006cab;
-webkit-transition: all 0.2s ease-in;
-moz-transition: all 0.2s ease-in;
-o-transition: all 0.2s ease-in;
-ms-transition: all 0.2s ease-in;
transition: all 0.2s ease-in;
}
body a:hover {
/*color: #00C4FF;*/
color: #00aeff;
text-decoration: none;
}
body a[disabled] {
pointer-events: none;
color: #ccc !important;
}
body strong {
font-family: 'Open Sans Bold', 'Helvetica Neue', Helvetica, sans-serif;
font-weight: bold;
}
body input[readonly="readonly"] {
background-color: #fff !important;
cursor: text !important;
}
body table thead tr th {
text-transform: uppercase;
}
body #lytmus-js-exception {
z-index: 99999;
}
body .modal {
color: #333;
}
body .score-stars {
font-size: 1.2em;
}
body .score-stars.success {
color: #3ac52b;
}
body .score-stars.warning {
color: #f59524;
}
body .score-stars.danger {
color: #ff3f57;
}
body ul.skills li,
body ul.technologies li {
padding: 2px 0px;
}
body ul.skills li .glyphicon,
body ul.technologies li .glyphicon {
font-size: 1.4em;
}
body ul.skills li .glyphicon.success,
body ul.technologies li .glyphicon.success {
color: #3ac52b;
}
body ul.skills li .glyphicon.danger,
body ul.technologies li .glyphicon.danger {
color: #ff3f57;
}
body .no-bullets {
list-style-type: none;
}
body .display-none {
display: none !important;
}
body .score-bar .score-number {
font-size: .85em;
float: left;
padding-left: 1em;
color: #fff;
font-weight: bold;
}
body .bottom-shadow {
-webkit-box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.4);
-moz-box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.4);
box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.4);
}
body .top-shadow {
-webkit-box-shadow: 0px -2px 4px 0px rgba(0, 0, 0, 0.4);
-moz-box-shadow: 0px -2px 4px 0px rgba(0, 0, 0, 0.4);
box-shadow: 0px -2px 4px 0px rgba(0, 0, 0, 0.4);
}
body .circle {
border-radius: 50%;
width: 50px;
height: 50px;
background-color: #fff;
}
body .video-container {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
height: 0;
overflow: hidden;
}
body .video-container iframe,
body .video-container object,
body .video-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
body .arrow-up {
width: 0;
height: 0;
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-bottom: 5px solid #222;
}
body .arrow-down {
width: 0;
height: 0;
border-left: 20px solid transparent;
border-right: 20px solid transparent;
border-top: 20px solid #222;
}
body .arrow-right {
width: 0;
height: 0;
border-top: 60px solid transparent;
border-bottom: 60px solid transparent;
border-left: 60px solid #222;
}
body .arrow-left {
width: 0;
height: 0;
border-top: 10px solid transparent;
border-bottom: 10px solid transparent;
border-right: 10px solid #222;
}
body .dnd-list li {
padding: 4px;
cursor: pointer;
}
body .dnd-list li .hover-link {
display: none;
margin-left: 1em;
}
body .dnd-list li:hover {
background-color: #f5fafc;
}
body .dnd-list li:hover .hover-link {
display: inline-block;
}
body .dnd-list li.dragging {
background-color: #428bca;
min-width: 300px;
z-index: 99;
}
body .dnd-list-container .panel-heading .controls {
padding-top: 20px;
}
body .dnd-list-container .panel-heading .controls a {
margin-left: 1em;
}
body .dnd-list-container .panel-heading .controls a:nth-child(1) {
margin-left: 0px;
}
body .dnd-list-container .panel-body {
padding: 6px 12px !important;
height: 240px;
font-size: 14px;
overflow-x: visible;
overflow-y: auto;
}
body .movement-hint {
font-size: 4em;
padding-top: 1.8em;
}
body .dnd-dropbox .empty-message {
display: none;
padding-top: 4em;
color: #888;
}
body .dnd-dropbox .empty-message .glyphicon {
font-size: 3em;
}
body .dnd-dropbox.empty .empty-message {
display: block;
}
body .dnd-dropbox.empty .dnd-list {
display: none;
}
body .capitalize {
text-transform: capitalize;
}
body .glyphicon-none:before {
content: "\2122";
color: transparent !important;
}
body .panel-list li {
padding: 4px;
}
body .animated {
-webkit-animation-duration: 2s;
-moz-animation-duration: 2s;
animation-duration: 2s;
}
body .profile-completeness .complete-profile-cta {
margin-top: 5px;
}
body .profile-completeness.profile-completeness-mini .progress {
display: inline-block;
min-width: 150px;
margin: 5px;
}
body .angucomplete-dropdown {
position: absolute;
z-index: 99;
background-color: #fff;
min-width: 300px;
border: 1px solid #eee;
overflow-y: auto;
max-height: 200px;
}
body .angucomplete-dropdown .angucomplete-searching {
margin-top: 5px;
padding: 5px 10px;
}
body .angucomplete-dropdown .angucomplete-row {
cursor: pointer;
padding: 5px 10px;
}
body .angucomplete-dropdown .angucomplete-selected-row {
background-color: #eee;
}
body .note {
color: #999;
}
body .lytmus-technologies-list li,
body .lytmus-skills-list li {
width: 48%;
margin-top: 10px;
}
body .lytmus-technologies-list li:nth-child(odd),
body .lytmus-skills-list li:nth-child(odd) {
margin-right: 1%;
}
body .lytmus-technologies-list li:nth-child(even),
body .lytmus-skills-list li:nth-child(even) {
margin-left: 1%;
}
body .lytmus-technologies-list li:nth-child(-n+2),
body .lytmus-skills-list li:nth-child(-n+2) {
margin-top: 0px;
}
body .lytmus-technologies-list li .label {
width: 100%;
padding: 10px;
display: block;
font-size: 1.1em;
}
body .lytmus-skills-list li {
min-height: 38px;
}
body .lytmus-skills-list li .glyphicon {
width: 8%;
display: block;
}
body .lytmus-skills-list li .skill-name {
width: 85%;
display: block;
}
body .lytmus-graph {
display: block;
width: 100%;
}
body .lytmus-graph svg .scrubberText {
font-size: 12px;
}
body .lytmus-graph svg .tick {
font-size: 12px;
fill: #999999;
}
body .lytmus-graph svg .tick .highlight {
font-weight: bold;
fill: #00aeff;
-webkit-transition: all 0.5s ease-in;
-moz-transition: all 0.5s ease-in;
-o-transition: all 0.5s ease-in;
-ms-transition: all 0.5s ease-in;
transition: all 0.5s ease-in;
}
body .lytmus-graph svg .content .columnGroup rect {
stroke: #999 !important;
}
body .lytmus-graph svg .content .columnGroup rect.highlight {
fill: #00aeff !important;
stroke: #00aeff !important;
-webkit-transition: all 0.5s ease-in;
-moz-transition: all 0.5s ease-in;
-o-transition: all 0.5s ease-in;
-ms-transition: all 0.5s ease-in;
transition: all 0.5s ease-in;
}
body .lytmus-graph svg path.domain {
stroke: #999 !important;
}
body .lytmus-graph .graph-title {
padding-top: 10px;
padding-left: 10%;
}
body .lytmus-graph .legend {
padding: 3px 0px 0px 30px;
}
body .lytmus-graph .legend .legend-item {
margin-left: 15px;
}
body .lytmus-graph .legend .legend-item:nth-child(1) {
margin-left: 0px;
}
body .lytmus-graph .legend .legend-item i {
color: #999;
margin-right: 2px;
}
body .lytmus-graph .legend .legend-item i.candidate-color {
color: #00aeff;
}
body .lytmus-graph .active-filters .filter {
margin-left: 5px;
}
body .lytmus-graph .filter-errors {
padding-top: 20px;
}
body .lytmus-graph .axis-label-container {
position: relative;
}
body .lytmus-graph .axis-label {
font-size: 1.2em;
color: #888;
}
body .lytmus-graph .axis-label.x-axis-label {
position: absolute;
margin-top: -25px;
}
body .lytmus-graph .axis-label.y-axis-label {
transform: rotate(-90deg);
transform-origin: left top 0;
float: left;
position: absolute;
margin-left: 15px;
}
body .lytmus-graph .chart {
padding-left: 40px;
}
body table.features-table {
border-top: 1px dotted #ccc;
border-bottom: 1px dotted #ccc;
}
body table.features-table thead tr th {
font-family: 'Open Sans Bold', 'Helvetica Neue', Helvetica, sans-serif;
font-weight: bold;
font-size: 1.3em;
}
body table.features-table thead tr th i.fa-star {
color: gold;
margin-right: 5px;
animation-duration: 2s;
animation-delay: 0s;
animation-iteration-count: 1;
}
body table.features-table thead tr th .recommended-star,
body table.features-table thead tr th .recommended-label {
display: none;
}
body table.features-table thead tr th.recommended .recommended-star,
body table.features-table thead tr th.recommended .recommended-label {
display: inline-block;
}
body table.features-table tbody tr td:nth-child(1) {
color: #888;
}
body table.features-table th,
body table.features-table td {
padding: 20px;
vertical-align: top;
border-left: 1px dotted #ccc;
/*&:nth-child(2) {
border-left: 1px dotted #ccc;
background-color: #008bcc;
color: #fff;
font-weight: bold;
}*/
}
body table.features-table th:nth-child(1),
body table.features-table td:nth-child(1) {
border-left: none;
}
body .video-wrapper {
position: relative;
padding-bottom: 56.25%;
/* 16:9 */
padding-top: 25px;
height: 0;
}
body .video-wrapper iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
body table.tablesorter thead tr .header,
body table.sortable thead tr .header {
background-image: url(https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/vendor/tablesorter/themes/blue/bg.gif);
background-repeat: no-repeat;
background-position: center right;
cursor: pointer;
}
body table.tablesorter thead tr .headerSortUp,
body table.sortable thead tr .headerSortUp,
body table.tablesorter thead tr .header-sort-up,
body table.sortable thead tr .header-sort-up {
background-image: url(https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/vendor/tablesorter/themes/blue/asc.gif);
}
body table.tablesorter thead tr .headerSortDown,
body table.sortable thead tr .headerSortDown,
body table.tablesorter thead tr .header-sort-down,
body table.sortable thead tr .header-sort-down {
background-image: url(https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/vendor/tablesorter/themes/blue/desc.gif);
}
body [ng\:cloak],
body [ng-cloak],
body .ng-cloak {
display: none !important;
}
body .noUi-base {
height: 12px;
-moz-box-shadow: 0 1px 4px #111111 inset;
-webkit-box-shadow: 0 1px 4px #111111 inset;
box-shadow: 0 1px 4px #111111 inset;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
-moz-background-clip: padding;
-webkit-background-clip: padding-box;
background-clip: padding-box;
}
body .noUi-background {
background-color: #333;
}
body .noUi-origin {
background-color: #36A9E1;
}
body .noUi-handle {
-webkit-border-radius: 16px;
-moz-border-radius: 16px;
border-radius: 16px;
-moz-background-clip: padding;
-webkit-background-clip: padding-box;
background-clip: padding-box;
border: 1px solid #666666;
width: 16px;
height: 16px;
top: -2px;
left: -8px;
cursor: pointer;
z-index: 3;
}
body .switch-toggle {
margin-bottom: 0px !important;
}
body .switch-toggle label {
margin-bottom: 0px;
}
body .switch-toggle label.selected {
color: #fff;
}
/* BEGIN RESPONSIVE */
@media (max-width: 767px) {
body {
font-size: 12px;
}
}
@media (min-width: 768px) {
body {
font-size: 12px;
}
}
@media (min-width: 992px) {
body {
font-size: 13px;
}
}
@media (min-width: 1200px) {
body {
font-size: 13px;
}
}
html {
background-color: #fff;
}
body {
background: #fff;
padding: 0px !important;
color: #333;
overflow-x: hidden;
}
body h1.no-top-margin,
body h2.no-top-margin,
body h3.no-top-margin,
body h4.no-top-margin {
margin-top: 0px;
}
body a:hover {
text-decoration: none;
}
body.front #header-bar {
background-color: #f5f5f5;
}
body.front #header-bar .navbar {
border-radius: 0px;
margin-bottom: 0px;
}
body.front #header-bar .navbar .navbar-nav li a {
background-color: transparent !important;
}
body.front #header-bar .navbar #logo a {
margin: 0px;
padding-left: 0px;
}
body.front.showcases-landing #content section#hero {
background: url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/img/pages/front/home/hero.png') bottom center no-repeat;
background-color: #e5e5e5;
}
body.front.showcases-landing #content section#wat {
background: url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/img/pages/front/home/desk.png') bottom center no-repeat;
padding-bottom: 500px;
}
body.front.showcases-landing #content section#wat h3 {
margin: 40px 0px;
}
body.front.showcases-landing #content section#wat .items {
margin-top: 80px;
}
body.front.showcases-landing #content section#wat .items .item .img-container {
min-height: 80px;
}
body.front.showcases-landing #content section#student-or-experienced {
background-color: #00aeff;
color: #fff;
padding: 60px 0px;
}
body.front.showcases-landing #content section#student-or-experienced h3 {
font-size: 1.8em;
}
body.front.showcases-landing #content section#student-or-experienced .img-container {
margin: 30px 0px;
min-height: 72px;
}
body.front.showcases-landing #content section#student-or-experienced .description {
font-size: 1.1em;
min-height: 60px;
}
body.front.showcases-landing #content section#student-or-experienced .cta {
margin-top: 30px;
}
body.front.showcases-landing #content section#why-how-who {
border-bottom: none;
}
body.front.showcases-landing #content section#why-how-who .description {
font-size: 1.4em;
}
body.front.recruiter-landing #header-bar,
body.front.recruiter-technology #header-bar {
background-color: #222;
}
body.front.recruiter-landing #header-bar .navbar a,
body.front.recruiter-technology #header-bar .navbar a {
color: #fff !important;
}
body.front.recruiter-landing #header-bar .navbar a:hover,
body.front.recruiter-technology #header-bar .navbar a:hover {
color: #01affe !important;
}
body.front.recruiter-landing #header-bar .navbar #header-nav li.dropdown ul.dropdown-menu a,
body.front.recruiter-technology #header-bar .navbar #header-nav li.dropdown ul.dropdown-menu a {
color: #272650 !important;
}
body.front.recruiter-landing #header-bar .navbar.navbar-inverse,
body.front.recruiter-technology #header-bar .navbar.navbar-inverse {
border: none;
}
body.front #content {
padding: initial;
}
body.front #content #hero {
min-height: 150px;
border-radius: 0px;
border-top: 1px solid #eee;
border-bottom: 1px solid #eee;
}
body.front #content section {
padding: 30px 0px;
border-bottom: 1px solid #eee;
}
body.front #content section h1 {
font-size: 2.8em;
font-weight: normal !important;
}
body.front #content section h2 {
font-size: 2.4em;
font-weight: normal !important;
}
body.front #content section h3 {
font-size: 1.5em;
}
body.front #content section .signup-cta {
margin-top: 20px;
}
body.front #content section a.learn-more {
font-weight: bold;
}
body.front #content section.image-content-grid {
padding-top: 0px;
}
body.front #content section.image-content-grid .img-container {
padding-left: 0px;
padding-right: 0px;
}
body.front #content section.image-content-grid .img-container img {
width: 100%;
}
body.front #content section.image-content-grid .text-content {
padding: 50px;
}
body.front footer {
position: relative;
}
body.front.about h1,
body.front.careers h1,
body.front.recruiter-landing h1,
body.front.showcases-landing h1,
body.front.about h2,
body.front.careers h2,
body.front.recruiter-landing h2,
body.front.showcases-landing h2,
body.front.about h3,
body.front.careers h3,
body.front.recruiter-landing h3,
body.front.showcases-landing h3,
body.front.about h4,
body.front.careers h4,
body.front.recruiter-landing h4,
body.front.showcases-landing h4 {
font-family: 'Open Sans', 'Helvetica Neue', Helvetica, sans-serif;
}
body.front.about #content .big-green-check,
body.front.careers #content .big-green-check,
body.front.recruiter-landing #content .big-green-check,
body.front.showcases-landing #content .big-green-check {
font-size: 5em;
}
body.front.about #content section#hero,
body.front.careers #content section#hero,
body.front.recruiter-landing #content section#hero,
body.front.showcases-landing #content section#hero {
min-height: 550px;
}
body.front.about #content section#hero h2,
body.front.careers #content section#hero h2,
body.front.recruiter-landing #content section#hero h2,
body.front.showcases-landing #content section#hero h2 {
font-size: 1.5em;
}
body.front.about #content section#hero p,
body.front.careers #content section#hero p,
body.front.recruiter-landing #content section#hero p,
body.front.showcases-landing #content section#hero p {
font-size: 1.2em;
margin: 60px 0px;
}
body.front.about #content section#customers,
body.front.careers #content section#customers,
body.front.recruiter-landing #content section#customers,
body.front.showcases-landing #content section#customers {
padding-bottom: 50px;
}
body.front.about #content section#customers img,
body.front.careers #content section#customers img,
body.front.recruiter-landing #content section#customers img,
body.front.showcases-landing #content section#customers img {
padding-top: 20px;
padding-bottom: 20px;
}
body.front.about #content section h2,
body.front.careers #content section h2,
body.front.showcases-landing #content section h2 {
margin: 40px 0px;
font-size: 2.1em;
}
body.front.about #content section .description,
body.front.careers #content section .description,
body.front.showcases-landing #content section .description {
font-size: 1.1em;
}
body.front.about #content section#hero,
body.front.careers #content section#hero,
body.front.showcases-landing #content section#hero {
color: #444;
}
body.front.about #content section#hero h1,
body.front.careers #content section#hero h1,
body.front.showcases-landing #content section#hero h1 {
margin-top: 40px;
}
body.front.about #content section#hero h2,
body.front.careers #content section#hero h2,
body.front.showcases-landing #content section#hero h2 {
margin-top: 30px;
color: #444;
}
body.front.about #content section#hero,
body.front.careers #content section#hero,
body.front.faq #content section#hero {
min-height: 200px;
background: url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/img/pages/front/home/desk.png') top center no-repeat;
background-size: 85%;
}
body.front.about #content section#hero h1,
body.front.careers #content section#hero h1,
body.front.faq #content section#hero h1 {
margin-top: 0px;
}
body.front.about #content section {
border-bottom: 1px solid #eee;
}
body.front.about #content section#page-header {
background-color: #ffffff;
}
body.front.about #content section#about {
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f5f5f5+0,f5f5f5+100 */
background: #ffffff;
/* Old browsers */
background: -moz-linear-gradient(top, #ffffff 0%, #f5f5f5 100%);
/* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(100%, #f5f5f5));
/* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #ffffff 0%, #f5f5f5 100%);
/* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #ffffff 0%, #f5f5f5 100%);
/* Opera 11.10+ */
background: -ms-linear-gradient(top, #ffffff 0%, #f5f5f5 100%);
/* IE10+ */
background: linear-gradient(to bottom, #ffffff 0%, #f5f5f5 100%);
/* W3C */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f5f5f5', GradientType=0);
/* IE6-9 */
}
body.front.about #content section#team {
padding-bottom: 0px;
}
body.front.about #content section#join-us h2 {
display: inline-block;
margin: 0px;
font-size: 1.6em;
margin-right: 30px;
}
body.front.about #content section#investors {
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f5f5f5+0,ffffff+100 */
background: #f5f5f5;
/* Old browsers */
background: -moz-linear-gradient(top, #f5f5f5 0%, #ffffff 100%);
/* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f5f5f5), color-stop(100%, #ffffff));
/* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #f5f5f5 0%, #ffffff 100%);
/* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #f5f5f5 0%, #ffffff 100%);
/* Opera 11.10+ */
background: -ms-linear-gradient(top, #f5f5f5 0%, #ffffff 100%);
/* IE10+ */
background: linear-gradient(to bottom, #f5f5f5 0%, #ffffff 100%);
/* W3C */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f5f5f5', endColorstr='#ffffff', GradientType=0);
/* IE6-9 */
}
body.front.about #content section#investors {
border-bottom: none;
}
body.front.about #content .social-logos {
font-size: 2em;
}
body.front.about #content .social-logos li {
margin-left: 10px;
}
body.front.about #content .social-logos li a {
color: #333;
}
body.front.about #content .social-logos li a:hover {
color: #00aeff;
}
body.front.about #content .company-summary p {
font-size: 1.3em;
}
@media only screen and (max-width: 991px) {
body.front.about #content .contact-us h2 {
padding-top: 30px !important;
}
}
body.front.about #content .investor img {
margin: 0 auto;
margin-bottom: 5px;
display: inline-block;
background-color: #fff;
}
body.front.about #content .investor img.pad {
padding: 10px;
}
body.front.about #content #roulette {
padding: 0px !important;
position: relative;
}
body.front.about #content #roulette .roulette-navigation a {
display: inline-block;
width: 30%;
}
body.front.about #content #roulette .roulette-navigation a img {
border: 8px solid #ccc;
opacity: .7;
}
body.front.about #content #roulette .roulette-navigation a img.img-color {
display: none;
}
body.front.about #content #roulette .roulette-navigation a img.img-bw {
display: block;
}
body.front.about #content #roulette .roulette-navigation a:hover img,
body.front.about #content #roulette .roulette-navigation a.active img {
border: 8px #aaa solid;
opacity: 1;
}
body.front.about #content #roulette .roulette-navigation a:hover img.img-color,
body.front.about #content #roulette .roulette-navigation a.active img.img-color {
display: block;
}
body.front.about #content #roulette .roulette-navigation a:hover img.img-bw,
body.front.about #content #roulette .roulette-navigation a.active img.img-bw {
display: none;
}
body.front.about #content #roulette .team-member .roulette-copy {
padding-top: 15px;
}
body.front.about #content #roulette .team-member .roulette-copy h3 .title {
font-size: .6em;
font-weight: normal;
color: #999;
}
body.front.about #content #roulette .team-member .roulette-copy .motivation {
padding-top: 8px;
font-size: 1.2em;
color: #666;
}
body.front.about #content #roulette .team-member .roulette-copy .motivation .fa-quote-left {
margin-right: 3px;
}
body.front.about #content #roulette .team-member .roulette-copy .motivation .fa-quote-right {
margin-left: 3px;
}
body.front.about #content #roulette .team-member .roulette-copy .trivia-item {
font-size: .95em;
padding-top: 8px;
}
body.front.about #content #roulette .team-member.out {
display: none;
}
body.front.about #content #roulette .team-member.in .roulette-image img {
-webkit-animation: enterPerson 0.3s ease-out both;
animation: enterPerson 0.3s ease-out both;
}
body.front.about #content #roulette .team-member.in .roulette-copy {
-webkit-animation: enterCopy 1s ease-in both;
animation: enterCopy 1s ease-in both;
}
@-webkit-keyframes enterPerson {
from {
opacity: 0;
-webkit-transform: translateX(-15%);
}
}
@keyframes enterPerson {
from {
opacity: 0;
-webkit-transform: translateX(-15%);
transform: translateX(-15%);
}
}
@-webkit-keyframes enterCopy {
from {
opacity: 0;
}
}
@keyframes enterCopy {
from {
opacity: 0;
}
}
@media (max-width: 1199px) {
body.front.about #content #roulette .team-member .roulette-copy {
font-size: .95em ;
}
}
@media (max-width: 991px) {
body.front.about #content #roulette .roulette-navigation a {
width: 10%;
}
body.front.about #content #roulette .team-member .roulette-copy {
padding-left: 30px;
padding-bottom: 30px;
}
}
body.front.careers #content .jobs-list-nav {
margin-top: 70px;
}
body.front.careers #content .apply-cta {
padding: 0px 15px;
}
body.front.careers #content section h2 {
color: #00aeff;
margin: 40px 0px 5px 0px;
font-size: 2.1em;
}
body.front.careers #content .job .location {
margin: 5px 0px 20px 0px;
}
body.front.careers #content .job section {
border-bottom: none;
}
body.front.recruiter-landing #content section h3 {
color: #0069d2;
}
body.front.recruiter-landing #content section#hero {
background: url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/img/pages/front/recruiter_landing/hero-image.png') bottom center no-repeat;
background-color: #2b2b2b;
color: #fff;
border-color: #2b2b2b;
}
body.front.recruiter-landing #content section#why .item {
padding-top: 30px;
padding-bottom: 30px;
}
body.front.recruiter-landing #content section#why .item h3 {
padding: 15px 0px 15px 65px;
}
body.front.recruiter-landing #content section#why .item h3.reach {
background: url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/img/pages/front/recruiter_landing/why/increasedreach.png') top left no-repeat;
}
body.front.recruiter-landing #content section#why .item h3.pool {
background: url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/img/pages/front/recruiter_landing/why/qualified.png') top left no-repeat;
}
body.front.recruiter-landing #content section#why .item h3.match {
background: url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/img/pages/front/recruiter_landing/why/findthebest.png') top left no-repeat;
}
body.front.recruiter-landing #content section#why .item h3.quicker {
background: url('https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/img/pages/front/recruiter_landing/why/hirequicker.png') top left no-repeat;
}
body.front.recruiter-landing #content section#pay-per-hire {
background-color: #17bd80;
color: #fff;
font-size: 1.4em;
}
body.front.recruiter-landing #content section#how .item {
padding: 25px;
}
body.front.recruiter-landing #content section#how .item h3 {
min-height: 50px;
}
body.front.recruiter-landing #content section#how .item .description {
padding: 0px 20px;
}
body.front.recruiter-landing #content section#testimonials .masonry {
padding-top: 40px;
width: 940px;
margin: 0 auto;
}
body.front.recruiter-landing #content section#testimonials .masonry .item {
margin-bottom: 20px;
}
body.front.recruiter-landing #content section#testimonials .masonry .item.type-1 {
width: 600px;
}
body.front.recruiter-landing #content section#testimonials .masonry .item.type-2 {
width: 300px;
}
body.front.recruiter-landing #content section#testimonials .masonry .item.testimonial {
padding: 30px;
background-color: #333;
color: #fff;
}
body.front.recruiter-landing #content section#testimonials .masonry .item.testimonial .quote {
font-size: 1.4em;
}
body.front.recruiter-landing #content section#testimonials .masonry .item.testimonial .attribution {
margin-top: 20px;
font-size: .85em;
color: #999;
text-transform: uppercase;
}
body.front.recruiter-landing #content section#faq {
border-bottom: none;
}
body.front.recruiter-landing #content section#faq .item {
padding: 30px 0px;
}
body.front.recruiter-landing #content section#faq .item h3 {
font-size: 1.2em;
min-height: 40px;
}
body.front.recruiter-technology #content section {
border-bottom: 0px solid #eee;
}
body.front.recruiter-technology #content section ul {
list-style: none;
}
body.front.recruiter-technology #content section ul li {
line-height: 2em;
padding-left: 40px;
margin-bottom: 5px;
background: url(https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/img/pages/front/recruiter_landing/technology/BulletPointBlue-Icon.png) left top no-repeat;
}
body.front.recruiter-technology #content section#section-test-environment {
background: url(https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/img/pages/front/recruiter_landing/technology/TestEnvironment-BG.png) no-repeat center center;
color: white;
}
body.front.recruiter-technology #content section#section-test-environment ul li {
background: url(https://dkl28feairf3r.cloudfront.net/releases/c37d06dfa0191a9019bb21d7bee03fb6385f1a3a/web/img/pages/front/recruiter_landing/technology/BulletPointWhite-Icon.png) left top no-repeat;
}
body.front.recruiter-technology #content section#section-online-demo {
background: #fbfcfc;
margin-bottom: -10px;
border-top: 1px solid #e0e0e0;
}
body.front.recruiter-technology #content section#testimonials {
background: #effafe;
margin-top: -30px;
}
body.front.recruiter-technology #content section#testimonials .masonry {
padding-top: 40px;
width: 940px;
margin: 0 auto;
}
body.front.recruiter-technology #content section#testimonials .masonry .item {
margin-bottom: 20px;
}
body.front.recruiter-technology #content section#testimonials .masonry .item.type-1 {
width: 600px;
}
body.front.recruiter-technology #content section#testimonials .masonry .item.type-2 {
width: 300px;
}
body.front.recruiter-technology #content section#testimonials .masonry .item.testimonial {
padding: 30px;
background-color: #333;
color: #fff;
}
body.front.recruiter-technology #content section#testimonials .masonry .item.testimonial .image img {
width: 150px;
height: 150px;
border-radius: 75px;
}
body.front.recruiter-technology #content section#testimonials .masonry .item.testimonial .quote {
font-size: 1.4em;
}
body.front.recruiter-technology #content section#testimonials .masonry .item.testimonial .attribution {
margin-top: 20px;
font-size: .85em;
color: #999;
text-transform: uppercase;
}