/* ---------------------------
SCREEN STYLE CSS
--------------------------- */

/*
.col-xs-12, .col-xs-11, .col-xs-10, .col-xs-9, .col-xs-8, .col-xs-7, .col-xs-6, .col-xs-5, .col-xs-4, .col-xs-3, .col-xs-2, .col-xs-1, .col-sm-12, .col-sm-11, .col-sm-10, .col-sm-9, .col-sm-8, .col-sm-7, .col-sm-6, .col-sm-5, .col-sm-4, .col-sm-3, .col-sm-2, .col-sm-1, .col-md-12, .col-md-11, .col-md-10, .col-md-9, .col-md-8, .col-md-7, .col-md-6, .col-md-5, .col-md-4, .col-md-3, .col-md-2, .col-md-1, .col-lg-12, .col-lg-11, .col-lg-10, .col-lg-9, .col-lg-8, .col-lg-7, .col-lg-6, .col-lg-5, .col-lg-4, .col-lg-3, .col-lg-2, .col-lg-1, .col-xl-12, .col-xl-11, .col-xl-10, .col-xl-9, .col-xl-8, .col-xl-7, .col-xl-6, .col-xl-5, .col-xl-4, .col-xl-3, .col-xl-2, .col-xl-1{
border: solid 2px #666666;
}
*/

/* START: NAVIGATION STYLES */
.navbar
{
    font-family: 'Permanent Marker', cursive;
    background: #FFF56C;
    padding: 5px;
}

.navbar-toggler
{
    float: right;
    margin: 30px 20px;
    color: #0457A0;
}
.navbar-toggleable-sm
{
    clear: both;
    float: left;
    padding: 5px 15px;
}
.navbar-toggleable-sm li
{
    clear: both;
}
.containernav 
{
/*
    width: 520px;
    height: 330px;
    position: absolute;
    margin: 20px;
*/
    overflow: hidden;
}
ul.topnav 
{
    margin: 30px 0 0; 
    padding: 0; 
    list-style: none;   
    font-size: 1em;
    clear: both;
    float: right;
/*   width: 520px;*/
}
ul.topnav li
{
    margin: 0; 
    padding: 0; 
    overflow: hidden; 
    float: left; 
    height: 40px;
}
ul.topnav a, ul.topnav span 
{
    padding: 10px 20px; 
    float: left; 
    text-decoration: none; 
    color: #0457A0;
    clear: both;
/*   height: 20px;*/
    line-height: 20px;
    background: #FFF56C; 
}
ul.topnav a 
{   
    color: #fff;
    background: #0457A0;
}
.collapse ul.topnav a 
{   
    width: 150px;
}
ul.topnav span 
{
    display: none;
}
/* END: NAVIGATION STYLES */



/* START: BANNER STYLES */
button
{
    font-family: 'Permanent Marker', cursive;
    background: #d50000;
    color: #fff;
    border-radius: 50px;
    padding: 15px;
    margin: 10px 0 5px;
    
}
#hero1, #hero2, #hero3, #hero4
{
    display: none;
}
#hpin
{
    background: #FFF56C;
    padding: 100px 15px;
    display: none;
}
.padclear
{
    padding: 0;
}
.center
{
    text-align: center;
}
.italic
{
    font-style: italic;
}
.hpenter
{
    background: #0457A0;
}
.hpenter h1
{
    color: #FFF56C;
    padding: 50px 0 20px;
}
.pgheading
{
    background: #0457A0;
    color: #FFF56C;
    padding: 5px 15px 0;
}
.interiorcontent
{
    background: #FFF56C;
    padding: 100px 15px;
}
.hpincontain
{
    background: rgba(255,255,255,.6);
    border-radius: 10px;
}
.hpincontain h3
{
    color: #0457A0;
    padding: 50px 0 20px;
}
.hpincontain h5
{
    color: #0457A0;
    padding: 10px 15px 5px;
}
.menuitem
{
    background: #0457A0;
    margin-top: 5px;
    border-radius: 10px;
}
.menuitem h5
{
        color: #FFF56C;
}
.menuingredient
{
    display: none;
}
.bottommargin
{
    margin-bottom: 100px;
}
/* image gallery */
#slider 
{
    width: 100%;
    max-width: 600px;
    height: auto;
    overflow: hidden;
    margin: auto;
}

#slider ul 
{
    list-style: none;
    width: 3000px;
    height: 480px;
    margin: 0;
    padding: 0;
}
#slider li 
{
    float: left;
    width: 600px;
    height: 480px;
}

.button 
{
    font-family: 'Permanent Marker', cursive;
    font-size: 1em;
    display: block;
    padding: 10px;
    margin: 10px 0 0 0;
    background: #d50000;
    color: #fff;
/*    border: 1px solid #000;*/
    border-radius: 10px;
}

.back 
{
  float: left;
}

.next 
{
  float: right;
}
/* END: BANNER STYLES */



/* START: HEADING STYLES */
h1, h3,h5
{
    font-family: 'Permanent Marker', cursive;
}
/* END: HEADING STYLES */



/* START: CONTENT STYLES */
body
{
    font-family: 'Dosis', sans-serif;
}
p
{
    font-size: 1.1em;
    color: #0457A0;
}
/* END: CONTENT STYLES */



/* START: FOOTER STYLES */
.footer
{
    background: #000;
    padding: 100px 15px
}
.footer p
{
    color: #fff;
}
/* START: FOOTER STYLES */