/********************************************
			QUIK PICK EXPRESS
	Responsive Layout - Mobile First
*********************************************/

/***** IMPORT OPEN SANS *****/
@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,400i,700|PT+Serif+Caption');

/******** BROWSER CSS RESET *************************/
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;
	/*** Include Padding/Borders in width for all elements ***/
	box-sizing: border-box;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section { display: block; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after,
q:before, q:after { content: none; }
table { border-collapse: collapse; border-spacing: 0; }
/* Responsive images & embedded objects (remove for image cropping) */
img, object, embed { max-width: 100%; }

/****** GLOBAL ELEMENT CSS ******/
html * { max-height: 999999px; } /* Android mobile font sizing fix */

body { 
	line-height: normal;
	font-size: 18px;
	font-family:'Open Sans', sans-serif; font-weight:400;
	background:#fff;
	-webkit-text-size-adjust: none;
}

body, select, input, textarea { color: #000; }

h1 { margin:0 0 20px 0; font-family:'PT Serif Caption', serif; font-weight:normal; color:#fff; text-shadow:2px 2px 5px #333; font-size:28px; }
h2, h3, h4, h5, h6 { margin: 0px 0px 20px; color:#000; font-family: 'Open Sans', sans-serif; font-weight:300; }

h2 { font-size:22px; }
h3, h4, h5, h6 { font-size: 20px; }

h3.ftr-h3 { font-size:16px; text-transform:uppercase; color:#fff; width:100%; padding-bottom:5px; border-bottom:8px #999999 solid; font-weight:700; }

a, a:visited { color:#272c68; text-decoration:underline; }
a:hover, a:active { color:#272c68; text-decoration: underline; }
a:link { -webkit-tap-highlight-color: initial; } 

a.button { display:inline-block; color:#fff; background:#272c68; text-decoration:none; text-transform:uppercase; padding:8px 20px; font-size:16px; }
a.button-red { display:inline-block; color:#fff; background:#d5121a; text-decoration:none; text-transform:uppercase; padding:8px 20px; font-size:16px; }
a.hdr-request { margin:15px 13px 0 0; float:right; }
a.hdr-request span { display:none; }

p { margin: 0px 0px 20px; }
img { border: none; }

b, strong { font-weight: bold; }
i, em { font-style: italic; }

.nosho { display: none; }
.clear { clear: both; }
.fl { float: left; }
.fr { float: right }




/*** Basic List Styling ***/
ul { 
	margin: 0px 0px 20px; 
	padding: 0; 
	list-style-type: disc; 
	list-style-position: inside;
}
ul li { margin-bottom: 5px; } 
ul li ul li { margin-top: 5px; }
ul li ol li { margin-top: 5px; } 

ol { 
	margin: 0px 0px 20px; 
	padding: 0px 0px 0px 20px; 
	list-style-type: decimal;
	list-style-position: inside;
}
ol li { margin-bottom: 5px; } 
ol li ol li { margin-top: 5px; }
ol li ul li { margin-top: 5px; }


/*** CKEditor Image Alignment Classes ***/
.align-left, .align-right, .align-center { margin:0 0 15px 0; float:none; text-align:center; }
.align-center > figure { display: inline-block; }


/****** FRONTEND LAYOUT ******/
#page {
	margin: 0px auto;
	width: 100%; min-width:400px; /*max-width:1400px;*/
	position: relative;
	background: #fff;
}

/*** Header ***/
#header {
	margin: 0px auto; width:100%; height:115px;
	position: relative;	
	border-bottom:10px #272c68 solid;
	max-height:145px; overflow:hidden;
}

#logo { display:block; float: left; /*margin:9px 0 0 11px;*/ width:60%; max-width:300px; height:122px; background:url('../images/quik-pick-express-logo-2025.png') 0 50% no-repeat; background-size:100% auto; margin:0 0 0 11px; }
#logo img { width:100%; display:none; }

/* Menu with Icon */
#menuBtn { 
	display: block; width:32px; height:32px;
	float: right;
	margin:10px 15px 0 0;
	background:url('../images/menu-btn.png') no-repeat center center;
	text-indent: -9999px;
	clear:right;
}
#menuBtn.open { background:url("../images/menu-btn-open.png") no-repeat center center; }


/*** Main Menu ***/
#mainmenu { 
	display: none;
	position:relative; top:0px; left:0;
	z-index: 9999;
	width: 100%;
	text-align: center;
	margin: 0 auto;
	background:#fff; border-bottom:1px #ccc solid;
}
#mainmenu ul {
	margin:17px auto;
	padding: 0px;
	list-style-type: none;
}
#mainmenu ul li {
	margin: 0px; 
	float: none; 
	border-left: none;
	border-bottom:1px #ccc solid;
}
#mainmenu ul li:last-child { border-bottom: none; }
#mainmenu ul li a {
	display: block;
	padding: 15px 20px;
	color: #000;
	font-size: 22px;
	text-decoration: none;
	text-transform:uppercase;
}
#mainmenu ul li > ul { display: none; }
#mainmenu ul li:hover > ul { display: none; }


.container-h1 { position:absolute; width:100%; height:auto; left:0; bottom:20px; z-index:999; }
.container-h1 h1 { width:100%; max-width:1076px; text-align:left; margin:0 auto; font-size:28px; padding-left:15px; }

	
/*** Content Area ***/
#content {
	clear: both;
	margin: 0px;
    padding:0 15px;
	min-height: 520px;
}
#content .featuredImg {
	display: block;
	margin:0 -15px 30px -15px; position:relative;
	overflow: hidden;
	border-bottom:10px #272c68 solid;
}
#content .featuredImg img { 
	display: block;
	width: 100%; 
}

.container { width:100%; max-width:1076px; margin:0 auto; }

#content #sidebar {
	float: none; 
	width: 100%; 
	border:1px #ccc solid;
	padding:20px;
}

#content #main {
	float: none; 
	width: 100%;
}


/*** Footer ***/
#footer {
	color: #fff;
	font-size: 16px;
	background:url('../images/footer-bg.jpg') no-repeat 100% 100% /cover;
	position:relative;
	border-bottom:10px #272c68 solid; box-sizing:unset;
	padding:45px 0 20px 0;
	margin-top:50px;
}

#footer-news { display:none; }
#footer-contact { width:100%; float:none; padding:0 20px; }
#footer-contact span, .dsk { display:none; }
#footer-contact p.loc { font-size:18px; margin-bottom:7px !important; }

ul.ftr-ul { list-style-type:none; margin:0; padding:0; }
ul.ftr-ul li { display:block; float:none; }


#footer a { color:#fff; text-decoration:none; }
#footer a:hover, #footer a:active { color:#fff; text-decoration:underline; }

#social { text-align:center; width:100%; }
#social a { display:inline-block; margin-right:5px; }

a.wsd { display:none; }



/****** HOMEPAGE ******/
.homepage { }

.homepage #content {
	padding: 0;
}

.homeWrap { margin:20px 0; padding-left:15px; padding-right:15px; width:100%; max-width:1076px; text-align:center; }

.hp-tile { width:100%; max-width:480px; margin:0 auto 20px auto; display:inline-block; vertical-align:top; }
.hp-tile h2 { text-align:center; font-size:24px; color:#fff; background:#000; margin:0; padding:15px 0; display:block; text-transform:uppercase; }
.hp-tile-blurb { border:1px #ccc solid; width:100%; padding:20px; text-align:left; }


/* Homepage Content */
.homeContent {
	width:100%; max-width:1076px; margin:30px auto 60px auto;
	padding:0 15px; text-align:center;
}

/**** Slick Slideshow Overrides ***/
.slideshow .slick-prev,
.slideshow .slick-next { 
	position: absolute;
	top: 50%;
	z-index: 9999;
	width: 60px;
	height: 100%;
	text-indent: -9999px;
}


.slick-next {
    right: 25px !important;
}

.slick-prev {
    left: 25px !important;
    z-index: 999;
}

.slideshow .slick-prev { left: 0px; background: url('../images/slideArrows.png') no-repeat 0px center; }
.slideshow .slick-prev:hover, 
.slideshow .slick-prev:active { background: url('../images/slideArrows.png') no-repeat -120px center; }
.slideshow .slick-next { right: 0px; background: url('../images/slideArrows.png') no-repeat -60px center; }
.slideshow .slick-next:hover, 
.slideshow .slick-next:active { background: url('../images/slideArrows.png') no-repeat -180px center; }

#photos-for .slick-slide img {
    margin: 0 auto;
    max-height: 400px;
}

#thumbs-nav .slick-prev:before, #thumbs-nav .slick-next:before { 
	color: #000;
}

#thumbs-nav .slick-prev::before{
	content: "\2190";
}

#thumbs-nav .slick-next::before {
	content: "\2192";
}

#thumbs-nav.slick-slider {
    max-height: 150px;
    overflow: hidden;
}

#thumbs-nav .slick-list {
    margin: 0 30px;
}

#thumbs-nav .slick-next {
    right: 5px !important;
}

#thumbs-nav .slick-prev {
    left: 5px !important;
}

#thumbs-nav img {
    height: 150px;
    padding: 15px 5px;
    min-width: initial !important;
    max-width: initial!important;
}
.slick-dots {
    bottom: 25px !important;
   
}
.slick-dots li.slick-active button::before {
	color: #dcdcdc;
	opacity: 1;
}

.slick-dots li button::before {
    -moz-osx-font-smoothing: grayscale;
    color: #fff;
    content: "•";
    font-family: "slick";
    font-size: 12px;
    height: 20px;
    left: 0;
    line-height: 20px;
    opacity: 1;
    position: absolute;
    text-align: center;
    top: 0;
    width: 20px;
}


/* Homepage Banner / Slideshow */
.slideshow { 
	margin:0;
	width: auto;
	position: relative; 
	min-height: 100px;
}

.slideshow .slide { /*display: none;*/ }
.slideshow .slide img { 
	display: block;
	width: 100%; 
}
/* Remove if no slideshow pager */
.slideshow .slidePager {
	margin: 0px;
	width: 100%;
	position: absolute;
	bottom: 5px;
	left: 0px;
	z-index: 499;
	text-align: center
}
.slideshow .slidePager span {
	margin: 0px 1px;
	font-size: 36px;
	color: #fff;
	cursor: pointer;
}
.slideshow .slidePager span.cycle-pager-active { color: #ccc; }
/* Remove if no slideshow arrows */
.slideshow .slidePrev,
.slideshow .slideNext { 
	position: absolute;
	top: 0px;
	z-index: 498;
	width: 60px;
	height: 100%;
	text-indent: -9999px;
}
.slideshow .slidePrev { left: 0px; background: url('../images/slideArrows.png') no-repeat 0px center; }
.slideshow .slidePrev:hover, 
.slideshow .slidePrev:active { background: url('../images/slideArrows.png') no-repeat -120px center; }
.slideshow .slideNext { right: 0px; background: url('../images/slideArrows.png') no-repeat -60px center; }
.slideshow .slideNext:hover, 
.slideshow .slideNext:active { background: url('../images/slideArrows.png') no-repeat -180px center; }

/*** Banner Overlay ***/
.homepage #overlay {
	width: 100%;
	background:#272c68;
	padding:20px 0 1px 0;
	position: relative;
	right: 0;
	top: 0;
	display: block;
	text-align:center;
}

.homepage #overlay h1 { font-size:32px; }
.homepage #overlay a { color: #fff; text-decoration:none; }


div.gray { background:#e5e5e5; padding:20px 0; margin:0 -20px 0 -20px; }
ul.four { list-style-type:disc; margin-left:20px; }
ul.four li { margin-bottom:4px; float:left; width:50%; font-size:16px; }


/****** FORMS STYLING ******/
div.form {
	margin: 0px auto;
	max-width: 635px;
}
div.form label { 
	display: block; 
	font-weight: normal;
}
div.form input,
div.form textarea,
div.form select { 
	margin:0; font-family:'Open Sans', sans-serif; font-size:18px;
	padding: 4px; 
	width: 100%; max-width: 488px;
	border: 1px solid #ccc;
}

p.services { margin:0 0 10px 0; }
div.ckbx { text-align:left; }
div.ckbx label { padding-top:0 !important; display:inline-block; width:135px; text-align:left; margin-left:0px; }
div.form input[type=checkbox] { width:auto !important; margin-top:8px; display:inline; }

div.form textarea { height: 120px; }

div.form span.required { color:#ed1c24; }
div.form .row { margin: 0px 0px 10px; }

div.form .row.buttons { text-align:center; }
div.form input[type=submit] {
	padding: 8px 20px;
	color: #fff; text-transform:uppercase; font-size:16px;
	width:auto !important;
	border: none; cursor:pointer;
	background: #d5121a;
}


/*** Form Errors ***/
div.form div.error label,
div.form label.error,
div.form span.error {
	color:#d5121a; 
}
div.form div.error input,
div.form div.error textarea,
div.form div.error select,
div.form input.error,
div.form textarea.error,
div.form select.error {
	background: #fff;
	border-color: #d5121a;
}

div.form .errorMessage { color:#666; font-style:italic; margin:5px 5px 5px 0; }


/********************** MODULE-SPECIFIC STYLES ***********************/

/***** DOCUMENTS MANAGER ******/

ul.doc-list { margin:50px auto 0 auto; width:100%; max-width:1004px; list-style-type:none; padding:0; }
ul.doc-list li { margin:-bottom:12px; width:100%; display:block; min-height:87px; background:url('../images/doc-list-bg.png') repeat-y; vertical-align:middle; }
ul.doc-list li a { color:#fff; text-decoration:none; min-height:87px; padding:10px 0 10px 100px; display:block; background:url('../images/adobe.png') no-repeat 17px 50%; }
ul.doc-list li a:hover, ul.doc-list li a:active { text-decoration:underline; }


/****** NEWS MODULE ******/
/*** News Listing Pages ***/
.newsListings {  
	margin: 0px;
	padding: 0px;
	list-style-type: none;
}
.newsListings li { margin: 0px 0px 40px; }

.newsListings li h2 { margin-bottom:10px; }
.newsListings li h2 a { text-decoration:none; color:#000; }
.newsListings li h2 a:hover, .newsListings li h2 a:active { text-decoration:underline; color:#272c68; }

span.date { color:#999999; }

.postNav { border-top:1px #ccc solid; padding-top:20px; padding-bottom:20px; }




/****** CMS MODULE (IMAGE GALLERIES/VIDEOS/SUBPAGES/FAQ) ******/
/*** Image Gallery Listing ***/
.gallery { 
	display:inline-block; vertical-align:top;
	width:33%; max-width:340px; margin:0 25px 12px 0;
	height: auto;
	text-align: center;
	overflow: hidden;
}

.gallery h2 { text-align:center; font-size:24px; color:#fff; background:#000; margin:0; padding:15px 0; display:block; text-transform:uppercase; }
.gallery h2:active, .gallery h2:hover { background:#121e39; }
.gallery h2 a { color:#fff; text-decoration:none; }
.gallery-blurb { border:1px #ccc solid; width:100%; overflow:hidden; }
.gallery-blurb img { display:block; width:100%; }


/*** Image Gallery Page ***/
.photos { margin:40px auto 0 auto; }
.thumb { 
	margin:0 2px 20px 2px;
	padding: 0px;
	/*float: left;*/
	display:inline-block;
	width:40%; max-width: 200px;
	/*height: auto; max-height:150px;*/
	height:150px;
	overflow: hidden;
}
.thumb img { 
	display: block;
	max-width:100%;
	margin:0; 
	border:1px #ccc solid;
}


/****** CONTACT ******/

.contact-tile { width:100%; max-width:340px; margin:0 10px 20px 10px; display:inline-block; vertical-align:top; }
.contact-tile h2 { text-align:center; font-size:24px; color:#fff; background:#000; margin:0; padding:15px 0; display:block; text-transform:uppercase; }
.contact-tile-blurb { border:1px #ccc solid; width:100%; text-align:left; }
.contact-tile-blurb img { width:100%; display:block; margin-bottom:15px; }
.contact-tile-blurb p { padding-left:20px; padding-right:20px; text-align:center; }




/***************************************************
	DESKTOP LAYOUT BREAKPOINTS
****************************************************/
@media(min-width: 880px) {

	/****** GLOBAL ELEMENT CSS ******/
	body { font-size:17px; }
	
	h2 { font-size:26px; }
	
	/*** CKEditor Image Alignment Classes ***/
	.align-left {
		margin: 0px 15px 15px 0px;
		float: left;
	}
	.align-right {
		margin: 0px 0px 15px 15px;
		float: right;
	}
	.align-center { text-align: center; }
	.align-center > figure { display: inline-block; }
	
	a.button { font-size:15px; }
	a.hdr-request { margin:20px 15px 0 0; float:right; }
	a.hdr-request span { display:inline; }

	h3.ftr-h3 { font-size:15px; max-width:435px; }
	

	/****** FRONTEND LAYOUT ******/
    #header { height:125px; }
    
    #logo { max-width:500px; height:125px; background:url('../images/quik-pick-express-logo-2025.png') 0 50%; background-size:100% auto; background-repeat:no-repeat; }
    #logo img { display:none; width:500px; height:auto; margin:5px 10px 10px 0; }
	
	#content { padding:0; margin:0 auto; }
	#content .featuredImg { margin:0 0 30px 0; position:relative; }
	
	.container-h1 { position:absolute; width:100%; height:auto; left:0; bottom:20px; z-index:999; }
	.container-h1 h1 { width:100%; max-width:1076px; text-align:left; margin:0 auto; font-size:50px; }
	
	#content #sidebar {
		float: right;
		width: 25%; 
	}
	
	ul.categories-list { list-style-type:disc; }
	
	#content #main {
		float: left; 
		width: 70%;
		margin: 0px;
	}
	
	#footer { font-size:15px; color:#fff; }
	
	#footer-news { display:block; width:45%; max-width:480px; float:left; text-align:left; }
	#footer-news p.headline { font-size:18px; }
	#footer-news a { text-decoration:underline; }
	#footer-news span.date { font-size:15px; }
	#footer-news p { margin-bottom:10px; }
	
	#footer-contact { width:45%; max-width:435px; float:right; text-align:left; }
	#footer-contact span { display:inline; }
	.dsk { display:block; }
	
	ul.ftr-ul li { display:block; float:left; width:50%; }
	
	a.wsd { display:block; position:absolute; bottom:15px; left:15px; z-index:999; width:auto; color:#ccc !important; font-size:12px; }
	

	/****** HOMEPAGE ******/
	
	.homeWrap { margin:-64px auto 0 auto; padding:0; z-index:9999; max-width:1100px; position:relative; }

	.hp-tile { max-width:340px; margin:0 10px 20px 10px; }
	.hp-tile h2 { background:url('../images/black50.png'); }
	.hp-tile-blurb { min-height:275px; }


	.homepage #content { 
		max-width: 100%; 
		padding: 0;
	}
	
	/* Homepage Content */
	.homeContent { padding:0; }
	
	.homepage #overlay { width:100%; position:absolute; left:0; bottom:160px; top:auto; z-index:100; text-align:center; background:none; }
	.homepage #overlay h1 { font-size:50px; }
	.homepage #overlay a { color: #fff; text-decoration:none; }
	
	/* Banner / Slideshow */
	.slideshow { 
		margin:0 !important; 
		
	}
	
	.homepage .slideshow { 
		max-height:620px;
	}
	
	.homepage .slideshow-sidebar {
		max-height: 715px;
		overflow: hidden;
		position: relative; 
	}
	
	.slick-dotted.slick-slider {
	    margin-bottom: 0px !important;
	}

	
	/* Banner / Slideshow */
	.slideshow { margin: -20px -20px 20px; }
	
	
	div.gray { background:#e5e5e5; padding:20px 0; margin:0; }
	ul.four { list-style-type:disc; margin-left:0; }
	ul.four li { margin-bottom:4px; float:left; width:25%; font-size:16px; }
	
	
	/****** FORMS ******/
	div.form label { 
		float: left;
		padding: 5px 0 0 0;
		width: 120px;
		margin-right:15px; 
	}
	div.form input[type=text], 
	div.form input[type=number], 
	div.form input[type=password] { max-width:488px; }
	div.form textarea { 
		max-width: 488px;
	}
	div.form .row.recaptcha { margin-left:135px; }
	div.form .errorMessage { margin:5px 5px 5px 135px; }
	
	p.services { margin:0 0 10px 135px; }
	div.ckbx { text-align:left; }
	div.ckbx label { padding-top:0 !important; display:inline-block; width:135px; text-align:left; margin-left:135px; }
	div.form input[type=checkbox] { width:auto !important; margin-top:8px; display:inline; }


	
	/****** DOCUMENTS MANAGER ******/
	ul.doc-list li { margin:0 21px 12px 21px; max-width:460px; float:left; }
	
	/** Recaptcha Responsive **/
	.rc-anchor-normal {
	    height: 74px;
	    max-width: 250px !important;
	    width: 100% !important;
	}
	
		
}  /* @media(min-width: 880px) */



@media(min-width:1200px) {

	.homepage #overlay { width:100%; position:absolute; left:0; bottom:260px; top:auto; z-index:100; text-align:center; background:none; }
	.homepage #overlay h1 { font-size:65px; }

} /** END 1200 **/

@media(min-width:1450px) {
	#menuBtn { display: none; }

	#mainmenu { 
		display: block;
		position: absolute; top:70px; right:5px; left:auto;
		margin:0px; padding:0; width:auto;
		text-align: right;
		background:transparent;
		border-bottom:none; 
	}
	#mainmenu ul { width:auto; display:inline-block; margin:0; }

	#mainmenu ul li {
		display: -webkit-inline-flex;
		display: inline-flex;
		position: relative;
		float:left;
		text-align: center;
		margin: 0 auto;
		border-bottom:none;
	}
	#mainmenu ul li a {
		padding: 10px 12px;
		font-size: 15px;
		width: 100%;
	}
	#mainmenu ul li a:hover, #mainmenu ul li a:active, #mainmenu ul li.active a { color:#272c68; }	
	#mainmenu ul li > ul {
		display: none;
		position: absolute;
		margin: 0px;
		padding: 0px;
		left: 0px;
		min-width: 100px;
		z-index: 999;
		background: #fff;
		text-align:left;
		top: 36px;
		border-bottom: 1px solid #ccc;
	}
	#mainmenu ul li:hover > ul { display: block; }
	
	#mainmenu ul li > ul li {
		margin: 0px; 
		float: none; 
		position: relative;
		border-left: none;
		width:100%;
		border-bottom: 1px solid #ccc;
		text-align:left;
	}
	
	#mainmenu ul li > ul li a {
		display: block;
		padding: 8px 20px;
		color: #000;
		font-size: 15px;
		text-decoration: none;
	}

} /** END 1450 **/


