
#nav-drawer-links p {
    font-family:Georgia,serif;
}

.fixed {
    position: fixed !important; 
    z-index: 99; top: 0; margin: 0 !important;
}

#nav-drawer { /*opens on handle click*/
    display:none;
}

#nav-drawer-images {
    width:70%;
    margin:2% 5%;
}

#nav-drawer-links {
    width:30%;
    text-align:center;
    float:left;
}

#nav-drawer-images img {
    width:20%;
    margin:0 0.3%;
    border:3px solid #282828;
    float:left;
    -webkit-transition: border-color .2s;
    -moz-transition: border-color .2s;
    transition: border-color .2s;
}

#nav-drawer-images img.hover {
    border-color: #666;
}

#nav-drawer-links p {
    color:#fff;
    line-height:0;
    margin:0;
    padding:18px 0;
}

#nav-drawer-links a.extras p, #nav-drawer-links .extras  {
    font-size: 15px;
}

#nav-drawer-links p.last-nav {
    margin-bottom:15px;
}

#nav-drawer-links p.nav-drawer-sec {
    color:#666;
}

#nav-drawer-links a {
    -webkit-transition: background-color .2s;
    -moz-transition: background-color .2s;
    transition: background-color .2s;   
}

#nav-drawer-links a.hover {
    background-color:#666;
}

#nav-drawer-handle {
    float:right;
    position:relative;
    height: 0;
    top: -65px;
    cursor:pointer;
}

#nav-drawer-handle p {
    color:#fff;
    background-color: #282828;
    padding: 10px 0 10px 0;
    margin-right:10px;
    text-align:center;
    font-family: Arial, sans-serif;
    font-size:14px;
}

#nav-drawer-handle p i {
    font-size:18px;
    position:relative;
    top:3px;
}

.spacer {
    height:20px;
}

.landingline {
    border-top:6px solid #282828;
}

.swappedcol {
    float:right;
}

@media (max-width:1200px) {
    #nav-drawer-links p {padding: 15px 0;}
}

@media (max-width:980px) {
    #nav-drawer-links p {padding: 12px 0;font-size:14px;}
}

@media (max-width:900px) {
    #nav-drawer-images {width: 60%;}
    #nav-drawer-links {width: 40%;}
}
    

@media (max-width: 767px) {
    #nav-drawer #nav-drawer-links {width:90%;float:none;margin:auto;}
    #nav-drawer-links a.extras p, #nav-drawer-links .extras, #nav-drawer-links a.extras p, #nav-drawer-links .extras {font-size:12px;}
    #nav-drawer-links .extras p {padding:12px 0;}
}

@media (max-width: 600px) {
    #tophat.tophat-small #tophat-title {font-size:18px;}
    #tophat a.nav-explainer p {width:150px;padding:0px;font-size:10px;line-height:15px;}
    #tophat .ad-sponsor-topper-holder .ad-sponsor-explainer {top: 60px;}
}

@media (max-width: 500px) {
    #tophat a.nav-explainer p {float:left;}
    #topper h1 {font-size: 40px; line-height: 50px;}
}

img.last-img {
    padding-right: 0;
}

.LATChat {
    font-size:70px;  
    position:relative; 
    top:25px;
}

#nav-drawer-links p.presented-nav-text, #topper p.presented-text, a.nav-explainer p, p.presented-topper-text {
    text-transform: none;
    font-family: Arial, sans-serif;
    font-style: italic;
}

p.presented-topper-text {
    text-align: center;
    width: 260px;
    margin: 0 auto;
    padding: 10px;
}

#nav-drawer-links p.presented-nav-text {
    font-size:15px;
    color:#555;
}

#topper p.presented-text {
    font-size:17px;
    color:#555;
    text-align: center;
    padding:0;
    width:250px;
    margin: 30px auto 0 auto;
}

.ad-sponsor-explainer-holder, .ad-sponsor-nav-holder {
    display: none;
    position: relative;
    height: 0px;
    left: -135px;
    top: -100px;
}

.ad-sponsor-topper-holder .ad-sponsor-explainer {
    left:calc(50% - 130px);
}

a.nav-explainer p {
    margin:auto;
    width:260px;
    padding:10px;
    font-size:12px;
}

#nav-drawer-links .nav-explainer {
    top: 15px;
    left: -140px; 
}

body .nav-explainer .ad-sponsor-explainer-arrow {
    bottom: 44px;
    border-width: 0px 10px 10px;
}

.ad-sponsor-explainer-holder {
    text-align: center;
}

.ad-sponsor-explainer {
    display: inline-block;
    position: absolute;
    padding: 0;
    background: #333;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    color: #FFF;
    font-family: Arial;
    font-weight: normal;
    font-size: 12px;
    line-height: 14px;
    padding: 8px;
    width: 260px;
    height: 28px;
    z-index: 100;
    text-transform: none;
}

.ad-sponsor-explainer-box {
    text-align: left;
    width: 215px;
    margin-left: 10px;
}

.ad-sponsor-explainer-arrow {
    position: absolute;
    bottom: -10px;
    left: 124px;
    border-style: solid;
    border-width: 10px 10px 0px;
    border-color: #333 transparent;
    z-index: 1;
    width: 0;
}

.ad-banner-holder {
    margin:10px;
    text-align: center;
}

.ad-banner-holder .custom-ad {
    margin:auto;
}

body .ad-banner-holder .ad-spacer, .ad-spacer {
    margin-top:20px;
}

.tophat-ad-label {
    text-align: center;
}

.instructions h2 {
    font-size:28px;
    line-height: 30px;
}

.instructions p {
    font-size:17px;
}

.big-spacer {
    margin-top:75px;
    margin-bottom:15px;
}

.ad-sponsor-topper-holder{
    display:none;
}

body #tophat {
    width:100%;
    /*padding: 0 10px;*/
}

p.presented-topper-text {
    color:#ccc;
}

.vert {padding: 0 0 10px 10px; float:right;}