/* ==============
    MOBILE: Menu
   ============== */
* { -webkit-backface-visibility: hidden; }
html { -webkit-font-smoothing: antialiased; background-color:#881202;  }
a { text-decoration:none; color:#881202;}
a:hover { text-decoration:underline; }

nav ul {
    margin: 0;
    padding: 0;
    
}

.clear { clear:both; }
nav ul li { background-color:#7b1304 }

a:active, a:selected, a:visited { 
    border: none;
    outline: none;
}

nav a {
    display: block;
    margin-bottom: 10px;
    xpadding: 15px 0;

    text-align: center;
    text-decoration: none;
    font-weight: bold;
    color: white;
    xbackground: #e44d26;
}


nav a:hover,
nav a:visited {
    color: white;
    text-decoration:underline;
    
}

nav ul li:hover { }
nav a:hover {
    text-decoration: none; 
}

a.btn.btn-primary.btn-large {
    background:#7b1304;
    border-radius:5px;
    color:#fff;
    display:inline-block;
    padding:10px 30px;
}
a.btn.btn-primary.btn-large:hover {
    background:#530c02;
    text-decoration:none;
}


/* ==============
    MOBILE: Main Styles
   ============== */

    .main {
        padding: 30px 0;
    }
    
    .main article h1 {
        xfont-size: 2em;
    }
    
    .main aside {
        xcolor: white;
        xpadding: 0px 5% 10px;
    }
    .main aside.rooms img { border:0px; width:33%; float:left; margin:0px;  }
    
    .main aside.rooms:after {
    content: " ";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
    font-size: 0;
    }
    
    .main aside.hours .column { float:left; margin-bottom:15px; margin-right:5%; }
    .main aside.hours .column:last-child, .main aside.hours .four { margin-right:0%; }
    .main aside.hours .column strong { font-size:14px; font-family:roboto, arial, sans-serif; font-weight:100; text-transform:uppercase; letter-spacing:1px; color:#000;  display:block;}
    .main aside.hours .column span { font-family:neuton, serif; font-weight:400; font-size:15px; }
    
    .main aside.hours h5 { clear:left; }
    
    
    .footer-container {
        color: white;
        padding: 20px 0;
        background-color:#881202;
    }
    .footer-container footer { font-size:12px; padding-bottom:20px; }
    
    
    .main-container { background:url('../images/content-texture.jpg') top center; padding-bottom:30px; }
    .main-container { font-family: 'Neuton', serif;  }
    .main-container p { font-weight:400; }
    .main-container p.small { font-size:14px; margin:0px; line-height:16px; margin-bottom:10px; }
    .main-container ul { font-size:16px; font-weight:400; list-style-type:none; padding:0px; padding-left:10px;  margin:0px;  }
    .main-container ul.bullet { list-style-type: disc; }
    .main-container article header { font-size:20px; }
    

    h1 { font-size:30px; font-family:roboto, arial, sans-serif; font-weight:100; text-transform:uppercase; letter-spacing:1px; line-height:34px; }
    h3 { font-size:20px; font-family:roboto, arial, sans-serif; font-weight:100; text-transform:uppercase; letter-spacing:1px; line-height:24px; margin-bottom:20px; }
    h4 { font-size:24px; font-family:neuton, serif; font-weight:200; color:#881202; margin-bottom:20px;   }
    h5 { font-size:15px; font-family:roboto, arial, sans-serif; font-weight:100; text-transform:uppercase; letter-spacing:1px; line-height:20px; padding-left:12px; background-color:#881202; color:#fff; margin-bottom:5px; }

    #arrow_left, #arrow_right {
        
        height:auto;
        z-index:1000;
        display:block;
        font-family:roboto, arial, sans-serif;
        line-height:15px; 
        background:#881202;
        text-indent:0px;
        border: none;
        outline: none;
        height:auto;
        width:auto;
        float:right;
        color:#fff; text-decoration:none; font-size:12px; letter-spacing:1px;
        width:46%;
        text-align:right;
        padding:2%; 
        
    }
    #arrow_left {
        float:left;
        background:#881202;
        text-align:left;
    }
    #arrow_left:hover, #arrow_right:hover { background:#6b0f03;  }
    
    .in-slide-content { margin-top:55px; }
    #slideshow { height:200px; width:100%; overflow:hidden; }




    .title {
        text-indent:-9999px;
        width:200px;
        height:35px;
        background:url('../images/arborg-logo.png') no-repeat top left;
        margin-top:42px;
        margin-left:auto; margin-right:auto;
}

    nav a { font-family:'Roboto', Arial, serif; font-weight:300; letter-spacing:1px; font-size:14px; }
    nav a:hover { text-decoration: underline; }


    
    .headline1, .headline2, .headline3, .headline4 { margin:0px auto; font-family:'Roboto', Arial, serif; color:#fff; font-weight:100; text-transform:uppercase; text-align:center;   }

    nav li a span { display:inline; }
    
    ul { }

    img.photo { margin-bottom:10px; }


    footer .telephone { font-family:'Roboto', Arial, serif; font-weight:100; font-size:24px; }
    footer .telephone span { display:block; font-size:14px; }






/* ==========================================================================
   Media Queries
   ========================================================================== */

@media only screen and (min-width: 480px) {

/* ====================
    INTERMEDIATE: Menu
   ==================== */

    nav {
        float:none;
        width:100%;
        position:relative;
        overflow:hidden; margin-bottom:10px;}
    
    nav ul {
        clear:left;
        float:left;
        position:relative;
        margin:0;
        width:auto;
        left:50%;
        text-align:center;
        }
    
    nav ul li {
        display:block;
        background:transparent;
        margin-right:10px;
        float:left;
        position:relative;
        right:50%; }
    nav ul li:hover { border-bottom:2px solid #fff; text-decoration:none;  }
    nav ul li:last-child { margin-right:0px; }
    nav ul li a { text-transform:uppercase; font-size:11px; xfloat:left; display:inline !important;  }
    nav li a span { display:none; }

    
/* ====================
    INTERMEDIATE: STYLE
   ==================== */
   

    /* Max Image Style */
    .in-slide-content { margin-top:85px; }

                
    #slideshow { height:200px; }
    


/* ========================
    INTERMEDIATE: IE Fixes
   ======================== */

    nav ul li {
        xdisplay: inline;
    }

    .oldie nav a {
        margin: 0 0.7%;
    }
}

@media only screen and (min-width: 768px) {

/* ====================
    MEDIUM WIDTH
   ==================== */
 
    h3 { font-size:25px; line-height:28px; }
    
    .header-container,
    .main aside {

    }

/* ============
    MEDIUM: MENU
   ============ */


    nav ul li a { font-size:13px; text-decoration:none; }
    nav ul li a:hover { text-decoration:none; }
    nav li a span { display:inline; }
.header-container {
    min-height:113px; }
    
    #arrow_left, #arrow_right {
        text-align:left;
        padding:0px; 
        float:none;
        top:200px;
        height:67px;
        position:absolute;
        right:0px;
        width:36px;
        z-index:1000;
        display:block; width:50px; height:70px;
        background:url('../images/r-arrow-btn.png') no-repeat top left;
        text-indent:-9999px !important;
        border: none;
        outline: none;
    }
    #arrow_left {
        left:0px;
        background:url('../images/l-arrow-btn.png') no-repeat top left;
    }
    #arrow_left:hover { background:url('../images/l-arrow-btn.png') no-repeat bottom left; }
    #arrow_right:hover { background:url('../images/r-arrow-btn.png') no-repeat bottom left; }

    




/* ============
    MEDIUM: MAIN
   ============ */


    
    .main article {
        float: left;
    }
    .main .onecol {
        width: 40%;
    }
    .main .twocol {
        width: 63%;
    }

    .main aside {
        float: left;
        xwidth: 28%;
        margin-left:1.76%;
    }
    .main .rightcolumn { float:right; }
    .main aside.rooms { width:23%;  }
    .main aside.hours { width:32%; }
    
    #arrow_left, #arrow_right { top :276px; }
    #slideshow { height:350px; }
    .in-slide-content { xmargin-top:100px; }
    
    .headline1 { margin:0px auto; margin-top:150px;  font-family:'Roboto', Arial, serif; text-indent:-9999px; width:500px; height:50px; background:url('../images/headlines/luxury-arborg-title-md.png') no-repeat top left;  }
    
    .headline2 { margin:0px auto; margin-top:100px; font-family:'Roboto', Arial, serif; text-indent:-9999px; width:500px; height:92px; background:url('../images/headlines/goodtimes-arborg-title-md.png') no-repeat top left;  }
    
    .headline3 { margin:0px auto; margin-top:162px; font-family:'Roboto', Arial, serif; text-indent:-9999px; width:500px; height:42px; background:url('../images/headlines/delicious-arborg-title-md.png') no-repeat top left;  }

    .headline4 { margin:0px auto; margin-top:162px; font-family:'Roboto', Arial, serif; text-indent:-9999px; width:500px; height:67px; background:url('../images/headlines/moment-arborg-title-md.png') no-repeat top left;  }

    .main aside.rooms img, .main aside.rightcolumn img { border:0px; width:100%; float:none; } 
    .main aside.rooms:after { clear:none !important; }
    
    footer .telephone { float:right; }
    footer .address { float:left; }
    
}

@media only screen and (min-width: 1140px) {

/* ===============
    LARGE WIDTH
   =============== */

    h1 { font-size:40px; line-height:44px; }
    h3 { font-size:25px;}
    
    .title {
        float: left;
    }
    
    nav { margin-top:45px; float:right; width:auto; }
    nav ul li { margin-right:35px;  } /* changed nov 4 2015 by chris s, original value was 47 */
    nav ul li a { font-size:14px; }
    



    .wrapper {
        width: 1132px; /* 1140px - 10% for margins */
        margin: 0 auto;
    }
    


    #slideshow { height:544px; }
    .in-slide-content {  }
    
    .headline1 { margin-top:200px; width:998px; height:77px; background:url('../images/headlines/luxury-arborg-title.png') no-repeat top left;  }
    
    .headline2 { margin-top:150px; width:998px; height:157px; background:url('../images/headlines/goodtimes-arborg-title.png') no-repeat top left;  }
    
    .headline3 { margin-top:200px; width:998px; height:77px; background:url('../images/headlines/delicious-arborg-title.png') no-repeat top left;  }
    
    .headline4 { margin-top:190px; width:998px; height:117px; background:url('../images/headlines/moment-arborg-title.png') no-repeat top left;  }
    
    
    #arrow_left, #arrow_right { top:316px;}

    .main aside img { width:auto; }

}