/* http://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)
*/

/* #region */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section { display: block; }
body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after,
q:before, q:after { content: ''; content: none; }
table { border-collapse: collapse; border-spacing: 0; }

/* #endregion */

.sponsors-flex {
	display: flex;
    flex-wrap: wrap;
}

.sponsors-flex .item{
	flex-grow: 0;
   flex-shrink: 0;
   flex-basis: 23%;
	align-self: center;
	text-align: center;
}

.sealice li.facebook { float: right !important; }

@media only screen and (max-width : 480px) {
.sponsors-flex .item{
	width: 50%;
				flex-basis: unset;
}
			

.sponsors-flex .item img{
	max-width: 100%;
}
}

/************************* global stuff ***************************/

/* #region */

div.left { float: left; }
div.right { float: right; }
div.clear { clear: both; }
div.no-text { font-size: 1px; }

.no-margin { margin: 0px !important; }
em { font-style: italic; }

.image-left { float: left; margin: 3px 20px 10px 0px !important; }

.image-right { float: right; margin: 3px 0 10px 20px !important; }

.replace { position: relative; display: block; }

.replace span { padding: 0; margin: 0; display: block; width: 100%; height: 100%; z-index: 1; position: absolute; top: 0; left: 0; }

h1#site-logo { width: 156px; height: 67px; font-size: 15px; position: relative; }

h1#site-logo a { width: 100%; height: 100%; display: block; }

h1#site-logo span { background: url("../images/site-logo.png") no-repeat; background-size: 100%; }

a, a:active, a:link, a:visited { color: #2289d1; text-decoration: none; }
a:hover { color: #0b69aa; text-decoration: none; }

a.dark, a.dark:active, a.dark:link, a.dark:visited { color: #053465; text-decoration: none; }
a.dark:hover { color: #1663b3; text-decoration: none; }

.dark-bg a { color: #fff; }
.dark-bg a:hover { color: #ddd; }

hr { border: 0; height: 1px; background: #bbb; color: #bbb; }

.a-rollover:hover { opacity: .90; filter: alpha(opacity=90); }

.img-rollover:hover img { opacity: .90; filter: alpha(opacity=90); }

#footer .img-rollover:hover img { opacity: .80; filter: alpha(opacity=80); }

.link-rollover:hover span { opacity: .90; filter: alpha(opacity=90); }


@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
    .content-area, #footer, #nav { -webkit-text-size-adjust: 100%; }
}

/* #endregion */

/*********************************** main layout elements **********************/

/* #region */

body { font-size: 12px; line-height: 17px; font-family: 'open sans', segoe ui, tahoma, arial, helvetica, sans serif; color: #666f7c; background-color: #d4dde5; }

/*div.backstretch {
    display: none;
}*/


#outer { background-color: #fff; }

#home-banner { margin: 0 auto; }

#home-banner img { width: 100%; max-width: 1426px; }

#header { height: 105px; margin: 0px auto 0px auto; background-color: #fff; position: relative; z-index: 1000; }

#logo-outer { position: absolute; top: 30px; left: 15px; }

.inner-container { max-width: 1080px; min-width: 290px; padding: 0 15px 0 15px; margin: 0 auto; }

#main { background-color: #fff; }


.navDropdown { display: block; float: right; margin-top: 30px; margin-right: -9px; }
.navDropdown small { background: url(../images/dropArrow.png) 50% 17px no-repeat; font-size: 9px; color: #202f43; font-weight: bold; text-transform: uppercase; display: block; cursor: pointer; padding: 42px 23px 15px; background-size: 26px 21px; }
.navDropdown small.active { background: #f7b408 url(../images/dropArrow.png) 50% 17px no-repeat; background-size: 26px 21px; }
.nippers .navDropdown small.active { background: #3f85d9 url(../images/dropArrow.png) 50% 17px no-repeat; background-size: 26px 21px; }



.navDropdown .navDropdownIn { background: #f7b408; position: absolute; left: 0; top: 104px; width: 100%; display: none; z-index: 2000; }
.nippers .navDropdown .navDropdownIn { background: #3f85d9; position: absolute; left: 0; top: 104px; width: 100%; display: none; z-index: 2000; }
.navDropdown .navDropdownIn ul { line-height: normal; list-style: none; }
.navDropdown .navDropdownIn ul li { font-size: 12px; color: #606068; text-transform: uppercase; float: none; border-bottom: 1px solid #f6d98e; font-weight: 300; position: relative; }
.nippers .navDropdown .navDropdownIn ul li { font-size: 12px; color: #606068; text-transform: uppercase; float: none; border-bottom: 1px solid #3174c5; font-weight: 300; position: relative; }
.navDropdown .navDropdownIn ul li a { color: #202f43; padding: 12px 15px; text-decoration: none; display: block; }
.nippers .navDropdown .navDropdownIn ul li a { color: #fff; padding: 12px 15px; text-decoration: none; display: block; }

.navDropdown .navDropdownIn ul li span.arrow { background: url(../images/downArrow.png) 17px 17px no-repeat; background-size: 10px 7px; position: absolute; top: 0px; right: 0; display: block; width: 10px; height: 7px; cursor: pointer; z-index: 99; padding: 17px 17px 17px 17px; }
.navDropdown .navDropdownIn ul li span.active { background: url(../images/upArrow.png) 17px 17px no-repeat; background-size: 10px 7px; }

.navDropdown .navDropdownIn ul li ul { background: #e09106; }
.nippers .navDropdown .navDropdownIn ul li ul { background: #367bcd; }
.navDropdown .navDropdownIn ul li ul li a { padding: 12px 30px; font-size: 12px; }
.nippers .navDropdown .navDropdownIn ul li ul li a { padding: 12px 30px; font-size: 12px; }

#top-nav, #nav, #nav-nippers-outer { display: none; }

#footer { min-height: 189px; height: auto !important; height: 189px; position: relative; background-color: #143c6f; color: #c5c5c5; }

#footer-outer { background-color: #143c6f; }

.nippers #footer { background-color: #094fa3; }

.nippers #footer-outer { background-color: #094fa3; }

.sealice #footer { background-color: #002f67; }

.sealice #footer-outer { background-color: #002f67; }



#bottom { height: 35px; }

#bottom #credits { float: right; width: 150px; text-align: right; font-size: 90%; }


#bottom #credits a { color: #2d5f9e; }

#bottom #credits a:hover { color: #396fb3; }

/*#bottom-inner {
    max-width: 1080px;
    min-width: 290px;
    height: 35px;
    padding: 0 15px 0 15px;
    margin: 0 auto;
  background-color: #212222;
}*/

/* #endregion */

/********************** footer *************************/

#footer a { color: #c5c5c5 !important; }
#footer a:hover { color: #aaa; }

#footer #contact-info { float: left; padding: 25px 40px 15px 0px; position: relative; min-width: 250px; color: #c5c5c5 !important; }
#footer #contact-info .right p { padding: 5px 0px 5px; }


#footer #middle { float: left; padding: 10px 0 15px 0; position: relative; width: 194px; }



#footer #right { float: left; padding: 15px 0 35px 0; position: relative; width: 290px; text-align: left; line-height: 21px; }

#footer #right h3 { font-weight: 700; font-size: 110%; }
#weather #inner { padding: 14px 0 14px 0; margin: 10px 0 10px 0; font-size: 95%; border-top: 1px solid #3a5b86; border-bottom: 1px solid #3a5b86; }

.nippers #weather #inner { border-top: 1px solid #316bb2; border-bottom: 1px solid #316bb2; }



/*#footer #contact-info .left { 
    position: absolute;
    bottom: 30px;
    right: 0px;
}

#footer #contact-info .left img { 
    width: 90px;
}*/



#footer #contact-info .left { position: static; float: left; width: 134px; }

#footer #contact-info .left img { width: 124px; display: none; }



#footer #contact-info .right { float: left; width: 240px; }

/*#footer .right { padding: 30px 0 35px 0; position: relative; width: 400px; text-align: right; }*/


/********************** home *************************/

/* #region */


.home-main { padding: 15px !important; }

#home-news { width: 100%; margin-bottom: 30px; }

.home-list h2 { font-weight: 300; }
.home-redev-feature-items h2 { font-weight: 400; }

.home-list i { font-size: 80%; }

.home-list h2 a { display: block; font-size: 170%; color: #fff; padding: 17px 0 11px 12px; position: relative; }

#home-news h2 a, #home-news .lower-link { background-color: #143c6f; color: #c4cedb; }

#home-news h2 a:hover, #home-news .lower-link:hover { background-color: #1d4c87; }

#home-events h2 a:hover, #home-events .lower-link:hover { background-color: #f7c61c; }



#home-events h2 a, #home-events .lower-link { background-color: #f7b408; }


.home-list h2 a img { position: absolute; bottom: 11px; right: 12px; width: 20px; height: auto; }



.home-list .lower-link { display: block; color: #fff; text-align: right; padding: 8px 19px; }

#home-events { width: 100%; }

.home-list-item { padding: 12px 0 12px 0; border-top: 1px solid #eee; }

.home-list-item:first-child { border-top: 0px; }

#home-news .home-list-item { padding: 8px 8px 11px 8px; }

.home-list-item h3 { overflow: auto; }

#home-events .home-list-item h3 { font-size: 110%; line-height: 130%; }
#home-news .home-list-item h3 { font-size: 110%; line-height: 130%; }

#home-events .home-list-item h3, #home-news .home-list-item h3 { font-weight: 400; }

#home-events .home-list-item { padding: 9px 0 9px 0; }

.home-list-item .news-date { background-color: #eee; display: block; float: left; width: 55px; padding: 4px 5px; margin-right: 13px; font-size: 70%; text-transform: uppercase; margin-top: 0px; }

.home-list-item .event-date { display: block; float: left; width: 65px; padding: 2px 0; margin-right: 19px; font-size: 85%; line-height: 130%; text-transform: uppercase; margin-top: 0px; text-align: right; }

.home-list-item .event-date span { font-size: 130%; }

#home-banner { /*top: 0;
  z-index: 200;*/ position: relative; width: 100%; min-width: 320px; height: 0; /* 39% being the ratio we are maintaining 
	 * calculated by looking at the image 
	 * ratio: 400/1024 = ~0.39
        592/1406 = 0.42 */ padding: 0 0 42% 0; }

.overlay-outer { position: absolute; top: 51px; left: 0px; background: url("../images/overlay-outer-bg.png") no-repeat; padding-top: 20px; width: 406px; display: none; }

.overlay-inner { background: url("../images/overlay-inner-bg.png") no-repeat; background-position: left bottom; width: 373px; padding: 25px 50px 47px 32px; color: #202f43; }


#home-lower { padding-top: 49px; }

#home-lower-left { width: 100%; }

#home-lower-right { padding-bottom: 20px; width: 100%; }

#home-lower-right .home-feature-item, .home-redev .home-feature-item { width: 100%; margin-bottom: 15px; border-top: 1px solid #d6d6d6; position: relative; }

#home-lower-right .home-feature-item a, .home-redev .home-feature-item a { color: #202f43; }

#home-lower-right .home-feature-item a i, .home-redev .home-feature-item a i { position: absolute; top: 13px; right: 0px; color: #a3a3a3; font-size: 130%; }

#home-lower-right .home-feature-item h2, .home-redev .home-feature-item h2 { font-size: 140%; padding: 13px 0; }

#home-lower-right .home-feature-item img, #nipper-feature img, .home-redev .home-feature-item img { width: 100%; }

#home-lower-right .home-feature-item-left, .home-redev .home-feature-item-left { float: left; }

#home-lower-right .home-feature-item-right, .home-redev .home-feature-item-right { float: right; }

.home-redev-feature-items { margin-top: 2rem; }





#home-lower-left .social-link { display: block; background-color: #dcdada; position: relative; margin-bottom: 3px; padding: 9px 30px 7px 76px; }

#home-lower-left .facebook-link { background: url("../images/fb-logo-home.png") #dcdada left bottom no-repeat; }

#home-lower-left .twitter-link { background: url("../images/twitter-logo-home.png") #dcdada left bottom no-repeat; }

#home-lower-left .instagram-link { background: url("../images/instagram-logo-home.png") #dcdada left bottom no-repeat; }

#home-lower-left .social-link i { position: absolute; top: 8px; right: 5px; color: #fff; font-size: 130%; }




#home-sponsors { position: relative; padding: 30px 0 30px 0; }

#home-sponsors h3 { font-size: 150%; font-weight: 300; padding: 0 0 25px 0; color: #202f43; }





/************** sponsor slider  ********************/

.slider-container { /* defaults for resposive height container */ position: relative; width: 95%; height: 70px; margin: 0 auto; overflow: visible; }

.iosSlider-sponsors { width: 100%; height: 70px; }

.iosSlider-sponsors .item { min-height: 70px; padding-left: 8px; padding-right: 8px; }

.iosSlider-sponsors .slider { width: 100%; height: 100%; }

.iosSlider-sponsors .slider .item { float: left; width: 15%; }

.iosSlider-sponsors .slider .item img { width: 100%; height: auto; }




#home-sponsors .prev, #home-sponsors .next { position: absolute; top: 58%; margin-top: -19px; width: 22px; height: 37px; z-index: 10; }


#home-sponsors .prev { left: 0; }
#home-sponsors .next { right: 0; }



/*************** home slider ********************/

.iosSlider { width: 100%; height: 592px; }

.iosSlider .slider { width: 100%; height: 100%; }

.iosSlider .slider .item { float: left; width: 100%; }

.iosSlider .slider .item img { width: 100%; height: auto; }




/*.iosSlider .slider .item  img{
	width: 100% !important;
}*/


.iosSlider .prev, .iosSlider .next { position: absolute; top: 50%; margin-top: -25px; width: 100px; height: 50px; z-index: 10; background: url(/images/controls.png) no-repeat center top; opacity: .5; filter: alpha(opacity=50); }




.iosSlider.hideControls .next { opacity: 0; filter: alpha(opacity=0); }
.iosSlider.hideControls:hover .prev,
.iosSlider.hideControls:hover .next { opacity: .5; filter: alpha(opacity=50); }
.iosSlider .prev { left: 0; }
.iosSlider .next { right: 0; background-position: center bottom; }
.iosSlider .prev:hover, .iosSlider .next:hover { opacity: 1 !important; filter: alpha(opacity=100); }
.iosSlider .prev .btn-label,
.iosSlider .next .btn-label { background: rgba(0, 0, 0, 0.4); color: #fff; font-weight: 700; display: inline-block; padding: 0 4px; line-height: 20px; position: absolute; top: 50%; margin-top: -10px; opacity: 0; filter: alpha(opacity=0); }
.iosSlider .prev .btn-label { right: -20px; }
.iosSlider .next .btn-label { left: -20px; }
.iosSlider .prev:hover .btn-label { right: -5px; opacity: 1; filter: alpha(opacity=100); }
.iosSlider .next:hover .btn-label { left: -5px; opacity: 1; filter: alpha(opacity=100); }

.iosSlider .prev, .iosSlider .next, .iosSlider .prev .btn-label, .iosSlider .next .btn-label, .iosSlider.hideCaptions .item .caption, .selectorsBlock.thumbs .selectors .item, .selectorsBlock.thumbs, #thumbTrayButton { transition: all 0.2s ease-out 0s; }



@media (max-width: 960px) {


    .iosSlider .prev, .iosSlider .next { -webkit-transform: scale(0.5); -webkit-transform-origin: 50% 100%; -moz-transform: scale(0.5); -moz-transform-origin: 50% 100%; -o-transform: scale(0.5); -o-transform-origin: 50% 100%; -ms-transform: scale(0.5); -ms-transform-origin: 50% 100%; transform: scale(0.5); transform-origin: 50% 100%; }

    .iosSlider .prev { left: -35px; }
    .iosSlider .next { right: -35px; }
}


/* #endregion */

/********************** sub *************************/

/* #region */

#sub-banner-outer { background-color: #888; position: relative; }

#sub-banner-outer img { width: 100% !important; }



#sub-main-outer { background-color: #ffffff; position: relative; }

#sub-main { margin: 0px auto 0px auto; min-height: 400px; height: auto !important; height: 400px; padding-bottom: 45px; }

#sub-title-outer { background-color: #143c6f; }

#sub-title { position: relative; padding-top: 17px; padding-bottom: 17px; }

.nippers #sub-title { position: relative; padding-top: 10px; padding-bottom: 9px; }

#sub-title h1 { font-family: 'Open Sans', Segoe UI, Tahoma, Verdana, Helvetica, Arial, sans-serif; color: #fff; font-size: 240%; line-height: 140%; letter-spacing: -0.01em; font-weight: 300; }

.nippers #sub-title h1 { font-size: 300%; line-height: 100%; padding-top: 3%; }

#content-left { float: left; width: 100%; padding: 30px 0 0 0; }

#content-wide { float: left; width: 100%; padding: 30px 0 0 0; }

#content-right { float: right; width: 25%; padding: 20px 0 0 0; }

.two-columns #content-right { padding: 30px 0 0 0; width: 100%; float: left; }

.sponsor-side-column #content-right { padding: 40px 0 0 0; width: 164px; float: left; }

.sponsor-side-column #content-right h3 { padding: 10px 10px 10px 10px; margin: 0px 0 20px 0; font-size: 120%; font-weight: 300; background-color: #eee; }

.sponsor-side-column #content-right img { margin-bottom: 20px; }

#sub-banner-outer .overlay-inner {   padding: 15px 30px 37px 22px; }



#breadcrumb-outer { background-color: #35619a; }

#breadcrumb { padding-top: 4px; padding-bottom: 4px; color: #223e62; }

#breadcrumb i { color: #223e62; font-size: 90%; }

#breadcrumb a { color: #7596c1; }




#content-right .side-image { padding: 0px 0 30px 0; }

#content-right .side-image p { padding: 5px 0 0px 0; font-size: 90%; }


/* #endregion */


/********************* nipper of the week *****************/

#nipper-feature { padding: 0px 0 25px 0; }


#nipper-feature h2 { font-size: 140%; padding: 12px 0 13px 0; border-top: 1px solid #d6d6d6; color: #202f43; }

#nipper-feature h3 { font-size: 100%; padding: 10px 0 3px 0; font-weight: bold; }

/********************** document library *************************/

#latest-documents { padding: 20px 0 15px 0; }

#latest-documents h2 { font-size: 140%; padding: 10px 0 15px 0; background: url("../images/home-doc-icon.png") 0px 10px no-repeat; background-position: right 10px; color: #202f43; }

#latest-documents h2 a { display: block; color: #202f43; }

#latest-documents p { border-bottom: 1px solid #c7c7c7; padding: 7px 0px 7px 30px; background: url("../images/icon-document.png") 11px 9px no-repeat; }

#latest-documents #doc-list p:first-child { border-top: 1px solid #c7c7c7; }

.doc-library { padding-top: 40px; width: 60% !important; }

.doc-library h2 { border-top: 2px solid #fff; display: block; }

.doc-library h2 a { padding: 10px 10px 10px 37px; background-color: #ddd; display: block; position: relative; background: url("../images/icon-folder.png") #ddd 10px 10px no-repeat; }

.doc-library h2 a span { font-size: 80%; }

.doc-library h2 a i { position: absolute; right: 11px; top: 13px; }

.doc-library h2.level-2 a { background: url("../images/icon-folder.png") #eee 10px 10px no-repeat; }

.folder-contents { padding: 0px 0px 0px 30px; /*border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;*/ display: none; }

.folder-contents a { /*padding: 5px 0px 5px 10px;*/ }

.folder-contents p { border-top: 1px solid #e5e5e5; padding: 7px 0px 7px 30px; background: url("../images/icon-document.png") 11px 8px no-repeat; }

.folder-contents p:first-child { border-top: 0px; }


/********************** events calendar V2 *************************/

#calendar-left { float: left; width: 17%; padding: 41px 0 0 0; }

#calendar-right { float: right; width: 80%; padding: 35px 0 0 0; }

.nippers #calendar-right { float: left; }

#calendar-left p.event-category { padding: 0px 0 10px 0; }


#calendar-table td a.category13 { background-color: #f78947; }
#calendar-table td a.category12 { background-color: #9abff0; }
#calendar-table td a.category11 { background-color: #94e67d; }
#calendar-table td a.category10 { background-color: #bbb; }
#calendar-table td a.category14 { background-color: #f8c424; }
#calendar-table td a.category15 { background-color: #f4a6a6; }
#calendar-table td a.category16 { background-color: #8e7de6; }
#calendar-table td a.category17 { background-color: #7de6e2; }
#calendar-table td a.category186 { background-color: #fb2828; color: #730e0e; }
#calendar-table td a.category190 { background-color: #79b1f3; }

table#calendar-table td, table#calendar-table th
{
border: 3px solid #fff;
}

#calendar-table td { width: 12%; padding: 3px;  height: 120px; background: #eee; font-size: 80%; line-height: 110%;}
#calendar-table td.empty { background: #fff; }

#calendar-table th { background: #C3D9FF; text-align: center;  font-size: 80%; padding: 7px 0 7px; color: #4c6693; font-weight: normal; }
#calendar-table td.day1, #calendar-table td.day2 { width: 20%; background-color: #ddd; }

#calendar-table td span.day-number { font-size: 10px; }
#calendar-table td a { /*font-variant:small-caps;*/ display: block; padding: 3px; background-color: #ccc; margin-top: 3px; color: #414244; }

div.calendar-prev { font-weight: bold; float: left; }
div.calendar-next { font-weight: bold; float: right; }
div.calendar-month-header { clear: both; padding: 10px 0 10px; }
h2.month-title { font-size: 260%; line-height: 110%; font-weight: 300; border-bottom: 1px solid #e3e3e3; padding-bottom: 15px; margin-bottom: 10px;  }

.tooltip-content-outer { display: none; }

#calendar-left h3 { font-weight: 300; border-bottom: 1px solid #e3e3e3; padding-bottom: 15px; margin-bottom: 15px; }

.event-category { font-size: 90%; }

.event-category span { display: block; width: 15px; height: 15px; float: left; margin-right: 5px; background-color: #ccc; margin-bottom: 5px; }


#event-category-club-management span { background-color: #9abff0; }
#event-category-general span { background-color: #ccc; }
#event-category-competition span { background-color: #f78947; }
#event-category-nippers span { background-color: #94e67d; }
#event-category-lifesaving span { background-color: #f8c424; }
#event-category-community-events span { background-color: #f4a6a6; }
#event-category-boardriding-events span { background-color: #8e7de6; }
#event-categoryclub-social-events span { background-color: #3ff9f2; }
#event-categoryclub-training span { background-color: #fb2828; }


/********************** events calendar *************************/


/*

#calendar-left { float: left; width: 17%; padding: 41px 0 0 0; }

#calendar-right { float: right; width: 80%; padding: 35px 0 0 0; }

.nippers #calendar-right { float: left; }

#calendar-left p.event-category { padding: 0px 0 10px 0; }


#calendar-right table { margin-bottom: 1.4em; width: 100%; }
#calendar-right th { font-weight: bold; background: #C3D9FF; }
#calendar-right th, #calendar-right td { padding: 4px 10px 4px 5px; }
#calendar-right tr.even td { background: #E5ECF9; }
#calendar-right tfoot { font-style: italic; }
#calendar-right caption { background: #eee; }

ul.pdcalendar { width: 100%; list-style: none; padding: 0px; margin: 0px 0 0 0px !important; clear: both; }
ul.pdcalendar li { width: 13%; float: left; height: 150px; background: #eee; margin: 2px; text-align: left; list-style-type: none; font-size: 80%; line-height: 110%; }
ul.pdcalendar li.day { background: #C3D9FF; height: 24px; text-align: center; padding-top: 7px; color: #4c6693; }

ul.pdcalendar li span.day-number { font-size: 10px; }

ul.pdcalendar li.empty { background: #fff; }

ul.pdcalendar li.day { display: block; }
ul.pdcalendar li.sunday, ul.pdcalendar li.saturday { background: #ddd; }


ul.pdcalendar li a { display: block; padding: 3px; background-color: #ccc; margin-top: 3px; color: #414244; }

ul.pdcalendar li a.category13 { background-color: #f78947; }
ul.pdcalendar li a.category12 { background-color: #9abff0; }
ul.pdcalendar li a.category11 { background-color: #94e67d; }
ul.pdcalendar li a.category10 { background-color: #ccc; }
ul.pdcalendar li a.category14 { background-color: #f4a6a6; }
ul.pdcalendar li a.category15 { background-color: #f3d843; }
ul.pdcalendar li a.category16 { background-color: #8e7de6; }
ul.pdcalendar li a.category17 { background-color: #7de6e2; }
ul.pdcalendar li a.category186 { background-color: #fa6363; }





h2.month-title { font-size: 260%; line-height: 110%; font-weight: 300; border-bottom: 1px solid #e3e3e3; padding-bottom: 15px; margin-bottom: 10px; width: 94%; }


#calendar-left h3 { font-weight: 300; border-bottom: 1px solid #e3e3e3; padding-bottom: 15px; margin-bottom: 15px; }

.event-category { font-size: 90%; }

.event-category span { display: block; width: 15px; height: 15px; float: left; margin-right: 5px; background-color: #ccc; margin-bottom: 5px; }


#event-category-club-management span { background-color: #9abff0; }
#event-category-general span { background-color: #ccc; }
#event-category-competition span { background-color: #f78947; }
#event-category-nippers span { background-color: #94e67d; }
#event-category-lifesaving span { background-color: #f4a6a6; }
#event-category-community-events span { background-color: #f3d843; }
#event-category-boardriding-events span { background-color: #8e7de6; }
#event-categoryclub-social-events span { background-color: #3ff9f2; }
#event-categoryclub-training span { background-color: #fa6363; }



body#calendar-day { background-color: #fff; padding: 10px; }
body#calendar-day div#events-list { padding: 6px 10px 6px 10px; }

body#calendar-day p { font-size: 85%; }

div.calendar-prev { font-weight: bold; float: left; }
div.calendar-next { font-weight: bold; float: right; }
div.calendar-month-header { clear: both; padding: 10px 0 10px; width: 94%; }

.tooltip-content-outer { display: none; }

*/

/********************** event detail *************************/

#event-left { width: 100%; padding: 30px 0 0 0; }


#event-left .content-area { clear: both; border-top: 1px solid #cfcfcf; padding-top: 15px; margin-top: 25px; }

#event-right { width: 20%; padding: 30px 0 0 0; }

h1#news-title { color: #143c6f; font-weight: 300; padding: 11px 0 19px 0; margin: 0 0 0 0; font-size: 240%; line-height: 100%; }

.event-date { float: none; font-weight: 300; font-size: 170%; line-height: 100%; }

.event-location { float: none; font-weight: 300; font-size: 140%; line-height: 100%; padding-top: 15px; }

#calendar-back-link { position: absolute; width: 100%; top: 0; left: 0; }

#calendar-back-link a { display: block; background-color: #0f305a; padding: 12px 44px 12px 15px; color: #fff; background: url("../images/icon-calendar-small.png") #0f305a no-repeat; background-position: right center; }

#calendar-back-link a:hover { background: url("../images/icon-calendar-small.png") #07254c no-repeat; background-position: right center; }

#calendar-back-link a i { font-size: 80%; }

.event-title {padding-top: 50px !important;}

/********************** news *************************/


.news-item { border-top: 1px solid #ddd; padding: 15px 0px 15px 0px; }
.news-item-list { padding: 30px 0px 0px 0px; }

.news-item h2 { padding: 0px 0px 10px 0; font-size: 170%; font-weight: 300; line-height: 100%; }

.news-item:first-child { border-top: 0px; }

.news-item-right { overflow: auto; clear: both; }

.news-item .news-date { background-color: #efefef; display: block; float: left; width: 105px; padding: 6px 12px; margin-right: 19px; font-size: 85%; text-transform: uppercase; margin-top: 2px; margin-bottom: 9px; text-align: left; }

.news-page-nav { border-top: 1px solid #ddd; padding: 20px 0px 15px; }




#news-date { font-weight: 300; font-size: 170%; line-height: 100%; }


#news-back-link { position: absolute; width: 100%; top: 0; left: 0; }



#news-back-link a { display: block; background-color: #0f305a; padding: 12px 44px 12px 15px; color: #fff; background: url("../images/icon-news-small.png") #0f305a no-repeat; background-position: right center; }

#news-back-link a:hover { background: url("../images/icon-news-small.png") #07254c no-repeat; background-position: right center; }

#news-back-link a i { font-size: 80%; }


/************************* nippers  *********************/

.nippers #header { background: none; height: 105px; }
.nippers #header-outer { z-index: 1000 !important; }

.nippers #header-outer .backstretch{ display: none; }


.nippers .heading-font { font-style: italic; font-family: 'Gochi Hand', segoe ui, tahoma, arial, helvetica, sans serif !important; /*font-weight: bold !important;*/ }

.nippers .home-list h2 a { font-size: 200%; padding: 16px 0 10px 12px; }

.nippers h1#site-logo { width: 200px; height: 56px; font-size: 15px; position: relative; text-indent: -9999px; }

.nippers #logo-outer { position: absolute; top: 35px; left: 15px; }

.nippers h1#site-logo span { background: url("../images/nippers-site-logo.png") no-repeat; background-size: 100%; }




/************************* sea lice  *********************/

.sealice #header { background: none; height: 105px; }
.sealice #header-outer { z-index: 1000 !important; }

.sealice #header-outer .backstretch{ display: block; }


.sealice .heading-font { font-style: normal; font-family: segoe ui, tahoma, arial, helvetica, sans serif !important; /*font-weight: bold !important;*/ }

.sealice .home-list h2 a { font-size: 200%; padding: 16px 0 10px 12px; }

.sealice h1#site-logo { width: 75px; height: 75px; font-size: 15px; position: relative; text-indent: -9999px; }

.sealice #logo-outer { position: absolute; top: 15px; left: 15px; }

.sealice h1#site-logo span { background: url("../images/sea-lice-logo.png") no-repeat; background-size: 100%; }


/************************* nippers nav *********************/



#nav-nippers-outer { background-color: #094fa3; height: 65px; }

#nav-ul-nippers li a { display: block; /*width: 7em;*/ color: #fff; padding: 24px 0px 6px 0px; text-decoration: none; text-align: center; font-size: 100%; }

#nav-ul-nippers li a.top { height: 35px; font-weight: bold; text-transform: uppercase; font-size: 95%; padding: 24px 12px 6px 12px; letter-spacing: -0.03em; }

#nav-ul-nippers li { float: left; /*width: 7em;*/ /*background-color: #333;*/ }

/*#nav-ul-nippers li.width1 a, #nav-ul-nippers li.width1 { width: 65px; }
#nav-ul-nippers li.width2 a, #nav-ul-nippers li.width2 { width: 79px; }
#nav-ul-nippers li.width3 a, #nav-ul-nippers li.width3 { width: 92px; }
#nav-ul-nippers li.width4 a, #nav-ul-nippers li.width4 { width: 95px; }
#nav-ul-nippers li.width5 a, #nav-ul-nippers li.width5 { width: 101px; }
#nav-ul-nippers li.width6 a, #nav-ul-nippers li.width6 { width: 125px; }
#nav-ul-nippers li.width8 a, #nav-ul-nippers li.width8 { width: 150px; }*/


#nav-ul-nippers li.facebook, #nav-ul-nippers li.facebook a { width: 45px; }
#nav-ul-nippers li.facebook a { padding-top: 22px; }

#nav-ul-nippers li.facebook:hover { background: none; }


#nav-ul-nippers li ul { position: absolute; left: -999em; height: auto; width: 540px; /*w\idth: 13.9em;*/ font-weight: normal; margin: 0; z-index: 1000; background-color: #0a58b5; padding: 22px; }

/*#nav-ul li.width4 ul {
  left: auto;
  right: 0px;
}*/

#nav-ul-nippers li ul li { width: 163px; border-top: 1px solid #074793; border-bottom: 0; background-color: #0a58b5; font-size: 90%; margin: 0px 8px 0px 8px; }


#nav-ul-nippers li ul li.bottom { /*padding-right: 1em;*/ border-bottom: 1px solid #074793; }

#nav-ul-nippers li ul li:hover { border-top: 1px solid #074793; border-bottom: 0; }

#nav-ul-nippers li ul li.bottom:hover { border-bottom: 1px solid #074793; }

#nav-ul-nippers li ul li.dropdown a { width: 145px !important; padding: 11px 9px 11px 9px; text-align: left; }



/*#nav-ul-nippers li a {
    width: 100% !important;
}*/

#nav-ul-nippers li.selected { background-color: #07448c; }

#nav-ul-nippers li:hover, #nav-ul li.sfhover { background-color: #0a58b5; }

#nav-ul-nippers li:hover ul, #nav-ul li.sfhover ul { left: auto; }


#nav-ul-nippers li.dropdown:hover { background-color: #0954af; }


/************************* main nav *********************/

/* #region */

#nav { font-size: 14px; z-index: 2; border-top: 1px solid #dedede; border-bottom: 1px solid #dedede; padding: 7px 0px 0px 0px; position: absolute; right: 15px; bottom: 26px; z-index: 1000; /*transform: scale(0.8, 0.8);*/ }

#nav, #nav-ul { margin: 0; list-style: none; }

#nav-ul { margin: 0px 0 0 0; }

#nav-ul li a { display: block; /*width: 7em;*/ color: #202f43; padding: 14px 0px 6px 0px; text-decoration: none; text-align: center; }

#nav-ul li a.top { height: 25px; font-weight: bold; text-transform: uppercase; font-size: 95%; padding: 14px 15px 6px 15px; letter-spacing: -0.03em; }

#nav-ul li { float: left; /*width: 7em;*/ border-bottom: 7px solid #fff; /*background-color: #333;*/ }

/*
#nav-ul li.width1 a, #nav-ul li.width1 { width: 61px; }
#nav-ul li.width2 a, #nav-ul li.width2 { width: 74px; }
#nav-ul li.width3 a, #nav-ul li.width3 { width: 86px; }
#nav-ul li.width4 a, #nav-ul li.width4 { width: 90px; }
#nav-ul li.width5 a, #nav-ul li.width5 { width: 95px; }
#nav-ul li.width8 a, #nav-ul li.width8 { width: 150px; }
*/



/*#nav-ul li a {
    width: 100% !important;
}*/

#nav-ul li.selected { background-color: #dddfe2; /*background: url("../layout-files/bg-nav-selected.jpg") -5px 0px no-repeat;*/ }

#nav-ul li li.selected { background-color: #222; /*background: url("../layout-files/bg-nav-selected1.jpg") #a60203 no-repeat;*/ }

#nav-ul li ul { position: absolute; left: -999em; height: auto; width: 540px; /*w\idth: 13.9em;*/ font-weight: normal; margin: 0; z-index: 1000; background-color: #fdbe1d; top: 59px; padding: 30px; }

/*#nav-ul li.width4 ul {
  left: auto;
  right: 0px;
}*/

#nav-ul li ul li { width: 163px; border-top: 1px solid #dea719; border-bottom: 0; background-color: #fdbe1d; font-size: 90%; margin: 0px 8px 0px 8px; }

#nav-ul li ul li.bottom { /*padding-right: 1em;*/ border-bottom: 1px solid #dea719; }

#nav-ul li ul li:hover { border-top: 1px solid #dea719; border-bottom: 0; }

#nav-ul li ul li.bottom:hover { border-bottom: 1px solid #dea719; }

#nav-ul li ul li.dropdown a { width: 145px !important; padding: 11px 9px 11px 9px; text-align: left; }



#nav-ul li ul li.clear, #nav-ul-nippers li ul li.clear { /*padding-right: 1em;*/ font-size: 1px; line-height: 1px; height: 0px; width: 100%; border: 0; padding: 0; margin: 0px 0 0 0; }


#nav-ul li:hover, #nav-ul li.sfhover { background-color: #f7de9f; border-bottom: 7px solid #fdbe1d; /*background: url("../layout-files/bg-nav-over.jpg") #444 0px 0px repeat-y;*/ }

/*#nav-ul li:hover ul {
  left: auto;
}*/

#nav-ul li:hover ul, #nav-ul li.sfhover ul { left: auto; right: 0px; }

#nav-ul li:hover ul.first, #nav-ul li.sfhover ul.first { left: 0px; /*right: 0px;*/ }



#nav-ul li.dropdown:hover { background-color: #f3b20c; /*background: url("../layout-files/bg-header1.gif") #b80000 0px 0px no-repeat;*/ }

/* #endregion */

/***************************** sub nav ***************************************/

/* #region */


.content-subnav-left { width: 100% !important; }

#content-subnav-right { float: none; width: 100%; padding: 40px 0 0 0; }

div#sub-nav ul { margin: 0; padding: 0 0 15px 0; list-style-type: none; width: 100%;  }

div#sub-nav ul li { margin: 0; padding: 0; float: left; width: 100%; margin-left: 0px; font-weight: 300; font-size: 120%; line-height: 110%; }

div#sub-nav ul li i { font-size: 80%; /*margin-right: 5px;*/ margin-left: 2px; }

/*div#sub-nav ul li a:hover i
{
    margin-left: 5px;
}*/

div#sub-nav ul li a { display: block; color: #0d1a20; color: #057EB9; /*background-color: #e9e7e7;*/ width: 100%; height: 100%; padding: 14px 0px 14px 0px; text-decoration: none; border-top: 1px solid #dbdbdb; font-size: 100%; }



div#sub-nav ul li.selected a { /*background-color: #d40202;*/ background-color: #d8d7d7; font-weight: bold; }

div#sub-nav ul li a:hover { /*background-color: #e3dfdf;*/ color: #24a4e1; }

div#sub-nav ul li.selected a:hover { /*background-color: #d40202;*/ /*color: #0d1a20;*/ /*color: #243d48;*/ color: #24a4e1; background-color: #d8d7d7; }



#sub-nav li.clear { /*padding-right: 1em;*/ font-size: 1px; line-height: 1px; height: 0px; width: 100%; border: 0; padding: 0; margin: 0px 0 0 0; }

/* #endregion */

/******************* content elements ********/

/* #region */

@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
    .content-area { -webkit-text-size-adjust: 100%; }
}


.content-area { font-size: 100%; color: #666f7c; }

strong { font-weight: bold; }

.content-area li { margin-bottom: 5px; line-height: 140%; }

.content-area img { /*margin-top: 5px;
  margin-bottom: 10px;*/ }

.content-area ul { list-style-image: none; list-style-position: outside; list-style-type: disc; margin-bottom: 11px; margin-left: 26px; margin-top: 11px; padding: 0 0 8px; }

.content-area h1 { padding: 11px 0 11px 0 !important; margin: 0 0 0 0; font-size: 290% !important; color: #1c5ea2; color: #193e63; color: #888 !important; font-family: 'Open Sans', Segoe UI, Tahoma, Verdana, Helvetica, Arial, sans-serif !important; font-weight: normal !important; /*color: #e85050;  */ }


.content-area h2 { padding: 19px 0 12px 0; border-bottom: 1px solid #e3e3e3; margin: 0 0 12px 0; font-size: 200%; line-height: 110%; font-weight: 400; /*background-color: #eee;*/ font-family: 'Open Sans', Segoe UI, Tahoma, Verdana, Helvetica, Arial, sans-serif; color: #2f6a88; }
.content-area h2:first-child { padding: 8px 0 8px 0; }

.content-area h3 { padding: 8px 0 5px 0; margin: 0 0 0 0; font-size: 140%; line-height: 120%; color: #4d4e4f; font-family: 'Open Sans', Segoe UI, Tahoma, Verdana, Helvetica, Arial, sans-serif; }

.content-area h4 { padding: 8px 0 9px 0; margin: 0 0 0 0; font-size: 110%; line-height: 120%; color: #4d4e4f; font-weight: bold; font-family: 'Open Sans', Segoe UI, Tahoma, Verdana, Helvetica, Arial, sans-serif; }

.content-area p { padding: 8px 0 14px 0; margin: 0 0 0 0; line-height: 140%; /*font-size: 90%;  */ }


.content-area p.large { padding: 6px 0 9px 0; margin: 0 0 0 0; font-size: 140%; line-height: 120%; color: #4d4e4f; }

/* #endregion */




/***************************** Tables ***********************/




.content-area table { max-width: 100% !important; }

Table TD { font-weight: normal; margin: 0px 0px 0px 0px; /*font-size: 85%;
  line-height: 120%;*/ vertical-align: top; font-size: 100%; }

.content-area Table TD p { margin: 0px 0px 0px 0px; padding: 0 0 0px 0; font-size: 100%; }

Table { border: 0; margin-top: 11px; margin-bottom: 20px; width: 100%; border-top: 1px solid #d5d5d5; }

Table TH, table thead td { padding: 10px 10px 10px 10px; background-color: #d4d4d7; text-align: left; font-weight: normal; color: #3f4040; border: 0; font-size: 100%; }

Table TD { padding: 10px 10px 10px 10px; background-color: #fff; vertical-align: top; border: 0; border-bottom: 1px solid #d5d5d5; font-size: 100%; color: #797a7a !important; }




Table.table-clear { border-top: 0; }

Table.table-clear TH { padding: 0px; }

Table.table-clear TD { padding: 0px; border-bottom: 0px; }


/* gallery */
.galleryListArea{}
.galleryListArea .newsItem { float: left; width: 50%; padding: 2% 0 1.5% 0; border-top: 1px solid #eee;}
.galleryListArea .first, .galleryListArea .second { border-top: 0; padding-top: 1%;}
.galleryListArea .newsItem figure {  width: 40%; margin-right: 0; float: left; padding-bottom: 1%; position: relative; }
.galleryListArea .newsItem figure img {  width: 100%; }
.galleryListArea .newsItem .right { overflow: auto; width: 54%; padding-right: 3%; }
.galleryListArea .newsItem h3 { font-size: 160%; padding-top: 0px; }
.galleryListArea .newsItem small { font-size: 100%; color: #888;  }
.galleryListArea .newsItem p { padding: 2% 0 0 0; }
.galleryListArea .clr { clear: both; }
.galleryListArea .newsItem h3 a { color: #333; letter-spacing: -0.03em; }
.galleryListArea .newsItem h3 a:hover { color: #555; }


.newsListArea .newsItem .right a.linkButton { font-size: 90%; margin-top: 7px; display: block; padding: 5px 9px; background-color: #eee; float: left; }



@media only screen and (min-width: 321px) {
    /* 480 =================================================== */



}



@media only screen and (min-width: 480px) {
    /* 480 =================================================== */
	
	
.nippers .home-list h2 a { font-size: 300%; padding: 31px 0 24px 23px; }
.sealice .home-list h2 a { font-size: 200%; /*padding: 16px 0 10px 12px;*/ }

#logo-outer { top: 30px; left: 30px; }


    #home-lower-right .home-feature-item { width: 48%; }

    .home-redev .home-feature-item { width: 32%; }

.home-redev .home-feature-item { float: left; margin-left: 2%; }
.home-redev .home-feature-item:first-child { margin-left: 0; }


    .home-list h2 a { font-size: 200%; padding: 35px 0 16px 23px; }


    .home-list h2 a img { bottom: 15px; right: 15px; width: 29px; }



    .home-list-item .news-date { width: 70px; padding: 6px 12px; }



    body { font-size: 12px; }

    .inner-container { max-width: 1080px; padding: 0 30px 0 30px; margin: 0 auto; }



    /*#bottom-inner {
        max-width: 1080px;
        height: 35px;
        padding: 0 60px 0 60px;
        margin: 0 auto;
    }*/




    .home-main { padding: 30px 30px 30px 30px !important; }






}


@media only screen and (min-width: 540px) {
#calendar-back-link { display: block; float: right; margin-top: 0px; position: relative; width: 250px;}
#news-back-link { display: block; float: right; margin-top: 0px;  position: relative; width: 250px;}
	
	.event-title {padding-top: 17px !important;}

.news-item-right { clear: none; }
	
}


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

    #footer #right { float: right; text-align: right; padding: 37px 0 35px 0; }
}

/**************************************************************/

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

	
	
#calendar-back-link { float: right; margin-top: 11px; }
#news-back-link { float: right; margin-top: 11px; }
	
.nippers #calendar-back-link { float: right; margin-top: 31px; }
.nippers #news-back-link { float: right; margin-top: 31px; }

	.event-date { float: left; font-weight: 300; font-size: 170%; line-height: 100%; }

.event-location { float: right; font-weight: 300; font-size: 140%; line-height: 100%; padding-top: 0px; }
	
	
.nippers #logo-outer { position: absolute; top: 75px; left: 15px; }
.sealice #logo-outer { position: absolute; top: 25px; left: 15px; }
	
	
	
div#sub-nav ul li {  margin-left: 20px; }
		
		
div#sub-nav ul { border-bottom: 0px; }

div#sub-nav ul li { width: 90%; }



.content-subnav-left { width: 65% !important; }
	
	
	
	div#sub-nav ul li.bottom a { border-bottom: 1px solid #dbdbdb; }
	
	#content-subnav-right { float: right; width: 30%; padding: 40px 0 0 0; }
	
	#home-events .home-list-item { padding: 9px 0 9px 0; }
.home-list-item .news-date { background-color: #efefef; display: block; float: left; width: 68px; padding: 4px 8px; margin-right: 14px; font-size: 82%; text-transform: uppercase; margin-top: 0px; }
.home-list-item .news-date { display: block; }
#home-news .home-list-item { padding: 12px 12px 12px 12px; }


#home-events .home-list-item h3 { font-size: 120%; line-height: 140%; }
#home-news .home-list-item h3 { font-size: 120%; line-height: 140%; }


.navDropdown { margin-top: 90px; margin-right: -9px; }
.navDropdown .navDropdownIn { top: 174px;  }
.nippers .navDropdown .navDropdownIn { top: 174px;  }

.navDropdown small { background: url(../images/dropArrow.png) 50% 17px no-repeat; font-size: 13px; color: #202f43; font-weight: bold; text-transform: uppercase; display: block; cursor: pointer; padding: 52px 23px 15px; background-size: 37px 30px; }
.navDropdown small.active { background: #f7b408 url(../images/dropArrow.png) 50% 17px no-repeat; background-size: 37px 30px; }
.navDropdown .navDropdownIn ul li { font-size: 14px; }
.navDropdown .navDropdownIn ul li a { padding: 12px 25px; }
.navDropdown .navDropdownIn ul li ul li a { font-size: 14px; padding: 12px 35px;}

.nippers .navDropdown small.active { background: #3f85d9 url(../images/dropArrow.png) 50% 17px no-repeat;  background-size: 37px 30px; }

    h1#site-logo { width: 240px; height: 103px; }
.nippers h1#site-logo { width: 320px; height: 89px;  }
.sealice h1#site-logo { width: 145px; height: 143px;  }


.nippers #header { background: none; height: 174px; }


    #logo-outer { position: absolute; top: 44px; left: 60px; }




    #header { height: 205px; }
    .nippers #header { height: 205px; }


    #home-news { width: 49%; float: right; margin-bottom: 0px; }

    #home-events { width: 48%; float: left; }




    #logo-outer { position: absolute; top: 69px; left: 30px; }


    #sub-title h1 { font-size: 340%; line-height: 140%; }

    .nippers #sub-title h1 { font-size: 440%; line-height: 140%; }



    .sponsor-side-column #content-right { /*width: 20% !important;*/ width: 164px; min-width: 164px; float: right; }

    .sponsor-side-column #content-left { width: 70% !important; }



    .overlay-outer { display: block; }


    div#sub-nav ul li { font-size: 140%; line-height: 120%; }

    div#sub-nav ul li a { padding: 18px 0px 18px 0px; }

    #content-left { width: 60%; }

    .content-subnav-left { width: 45% !important; }

    #content-subnav-right { width: 50%; }

    div#sub-nav ul li { width: 44%; margin-left: 20px; }



    .two-columns #content-right { width: 40% !important; float: right; }

    .two-columns #content-left { width: 55% !important; }





    #footer #contact-info { padding: 30px 40px 35px 0px; }
    #footer #middle { padding: 37px 0 35px 0; }
    #footer #right { float: right; text-align: right; padding: 37px 0 35px 0; }
    #footer #contact-info .left img { display: inline-block; }



#top-nav { display: block; position: absolute; top: 0px; right: 0px; padding: 5px 8px 5px 3px; background-color: #f3f3f3;  }

    #top-nav a { display: block; margin-left: 5px; float: left; color: #525a67; padding: 9px; }

    #top-nav a.img-rollover { display: block; margin-left: 5px; padding: 7px; }

    #top-nav a:hover { background-color: #e3e3e3 !important; }

    #top-nav a#icon-home { background: url("../images/icon-top-home.png") 9px 6px no-repeat; padding-left: 32px; }

    #top-nav a#icon-events { background: url("../images/icon-top-events.png") 9px 8px no-repeat; padding-left: 32px; }

    #top-nav a#icon-news { background: url("../images/icon-top-news.png") 9px 8px no-repeat; padding-left: 32px; }




    .nippers #top-nav  a{ width: 150px; height: 48px; }
    .nippers #top-nav a img{ width: 100%; height: 100%; }

    .nippers #top-nav { display: block; position: absolute; top: 0px; right: 30px; padding: 0; background: none; }

    .nippers #top-nav a { display: block; margin-left: 0; float: none; color: #525a67; padding: 0px; }

    .nippers #top-nav a.img-rollover { display: block; margin-left: 0; padding: 0px; }

    .nippers #top-nav a:hover { background: none !important; }
    
}


/****************************************************************************/
@media only screen and (min-width: 900px) {

/*

    #logo-outer { position: absolute; top: 24px; left: 60px; }


    #header { height: 245px; }

    #logo-outer { position: absolute; top: 24px; left: 60px; }*/
}

/****************************************************************************/
@media only screen and (min-width: 960px) {
	
    .nippers #top-nav a { width: 236px; height: 75px; }
	
	
.nippers #header-outer .backstretch{ display: block; }

.nippers h1#site-logo { width: 433px; height: 121px;  }
		
.sealice h1#site-logo { width: 145px; height: 143px; }
	
	
	.navDropdown { display: none; }

    #nav { display: block; right: 60px; }

    #nav-nippers-outer { display: block; }

    
    #header { height: 265px; }
	
	
	
.nippers #header { height: 174px; }
	
	
#top-nav { right: 60px; }
	
	


    .home-main { padding: 30px 60px 30px 60px !important; }
	
    .inner-container { max-width: 1080px; padding: 0 60px 0 60px; margin: 0 auto; }



    #home-news { width: 57%; float: right; margin-bottom: 0px; }

    #home-events { width: 40%; float: left; }

    #home-redev-left { width: 40%; float: left; }
    #home-redev-right { width: 57%; float: right; margin-bottom: 0px; }

    .sponsor-side-column #content-right { /*width: 20% !important;*/ width: 164px; min-width: 164px; float: right; }

    .sponsor-side-column #content-left { width: 75% !important; }



    #nipper-feature img { width: 100%; }


    #home-lower-left { float: left; width: 30%; }

    #home-lower-right { float: right; width: 66%; }



    body { font-size: 13px; }

    #bg { padding: 15px 15px 20px 15px; }

    #header { height: 225px; }




    .nippers #logo-outer { position: absolute; top: 35px; left: 60px; }
    .sealice #logo-outer { position: absolute; top: 18px; left: 60px; }

    #nav { right: 60px; }


    #top-nav { right: 60px; }


    .nippers #top-nav { right: 60px; }
    div#sub-nav ul li { font-size: 160%; line-height: 130%; }

    div#sub-nav ul li a { padding: 21px 0px 21px 0px; }
}
/*******************************************************************************/

@media only screen and (min-width: 1080px) {
	
	.nippers #news-back-link, .nippers #calendar-back-link { margin-top: 51px; }
	
	#nav-ul-nippers li a.top {  padding: 24px 15px 6px 12px; }

    #logo-outer { left: 60px; position: absolute; top: 64px; }

    h1#site-logo { width: 313px; height: 134px; font-size: 15px; position: relative; }

    #bg { padding: 32px 32px 40px 32px; }
}


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

    #footer #right { width: 360px; }

    #nav-nippers li a { font-size: 110%; }

    #nav-nippers li a.top { font-size: 110%; }

    /*#nav-ul-nippers li.width1 a, #nav-ul-nippers li.width1 { width: 86px; }
    #nav-ul-nippers li.width2 a, #nav-ul-nippers li.width2 { width: 97px; }
    #nav-ul-nippers li.width3 a, #nav-ul-nippers li.width3 { width: 106px; }
    #nav-ul-nippers li.width4 a, #nav-ul-nippers li.width4 { width: 110px; }
    #nav-ul-nippers li.width5 a, #nav-ul-nippers li.width5 { width: 115px; }
    #nav-ul-nippers li.width6 a, #nav-ul-nippers li.width6 { width: 145px; }
    #nav-ul-nippers li.width8 a, #nav-ul-nippers li.width8 { width: 190px; }*/
}


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

    #nav { font-size: 16px; }


    #nav-ul-nippers li ul { padding: 30px; }

    /*
    #nav-ul li.width1 a, #nav-ul li.width1 { width: 86px; }
    #nav-ul li.width2 a, #nav-ul li.width2 { width: 97px; }
    #nav-ul li.width3 a, #nav-ul li.width3 { width: 106px; }
    #nav-ul li.width4 a, #nav-ul li.width4 { width: 110px; }
    #nav-ul li.width5 a, #nav-ul li.width5 { width: 115px; }
    #nav-ul li.width8 a, #nav-ul li.width8 { width: 190px; }
*/
}



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

    #outer { width: 1406px; margin: 0 auto; }

    /*    #bg {
        padding: 28px 0 40px 0px;
    }*/


    #home-banner img { max-width: 1406px; }



    div.backstretch { display: block; }
}




@media only screen and (max-width: 1426px) {


    /*#bottom {
        background-color: #d4dde5;
    }*/

}




@media only screen and (max-width: 768px) {
    /*navDropdown*/
    /*.navDropdown{ display:block; float:right; margin-top:37px; margin-right: -9px;}
	.navDropdown small{background:url(../images/dropArrow.png) 50% 17px no-repeat; font-size:9px; color:#202f43; font-weight:bold; text-transform:uppercase; display:block; cursor:pointer; padding:42px 23px 15px; background-size:26px 21px}
	.navDropdown small.active{background:#f7b408 url(../images/dropArrow.png) 50% 17px no-repeat; background-size:26px 21px}
	
	.navDropdown .navDropdownIn{ background:#f7b408; position:absolute; left:0; top:111px; width:100%; display:none;  z-index:2000}
	.navDropdown .navDropdownIn ul{line-height:normal; list-style:none;}
	.navDropdown .navDropdownIn ul li{ font-size:12px; color:#606068; text-transform:uppercase; float:none; border-bottom:1px solid #f6d98e; font-weight:300; position:relative}
	.navDropdown .navDropdownIn ul li a{color:#202f43; padding:3% 15px; text-decoration:none; display:block}
	
	.navDropdown .navDropdownIn ul li span.arrow{background:url(../images/downArrow.png) 17px 15px no-repeat; background-size:10px 7px; position:absolute; top:0px; right:0; display:block; width:10px; height:7px; cursor:pointer; z-index:99; padding: 15px 17px 15px 17px;}
	.navDropdown .navDropdownIn ul li span.active{background:url(../images/upArrow.png) 17px 15px no-repeat; background-size:10px 7px;}
	
	.navDropdown .navDropdownIn ul li ul{background:#e09106;}
	.navDropdown .navDropdownIn ul li ul li a{ padding:3% 30px; font-size:12px;}*/
	#calendar-table td span.day-number { font-size: 8px; }
	#calendar-table { font-size: 100%; }
#calendar-table td { height: 80px;}


#calendar-left { float: none; width: 100%; padding: 15px 0 0 0; }
#calendar-right { float: none; width: 100%; padding: 30px 0 0 0; }

.nippers #calendar-right { float: none; }

.content-area table { width: 100% !important; }

.galleryListArea .newsItem { clear: both; width: 100%; padding: 4% 0 4% 0; border-top: 1px solid #eee;}
.galleryListArea .second { border-top: 1px solid #eee; padding-top: 4%;}
.galleryListArea .newsItem figure {  width: 40%; max-width: 200px; margin-right: 0; float: left; padding-bottom: 1%; position: relative; }
.galleryListArea .newsItem figure img {  width: 100%; }
.galleryListArea .newsItem .right { float: left; overflow: auto; width: 50%; padding-left: 4%; }

}


@media only screen and (max-width: 480px) {
#calendar-table { font-size: 60%; }
	#calendar-table td span.day-number { font-size: 6px; }



}





/******************************************************************
***********************************************************************
***************************************************************************/





/*-------------------------------------------------*/
/* The following code makes cosmetic changes to the
/* NAV bar and header
/*-------------------------------------------------*/

/*.replace {
  background: #efefef;
}*/

/*-------------------------------------------------*/
/* OUTER
/*-------------------------------------------------*/

.main-site #outer {
  position: relative;
}

.main-site #outer:after {
  content: "";
  position: absolute;
  top: calc(260px - 74px);
  left: 0;
  width: 100%;
  height: 74px;
  background: #143c6f;
}

/*-------------------------------------------------*/
/* HEADER
/*-------------------------------------------------*/

@media (min-width: 960px) {
    #header {
        height: 260px;
        background: none;
    }
}

/*-------------------------------------------------*/
/* LOGO
/*-------------------------------------------------*/

@media (min-width: 960px) {
    #logo-outer {
        top: 30px;
    }
}

/*-------------------------------------------------*/
/* TOP NAV
/*-------------------------------------------------*/

#top-nav {
    text-transform: uppercase;
    font-weight: bold;
}

/*-------------------------------------------------*/
/* NAV
/*-------------------------------------------------*/

#nav {
    left: 60px;
    bottom: 8px;
    width: calc(100% - 60px*2);
    padding: 0px 0 0 0;
    border: 0;
    color: white;
}

#nav > ul > li {
    border-color: #143c6f;
}

#nav > ul > li > a {
    color: white;
    font-weight: 100;
}

#nav > ul > li:hover > a {
    color: #143c6f;
}

/*-------------------------------------------------*/
/* NAV
/*-------------------------------------------------*/

#nav > ul > li {
    position: relative;
}

#nav > ul > li > ul {
    display: none;
    top: 52px;
    left: 0;
    right: auto;
}

#nav > ul > li:hover > ul {
    display: block;
    left: -35px;
    right: auto;
}

#nav > ul > li:hover > ul.last {
    left: auto;
    right: 0;
}


#nav-ul li.selected {
    background-color: #1f5190;
}

#nav-ul li:hover, #nav-ul li.sfhover {
    background-color: #f7de9f !important;
}





.sealice #sub-banner-outer { background-color: #0a4fa3; position: static; }






































/* EDITOR PROPERTIES - PLEASE DON'T DELETE THIS LINE TO AVOID DUPLICATE PROPERTIES */