/*------------------------------+
 | Site: Nichols Farm & Orchard |
 | Part: Master styles          |
 +------------------------------*/

/* Imports
=====================================================================*/
@import url(//fonts.googleapis.com/css?family=Noto+Sans:400,400italic,700,700italic|Homemade+Apple|Libre+Baskerville:400,400italic,700|Patrick+Hand+SC);
@import url(//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css);
@import url(/content/styles/reset.css);
@import url(/content/styles/forms.css);
@import url(/content/styles/ie.css);


/* Fonts
======================================================================*/
.blurb h3 { font-family: "Patrick Hand SC", Arial, cursive; }
body, input, .mute, select, textarea { font-family: "Noto Sans", Arial, sans-serif; }
.handwriting, #tagline { font-family: "Homemade Apple", Arial, cursive; }
#logo, #subfooter-about { font-family: "Libre Baskerville", Georgia, "Times New Roman", Times, serif; }


/* Basics
======================================================================*/
a { color: #664a7a; text-decoration: none; }
a:hover { text-decoration: underline; }
address { font-style: normal; }
body { background: #5f7049; color: #57584c; font-size: 16px; line-height: 1.5; }
cite, em { font-style: italic; }
dl, ol, p, table, ul { margin-bottom: 1em; }
dt { margin-top: 1.5em; }
dt, h1, h2, h3, h4, h5, h6, strong { font-weight: bold; }
dt:first-child { margin-top: 0; }
h1 { color: #666; font-size: 20px; letter-spacing: 0.2em; margin-bottom: 1em; text-transform: uppercase; }
h2 { font-size: 18px; line-height: 1.3; margin-bottom: 0.5em; }
h2 span { font-size: 16px; font-weight: normal; }
h4 { font-size: 15px; }
h5 { font-size: 13px; }
h6 { font-size: 11px; }
hr { background: #ddd; border: 0; clear: both; color: #ddd; height: 1px; margin: 1.5em 0; }
img { max-width: 100%; }
ol { list-style: decimal; margin-left: 2em; }
ol ol { list-style: lower-alpha; }
ol ol ol { list-style: lower-roman; }
table { border-collapse: collapse; width: 100%; }
table h2, table p { margin: 0; }
td { border: 1px solid #ddd; border-width: 1px 0; vertical-align: top; }
td, th { padding: 0.5em; }
td[align=center], th[align=center] { text-align: center; }
td[align=right], th[align=right] { text-align: right; }
td:first-child, th:first-child { padding-left: 0; }
td:last-child, th:last-child { padding-right: 0; }
th { color: #9b9993; font-weight: bold; vertical-align: bottom; }
th img { vertical-align: middle; }
ul { list-style: disc; margin-left: 1.5em; }

/* Stock classes */
.l { float: left; }
.r { float: right; }
.num { text-align: right; }
ul.flat { list-style: none; margin-left: 0; }
ul.flat > li { background: none; margin: 0; padding: 0; }


/* Core layout
======================================================================*/
#body-wrapper { background: #fdf9f4; padding-bottom: 20px; }
#content-wrapper, #extras-content, #footer-content, #header, #carousel-nav, #carousel .overlay, #subfooter-content, #subheader-content { margin: 0 auto; max-width: 940px; }
.clear { clear: both; }

/* Columns */
.c2l, .c2r { width: 48%; }
.c2l, .c3l, .c3m { float: left; }
.c2r, .c3r { float: right; }
.c3l { margin-right: 3%; }
.c3l, .c3m, .c3r { width: 31%; }
.c4l, .c4ml, .c4mr, .c4r { width: 23.25%; }
.c4l, .c4ml, .c4mr { float:left; margin-right:2.30%; }
.c4r { float:right; }

/* Columns responsive */
@media screen and (max-width: 375px) {
    /* iphone x*/
    .c4l, .c4ml, .c4mr, .c4r { width: 44%; }
    .c4l, .c4mr { float:left; }
    .c4ml, .c4r { float:right;}
}

@media only screen and (min-width : 375px) and (max-device-width : 1024px) {
    .c4l, .c4ml, .c4mr, .c4r { width: 45%; }
    .c4l, .c4mr { float:left; }
    .c4ml, .c4r {float:right;}
    .c4r { margin-right:2.30%;}
    .c4mr, .c4r {margin-top:2%; }
    .c4mr { clear:both; } /* bug on s5 landscape */
}

/* Content */
#content { background: #fff; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2); padding: 20px 20px 80px; position: relative; z-index: 900; }
#content-primary { float: right; position: relative; width: 73%; z-index: 1000; }
#content-secondary { float: left; width: 24.78%; }
#content-wrapper { padding-top: 80px; }

    /* Landing pages */
    .landing #content-wrapper { padding-top: 315px; }
    
    /* Home page */
    .home #content { background: none; box-shadow: none; margin: 0 auto; max-width: 940px; padding: 0; }
    .home #content-primary, .home #content-secondary { float: none; width: auto; }
    .home #content-wrapper { background: #fff; border-bottom: 1px dashed #e5e5e5; clear: both; padding: 30px 20px; max-width: 100%; }


/* Content
======================================================================*/

/* Account navigation */
#account-nav { list-style: none; margin: 0; }
#account-nav li { display: inline; margin-left: 1em; }
#account-nav-secondary { list-style: none; margin: 0 0 2em; }
#account-nav-secondary .current { font-weight: bold; }
#account-nav-secondary li { display: inline; margin-right: 1em; }

/* Action */
.action {
    -webkit-appearance: none;
    background: #755b87;
    filter: none;
    border: 0;
    border-radius: 5px;
    color: #fff;
    cursor: pointer;
    font-size: 16px;
    font-weight: bold;
    display: inline-block;
    padding: 0.5em 1em;
}

.action:hover { opacity: 0.7; text-decoration: none; }

/* Addresses */
.addresses { clear: both; list-style: none; margin: 0; }
.addresses .actions { list-style: none; margin: 0; }
.addresses .actions li { display: inline; margin: 0 1em 0 0; }
.addresses .card { border: 1px solid #ccc; box-sizing: border-box; height: 200px; margin-bottom: 10px; padding: 15px 20px; }
.addresses > li { float: left; margin: 0 2% 15px 0; width: 48%; }
.addresses > li.selected .card { background: #f0f0ef; border-color: #555; box-shadow: 0 1px 5px rgba(0,0,0,0.4); }

.stagebanner { color:white; align-items: center; text-align: center; padding: 0em 1.5em 1.5em 1.5em; width: 100%; font-size: larger; background-image: url('/Content/images/spinutech-header.png'); }
.stagebanner a { color:white;}

/* Blurbs */
.blurb { font-size: 18px; text-align: center; }
.blurb h3 { font-size: 24px; font-weight: normal; letter-spacing: 0.075em; line-height: 1.2; margin-bottom: 0.5em; text-transform: uppercase; }

/* Callouts */
div.call-l, img.call-l { clear: left; }
div.call-r, img.call-r { clear: right; }
dt img.call-l { margin-top: 0; }
img.call-l { margin-right: 1em; }
img.call-r { margin-left: 1em; }
.call-l { float: left; margin: 0.5em 2em 0.5em 0; }
.call-r { float: right; margin: 0.5em 0 0.5em 2em; }
.call, div.call-l, div.call-r { font-size: 0.75em; }
.call img, .call-l img, .call-r img { display: block; }
.call img.icon, .call-l img.icon, .call-r img.icon { display: inline; }
.call, .call-l p, .call-r p { margin-bottom: 0.5em; }
.credit { color: #7f8183; font-size: 10px; margin-bottom: 0.5em; text-align: right; }

/* Carousel */
#carousel { background: #fdf9f4; height: 525px; position: relative; }
#carousel .carousel-content { height: 100%; width: 100%; }
#carousel .overlay { height: 100%; position: relative; }
#carousel .overlay * { margin: 0; }
#carousel .overlay, #carousel .overlay a { color: #fff; }

#carousel .overlay-content {
    background: url(/content/images/overlay-bg.png);
    border-radius: 12px;
    bottom: 25px;
    max-width: 62%;
    padding: 12px 20px 22px;
    position: absolute;
    right: 0;
}

#carousel .image {
    background-position: 50% 0;
    background-repeat: no-repeat;
    background-size: cover;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}

    /* Nav */
    #carousel-nav { position: relative; }
    #carousel-nav a { border: 2px solid #ddd; border-radius: 20px; display: inline-block; height: 10px; width: 10px; }
    #carousel-nav li { display: inline; }
    #carousel-nav li.cycle-pager-active a { background: #ddd; }
    #carousel-nav ul { bottom: 28px; list-style: none; margin: 0; position: absolute; right: 9px; z-index: 1000; }

/* DataTables */
.dataTables_wrapper { clear: both; }
.dataTables_wrapper .dataTables_filter { margin-bottom: 10px; }
.dataTables_wrapper .dataTables_filter .txt { margin: 0; width: 10em; }
.dataTables_wrapper .dataTables_info { float: right; }
.dataTables_wrapper .dataTables_length { float: right; }
.dataTables_wrapper .dataTables_length select { margin-left: 0.5em; }
.dataTables_wrapper .dataTables_paginate a { cursor: pointer; margin-right: 1em; }
.dataTables_wrapper .dataTables_paginate a.paginate_active { color: #000; cursor: default; font-weight: bold; }
.dataTables_wrapper .dataTables_paginate a.paginate_button_disabled { color: #666; cursor: default; }
.dataTables_wrapper .sorting, .dataTables_wrapper .sorting_asc, .dataTables_wrapper .sorting_desc { cursor: pointer; }
.dataTables_wrapper table { clear: both; }
.dataTables_wrapper th.sorting .fa-caret-down, .dataTables_wrapper th.sorting .fa-caret-up { display: none; }
.dataTables_wrapper th.sorting_asc .fa-caret-down { display: none; }
.dataTables_wrapper th.sorting_desc .fa-caret-up { display: none; }

/* Extras */
#extras { background: #fdf9f4; padding: 30px 20px; }
#extras-intro { font-size: 20px; margin: 0 auto; text-align: center; width: 90%; }
#extras-primary { float: left; widtH: 48%; }
#extras-secondary { float: right; width: 48%; }

/* Features */
.feature { font-size: 18px; text-align: center; }
.feature a { display: block; }
.feature a:hover { opacity: 0.7; text-decoration: none; }
.feature img { display: block; width: 100%; }
.feature .thumb { display: block; margin-bottom: 10px; position: relative; }
.feature .title { background: #664a7a; border-radius: 4px; bottom: 10px; color: #fff; font-weight: bold; display: block; padding: 0.3em 1em; position: absolute; right: -10px; }

/* Footer */
#footer { font-size: 13px; padding: 20px; }
#footer, #footer a { color: #fff; }

    /* Site credit */
    #credit { float: right; text-align: right; }
    #credit a:hover strong { text-decoration: underline; }
    
    /* Subfooter */
    #subfooter { background: #e7e8d6; border-bottom: 1px dashed #5f7049; border-top: 1px dashed #b9c18b; font-size: 14px; padding: 40px 20px; }
    #subfooter a, #subfooter h5, #subfooter h6 { color: #264d29; }
    #subfooter address i { margin: 0 1em; }
    #subfooter .adr { display: block; }
    
    #subfooter #facebook a {
        background: url(/content/images/tractor.png) no-repeat 0 0;
        color: #664a7a;
        font-size: 13px;
        display: block;
        margin-top: 20px;
        padding: 5px 0 7px 16px;
        width: 226px;
    }
    
    #subfooter #facebook a:hover { opacity: 0.7; text-decoration: none; }
    #subfooter #facebook i { color: #57584c; }
    #subfooter h5 { font-size: 16px; }
    #subfooter h6 { font-size: 14px; line-height: 1.1; margin-bottom: 0.5em; }
    #subfooter hr { background: #9da68e; color: #9da68e; }
    #subfooter ul { list-style: none; margin: 0; }
    #subfooter-about { font-size: 16px; }
    #subfooter-about h5 { font-size: 20px; }
    #subfooter-primary { float: left; width: 47.87%; }
    #subfooter-secondary { float: right; width: 47.87%; }

/* Handwritten text */
.handwriting { font-size: 26px; font-weight: normal; letter-spacing: normal; line-height: 1.6; text-transform: none; }
.home .handwriting { font-size: 30px; text-align: center; }

/* Header */
#header-content { float: left; position: relative; width: 24.78%; z-index: 1000; }

/* Header-nav (account, cart) */
#header-nav { list-style: none; margin: 0 0 8px; text-align: right; }
#header-nav .fa { font-size: 1.3em; vertical-align: middle; }
#header-nav li { display: inline; margin-left: 1em; }
#header-nav ul { display: inline; margin: 0; }

    /* Logo */
    #logo { box-shadow: 0 0 5px rgba(0, 0, 0, 0.1); letter-spacing: 0.1em; font-size: 11px; text-transform: uppercase; }
    #logo a { background: #fff; border: 1px solid #cbcbcb; border-top: 0; border-radius: 0 0 6px 6px; color: #76776d; display: block; padding: 20px 20px 15px; text-align: center; }
    #logo a:hover { text-decoration: none; }
    #logo img { margin-bottom: 5px; max-width: 192px; width: 100%; }
    #logo span { display: block; }
    
    /* Subheader */
    #subheader {
        background: url(/content/images/overlay-bg.png);
        box-sizing: border-box;
        font-size: 17px;
        padding: 0.6em 0 0.5em;
        position: absolute;
        text-align: right;
        padding-right: 20px;
        width: 100%;
        z-index: 110;
    }
    
    #subheader, #subheader a { color: #fff; }

/* Hero images */
#hero { left: 0; position: absolute; top: 0; width: 100%; z-index: 1; }
#hero #banner { background-position: 50% 50%; background-repeat: no-repeat; background-size: cover; height: 350px; }

    /* Individual images */
    .apples #hero #banner { background-image: url(/content/images/banners/apples.jpg); }
    .csa #hero #banner { background-image: url(/content/images/banners/csa.jpg); }
    .food #hero #banner { background-image: url(/content/images/banners/food.jpg); }
    .markets #hero #banner { background-image: url(/content/images/banners/markets.jpg); }
    .news #hero #banner { background-image: url(/content/images/banners/news.jpg); }
    .restaurants #hero #banner { background-image: url(/content/images/banners/restaurants.jpg); }
    .store #hero #banner { background-image: url(/content/images/banners/store.jpg); }
    .story #hero #banner { background-image: url(/content/images/banners/story.jpg); }

/* Hidden */
.hidden { left: -999em; position: absolute; top: 0; }

/* Home page */
.home #hero #banner { display: none; }
.home #nav { margin-bottom: 10px; }

/* Icons */
.icon { background-repeat: no-repeat; background-position: 0 0.4em; padding: 3px 0 3px 22px; }
.icon-add { background-image: url(/content/images/shared/add.png); }
.icon-cal { background-image: url(/content/images/shared/calendar.png); }
.icon-doc { background-image: url(/content/images/shared/doc.png); }
.icon-facebook { background-image: url(/content/images/shared/facebook.png); }
.icon-feed { background-image: url(/content/images/shared/feed.png); }
.icon-linkedin { background-image: url(/content/images/shared/linkedin.png); }
.icon-list { background-image: url(/content/images/shared/list.png); }
.icon-map { background-image: url(/content/images/shared/map.png); }
.icon-money { background-image: url(/content/images/shared/icon-money.png); }
.icon-no { background-image: url(/content/images/shared/icon-no.gif); }
.icon-pdf { background-image: url(/content/images/shared/pdf.png); }
.icon-ppt { background-image: url(/content/images/shared/ppt.png); }
.icon-search-options { background-image: url(/content/images/shared/search-options.png); }
.icon-sort { background-image: url(/content/images/shared/icon-sort.png); }
.icon-twitter { background-image: url(/content/images/shared/twitter.png); }
.icon-xls { background-image: url(/content/images/shared/xls.png); }
.icon-youtube { background-image: url(/content/images/shared/youtube.png); }
img.icon { padding: 0; vertical-align: middle; }

/* Input validation error */
.input-validation-error { border: 2px solid #ff0000 !important; }

/* Locations */
.locations h3 { font-weight: normal; margin-bottom: 1em; text-transform: uppercase; }
.locations img { width: 16px; }

/* Logo collages */
.logos { width: 100%; }
.logos a:hover { opacity: 0.7; }
.logos .call-l, .logos .call-r { float: none; margin: 0; width: auto; }
.logos .call-l img, .logos .call-r img { display: inline; }
.logos img { max-height: 150px; max-width: 150px; }
.logos p { margin: 0; }
.logos td { padding: 15px; text-align: center; vertical-align: middle; width: 33%; }

/* Maps */
#map { height: 700px; }
#map img { max-width: none; }
.geo { display: none; }
    
    /* Windows (new, custom popup using ExtInfoWindow) */
	/* http://gmaps-utility-library.googlecode.com/svn/trunk/extinfowindow/release/docs/examples.html */
	#gwindow { width: 350px; }
	#gwindow_b { background: url(/images/shared/gwindow_b.png); height: 15px; }
	#gwindow_beak { background: url(/images/shared/gwindow_beak.png); height: 49px; width: 47px; }
	#gwindow_bl { background: url(/images/shared/gwindow_bl.png); height: 15px; width: 10px; }
	#gwindow_br { background: url(/images/shared/gwindow_br.png); height: 15px; width: 15px; }
	#gwindow_close { background: url(/images/shared/gwindow_close.png) no-repeat; cursor: pointer; height: 16px; width: 16px; }
	#gwindow_l { background: url(/images/shared/gwindow_l.png); width: 10px; }
	#gwindow_r { background: url(/images/shared/gwindow_r.png); width: 15px; }
	#gwindow_t { background: url(/images/shared/gwindow_t.png); height: 1px; }
	#gwindow_tl { background: url(/images/shared/gwindow_tl.png); height: 10px; width: 10px; }
	#gwindow_tr { background: url(/images/shared/gwindow_tr.png); height: 10px; width: 15px; }
    
        /* Window contents */
        #info-window-content { background-color: #fff; }
        #info-window-content .desc-content { font-size: 12px; }
        #info-window-content h3 { font-size: 1.5em; line-height: 1.2; }
        #info-window-content p { font-size: 1.2em; }
        #info-window-content .thumb { float: left; margin: 3px 10px 0 0; width: 44px; }

/* More links */
.more { text-align: center; }

/* Muted text */
.mute { color: #7f7f7f; font-size: 13px; font-weight: normal; }

/* Navigation */
#nav { background: url(/content/images/nav-bg.png); border-radius: 0 0 6px 6px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.1); margin: 0 auto 50px; width: 93%; }
#nav a { border-bottom: 1px solid #a7b0b0; border-top: 1px solid #fff; display: block; font-size: 15px; font-weight: bold; padding: 0.3em 0.5em; }
#nav a:hover { background: #fff; color: #000; text-decoration: none; }
#nav .current a { background: #755b87; border: 0; border-radius: 3px; color: #fff; margin-top: -1px; }
#nav #nav-primary li { margin: 0; }
#nav #nav-primary li:first-child a { border-top: 0; }
#nav #nav-primary li:last-child a { border-bottom: 0; }
#nav #nav-primary { list-style: none; margin: 0; padding: 10px 15px 15px; }
#nav ul { list-style: none; margin: 0; }

    /* Secondary navigation */
    #nav-secondary { border-bottom: 2px dotted #ddd; font-size: 14px; margin: -10px 0 30px; padding-bottom: 20px; text-transform: uppercase; }
    #nav-secondary li { display: inline; margin-right: 1em; }
    #nav-secondary li.current a { color: #000; }
    #nav-secondary ul { list-style: none; margin: 0; }

/* Notes from the farm */
.notes i { color: #7d8b6b; display: block; margin-bottom: 0.7em; text-align: center; }
.notes .date { float: left; font-size: 13px; padding-top: 0.2em; text-transform: uppercase; }
.notes dt { margin-top: 1em; }
.notes dt:first-child i { display: none; }
.notes.notes-from-the-farm-list dt:first-child i { display: block; }

/* Paging */
.pages, .pages ul { clear: both; float: none; font-size: 16px; list-style: none; margin: 50px 0 30px; text-align: center; }
.pages li { display: inline; margin: 0 10px 0 0; }

/* PrettyPhoto */
.pp_pic_holder .ppt { display: none !important; }

/* Products */
.products { list-style: none; margin: 0; }
.products li { float: left; margin: 0 4.56% 1em 0; width: 30.28%; }
.products li.clear { float: none; height: auto; width: auto; }
.products li.end { float: right; margin-right: 0; }
.products .thumb img { display: block; margin-bottom: 0.2em; width: 100%; }
.products .title { font-weight: bold; margin: 0; }
.product-image img { width: 100%; }
.product-price { font-size: 30px; }

/* Seasonal fruits and vegetables */
#seasonal { margin-top: 30px; }
#seasonal .credit { font-size: 10px; margin-top: 0.5em; text-align: left; text-transform: uppercase; }
#seasonal .credit, #seasonal .credit a { color: #888; }
#seasonal .credit p { display: inline; }
#seasonal .month { background: #e7e8d6; color: #264d29; font-size: 13px; padding: 0.6em 0; text-align: center; }
#seasonal .month-col { text-align: center; width: 6%; }
#seasonal .on td, #seasonal .on th { background: #98a98f; color: #000; font-weight: bold; }
#seasonal .on .mute { color: #000; }
#seasonal table { width: 100%; }
#seasonal tbody td, #seasonal tbody th { border-bottom: 1px solid #ddd; padding: 0.3em 0.1em; vertical-align: middle; }
#seasonal tbody th { padding-left: 0.5em; }
#seasonal thead th { font-size: 13px; }
#seasonal .type:hover td, #seasonal .type:hover th { background: #ced4c0; cursor: pointer; }

    /* Sub items */
    #seasonal .sub { margin: 0; }
    #seasonal .sub .description { width: 61%; }
    #seasonal .sub .name { color: #7f7f7f; padding-left: 0.5em; }
    #seasonal .sub td { padding-right: 1em; vertical-align: top; }
    #seasonal .sub .thumb { padding-right: 0; width: 10%; }
    #seasonal .sub tr:last-child td { border: 0; }
	
.submit-link { background-color: transparent; text-decoration: underline; border: none; cursor: pointer; cursor: hand; color: #808285; font-size: 13px; }
.submit-link:hover { text-decoration: none; }

/* Toggling options */
.closed { display: none; }