html,body {height:100%;}
.home-background {position:fixed;z-index:-1;top:0;left:0;width:100%;height:100%;background: #000 no-repeat center center #000;background-size:cover;opacity:0;filter:alpha(opacity=0)}
.ready .home-background {opacity:1;filter:alpha(opacity=100);}

.show-when-home-ready {visibility:hidden;opacity:0;filter:alpha(opacity=0);-webkit-transition:all 1s;transition:all 1s;}
.ready .show-when-home-ready {visibility:visible;opacity:1;filter:alpha(opacity=100);-webkit-transition-delay:.5s;transition-delay:.5s;}

.call-to-action {padding:15px 0 20px;}

.section-navigation {margin:40px 5px 20px;}
.section-navigation .navigation-container {display:inline-block;margin-top:10px;padding:0 10px;height:185px;width:100%;max-width:435px;position:relative;}
.section-navigation a {position:absolute;left:10px;right:10px;bottom:0;overflow:hidden;border-radius:5px 5px 0 0;border-bottom:4px solid #44d62c;max-height:125px;-webkit-transition:all 350ms ease;transition:all 350ms ease;}
.section-navigation a:hover {max-height:185px;}
.section-navigation a:hover figcaption {color:#44d62c;text-shadow:0px 0px 7px #44d62c;}
.section-navigation a:hover figcaption span {-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0);}
.section-navigation figure {margin:0;position:relative;}
.section-navigation figure:before {content:"";position:absolute;top:0;width:40%;z-index:80;height:100%;background:-webkit-linear-gradient(to right, rgba(0,0,0,0.7), rgba(0,0,0,0));background:-webkit-linear-gradient(left, rgba(0,0,0,0.7), rgba(0,0,0,0));background:linear-gradient(to right, rgba(0,0,0,0.7), rgba(0,0,0,0));}
.section-navigation figcaption {position:absolute;top:18%;z-index:81;margin-left:10%;color:#fff;font-family:akzidenz-grotesk-condensed, 'AkzidenzGroteskCondensed', 'Trebuchet MS', Arial;font-size:45px;text-align:left;text-transform:uppercase;text-shadow:0px 0px 7px #fff;-webkit-transition:all 450ms ease;transition:all 450ms ease;}
.section-navigation figcaption span {display:block;color:#fff;text-transform:none;font-size:30px;-webkit-transform:translateY(25px);-ms-transform:translateY(25px);transform:translateY(25px);-webkit-transition:all 500ms ease;transition:all 500ms ease;text-shadow:none;}

.intro-animation {position:fixed;top:0;left:0;width:100%;height:100%;}
.ready .intro-animation {display:none;}

.intro-skip {position:absolute;z-index:1;bottom:50px;left:0;right:0;}
.intro-copy {position:absolute;top:0;left:0;right:0;bottom:0;color:#44d62c;font-family:akzidenz-grotesk-condensed, 'AkzidenzGroteskCondensed', 'Trebuchet MS', Arial;font-size:75px;font-weight:300;text-shadow:0px 0px 7px #44d62c;text-transform:uppercase;opacity:0;filter:alpha(opacity=0);-webkit-transform:translateZ(0);transform:translateZ(0);}
.intro-logo {position:absolute;right:0;top:50%;-webkit-transform:translateY(-62%);-ms-transform:translateY(-62%);transform:translateY(-62%);opacity:0;filter:alpha(opacity=0)}
.intro-logo > img {max-width:none;}

.intro-logo-siro {position:absolute;top:1314px;right:519px;opacity:0;filter:alpha(opacity=0)}
.intro-logo-partners {position:absolute;top:1298px;right:112px;opacity:0;filter:alpha(opacity=0)}
.intro-logo-partners > div {float:left;margin-right:15px;}

.homepage-progress-bar {background: #63676a; position: absolute; top: 0; left: 0; right: 0; height: 0; overflow: hidden; z-index: 25;}
.homepage-progress-bar > div {background: #00d700; width: 0%; height: 1px; overflow: hidden; -webkit-transition:all 300ms;transition:all 300ms;}
.homepage-slider {position: absolute; top: 0; left: 0; right: 0; bottom: 0; overflow: hidden; z-index: 1;}
.homepage-slider .scroller {width: 100%; height: 120%; overflow: hidden;}
.homepage-slider .wrapper {height: 100vh; display: block;}
.homepage-slider .item {width: 100vw; height: 100vh; background-size: cover; background-position: center center; float: left; display: block; vertical-align: middle; text-align: center; position: relative; overflow: hidden;}
.homepage-slider .item h2 {font-family:akzidenz-grotesk-condensed, 'AkzidenzGroteskCondensed', 'Trebuchet MS', Arial; font-size:70px; text-transform:uppercase; font-weight: 300; margin: 0; padding: 0;}
.homepage-slider .item p {font-family:akzidenz-grotesk-condensed, 'AkzidenzGroteskCondensed', 'Trebuchet MS', Arial; font-size:28px; font-weight: 300; margin: 0 auto 40px auto; padding: 0; max-width: 600px;}
.homepage-slider .item a.cta {color:#44d62c; font-family:akzidenz-grotesk-condensed, 'AkzidenzGroteskCondensed', 'Trebuchet MS', Arial; font-size:18px; font-weight: 400; margin: 0; background: #ffffff; padding: 12px 36px; border-radius: 30px; text-transform: uppercase;}
.homepage-slider .item a.cta:hover {background:#44d62c; color: #ffffff;}
.homepage-slider .item a.play {background: url('../images/play_button.png'); width: 44px; height: 44px; background-size: 44px 44px; display: block; margin: 60px auto 30px auto;}
.homepage-slider .item .video {position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 1; width: 100%; height: 100%;}
.homepage-slider .item .video video {position: absolute; display: block; top: 50%; left: 50%; -webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); min-width: 100%; min-height: 100%; width: auto; height: auto; outline: 2px solid #000;}
.homepage-slider .item .video::before {content: ''; display: block; width: 100%; height: 20%; position: absolute; left: 0; top: 0; z-index: 10; background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.00)); background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.00)); background-image: -ms-linear-gradient(top, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.00)); background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.00)); background-image: linear-gradient(top, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.00)); }
.homepage-slider .item .video::after {content: ''; display: block; width: 100%; height: 20%; position: absolute; left: 0; bottom: 0; z-index: 10; background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.000), rgba(0, 0, 0, 0.4)); background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0.000), rgba(0, 0, 0, 0.4)); background-image: -ms-linear-gradient(top, rgba(0, 0, 0, 0.000), rgba(0, 0, 0, 0.4)); background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0.000), rgba(0, 0, 0, 0.4)); background-image: linear-gradient(top, rgba(0, 0, 0, 0.000), rgba(0, 0, 0, 0.4)); }
.homepage-slider .item .content {position: relative; z-index: 2; display: table; vertical-align: middle; width: 100vw; height: 75vh;}
.homepage-slider .item.video .content {height: 100vh;}
.homepage-slider .item .cell {display: table-cell; vertical-align: middle; width: 100%; height: 100%;}
.homepage-slider .controls > button {position: absolute; z-index: 20; top: 48%; left: 15px; background: none; border: none; cursor: pointer; outline:none; font-size: 0;}
.homepage-slider .controls > button.next {left: auto; right: 15px;}
.homepage-slider .controls > button::before {font-size:2.6rem; font-family:"siro" !important; font-style:normal !important;font-weight:normal !important;font-variant:normal !important;text-transform:none !important;speak:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}
.homepage-slider .controls > button.prev::before {content:"e";}
.homepage-slider .controls > button.next::before {content:"f";}
.homepage-slider .controls .whats-siro {position: absolute; bottom: 25px; left: 50%; width: 200px; margin: 0 0 0 -100px; text-align: center; z-index: 20; text-transform: uppercase; color: #ffffff; font-family:akzidenz-grotesk-condensed, 'AkzidenzGroteskCondensed', 'Trebuchet MS', Arial;font-size:18px;font-weight: 400; text-decoration: underline;}
.homepage-slider .controls .pages {display: none; position: absolute; bottom: 25px; left: 55px; width: 200px; font-size:26px; color: #274049; font-family:akzidenz-grotesk-condensed, 'AkzidenzGroteskCondensed', 'Trebuchet MS', Arial;}
.homepage-slider .controls .pages .of {color: #999;}
.homepage-slider .item.white h2 {color: #ffffff}
.homepage-slider .item.white p {color: #ffffff}
.homepage-slider.white .controls > button {color: #ffffff}
.homepage-slider .item.dark h2 {color:#4a7729;}
.homepage-slider .item.dark p {color:#274049;}
.homepage-slider.dark .controls > button {color:#274049;}
.homepage-slider .item.green h2 {color: #44d62c}
.homepage-slider .item.green p {color: #ffffff;}
.homepage-slider.green .controls > button {color: #ffffff;}
.homepage-slider a:hover,
.homepage-slider a:active,
.homepage-slider a:focus,
.homepage-slider a {outline: 0;}

body.home:before {z-index: 15; pointer-events: none;}
body.home .home-background {z-index: 15; pointer-events: none;}
body.home #workspace header {position:relative;z-index:20;}
body.home #workspace:before {position:relative;z-index:15; pointer-events: none;}

.homepage-social {position: absolute; z-index: 10; bottom: 20px; right: 55px; width: 300px; text-align: right;}
.homepage-social li {display: inline-block; margin: 0 0 0 14px;}
.homepage-social a {color: #ffffff; font-size: 24px; }

@media (min-width: 641px) and (max-width: 1024px) {
    h1 {margin-top:.5em;margin-bottom:.5em;}
    .section-navigation .navigation-container {height:125px;}
    .section-navigation .text-right, .section-navigation .text-left {text-align:center;}
}

@media (max-width: 640px) {
    h1 {margin-top:.5em;margin-bottom:.5em;padding-left:20px;padding-right:20px;}
    .section-navigation .navigation-container {height:125px;}
    .section-navigation .text-right, .section-navigation .text-left {text-align:center;}

    .homepage-slider .item .cell {padding: 0 40px;}
    .homepage-slider .item h2 {font-size: 46px; line-height: 1.2;}
    .homepage-slider .item p {line-height: 1.2; font-size: 18px;}
    .homepage-slider .item a.cta {padding: 10px 26px;}
    .homepage-slider .item a.play {margin: 20px auto 0 auto;}
    .homepage-slider .controls .pages {display: none;}
    .homepage-slider .controls .whats-siro {bottom: 17px; font-size: 16px; left: 20px; text-align: left; margin: 0;}
    .homepage-slider .controls > button {left: 10px;}
    .homepage-slider .controls > button.next {right: 10px;}
    .homepage-social {right: 20px; bottom: 16px;}
    .homepage-social li {margin-left: 5px;}

    .homepage-slider .item .video {display: none;}
    .homepage-slider .item .video video {display: none;}
}
