body {
}

body header
{    
    padding: 22px 3%;
}
body #slideshow img
{
    
}
    body .bxslider p
    {
        text-align:center;
        left:0;
        padding:0 10%;
        font-size:2.5em;
        width:80%;
        text-shadow:0 0 3px #222;
        line-height:1.4em;
    }
    body .bxslider a
    {
        width: 120px;
        left: 50%;
        margin-left: -84px;
    }

body #homeSection1
{
    padding:75px 1%;
    width:98%;
    text-align:center;       
}

body #homeSection1 a.featureItem
{
    margin-left:1%;
    margin-right:1%;
    margin-bottom:2%;
}
    body #homeSection1 a.featureItem.first, body #homeSection1 a.featureItem.item4
    {
        margin-left:1%;   
    }

body #footerLinks, body div#headingContainer
{
    width:94%;
    padding:30px 3%;    
}
body div#headingContainer
{
    margin-bottom:32px;
}
body #centerContainer > #content, body #centerContainer > #rightColumn, div#internalNav
{
    width:94%;
    padding:0 3%;
    margin-left:0;
}
body #footerLinks #footerLinksInner > ul
{
    max-width:100%;
    width:100%;
    text-align:center;
}
    body #footerLinks #footerLinksInner > ul > li{
        margin-right:0;
    }
body #footerLinks #footerLinksInner #rightLinks
{
    float:none;
    text-align:center;
    width:100%;
}

body .headerRowContainer
{
    width:94%;
    padding:6px 3%;
}

body .recordRow
{
    padding:25px 3%;
}

body #tideContainer a#weatherForecast{
    margin-top:32px;
}

#content #anchorList
{
    display:block;
}

#centerContainer > #rightColumn #anchorList
{
    display:none;
}

@media(max-width:1130px)
{
    body #Weather #weatherContainer
    {
        width:100%;
        float:none;
    }
    body div#windForceContainer img
    {
        width:79px;
    }
    body div#windForceContainer span#force
    {
        top: 33px;
        left: 30px;
    }
    body #Weather #weatherContainer #Right, body #Weather #weatherContainer #left {
        float:none;
        width:100%;
        clear:both;
        margin-bottom:30px;
    }    
        body #Weather #Right > img
        {
            width:120px;
            max-width: 350px;
        }
        body div#windForceContainer
        {
            display:inline-block;
            vertical-align:top;   
            margin-left:5px;   
            margin-top: -5px;   
            font-size:0.7em;
        }
    body #Weather #tideContainer
    {
        width:100%;       
        float:none;
    }
}

@media(max-width:1100px)
{
    body header.open #hMenu
    {
        background:none;
    }

    body #HeaderSocialMedia a:after
    {
        width: 30px;
        height: 30px;
        margin-left: -15px;
        margin-top: -15px;
    }

    body nav#MainMenu
    {
        top:66px;
        height:calc(100% - 66px);
    }



    #hMenu a
    {
        display:none;
    }    
    

    body #hMenu
    {
        background: none;
        border: 0px #fff;
        width: 0px;
        padding: 0 0 0 30px;
        position: absolute;
        top: 0;
        right: 0;
        margin: 0;
    }
        body #hMenu span.burger
        {
            color:#182b40;        
            text-indent: -9999px;
            transition:0.5s all;
        }
            body #hMenu span.burger:before
            {
                width:30px;
                max-width:30px;
                color: #fff;
                font-weight: bold;
                top: 15px;
                left: auto;
                margin: 0;
                right: 20px;
                font-size: 3.4em;
                background: #025fae;
                line-height: 0.8em;
                height: 36px;
                border: 2px solid #025fae;
                /* position: relative; */
                padding: 0px 18px;
                border-radius: 3px;     
                text-indent: 0px;           
            }

            body #hMenu span.burger.open:before, body #hMenu span.burger.open:before{
                color:#fff;
                text-shadow:none;
            }
    
        body header > a
        {
            display:inline-block;
            width:200px;
        }
            body header > a > img
            {
                display:block;
                width:100%;
            }
    #hArrivals, #hWeather
    {
        padding:4px 13px;
    }
    #hArrivals:after
    {
        top:3px;
    }
    #hWeather:after{
        top:4px;
    }
    body header
    {
        height:68px;
        padding:15px 3%;
    }
    body
    {
        padding-top:68px;
    }
    body #HeaderSocialMedia
    {
        font-size:0.8em;
        margin-top:0px;
    }
    body #Search, body #Social, body #KeyButtons, body #Weather, body #footerSocial
    {
        padding:32px 3%;
        width:94%;
    }
    #hWeather
    {
        margin-right:75px;
    }  
}

@media(max-width:900px)
{            
    body header
    {
        padding:15px 20px;
    } 

    #hArrivals, #hWeather
    {
        width:40px;
        margin-left:6px;
    }
        #hArrivals:after
        {
            right:20px;
        }
    
    #hArrivals > span, #hWeather > span
    {
        display:none;
    }            
    body #HeaderSocialMedia
    {
        display:none;
    }
    
    body #HeaderSocialMedia a
    {
        margin:0 2px;
    }
    #Search, #Social
    {
        padding:60px 3%;
    }
    body #News
    {
        padding:32px 3%;
        width:94%;
    }
    body .newsLetter
    {
        display:block;
        float:none;
        margin:0 auto 20px auto;
    }
    body .socialMedia
    {
        float:none;
        display:block;
        margin:0 auto;
    }
    a.Button.newsletterSignup
    {
        margin:20px auto 40px auto;        
    }
    #signUpOverlay iframe
    {
        left:10%;
        right:10%;
        width:80%;
        height:60%;
        top:20%;
    }
}

@media(max-width:768px) {
    body div#headingContainer
    {
        display:none;
    }
    #centerContainer #slideshow
    {
        margin-bottom:0;
    }
    body #internalNav
    {
        position:relative;
    }
    body #internalNav span#first {
        display: block;
        float: none;
        width: 100%;
        padding:20px 3%;
        background: #E6E9EE;
        margin-left: -3%;
        /* margin-right: -2%; */
    }
        body #internalNav ul {
            display: none;
            top: 73px;
            left: 0;
            position: absolute;
            background: #1d2c3f;
            width:100%;
            padding:10px 0;
        }
            body #internalNav ul li {
                display:block;
                width:100%;
                padding:10px 0;
            }
                body #internalNav ul li a
                {
                    line-height:1em;
                    font-size:1.6em;
                    margin-left:3%;
                }
                    body #internalNav ul li a:before
                    {
                        content:'- '
                    }
                body #internalNav ul li span
                {
                    color:#fff;
                    text-decoration:none;
                    line-height:1em;
                    font-size:1.6em;
                    margin-left:3%;
                }


    #centerContainer h2, #centerContainer h4, #centerContainer h5, #centerContainer h6
    {
        font-size:1.8em;
        margin-bottom:20px;
    }

    #centerContainer > #content p, #centerContainer > #content ol, #centerContainer > #content ul, #centerContainer > #content table
    {
        font-size:1.2em;
        margin-bottom:20px;
    }


    body #internalNav span#first:after
    {
        content: '\e906';
        /* width: 0; */
        /* height: 0; */
        /* border-left: 3px solid #000; */
        /* border-top: 3px solid #000; */
        width: 0;
        height: 0;
        color: #000;
        position: absolute;
        right: 35px;
        top: 25px;
        z-index: 3;
        font-size: 1.8em;
        font-family: 'icomoon' !important;
    }

    #internalNav span#first span, #internalNav span#first a
    {
        border-right:0;
        text-decoration:none;
    }


    body #News ul li {
        width:100%;
        height:auto;
        margin-left:0;
    }
    body #News ul li a > span.icon-wave
    {
        display:none;
    }
    
    body #homeSection1
    {
        padding:32px 1%;
    }
    body h2 {
        font-size:2.2em;
        margin-bottom:32px;
    }
    body a.Button
    {
        margin-top:32px;
    }
    
    body #Weather #weatherContainer:before, body #Weather #tideContainer:before
    {
        margin-left:-3%;
        width:106%;
    }

    #Weather #weatherContainer:before, #Weather #tideContainer:before
    {
        background:#E5E8ED;
        border:0px;
        padding-top:20px;
    }

    body #footerLinks #footerLinksInner #rightLinks h3
    {
        color:#fff;
    }
    body #footerLinks #footerLinksInner #rightLinks a
    {
        color:#9AAABD;
    }

    body footer
    {
        padding:30px 3%;
        text-align:center;
    }

    body #KeyButtons a.Button
    {
        margin:10px;
    }
    body .headerRowContainer
    {
        background:#e5e8ed;
    }


    body .headerRowContainer .headerRow span
    {
        display:none;
    }
    body .recordRow
    {
        font-size:1.7em;
    }
        body .headerRowContainer .headerRow span:first-child
        {
            display:block;
            text-align:center;
            width:100%;
            color:#333;
            text-transform:capitalize;
            font-size:1.2em;
        }

        body .recordContainer .recordRow > span:first-child {
            display: block;
            margin: 0 auto 40px auto;
            text-align: left;
            width:250px;
        }

        body .recordContainer .recordRow span:nth-child(2)
        {
            width:50%;
            position:relative;
        }
            body .recordContainer.arrival .recordRow span:nth-child(2):before, body .recordContainer.arrival .recordRow span:nth-child(3):before, body .recordContainer.arrival .recordRow span:nth-child(4):before
            {
                content:'FROM';
                position:absolute;
                left:0;
                top:-18px;
                color:#777;
                font-weight:bold;
                font-size:0.7em;
            }
            body .recordContainer.arrival .recordRow span:nth-child(3):before
            {
                content:'TIME';
            }
            body .recordContainer.arrival .recordRow span:nth-child(4):before
            {
                content:'ARRIVED';
            }
            body .recordContainer.departure .recordRow span:nth-child(2):before, body .recordContainer.departure .recordRow span:nth-child(3):before, body .recordContainer.departure .recordRow span:nth-child(4):before
            {
                content:'TO';
                position:absolute;
                left:0;
                top:-18px;
                color:#777;
                font-weight:bold;
                font-size:0.7em;
            }
            body .recordContainer.departure .recordRow span:nth-child(3):before
            {
                content:'TIME';
            }
            body .recordContainer.departure .recordRow span:nth-child(4):before
            {
                content:'DEPARTED';   
            }
        body .recordContainer .recordRow span:nth-child(3), body .recordContainer .recordRow span:nth-child(4)
        {
            width:25%;
            position:relative;
        }        
    body #homeSection1 a.featureItem:hover p
    {
        display:none !important;
    }

    iframe#marinetraffic
    {
        max-width:100%;
        margin:0 auto;
        display:block;
        margin-bottom:30px;
    }
    div#trafficContainer #trafficInnerContainer
    {
        left:0;
        margin-left:0;
        top:0;
        margin-top:80px;
    }
}
@media(max-width:650px)
{
    body #homeSection1 a.featureItem
    {
        width:48%;
    }
    body #homeSection1 a.featureItem img
    {
        width:100%;
    }
        body #homeSection1 a.featureItem > span
        {
            font-size:1.6em;
            padding: 16px 8%;
            min-height:40px;
        }    
}
@media(max-width:580px)
{
    #HeaderSocialMedia
    {
        float:none;        
    }
    
    
}

@media(max-width:470px)
{
    body #hMenu span.burger
    {
        color:#fff;
    }
    body #hMenu span.burger.open
    {
        color:#182B40;
    }
    body nav#MainMenu
    {
        top:116px;
        height: calc(100% - 102px);
    }    
    body
    {
        padding-top:140px;
    }
    body header
    {
        height:140px;
    }

    #hArrivals
    {
        position: absolute;
        top: 76px;
        left: 50%;
        margin-left: -110px;
    }
    #hWeather
    {
        position: absolute;
        top: 76px;
        left: 50%;
        margin-left:-35px;
    }
    div#hMenu
    {
        top:61px;
        right: 50%;
        margin-right: -129px;
    }

    body header > a
    {
        float:none;
        display:block;
        margin:0 auto;
    }
}

@media(min-width:426px)
{
    body nav#MainMenu > ul > li > ul
    {
        display:block !important;
    }
}

@media(max-width:425px)
{
    body header > a {
        float: none;
        display: block;
        margin: 0 auto;
    }
    
    #hArrivals, #hWeather
    {
        float:right;
    }
    #hWeather
    {
        clear:both;
        margin-right:0px;
    }
    

    body #HeaderSocialMedia
    {
        float:left;
        margin-top:3px;
    }
    body #homeSection1 a.featureItem img
    {
        display:none;
    }
    body nav#MainMenu
    {
        text-align:left;
    }
    body nav#MainMenu > ul > li > a, body nav#MainMenu > ul > li > span
    {
        font-size:1.6em;
        text-align:left;
        padding:25px;
        display:inline-block;       
        box-sizing:border-box;
        width:80%; 
        margin:0;
    }
        body nav#MainMenu > ul > li
        {
            position:relative;
            display:block;
            border-bottom:1px solid #324152;
        }
        body nav#MainMenu > ul > li.first
        {
            border-top:1px solid #324152;
        }
        body nav#MainMenu > ul > li > .navArrow
        {
            float:right;         
            display:block;   
            box-sizing:border-box;
            width:20%;
            padding:33px 25px;
            margin:0;
            position:relative
        }
        body nav#MainMenu > ul > li > .navArrow:before
        {
            content: "\e906";            
            color:#fff;
            font-size:1em;
            float:right;
            position:absolute;
            right:25px;
            top:25px;
        }
        body nav#MainMenu > ul > li.open > .navArrow:before
        {
            content: "\e907";            
        }
    body nav#MainMenu > ul > li > ul
    {
        display:none;
    }
        body nav#MainMenu > ul > li > ul > li
        {
            display:block;
            padding:0 25px;
        }
        body nav#MainMenu #search1 input[name=q]
        {
            display:none;
        }
        body nav#MainMenu div#search2 input[name=q]
        {
            margin:25px 0 10px 0;
        }
        body nav#MainMenu div#search2 {
            text-align: center;
        }

        body footer > ul li {
        display: block;
        border: 0;
        line-height: 2.2em;
    }
}

@media(max-width:400px)
{
    body .newsLetter
    {
        width:100%;
    }   
    body #Search input
    {
        box-sizing:border-box;
    }    
}
@media(max-width:375px)
{
    body span#highTemp, body span#lowTemp
    {
        margin-right:15px;
        font-size:1.6em;
    }
    body span#UV
    {
        font-size:1.6em;
    }

    body h3
    {
        font-size:1.8em;
    }
}

@media(max-width:320px)
{

}