/**
 * MDT Fall 2015
 * Theme CSS + Animations
 */

@font-face {
    font-family: 'futura_lt_lightregular';
    src: url('../fonts/futuralt-light-webfont.eot');
    src: url('../fonts/futuralt-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/futuralt-light-webfont.woff2') format('woff2'),
         url('../fonts/futuralt-light-webfont.woff') format('woff'),
         url('../fonts/futuralt-light-webfont.ttf') format('truetype'),
         url('../fonts/futuralt-light-webfont.svg#futura_lt_lightregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'futura_ltbold_oblique';
    src: url('../fonts/futuralt-boldoblique-webfont.eot');
    src: url('../fonts/futuralt-boldoblique-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/futuralt-boldoblique-webfont.woff2') format('woff2'),
         url('../fonts/futuralt-boldoblique-webfont.woff') format('woff'),
         url('../fonts/futuralt-boldoblique-webfont.ttf') format('truetype'),
         url('../fonts/futuralt-boldoblique-webfont.svg#futura_ltbold_oblique') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'futura_ltbold';
    src: url('../fonts/futuralt-bold-webfont.eot');
    src: url('../fonts/futuralt-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/futuralt-bold-webfont.woff2') format('woff2'),
         url('../fonts/futuralt-bold-webfont.woff') format('woff'),
         url('../fonts/futuralt-bold-webfont.ttf') format('truetype'),
         url('../fonts/futuralt-bold-webfont.svg#futura_ltbold') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'futura_ltmedium';
    src: url('../fonts/futuralt-webfont.eot');
    src: url('../fonts/futuralt-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/futuralt-webfont.woff2') format('woff2'),
         url('../fonts/futuralt-webfont.woff') format('woff'),
         url('../fonts/futuralt-webfont.ttf') format('truetype'),
         url('../fonts/futuralt-webfont.svg#futura_ltmedium') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'futura_ltmedium_oblique';
    src: url('../fonts/futuralt-oblique-webfont.eot');
    src: url('../fonts/futuralt-oblique-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/futuralt-oblique-webfont.woff2') format('woff2'),
         url('../fonts/futuralt-oblique-webfont.woff') format('woff'),
         url('../fonts/futuralt-oblique-webfont.ttf') format('truetype'),
         url('../fonts/futuralt-oblique-webfont.svg#futura_ltmedium_oblique') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'futura_lt_lightoblique';
    src: url('../fonts/futuralt-lightoblique-webfont.eot');
    src: url('../fonts/futuralt-lightoblique-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/futuralt-lightoblique-webfont.woff2') format('woff2'),
         url('../fonts/futuralt-lightoblique-webfont.woff') format('woff'),
         url('../fonts/futuralt-lightoblique-webfont.ttf') format('truetype'),
         url('../fonts/futuralt-lightoblique-webfont.svg#futura_lt_lightoblique') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'lucidatypewriterefregular';
    src: url('../fonts/lucidatypewriteref-regular-webfont.eot');
    src: url('../fonts/lucidatypewriteref-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/lucidatypewriteref-regular-webfont.woff2') format('woff2'),
         url('../fonts/lucidatypewriteref-regular-webfont.woff') format('woff'),
         url('../fonts/lucidatypewriteref-regular-webfont.ttf') format('truetype'),
         url('../fonts/lucidatypewriteref-regular-webfont.svg#lucidatypewriterefregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'lucidatypewriterefbold';
    src: url('../fonts/lucidatypewriteref-bold-webfont.eot');
    src: url('../fonts/lucidatypewriteref-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/lucidatypewriteref-bold-webfont.woff2') format('woff2'),
         url('../fonts/lucidatypewriteref-bold-webfont.woff') format('woff'),
         url('../fonts/lucidatypewriteref-bold-webfont.ttf') format('truetype'),
         url('../fonts/lucidatypewriteref-bold-webfont.svg#lucidatypewriterefbold') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'lucidaefroman';
    src: url('../fonts/lucidaef-roman-webfont.eot');
    src: url('../fonts/lucidaef-roman-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/lucidaef-roman-webfont.woff2') format('woff2'),
         url('../fonts/lucidaef-roman-webfont.woff') format('woff'),
         url('../fonts/lucidaef-roman-webfont.ttf') format('truetype'),
         url('../fonts/lucidaef-roman-webfont.svg#lucidaefroman') format('svg');
    font-weight: normal;
    font-style: normal;
}

html, body {margin:0px; padding:0px; width:100%; height:100%; }

.outer {display:table; width:100%; height:100%;}
.inner {display:table-cell; vertical-align:middle; position:relative;}
.anim {-webkit-transform:translate3d(0,0,0); -webkit-backface-visibility:hidden; -webkit-perspective:1000; outline:0;}
.mask {-webkit-mask-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAA5JREFUeNpiYGBgAAgwAAAEAAGbA+oJAAAAAElFTkSuQmCC);}
.shadow {-webkit-box-shadow:0px 2px 5px 0px rgba(0,0,0,0.25); -moz-box-shadow:0px 2px 5px 0px rgba(0,0,0,0.25); box-shadow:0px 2px 5px 0px rgba(0,0,0,0.25);}
.btnshadow {-webkit-box-shadow:0px 2px 5px 0px rgba(0,0,0,0.5); -moz-box-shadow:0px 2px 5px 0px rgba(0,0,0,0.5); box-shadow:0px 2px 5px 0px rgba(0,0,0,0.5);}

#mdt-detector {display:none; opacity:0;}

#mdt-mobile {height: 100%; margin:0px; padding:0px; position:relative;}
#mdt-mobile-header {margin:0px; padding:10px; width:100%; height:80px; box-sizing:border-box; background:#272e38; position:absolute; top:0px; left:0px; z-index:1000; display:none;}
#mdt-mobile-header img {width:auto; height:100%;}
#mdt-mobile-toggle {margin:-15px 0px 0px 0px; padding:0px; width:30px; height:30px; background:transparent url(../img/mobile-menu.png) center center no-repeat; background-size:contain; position:absolute; top:50%; right:20px; transition:300ms ease-out;}
#mdt-mobile-toggle.active {-webkit-transform: rotate(135deg); -moz-transform: rotate(135deg); -o-transform: rotate(135deg); -ms-transform: rotate(135deg); transform: rotate(135deg);}
#mdt-mobile-menu {position:fixed; top:0px; left:100%; width:100%; height:100%; height:100vh; background:rgba(53,61,73,0.9); z-index:900; display:none; transition:300ms ease-out;}
#mdt-mobile-menu.active {left:0%;}

#mdt-mobile-intro {position:absolute; top:0px; right:0px; bottom:0px; left:0px; background:#272e38; z-index:9999; text-align:center; display:none;}
#mdt-mobile-intro .outer {position:absolute; top:0px; left:0px;}
#mdt-mobile-missouri {position:relative; margin:0px auto; width:220px; height:175px; top:-40px; left:10px; transition:top 300ms ease-out; display:block; z-index:10;}
#mdt-mobile-missouri .path {fill:#1e9a78; stroke:#fff; stroke-linejoin:round; stroke-width:10px; stroke-dasharray:3000; stroke-dashoffset:3000; fill-opacity:0; fill-rule:evenodd;}
#mdt-mobile-card1 {position:absolute; top:0px; right:0px; bottom:0px; left:0px; background:#000; z-index:5; background:#000 url(../img/mobile-card1.png) center center no-repeat; background-size:cover; opacity:1;}
#mdt-mobile-card2 {position:absolute; top:0px; right:0px; bottom:0px; left:0px; background:#000; z-index:2; background:#000 url(../img/mobile-card2.png) center center no-repeat; background-size:cover; opacity:1;}
#mobile-intro-headerwrap {position:relative; margin:0px auto; width:250px; height:80px; top:-30px; z-index:10;}
#mobile-intro-header {width:0px; height:80px; background:transparent url(../img/mobile-intro-header.png) top left no-repeat; background-position:fixed; background-size:250px 80px;}
#mobile-intro-banner {position:absolute; top:50%; left:50%; margin-left:-40%; margin-top:-25px; width:80%; z-index:15; opacity:0;}
#mdt-mobile-startmenu {position:absolute; bottom:12%; left:0px; width:100%; z-index:50; text-align:center;}
#mdt-mobile-start {margin:0px 0px 0px 0px; padding:10px 20px; text-align:center; color:#fff; background:#f9b65f; font-family:'Oswald',sans-serif; font-size:1.3rem; display:inline-block; cursor:pointer;}
#mdt-mobile-alt {color:#fff; margin:20px 0px 20px 0px; text-decoration:none; font-family:'Oswald',sans-serif; display:block;}
#mdt-mobile-alt span {text-decoration:underline;}

#mdt-fall {margin:0px; padding:0px; width:100%; height:100%; height:100vh; background:#000; position:relative; font-family:'Open Sans', sans-serif;}
#mdt-fall-home {margin:0px; padding:0px; width:100%; height:100%; height:100vh; background:#000; position:relative; overflow:hidden; background:#000 url(../vid/bg-intro.jpg) center center no-repeat; background-size:cover;}
#mdt-fall *, #mdt-fall-home * {margin:0px; padding:0px; outline:none;}
#mdt-fall .hide {display:none;}

#mdt-fall-mobile {position:absolute; top:80px; right:0px; bottom:0px; left:0px; background:#353d49;}
#mdt-fall-mobile ul {margin:0px; padding:0px; width:100%; height:100%; list-style:none;}
#mdt-fall-mobile ul li {margin:0px; padding:0px; width:100%; height:20%; display:block; position:relative; background-position:center center; background-size:cover; background-repeat:no-repeat; overflow:hidden;}
#mdt-fall-mobile ul li a {position:absolute; bottom:0px; left:0px; padding:80% 0px 10px 10px; text-transform:uppercase; font-family:'Oswald',sans-serif; text-decoration:none; color:#fff; font-size:1.5rem; box-sizing:border-box; width:100%;}
#mdt-mobile-northeast {background-image:url(../img/bg-northeast-sm.jpg);}
#mdt-mobile-northwest {background-image:url(../img/bg-northwest-sm.jpg);}
#mdt-mobile-central {background-image:url(../img/bg-central-sm.jpg);}
#mdt-mobile-southeast {background-image:url(../img/bg-southeast-sm.jpg);}
#mdt-mobile-southwest {background-image:url(../img/bg-southwest-sm.jpg);}

#mdt-mobile-nav {margin:80px 0px 0px 0px; padding:10px; width:100%; height:auto; list-style:none; box-sizing:border-box;}
#mdt-mobile-nav li {margin:0px; padding:0.8rem 1rem; background:#272e38; border-bottom:#c1c1c1 1px solid; text-align:left;}
#mdt-mobile-nav li:last-child {border:none;}
#mdt-mobile-nav li a {color:#fff; text-decoration:none; text-transform:uppercase; font-family:'Oswald',sans-serif; font-size:1.3rem; display:block; width:100%; height:100%;}
#mdt-mobile-social {margin:30px 0px 15px 0px; padding:0px; width:100%; height:auto; list-style:none; box-sizing:border-box; text-align:center; display:block;}
#mdt-mobile-social li {margin:0px 20px 0px 20px; padding:0px; display:inline-block;}
#mdt-mobile-social li a {color:#fff; font-size:1.5rem;}
#mdt-mobile-explore {margin:0px; padding:0px; text-align:center; color:#fff; font-family:'Oswald',sans-serif; font-weight:300;}
#mdt-mobile-explore a {color:#fff; text-decoration:none; text-transform:uppercase;}

#mdt-logo {position:absolute; top:20px; left:25px; z-index:10; display:none; opacity:0;}
#mdt-logo-fall {position:absolute; top:10px; left:200px; width:auto; height:55px; }
#mdt-logo-fall img {width:auto; height:100%;}

#mdt-intro-map {position:relative; top:30px; left:0px; margin:0px auto; width:550px; z-index:10; text-align:center; opacity:0;}
#mdt-intro-sprite {margin:0px 0px 0px 100px; width:394px; height:351px; background:transparent url('../img/map-sprite.png') 0px 0px no-repeat;}
#mdt-intro-sprite.nw {background-position:0px 0px;}
#mdt-intro-sprite.ne {background-position:-394px 0px;}
#mdt-intro-sprite.se {background-position:-788px 0px;}
#mdt-intro-sprite.sw {background-position:-1182px 0px;}
#mdt-intro-sprite.ce {background-position:-1576px 0px;}

#mdt-intro-dash {position:absolute; bottom:175px; left:0px; width:100%; opacity:0; overflow:hidden; text-align:center; transition:bottom 300ms ease-out; z-index:10;}
#mdt-intro-dashline {max-width:none;}
#mdt-intro-groups {position:absolute; bottom:175px; left:0px; width:100%; height:160px; z-index:15; transition:bottom 300ms ease-out;}
#mdt-intro-groups .group {position:absolute; bottom:0px; left:0px; width:125px; height:125px; cursor:pointer; opacity:0;}
#mdt-intro-groups .group-set {position:absolute; bottom:0px; left:0px; width:125px; height:125px; border:none; border-radius:50%; background:#fff; color:#6f6f6f; transition:300ms ease-out;}
#mdt-intro-groups .group-set:hover, #mdt-intro-groups .group.active .group-set {background:#f9b859;}
#mdt-intro-groups .group-set-title {
    position:absolute;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    border:none;
    border-radius:50%;
    overflow:hidden;
    text-align:center;
    line-height:130px;
    font-family:'futura_ltbold', sans-serif;
    font-size:0.9rem;
    font-weight:bold;
    text-transform:uppercase;
}
#mdt-intro-groups #group-one   {bottom:-55%; left:3%;}
#mdt-intro-groups #group-two   {bottom:-70%; left:23%;}
#mdt-intro-groups #group-three {bottom:-30%; left:42%;}
#mdt-intro-groups #group-four  {bottom:20%; left:61.5%;}
#mdt-intro-groups #group-five  {bottom:10%; left:81%;}

@media screen and (min-width: 920px) {
    #mdt-intro-groups #group-one   {bottom:-55%; left:8%;}
    #mdt-intro-groups #group-two   {bottom:-60%; left:27%;}
    #mdt-intro-groups #group-three {bottom:-20%; left:45%;}
    #mdt-intro-groups #group-four  {bottom:25%; left:63%;}
    #mdt-intro-groups #group-five  {bottom:20%; left:82%;}
}

@media screen and (min-width: 1200px) {
    #mdt-intro-groups #group-one   {bottom:-45%; left:15%;}
    #mdt-intro-groups #group-two   {bottom:-40%; left:30%;}
    #mdt-intro-groups #group-three {bottom:-5%; left:45%;}
    #mdt-intro-groups #group-four  {bottom:35%; left:60%;}
    #mdt-intro-groups #group-five  {bottom:45%; left:75%;}
}

@media screen and (min-width: 1500px) {
    #mdt-intro-groups #group-one   {bottom:-35%; left:15%;}
    #mdt-intro-groups #group-two   {bottom:-30%; left:30%;}
    #mdt-intro-groups #group-three {bottom:0%; left:45%;}
    #mdt-intro-groups #group-four  {bottom:45%; left:60%;}
    #mdt-intro-groups #group-five  {bottom:60%; left:75%;}
}

#mdt-intro-tagline {position:absolute; bottom:75px; left:0px; width:100%; text-align:center; text-shadow: 3px 2px 3px #000;font-family:'futura_lt_lightregular',sans-serif; font-size:0.95rem; text-transform:uppercase; color:#fff; z-index:20; opacity:0;}

#mdt-social {position:absolute; bottom:20px; left:25px; z-index:10;}
#mdt-social ul {margin:0px; padding:0px; list-style:none;}
#mdt-social ul li {margin:0px 10px 0px 0px; padding:0px; display:inline-block; color:#fff; font-size:0.9rem; font-family:'Oswald',sans-serif; font-weight:300; text-shadow:2px 2px 3px rgba(0,0,0,0.8);}
#mdt-social ul li b {font-family:'Oswald',sans-serif; font-weight:400;}
#mdt-social ul li a {text-decoration:none; color:inherit;}
#mdt-social ul li i {font-size:1.2rem;}
#mdt-callout {position:absolute; bottom:20px; right:25px; color:#fff; font-size:0.9rem; font-family:'Oswald',sans-serif; z-index:10; text-shadow:2px 2px 3px rgba(0,0,0,0.8);}

#mdt-videos {position:absolute; top:0px; right:0px; bottom:0px; left:0px; z-index:1; overflow:hidden; background:#000;}
#mdt-videos .mdt-fsv {margin:0px; padding:0px; width:100%; height:auto; position:absolute; top:0px; left:0px; opacity:0;}
#mdt-videos-grid {position:fixed; top:0px; left:0px; width:100%; height:100%; z-index:10; background-image:url(../img/grid5x5.png); opacity:0.1; display:none;}

#mdt-captions {position:absolute; top:0px; left:0px; width:100%; height:100%; z-index:5; overflow:hidden;}
#mdt-captions tr {text-align:center;}
#mdt-captions tr td {text-align:center; vertical-align:middle;}
#mdt-captions .mdt-capt {display:none; opacity:0; text-shadow:2px 2px 3px rgba(0,0,0,0.8);}
#mdt-captions .mdt-capt p {margin:0px auto; max-width:550px; display:block; color:#fff; font-family:'futura_lt_lightregular',sans-serif; font-size:2rem;}
#mdt-captions .mdt-capt p span {text-transform:uppercase; font-size:0.9rem;}

@media only screen and (max-width: 768px){
    #mdt-detector {display:block; opacity:1;}
    #mdt-mobile {margin:0px; padding:0px; position:fixed; top:0px; left:0px; width:100%; height:100%; /*height:100vh;*/ overflow-y:scroll;}
    #mdt-fall-home {display:none !important;}
    #mdt-mobile-header, #mdt-mobile-menu, #mdt-mobile-intro {display:block;}
}
