@charset "UTF-8";
/* CSS Document */

/* Font - font-family: titillium-web, sans-serif; */
@import url("https://use.typekit.net/pvm0ycy.css");

html { width: 100%; height: 100%; }
body { margin: 0px; padding: 0px; width: 100%; height: 100%; background: #EEE; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 12px; color: #000; z-index: 1; -webkit-appearance: none; }
a { outline: none; cursor: pointer; }
a img { border: 0px; }
a.anchor {
    display: block;
    position: relative;
    top: -120px;
    visibility: hidden;
}
:focus { -moz-outline-style: none; outline-style: none; }
form { margin: 0px; }
a:link { color: #000000; text-decoration: none; }
a:visited { color: #000000; text-decoration: none; }
a:hover { color: #666666; text-decoration: none; }
a:active { color: #666666; text-decoration: none; }
img { border: 0px; }

.extra-small { font-size: 10px; }
.small { font-size: 11px; }
.normal { font-size: 12px; }
.medium { font-size: 14px; }
.large { font-size: 16px; }
.extra-large { font-size: 18px; }

.cyan { color: #0A9BD9;}
.orange { color: #f08107;}

.grey-extralight {color: #CCC; }
.grey-light {color: #999; }
.grey {color: #666; }
.grey-dark {color: #333; }

/* Loader */
.loader { width: 100%; height: 100%; background: #FFF url('img/loader.gif') no-repeat; background-size: 150px 150px; background-position: 50% 50%; }

/* Layout */

#wrapper { position: relative; margin: auto; width: 980px; height: auto; }

/* Disclaimer */

#disclaimer { position: relative; float: left; width: auto; height: auto; margin: 0px 0px 20px 20px; }

/* Content */

#content-gateway { position: relative; float: left; width: 980px; height: auto; margin-top: 20px; margin-bottom: 20px !important; background: url("img/cover.jpg") no-repeat top center #FFF; background-size: 100% auto;}

/* LAYOUT */

#cover { position: relative; float: left; width: 940px; height: 380px; margin: 20px 20px 20px 20px; }
#cover img { width: 60%; height: auto;}
#cover h1 { font-family: titillium-web, sans-serif; margin: 15px 0px 15px 0px; font-size: 27px; font-weight: 300; font-style: italic; color: #666; padding-bottom: 10px; border-bottom: 1px dotted #f08107; }
#cover h2 { font-family: titillium-web, sans-serif; margin: -5px 0px 15px 0px; padding: 0px; font-size: 18px; font-weight: 300; color: #0A9BD9; font-style: italic; }

#wolz { position: relative; float: left; width: 300px; height: 480px; margin: 0px 0px 20px 20px; background: url("img/gateway_wolz.jpg") no-repeat top center; background-size: contain; }

#ideck { position: relative; float: left; width: 300px; height: 480px; margin: 0px 0px 20px 20px; background: url("img/gateway_ideck.jpg") no-repeat top center; background-size: contain; }

#carrozzerie { position: relative; float: left; width: 300px; height: 480px; margin: 0px 0px 20px 20px; background: none; background-size: contain; }

#intro-text { position: relative; float: left; width: 90%; height: 115px; margin: 75px 0px 190px 0px; padding: 0% 5% 0% 5%; font-size: 14px; text-align: center; color: #333; }

#intro-buttons { position: relative; float: left; width: 90%; height: auto; padding: 0% 5% 0% 5%; }
#intro-button-wolz-www { position: relative; margin: auto; margin-bottom: 10px; width: 200px; height: auto; padding: 5px; font-size: 15px; text-align: center; color: #CCC; background: #EEE; font-weight: bold; border-radius: 5px; }
#intro-button-ideck-www { position: relative; margin: auto; margin-bottom: 10px; width: 200px; height: auto; padding: 5px; font-size: 15px; text-align: center; color: #FFF; background: #0A9BD9; font-weight: bold; border-radius: 5px; }
#intro-button-ideck-www:hover { background: #333; cursor: pointer !important; }
#intro-button-ideck-shop { position: relative; margin: auto; width: 200px; height: auto; padding: 5px; font-size: 15px; text-align: center; color: #FFF; background: #f08107; font-weight: bold; border-radius: 5px; cursor: pointer !important; }
#intro-button-ideck-shop:hover { background: #333; cursor: pointer !important; }

#footer-global-logo { position: relative; float: left; width: 940px; height: auto; padding: 10px; margin: 20px 0px 5px 20px; text-align: left; }
#footer-global-logo img { height: 40px; width: auto; }

#footer-global-contactus { position: relative; float: left; width: 440px; height: auto; padding: 20px 10px 10px 10px; margin: 0px 0px 20px 20px; border-top: 1px solid #EEE; font-size: 12px; color: #333; }

#footer-global-newsletter { position: relative; float: left; width: 440px; height: auto; padding: 20px 10px 10px 10px; margin: 0px 0px 20px 20px; border-top: 1px solid #EEE; font-size: 12px; color: #333; text-align: left; }
.button-subscribe { height: auto; width: auto; padding: 5px; border-radius: 5px; background: #666; color: #FFF; font-size: 14px; font-weight: bold; border: 0; cursor: pointer !important; margin: 0px 0px 0px 95px;}

#footer-global { position: relative; float: left; width: 930px; height: auto; margin: 0px 0px 20px 20px; text-align: center; padding: 20px 0px 0px 0px; font-size: 10px; border-top: 1px solid #EEE; }
#footer-global a:link { color: #999; text-decoration: none; }
#footer-global a:visited { color: #999; text-decoration: none; }
#footer-global a:hover { color: #333; text-decoration: none; }
#footer-global a:active { color: #333; text-decoration: none; }

/* Mobile */

@media screen and (max-width: 980px) {
#wrapper { position: relative; margin: auto; width: 100%; height: auto; padding-bottom: 20px; }
#content-gateway { position: relative; float: left; width: 100%; height: auto; margin-top: 0; margin-bottom: 3%; background: url("img/cover-mob.jpg") no-repeat top center #FFF; background-size: 100% auto;}
#cover { position: relative; float: left; width: 94%; height: 380px; margin: 20px 3% 20px 3%; text-align: center; }
#cover img { width: 100%; height: auto; }
#cover h1 { font-family: titillium-web, sans-serif; margin: 15px 0px 15px 0px; font-size: 27px; font-weight: 300; font-style: italic; color: #666; padding-bottom: 10px; border-bottom: 1px dotted #f08107; }
#cover h2 { font-family: titillium-web, sans-serif; margin: -5px 0px 15px 0px; padding: 0px; font-size: 18px; font-weight: 300; color: #0A9BD9; font-style: italic; }
#wolz { position: relative; float: left; width: 94%; height: 480px; margin: 0% 3% 3% 3%; background: url("img/gateway_wolz_mob.jpg") no-repeat top center #F5F5F5; background-size: cover; }
#ideck { position: relative; float: left; width: 94%; height: 480px; margin: 0% 3% 3% 3%; background: url("img/gateway_ideck_mob.jpg") no-repeat top center #F5F5F5; background-size: cover; }
#carrozzerie { position: relative; float: left; width: 94%; height: auto; margin: 0% 3% 3% 3%; background: none; background-size: cover; display: none; }
#footer-global { position: relative; float: left; width: 94%; margin: 0% 3% 3% 3%; }
#footer-global-logo { position: relative; float: left; width: 94%; height: auto; margin: 3% 3% 3% 3%; padding: 0px; text-align: center; }
#footer-global-contactus { position: relative; float: left; width: 94%; padding: 20px 0px 10px 0px; margin: 0% 3% 3% 3%; border-top: 1px solid #EEE; font-size: 12px; color: #333; text-align: center; }
#footer-global-newsletter { position: relative; float: left; width: 94%; padding: 20px 0px 10px 0px; margin: 0% 3% 3% 3%; border-top: 1px solid #EEE; font-size: 12px; color: #333; text-align: center; }
#footer-global-newsletter table { display: inline-block; }
.button-subscribe .button { margin: auto !important; }
}