fuckyourday/wildflat/css/style2.css

988 lines
23 KiB
CSS
Raw Permalink Normal View History

2024-03-24 20:08:23 -05:00
@font-face {
font-family: 'nexa_boldregular';
src: url('../fonts/Nexa_Free_Bold-webfont.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'rochesterregular';
src: url('../fonts/Rochester-Regular-webfont.eot');
src: url('../fonts/Rochester-Regular-webfont.eot?#iefix') format('embedded-opentype'),
url('../fonts/Rochester-Regular-webfont.woff') format('woff'),
url('../fonts/Rochester-Regular-webfont.ttf') format('truetype'),
url('../fonts/Rochester-Regular-webfont.svg#rochesterregular') format('svg');
font-weight: normal;
font-style: normal;
}
.da-slider{
width: 100%;
min-height:664px;
position: relative;
overflow: hidden;
background:url(../images/slider-bg.jpg);
background-size: 100% 100%;
-webkit-transition: background-position 1s ease-out 0.3s;
-moz-transition: background-position 1s ease-out 0.3s;
-o-transition: background-position 1s ease-out 0.3s;
-ms-transition: background-position 1s ease-out 0.3s;
transition: background-position 1s ease-out 0.3s;
text-align:center;
}
.da-slide label span{
width: 192px;
height: 192px;
background: url(../images/slide-logo.png) no-repeat 0px 0px;
display: block;
margin: 6em auto 1em;
}
.da-slide i a{
width:25px;
height:39px;
display:inline-block;
background: url(../images/slide-icon.png) no-repeat 0px 0px;
}
.da-slide small a{
color: #B6B0B0;
font-family: 'rochesterregular';
font-size: 1.3em;
margin-top: 0.3em;
display: block;
font-style: italic;
transition:0.5s all;
-webkit-transition:0.5s all;
-moz-transition:0.5s all;
-o-transition:0.5s all;
}
.da-slide small a:hover{
color:#40A6CF;
}
.da-slide{
position: absolute;
width: 100%;
height: 100%;
top: 0px;
left: 0px;
font-family: 'Open Sans', sans-serif;
text-align: left;
}
.da-slide-current{
z-index: 1000;
}
.da-slider-fb .da-slide{
left: 100%;
}
.da-slider-fb .da-slide.da-slide-current{
left: 0px;
}
.da-slider-fb .da-slide h2,
.da-slider-fb .da-slide p,
.da-slider-fb .da-slide .da-link{
opacity: 1;
}
.da-slider-fb .da-slide .da-img{
left: 60%;
opacity: 1;
}
.da-slide h2{
color: #FFFFFF;
width: 100%;
top: 50%;
white-space: nowrap;
z-index: 10;
text-shadow: 1px 1px 1px rgba(0,0,0,0.1);
font: 300 2em/48px 'nexa_boldregular';
text-align: center;
letter-spacing: 0.1em;
margin: 1.5em 0 0.2em;
}
.da-slide i,.da-slide small{
text-align: center;
width: 100%;
margin: 0 auto;
display: block;
}
.da-slide p{
top: 60%;
color: #FFFFFF;
font-size: 2em;
height: 80px;
overflow: hidden;
font-family: 'Open Sans', sans-serif;
font-weight: 100;
line-height: 29px;
text-align: center;
margin: 0 auto;
width: 100%;
}
.da-img{
display:none;
}
.da-slide .da-img{
text-align: center;
width: 30%;
top: 51px;
height: 256px;
line-height: 320px;
left: 110%; /*60%*/
}
.da-slide .da-link{
top: 300px; /*depends on p height*/
box-shadow: 0px 1px 1px rgba(0,0,0,0.1);
font-family: 'Open Sans', sans-serif;
-moz-box-shadow:inset 0px 1px 0px 0px #cae3fc;
-webkit-box-shadow:inset 0px 1px 0px 0px #cae3fc;
box-shadow:inset 0px 1px 0px 0px #cae3fc;
background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #79bbff), color-stop(1, #71b5d5) );
background:-moz-linear-gradient( center top, #79bbff 5%, #71b5d5 100% );
background-color:#79bbff;
-webkit-border-top-left-radius:9px;
-moz-border-radius-topleft:9px;
border-top-left-radius:9px;
-webkit-border-top-right-radius:9px;
-moz-border-radius-topright:9px;
border-top-right-radius:9px;
-webkit-border-bottom-right-radius:9px;
-moz-border-radius-bottomright:9px;
border-bottom-right-radius:9px;
-webkit-border-bottom-left-radius:9px;
-moz-border-radius-bottomleft:9px;
border-bottom-left-radius:9px;
text-indent:0px;
border:1px solid #71b5d5;
display:inline-block;
color:#ffffff;
font-size:1em;
text-transform:uppercase;
font-weight:normal;
font-style:normal;
height:45px;
line-height:49px;
width:152px;
text-decoration:none;
text-align:center;
text-shadow:1px 0px 0px #7bb7d1;
margin-left: 32%;
}
.da-link:hover{
background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #71b5d5), color-stop(1, #79bbff) );
background:-moz-linear-gradient( center top, #71b5d5 5%, #79bbff 100% );
background-color:#71b5d5;
}
.da-dots{
width: 100%;
position: absolute;
text-align: center;
left: 0px;
bottom: 53px;
z-index: 2000;
-moz-user-select: none;
-webkit-user-select: none;
background: url(../images/dotts-bg.png) no-repeat center;
}
.da-dots span{
display: inline-block;
position: relative;
width: 8px;
height: 11px;
background: url(../images/slide-dotts.png) no-repeat -29px 1px;
margin:0px 0.8em;
cursor: pointer;
}
.da-dots span.da-dots-current:after{
content: '';
width: 8px;
height: 11px;
position: absolute;
top: 0.5px;
left: 0.49px;
background: url(../images/slide-dotts.png) no-repeat 0px 0px;
display: inline-block;
}
.da-arrows{
-moz-user-select: none;
-webkit-user-select: none;
}
.da-arrows span{
position: absolute;
top: 40%;
cursor: pointer;
z-index: 2000;
opacity: 1;
height: 61px;
width: 21px;
-webkit-transition: opacity 0.4s ease-in-out-out 0.2s;
-moz-transition: opacity 0.4s ease-in-out-out 0.2s;
-o-transition: opacity 0.4s ease-in-out-out 0.2s;
-ms-transition: opacity 0.4s ease-in-out-out 0.2s;
transition: opacity 0.4s ease-in-out-out 0.2s;
}
.da-arrows-prev{
background: url(../images/slider-icons.png) no-repeat 0px 0px;
}
.da-arrows-next{
background: url(../images/slider-icons.png) no-repeat -20px 0px;
}
.da-slider:hover .da-arrows span{
opacity: 1;
}
.da-arrows span:after{
}
.da-arrows span:hover:after{
box-shadow: 1px 1px 4px rgba(0,0,0,0.3);
}
.da-arrows span:active:after{
box-shadow: 1px 1px 1px rgba(255,255,255,0.1);
}
.da-arrows span.da-arrows-next:after{
background-position: top right;
}
.da-arrows span.da-arrows-prev{
left: 20%;
}
.da-arrows span.da-arrows-next{
right:20%;
}
.da-slide-current h2,
.da-slide-current p,
.da-slide-current .da-link{
left: 10%;
opacity: 1;
}
.da-slide-current .da-img{
left: 60%;
opacity: 1;
}
/* Animation classes and animations */
/* Slide in from the right*/
.da-slide-fromright h2{
-webkit-animation: fromRightAnim1 0.6s ease-in-out 0.8s both;
-moz-animation: fromRightAnim1 0.6s ease-in-out 0.8s both;
-o-animation: fromRightAnim1 0.6s ease-in-out 0.8s both;
-ms-animation: fromRightAnim1 0.6s ease-in-out 0.8s both;
animation: fromRightAnim1 0.6s ease-in-out 0.8s both;
}
.da-slide-fromright p{
-webkit-animation: fromRightAnim2 0.6s ease-in-out 0.8s both;
-moz-animation: fromRightAnim2 0.6s ease-in-out 0.8s both;
-o-animation: fromRightAnim2 0.6s ease-in-out 0.8s both;
-ms-animation: fromRightAnim2 0.6s ease-in-out 0.8s both;
animation: fromRightAnim2 0.6s ease-in-out 0.8s both;
}
.da-slide-fromright .da-link{
-webkit-animation: fromRightAnim3 0.4s ease-in-out 1.2s both;
-moz-animation: fromRightAnim3 0.4s ease-in-out 1.2s both;
-o-animation: fromRightAnim3 0.4s ease-in-out 1.2s both;
-ms-animation: fromRightAnim3 0.4s ease-in-out 1.2s both;
animation: fromRightAnim3 0.4s ease-in-out 1.2s both;
}
.da-slide-fromright .da-img{
-webkit-animation: fromRightAnim4 0.6s ease-in-out 0.8s both;
-moz-animation: fromRightAnim4 0.6s ease-in-out 0.8s both;
-o-animation: fromRightAnim4 0.6s ease-in-out 0.8s both;
-ms-animation: fromRightAnim4 0.6s ease-in-out 0.8s both;
animation: fromRightAnim4 0.6s ease-in-out 0.8s both;
}
@-webkit-keyframes fromRightAnim1{
0%{ left: 110%; opacity: 1; }
100%{ left: 10%; opacity: 1; }
}
@-webkit-keyframes fromRightAnim2{
0%{ left: 110%; opacity: 1; }
100%{ left: 10%; opacity: 1; }
}
@-webkit-keyframes fromRightAnim3{
0%{ left: 110%; opacity: 1; }
1%{ left: 10%; opacity: 1; }
100%{ left: 10%; opacity: 1; }
}
@-webkit-keyframes fromRightAnim4{
0%{ left: 110%; opacity: 1; }
100%{ left: 60%; opacity: 1; }
}
@-moz-keyframes fromRightAnim1{
0%{ left: 110%; opacity: 1; }
100%{ left: 10%; opacity: 1; }
}
@-moz-keyframes fromRightAnim2{
0%{ left: 110%; opacity: 1; }
100%{ left: 10%; opacity: 1; }
}
@-moz-keyframes fromRightAnim3{
0%{ left: 110%; opacity: 1; }
1%{ left: 10%; opacity: 1; }
100%{ left: 10%; opacity: 1; }
}
@-moz-keyframes fromRightAnim4{
0%{ left: 110%; opacity: 1; }
100%{ left: 60%; opacity: 1; }
}
@-o-keyframes fromRightAnim1{
0%{ left: 110%; opacity: 1; }
100%{ left: 10%; opacity: 1; }
}
@-o-keyframes fromRightAnim2{
0%{ left: 110%; opacity: 1; }
100%{ left: 10%; opacity: 1; }
}
@-o-keyframes fromRightAnim3{
0%{ left: 110%; opacity: 1; }
1%{ left: 10%; opacity: 1; }
100%{ left: 10%; opacity: 1; }
}
@-o-keyframes fromRightAnim4{
0%{ left: 110%; opacity: 1; }
100%{ left: 60%; opacity: 1; }
}
@-ms-keyframes fromRightAnim1{
0%{ left: 110%; opacity: 1; }
100%{ left: 10%; opacity: 1; }
}
@-ms-keyframes fromRightAnim2{
0%{ left: 110%; opacity: 1; }
100%{ left: 10%; opacity: 1; }
}
@-ms-keyframes fromRightAnim3{
0%{ left: 110%; opacity: 1; }
1%{ left: 10%; opacity: 1; }
100%{ left: 10%; opacity: 1; }
}
@-ms-keyframes fromRightAnim4{
0%{ left: 110%; opacity: 1; }
100%{ left: 60%; opacity: 1; }
}
@keyframes fromRightAnim1{
0%{ left: 110%; opacity: 1; }
100%{ left: 10%; opacity: 1; }
}
@keyframes fromRightAnim2{
0%{ left: 110%; opacity: 1; }
100%{ left: 10%; opacity: 1; }
}
@keyframes fromRightAnim3{
0%{ left: 110%; opacity: 1; }
1%{ left: 10%; opacity: 1; }
100%{ left: 10%; opacity: 1; }
}
@keyframes fromRightAnim4{
0%{ left: 110%; opacity: 1; }
100%{ left: 60%; opacity: 1; }
}
/* Slide in from the left*/
.da-slide-fromleft h2{
-webkit-animation: fromLeftAnim1 0.6s ease-in-out 0.6s both;
-moz-animation: fromLeftAnim1 0.6s ease-in-out 0.6s both;
-o-animation: fromLeftAnim1 0.6s ease-in-out 0.6s both;
-ms-animation: fromLeftAnim1 0.6s ease-in-out 0.6s both;
animation: fromLeftAnim1 0.6s ease-in-out 0.6s both;
}
.da-slide-fromleft p{
-webkit-animation: fromLeftAnim2 0.6s ease-in-out 0.6s both;
-moz-animation: fromLeftAnim2 0.6s ease-in-out 0.6s both;
-o-animation: fromLeftAnim2 0.6s ease-in-out 0.6s both;
-ms-animation: fromLeftAnim2 0.6s ease-in-out 0.6s both;
animation: fromLeftAnim2 0.6s ease-in-out 0.6s both;
}
.da-slide-fromleft .da-link{
-webkit-animation: fromLeftAnim3 0.4s ease-in-out 1.2s both;
-moz-animation: fromLeftAnim3 0.4s ease-in-out 1.2s both;
-o-animation: fromLeftAnim3 0.4s ease-in-out 1.2s both;
-ms-animation: fromLeftAnim3 0.4s ease-in-out 1.2s both;
animation: fromLeftAnim3 0.4s ease-in-out 1.2s both;
}
.da-slide-fromleft .da-img{
-webkit-animation: fromLeftAnim4 0.6s ease-in-out 0.6s both;
-moz-animation: fromLeftAnim4 0.6s ease-in-out 0.6s both;
-o-animation: fromLeftAnim4 0.6s ease-in-out 0.6s both;
-ms-animation: fromLeftAnim4 0.6s ease-in-out 0.6s both;
animation: fromLeftAnim4 0.6s ease-in-out 0.6s both;
}
@-webkit-keyframes fromLeftAnim1{
0%{ left: -110%; opacity: 1; }
100%{ left: 10%; opacity: 1; }
}
@-webkit-keyframes fromLeftAnim2{
0%{ left: -110%; opacity: 1; }
100%{ left: 10%; opacity: 1; }
}
@-webkit-keyframes fromLeftAnim3{
0%{ left: -110%; opacity: 1; }
1%{ left: 10%; opacity: 1; }
100%{ left: 10%; opacity: 1; }
}
@-webkit-keyframes fromLeftAnim4{
0%{ left: -110%; opacity: 1; }
100%{ left: 60%; opacity: 1; }
}
@-moz-keyframes fromLeftAnim1{
0%{ left: -110%; opacity: 1; }
100%{ left: 10%; opacity: 1; }
}
@-moz-keyframes fromLeftAnim2{
0%{ left: -110%; opacity: 1; }
100%{ left: 10%; opacity: 1; }
}
@-moz-keyframes fromLeftAnim3{
0%{ left: -110%; opacity: 1; }
1%{ left: 10%; opacity: 1; }
100%{ left: 10%; opacity: 1; }
}
@-moz-keyframes fromLeftAnim4{
0%{ left: -110%; opacity: 1; }
100%{ left: 60%; opacity: 1; }
}
@-o-keyframes fromLeftAnim1{
0%{ left: -110%; opacity: 1; }
100%{ left: 10%; opacity: 1; }
}
@-o-keyframes fromLeftAnim2{
0%{ left: -110%; opacity: 1; }
100%{ left: 10%; opacity: 1; }
}
@-o-keyframes fromLeftAnim3{
0%{ left: -110%; opacity: 1; }
1%{ left: 10%; opacity: 1; }
100%{ left: 10%; opacity: 1; }
}
@-o-keyframes fromLeftAnim4{
0%{ left: -110%; opacity: 1; }
100%{ left: 60%; opacity: 1; }
}
@-ms-keyframes fromLeftAnim1{
0%{ left: -110%; opacity: 1; }
100%{ left: 10%; opacity: 1; }
}
@-ms-keyframes fromLeftAnim2{
0%{ left: -110%; opacity: 1; }
100%{ left: 10%; opacity: 1; }
}
@-ms-keyframes fromLeftAnim3{
0%{ left: -110%; opacity: 1; }
1%{ left: 10%; opacity: 1; }
100%{ left: 10%; opacity: 1; }
}
@-ms-keyframes fromLeftAnim4{
0%{ left: -110%; opacity: 1; }
100%{ left: 60%; opacity: 1; }
}
@keyframes fromLeftAnim1{
0%{ left: -110%; opacity: 1; }
100%{ left: 10%; opacity: 1; }
}
@keyframes fromLeftAnim2{
0%{ left: -110%; opacity: 1; }
100%{ left: 10%; opacity: 1; }
}
@keyframes fromLeftAnim3{
0%{ left: -110%; opacity: 1; }
1%{ left: 10%; opacity: 1; }
100%{ left: 10%; opacity: 1; }
}
@keyframes fromLeftAnim4{
0%{ left: -110%; opacity: 1; }
100%{ left: 60%; opacity: 1; }
}
/* Slide out to the right */
.da-slide-toright h2{
-webkit-animation: toRightAnim1 0.6s ease-in-out 0.6s both;
-moz-animation: toRightAnim1 0.6s ease-in-out 0.6s both;
-o-animation: toRightAnim1 0.6s ease-in-out 0.6s both;
-ms-animation: toRightAnim1 0.6s ease-in-out 0.6s both;
animation: toRightAnim1 0.6s ease-in-out 0.6s both;
}
.da-slide-toright p{
-webkit-animation: toRightAnim2 0.6s ease-in-out 0.3s both;
-moz-animation: toRightAnim2 0.6s ease-in-out 0.3s both;
-o-animation: toRightAnim2 0.6s ease-in-out 0.3s both;
-ms-animation: toRightAnim2 0.6s ease-in-out 0.3s both;
animation: toRightAnim2 0.6s ease-in-out 0.3s both;
}
.da-slide-toright .da-link{
-webkit-animation: toRightAnim3 0.4s ease-in-out both;
-moz-animation: toRightAnim3 0.4s ease-in-out both;
-o-animation: toRightAnim3 0.4s ease-in-out both;
-ms-animation: toRightAnim3 0.4s ease-in-out both;
animation: toRightAnim3 0.4s ease-in-out both;
}
.da-slide-toright .da-img{
-webkit-animation: toRightAnim4 0.6s ease-in-out both;
-moz-animation: toRightAnim4 0.6s ease-in-out both;
-o-animation: toRightAnim4 0.6s ease-in-out both;
-ms-animation: toRightAnim4 0.6s ease-in-out both;
animation: toRightAnim4 0.6s ease-in-out both;
}
@-webkit-keyframes toRightAnim1{
0%{ left: 10%; opacity: 1; }
100%{ left: 100%; opacity: 1; }
}
@-webkit-keyframes toRightAnim2{
0%{ left: 10%; opacity: 1; }
100%{ left: 100%; opacity: 1; }
}
@-webkit-keyframes toRightAnim3{
0%{ left: 10%; opacity: 1; }
99%{ left: 10%; opacity: 1; }
100%{ left: 100%; opacity: 1; }
}
@-webkit-keyframes toRightAnim4{
0%{ left: 60%; opacity: 1; }
30%{ left: 55%; opacity: 1; }
100%{ left: 100%; opacity: 1; }
}
@-moz-keyframes toRightAnim1{
0%{ left: 10%; opacity: 1; }
100%{ left: 100%; opacity: 1; }
}
@-moz-keyframes toRightAnim2{
0%{ left: 10%; opacity: 1; }
100%{ left: 100%; opacity: 1; }
}
@-moz-keyframes toRightAnim3{
0%{ left: 10%; opacity: 1; }
99%{ left: 10%; opacity: 1; }
100%{ left: 100%; opacity: 1; }
}
@-moz-keyframes toRightAnim4{
0%{ left: 60%; opacity: 1; }
30%{ left: 55%; opacity: 1; }
100%{ left: 100%; opacity: 1; }
}
@-o-keyframes toRightAnim1{
0%{ left: 10%; opacity: 1; }
100%{ left: 100%; opacity: 1; }
}
@-o-keyframes toRightAnim2{
0%{ left: 10%; opacity: 1; }
100%{ left: 100%; opacity: 1; }
}
@-o-keyframes toRightAnim3{
0%{ left: 10%; opacity: 1; }
99%{ left: 10%; opacity: 1; }
100%{ left: 100%; opacity: 1; }
}
@-o-keyframes toRightAnim4{
0%{ left: 60%; opacity: 1; }
30%{ left: 55%; opacity: 1; }
100%{ left: 100%; opacity: 1; }
}
@-ms-keyframes toRightAnim1{
0%{ left: 10%; opacity: 1; }
100%{ left: 100%; opacity: 1; }
}
@-ms-keyframes toRightAnim2{
0%{ left: 10%; opacity: 1; }
100%{ left: 100%; opacity: 1; }
}
@-ms-keyframes toRightAnim3{
0%{ left: 10%; opacity: 1; }
99%{ left: 10%; opacity: 1; }
100%{ left: 100%; opacity: 1; }
}
@-ms-keyframes toRightAnim4{
0%{ left: 60%; opacity: 1; }
30%{ left: 55%; opacity: 1; }
100%{ left: 100%; opacity: 1; }
}
@keyframes toRightAnim1{
0%{ left: 10%; opacity: 1; }
100%{ left: 100%; opacity: 1; }
}
@keyframes toRightAnim2{
0%{ left: 10%; opacity: 1; }
100%{ left: 100%; opacity: 1; }
}
@keyframes toRightAnim3{
0%{ left: 10%; opacity: 1; }
99%{ left: 10%; opacity: 1; }
100%{ left: 100%; opacity: 1; }
}
@keyframes toRightAnim4{
0%{ left: 60%; opacity: 1; }
30%{ left: 55%; opacity: 1; }
100%{ left: 100%; opacity: 1; }
}
/* Slide out to the left*/
.da-slide-toleft h2{
-webkit-animation: toLeftAnim1 0.6s ease-in-out both;
-moz-animation: toLeftAnim1 0.6s ease-in-out both;
-o-animation: toLeftAnim1 0.6s ease-in-out both;
-ms-animation: toLeftAnim1 0.6s ease-in-out both;
animation: toLeftAnim1 0.6s ease-in-out both;
}
.da-slide-toleft p{
-webkit-animation: toLeftAnim2 0.6s ease-in-out 0.3s both;
-moz-animation: toLeftAnim2 0.6s ease-in-out 0.3s both;
-o-animation: toLeftAnim2 0.6s ease-in-out 0.3s both;
-ms-animation: toLeftAnim2 0.6s ease-in-out 0.3s both;
animation: toLeftAnim2 0.6s ease-in-out 0.3s both;
}
.da-slide-toleft .da-link{
-webkit-animation: toLeftAnim3 0.6s ease-in-out 0.6s both;
-moz-animation: toLeftAnim3 0.6s ease-in-out 0.6s both;
-o-animation: toLeftAnim3 0.6s ease-in-out 0.6s both;
-ms-animation: toLeftAnim3 0.6s ease-in-out 0.6s both;
animation: toLeftAnim3 0.6s ease-in-out 0.6s both;
}
.da-slide-toleft .da-img{
-webkit-animation: toLeftAnim4 0.6s ease-in-out 0.5s both;
-moz-animation: toLeftAnim4 0.6s ease-in-out 0.5s both;
-o-animation: toLeftAnim4 0.6s ease-in-out 0.5s both;
-ms-animation: toLeftAnim4 0.6s ease-in-out 0.5s both;
animation: toLeftAnim4 0.6s ease-in-out 0.5s both;
}
@-webkit-keyframes toLeftAnim1{
0%{ left: 10%; opacity: 1; }
30%{ left: 15%; opacity: 1; }
100%{ left: -50%; opacity: 1; }
}
@-webkit-keyframes toLeftAnim2{
0%{ left: 10%; opacity: 1; }
30%{ left: 15%; opacity: 1; }
100%{ left: -50%; opacity: 1; }
}
@-webkit-keyframes toLeftAnim3{
0%{ left: 10%; opacity: 1; }
100%{ left: -50%; opacity: 1; }
}
@-webkit-keyframes toLeftAnim4{
0%{ left: 60%; opacity: 1; }
70%{ left: 30%; opacity: 1; }
100%{ left: -50%; opacity: 1; }
}
@-moz-keyframes toLeftAnim1{
0%{ left: 10%; opacity: 1; }
30%{ left: 15%; opacity: 1; }
100%{ left: -50%; opacity: 1; }
}
@-moz-keyframes toLeftAnim2{
0%{ left: 10%; opacity: 1; }
30%{ left: 15%; opacity: 1; }
100%{ left: -50%; opacity: 1; }
}
@-moz-keyframes toLeftAnim3{
0%{ left: 10%; opacity: 1; }
100%{ left: -50%; opacity: 1; }
}
@-moz-keyframes toLeftAnim4{
0%{ left: 60%; opacity: 1; }
70%{ left: 30%; opacity: 1; }
100%{ left: -50%; opacity: 1; }
}
@-o-keyframes toLeftAnim1{
0%{ left: 10%; opacity: 1; }
30%{ left: 15%; opacity: 1; }
100%{ left: -50%; opacity: 1; }
}
@-o-keyframes toLeftAnim2{
0%{ left: 10%; opacity: 1; }
30%{ left: 15%; opacity: 1; }
100%{ left: -50%; opacity: 1; }
}
@-o-keyframes toLeftAnim3{
0%{ left: 10%; opacity: 1; }
100%{ left: -50%; opacity: 1; }
}
@-o-keyframes toLeftAnim4{
0%{ left: 60%; opacity: 1; }
70%{ left: 30%; opacity: 1; }
100%{ left: -50%; opacity: 1; }
}
@-ms-keyframes toLeftAnim1{
0%{ left: 10%; opacity: 1; }
30%{ left: 15%; opacity: 1; }
100%{ left: -50%; opacity: 1; }
}
@-ms-keyframes toLeftAnim2{
0%{ left: 10%; opacity: 1; }
30%{ left: 15%; opacity: 1; }
100%{ left: -50%; opacity: 1; }
}
@-ms-keyframes toLeftAnim3{
0%{ left: 10%; opacity: 1; }
100%{ left: -50%; opacity: 1; }
}
@-ms-keyframes toLeftAnim4{
0%{ left: 60%; opacity: 1; }
70%{ left: 30%; opacity: 1; }
100%{ left: -50%; opacity: 1; }
}
@keyframes toLeftAnim1{
0%{ left: 10%; opacity: 1; }
30%{ left: 15%; opacity: 1; }
100%{ left: -50%; opacity: 1; }
}
@keyframes toLeftAnim2{
0%{ left: 10%; opacity: 1; }
30%{ left: 15%; opacity: 1; }
100%{ left: -50%; opacity: 1; }
}
@keyframes toLeftAnim3{
0%{ left: 10%; opacity: 1; }
100%{ left: -50%; opacity: 1; }
}
@keyframes toLeftAnim4{
0%{ left: 60%; opacity: 1; }
70%{ left: 30%; opacity: 1; }
100%{ left: -50%; opacity: 1; }
}
@media only screen and (max-width: 1440px) and (min-width:1366px) {
.da-dots {
bottom: 55px;
}
.da-arrows span {
top: 43%;
}
}
@media only screen and (max-width: 1366px) and (min-width:1280px) {
.da-dots {
bottom: 55px;
}
.da-arrows span {
top: 43%;
}
.da-slider {
min-height: 587px;
}
.da-slide label span {
width: 150px;
height: 150px;
background-size: 100% 100%;
margin: 5em auto 1em;
}
.da-slide h2 {
margin: 1em 0 0.2em;
}
.head {
margin: 2em 0 2em 0;
}
}
@media only screen and (max-width: 1280px) and (min-width:1024px) {
.da-dots {
bottom: 55px;
}
.da-arrows span {
top: 43%;
}
.da-slider {
min-height: 587px;
}
.da-slide label span {
width: 150px;
height: 150px;
background-size: 100% 100%;
margin: 5em auto 1em;
}
.da-slide h2 {
margin: 1em 0 0.2em;
}
.head {
margin: 2em 0 2em 0;
}
}
@media only screen and (max-width: 1024px) and (min-width:768px) {
.da-dots {
bottom: 55px;
}
.da-arrows span {
top: 43%;
}
.da-slider {
min-height: 526px;
}
.da-slide label span {
width: 150px;
height: 150px;
background-size: 100% 100%;
margin: 3em auto 1em;
}
.da-slide h2 {
margin: 1em 0 0.2em;
}
.head {
margin: 2em 0 2em 0;
}
.da-arrows span.da-arrows-prev {
left: 15%;
}
.da-arrows span.da-arrows-next {
right: 15%;
}
}
@media only screen and (max-width: 768px) and (min-width:640px) {
.da-dots {
bottom: 55px;
}
.da-arrows span {
top: 43%;
}
.da-slider {
min-height: 526px;
}
.da-slide label span {
width: 150px;
height: 150px;
background-size: 100% 100%;
margin: 3em auto 1em;
}
.da-slide h2 {
margin: 1em 0 0.2em;
font: 300 1.8em/48px 'nexa_boldregular';
}
.da-slide p {
font-size: 1.5em;
}
.head {
margin: 2em 0 2em 0;
}
.da-arrows span.da-arrows-prev {
left: 10%;
}
.da-arrows span.da-arrows-next {
right: 10%;
}
}
@media only screen and (max-width: 640px) and (min-width:480px) {
.da-dots {
bottom: 55px;
}
.da-arrows span {
top: 43%;
}
.da-slider {
min-height: 400px;
}
.da-slide label span {
width: 120px;
height: 120px;
background-size: 100% 100%;
margin: 1.5em auto 0em;
}
.da-slide h2 {
margin: 1em 0 0.2em;
font: 300 1.5em/40px 'nexa_boldregular';
}
.da-slide p {
font-size: 1.5em;
height:30px;
}
.head {
margin: 2em 0 2em 0;
}
.da-arrows span.da-arrows-prev {
left: 10%;
}
.da-arrows span.da-arrows-next {
right: 10%;
}
.da-slide small a {
margin-top: 0em;
}
.head h3 {
font-size: 1.5em;
}
}
@media only screen and (max-width: 480px) and (min-width:320px) {
.da-dots {
bottom: 25px;
}
.da-arrows span {
top: 43%;
}
.da-slider {
min-height: 300px;
}
.da-slide label span {
width:90px;
height:90px;
background-size: 100% 100%;
margin: 1.5em auto 0em;
}
.da-slide h2 {
margin: 0.7em 0 0.2em;
font: 300 1.2em/14px 'nexa_boldregular';
}
.da-slide p {
font-size: 1.2em;
height:30px;
}
.head {
margin: 1em 0 1em 0;
}
.da-arrows span.da-arrows-prev {
display: none;
}
.da-arrows span.da-arrows-next {
display: none;
}
.da-slide small a {
margin-top: 0em;
}
.head h3 {
font-size: 1.5em;
}
.about-grid h3 {
font-size: 1.5em;
}
}
@media only screen and (max-width: 320px) and (min-width:240px) {
.da-dots {
bottom: 25px;
}
.da-arrows span {
top: 43%;
}
.da-slider {
min-height: 270px;
}
.da-slide label span {
width:80px;
height:80px;
background-size: 100% 100%;
margin: 1em auto 0em;
}
.da-slide h2 {
margin: 0.7em 0 0.2em;
font: 300 1em/14px 'nexa_boldregular';
}
.da-slide p {
font-size: 0.875em;
height:30px;
}
.head {
margin: 1em 0 0em 0;
}
.da-arrows span.da-arrows-prev {
display: none;
}
.da-arrows span.da-arrows-next {
display: none;
}
.da-slide small a {
margin-top: 0em;
font-size: 1em;
}
.head h3 {
font-size: 1.2em;
padding: 0.5em 0 0 0;
}
.about-grid h3 {
font-size: 1.5em;
}
}