/* CSS Document 
Theme Name: Cantell
Client: Cantell
Author: Geoff Boult
Company: Concept4
Type: Main Styles
*/

/******************************************************************
******************************************************************/

/*

01: Reset Styles
02: Typography
03: Footer
04: Mobile Menu
05: Map
06: Home Carousel
07: Quick Links
08: Navigation
09: Page
10: Section Navigation
11: News Section
12: Sidebar
13: Search Results
14: Responsive Handheld Devices to to mobile (L/Scape)
15: Responsive iPad Portrait
16: Responsive all screens 1023 and below
17: Responsive all screens 1024 and above

*/

/* - 01 (Reset Styles) -------------------------------------------*/
html, body, div,  applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
dl, dt, dd,
fieldset, form, label, legend {border:0; font-weight:normal; margin:0; outline:0; padding:0; vertical-align:baseline;}
:focus {outline:0;}
a img {border:0;}
a:hover {cursor:pointer;}
a {text-decoration:none;}
a:hover, a:active {outline:0;}
form {margin:0;}
.clearfix {clear:both;}
.clearleft {clear:left;}
.clearright {clear:right;}

.blockCol ul, .navigation ul{margin:0;padding:0}
.blockCol ul ul{margin-left:10px}
/*html5 resets*/
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section, address {display:block;}
audio, canvas, video {display:inline-block; *display:inline; *zoom:1;}
audio:not ([controls]) {display:none;}
[hidden] {display:none;}
/********************************************************************/

/* - 02 (Typography) -----------------------------------------------*/
p {margin-bottom:0.9em;}
a {color:#2476af;}
a:hover {text-decoration:underline;}
footer p {margin-bottom:0.3em;}
p.add {font-size:24px; position:absolute; color:white; z-index:100;}
h1 {width:990px; display:block; margin:0 auto; font-size:36px; font-weight:600; color:#072460;}
   h2 {display:block; font-size:24px; margin-bottom:7px;}
h3 {width:100%; text-align:center; font-size:32px; margin-bottom:15px;color:#072460;}
/********************************************************************/

/* - 03 (Footer) ---------------------------------------------------*/
.footerLeft, .footerRight, .footerLeft a, .footerRight a {color:white}
footer span.divide, p.tel {color:#2476af;}
/********************************************************************/

/* - 04 (Mobile Menu) ----------------------------------------------*/
.menuHandleCn {float:right; width:auto; height:38px; line-height:38px; background:url(../Images/mobile-menu-handle.png) right center no-repeat; display:none; margin-right:200px;}
.menuHandleCn a {padding:0 40px 0 30px; display:block; color:white; font-size:18px;}.menuHandleCn a:hover {text-decoration:none;}
nav[role="mainMenu"] ul li a.level2more {display:none;}
/********************************************************************/

/* - 05 (Map) ------------------------------------------------------*/
a.mapBTN {background-color:#2476af; text-align:center; color:white; font-size:14px; line-height:35px;}
a.mapBTN:hover {text-decoration:none;}
/********************************************************************/

/* - 06 (Home Carousel) --------------------------------------------*/
.carouselTitle {font-size:18px; display:block; text-align:left; padding:15px 0; line-height:22px;}
.carouselExcerpt, a.carouselMore {font-size:14px;}
a.carouselMore {color:#464d57; line-height:45px;}
a.carouselMore:hover {color:#2476af;}
/********************************************************************/

/* - 07 (Quick Links) ----------------------------------------------*/
.qlTitle {width:100%; text-align:center; color:#072460; font-size:18px; display:block; padding:10px 0 0 0;}
ul.ql li a:hover {text-decoration:none;}
/********************************************************************/

/* - 08 (Navigation) -----------------------------------------------*/
nav[role="mainMenu"] li {list-style-type:none; float:left;}
nav[role="mainMenu"] li a {display:block; color:white;}
nav[role="mainMenu"] li a:hover {text-decoration:none;}
/********************************************************************/

/* - 09 (Page) -----------------------------------------------------*/
.secHead {font-size:18px; color:white; padding:0 0 15px 0; border-bottom:1px solid #2476af; width:90%; margin-left:5%;}
.secHead.news {border-top:1px solid #2476af; padding-top:15px; clear:left;}

/*Sidebar*/
ul.sidebarNews { border-bottom: 1px solid #2476AF;
    float: left;
    margin: 0 0 0 5%;
    padding: 0 0 5%;
    width: 90%;}
.sidebarNews li {list-style-type:none; float:left; width:100%; padding:8px 0;}
.sidebarNewsDate {font-size:11px; color:#2476af;}
a.sidebarNewsTitle {color:white; font-size:16px;}
.sidebarNewsExcerpt {font-size:12px; color:white;}

.pagination{text-align:center;}
.pagination .previous {
    float: left;
}
.pagination .next {
    float: right;
}
.pagination a, .pagination span {
    display: inline-block;
	font-size:12px;
    transition: color 0.3s ease 0s;
}
.pagination .current{color:#072460;text-decoration:underline;font-size:12px;} 
.pagination a:hover{color:#072460;} 


.columnLeft img.left {float:left; margin:0 25px 25px 0;}
.columnLeft img.right {float:right; margin:0 0 25px 25px;}
.columnLeft img.center {margin:0 auto; margin-bottom:25px; margin-top:25px;}
/********************************************************************/

/* - 10 (Section Navigation) ---------------------------------------*/
nav[role="section"] {margin:10px 0; float:left; width:90%; padding:0 5%;}
nav[role="section"] li {list-style-type:none; float:left; width:100%; line-height:24px;}
nav[role="section"] li a {display:block; color:white; padding:0;}
nav[role="section"] li a:hover {text-decoration:underline;}
nav[role="section"] ul.newsTemplate li {border-bottom:1px solid #2476af;}
/********************************************************************/

/* - 11 (News Section) ---------------------------------------------*/
ul.news {border-top:1px solid #dedbd9;    margin: 0;
    padding: 0;}
ul.news li {list-style-type:none; height:auto; width:100%; border-bottom:1px solid #dedbd9; padding:15px 0; float:left;}
.newsTitle a {color:#072460; font-size:24px; margin-bottom:0.5em; float:left;}
.newsExcerpt {float:left; width:100%; margin-bottom:0.8em;}
a.newsMore {float:left; color:#072460; font-size:14px;}
a.newsMore:hover {text-decoration:underline;}

.newsList .newsPagination a:hover, article .newsPagination a:hover {text-decoration:none;}

.newsPagination a, .resultPagination a {color:#7b6d65; font-size:12px;}
.newsPagination a:hover, .newsPagination a.active, .resultPagination a:hover, .resultPagination a.active {color:#072460;}

a.btnews {color:#7b6e66; margin-top:15px; float:left;}
/********************************************************************/

/* - 12 (Sidebar) --------------------------------------------------*/
blockquote {text-align:center; font-size:18px; font-style:italic; float:left; margin-top:10px; color:#808080;width:100%;}
blockquote span {font-size:14px; color:#808080; display:block; margin-top:15px;}
a.archive {width:90%; display:block; line-height:35px; margin-left:5%; border-top:1px solid #2476af; border-bottom:1px solid #2476af; clear:left; color:white;}
/********************************************************************/

/* - 13 (Search Results) -------------------------------------------*/
.resultInfo, .results li {color:#002856;}
.resultTitle a {color:#002856;}
a.resultMore {color:#7b6e66;}
/********************************************************************/


/******************************************************************************************************

                                        RESPONSIVE ELEMENTS

******************************************************************************************************/



/* - 14 (Responsive Handheld Devices to to mobile (L/Scape)) -------*/
@media all and (max-width:767px){
	.menuHandleCn {margin:0 auto; float:none; width:90px; margin-top:45px;}
	.menuHandleCn a {padding:0 40px 0 0;}
	.carouselTitle {font-size:15px; line-height:18px;}
	a.mapBTN {background-color:#2476af; text-align:center; color:white; font-size:12px; line-height:30px;}
	nav[role="mainMenu"] {top:86px;}
	h1 {font-size:24px;}
	h2 {display:block; font-size:18px;}
	h3 {margin-top:10px; font-size:24px;}
	
      
}
/********************************************************************/

/* - 13 (Responsive all screens 1023 and below) --------------------*/
@media all and (max-width:768px) {
#col1{width:100% !important;}
#col2{width:100% !important;}

}
/********************************************************************/

/* - 13 (Responsive all screens 1023 and below) --------------------*/
@media all and (max-width:1023px) {
	.menuHandleCn {display:block;}
	
	nav[role="mainMenu"] {position:absolute; left:0; width:100%; text-align:left;}	
    nav[role="mainMenu"] {display:none;}
	/*Level 1*/
	nav[role="mainMenu"] .menu {width:100%; border-top:1px solid #405e80;}
	nav[role="mainMenu"] .menu li {width:100%; border-bottom:1px solid #405e80; position:relative; list-style-type:none; padding-left:0; background:none; background-color:#072460; z-index:99999;}
	nav[role="mainMenu"] .menu li a {line-height:39px; color:white; padding:0 5%; display:block; width:50%;}
	nav[role="mainMenu"] .menu li a:hover {text-decoration:none;}
	h1 {width:92%; padding:0 4%;}
	blockquote {text-align:left;}


}
/********************************************************************/
/* - 15 (Responsive iPad Portrait) ---------------------------------*/
@media all and (max-width:1023px) and (min-width:768px){
	nav[role="mainMenu"] {top:51px;}
	#col2{margin-left:20px;}
}
/********************************************************************/

/* - 14 (Responsive all screens 1024 and above) --------------------*/
@media all and (min-width:1024px) {
	nav[role="mainMenu"] li {height:52px; line-height:40px; padding:0 10px;position:relative;}
	nav[role="mainMenu"] li a {padding:0; height:52px;}
   	nav[role="mainMenu"] li:hover a, nav[role="mainMenu"] li a.active {background:url(../Images/nav_hover_BG.jpg) left bottom repeat-x;}
	nav[role="mainMenu"] li ul{position:absolute;top:50px;left:10px;width:200px;display:none;height:auto;background-color:#2476AE;z-index:999;}
	nav[role="mainMenu"] li:hover ul{display:block;}	
	nav[role="mainMenu"] li ul li{width:92%;padding-left:4%;padding-right:4%;border-top:1px solid #659fc6;height:auto;line-height:30px;font-size:12px;}
	nav[role="mainMenu"] li ul li:hover, nav[role="mainMenu"] li ul li.active{background-color:#072460;}
nav[role="mainMenu"] li li a:hover, nav[role="mainMenu"] li li a.active {
    background:none;
}
#col2{margin-left:2%}
	nav[role="mainMenu"] li ul li a{font-size:12px;}
	nav[role="mainMenu"] li ul li a{height:auto}
nav[role="mainMenu"] li ul li:first-child{border-top:none}
}
/********************************************************************/
