/*
[Ocean Art]
@version: 1.0
@author: Aaron Wentt and Drew Garvey
CONTENTS: 
-------------------------------------------------------------

  1. Linked Styles [Includes Google Fonts and plug-in styles]
  2. HTML5 Boilerplate
  3. Primary Styles [Authors: Aaron Wentt and Drew Garvey]
  4. Responsive Styles
  5. Print Styles 

-------------------------------------------------------------
*/


/*
--------------------
  1. Linked Styles
--------------------
*/
 
@import url(http://fonts.googleapis.com/css?family=Cabin:400,700);

/*
--------------------
  end Linked Styles
--------------------
*/

/*
-------------------------------------------------------
  2. HTML5 Boilerplate
     [DON'T MODIFY THIS! BE A WINRAR...]
-------------------------------------------------------
*/

    /* 
       HTML5 ✰ Boilerplate
       
       What follows is the result of much research on cross-browser styling. 
       Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
       Kroc Camen, and the H5BP dev community and team.
       Detailed information about this CSS: h5bp.com/css
       
     */


    /* -----------------------------------------------------------------------------
       HTML5 display definitions
       -------------------------------------------------------------------------- */

    article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
    audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
    audio:not([controls]) { display: none; }
    [hidden] { display: none; }

    /* -----------------------------------------------------------------------------
       Base
       -------------------------------------------------------------------------- */

    /*
     * 1. Correct text resizing oddly in IE6/7 when body font-size is set using em units
     * 2. Force vertical scrollbar in non-IE
     * 3. Prevent iOS text size adjust on device orientation change, without disabling user zoom: h5bp.com/g
     */

    html { font-size: 100%; overflow-y: scroll; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }

    body { margin: 0; font-size: 10px; line-height: 2.0; }

    body, button, input, select, textarea { font-family: sans-serif; color: #222; }

    /* 
     * Remove text-shadow in selection highlight: h5bp.com/i
     * These selection declarations have to be separate
     * Also: LIME GREEN! 
     */

    ::-moz-selection { background: #62AE0A; color: #fff; text-shadow: none; }
    ::selection { background: #62AE0A; color: #fff; text-shadow: none; }


    /* -----------------------------------------------------------------------------
       Links
       -------------------------------------------------------------------------- */

    a { color: #00e; }
    a:visited { color: #551a8b; }
    a:hover { color: #06e; }
    a:focus { outline: thin dotted; }

    /* Improve readability when focused and hovered in all browsers: h5bp.com/h */
    a:hover, a:active { outline: 0; }


    /* -----------------------------------------------------------------------------
       Typography
       -------------------------------------------------------------------------- */

    abbr[title] { border-bottom: 1px dotted; }

    b, strong { font-weight: bold; }

    blockquote { margin: 1em 40px; }

    dfn { font-style: italic; }

    hr { display: block; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }

    ins { background: #ff9; color: #000; text-decoration: none; }

    mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }

    /* Redeclare monospace font family: h5bp.com/j */
    pre, code, kbd, samp { font-family: monospace, monospace; _font-family: 'courier new', monospace; font-size: 1em; }

    /* Improve readability of pre-formatted text in all browsers */
    pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }

    q { quotes: none; }
    q:before, q:after { content: ""; content: none; }

    small { font-size: 85%; }

    /* Position subscript and superscript content without affecting line-height: h5bp.com/k */
    sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
    sup { top: -0.5em; }
    sub { bottom: -0.25em; }


    /* -----------------------------------------------------------------------------
       Lists
       -------------------------------------------------------------------------- */

    ul, ol { margin: 1em 0; padding: 0 0 0 40px; }
    dd { margin: 0 0 0 40px; }
    nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }


    /* -----------------------------------------------------------------------------
       Embedded content
       -------------------------------------------------------------------------- */

    /*
     * 1. Improve image quality when scaled in IE7: h5bp.com/d
     * 2. Remove the gap between images and borders on image containers: h5bp.com/e 
     */

    img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }

    /*
     * Correct overflow not hidden in IE9 
     */

    svg:not(:root) { overflow: hidden; }


    /* -----------------------------------------------------------------------------
       Figures
       -------------------------------------------------------------------------- */

    figure { margin: 0; }


    /* -----------------------------------------------------------------------------
       Forms
       -------------------------------------------------------------------------- */

    form { margin: 0; }
    fieldset { border: 0; margin: 0; padding: 0; }

    /* Indicate that 'label' will shift focus to the associated form element */
    label { cursor: pointer; }

    /* 
     * 1. Correct color not inheriting in IE6/7/8/9 
     * 2. Correct alignment displayed oddly in IE6/7 
     */

    legend { border: 0; *margin-left: -7px; padding: 0; }

    /*
     * 1. Correct font-size not inheriting in all browsers
     * 2. Remove margins in FF3/4 S5 Chrome
     * 3. Define consistent vertical alignment display in all browsers
     */

    button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }

    /*
     * 1. Define line-height as normal to match FF3/4 (set using !important in the UA stylesheet)
     * 2. Correct inner spacing displayed oddly in IE6/7
     */

    button, input { line-height: normal; *overflow: visible; }

    /*
     * Reintroduce inner spacing in 'table' to avoid overlap and whitespace issues in IE6/7
     */

    table button, table input { *overflow: auto; }

    /*
     * 1. Display hand cursor for clickable form elements
     * 2. Allow styling of clickable form elements in iOS
     */

    button, input[type-"button"], input[type-"reset"], input[type-"submit"] { cursor: pointer; -webkit-appearance: button; }

    /*
     * Consistent box sizing and appearance
     */

    input[type-"checkbox"], input[type-"radio"] { box-sizing: border-box; }
    input[type-"search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
    input[type-"search"]::-webkit-search-decoration { -webkit-appearance: none; }

    /* 
     * Remove inner padding and border in FF3/4: h5bp.com/l 
     */

    button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }

    /* 
     * 1. Remove default vertical scrollbar in IE6/7/8/9 
     * 2. Allow only vertical resizing
     */

    textarea { overflow: auto; vertical-align: top; resize: vertical; }

    /* Colors for form validity */
    input:valid, textarea:valid {  }
    input:invalid, textarea:invalid, .error { background-color: #f0dddd; }


    /* -----------------------------------------------------------------------------
       Tables
       -------------------------------------------------------------------------- */

    table { border-collapse: collapse; border-spacing: 0; }
    td { vertical-align: top; }


    /* --|-- non-semantic helper classes ----------------------------------------
       Please define your styles before this section.
       -------------------------------------------------------------------------- */

    /* For image replacement */
    .ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; }
    .ir br { display: none; }

    /* Hide from both screenreaders and browsers: h5bp.com/u */
    .hidden { display: none !important; visibility: hidden; }

    /* Hide only visually, but have it available for screenreaders: h5bp.com/v */
    .visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }

    /* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: h5bp.com/p */
    .visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }

    /* Hide visually and from screenreaders, but maintain layout */
    .invisible { visibility: hidden; }

    /* Contain floats: h5bp.com/q */ 
    .clearfix:before, .clearfix:after { content: ""; display: table; }
    .clearfix:after { clear: both; }
    .clearfix { zoom: 1; overflow: hidden; }

/*
--------------------
  End Boilerplate
--------------------
*/


/*
--------------------
  3. Primary Styles
--------------------
*/


/*
*====================
*
*  Global Base Styles
*
*=====================
*/

body {
  border-top: 10px solid rgb(31,87,136);
}

p {
  font: normal 1.3em/1.84 Georgia, Times, serif;
}

h1, h2, h3, h4, h5, h6 {
  font-family: "Cabin", Tahoma, Helvetica, sans-serif;
  font-weight: bold;
  padding: 0;
  margin: 0;
}

h1 {
  font-size: 2em;
}

h2 {
  font-size: 1.6em;
}

h3 {
  font-size: 1.3em;
}

h6 {
  font-size: 1em;
}

figure img {
    max-width: 100%;
    overflow: hidden;
}

/*
*====================
*
* HEADER 
*
*====================
*/


header {
  margin: 1.5em auto 2em; /* center */
  overflow: hidden; 
}


/* Logo  */

.logo {
  width: 21.5em;
  margin: 0 auto 1.5em;
}

/* Top Nav */

#main_nav {
    overflow: hidden;
}

#our_shop {
  display: none;
}

ul.buttons {
    margin: 0 auto;
}
    
ul.buttons li {
    font: bold 1.3em 'Cabin', Tahoma, Helvetica, sans-serif;
    display: inline;
}

ul.buttons li:first-of-type a {
  border-radius: 0.4em 0 0 0.4em;
}

ul.buttons li:last-of-type a {
  border-radius: 0 0.4em 0.4em 0;
}

ul.buttons li a {
    color: #ffffff;
    display: inline-block;
    margin-right: -5px;
    padding: 12.5px 0;
    width: 25%;
    text-align: center;
    text-decoration: none;
    border: 1px solid rgba(10,67,109,1);
    background: rgb(31,87,136);
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzFmNTc4OCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwYTQzNmQiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top,  rgba(31,87,136,1) 0%, rgba(10,67,109,1) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(31,87,136,1)), color-stop(100%,rgba(10,67,109,1)));
    background: -webkit-linear-gradient(top,  rgba(31,87,136,1) 0%,rgba(10,67,109,1) 100%);
    background: -o-linear-gradient(top,  rgba(31,87,136,1) 0%,rgba(10,67,109,1) 100%);
    background: -ms-linear-gradient(top,  rgba(31,87,136,1) 0%,rgba(10,67,109,1) 100%);
    background: linear-gradient(top,  rgba(31,87,136,1) 0%,rgba(10,67,109,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1f5788', endColorstr='#0a436d',GradientType=0 );

}
ul.buttons li a:hover, 
ul.buttons li a.active {
    background: rgb(31,87,136);
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzFmNTc4OCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjMzJSIgc3RvcC1jb2xvcj0iIzBhNDM2ZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
    background: -moz-linear-gradient(top,  rgba(31,87,136,1) 0%, rgba(10,67,109,1) 33%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(31,87,136,1)), color-stop(33%,rgba(10,67,109,1)));
    background: -webkit-linear-gradient(top,  rgba(31,87,136,1) 0%,rgba(10,67,109,1) 33%);
    background: -o-linear-gradient(top,  rgba(31,87,136,1) 0%,rgba(10,67,109,1) 33%);
    background: -ms-linear-gradient(top,  rgba(31,87,136,1) 0%,rgba(10,67,109,1) 33%);
    background: linear-gradient(top,  rgba(31,87,136,1) 0%,rgba(10,67,109,1) 33%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1f5788', endColorstr='#0a436d',GradientType=0 );

}
ul.buttons li a:active {
    background: rgb(10,67,109);
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzBhNDM2ZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMxZjU3ODgiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top,  rgba(10,67,109,1) 0%, rgba(31,87,136,1) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(10,67,109,1)), color-stop(100%,rgba(31,87,136,1)));
    background: -webkit-linear-gradient(top,  rgba(10,67,109,1) 0%,rgba(31,87,136,1) 100%);
    background: -o-linear-gradient(top,  rgba(10,67,109,1) 0%,rgba(31,87,136,1) 100%);
    background: -ms-linear-gradient(top,  rgba(10,67,109,1) 0%,rgba(31,87,136,1) 100%);
    background: linear-gradient(top,  rgba(10,67,109,1) 0%,rgba(31,87,136,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0a436d', endColorstr='#1f5788',GradientType=0 );

}

/* TOP CONTACT */

ul#top_contact {
    margin-top: 3.8em;
    text-align: right;
}

ul.contact_info {
  font: 1.3em normal Georgia, Times, "Times New Roman", sans-serif;
  list-style: none; 
}

ul.contact_info a {
  color: #000;
  font-weight: bold;
  text-decoration: underline;
}

ul.contact_info a:hover {
  text-decoration: none;
}

#footer_contact a {
  color: #fff;
}

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

/* MAIN */

#main {
  margin: 0 auto 5em;
}

div.flexslider {
  height: 100%;
  margin: 0 auto 4em;
  max-width: 963px;
}

section.three_column {
  clear: none;
  padding-bottom: 2em;
}

section.shop_highlights h2 {
  background-color: rgb(253,192,16);
  color: #fff;
  font-size: 1.6em;
  padding: .2em 0 .2em 1.5em;
  border-bottom: 2px solid rgb(190,144,12);
  border-radius:  5px 5px 0 0;
}

section.shop_highlights p {
  padding: 0 1em;
}

/* CONTENT */

.heading_dec {
  display: block;
  width: 216px;
}

.heading_dec hr {
  border-bottom: 3px solid #FDC010;
}

.content {
  width: 100%;
  margin: 0;
  padding: 0 1em;
  overflow: hidden;
}

.content p {
  width: 95%;
}

.content h1 {
  color: rgba(31, 87, 136, 1);
  color: #1F5788;
}

.content h3 {
  color: rgba(31, 87, 136, 1);
  color: #1F5788; 
}

figure {
  width: 230px;
  margin: 0 auto;
}

/* TESTIMONIAL */

.testimonial {
  width: 95%;
  margin-top: 84px;
  padding: 0 1em;
  overflow: hidden;
}

blockquote {
  margin: 0px;
  padding: 0px;
}

.testimonial h2 {
  color: rgba(31, 87, 136, 1);
  color: #1F5788;
}

/* SOURCE */

.source {
  color: rgba(31,87,136,1);
  color: #1F5788;
  font-weight: bold;
}

/* Map */
#map-canvas {
    width:100%!important;
    height:465px;
}

#map_search {
    font-size: 1.5em;
    margin-bottom: 1em;
}

#map_search #map_search-field {
    padding: 1em 0.6em;
    margin-right: 0.6em;
    width: 75%;
}

#map_search #map_search-btn {
    color: #ffffff;
    padding: 1em 0;
    width: 20.33%;
    text-align: center;
    text-decoration: none;
    border: 1px solid rgba(10,67,109,1);
    background: rgb(31,87,136);
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzFmNTc4OCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwYTQzNmQiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top,  rgba(31,87,136,1) 0%, rgba(10,67,109,1) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(31,87,136,1)), color-stop(100%,rgba(10,67,109,1)));
    background: -webkit-linear-gradient(top,  rgba(31,87,136,1) 0%,rgba(10,67,109,1) 100%);
    background: -o-linear-gradient(top,  rgba(31,87,136,1) 0%,rgba(10,67,109,1) 100%);
    background: -ms-linear-gradient(top,  rgba(31,87,136,1) 0%,rgba(10,67,109,1) 100%);
    background: linear-gradient(top,  rgba(31,87,136,1) 0%,rgba(10,67,109,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1f5788', endColorstr='#0a436d',GradientType=0 );
}

#map-direction-panel .adp-directions {
    width: 100%;
}
#map-direction-panel {
    font-size: 16px;
}
#map-direction-panel img.adp-marker {
    margin: .625em 1.25em;
}
.map #map-direction-panel .adp-step, .adp-text {
    vertical-align: middle;
}


/*
*====================
*
*  Footer
*
*====================
*/

footer {
  border-top: 2px solid rgb(31,87,136);
  background: rgb(31,87,136);

}

.social_media li a:hover img {
  border-bottom: 5px solid rgb(253,192,16);
}

figure.best_of_the_beach {
  float: left;
  width: 98px;
}

footer div#footer_top {
  margin: 0 auto 3.2em;
  overflow: hidden;
}

footer div#best_of_the_beach {
  float: right;
  position: absolute;
  top: 5.8em;
  left: 0;
}


footer div#tweet {
  background: url(../img/tweet_frame-middle.png) -1px 0px repeat-y;
  background: url(../img/tweet_frame-logo-2.png) 228px 97% no-repeat, url(../img/tweet_frame-middle.png) -1px 0px repeat-y;
  padding: 1px 0;
  width: 311px; /* ( 311px / 292px ) */
  margin: 66px 0 40px;
  position: relative;
  overflow: visible;
}

footer div#tweet .twitter-timeline {
  margin-left: 42px;
}

footer div#tweet:before {
    content: '';
    background: url(../img/tweet_frame-top.png) -1px 0px no-repeat;
    position: absolute;
    top: -66px;
    left: 0;
    width: 311px; height: 66px;
}

footer div#tweet:after {
    content: '';
    background: url(../img/tweet_frame-bottom.png) -4px 0px no-repeat;
    position: absolute;
    bottom: -60px;
    left: 0;
    /*  \m/ ( - __- ) \m/  */
    width: 315px; height: 62px;
}
    
    

footer div#tweet ul {
  width: 18em; /* (220px / 258px ) */
  font: 1.2em Georgia, Times, serif;
  list-style-type: none;
}

footer div#tweet li {
  padding: 0 2.5px 1em;
}

footer div#tweet li a {
  display: block;
}

nav ul.social_media li {
  display: inline-block;
  margin-right: 1.5em;
}

nav ul.social_media li:last-of-type{
  margin-right: 0;
}

footer h2 {
  color: #fff;
  border-bottom: 2px solid rgb(253,192,16);
  padding: 0px 0 0 .5em;
  margin-bottom: 1.3em;
}

footer li.head {
  font: bold 1em Georgia, Times, sans-serif;
  padding-bottom: .5em;
}

footer ul#footer_contact {
  margin: 0;
  padding-bottom: .25em;
  font-size: 1.3em;
  float: left;
  color: #fff;
  padding: 0;
}

footer li.head {
  font: bold 1em Georgia, Times, sans-serif;
  padding-bottom: .5em;
}

.fb-like {
  margin-top: 8px;
}

footer div.credits {
  background: rgb(98,174,10);
  color: #ffffff;
  text-align: center;
  line-height: 1.5em;
}


/*

  Flexslider

*/

/*
 * jQuery FlexSlider v1.8
 * http://flex.madebymufffin.com
 *
 * Copyright 2011, Tyler Smith
 * Modified for use on Oceanart.com by Aaron Wentt
 * Free to use under the MIT license.
 * http://www.opensource.org/licenses/mit-license.php
 */
 
/* Browser Resets */
.flex-container a:active,
.flexslider a:active {
  outline: none;
}

.slides,
.flex-control-nav,
.flex-direction-nav {
  margin: 0;
  padding: 0;
  list-style: none;
}

ol.flex-control-nav {
  margin-right: 32px;
}

/* FlexSlider Necessary Styles
*********************************/ 
.flexslider {
  width: 100%;
  height: 365px;
  margin: 0;
  padding: 0;
}

.flexslider .slides > li {
  display: none;
} /* Hide the slides before the JS is loaded. Avoids image jumping */

.flexslider .slides img {
  max-width: 100%;  
  display: block;
}

.flex-pauseplay span {
  text-transform: capitalize;
}

.slides a {
  color: #ffffff; 
}

/* Clearfix for the .slides element */
.slides:after {
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
} 

html[xmlns] .slides {
  display: block;
} 

* html .slides {
  height: 1%;
}

/* No JavaScript Fallback */
/* If you are not using another script, such as Modernizr, make sure you
 * include js that eliminates this class on page load */
.no-js .slides > li:first-child {
  display: block;
}


/* FlexSlider Default Theme
*********************************/
.flexslider {
  position: relative;
}

.flexslider .slides {zoom: 1;}

.flexslider .slides > li {position: relative;}
/* Suggested container for "Slide" animation setups. Can replace this with your own, if you wish */

.flex-container {zoom: 1; position: relative;}

/* Caption style */
/* IE rgba() hack */
.flex-caption {
  background:none; 
  -ms-filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4C000000,endColorstr=#4C000000);
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4C000000,endColorstr=#4C000000);
  zoom: 1;
}

.flex-caption {
  position:absolute;
  top: 25px;
  right: 25px;
  background: rgba(31,87,136,.9);
  border: 2px solid rgb(253,192,16);
  color: #fff;
  font-family: Cabin, Tahoma, Helvetica, sans-serif;
  opacity: 1 !important; /* Overridden by captionOpacity setting */
  width: 27.6024166667%; /* 265/960 */
  height: 54.7945205479%; /* 200/365 */
  padding: 20px 5px 20px 15px;
  overflow: hidden;
  margin-right: 32px;
}

.flex-caption strong {
  display: block;
  padding: 0 0 .5em;
  font-size: 1.53846153em;
}

/* Direction Nav */
.flex-direction-nav li a {
  width: 49px;
  height: 49px;
  margin: -13px 0 0;
  display: block;
  background: url(../img/slider-arrow_nav.png) no-repeat 0 0, #fff;
  position: absolute;
  top: 50%;
  cursor: pointer;
  text-indent: -9999px;
}

.flex-direction-nav li .next {
  background-position: -52px 0; 
  right: 0;
}

.flex-direction-nav li .prev {
  left: 0;
}

.flex-direction-nav li .disabled {
  opacity: .3;
  filter:alpha(opacity=30);
  cursor: default;
}

/* Control Nav */
.flex-control-nav {
  position: absolute;
  bottom: 110px;
  right: 50px;
  text-align: center;
  z-index: 10;
}

.flex-control-nav li {
  margin: 0 0 0 5px;
  display: inline-block;
  zoom: 1;
  *display: inline;
}

.flex-control-nav li:first-child {
  margin: 0;
}

.flex-control-nav li a {
  width: 13px;
  height: 13px;
  display: block;
  border-radius: 10px;
  background-color: #fff; 
  cursor: pointer;
  text-indent: -9999px;
}

.flex-control-nav li a:hover {
  background-color: rgb(98,174,10);
}

.flex-control-nav li a.active {
  background-color: rgb(98,174,10);
  cursor: default;
}

/*
-------------------- 

  IE FIXES 

--------------------
*/

.ie8 section.three_column {
  padding-right: 22px; 
}


/*
----------------------
  4. Responsive Styles
----------------------
*/

@media only screen and (max-width: 480px) {
  /* Style adjustments for viewports 480px and over go here */

  section.shop_highlights h2 {
    background-color: #fff;
    color: rgb(253,192,16);
    border: 0;
    padding: 0 0 .5em;
  }

  section.three_column {
    padding: 0 1em 2em;
  }

  .flex-caption, .flex-control-nav, .flex-direction-nav {
    display: none;
  }

  div#tweet, #top_contact {
    display: none;
  }

  section.shop_highlights p {
    padding: 0;
    margin: 0;
  }

}

@media only screen and (min-width: 768px) {
  /* Style adjustments for viewports 768px and over go here */
  
   .logo, nav#main_nav, section.three_column {
    float: left;
    padding-right: 32px;
   }

  nav#main_nav {
    margin-top: 50px;
    padding-right: 3px;
    width: 42%;
  }

   ul#top_contact {
     float: right;
     padding: 0 1em 0 0;
}

}

@media only screen and (min-width: 960px) {
  /* Style adjustments for viewports 768px and over go here */
  
    body:after {
      content: 'desktop';
      display: none;
    }
  
  header, div#main, div#footer_top {
     max-width: 1024px;
  }

  figure.body-img, article.content {
     float: left
  }

  div#main .content {
    width: 47.65625%;
    padding-left: 2em;
}

  div#main .map {
   width: 73.65625%;
 }

  .testimonial {
    float: right;
    width: 17.578125%;
  }

  #our_shop {
    display: inline;
  }

  section.three_column {
    width: 30.125%;
  }

  figure.body-img {
    width: 290px;
  }

   section.three_column:last-of-type {
     padding-right: 0;
   }
  
  #main_nav {
    width: 44.3em;
    margin: 41px 0 0 5.7em;
  }
}

/*pullDown
Made by Justin Aguilar
www.justinaguilar.com/animations/*/

.pullDown{
    animation-name: pullDown;
    -webkit-animation-name: pullDown;   

    animation-duration: 0.7s;   
    -webkit-animation-duration: 0.7s;

    animation-timing-function: ease-out;    
    -webkit-animation-timing-function: ease-out;    

    transform-origin: 50% 0%;
    -ms-transform-origin: 50% 0%;
    -webkit-transform-origin: 50% 0%;       
}

@keyframes pullDown {
    0% {
        transform: scaleY(0.1);
    }
    40% {
        transform: scaleY(1.02);
    }
    60% {
        transform: scaleY(0.98);
    }
    // 80% {
    //     transform: scaleY(1.01);
    // }
    100% {
        transform: scaleY(1.00);
    }               
    // 80% {
    //     transform: scaleY(1.01);
    // }
    // 100% {
    //     transform: scaleY(1);
    // }                           
}

@-webkit-keyframes pullDown {
    0% {
        -webkit-transform: scaleY(0.1);
    }
    40% {
        -webkit-transform: scaleY(1.02);
    }
    60% {
        -webkit-transform: scaleY(0.98);
    }
    // 80% {
    //     -webkit-transform: scaleY(1.01);
    // }
    100% {
        -webkit-transform: scaleY(1.00);
    }               
    // 80% {
    //     -webkit-transform: scaleY(1.01);
    // }
    // 100% {
    //     -webkit-transform: scaleY(1);
    // }       
}



/* -----------------------------------------------------
   5. Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ----------------------------------------------------- */
 
@media print {
  * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: h5bp.com/s */
  a, a:visited { text-decoration: underline; }
  a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  .ir a:after, a[href^-"javascript:"]:after, a[href^-"#"]:after { content: ""; }  /* Don't show links for images, or javascript/internal links */
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; } /* h5bp.com/t */
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { page-break-after: avoid; }
}