/* ____ _ _ | _ \ | | _ _ __ _ (_) _ __ ___ ___ ___ ___ | |_) | | | | | | | / _` | | | | '_ \ / __| / __| / __| / __| | __/ | | | |_| | | (_| | | | | | | | \__ \ _ | (__ \__ \ \__ \ |_| |_| \__,_| \__, | |_| |_| |_| |___/ (_) \___| |___/ |___/ |___/ */ /*--------------------------------------------------------------------------------*/ /*1.CUSTOME PRELOADER.CSS*/ /*--------------------------------------------------------------------------------*/ body.preloader-running{ overflow: hidden; } div#preloader { background: #000; height: 100%; left: 0; position: fixed; top: 0; width: 100%; z-index: 99999; } #dark-images #status { background-image: url(../../images/d-loader.gif); } #status { width: 200px; height: 200px; position: fixed; left: 50%; top: 50%; background-image: url(../../images/loader.gif); background-repeat: no-repeat; background-position: center; margin: -100px 0 0 -100px; } /*--------------------------------------------------------------------------------*/ /* 2.NORMLISE.CSS /*--------------------------------------------------------------------------------*/ article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block;}audio,canvas,video{display:inline-block;}audio:not([controls]){display:none;height:0;}[hidden]{display:none;}html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;}body{margin:0;}a:focus{outline:thin dotted;}a:active,a:hover{outline:0;}h1{font-size:2em;margin:0.67em 0;}abbr[title]{border-bottom:1px dotted;}b,strong{font-weight:bold;}dfn{font-style:italic;}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0;}mark{background:#ff0;color:#000;}code,kbd,pre,samp{font-family:monospace,serif;font-size:1em;}pre{white-space:pre-wrap;}q{quotes:"\201C" "\201D" "\2018" "\2019";}small{font-size:80%;}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;}sup{top:-0.5em;}sub{bottom:-0.25em;}img{border:0;}svg:not(:root){overflow:hidden;}figure{margin:0;}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em;}legend{border:0;padding:0;}button,input,select,textarea{font-family:inherit;font-size:100%;margin:0;}button,input{line-height:normal;}button,select{text-transform:none;}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer;}button[disabled],html input[disabled]{cursor:default;}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0;}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box;}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none;}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0;}textarea{overflow:auto;vertical-align:top;}table{border-collapse:collapse;border-spacing:0;} /*--------------------------------------------------------------------------------*/ /* 2.FULLPAGE.CSS | 2.9.4 /*--------------------------------------------------------------------------------*/ .fp-controlArrow,.slide__letter,.slider{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}.cont,.fp-scrollable,.fp-scroller,.fp-slides,.slide{overflow:hidden}.nav__slide:after,.slide--1__darkbg:after,.slide--2__darkbg:after,.slide--3__darkbg:after,.slide--4__darkbg:after,.slide--5__darkbg:after{content:''}#superContainer{height:100%;position:relative;-ms-touch-action:none;touch-action:none}.fp-section{position:relative;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.fp-slide{float:left}.fp-slide,.fp-slidesContainer{height:100%;display:block}.fp-slides{z-index:1;height:100%;position:relative;-webkit-transition:all .3s ease-out;transition:all .3s ease-out}.fp-section.fp-table,.fp-slide.fp-table{display:table;table-layout:fixed;width:100%}.fp-tableCell{display:table-cell;vertical-align:middle;width:100%;height:100%}.fp-slidesContainer{float:left;position:relative}.fp-controlArrow{-khtml-user-select:none;position:absolute;z-index:4;top:50%;cursor:pointer;width:0;height:0;border-style:solid;margin-top:-38px;-webkit-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}#fp-nav,.fp-slidesNav{opacity:1;-webkit-transform:translate3d(0,0,0)}.fp-controlArrow.fp-prev{left:15px;width:0;border-width:38.5px 34px 38.5px 0;border-color:transparent #fff transparent transparent}.fp-controlArrow.fp-next{right:15px;border-width:38.5px 0 38.5px 34px;border-color:transparent transparent transparent #fff}.fp-scrollable{position:relative}.iScrollIndicator{border:0!important}.fp-notransition{-webkit-transition:none!important;transition:none!important}#fp-nav{position:fixed;z-index:100;margin-top:-32px;top:50%}#fp-nav.right{right:17px}#fp-nav.left{left:17px}.fp-slidesNav{position:absolute;z-index:4;left:50%;-ms-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.slide__darkbg,.slider{-webkit-transform:translate3d(0,0,0)}.fp-slidesNav.bottom{bottom:17px}.fp-slidesNav.top{top:17px}#fp-nav ul,.fp-slidesNav ul{margin:0;padding:0}#fp-nav ul li,.fp-slidesNav ul li{display:block;width:14px;height:13px;margin:7px;position:relative}.fp-slidesNav ul li{display:inline-block}#fp-nav ul li a,.fp-slidesNav ul li a{display:block;position:relative;z-index:1;width:100%;height:100%;cursor:pointer;text-decoration:none}#fp-nav ul li a.active span,#fp-nav ul li:hover a.active span,.fp-slidesNav ul li a.active span,.fp-slidesNav ul li:hover a.active span{height:12px;width:12px;margin:-6px 0 0 -6px;border-radius:100%}#fp-nav ul li a span,.fp-slidesNav ul li a span{border-radius:50%;position:absolute;z-index:1;height:4px;width:4px;border:0;background:#333;left:50%;top:50%;margin:-2px 0 0 -2px;-webkit-transition:all .1s ease-in-out;-moz-transition:all .1s ease-in-out;-o-transition:all .1s ease-in-out;transition:all .1s ease-in-out}#fp-nav ul li:hover a span,.fp-slidesNav ul li:hover a span{width:10px;height:10px;margin:-5px 0 0 -5px}#fp-nav ul li .fp-tooltip{position:absolute;top:-2px;color:#fff;font-size:14px;font-family:arial,helvetica,sans-serif;white-space:nowrap;max-width:220px;overflow:hidden;display:block;opacity:0;width:0;cursor:pointer}.cont,.slider{position:relative}#fp-nav ul li:hover .fp-tooltip,#fp-nav.fp-show-active a.active+.fp-tooltip{-webkit-transition:opacity .2s ease-in;transition:opacity .2s ease-in;width:auto;opacity:1}#fp-nav ul li .fp-tooltip.right{right:20px}#fp-nav ul li .fp-tooltip.left{left:20px}.fp-auto-height .fp-slide,.fp-auto-height .fp-tableCell,.fp-auto-height.fp-section,.fp-responsive .fp-auto-height-responsive .fp-slide,.fp-responsive .fp-auto-height-responsive .fp-tableCell,.fp-responsive .fp-auto-height-responsive.fp-section{height:auto!important}.cont{height:100vh}.slide,.slide--1__darkbg:after,.slide--2__darkbg:after,.slide--3__darkbg:after,.slide--4__darkbg:after,.slide--5__darkbg:after,.slide__darkbg,.slide__letter,.slide__text-wrapper{height:100%;position:absolute}.slider{height:100%;transform:translate3d(0,0,0);will-change:transform;cursor:all-scroll;user-select:none}.slider.animation,.slider.animation .slide__darkbg,.slider.animation .slide__letter,.slider.animation .slide__text{-webkit-transition:-webkit-transform 750ms ease-in-out;transition:-webkit-transform 750ms ease-in-out;transition:transform 750ms ease-in-out;transition:transform 750ms ease-in-out,-webkit-transform 750ms ease-in-out}.slide{top:0;width:100%}.slide--1{left:0}.slide--2{left:100%}.slide--3{left:200%}.slide--4{left:300%}.slide--5{left:400%}.slide__darkbg{width:100%;top:0;left:0;transform:translate3d(0,0,0);will-change:transform;z-index:10}.slide__letter,.slide__text{font-weight:800;-webkit-transform:translate3d(0,0,0);will-change:transform}.slide__text-wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%;z-index:15}.slide__letter{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;top:0;left:0;width:100%;transform:translate3d(0,0,0);-webkit-text-fill-color:transparent!important;-webkit-background-clip:text!important;font-size:50vw;color:#000;z-index:2;user-select:none}.slide__text{font-size:8vw;text-transform:uppercase;transform:translate3d(0,0,0);letter-spacing:12px;color:#fff;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.slide--1__darkbg,.slide--2__darkbg{-webkit-transform:translate3d(0,0,0)}.slide__text:nth-child(odd){z-index:2}.slide__text:nth-child(even){z-index:1}.slide--1__darkbg{left:0;background:url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/537051/city--1-min-min.jpg) center center no-repeat;background-size:cover;background-position:0 center,0 center;transform:translate3d(0,0,0);will-change:transform}.slide--1__darkbg:after{top:0;left:0;width:100%;background-color:rgba(11,15,39,.83)}.slide--1__letter{background:url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/537051/city--1-min-min.jpg) center center no-repeat;background-position:0 center,0 center;background-size:cover}.slide--2__darkbg{left:-50%;background:url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/537051/city--2-min-min.jpg) center center no-repeat;background-size:cover;background-position:0 center,0 center;transform:translate3d(0,0,0);will-change:transform}.slide--3__darkbg,.slide--4__darkbg{-webkit-transform:translate3d(0,0,0);will-change:transform}.slide--2__darkbg:after{top:0;left:0;width:100%;background-color:rgba(11,15,39,.83)}.slide--2__letter{background:url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/537051/city--2-min-min.jpg) center center no-repeat;background-position:0 center,0 center;background-size:cover}.slide--3__darkbg{left:-100%;background:url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/537051/city--3-min-min.jpg) center center no-repeat;background-size:cover;background-position:0 center,0 center;transform:translate3d(0,0,0)}.slide--3__darkbg:after{top:0;left:0;width:100%;background-color:rgba(11,15,39,.83)}.slide--3__letter{background:url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/537051/city--3-min-min.jpg) center center no-repeat;background-position:0 center,0 center;background-size:cover}.slide--4__darkbg{left:-150%;background:url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/537051/city--4-min-min.jpg) center center no-repeat;background-size:cover;background-position:0 center,0 center;transform:translate3d(0,0,0)}.slide--4__darkbg:after{top:0;left:0;width:100%;background-color:rgba(11,15,39,.83)}.slide--4__letter{background:url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/537051/city--4-min-min.jpg) center center no-repeat;background-position:0 center,0 center;background-size:cover}.slide--5__darkbg{left:-200%;background:url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/537051/city--5-min-min.jpg) center center no-repeat;background-size:cover;background-position:0 center,0 center;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);will-change:transform}.slide--5__darkbg:after{top:0;left:0;width:100%;background-color:rgba(11,15,39,.83)}.slide--5__letter{background:url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/537051/city--5-min-min.jpg) center center no-repeat;background-position:0 center,0 center;background-size:cover}.nav{position:absolute;bottom:25px;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%);list-style-type:none;z-index:10}.nav>li,.nav__slide{position:relative;display:inline-block}.nav__slide{width:10px;height:10px;border-radius:50%;border:2px solid #fff;margin-left:10px;cursor:pointer}@media screen and (max-width:400px){.nav__slide{width:22px;height:22px}}.nav__slide:hover:after{-webkit-transform:translate(-50%,-50%) scale(1,1);transform:translate(-50%,-50%) scale(1,1);opacity:1}.nav__slide:after{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%) scale(0,0);transform:translate(-50%,-50%) scale(0,0);width:75%;height:75%;border-radius:50%;background-color:#fff;opacity:0;-webkit-transition:.3s;transition:.3s}.nav__slide--1{margin-left:0}.nav-active:after{-webkit-transform:translate(-50%,-50%) scale(1,1);transform:translate(-50%,-50%) scale(1,1);opacity:1}.side-nav{position:absolute;width:10%;height:100%;top:0;z-index:20;cursor:pointer;opacity:0;-webkit-transition:.3s;transition:.3s}.side-nav:hover{opacity:.1}.side-nav--right{right:0;background-image:-webkit-linear-gradient(left,rgba(255,255,255,0) 0,#eed7ff 100%);background-image:linear-gradient(to right,rgba(255,255,255,0) 0,#eed7ff 100%)}.side-nav--left{left:0;background-image:-webkit-linear-gradient(right,rgba(255,255,255,0) 0,#eed7ff 100%);background-image:linear-gradient(to left,rgba(255,255,255,0) 0,#eed7ff 100%)} /*--------------------------------------------------------------------------------*/ /* 2.ANIMATED HAMBURGAR MENU ICON | /*https://codepen.io/designcouch/pen/Atyop*/ /*--------------------------------------------------------------------------------*/ #nav-icon1,#nav-icon2,#nav-icon3,#nav-icon4{width:60px;height:45px;position:relative;margin:/*5*/0px auto;-webkit-transform:rotate(0);-moz-transform:rotate(0);-o-transform:rotate(0);transform:rotate(0);-webkit-transition:.5s ease-in-out;-moz-transition:.5s ease-in-out;-o-transition:.5s ease-in-out;transition:.5s ease-in-out;cursor:pointer}#nav-icon1 span,#nav-icon3 span,#nav-icon4 span{display:block;position:absolute;height:9px;width:100%;background:#d3531a;border-radius:9px;opacity:1;left:0;-webkit-transform:rotate(0);-moz-transform:rotate(0);-o-transform:rotate(0);transform:rotate(0);-webkit-transition:.25s ease-in-out;-moz-transition:.25s ease-in-out;-o-transition:.25s ease-in-out;transition:.25s ease-in-out}#nav-icon1 span:nth-child(1){top:0}#nav-icon1 span:nth-child(2){top:18px}#nav-icon1 span:nth-child(3){top:36px}#nav-icon1.open span:nth-child(1){top:18px;-webkit-transform:rotate(135deg);-moz-transform:rotate(135deg);-o-transform:rotate(135deg);transform:rotate(135deg)}#nav-icon1.open span:nth-child(2){opacity:0;left:-60px}#nav-icon1.open span:nth-child(3){top:18px;-webkit-transform:rotate(-135deg);-moz-transform:rotate(-135deg);-o-transform:rotate(-135deg);transform:rotate(-135deg)}#nav-icon2 span{display:block;position:absolute;height:9px;width:50%;background:#d3531a;opacity:1;-webkit-transform:rotate(0);-moz-transform:rotate(0);-o-transform:rotate(0);transform:rotate(0);-webkit-transition:.25s ease-in-out;-moz-transition:.25s ease-in-out;-o-transition:.25s ease-in-out;transition:.25s ease-in-out}#nav-icon2 span:nth-child(even){left:50%;border-radius:0 9px 9px 0}#nav-icon2 span:nth-child(odd){left:0;border-radius:9px 0 0 9px}#nav-icon2 span:nth-child(1),#nav-icon2 span:nth-child(2){top:0}#nav-icon2 span:nth-child(3),#nav-icon2 span:nth-child(4){top:18px}#nav-icon2 span:nth-child(5),#nav-icon2 span:nth-child(6){top:36px}#nav-icon2.open span:nth-child(1),#nav-icon2.open span:nth-child(6){-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg)}#nav-icon2.open span:nth-child(2),#nav-icon2.open span:nth-child(5){-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform:rotate(-45deg)}#nav-icon2.open span:nth-child(1){left:5px;top:7px}#nav-icon2.open span:nth-child(2){left:calc(50% - 5px);top:7px}#nav-icon2.open span:nth-child(3){left:-50%;opacity:0}#nav-icon2.open span:nth-child(4){left:100%;opacity:0}#nav-icon2.open span:nth-child(5){left:5px;top:29px}#nav-icon2.open span:nth-child(6){left:calc(50% - 5px);top:29px}#nav-icon3 span:nth-child(1){top:0}#nav-icon3 span:nth-child(2),#nav-icon3 span:nth-child(3){top:18px}#nav-icon3 span:nth-child(4){top:36px}#nav-icon3.open span:nth-child(1){top:18px;width:0;left:50%}#nav-icon3.open span:nth-child(2){-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg)}#nav-icon3.open span:nth-child(3){-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform:rotate(-45deg)}#nav-icon4 span:nth-child(1),#nav-icon4 span:nth-child(2){-webkit-transform-origin:left center;-moz-transform-origin:left center;-o-transform-origin:left center}#nav-icon3.open span:nth-child(4){top:18px;width:0;left:50%}#nav-icon4 span:nth-child(1){top:0;transform-origin:left center}#nav-icon4 span:nth-child(2){top:18px;transform-origin:left center}#nav-icon4 span:nth-child(3){top:36px;-webkit-transform-origin:left center;-moz-transform-origin:left center;-o-transform-origin:left center;transform-origin:left center}#nav-icon4.open span:nth-child(1){-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg);top:-3px;left:8px}#nav-icon4.open span:nth-child(2){width:0;opacity:0}#nav-icon4.open span:nth-child(3){-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform:rotate(-45deg);top:39px;left:8px} /*--------------------------------------------------------------------------------*/ /* 2.ANIMATED HEADLINES https://codyhouse.co/gem/css-animated-headlines/ /*--------------------------------------------------------------------------------*/ .cd-headline.type .cd-words-wrapper.selected::after,.cd-headline.type b{visibility:hidden}.cd-headline.clip span,.cd-headline.loading-bar span,.cd-headline.slide span{padding:.2em 0;display:inline-block}.cd-headline.clip .cd-words-wrapper,.cd-headline.loading-bar .cd-words-wrapper,.cd-headline.slide .cd-words-wrapper,.cd-headline.type .cd-words-wrapper{overflow:hidden;vertical-align:top}.cd-title{position:relative;height:160px;line-height:230px;text-align:center}.cd-title h1{font-size:2.4rem;font-weight:700}.cd-intro{width:90%;max-width:768px;text-align:center;margin:4em auto}@media only screen and (min-width:768px){.cd-title{line-height:250px}.cd-intro{margin:5em auto}}@media only screen and (min-width:1170px){.cd-title{height:200px;line-height:300px}.cd-title h1{font-size:3rem}.cd-intro{margin:6em auto}}.cd-headline{font-size:3rem;line-height:1.2}@media only screen and (min-width:768px){.cd-headline{font-size:4.4rem;font-weight:300}}@media only screen and (min-width:1170px){.cd-headline{font-size:6rem}}.cd-words-wrapper{display:inline-block;position:relative;text-align:left}.cd-words-wrapper b{display:inline-block;position:absolute;white-space:nowrap;left:0;top:0}.cd-words-wrapper b.is-visible{position:relative}.no-js .cd-words-wrapper b{opacity:0}.no-js .cd-words-wrapper b.is-visible{opacity:1}.cd-headline.rotate-1 .cd-words-wrapper{-webkit-perspective:300px;-moz-perspective:300px;perspective:300px}.cd-headline.rotate-1 b{opacity:0;-webkit-transform-origin:50% 100%;-moz-transform-origin:50% 100%;-ms-transform-origin:50% 100%;-o-transform-origin:50% 100%;transform-origin:50% 100%;-webkit-transform:rotateX(180deg);-moz-transform:rotateX(180deg);-ms-transform:rotateX(180deg);-o-transform:rotateX(180deg);transform:rotateX(180deg)}.cd-headline.rotate-1 b.is-visible{opacity:1;-webkit-transform:rotateX(0);-moz-transform:rotateX(0);-ms-transform:rotateX(0);-o-transform:rotateX(0);transform:rotateX(0);-webkit-animation:cd-rotate-1-in 1.2s;-moz-animation:cd-rotate-1-in 1.2s;animation:cd-rotate-1-in 1.2s}.cd-headline.rotate-1 b.is-hidden{-webkit-transform:rotateX(180deg);-moz-transform:rotateX(180deg);-ms-transform:rotateX(180deg);-o-transform:rotateX(180deg);transform:rotateX(180deg);-webkit-animation:cd-rotate-1-out 1.2s;-moz-animation:cd-rotate-1-out 1.2s;animation:cd-rotate-1-out 1.2s}@-webkit-keyframes cd-rotate-1-in{0%{-webkit-transform:rotateX(180deg);opacity:0}35%{-webkit-transform:rotateX(120deg);opacity:0}65%{opacity:0}100%{-webkit-transform:rotateX(360deg);opacity:1}}@-moz-keyframes cd-rotate-1-in{0%{-moz-transform:rotateX(180deg);opacity:0}35%{-moz-transform:rotateX(120deg);opacity:0}65%{opacity:0}100%{-moz-transform:rotateX(360deg);opacity:1}}@keyframes cd-rotate-1-in{0%{-webkit-transform:rotateX(180deg);-moz-transform:rotateX(180deg);-ms-transform:rotateX(180deg);-o-transform:rotateX(180deg);transform:rotateX(180deg);opacity:0}35%{-webkit-transform:rotateX(120deg);-moz-transform:rotateX(120deg);-ms-transform:rotateX(120deg);-o-transform:rotateX(120deg);transform:rotateX(120deg);opacity:0}65%{opacity:0}100%{-webkit-transform:rotateX(360deg);-moz-transform:rotateX(360deg);-ms-transform:rotateX(360deg);-o-transform:rotateX(360deg);transform:rotateX(360deg);opacity:1}}@-webkit-keyframes cd-rotate-1-out{0%{-webkit-transform:rotateX(0);opacity:1}35%{-webkit-transform:rotateX(-40deg);opacity:1}65%{opacity:0}100%{-webkit-transform:rotateX(180deg);opacity:0}}@-moz-keyframes cd-rotate-1-out{0%{-moz-transform:rotateX(0);opacity:1}35%{-moz-transform:rotateX(-40deg);opacity:1}65%{opacity:0}100%{-moz-transform:rotateX(180deg);opacity:0}}@keyframes cd-rotate-1-out{0%{-webkit-transform:rotateX(0);-moz-transform:rotateX(0);-ms-transform:rotateX(0);-o-transform:rotateX(0);transform:rotateX(0);opacity:1}35%{-webkit-transform:rotateX(-40deg);-moz-transform:rotateX(-40deg);-ms-transform:rotateX(-40deg);-o-transform:rotateX(-40deg);transform:rotateX(-40deg);opacity:1}65%{opacity:0}100%{-webkit-transform:rotateX(180deg);-moz-transform:rotateX(180deg);-ms-transform:rotateX(180deg);-o-transform:rotateX(180deg);transform:rotateX(180deg);opacity:0}}.cd-headline.type .cd-words-wrapper::after{content:'';position:absolute;right:0;top:50%;bottom:auto;-webkit-transform:translateY(-50%);-moz-transform:translateY(-50%);-ms-transform:translateY(-50%);-o-transform:translateY(-50%);transform:translateY(-50%);height:90%;width:1px;background-color:#aebcb9}.cd-headline.type .cd-words-wrapper.waiting::after{-webkit-animation:cd-pulse 1s infinite;-moz-animation:cd-pulse 1s infinite;animation:cd-pulse 1s infinite}.cd-headline.type .cd-words-wrapper.selected{background-color:#aebcb9}.cd-headline.type .cd-words-wrapper.selected b{color:#0d0d0d}.cd-headline.type b.is-visible{visibility:visible}.cd-headline.type i{position:absolute;visibility:hidden}.cd-headline.type i.in{position:relative;visibility:visible}@-webkit-keyframes cd-pulse{0%{-webkit-transform:translateY(-50%) scale(1);opacity:1}40%{-webkit-transform:translateY(-50%) scale(.9);opacity:0}100%{-webkit-transform:translateY(-50%) scale(0);opacity:0}}@-moz-keyframes cd-pulse{0%{-moz-transform:translateY(-50%) scale(1);opacity:1}40%{-moz-transform:translateY(-50%) scale(.9);opacity:0}100%{-moz-transform:translateY(-50%) scale(0);opacity:0}}@keyframes cd-pulse{0%{-webkit-transform:translateY(-50%) scale(1);-moz-transform:translateY(-50%) scale(1);-ms-transform:translateY(-50%) scale(1);-o-transform:translateY(-50%) scale(1);transform:translateY(-50%) scale(1);opacity:1}40%{-webkit-transform:translateY(-50%) scale(.9);-moz-transform:translateY(-50%) scale(.9);-ms-transform:translateY(-50%) scale(.9);-o-transform:translateY(-50%) scale(.9);transform:translateY(-50%) scale(.9);opacity:0}100%{-webkit-transform:translateY(-50%) scale(0);-moz-transform:translateY(-50%) scale(0);-ms-transform:translateY(-50%) scale(0);-o-transform:translateY(-50%) scale(0);transform:translateY(-50%) scale(0);opacity:0}}.cd-headline.rotate-2 .cd-words-wrapper{-webkit-perspective:300px;-moz-perspective:300px;perspective:300px}.cd-headline.rotate-2 em,.cd-headline.rotate-2 i{display:inline-block;-webkit-backface-visibility:hidden;backface-visibility:hidden}.cd-headline.rotate-2 b{opacity:0}.cd-headline.rotate-2 i{-webkit-transform-style:preserve-3d;-moz-transform-style:preserve-3d;-ms-transform-style:preserve-3d;-o-transform-style:preserve-3d;transform-style:preserve-3d;-webkit-transform:translateZ(-20px) rotateX(90deg);-moz-transform:translateZ(-20px) rotateX(90deg);-ms-transform:translateZ(-20px) rotateX(90deg);-o-transform:translateZ(-20px) rotateX(90deg);transform:translateZ(-20px) rotateX(90deg);opacity:0}.is-visible .cd-headline.rotate-2 i{opacity:1}.cd-headline.rotate-2 i.in{-webkit-animation:cd-rotate-2-in .4s forwards;-moz-animation:cd-rotate-2-in .4s forwards;animation:cd-rotate-2-in .4s forwards}.cd-headline.rotate-2 i.out{-webkit-animation:cd-rotate-2-out .4s forwards;-moz-animation:cd-rotate-2-out .4s forwards;animation:cd-rotate-2-out .4s forwards}.cd-headline.rotate-2 em{-webkit-transform:translateZ(20px);-moz-transform:translateZ(20px);-ms-transform:translateZ(20px);-o-transform:translateZ(20px);transform:translateZ(20px)}.no-csstransitions .cd-headline.rotate-2 i{-webkit-transform:rotateX(0);-moz-transform:rotateX(0);-ms-transform:rotateX(0);-o-transform:rotateX(0);transform:rotateX(0);opacity:0}.no-csstransitions .cd-headline.rotate-2 i em{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1)}.no-csstransitions .cd-headline.rotate-2 .is-visible i{opacity:1}@-webkit-keyframes cd-rotate-2-in{0%{opacity:0;-webkit-transform:translateZ(-20px) rotateX(90deg)}60%{opacity:1;-webkit-transform:translateZ(-20px) rotateX(-10deg)}100%{opacity:1;-webkit-transform:translateZ(-20px) rotateX(0)}}@-moz-keyframes cd-rotate-2-in{0%{opacity:0;-moz-transform:translateZ(-20px) rotateX(90deg)}60%{opacity:1;-moz-transform:translateZ(-20px) rotateX(-10deg)}100%{opacity:1;-moz-transform:translateZ(-20px) rotateX(0)}}@keyframes cd-rotate-2-in{0%{opacity:0;-webkit-transform:translateZ(-20px) rotateX(90deg);-moz-transform:translateZ(-20px) rotateX(90deg);-ms-transform:translateZ(-20px) rotateX(90deg);-o-transform:translateZ(-20px) rotateX(90deg);transform:translateZ(-20px) rotateX(90deg)}60%{opacity:1;-webkit-transform:translateZ(-20px) rotateX(-10deg);-moz-transform:translateZ(-20px) rotateX(-10deg);-ms-transform:translateZ(-20px) rotateX(-10deg);-o-transform:translateZ(-20px) rotateX(-10deg);transform:translateZ(-20px) rotateX(-10deg)}100%{opacity:1;-webkit-transform:translateZ(-20px) rotateX(0);-moz-transform:translateZ(-20px) rotateX(0);-ms-transform:translateZ(-20px) rotateX(0);-o-transform:translateZ(-20px) rotateX(0);transform:translateZ(-20px) rotateX(0)}}@-webkit-keyframes cd-rotate-2-out{0%{opacity:1;-webkit-transform:translateZ(-20px) rotateX(0)}60%{opacity:0;-webkit-transform:translateZ(-20px) rotateX(-100deg)}100%{opacity:0;-webkit-transform:translateZ(-20px) rotateX(-90deg)}}@-moz-keyframes cd-rotate-2-out{0%{opacity:1;-moz-transform:translateZ(-20px) rotateX(0)}60%{opacity:0;-moz-transform:translateZ(-20px) rotateX(-100deg)}100%{opacity:0;-moz-transform:translateZ(-20px) rotateX(-90deg)}}@keyframes cd-rotate-2-out{0%{opacity:1;-webkit-transform:translateZ(-20px) rotateX(0);-moz-transform:translateZ(-20px) rotateX(0);-ms-transform:translateZ(-20px) rotateX(0);-o-transform:translateZ(-20px) rotateX(0);transform:translateZ(-20px) rotateX(0)}60%{opacity:0;-webkit-transform:translateZ(-20px) rotateX(-100deg);-moz-transform:translateZ(-20px) rotateX(-100deg);-ms-transform:translateZ(-20px) rotateX(-100deg);-o-transform:translateZ(-20px) rotateX(-100deg);transform:translateZ(-20px) rotateX(-100deg)}100%{opacity:0;-webkit-transform:translateZ(-20px) rotateX(-90deg);-moz-transform:translateZ(-20px) rotateX(-90deg);-ms-transform:translateZ(-20px) rotateX(-90deg);-o-transform:translateZ(-20px) rotateX(-90deg);transform:translateZ(-20px) rotateX(-90deg)}}.cd-headline.loading-bar .cd-words-wrapper::after{content:'';position:absolute;left:0;bottom:0;height:3px;width:0;background:#0096a7;z-index:2;-webkit-transition:width .3s -.1s;-moz-transition:width .3s -.1s;transition:width .3s -.1s}.cd-headline.loading-bar .cd-words-wrapper.is-loading::after{width:100%;-webkit-transition:width 3s;-moz-transition:width 3s;transition:width 3s}.cd-headline.loading-bar b{top:.2em;opacity:0;-webkit-transition:opacity .3s;-moz-transition:opacity .3s;transition:opacity .3s}.cd-headline.loading-bar b.is-visible{opacity:1;top:0}.cd-headline.slide b{opacity:0;top:.2em}.cd-headline.slide b.is-visible{top:0;opacity:1;-webkit-animation:slide-in .6s;-moz-animation:slide-in .6s;animation:slide-in .6s}.cd-headline.slide b.is-hidden{-webkit-animation:slide-out .6s;-moz-animation:slide-out .6s;animation:slide-out .6s}@-webkit-keyframes slide-in{0%{opacity:0;-webkit-transform:translateY(-100%)}60%{opacity:1;-webkit-transform:translateY(20%)}100%{opacity:1;-webkit-transform:translateY(0)}}@-moz-keyframes slide-in{0%{opacity:0;-moz-transform:translateY(-100%)}60%{opacity:1;-moz-transform:translateY(20%)}100%{opacity:1;-moz-transform:translateY(0)}}@keyframes slide-in{0%{opacity:0;-webkit-transform:translateY(-100%);-moz-transform:translateY(-100%);-ms-transform:translateY(-100%);-o-transform:translateY(-100%);transform:translateY(-100%)}60%{opacity:1;-webkit-transform:translateY(20%);-moz-transform:translateY(20%);-ms-transform:translateY(20%);-o-transform:translateY(20%);transform:translateY(20%)}100%{opacity:1;-webkit-transform:translateY(0);-moz-transform:translateY(0);-ms-transform:translateY(0);-o-transform:translateY(0);transform:translateY(0)}}@-webkit-keyframes slide-out{0%{opacity:1;-webkit-transform:translateY(0)}60%{opacity:0;-webkit-transform:translateY(120%)}100%{opacity:0;-webkit-transform:translateY(100%)}}@-moz-keyframes slide-out{0%{opacity:1;-moz-transform:translateY(0)}60%{opacity:0;-moz-transform:translateY(120%)}100%{opacity:0;-moz-transform:translateY(100%)}}@keyframes slide-out{0%{opacity:1;-webkit-transform:translateY(0);-moz-transform:translateY(0);-ms-transform:translateY(0);-o-transform:translateY(0);transform:translateY(0)}60%{opacity:0;-webkit-transform:translateY(120%);-moz-transform:translateY(120%);-ms-transform:translateY(120%);-o-transform:translateY(120%);transform:translateY(120%)}100%{opacity:0;-webkit-transform:translateY(100%);-moz-transform:translateY(100%);-ms-transform:translateY(100%);-o-transform:translateY(100%);transform:translateY(100%)}}.cd-headline.clip .cd-words-wrapper::after{content:'';position:absolute;top:0;right:0;width:2px;height:100%;background-color:#aebcb9}.cd-headline.clip b{opacity:0}.cd-headline.clip b.is-visible{opacity:1}.cd-headline.zoom .cd-words-wrapper{-webkit-perspective:300px;-moz-perspective:300px;perspective:300px}.cd-headline.zoom b{opacity:0}.cd-headline.zoom b.is-visible{opacity:1;-webkit-animation:zoom-in .8s;-moz-animation:zoom-in .8s;animation:zoom-in .8s}.cd-headline.zoom b.is-hidden{-webkit-animation:zoom-out .8s;-moz-animation:zoom-out .8s;animation:zoom-out .8s}@-webkit-keyframes zoom-in{0%{opacity:0;-webkit-transform:translateZ(100px)}100%{opacity:1;-webkit-transform:translateZ(0)}}@-moz-keyframes zoom-in{0%{opacity:0;-moz-transform:translateZ(100px)}100%{opacity:1;-moz-transform:translateZ(0)}}@keyframes zoom-in{0%{opacity:0;-webkit-transform:translateZ(100px);-moz-transform:translateZ(100px);-ms-transform:translateZ(100px);-o-transform:translateZ(100px);transform:translateZ(100px)}100%{opacity:1;-webkit-transform:translateZ(0);-moz-transform:translateZ(0);-ms-transform:translateZ(0);-o-transform:translateZ(0);transform:translateZ(0)}}@-webkit-keyframes zoom-out{0%{opacity:1;-webkit-transform:translateZ(0)}100%{opacity:0;-webkit-transform:translateZ(-100px)}}@-moz-keyframes zoom-out{0%{opacity:1;-moz-transform:translateZ(0)}100%{opacity:0;-moz-transform:translateZ(-100px)}}@keyframes zoom-out{0%{opacity:1;-webkit-transform:translateZ(0);-moz-transform:translateZ(0);-ms-transform:translateZ(0);-o-transform:translateZ(0);transform:translateZ(0)}100%{opacity:0;-webkit-transform:translateZ(-100px);-moz-transform:translateZ(-100px);-ms-transform:translateZ(-100px);-o-transform:translateZ(-100px);transform:translateZ(-100px)}}.cd-headline.rotate-3 .cd-words-wrapper{-webkit-perspective:300px;-moz-perspective:300px;perspective:300px}.cd-headline.rotate-3 b{opacity:0}.cd-headline.rotate-3 i{display:inline-block;-webkit-transform:rotateY(180deg);-moz-transform:rotateY(180deg);-ms-transform:rotateY(180deg);-o-transform:rotateY(180deg);transform:rotateY(180deg);-webkit-backface-visibility:hidden;backface-visibility:hidden}.is-visible .cd-headline.rotate-3 i{-webkit-transform:rotateY(0);-moz-transform:rotateY(0);-ms-transform:rotateY(0);-o-transform:rotateY(0);transform:rotateY(0)}.cd-headline.rotate-3 i.in{-webkit-animation:cd-rotate-3-in .6s forwards;-moz-animation:cd-rotate-3-in .6s forwards;animation:cd-rotate-3-in .6s forwards}.cd-headline.rotate-3 i.out{-webkit-animation:cd-rotate-3-out .6s forwards;-moz-animation:cd-rotate-3-out .6s forwards;animation:cd-rotate-3-out .6s forwards}.no-csstransitions .cd-headline.rotate-3 i{-webkit-transform:rotateY(0);-moz-transform:rotateY(0);-ms-transform:rotateY(0);-o-transform:rotateY(0);transform:rotateY(0);opacity:0}.no-csstransitions .cd-headline.rotate-3 .is-visible i{opacity:1}@-webkit-keyframes cd-rotate-3-in{0%{-webkit-transform:rotateY(180deg)}100%{-webkit-transform:rotateY(0)}}@-moz-keyframes cd-rotate-3-in{0%{-moz-transform:rotateY(180deg)}100%{-moz-transform:rotateY(0)}}@keyframes cd-rotate-3-in{0%{-webkit-transform:rotateY(180deg);-moz-transform:rotateY(180deg);-ms-transform:rotateY(180deg);-o-transform:rotateY(180deg);transform:rotateY(180deg)}100%{-webkit-transform:rotateY(0);-moz-transform:rotateY(0);-ms-transform:rotateY(0);-o-transform:rotateY(0);transform:rotateY(0)}}@-webkit-keyframes cd-rotate-3-out{0%{-webkit-transform:rotateY(0)}100%{-webkit-transform:rotateY(-180deg)}}@-moz-keyframes cd-rotate-3-out{0%{-moz-transform:rotateY(0)}100%{-moz-transform:rotateY(-180deg)}}@keyframes cd-rotate-3-out{0%{-webkit-transform:rotateY(0);-moz-transform:rotateY(0);-ms-transform:rotateY(0);-o-transform:rotateY(0);transform:rotateY(0)}100%{-webkit-transform:rotateY(-180deg);-moz-transform:rotateY(-180deg);-ms-transform:rotateY(-180deg);-o-transform:rotateY(-180deg);transform:rotateY(-180deg)}}.cd-headline.scale b{opacity:0}.cd-headline.scale i{display:inline-block;opacity:0;-webkit-transform:scale(0);-moz-transform:scale(0);-ms-transform:scale(0);-o-transform:scale(0);transform:scale(0)}.is-visible .cd-headline.scale i{opacity:1}.cd-headline.scale i.in{-webkit-animation:scale-up .6s forwards;-moz-animation:scale-up .6s forwards;animation:scale-up .6s forwards}.cd-headline.scale i.out{-webkit-animation:scale-down .6s forwards;-moz-animation:scale-down .6s forwards;animation:scale-down .6s forwards}.no-csstransitions .cd-headline.scale i{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1);opacity:0}.no-csstransitions .cd-headline.scale .is-visible i{opacity:1}@-webkit-keyframes scale-up{0%{-webkit-transform:scale(0);opacity:0}60%{-webkit-transform:scale(1.2);opacity:1}100%{-webkit-transform:scale(1);opacity:1}}@-moz-keyframes scale-up{0%{-moz-transform:scale(0);opacity:0}60%{-moz-transform:scale(1.2);opacity:1}100%{-moz-transform:scale(1);opacity:1}}@keyframes scale-up{0%{-webkit-transform:scale(0);-moz-transform:scale(0);-ms-transform:scale(0);-o-transform:scale(0);transform:scale(0);opacity:0}60%{-webkit-transform:scale(1.2);-moz-transform:scale(1.2);-ms-transform:scale(1.2);-o-transform:scale(1.2);transform:scale(1.2);opacity:1}100%{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1);opacity:1}}@-webkit-keyframes scale-down{0%{-webkit-transform:scale(1);opacity:1}60%{-webkit-transform:scale(0);opacity:0}}@-moz-keyframes scale-down{0%{-moz-transform:scale(1);opacity:1}60%{-moz-transform:scale(0);opacity:0}}@keyframes scale-down{0%{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1);opacity:1}60%{-webkit-transform:scale(0);-moz-transform:scale(0);-ms-transform:scale(0);-o-transform:scale(0);transform:scale(0);opacity:0}}.cd-headline.push b{opacity:0}.cd-headline.push b.is-visible{opacity:1;-webkit-animation:push-in .6s;-moz-animation:push-in .6s;animation:push-in .6s}.cd-headline.push b.is-hidden{-webkit-animation:push-out .6s;-moz-animation:push-out .6s;animation:push-out .6s}@-webkit-keyframes push-in{0%{opacity:0;-webkit-transform:translateX(-100%)}60%{opacity:1;-webkit-transform:translateX(10%)}100%{opacity:1;-webkit-transform:translateX(0)}}@-moz-keyframes push-in{0%{opacity:0;-moz-transform:translateX(-100%)}60%{opacity:1;-moz-transform:translateX(10%)}100%{opacity:1;-moz-transform:translateX(0)}}@keyframes push-in{0%{opacity:0;-webkit-transform:translateX(-100%);-moz-transform:translateX(-100%);-ms-transform:translateX(-100%);-o-transform:translateX(-100%);transform:translateX(-100%)}60%{opacity:1;-webkit-transform:translateX(10%);-moz-transform:translateX(10%);-ms-transform:translateX(10%);-o-transform:translateX(10%);transform:translateX(10%)}100%{opacity:1;-webkit-transform:translateX(0);-moz-transform:translateX(0);-ms-transform:translateX(0);-o-transform:translateX(0);transform:translateX(0)}}@-webkit-keyframes push-out{0%{opacity:1;-webkit-transform:translateX(0)}60%{opacity:0;-webkit-transform:translateX(110%)}100%{opacity:0;-webkit-transform:translateX(100%)}}@-moz-keyframes push-out{0%{opacity:1;-moz-transform:translateX(0)}60%{opacity:0;-moz-transform:translateX(110%)}100%{opacity:0;-moz-transform:translateX(100%)}}@keyframes push-out{0%{opacity:1;-webkit-transform:translateX(0);-moz-transform:translateX(0);-ms-transform:translateX(0);-o-transform:translateX(0);transform:translateX(0)}60%{opacity:0;-webkit-transform:translateX(110%);-moz-transform:translateX(110%);-ms-transform:translateX(110%);-o-transform:translateX(110%);transform:translateX(110%)}100%{opacity:0;-webkit-transform:translateX(100%);-moz-transform:translateX(100%);-ms-transform:translateX(100%);-o-transform:translateX(100%);transform:translateX(100%)}} /*--------------------------------------------------------------------------------*/ /* 2.SLICK SLIDER | 1.8.0 /*--------------------------------------------------------------------------------*/ .slick-list,.slick-slider,.slick-track{position:relative;display:block}.slick-loading .slick-slide,.slick-loading .slick-track{visibility:hidden}.slick-list{overflow:hidden;margin:0;padding:0}.slick-list:focus{outline:0}.slick-list.dragging{cursor:pointer;cursor:hand}.slick-slider .slick-list,.slick-slider .slick-track{-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.slick-track{top:0;left:0;margin-left:auto;margin-right:auto}.slick-track:after,.slick-track:before{display:table;content:''}.slick-track:after{clear:both}.slick-slide{display:none;float:left;height:100%;min-height:1px}[dir=rtl] .slick-slide{float:right}.slick-slide img{display:block}.slick-slide.slick-loading img{display:none}.slick-slide.dragging img{pointer-events:none}.slick-initialized .slick-slide{display:block}.slick-vertical .slick-slide{display:block;height:auto;border:1px solid transparent}.slick-arrow.slick-hidden{display:none} .slick-vertical .slick-slide { outline: none !important; } /*SLICK THEME.CSS*/ @charset 'UTF-8';.slick-dots,.slick-next,.slick-prev{position:absolute;display:block;padding:0}.slick-dots li button:before,.slick-next:before,.slick-prev:before{font-family:slick;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.slick-loading .slick-list{background:url(ajax-loader.gif) center center no-repeat #fff}@font-face{font-family:slick;font-weight:400;font-style:normal;src:url(fonts/slick.eot);src:url(fonts/slick.eot?#iefix) format('embedded-opentype'),url(fonts/slick.woff) format('woff'),url(fonts/slick.ttf) format('truetype'),url(fonts/slick.svg#slick) format('svg')}.slick-next,.slick-prev{font-size:0;line-height:0;top:50%;width:20px;height:20px;-webkit-transform:translate(0,-50%);-ms-transform:translate(0,-50%);transform:translate(0,-50%);cursor:pointer;color:transparent;border:none;outline:0;background:0 0}.slick-next:focus,.slick-next:hover,.slick-prev:focus,.slick-prev:hover{color:transparent;outline:0;background:0 0}.slick-next:focus:before,.slick-next:hover:before,.slick-prev:focus:before,.slick-prev:hover:before{opacity:1}.slick-next.slick-disabled:before,.slick-prev.slick-disabled:before{opacity:.25}.slick-next:before,.slick-prev:before{font-size:20px;line-height:1;opacity:.75;color:#fff}.slick-prev{left:-25px}[dir=rtl] .slick-prev{right:-25px;left:auto}.slick-prev:before{content:'←'}.slick-next:before,[dir=rtl] .slick-prev:before{content:'→'}.slick-next{right:-25px}[dir=rtl] .slick-next{right:auto;left:-25px}[dir=rtl] .slick-next:before{content:'←'}.slick-dotted.slick-slider{margin-bottom:30px}.slick-dots{bottom:-25px;width:100%;margin:0;list-style:none;text-align:center}.slick-dots li{position:relative;display:inline-block;width:20px;height:20px;margin:0 5px;padding:0;cursor:pointer}.slick-dots li button{font-size:0;line-height:0;display:block;width:20px;height:20px;padding:5px;cursor:pointer;color:transparent;border:0;outline:0;background:0 0}.slick-dots li button:focus,.slick-dots li button:hover{outline:0}.slick-dots li button:focus:before,.slick-dots li button:hover:before{opacity:1}.slick-dots li button:before{font-size:6px;line-height:20px;position:absolute;top:0;left:0;width:20px;height:20px;content:'•';text-align:center;opacity:.25;color:#000}.slick-dots li.slick-active button:before{opacity:.75;color:#000} /*--------------------------------------------------------------------------------*/ /* 2. OWL CAROUSEL 2 /*--------------------------------------------------------------------------------*/ .owl-carousel,.owl-carousel .owl-item{-webkit-tap-highlight-color:transparent;position:relative}.owl-carousel{display:none;width:100%;z-index:1}.owl-carousel .owl-stage{position:relative;-ms-touch-action:pan-Y;-moz-backface-visibility:hidden}.owl-carousel .owl-stage:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0}.owl-carousel .owl-stage-outer{position:relative;overflow:hidden;-webkit-transform:translate3d(0,0,0)}.owl-carousel .owl-item,.owl-carousel .owl-wrapper{-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-ms-backface-visibility:hidden;-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0)}.owl-carousel .owl-item{min-height:1px;float:left;-webkit-backface-visibility:hidden;-webkit-touch-callout:none}.owl-carousel .owl-item img{display:block;width:100%}.owl-carousel .owl-dots.disabled,.owl-carousel .owl-nav.disabled{display:none}.no-js .owl-carousel,.owl-carousel.owl-loaded{display:block}.owl-carousel .owl-dot,.owl-carousel .owl-nav .owl-next,.owl-carousel .owl-nav .owl-prev{cursor:pointer;cursor:hand;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel.owl-loading{opacity:0;display:block}.owl-carousel.owl-hidden{opacity:0}.owl-carousel.owl-refresh .owl-item{visibility:hidden}.owl-carousel.owl-drag .owl-item{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel.owl-grab{cursor:move;cursor:grab}.owl-carousel.owl-rtl{direction:rtl}.owl-carousel.owl-rtl .owl-item{float:right}.owl-carousel .animated{animation-duration:1s;animation-fill-mode:both}.owl-carousel .owl-animated-in{z-index:0}.owl-carousel .owl-animated-out{z-index:1}.owl-carousel .fadeOut{animation-name:fadeOut}@keyframes fadeOut{0%{opacity:1}100%{opacity:0}}.owl-height{transition:height .5s ease-in-out}.owl-carousel .owl-item .owl-lazy{opacity:0;transition:opacity .4s ease}.owl-carousel .owl-item img.owl-lazy{transform-style:preserve-3d}.owl-carousel .owl-video-wrapper{position:relative;height:100%;background:#000}.owl-carousel .owl-video-play-icon{position:absolute;height:80px;width:80px;left:50%;top:50%;margin-left:-40px;margin-top:-40px;background:url(owl.video.play.png) no-repeat;cursor:pointer;z-index:1;-webkit-backface-visibility:hidden;transition:transform .1s ease}.owl-carousel .owl-video-play-icon:hover{-ms-transform:scale(1.3,1.3);transform:scale(1.3,1.3)}.owl-carousel .owl-video-playing .owl-video-play-icon,.owl-carousel .owl-video-playing .owl-video-tn{display:none}.owl-carousel .owl-video-tn{opacity:0;height:100%;background-position:center center;background-repeat:no-repeat;background-size:contain;transition:opacity .4s ease}.owl-carousel .owl-video-frame{position:relative;z-index:1;height:100%;width:100%} /* Default theme - Owl Carousel CSS File */ .owl-theme .owl-nav { margin-top: 10px; text-align: center; -webkit-tap-highlight-color: transparent; } .owl-theme .owl-nav [class*='owl-'] { color: #FFF; font-size: 14px; margin: 5px; padding: 4px 7px; background: #D6D6D6; display: inline-block; cursor: pointer; border-radius: 3px; } .owl-theme .owl-nav [class*='owl-']:hover { background: #869791; color: #FFF; text-decoration: none; } .owl-theme .owl-nav .disabled { opacity: 0.5; cursor: default; } .owl-theme .owl-nav.disabled + .owl-dots { margin-top: 10px; } .owl-theme .owl-dots { text-align: center; -webkit-tap-highlight-color: transparent; } .owl-theme .owl-dots .owl-dot { display: inline-block; zoom: 1; *display: inline; } .owl-theme .owl-dots .owl-dot span { width: 10px; height: 10px; margin: 5px 7px; background: #D6D6D6; display: block; -webkit-backface-visibility: visible; transition: opacity 200ms ease; border-radius: 30px; } .owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span { background: #869791; } /*--------------------------------------------------------------------------------*/ /* 2.LIGHTBOX /*--------------------------------------------------------------------------------*/ .lb-loader,.lightbox{text-align:center;line-height:0}.lb-dataContainer:after,.lb-outerContainer:after{content:"";clear:both}html.lb-disable-scrolling{overflow:hidden;position:fixed;height:100vh;width:100vw}.lightboxOverlay{position:absolute;top:0;left:0;z-index:9999;background-color:#000;filter:alpha(Opacity=80);opacity:.8;display:none}.lightbox{position:absolute;left:0;width:100%;z-index:10000;font-weight:400}.lightbox .lb-image{display:block;height:auto;max-width:inherit;max-height:none;border-radius:3px;border:4px solid #fff}.lightbox a img{border:none}.lb-outerContainer{position:relative;width:250px;height:250px;margin:0 auto;border-radius:4px;background-color:#fff}.lb-loader,.lb-nav{position:absolute;left:0}.lb-outerContainer:after{display:table}.lb-loader{top:43%;height:25%;width:100%}.lb-cancel{display:block;width:32px;height:32px;margin:0 auto;background:url(../images/loading.gif) no-repeat}.lb-nav{top:0;height:100%;width:100%;z-index:10}.lb-container>.nav{left:0}.lb-nav a{outline:0;background-image:url(data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==)}.lb-next,.lb-prev{height:100%;cursor:pointer;display:block}.lb-nav a.lb-prev{width:34%;left:0;float:left;background:url(../images/prev.png) left 48% no-repeat;filter:alpha(Opacity=0);opacity:0;-webkit-transition:opacity .6s;-moz-transition:opacity .6s;-o-transition:opacity .6s;transition:opacity .6s}.lb-nav a.lb-prev:hover{filter:alpha(Opacity=100);opacity:1}.lb-nav a.lb-next{width:64%;right:0;float:right;background:url(../images/next.png) right 48% no-repeat;filter:alpha(Opacity=0);opacity:0;-webkit-transition:opacity .6s;-moz-transition:opacity .6s;-o-transition:opacity .6s;transition:opacity .6s}.lb-nav a.lb-next:hover{filter:alpha(Opacity=100);opacity:1}.lb-dataContainer{margin:0 auto;padding-top:5px;width:100%;border-bottom-left-radius:4px;border-bottom-right-radius:4px}.lb-dataContainer:after{display:table}.lb-data{padding:0 4px;color:#ccc}.lb-data .lb-details{width:85%;float:left;text-align:left;line-height:1.1em}.lb-data .lb-caption{font-size:13px;font-weight:700;line-height:1em}.lb-data .lb-caption a{color:#4ae}.lb-data .lb-number{display:block;clear:left;padding-bottom:1em;font-size:12px;color:#999}.lb-data .lb-close{display:block;float:right;width:30px;height:30px;background:url(../images/close.png) top right no-repeat;text-align:right;outline:0;filter:alpha(Opacity=70);opacity:.7;-webkit-transition:opacity .2s;-moz-transition:opacity .2s;-o-transition:opacity .2s;transition:opacity .2s}.lb-data .lb-close:hover{cursor:pointer;filter:alpha(Opacity=100);opacity:1} /*--------------------------------------------------------------------------------*/ /* 2.ANIMATED LINKS | /*https://tympanus.net/codrops/2013/08/06/creative-link-effects/*/ /*--------------------------------------------------------------------------------*/ .cl-effect-5 a { overflow: hidden; padding: 0 4px; height: 44px !important; } nav a,nav a:focus,nav a:hover{outline:0}.cl-effect-2 a span,nav a{position:relative;display:inline-block}nav a{margin:15px 25px;color:#fff;text-shadow:0 0 1px rgba(255,255,255,.3)}.cl-effect-1 a::after,.cl-effect-1 a::before{display:inline-block;opacity:0;-webkit-transition:-webkit-transform .3s,opacity .2s;-moz-transition:-moz-transform .3s,opacity .2s;transition:transform .3s,opacity .2s}.cl-effect-1 a::before{margin-right:10px;content:'[';-webkit-transform:translateX(20px);-moz-transform:translateX(20px);transform:translateX(20px)}.cl-effect-1 a::after{margin-left:10px;content:']';-webkit-transform:translateX(-20px);-moz-transform:translateX(-20px);transform:translateX(-20px)}.cl-effect-1 a:focus::after,.cl-effect-1 a:focus::before,.cl-effect-1 a:hover::after,.cl-effect-1 a:hover::before{opacity:1;-webkit-transform:translateX(0);-moz-transform:translateX(0);transform:translateX(0)}.cl-effect-2 a{line-height:44px;-webkit-perspective:1000px;-moz-perspective:1000px;perspective:1000px}.cl-effect-2 a span{padding:0 14px;background:#2195de;-webkit-transition:-webkit-transform .3s;-moz-transition:-moz-transform .3s;transition:transform .3s;-webkit-transform-origin:50% 0;-moz-transform-origin:50% 0;transform-origin:50% 0;-webkit-transform-style:preserve-3d;-moz-transform-style:preserve-3d;transform-style:preserve-3d}.csstransforms3d .cl-effect-2 a span::before{position:absolute;top:100%;left:0;width:100%;height:100%;background:#0965a0;content:attr(data-hover);-webkit-transition:background .3s;-moz-transition:background .3s;transition:background .3s;-webkit-transform:rotateX(-90deg);-moz-transform:rotateX(-90deg);transform:rotateX(-90deg);-webkit-transform-origin:50% 0;-moz-transform-origin:50% 0;transform-origin:50% 0}.cl-effect-3 a::after,.cl-effect-4 a::after{left:0;content:'';position:absolute;top:100%;width:100%}.cl-effect-2 a:focus span,.cl-effect-2 a:hover span{-webkit-transform:rotateX(90deg) translateY(-22px);-moz-transform:rotateX(90deg) translateY(-22px);transform:rotateX(90deg) translateY(-22px)}.csstransforms3d .cl-effect-2 a:focus span::before,.csstransforms3d .cl-effect-2 a:hover span::before{background:#28a2ee}.cl-effect-3 a{padding:8px 0}.cl-effect-3 a::after{height:4px;background:rgba(0,0,0,.1);opacity:0;-webkit-transition:opacity .3s,-webkit-transform .3s;-moz-transition:opacity .3s,-moz-transform .3s;transition:opacity .3s,transform .3s;-webkit-transform:translateY(10px);-moz-transform:translateY(10px);transform:translateY(10px)}.cl-effect-3 a:focus::after,.cl-effect-3 a:hover::after{opacity:1;-webkit-transform:translateY(0);-moz-transform:translateY(0);transform:translateY(0)}.cl-effect-4 a{padding:0 0 10px}.cl-effect-4 a::after{height:1px;background:#fff;opacity:0;-webkit-transition:height .3s,opacity .3s,-webkit-transform .3s;-moz-transition:height .3s,opacity .3s,-moz-transform .3s;transition:height .3s,opacity .3s,transform .3s;-webkit-transform:translateY(-10px);-moz-transform:translateY(-10px);transform:translateY(-10px)}.cl-effect-4 a:focus::after,.cl-effect-4 a:hover::after{height:5px;opacity:1;-webkit-transform:translateY(0);-moz-transform:translateY(0);transform:translateY(0)}.cl-effect-5 a{overflow:hidden;padding:0 4px;height:1em}.cl-effect-5 a span{position:relative;display:block;-webkit-transition:-webkit-transform .3s;-moz-transition:-moz-transform .3s;transition:transform .3s}.cl-effect-5 a span::before{position:absolute;top:100%;content:attr(data-hover);-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.cl-effect-6 a::after,.cl-effect-6 a::before,.cl-effect-7 a::after,.cl-effect-7 a::before,.cl-effect-8 a::after,.cl-effect-8 a::before,.cl-effect-9 a::after,.cl-effect-9 a::before{position:absolute;left:0;content:''}.cl-effect-5 a:focus span,.cl-effect-5 a:hover span{-webkit-transform:translateY(-100%);-moz-transform:translateY(-100%);transform:translateY(-100%)}.cl-effect-6 a{margin:0 10px;padding:10px 20px}.cl-effect-6 a::before{top:0;width:100%;height:2px;background:#fff;-webkit-transition:top .3s;-moz-transition:top .3s;transition:top .3s}.cl-effect-6 a::after{top:0;width:2px;height:2px;background:#fff;-webkit-transition:height .3s;-moz-transition:height .3s;transition:height .3s}.cl-effect-10 a span,.cl-effect-7 a::after,.cl-effect-7 a::before{-webkit-transition:-webkit-transform .3s;-moz-transition:-moz-transform .3s}.cl-effect-6 a:hover::before{top:100%;opacity:1}.cl-effect-6 a:hover::after{height:100%}.cl-effect-7 a{padding:12px 10px 10px;color:#566473;text-shadow:none;font-weight:700}.cl-effect-7 a::after,.cl-effect-7 a::before{top:100%;width:100%;height:3px;background:#566473;transition:transform .3s;-webkit-transform:scale(.85);-moz-transform:scale(.85);transform:scale(.85)}.cl-effect-7 a::after{opacity:0;-webkit-transition:top .3s,opacity .3s,-webkit-transform .3s;-moz-transition:top .3s,opacity .3s,-moz-transform .3s;transition:top .3s,opacity .3s,transform .3s}.cl-effect-8 a::after,.cl-effect-8 a::before,.cl-effect-9 a::after{-webkit-transition:-webkit-transform .3s,opacity .3s;-moz-transition:-moz-transform .3s,opacity .3s}.cl-effect-7 a:focus::after,.cl-effect-7 a:focus::before,.cl-effect-7 a:hover::after,.cl-effect-7 a:hover::before{-webkit-transform:scale(1);-moz-transform:scale(1);transform:scale(1)}.cl-effect-7 a:focus::after,.cl-effect-7 a:hover::after{top:0;opacity:1}.cl-effect-8 a{padding:10px 20px}.cl-effect-8 a::after,.cl-effect-8 a::before{top:0;width:100%;height:100%;border:3px solid #354856;transition:transform .3s,opacity .3s}.cl-effect-8 a::after{border-color:#fff;opacity:0;-webkit-transform:translateY(-7px) translateX(6px);-moz-transform:translateY(-7px) translateX(6px);transform:translateY(-7px) translateX(6px)}.cl-effect-8 a:focus::before,.cl-effect-8 a:hover::before{opacity:0;-webkit-transform:translateY(5px) translateX(-5px);-moz-transform:translateY(5px) translateX(-5px);transform:translateY(5px) translateX(-5px)}.cl-effect-8 a:focus::after,.cl-effect-8 a:hover::after{opacity:1;-webkit-transform:translateY(0) translateX(0);-moz-transform:translateY(0) translateX(0);transform:translateY(0) translateX(0)}.cl-effect-9 a{margin:0 20px;padding:18px 20px}.cl-effect-9 a::after,.cl-effect-9 a::before{top:0;width:100%;height:1px;background:#fff;opacity:.2;-webkit-transition:opacity .3s,height .3s;-moz-transition:opacity .3s,height .3s;transition:opacity .3s,height .3s}.cl-effect-9 a::after{top:100%;opacity:0;transition:transform .3s,opacity .3s;-webkit-transform:translateY(-10px);-moz-transform:translateY(-10px);transform:translateY(-10px)}.cl-effect-9 a span:first-child{z-index:2;display:block}.cl-effect-9 a span:last-child{z-index:1;display:block;opacity:0;-webkit-transition:-webkit-transform .3s,opacity .3s;-moz-transition:-moz-transform .3s,opacity .3s;transition:transform .3s,opacity .3s;-webkit-transform:translateY(-100%);-moz-transform:translateY(-100%);transform:translateY(-100%)}.cl-effect-9 a:focus::before,.cl-effect-9 a:hover::before{height:6px}.cl-effect-9 a:focus span:last-child,.cl-effect-9 a:focus::after,.cl-effect-9 a:focus::before,.cl-effect-9 a:hover span:last-child,.cl-effect-9 a:hover::after,.cl-effect-9 a:hover::before{opacity:1;-webkit-transform:translateY(0);-moz-transform:translateY(0);transform:translateY(0)}.cl-effect-10{position:relative;z-index:1}.cl-effect-10 a::before,.cl-effect-11 a::before{position:absolute;top:0;left:0;content:attr(data-hover)}.cl-effect-10 a{overflow:hidden;margin:0 15px}.cl-effect-10 a span{display:block;padding:10px 20px;background:#0f7c67;transition:transform .3s}.cl-effect-10 a::before{z-index:-1;padding:10px 20px;width:100%;height:100%;background:#fff;color:#0f7c67;-webkit-transition:-webkit-transform .3s;-moz-transition:-moz-transform .3s;transition:transform .3s;-webkit-transform:translateX(-25%)}.cl-effect-10 a:focus span,.cl-effect-10 a:hover span{-webkit-transform:translateX(100%);-moz-transform:translateX(100%);transform:translateX(100%)}.cl-effect-10 a:focus::before,.cl-effect-10 a:hover::before{-webkit-transform:translateX(0);-moz-transform:translateX(0);transform:translateX(0)}.cl-effect-11 a::before{overflow:hidden;max-width:0;-webkit-transition:max-width .5s;-moz-transition:max-width .5s;transition:max-width .5s}.cl-effect-12 a::after,.cl-effect-12 a::before,.cl-effect-15 a::before{position:absolute;-webkit-transition:-webkit-transform .3s,opacity .3s;-moz-transition:-moz-transform .3s,opacity .3s}.cl-effect-11 a:focus::before,.cl-effect-11 a:hover::before{max-width:100%}.cl-effect-12 a::after,.cl-effect-12 a::before{top:50%;left:50%;width:100px;height:100px;border:2px solid rgba(0,0,0,.1);border-radius:50%;content:'';opacity:0;transition:transform .3s,opacity .3s;-webkit-transform:translateX(-50%) translateY(-50%) scale(.2);-moz-transform:translateX(-50%) translateY(-50%) scale(.2);transform:translateX(-50%) translateY(-50%) scale(.2)}.cl-effect-12 a::after{width:90px;height:90px;border-width:6px;-webkit-transform:translateX(-50%) translateY(-50%) scale(.8);-moz-transform:translateX(-50%) translateY(-50%) scale(.8);transform:translateX(-50%) translateY(-50%) scale(.8)}.cl-effect-12 a:focus::after,.cl-effect-12 a:focus::before,.cl-effect-12 a:hover::after,.cl-effect-12 a:hover::before{opacity:1;-webkit-transform:translateX(-50%) translateY(-50%) scale(1);-moz-transform:translateX(-50%) translateY(-50%) scale(1);transform:translateX(-50%) translateY(-50%) scale(1)}.cl-effect-13 a{-webkit-transition:color .3s;-moz-transition:color .3s;transition:color .3s}.cl-effect-13 a::before{position:absolute;top:100%;left:50%;color:transparent;content:'•';text-shadow:0 0 transparent;font-size:1.2em;-webkit-transition:text-shadow .3s,color .3s;-moz-transition:text-shadow .3s,color .3s;transition:text-shadow .3s,color .3s;-webkit-transform:translateX(-50%);-moz-transform:translateX(-50%);transform:translateX(-50%);pointer-events:none}.cl-effect-13 a:focus::before,.cl-effect-13 a:hover::before{color:#fff;text-shadow:10px 0 #fff,-10px 0 #fff}.cl-effect-13 a:focus,.cl-effect-13 a:hover{color:#ba7700}.cl-effect-14 a{padding:0 20px;height:45px;line-height:45px}.cl-effect-14 a::after,.cl-effect-14 a::before{position:absolute;width:45px;height:2px;background:#fff;content:'';opacity:.2;-webkit-transition:all .3s;-moz-transition:all .3s;transition:all .3s;pointer-events:none}.cl-effect-14 a::before{top:0;left:0;-webkit-transform:rotate(90deg);-moz-transform:rotate(90deg);transform:rotate(90deg);-webkit-transform-origin:0 0;-moz-transform-origin:0 0;transform-origin:0 0}.cl-effect-14 a::after{right:0;bottom:0;-webkit-transform:rotate(90deg);-moz-transform:rotate(90deg);transform:rotate(90deg);-webkit-transform-origin:100% 0;-moz-transform-origin:100% 0;transform-origin:100% 0}.cl-effect-14 a:focus::after,.cl-effect-14 a:focus::before,.cl-effect-14 a:hover::after,.cl-effect-14 a:hover::before{opacity:1}.cl-effect-14 a:focus::before,.cl-effect-14 a:hover::before{left:50%;-webkit-transform:rotate(0) translateX(-50%);-moz-transform:rotate(0) translateX(-50%);transform:rotate(0) translateX(-50%)}.cl-effect-14 a:focus::after,.cl-effect-14 a:hover::after{right:50%;-webkit-transform:rotate(0) translateX(50%);-moz-transform:rotate(0) translateX(50%);transform:rotate(0) translateX(50%)}.cl-effect-15 a{color:rgba(0,0,0,.2);font-weight:700;text-shadow:none}.cl-effect-15 a::before{color:#fff;content:attr(data-hover);transition:transform .3s,opacity .3s}.cl-effect-16 a::before,.cl-effect-17 a::before{content:attr(data-hover);-webkit-transition:-webkit-transform .3s,opacity .3s;-moz-transition:-moz-transform .3s,opacity .3s;position:absolute}.cl-effect-15 a:focus::before,.cl-effect-15 a:hover::before{-webkit-transform:scale(.9);-moz-transform:scale(.9);transform:scale(.9);opacity:0}.cl-effect-16 a{color:#6f8686;text-shadow:0 0 1px rgba(111,134,134,.3)}.cl-effect-16 a::before{color:#fff;opacity:0;text-shadow:0 0 1px rgba(255,255,255,.3);-webkit-transform:scale(1.1) translateX(10px) translateY(-10px) rotate(4deg);-moz-transform:scale(1.1) translateX(10px) translateY(-10px) rotate(4deg);transform:scale(1.1) translateX(10px) translateY(-10px) rotate(4deg);transition:transform .3s,opacity .3s;pointer-events:none}.cl-effect-16 a:focus::before,.cl-effect-16 a:hover::before{-webkit-transform:scale(1) translateX(0) translateY(0) rotate(0);-moz-transform:scale(1) translateX(0) translateY(0) rotate(0);transform:scale(1) translateX(0) translateY(0) rotate(0);opacity:1}.cl-effect-17 a{color:#10649b;text-shadow:none;padding:10px 0}.cl-effect-17 a::before{color:#fff;text-shadow:0 0 1px rgba(255,255,255,.3);transition:transform .3s,opacity .3s;pointer-events:none}.cl-effect-17 a::after,.cl-effect-18 a::after,.cl-effect-18 a::before{width:100%;left:0;height:2px;content:'';pointer-events:none}.cl-effect-17 a::after{position:absolute;bottom:0;background:#fff;opacity:0;-webkit-transform:translateY(5px);-moz-transform:translateY(5px);transform:translateY(5px);-webkit-transition:-webkit-transform .3s,opacity .3s;-moz-transition:-moz-transform .3s,opacity .3s;transition:transform .3s,opacity .3s}.cl-effect-17 a:focus::before,.cl-effect-17 a:hover::before{opacity:0;-webkit-transform:translateY(-2px);-moz-transform:translateY(-2px);transform:translateY(-2px)}.cl-effect-17 a:focus::after,.cl-effect-17 a:hover::after{opacity:1;-webkit-transform:translateY(0);-moz-transform:translateY(0);transform:translateY(0)}.cl-effect-18{position:relative;z-index:1}.cl-effect-18 a{padding:0 5px;color:#b4770d;font-weight:700;-webkit-transition:color .3s;-moz-transition:color .3s;transition:color .3s}.cl-effect-18 a::after,.cl-effect-18 a::before{position:absolute;top:50%;margin-top:-1px;background:#b4770d;z-index:-1;-webkit-transition:-webkit-transform .3s,opacity .3s;-moz-transition:-moz-transform .3s,opacity .3s;transition:transform .3s,opacity .3s}.cl-effect-18 a::before{-webkit-transform:translateY(-20px);-moz-transform:translateY(-20px);transform:translateY(-20px)}.cl-effect-18 a::after{-webkit-transform:translateY(20px);-moz-transform:translateY(20px);transform:translateY(20px)}.cl-effect-18 a:focus,.cl-effect-18 a:hover{color:#fff}.cl-effect-18 a:focus::after,.cl-effect-18 a:focus::before,.cl-effect-18 a:hover::after,.cl-effect-18 a:hover::before{opacity:.7}.cl-effect-18 a:focus::before,.cl-effect-18 a:hover::before{-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);transform:rotate(45deg)}.cl-effect-18 a:focus::after,.cl-effect-18 a:hover::after{-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);transform:rotate(-45deg)}.cl-effect-19 a{line-height:2em;margin:15px;-webkit-perspective:800px;-moz-perspective:800px;perspective:800px;width:200px}.cl-effect-19 a span{position:relative;display:inline-block;width:100%;padding:0 14px;background:#e35041;-webkit-transition:-webkit-transform .4s,background .4s;-moz-transition:-moz-transform .4s,background .4s;transition:transform .4s,background .4s;-webkit-transform-style:preserve-3d;-moz-transform-style:preserve-3d;transform-style:preserve-3d;-webkit-transform-origin:50% 50% -100px;-moz-transform-origin:50% 50% -100px;transform-origin:50% 50% -100px}.csstransforms3d .cl-effect-19 a span::before{position:absolute;top:0;left:100%;width:100%;height:100%;background:#b53a2d;content:attr(data-hover);-webkit-transition:background .4s;-moz-transition:background .4s;transition:background .4s;-webkit-transform:rotateY(90deg);-moz-transform:rotateY(90deg);transform:rotateY(90deg);-webkit-transform-origin:0 50%;-moz-transform-origin:0 50%;transform-origin:0 50%;pointer-events:none}.cl-effect-19 a:focus span,.cl-effect-19 a:hover span{background:#b53a2d;-webkit-transform:rotateY(-90deg);-moz-transform:rotateY(-90deg);transform:rotateY(-90deg)}.csstransforms3d .cl-effect-19 a:focus span::before,.csstransforms3d .cl-effect-19 a:hover span::before{background:#ef5e50}.cl-effect-20 a{line-height:2em;-webkit-perspective:800px;-moz-perspective:800px;perspective:800px}.cl-effect-20 a span{position:relative;display:inline-block;padding:3px 15px 0;background:#587285;box-shadow:inset 0 3px #2f4351;-webkit-transition:background .6s;-moz-transition:background .6s;transition:background .6s;-webkit-transform-style:preserve-3d;-moz-transform-style:preserve-3d;transform-style:preserve-3d;-webkit-transform-origin:0 50%;-moz-transform-origin:0 50%;transform-origin:0 50%}.cl-effect-20 a span::before{position:absolute;top:0;left:0;width:100%;height:100%;background:#fff;color:#2f4351;content:attr(data-hover);-webkit-transform:rotateX(270deg);-moz-transform:rotateX(270deg);transform:rotateX(270deg);-webkit-transition:-webkit-transform .6s;-moz-transition:-moz-transform .6s;transition:transform .6s;-webkit-transform-origin:0 0;-moz-transform-origin:0 0;transform-origin:0 0;pointer-events:none}.cl-effect-20 a:focus span,.cl-effect-20 a:hover span{background:#2f4351}.cl-effect-20 a:focus span::before,.cl-effect-20 a:hover span::before{-webkit-transform:rotateX(10deg);-moz-transform:rotateX(10deg);transform:rotateX(10deg)}.cl-effect-21 a{padding:10px;color:#237546;font-weight:700;text-shadow:none;-webkit-transition:color .3s;-moz-transition:color .3s;transition:color .3s}.cl-effect-21 a::after,.cl-effect-21 a::before{position:absolute;left:0;width:100%;height:2px;background:#fff;content:'';opacity:0;-webkit-transition:opacity .3s,-webkit-transform .3s;-moz-transition:opacity .3s,-moz-transform .3s;transition:opacity .3s,transform .3s}.cl-effect-21 a::before{top:0;-webkit-transform:translateY(-10px);-moz-transform:translateY(-10px);transform:translateY(-10px)}.cl-effect-21 a::after{bottom:0;-webkit-transform:translateY(10px);-moz-transform:translateY(10px);transform:translateY(10px)}.cl-effect-21 a:focus,.cl-effect-21 a:hover{color:#fff}.cl-effect-21 a:focus::after,.cl-effect-21 a:focus::before,.cl-effect-21 a:hover::after,.cl-effect-21 a:hover::before{opacity:1;-webkit-transform:translateY(0);-moz-transform:translateY(0);transform:translateY(0)} /*--------------------------------------------------------------------------------*/ /* 2.LMAGINIFIC POPUP /*--------------------------------------------------------------------------------*/ .mfp-bg { top: 0; left: 0; width: 100%; height: 100%; z-index: 1042; overflow: hidden; position: fixed; background: #0b0b0b; opacity: 0.8; } .mfp-wrap { top: 0; left: 0; width: 100%; height: 100%; z-index: 1043; position: fixed; outline: none !important; -webkit-backface-visibility: hidden; } .mfp-container { text-align: center; position: absolute; width: 100%; height: 100%; left: 0; top: 0; padding: 0 8px; box-sizing: border-box; } .mfp-container:before { content: ''; display: inline-block; height: 100%; vertical-align: middle; } .mfp-align-top .mfp-container:before { display: none; } .mfp-content { position: relative; display: inline-block; vertical-align: middle; margin: 0 auto; text-align: left; z-index: 1045; } .mfp-inline-holder .mfp-content, .mfp-ajax-holder .mfp-content { width: 100%; cursor: auto; } .mfp-ajax-cur { cursor: progress; } .mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close { cursor: -moz-zoom-out; cursor: -webkit-zoom-out; cursor: zoom-out; } .mfp-zoom { cursor: pointer; cursor: -webkit-zoom-in; cursor: -moz-zoom-in; cursor: zoom-in; } .mfp-auto-cursor .mfp-content { cursor: auto; } .mfp-close, .mfp-arrow, .mfp-preloader, .mfp-counter { -webkit-user-select: none; -moz-user-select: none; user-select: none; } .mfp-loading.mfp-figure { display: none; } .mfp-hide { display: none !important; } .mfp-preloader { color: #CCC; position: absolute; top: 50%; width: auto; text-align: center; margin-top: -0.8em; left: 8px; right: 8px; z-index: 1044; } .mfp-preloader a { color: #CCC; } .mfp-preloader a:hover { color: #FFF; } .mfp-s-ready .mfp-preloader { display: none; } .mfp-s-error .mfp-content { display: none; } button.mfp-close, button.mfp-arrow { overflow: visible; cursor: pointer; background: transparent; border: 0; -webkit-appearance: none; display: block; outline: none; padding: 0; z-index: 1046; box-shadow: none; touch-action: manipulation; } button::-moz-focus-inner { padding: 0; border: 0; } .mfp-close { width: 44px; height: 44px; line-height: 44px; position: absolute; right: 0; top: 0; text-decoration: none; text-align: center; opacity: 0.65; padding: 0 0 18px 10px; color: #FFF; font-style: normal; font-size: 28px; font-family: Arial, Baskerville, monospace; } .mfp-close:hover, .mfp-close:focus { opacity: 1; } .mfp-close:active { top: 1px; } .mfp-close-btn-in .mfp-close { color: #333; } .mfp-image-holder .mfp-close, .mfp-iframe-holder .mfp-close { color: #FFF; right: -6px; text-align: right; padding-right: 6px; width: 100%; } .mfp-counter { position: absolute; top: 0; right: 0; color: #CCC; font-size: 12px; line-height: 18px; white-space: nowrap; } .mfp-arrow { position: absolute; opacity: 0.65; margin: 0; top: 50%; margin-top: -55px; padding: 0; width: 90px; height: 110px; -webkit-tap-highlight-color: transparent; } .mfp-arrow:active { margin-top: -54px; } .mfp-arrow:hover, .mfp-arrow:focus { opacity: 1; } .mfp-arrow:before, .mfp-arrow:after { content: ''; display: block; width: 0; height: 0; position: absolute; left: 0; top: 0; margin-top: 35px; margin-left: 35px; border: medium inset transparent; } .mfp-arrow:after { border-top-width: 13px; border-bottom-width: 13px; top: 8px; } .mfp-arrow:before { border-top-width: 21px; border-bottom-width: 21px; opacity: 0.7; } .mfp-arrow-left { left: 0; } .mfp-arrow-left:after { border-right: 17px solid #FFF; margin-left: 31px; } .mfp-arrow-left:before { margin-left: 25px; border-right: 27px solid #3F3F3F; } .mfp-arrow-right { right: 0; } .mfp-arrow-right:after { border-left: 17px solid #FFF; margin-left: 39px; } .mfp-arrow-right:before { border-left: 27px solid #3F3F3F; } .mfp-iframe-holder { padding-top: 40px; padding-bottom: 40px; } .mfp-iframe-holder .mfp-content { line-height: 0; width: 100%; max-width: 900px; } .mfp-iframe-holder .mfp-close { top: -40px; } .mfp-iframe-scaler { width: 100%; height: 0; overflow: hidden; padding-top: 56.25%; } .mfp-iframe-scaler iframe { position: absolute; display: block; top: 0; left: 0; width: 100%; height: 100%; box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); background: #000; } /* Main image in popup */ img.mfp-img { width: auto; max-width: 100%; height: auto; display: block; line-height: 0; box-sizing: border-box; padding: 40px 0 40px; margin: 0 auto; } /* The shadow behind the image */ .mfp-figure { line-height: 0; } .mfp-figure:after { content: ''; position: absolute; left: 0; top: 40px; bottom: 40px; display: block; right: 0; width: auto; height: auto; z-index: -1; box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); background: #444; } .mfp-figure small { color: #BDBDBD; display: block; font-size: 12px; line-height: 14px; } .mfp-figure figure { margin: 0; } .mfp-bottom-bar { margin-top: -36px; position: absolute; top: 100%; left: 0; width: 100%; cursor: auto; } .mfp-title { text-align: left; line-height: 18px; color: #F3F3F3; word-wrap: break-word; padding-right: 36px; } .mfp-image-holder .mfp-content { max-width: 100%; } .mfp-gallery .mfp-image-holder .mfp-figure { cursor: pointer; } @media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) { /** * Remove all paddings around the image on small screen */ .mfp-img-mobile .mfp-image-holder { padding-left: 0; padding-right: 0; } .mfp-img-mobile img.mfp-img { padding: 0; } .mfp-img-mobile .mfp-figure:after { top: 0; bottom: 0; } .mfp-img-mobile .mfp-figure small { display: inline; margin-left: 5px; } .mfp-img-mobile .mfp-bottom-bar { background: rgba(0, 0, 0, 0.6); bottom: 0; margin: 0; top: auto; padding: 3px 5px; position: fixed; box-sizing: border-box; } .mfp-img-mobile .mfp-bottom-bar:empty { padding: 0; } .mfp-img-mobile .mfp-counter { right: 5px; top: 3px; } .mfp-img-mobile .mfp-close { top: 0; right: 0; width: 35px; height: 35px; line-height: 35px; background: rgba(0, 0, 0, 0.6); position: fixed; text-align: center; padding: 0; } } @media all and (max-width: 900px) { .mfp-arrow { -webkit-transform: scale(0.75); transform: scale(0.75); } .mfp-arrow-left { -webkit-transform-origin: 0; transform-origin: 0; } .mfp-arrow-right { -webkit-transform-origin: 100%; transform-origin: 100%; } .mfp-container { padding-left: 6px; padding-right: 6px; } } /*MOUSE PARALLAX */ .ld-smart-container { position: absolute; z-index: 2; width: 100%; height: 100%; overflow: hidden; } .ld-overlap-container { position: absolute; } .ld-smart-container .ld-3d-parent { width: 100%; height: 100%; pointer-events: none; transform-style: preserve-3d; perspective: 9000px; opacity: 1; position: relative; } .ld-smart-container .ld-transform-target { position: relative; -webkit-transform-style: flat; -webkit-backface-visibility: hidden; -webkit-transform: translate3d(0px, 0px, 0px); width: 100%; height: 100%; pointer-events: none; transform-style: preserve-3d; } .ld-smart-container .ld-3d-object { position: absolute; pointer-events: none; -webkit-transform-style: flat; -webkit-backface-visibility: hidden; -webkit-transform: translate3d(0px, 0px, 0px); transform-style: preserve-3d; -webkit-perspective: 1000; backface-visibility: hidden; perspective: 1000px; } /*SVG SLIDER CSS*/ .js .loading::after,.js .loading::before{content:'';position:fixed;z-index:100000}.hidden,.slide,.slideshow{overflow:hidden}.slidenav__item:focus,a{outline:0}.slide__desc,.slide__title{cursor:default;position:relative}.codrops-links,.demos,.slide__desc,.slidenav{text-align:center}.demo-1{--color-text:#000;--color-bg:#f1f1f1;--color-link:#000;--color-link-hover:#0e54c1;--color-stitle:#000;--fontsize-stitle:12vw;--color-sdesc:#000;--color-slink:#000;--color-slink-hover:#000;--color-slink-bg:#fff;--color-slink-hover-bg:#0e54c1;--color-nav:#000;--color-nav-hover:#0E54CA}.demo-2{--color-text:#fff;--color-bg:#000;--color-link:#fff;--color-link-hover:#37dbff;--color-stitle:#eaff68;--fontsize-stitle:12vw;--color-sdesc:#fff;--color-slink:#f1f1f1;--color-slink-hover:#000;--color-slink-bg:#000;--color-slink-hover-bg:#37dbff;--color-nav:#f1f1f1;--color-nav-hover:#37dbff}.demo-3{--color-text:#fff;--color-bg:#333;--color-link:#fff;--color-link-hover:#ED4264;--color-stitle:#f1f1f1;--fontsize-stitle:12vw;--color-sdesc:#f1f1f1;--color-slink:#f1f1f1;--color-slink-hover:#f1f1f1;--color-slink-bg:#000;--color-slink-hover-bg:#ED4264;--color-nav:#ED4264;--color-nav-hover:#000}.demo-4{--color-text:#000;--color-bg:#f1f1f1;--color-link:#000;--color-link-hover:#74c3d0;--color-stitle:#000;--fontsize-stitle:8vw;--color-nav:#74c3d0;--color-nav-hover:#000}.demo-5{--color-text:#fff;--color-bg:#576267;--color-link:#000;--color-link-hover:#da281b;--color-stitle:#000;--fontsize-stitle:12vw;--color-sdesc:#f1f1f1;--color-slink:#f1f1f1;--color-slink-hover:#f1f1f1;--color-slink-bg:#000;--color-slink-hover-bg:#da281b;--color-nav:#f1f1f1;--color-nav-hover:#da281b}.demo-6{--color-text:#fff;--color-bg:#020202;--color-link:#fff;--color-link-hover:#415bf8;--color-stitle:#f1f1f1;--fontsize-stitle:12vw;--color-nav:#fff;--color-nav-hover:#415bf8}.js body{opacity:0;transition:opacity .3s}.js body.render{opacity:1}.js .loading::before{top:0;left:0;width:100%;height:100%;background:var(--color-bg)}.js .loading::after{top:50%;left:50%;width:60px;height:60px;margin:-30px 0 0 -30px;pointer-events:none;border-radius:50%;opacity:.4;background:var(--color-link);animation:loaderAnim .7s linear infinite alternate forwards}@keyframes loaderAnim{to{opacity:1;transform:scale3d(.5,.5,1)}}a{text-decoration:none;color:var(--color-link)}a:focus,a:hover{color:var(--color-link-hover);outline:0}.hidden{position:absolute;width:0;height:0;pointer-events:none}.content,main{position:relative}.icon{display:block;width:1.5em;height:1.5em;margin:0 auto;fill:currentColor}.icon--arrow-rot{transform:rotate(180deg)}main{width:100%}.content{display:flex;justify-content:center;align-items:center;margin:0 auto;min-height:100vh}.content--fixed{position:fixed;z-index:10000;top:0;left:0;display:grid;align-content:space-between;width:100%;max-width:none;min-height:0;height:100vh;padding:1.5em;pointer-events:none;grid-template-columns:50% 50%;grid-template-rows:auto auto 4em;grid-template-areas:'header github' '... ...' '... demos'}.codrops-header,.codrops-links,.demos,.slideshow{position:relative}.content--fixed a{pointer-events:auto}.demo span,.slide,a.demo--current{pointer-events:none}.codrops-header{z-index:100;display:flex;flex-direction:row;align-items:flex-start;align-items:center;align-self:start;grid-area:header;justify-self:start}.codrops-header__title{font-size:1em;font-weight:400;margin:0;padding:0}.github{display:block;align-self:start;grid-area:github;justify-self:end;padding:.5em 0}.demos{display:block;align-self:end;grid-area:demos}.demo{margin:0 .15em}.demo:focus,.demo:hover{opacity:.5}.demo span{white-space:nowrap;text-transform:lowercase}.demo span::before{content:'#'}.codrops-links{display:flex;justify-content:center;margin:0 1em 0 0;white-space:nowrap}.codrops-icon{display:inline-block;margin:.15em;padding:.25em}.slideshow{width:100%;height:100vh}.slide,.slides{width:100%;height:100%}.shape,.slide,.slide__img,.slidenav,.slides{position:absolute}.slide{opacity:0;display:flex;flex-direction:column;align-content:center;justify-content:center;align-items:center}.slide--current{opacity:1;pointer-events:auto}.slide__img{top:-200px;left:-200px;width:calc(100% + 400px);height:calc(100% + 400px);background-size:cover;background-position:50% 50%}.slidenav{width:300px;margin-left:-150px;left:50%;bottom:0;padding:2em}.slidenav__item{border:0;background:0 0;font-weight:700;color:var(--color-nav)}.slidenav__item:hover{color:var(--color-nav-hover)}.shape{width:100%;height:100%;fill:var(--color-shape-fill);top:0;pointer-events:none}.slide__title{font-size:var(--fontsize-stitle);margin:0;line-height:1;color:var(--color-stitle)}.slide__desc{font-size:1.5em;margin:0 0 2em;color:var(--color-sdesc);padding:0 1em}.slide__link{position:relative;font-size:1em;font-weight:700;padding:1em 2em;display:block;color:var(--color-slink);background:var(--color-slink-bg);transition:color .3s,background .3s}.slide__link:hover{color:var(--color-slink-hover);background:var(--color-slink-hover-bg)}@media screen and (min-width:55em){.demos{display:flex;justify-self:end}.demo{display:block;width:17px;height:17px;margin:0 4px;border-radius:50%;background:var(--color-link)}a.demo--current{background:var(--color-link-hover)}.demo span{line-height:1;position:absolute;right:100%;display:none;margin:0 1em 0 0}.demo--current span{display:block}}@media screen and (max-width:55em){body{padding:0 0 4em}.content{flex-direction:column;height:auto;min-height:0;padding-bottom:10em}.content--fixed{position:relative;z-index:1000;display:block;padding:.85em}.codrops-header{flex-direction:column;align-items:center}.codrops-header__title{font-weight:700;padding-bottom:.25em;text-align:center}.github{display:none}.codrops-links{margin:0}.slide__desc{font-size:1em}.slide__link{font-size:.85em}} /* VEGAS MIN.CSS */ .vegas-overlay,.vegas-slide,.vegas-slide-inner,.vegas-timer,.vegas-wrapper{position:absolute;top:0;left:0;bottom:0;right:0;overflow:hidden;border:none;padding:0;margin:0}.vegas-overlay{opacity:.5;background:url(overlays/02.png) center center}.vegas-timer{top:auto;bottom:0;height:2px}.vegas-timer-progress{width:0;height:100%;background:#fff;-webkit-transition:width ease-out;transition:width ease-out}.vegas-timer-running .vegas-timer-progress{width:100%}.vegas-slide,.vegas-slide-inner{margin:0;padding:0;background:center center no-repeat;-webkit-transform:translateZ(0);transform:translateZ(0);will-change:transform,opacity}body .vegas-container{overflow:hidden!important;position:relative}.vegas-video{min-width:100%;min-height:100%;width:auto;height:auto}body.vegas-container{overflow:auto;position:static;z-index:-2}body.vegas-container>.vegas-overlay,body.vegas-container>.vegas-slide,body.vegas-container>.vegas-timer{position:fixed;z-index:-1}:root body.vegas-container>.vegas-overlay,:root body.vegas-container>.vegas-slide,_::full-page-media,_:future{bottom:-76px}.vegas-transition-blur,.vegas-transition-blur2{opacity:0;-webkit-filter:blur(32px);filter:blur(32px)}.vegas-transition-blur-in,.vegas-transition-blur2-in{opacity:1;-webkit-filter:blur(0);filter:blur(0)}.vegas-transition-blur2-out{opacity:0}.vegas-transition-burn,.vegas-transition-burn2{opacity:0;-webkit-filter:contrast(1000%) saturate(1000%);filter:contrast(1000%) saturate(1000%)}.vegas-transition-burn-in,.vegas-transition-burn2-in{opacity:1;-webkit-filter:contrast(100%) saturate(100%);filter:contrast(100%) saturate(100%)}.vegas-transition-burn2-out{opacity:0;-webkit-filter:contrast(1000%) saturate(1000%);filter:contrast(1000%) saturate(1000%)}.vegas-transition-fade,.vegas-transition-fade2{opacity:0}.vegas-transition-fade-in,.vegas-transition-fade2-in{opacity:1}.vegas-transition-fade2-out{opacity:0}.vegas-transition-flash,.vegas-transition-flash2{opacity:0;-webkit-filter:brightness(25);filter:brightness(25)}.vegas-transition-flash-in,.vegas-transition-flash2-in{opacity:1;-webkit-filter:brightness(1);filter:brightness(1)}.vegas-transition-flash2-out{opacity:0;-webkit-filter:brightness(25);filter:brightness(25)}.vegas-transition-negative,.vegas-transition-negative2{opacity:0;-webkit-filter:invert(100%);filter:invert(100%)}.vegas-transition-negative-in,.vegas-transition-negative2-in{opacity:1;-webkit-filter:invert(0);filter:invert(0)}.vegas-transition-negative2-out{opacity:0;-webkit-filter:invert(100%);filter:invert(100%)}.vegas-transition-slideDown,.vegas-transition-slideDown2{-webkit-transform:translateY(-100%);transform:translateY(-100%)}.vegas-transition-slideDown-in,.vegas-transition-slideDown2-in{-webkit-transform:translateY(0);transform:translateY(0)}.vegas-transition-slideDown2-out{-webkit-transform:translateY(100%);transform:translateY(100%)}.vegas-transition-slideLeft,.vegas-transition-slideLeft2{-webkit-transform:translateX(100%);transform:translateX(100%)}.vegas-transition-slideLeft-in,.vegas-transition-slideLeft2-in{-webkit-transform:translateX(0);transform:translateX(0)}.vegas-transition-slideLeft2-out,.vegas-transition-slideRight,.vegas-transition-slideRight2{-webkit-transform:translateX(-100%);transform:translateX(-100%)}.vegas-transition-slideRight-in,.vegas-transition-slideRight2-in{-webkit-transform:translateX(0);transform:translateX(0)}.vegas-transition-slideRight2-out{-webkit-transform:translateX(100%);transform:translateX(100%)}.vegas-transition-slideUp,.vegas-transition-slideUp2{-webkit-transform:translateY(100%);transform:translateY(100%)}.vegas-transition-slideUp-in,.vegas-transition-slideUp2-in{-webkit-transform:translateY(0);transform:translateY(0)}.vegas-transition-slideUp2-out{-webkit-transform:translateY(-100%);transform:translateY(-100%)}.vegas-transition-swirlLeft,.vegas-transition-swirlLeft2{-webkit-transform:scale(2) rotate(35deg);transform:scale(2) rotate(35deg);opacity:0}.vegas-transition-swirlLeft-in,.vegas-transition-swirlLeft2-in{-webkit-transform:scale(1) rotate(0);transform:scale(1) rotate(0);opacity:1}.vegas-transition-swirlLeft2-out,.vegas-transition-swirlRight,.vegas-transition-swirlRight2{-webkit-transform:scale(2) rotate(-35deg);transform:scale(2) rotate(-35deg);opacity:0}.vegas-transition-swirlRight-in,.vegas-transition-swirlRight2-in{-webkit-transform:scale(1) rotate(0);transform:scale(1) rotate(0);opacity:1}.vegas-transition-swirlRight2-out{-webkit-transform:scale(2) rotate(35deg);transform:scale(2) rotate(35deg);opacity:0}.vegas-transition-zoomIn,.vegas-transition-zoomIn2{-webkit-transform:scale(0);transform:scale(0);opacity:0}.vegas-transition-zoomIn-in,.vegas-transition-zoomIn2-in{-webkit-transform:scale(1);transform:scale(1);opacity:1}.vegas-transition-zoomIn2-out,.vegas-transition-zoomOut,.vegas-transition-zoomOut2{-webkit-transform:scale(2);transform:scale(2);opacity:0}.vegas-transition-zoomOut-in,.vegas-transition-zoomOut2-in{-webkit-transform:scale(1);transform:scale(1);opacity:1}.vegas-transition-zoomOut2-out{-webkit-transform:scale(0);transform:scale(0);opacity:0}.vegas-animation-kenburns{-webkit-animation:kenburns ease-out;animation:kenburns ease-out}@-webkit-keyframes kenburns{0%{-webkit-transform:scale(1.5);transform:scale(1.5)}100%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes kenburns{0%{-webkit-transform:scale(1.5);transform:scale(1.5)}100%{-webkit-transform:scale(1);transform:scale(1)}}.vegas-animation-kenburnsDownLeft{-webkit-animation:kenburnsDownLeft ease-out;animation:kenburnsDownLeft ease-out}@-webkit-keyframes kenburnsDownLeft{0%{-webkit-transform:scale(1.5) translate(10%,-10%);transform:scale(1.5) translate(10%,-10%)}100%{-webkit-transform:scale(1) translate(0,0);transform:scale(1) translate(0,0)}}@keyframes kenburnsDownLeft{0%{-webkit-transform:scale(1.5) translate(10%,-10%);transform:scale(1.5) translate(10%,-10%)}100%{-webkit-transform:scale(1) translate(0,0);transform:scale(1) translate(0,0)}}.vegas-animation-kenburnsDownRight{-webkit-animation:kenburnsDownRight ease-out;animation:kenburnsDownRight ease-out}@-webkit-keyframes kenburnsDownRight{0%{-webkit-transform:scale(1.5) translate(-10%,-10%);transform:scale(1.5) translate(-10%,-10%)}100%{-webkit-transform:scale(1) translate(0,0);transform:scale(1) translate(0,0)}}@keyframes kenburnsDownRight{0%{-webkit-transform:scale(1.5) translate(-10%,-10%);transform:scale(1.5) translate(-10%,-10%)}100%{-webkit-transform:scale(1) translate(0,0);transform:scale(1) translate(0,0)}}.vegas-animation-kenburnsDown{-webkit-animation:kenburnsDown ease-out;animation:kenburnsDown ease-out}@-webkit-keyframes kenburnsDown{0%{-webkit-transform:scale(1.5) translate(0,-10%);transform:scale(1.5) translate(0,-10%)}100%{-webkit-transform:scale(1) translate(0,0);transform:scale(1) translate(0,0)}}@keyframes kenburnsDown{0%{-webkit-transform:scale(1.5) translate(0,-10%);transform:scale(1.5) translate(0,-10%)}100%{-webkit-transform:scale(1) translate(0,0);transform:scale(1) translate(0,0)}}.vegas-animation-kenburnsLeft{-webkit-animation:kenburnsLeft ease-out;animation:kenburnsLeft ease-out}@-webkit-keyframes kenburnsLeft{0%{-webkit-transform:scale(1.5) translate(10%,0);transform:scale(1.5) translate(10%,0)}100%{-webkit-transform:scale(1) translate(0,0);transform:scale(1) translate(0,0)}}@keyframes kenburnsLeft{0%{-webkit-transform:scale(1.5) translate(10%,0);transform:scale(1.5) translate(10%,0)}100%{-webkit-transform:scale(1) translate(0,0);transform:scale(1) translate(0,0)}}.vegas-animation-kenburnsRight{-webkit-animation:kenburnsRight ease-out;animation:kenburnsRight ease-out}@-webkit-keyframes kenburnsRight{0%{-webkit-transform:scale(1.5) translate(-10%,0);transform:scale(1.5) translate(-10%,0)}100%{-webkit-transform:scale(1) translate(0,0);transform:scale(1) translate(0,0)}}@keyframes kenburnsRight{0%{-webkit-transform:scale(1.5) translate(-10%,0);transform:scale(1.5) translate(-10%,0)}100%{-webkit-transform:scale(1) translate(0,0);transform:scale(1) translate(0,0)}}.vegas-animation-kenburnsUpLeft{-webkit-animation:kenburnsUpLeft ease-out;animation:kenburnsUpLeft ease-out}@-webkit-keyframes kenburnsUpLeft{0%{-webkit-transform:scale(1.5) translate(10%,10%);transform:scale(1.5) translate(10%,10%)}100%{-webkit-transform:scale(1) translate(0,0);transform:scale(1) translate(0,0)}}@keyframes kenburnsUpLeft{0%{-webkit-transform:scale(1.5) translate(10%,10%);transform:scale(1.5) translate(10%,10%)}100%{-webkit-transform:scale(1) translate(0,0);transform:scale(1) translate(0,0)}}.vegas-animation-kenburnsUpRight{-webkit-animation:kenburnsUpRight ease-out;animation:kenburnsUpRight ease-out}@-webkit-keyframes kenburnsUpRight{0%{-webkit-transform:scale(1.5) translate(-10%,10%);transform:scale(1.5) translate(-10%,10%)}100%{-webkit-transform:scale(1) translate(0,0);transform:scale(1) translate(0,0)}}@keyframes kenburnsUpRight{0%{-webkit-transform:scale(1.5) translate(-10%,10%);transform:scale(1.5) translate(-10%,10%)}100%{-webkit-transform:scale(1) translate(0,0);transform:scale(1) translate(0,0)}}.vegas-animation-kenburnsUp{-webkit-animation:kenburnsUp ease-out;animation:kenburnsUp ease-out}@-webkit-keyframes kenburnsUp{0%{-webkit-transform:scale(1.5) translate(0,10%);transform:scale(1.5) translate(0,10%)}100%{-webkit-transform:scale(1) translate(0,0);transform:scale(1) translate(0,0)}}@keyframes kenburnsUp{0%{-webkit-transform:scale(1.5) translate(0,10%);transform:scale(1.5) translate(0,10%)}100%{-webkit-transform:scale(1) translate(0,0);transform:scale(1) translate(0,0)}} /*# sourceMappingURL=vegas.min.css.map */ .vegas-wrapper { position: absolute; top: 0; left: 0; bottom: 0; right: 0; overflow: hidden !important; border: none; padding: 0 !important; margin: 0; } /* General styles for the modal */ /* Styles for the html/body for special modal where we want 3d effects Note that we need a container wrapping all content on the page for the perspective effects (not including the modals and the overlay). */ .md-perspective, .md-perspective body { height: 100%; overflow: hidden; } .md-perspective body { background: #222; -webkit-perspective: 600px; -moz-perspective: 600px; perspective: 600px; } .md-modal { position: fixed; top: 50%; left: 50%; width: 50%; max-width: 630px; min-width: 320px; height: auto; z-index: 2000; visibility: hidden; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); } .md-show { visibility: visible; } .md-overlay { position: fixed; width: 100%; height: 100%; visibility: hidden; top: 0; left: 0; z-index: 1000; opacity: 0; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; } .md-show ~ .md-overlay { opacity: 1; visibility: visible; } /* Content styles */ .md-content { color: #222; background: #FFF ; position: relative; margin: 0 auto; } .md-content h3 { margin: 0; padding: 0.4em; text-align: center; font-size: 2.4em; font-weight: 300; opacity: 0.8; background: #111; color: #FFF; } .md-content > div { padding: 15px 40px 30px; margin: 0; font-weight: 300; font-size: 1.15em; } .md-content > div p { margin: 0; padding: 10px 0; } .md-content > div ul { margin: 0; padding: 0 0 30px 20px; } .md-content > div ul li { padding: 5px 0; } .md-content button { display: block; margin: 0 auto; font-size: 0.8em; } /* Individual modal styles with animations/transitions */ /* Effect 1: Fade in and scale up */ .md-effect-1 .md-content { -webkit-transform: scale(0.7); -moz-transform: scale(0.7); -ms-transform: scale(0.7); transform: scale(0.7); opacity: 0; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; } .md-show.md-effect-1 .md-content { -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); transform: scale(1); opacity: 1; } /* Effect 2: Slide from the right */ .md-effect-2 .md-content { -webkit-transform: translateX(20%); -moz-transform: translateX(20%); -ms-transform: translateX(20%); transform: translateX(20%); opacity: 0; -webkit-transition: all 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9); -moz-transition: all 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9); transition: all 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9); } .md-show.md-effect-2 .md-content { -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); opacity: 1; } /* Effect 3: Slide from the bottom */ .md-effect-3 .md-content { -webkit-transform: translateY(20%); -moz-transform: translateY(20%); -ms-transform: translateY(20%); transform: translateY(20%); opacity: 0; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; } .md-show.md-effect-3 .md-content { -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); opacity: 1; } /* Effect 4: Newspaper */ .md-effect-4 .md-content { -webkit-transform: scale(0) rotate(720deg); -moz-transform: scale(0) rotate(720deg); -ms-transform: scale(0) rotate(720deg); transform: scale(0) rotate(720deg); opacity: 0; } .md-show.md-effect-4 ~ .md-overlay, .md-effect-4 .md-content { -webkit-transition: all 0.5s; -moz-transition: all 0.5s; transition: all 0.5s; } .md-show.md-effect-4 .md-content { -webkit-transform: scale(1) rotate(0deg); -moz-transform: scale(1) rotate(0deg); -ms-transform: scale(1) rotate(0deg); transform: scale(1) rotate(0deg); opacity: 1; } /* Effect 5: fall */ .md-effect-5.md-modal { -webkit-perspective: 1300px; -moz-perspective: 1300px; perspective: 1300px; } .md-effect-5 .md-content { -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: translateZ(600px) rotateX(20deg); -moz-transform: translateZ(600px) rotateX(20deg); -ms-transform: translateZ(600px) rotateX(20deg); transform: translateZ(600px) rotateX(20deg); opacity: 0; } .md-show.md-effect-5 .md-content { -webkit-transition: all 0.3s ease-in; -moz-transition: all 0.3s ease-in; transition: all 0.3s ease-in; -webkit-transform: translateZ(0px) rotateX(0deg); -moz-transform: translateZ(0px) rotateX(0deg); -ms-transform: translateZ(0px) rotateX(0deg); transform: translateZ(0px) rotateX(0deg); opacity: 1; } /* Effect 6: side fall */ .md-effect-6.md-modal { -webkit-perspective: 1300px; -moz-perspective: 1300px; perspective: 1300px; } .md-effect-6 .md-content { -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: translate(30%) translateZ(600px) rotate(10deg); -moz-transform: translate(30%) translateZ(600px) rotate(10deg); -ms-transform: translate(30%) translateZ(600px) rotate(10deg); transform: translate(30%) translateZ(600px) rotate(10deg); opacity: 0; } .md-show.md-effect-6 .md-content { -webkit-transition: all 0.3s ease-in; -moz-transition: all 0.3s ease-in; transition: all 0.3s ease-in; -webkit-transform: translate(0%) translateZ(0) rotate(0deg); -moz-transform: translate(0%) translateZ(0) rotate(0deg); -ms-transform: translate(0%) translateZ(0) rotate(0deg); transform: translate(0%) translateZ(0) rotate(0deg); opacity: 1; } /* Effect 7: slide and stick to top */ .md-effect-7{ top: 0; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } .md-effect-7 .md-content { -webkit-transform: translateY(-200%); -moz-transform: translateY(-200%); -ms-transform: translateY(-200%); transform: translateY(-200%); -webkit-transition: all .3s; -moz-transition: all .3s; transition: all .3s; opacity: 0; } .md-show.md-effect-7 .md-content { -webkit-transform: translateY(0%); -moz-transform: translateY(0%); -ms-transform: translateY(0%); transform: translateY(0%); border-radius: 0 0 3px 3px; opacity: 1; } /* Effect 8: 3D flip horizontal */ .md-effect-8.md-modal { -webkit-perspective: 1300px; -moz-perspective: 1300px; perspective: 1300px; } .md-effect-8 .md-content { -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: rotateY(-70deg); -moz-transform: rotateY(-70deg); -ms-transform: rotateY(-70deg); transform: rotateY(-70deg); -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; opacity: 0; } .md-show.md-effect-8 .md-content { -webkit-transform: rotateY(0deg); -moz-transform: rotateY(0deg); -ms-transform: rotateY(0deg); transform: rotateY(0deg); opacity: 1; } /* Effect 9: 3D flip vertical */ .md-effect-9.md-modal { -webkit-perspective: 1300px; -moz-perspective: 1300px; perspective: 1300px; } .md-effect-9 .md-content { -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: rotateX(-70deg); -moz-transform: rotateX(-70deg); -ms-transform: rotateX(-70deg); transform: rotateX(-70deg); -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; opacity: 0; } .md-show.md-effect-9 .md-content { -webkit-transform: rotateX(0deg); -moz-transform: rotateX(0deg); -ms-transform: rotateX(0deg); transform: rotateX(0deg); opacity: 1; } /* Effect 10: 3D sign */ .md-effect-10.md-modal { -webkit-perspective: 1300px; -moz-perspective: 1300px; perspective: 1300px; } .md-effect-10 .md-content { -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: rotateX(-60deg); -moz-transform: rotateX(-60deg); -ms-transform: rotateX(-60deg); transform: rotateX(-60deg); -webkit-transform-origin: 50% 0; -moz-transform-origin: 50% 0; transform-origin: 50% 0; opacity: 0; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; } .md-show.md-effect-10 .md-content { -webkit-transform: rotateX(0deg); -moz-transform: rotateX(0deg); -ms-transform: rotateX(0deg); transform: rotateX(0deg); opacity: 1; } /* Effect 11: Super scaled */ .md-effect-11 .md-content { -webkit-transform: scale(2); -moz-transform: scale(2); -ms-transform: scale(2); transform: scale(2); opacity: 0; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; } .md-show.md-effect-11 .md-content { -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); transform: scale(1); opacity: 1; } /* Effect 12: Just me */ .md-effect-12 .md-content { -webkit-transform: scale(0.8); -moz-transform: scale(0.8); -ms-transform: scale(0.8); transform: scale(0.8); opacity: 0; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; } .md-show.md-effect-12 ~ .md-overlay { background: #e74c3c; } .md-effect-12 .md-content h3, .md-effect-12 .md-content { background: transparent; } .md-show.md-effect-12 .md-content { -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); transform: scale(1); opacity: 1; } /* Effect 13: 3D slit */ .md-effect-13.md-modal { -webkit-perspective: 1300px; -moz-perspective: 1300px; perspective: 1300px; } .md-effect-13 .md-content { -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: translateZ(-3000px) rotateY(90deg); -moz-transform: translateZ(-3000px) rotateY(90deg); -ms-transform: translateZ(-3000px) rotateY(90deg); transform: translateZ(-3000px) rotateY(90deg); opacity: 0; } .md-show.md-effect-13 .md-content { -webkit-animation: slit .7s forwards ease-out; -moz-animation: slit .7s forwards ease-out; animation: slit .7s forwards ease-out; } @-webkit-keyframes slit { 50% { -webkit-transform: translateZ(-250px) rotateY(89deg); opacity: .5; -webkit-animation-timing-function: ease-out;} 100% { -webkit-transform: translateZ(0) rotateY(0deg); opacity: 1; } } @-moz-keyframes slit { 50% { -moz-transform: translateZ(-250px) rotateY(89deg); opacity: .5; -moz-animation-timing-function: ease-out;} 100% { -moz-transform: translateZ(0) rotateY(0deg); opacity: 1; } } @keyframes slit { 50% { transform: translateZ(-250px) rotateY(89deg); opacity: 1; animation-timing-function: ease-in;} 100% { transform: translateZ(0) rotateY(0deg); opacity: 1; } } /* Effect 14: 3D Rotate from bottom */ .md-effect-14.md-modal { -webkit-perspective: 1300px; -moz-perspective: 1300px; perspective: 1300px; } .md-effect-14 .md-content { -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: translateY(100%) rotateX(90deg); -moz-transform: translateY(100%) rotateX(90deg); -ms-transform: translateY(100%) rotateX(90deg); transform: translateY(100%) rotateX(90deg); -webkit-transform-origin: 0 100%; -moz-transform-origin: 0 100%; transform-origin: 0 100%; opacity: 0; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .md-show.md-effect-14 .md-content { -webkit-transform: translateY(0%) rotateX(0deg); -moz-transform: translateY(0%) rotateX(0deg); -ms-transform: translateY(0%) rotateX(0deg); transform: translateY(0%) rotateX(0deg); opacity: 1; } /* Effect 15: 3D Rotate in from left */ .md-effect-15.md-modal { -webkit-perspective: 1300px; -moz-perspective: 1300px; perspective: 1300px; } .md-effect-15 .md-content { -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: translateZ(100px) translateX(-30%) rotateY(90deg); -moz-transform: translateZ(100px) translateX(-30%) rotateY(90deg); -ms-transform: translateZ(100px) translateX(-30%) rotateY(90deg); transform: translateZ(100px) translateX(-30%) rotateY(90deg); -webkit-transform-origin: 0 100%; -moz-transform-origin: 0 100%; transform-origin: 0 100%; opacity: 0; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; } .md-show.md-effect-15 .md-content { -webkit-transform: translateZ(0px) translateX(0%) rotateY(0deg); -moz-transform: translateZ(0px) translateX(0%) rotateY(0deg); -ms-transform: translateZ(0px) translateX(0%) rotateY(0deg); transform: translateZ(0px) translateX(0%) rotateY(0deg); opacity: 1; } /* Effect 16: Blur */ .md-show.md-effect-16 ~ .md-overlay { background: rgba(180,46,32,0.5); } .md-show.md-effect-16 ~ .container { -webkit-filter: blur(3px); -moz-filter: blur(3px); filter: blur(3px); } .md-effect-16 .md-content { -webkit-transform: translateY(-5%); -moz-transform: translateY(-5%); -ms-transform: translateY(-5%); transform: translateY(-5%); opacity: 0; } .md-show.md-effect-16 ~ .container, .md-effect-16 .md-content { -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; } .md-show.md-effect-16 .md-content { -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); opacity: 1; } /* Effect 17: Slide in from bottom with perspective on container */ .md-show.md-effect-17 ~ .container { height: 100%; overflow: hidden; -webkit-transition: -webkit-transform 0.3s; -moz-transition: -moz-transform 0.3s; transition: transform 0.3s; } .md-show.md-effect-17 ~ .container, .md-show.md-effect-17 ~ .md-overlay { -webkit-transform: rotateX(-2deg); -moz-transform: rotateX(-2deg); -ms-transform: rotateX(-2deg); transform: rotateX(-2deg); -webkit-transform-origin: 50% 0%; -moz-transform-origin: 50% 0%; transform-origin: 50% 0%; -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; transform-style: preserve-3d; } .md-effect-17 .md-content { opacity: 0; -webkit-transform: translateY(200%); -moz-transform: translateY(200%); -ms-transform: translateY(200%); transform: translateY(200%); } .md-show.md-effect-17 .md-content { -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); opacity: 1; -webkit-transition: all 0.3s 0.2s; -moz-transition: all 0.3s 0.2s; transition: all 0.3s 0.2s; } /* Effect 18: Slide from right with perspective on container */ .md-show.md-effect-18 ~ .container { height: 100%; overflow: hidden; } .md-show.md-effect-18 ~ .md-overlay { background: rgba(143,27,15,0.8); -webkit-transition: all 0.5s; -moz-transition: all 0.5s; transition: all 0.5s; } .md-show.md-effect-18 ~ .container, .md-show.md-effect-18 ~ .md-overlay { -webkit-transform-style: preserve-3d; -webkit-transform-origin: 0% 50%; -webkit-animation: rotateRightSideFirst 0.5s forwards ease-in; -moz-transform-style: preserve-3d; -moz-transform-origin: 0% 50%; -moz-animation: rotateRightSideFirst 0.5s forwards ease-in; transform-style: preserve-3d; transform-origin: 0% 50%; animation: rotateRightSideFirst 0.5s forwards ease-in; } @-webkit-keyframes rotateRightSideFirst { 50% { -webkit-transform: translateZ(-50px) rotateY(5deg); -webkit-animation-timing-function: ease-out; } 100% { -webkit-transform: translateZ(-200px); } } @-moz-keyframes rotateRightSideFirst { 50% { -moz-transform: translateZ(-50px) rotateY(5deg); -moz-animation-timing-function: ease-out; } 100% { -moz-transform: translateZ(-200px); } } @keyframes rotateRightSideFirst { 50% { transform: translateZ(-50px) rotateY(5deg); animation-timing-function: ease-out; } 100% { transform: translateZ(-200px); } } .md-effect-18 .md-content { -webkit-transform: translateX(200%); -moz-transform: translateX(200%); -ms-transform: translateX(200%); transform: translateX(200%); opacity: 0; } .md-show.md-effect-18 .md-content { -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); opacity: 1; -webkit-transition: all 0.5s 0.1s; -moz-transition: all 0.5s 0.1s; transition: all 0.5s 0.1s; } /* Effect 19: Slip in from the top with perspective on container */ .md-show.md-effect-19 ~ .container { height: 100%; overflow: hidden; } .md-show.md-effect-19 ~ .md-overlay { -webkit-transition: all 0.5s; -moz-transition: all 0.5s; transition: all 0.5s; } .md-show.md-effect-19 ~ .container, .md-show.md-effect-19 ~ .md-overlay { -webkit-transform-style: preserve-3d; -webkit-transform-origin: 50% 100%; -webkit-animation: OpenTop 0.5s forwards ease-in; -moz-transform-style: preserve-3d; -moz-transform-origin: 50% 100%; -moz-animation: OpenTop 0.5s forwards ease-in; transform-style: preserve-3d; transform-origin: 50% 100%; animation: OpenTop 0.5s forwards ease-in; } @-webkit-keyframes OpenTop { 50% { -webkit-transform: rotateX(10deg); -webkit-animation-timing-function: ease-out; } } @-moz-keyframes OpenTop { 50% { -moz-transform: rotateX(10deg); -moz-animation-timing-function: ease-out; } } @keyframes OpenTop { 50% { transform: rotateX(10deg); animation-timing-function: ease-out; } } .md-effect-19 .md-content { -webkit-transform: translateY(-200%); -moz-transform: translateY(-200%); -ms-transform: translateY(-200%); transform: translateY(-200%); opacity: 0; } .md-show.md-effect-19 .md-content { -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); opacity: 1; -webkit-transition: all 0.5s 0.1s; -moz-transition: all 0.5s 0.1s; transition: all 0.5s 0.1s; } @media screen and (max-width: 32em) { body { font-size: 75%; } }