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

body { padding-top: 87px; font-family:'Open Sans', Arial, Helvetica, sans-serif; font-size:15px; }

.wrapper { width:calc(100% - 2rem); width:-webkit-calc(100% - 2rem); max-width:1450px; }

.button-orange { background:#f58220; padding:.5rem 2rem; font-size:.9rem; color:#fff; text-decoration:none; text-transform:uppercase; display:inline-block; }
input.button-orange { border:0; line-height:1em; }

/* Site Header */

.site-header { position:fixed; top:0; left:0; width:100%; z-index: 5; background-color: #fff; white-space:nowrap; overflow:hidden; }
.site-header .logo { background:url(../splash-images/logos/icity.png) center center no-repeat #fff; background-size:contain; height:87px; width:157px; display:inline-block; float:left; position:relative; }

.site-header__beta { float: right; position: relative; }
.site-header__beta-obj { height: 87px; padding-left: 15px; padding-right: 15px; display: table-cell; vertical-align: middle; text-align: center; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.site-header__beta-obj br { display: none; }
.site-header__beta-obj.button-orange { padding-left: 45px; padding-right: 45px; font-size: 16px; }

.site-header__gamma { display: none; }

.site-header .sharethis-wrapper { width: 55px; height: 55px; display: inline-block; }

@media screen and (max-width: 640px) {
    body { padding-top: 60px; }
    .site-header .logo { width: 108px; height:60px; }
    .site-header__beta-obj { height: 60px; padding-left: 10px; padding-right: 10px; }
    .site-header__beta-obj.button-orange { padding-left: 20px; padding-right: 20px; }
    .site-header .sharethis-wrapper { width: 40px; height: 40px; }
}

@media (max-width: 530px) {
    body { padding-top: calc(17% + 20px); }
    .hide-for-small { display: none; }
    .site-header__gamma { display: block; clear: both; }
    .site-header__gamma-ticket-btn { width: 100%; vertical-align: middle; }
}

@media screen and (max-width: 440px) {
    .site-header__beta-obj br { display: block; }
    .site-header__beta-obj.button-orange { font-size: 14px; }
}

/* Site Footer */

.site-footer { background:url(../splash-images/contents/footer.jpg) left center no-repeat #000; background-size:cover; padding-bottom:2rem; }
.site-footer .panel-1 { float:left; }
.site-footer .panel-1 .footer-column { padding-top:2.4rem; border-right:1px solid #2f2f2f; display:inline-block; font-size:.9rem; padding-right:3rem; margin-right:3rem; color:#666; vertical-align:top; }
.site-footer .panel-1 .footer-column:last-child { border-right:0; padding-right:0; margin-right:0; }
.site-footer .panel-1 .footer-column .title { color:#FFF; font-size:20px; font-weight:500; margin-bottom:1rem; text-transform:uppercase; }
.site-footer .panel-1 .footer-column a { color:#f58220; text-decoration:none; }
.site-footer .panel-2 { float:right; padding-top:2.4rem; position:relative; color:#fff; text-transform:uppercase; }
.site-footer .panel-2 .logo-iberhad { position:absolute; bottom:0; right:0; background:url(../splash-images/logos/iberhad.png) no-repeat; background-size:contain; height:68px; width:115px; }
.site-footer .panel-2 .social-media { margin-top: -0.5rem; font-size: 14px; font-weight: 600; }
.site-footer .panel-2 .social-media-text { display: inline-block; margin-top: 0.5rem; }
.site-footer .panel-2 .social-media img { margin: 0.5rem 0.5rem 0 0; vertical-align: top; }
.site-footer .panel-2 .social-media-link { display: inline-block; margin-top: 0.5rem; color: #f58220; text-decoration: none; }
.site-footer .panel-2 .social-media-link img { position: relative; top: -6px; vertical-align: middle; }
.site-footer .panel-3 { float:left; font-size:12px; color:#666; padding-top: 0.3rem; }
.site-footer .panel-3 a { color:#666; text-decoration:none; }
.site-footer .panel-4 { float:right; text-align:right; font-size:12px; color:#666; padding-top:.3rem; }

@media screen and (max-width: 1250px) {
    .site-footer .panel-2 { width:200px; }
}

@media screen and (max-width: 1100px) {
    .site-footer .panel-1 { width:100%; }
    .site-footer .panel-1 .footer-column { width:calc(25% - 5rem); width:-webkit-calc(25% - 5rem); width:-ms-calc(25% - 5rem); }
    .site-footer .panel-2 { float:left; width:100%; text-align:center; height:auto !important; padding-bottom:70px; }
    .site-footer .panel-2 .social-media { display: inline-block; padding: 15px 0; text-align: left; }
    .site-footer .panel-2 .social-media-text,
    .site-footer .panel-2 .social-media-link { margin-left: 0.5em; }
    .site-footer .panel-2 .social-media .line-break { display: none; }
}

@media screen and (max-width: 850px) {
    .site-footer .panel-1 .footer-column { margin-right:1.1rem; padding-right:1.1rem; width:calc(25% - 2rem); width:-webkit-calc(25% - 2rem); width:-ms-calc(25% - 2rem); }
}

@media screen and (max-width: 640px) {
    .site-footer .panel-1 .footer-column { margin-right:1.5rem; padding-right:1.5rem; width:calc(50% - 2rem); width:-webkit-calc(50% - 2rem); width:-ms-calc(50% - 2rem); }
    .site-footer .panel-1 .footer-column:nth-child(2) { border-right:0; padding-right:0; margin-right:0; }
    .site-footer .panel-2 .logo-iberhad { left:0; }
    .site-footer .panel-3 { float:left; width:100%; }
    .site-footer .panel-4 { float:right; width:100%; text-align:left; }
}

@media screen and (max-width:400px) {
    .site-footer .panel-1 { float:none; }
    .site-footer .panel-1 .footer-column { padding-top:1rem; border-right:0; display:block; padding-right:0; margin-right:0; height:auto !important; width:100%; }
    .site-footer .panel-1 .footer-column .title { width:120px; float:left; font-size:16px; }
    .site-footer .panel-1 .footer-column .body { overflow:hidden; }
    .site-footer .panel-2 { float:none; }
    .site-footer .panel-2 .social-media .line-break { display: block; }
    .site-footer .panel-2 .logo-iberhad { height:51px; width:85px; }
    .site-footer .panel-3 { float:none; font-size:12px; color:#666; padding-top: 0.3rem; margin-top:.5rem; }
    .site-footer .panel-3 a { color:#666; text-decoration:none; white-space:nowrap; }
    .site-footer .panel-4 { float:none; text-align:left; margin-top:.5rem; }
}

/* Quicklinks */
 
.quicklink-panel { background-color: #333; color: #fff; padding: 25px; padding-left: 0; overflow: hidden; }
.quicklink-box {
    width: 25%; outline: 0; padding-left: 25px; float: left; color: inherit; text-decoration: none;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}
.quicklink-box .quicklink-text { border-right: 1px solid #fff; padding-right: 25px; font-size: 14px; font-weight: 500; line-height: 1.2; color: rgba(255,255,255,0.5); }
.quicklink-box .quicklink-text .title { margin-top: .5rem; margin-bottom: 0; font-size: 20px; font-weight: bold; text-transform: uppercase; color: #fff; }
.quicklink-box:last-child .quicklink-text { border-right:0; }

@media screen and (max-width: 1024px) {
    .quicklink-box .quicklink-text .title { font-size: 16px }
}

@media screen and (max-width: 820px) {
    .quicklink-box { width: 50%; }
    .quicklink-box:nth-child(2n) ~ .quicklink-box { margin-top: 30px; }
    .quicklink-box:nth-child(2n) .quicklink-text { border-right-width: 0; }
}

@media screen and (max-width: 640px) {
    .quicklink-panel { padding: 15px 0; }
    .quicklink-box { padding-left: 10px; }
    .quicklink-box .quicklink-text { padding-right: 10px; }
}

@media screen and (max-width: 440px) {
   .quicklink-box { width: auto; border-top: 1px solid #fff; padding-top: 15px; padding-left: 0; margin-top: 15px; display: block; float: none; }
   .quicklink-box:nth-child(2n) ~ .quicklink-box { margin-top: 15px; }
   .quicklink-box:first-child { border-top-width: 0; padding-top: 0; margin-top: 0; }
   .quicklink-box .quicklink-text { padding-right: 0; }
   .quicklink-box.quicklink-box .quicklink-text { border-right-width: 0; }
}

/* Splash Obj */

.splash-objs { padding-top: 38%; position: relative; }
    .splash-obj { width: 33.3333%; height: 100%; position: absolute; top: 0; left: 0; color: #fff;  background: center center no-repeat; background-size: cover; text-decoration: none; }
    .splash-obj:nth-child(2) { left: 33.3333%; }
    .splash-obj:nth-child(3) { left: auto; right: 0; }
        .splash-obj__inner { width: 100%; height: 100%; display: table; position: relative; z-index: 1; opacity: 0; } 
        .splash-obj:after { content: ''; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-color: rgba(0,0,0,0.8); opacity: 0; }
            .splash-obj .texter { padding: 1rem; display: table-cell; text-align: center; vertical-align: middle; }
                .splash-obj .title { margin-bottom: -1rem; font-size: 40px; text-transform: uppercase; }
                .splash-obj .description { height: 0; padding-bottom: 0.5rem; opacity: 0; }
                .splash-obj .texter:after { content: ''; height: 0; margin-top: 1rem; display:block; background:url(../splash-images/arrows/category.png) center no-repeat; background-size: contain; opacity: 0; }
    
    .touch .splash-obj__inner,
    .splash-obj:hover .splash-obj__inner,
    .touch .splash-obj:after,
    .splash-obj:hover:after,
    .touch .splash-obj .description,
    .splash-obj:hover .description { opacity: 1; }
    .touch .splash-obj .title,
    .splash-obj:hover .title { margin-bottom: 0; }
    .touch .splash-obj .texter:after,
    .splash-obj:hover .texter:after { height: 65px; margin-top: 0; opacity: 1; }

    .touch .splash-obj .description { height: auto; }

.splash-obj__inner,
.splash-obj:after,
.splash-obj .title,
.splash-obj .description,
.splash-obj .texter:after {
    -webkit-transition: all 0.3s;
       -moz-transition: all 0.3s;
            transition: all 0.3s;
}

@media screen and (max-width: 640px) {
    .splash-obj .title { font-size: 24px; }
}

@media screen and (max-width: 850px) {
    .splash-objs { padding-top: 50%; }
    .splash-obj .title { font-size: 28px; }
    .splash-obj:hover .texter:after { height: 50px; }
}


@media screen and (max-width: 750px) {
    .splash-objs { height: auto; padding-top: 0; }
    .splash-obj { width: auto; display: block; float: none; position: relative; }
    .splash-obj:nth-child(n) { left: auto; right: auto; }
    .splash-obj .texter { padding-top: 3rem; padding-bottom: 3rem; }
    .splash-obj:hover .texter:after { height: 40px; }
}