/*

sea-style.css
^^^^^^^^^^^^^

Screen Resolutions:

Resolution:   . Type         . Key   . Min-width
================================================
< 568x???     : MOBILE       : *
> 568x???     : TABLET       : tab   : 35.5em
> 768x1024    : SMALL SCREEN : sm    : 48em
> 1366x768    : COMPUTER     : comp  : 85.375em
> 1920x1080   : HD SCREEN    : hd    : 120em

 ( Based on the browser's default font size,
   so 1em == 16px )


    Base Style
    ¨¨¨¨¨¨¨¨¨¨

*/
#sea-contact>article{
    margin-bottom: 400px;
}
.sea-mail{
    text-decoration: none;
    font-size: 1.7em;
    font-weight: 700;
    color: #ff9f4d;  
}
.sea-mail:hover{
    color: white;
}

.sea-link{
    text-decoration: none;
    font-size: 1em;
    font-weight: 700;
    color: #ff9f4d;  
}
.sea-link:hover{
    color: white;
}

html, button, input, select, textarea,
.sea-g [class *= "sea-u"] {
    /* Set your content font stack here: */
    font-family: lato, sans-serif;
    color: #fff;
    -webkit-font-smoothing: antialiased;/* Fix font looking super bold in Chrome */
}
h2 {
    font-family: Alegreya SC, serif;
    font-size: 2em;
    font-weight: 700;
    line-height: 0.6em;
    color: #fff;
}
hr.gradient {
    border: 0;
    height: 1px;
    background-image: -webkit-linear-gradient(left, rgba(0,0,0,0), rgba(50,50,50,50.40), rgba(0,0,0,0));
    background-image:    -moz-linear-gradient(left, rgba(0,0,0,0), rgba(50,50,50,50.40), rgba(0,0,0,0));
    background-image:     -ms-linear-gradient(left, rgba(0,0,0,0), rgba(50,50,50,50.40), rgba(0,0,0,0));
    background-image:      -o-linear-gradient(left, rgba(0,0,0,0), rgba(50,50,50,50.40), rgba(0,0,0,0));
}
a.anchor {
    display: block;
    position: relative;
    top: -120px;
    visibility: hidden;
}
/*

    Helper classes
    ¨¨¨¨¨¨¨¨¨¨¨¨¨¨

    > Hide on mobile / desktop
*/
@media (min-width:35.5em) {
    .mobile-only {
        display: none !important;
    }
    .desktop-only {
        display: block !important;
    }
    .desktop-only-inline {
        display: inline-block !important;
    }
}
@media (max-width: 35.49em) {
    .mobile-only {
        display:block !important;
    }
    .desktop-only {
        display:none !important;
    }
    .desktop-only-inline {
        display: none !important;
    }
}
/*
    > Move to foreground
*/
.sea-fg {
    position: relative !important;
    z-index: 10 !important;
}
/*
    > Arrows
*/
.sea-up-arrow-gold {
    background: transparent url(/static/img/icon_up_arrow_gold_hd.png) center bottom no-repeat;
    background-position: 50% 1%;
    position: absolute;
    width: 100%;
    height: 2em;
    bottom: 0;
    right: 0;
}
@media (min-width:35.5em) {
    .sea-up-arrow-gold {
        right: -1em;
    }
}
@media (min-width:48em) {
    .sea-up-arrow-gold {
        right: -8em;
    }
}
/*
    > no padding
*/
.sea-no-padding {
    padding: 0 !important;
}
/*

    Text formatting
    ¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨

    > Text format (MOBILE first)
*/
h1 {
    font-family: Alegreya SC, serif;
    font-size: 3em;
    font-weight: 400;
    line-height: 1em;
    margin: 1em 0 0.8em;
    color: #fff;
}
.sea-welcome-title>.sea-supertitle{
    font-family: lato, sans-serif;
    font-size: 0.3em;
    font-weight: 400;
    letter-spacing: 0.1em;
    color: #f1f1f1;
}
h3 {
    margin: 0;
    font-size: 3em;
    font-weight: 700;
    line-height: 0.6em;
    color: #fff;
}
h4 {
    margin: 0;
    font-family: Alegreya SC, serif;
    font-size: 3em;
    font-weight: 700;
    font-style: italic;
    line-height: 0.6em;
    color: #fff;
}
h5 {
    font-size: 1.2em;
}
p {
    font-size: 0.9em;
    line-height: 1.4em;
    font-weight: 400;
    text-align: justify;
}
.sea-list>li {
    font-size: 0.8em;
    margin: 1em 0;
}
small.sea-disclaimer {
    color: black;
    display: block;
    text-align: center;
}
.sea-welcome-title{
    line-height: 0.6em;
    font-size: 3.8em;
    font-weight: 400;
    color: #ff9f4d;
    margin: 0.35em 0 0.3em;
}
.sea-supertitle {
    display: block;
}
.sea-center-text {
    text-align: center;
}
.sea-right-align-text {
    text-align: right;
}
.sea-highlight-text {
    color: #ffb175;
}
.sea-logo-text {
    font-family: Alegreya SC, serif;
    white-space: nowrap;
}
.sea-our-services {
    text-transform: uppercase;
    margin-bottom: 1em;
}
.sea-underscore {
    font-family: Alegreya SC, serif;
    vertical-align: super;
    font-size: 0.5em;
    border-bottom: 1px solid;
    text-transform: uppercase;
    color: #f1f1f1;
}
.sea-service-title {
    text-align: right;
}
.sea-service-title>.sea-supertitle {
    color: #ffb175;
    font-family: lato, sans-serif;
    font-size: 0.55em;
    font-weight: 400;
}
.sea-text-shadow {
    text-shadow: 2px 2px 8px #000 !important;
    filter: glow(color=black, strength=1) !important;
}
.sea-color-dark-green {
    color: #1f5c09;
}
.sea-color-dark-red {
    color: #6e1712;
}
.sea-color-dark-blue {
    color: #174269;
}
.sea-color-dark-gold {
    color: #88552a;
}
.sea-section-box-header>h2{
    font-size: 0.9em;
}
.sea-section-box-header-links{
    font-size: 0.7em;
}
/*
    > Text format
      TABLET
*/
@media (min-width: 35.5em) {
    h1 {

    }
    .sea-welcome-title{
        font-size: 4.4em;
    }
    p {
        font-size: 1.2em;
    }
    .sea-list>li {
        font-size: 0.6em;
    }
    .sea-our-services {
    }
    .sea-service-title {
    }
    .sea-section-box-header>h2{
        font-size: 0.9em;
    }
    .sea-section-box-header-links{
        font-size: 0.6em;
    }
}
/*
    > Text format
      SMALL SCREEN
*/
@media (min-width: 48em) {
    h1 {

    }
    .sea-welcome-title{
        font-size: 6em;
    }
    p {
        font-size: 1em;
    }
    .sea-list>li {
        font-size: 0.9em;
    }
    .sea-section-box-header>h2{
        font-size: 1.2em;
    }
    .sea-section-box-header-links{
        font-size: 0.75em;
    }
}
/*
    > Text format
      COMPUTER
*/
@media (min-width: 85.375em) {
    h1 {

    }
    .sea-welcome-title{
        font-size: 6em;
    }
    p {
        font-size: 1em;
    }
    .sea-list>li {
        font-size: 0.9em;
    }
    .sea-section-box-header>h2{
        font-size: 1.5em;
    }
    .sea-section-box-header-links{
        font-size: 0.8em;
    }
}
/*
    > Text format
      HD SCREEN
*/
@media (min-width: 120em) {
    h1 {
        
    }
    .sea-welcome-title{
        font-size: 8em;
    }
    p {
        font-size: 1.6em;
    }
    .sea-list>li {
        font-size: 1.2em;
    }
    .sea-section-box-header>h2{
        font-size: 1.8em;
    }
    .sea-section-box-header-links{
        font-size: 1em;
    }
}
/*

    Section boxes
    ¨¨¨¨¨¨¨¨¨¨¨¨¨

    > Section box styling (MOBILE FIRST)
*/
.sea-section-box-header {
    background-color: #ff9f4d;
    border-bottom: 6px solid black;
    display: block;
}
.sea-section-box-body {
    background-color: #e6e6e6;
    display: block;
    padding: 0.5em 1em;
    margin: 0;
}
.sea-section-box-splash{
    padding: 0.6em;
}
.sea-section-box-darken>h3,
.sea-section-box-darken>div>h3{
    font-family: Alegreya SC, serif;
    font-size: 2em;
    font-weight: 400;
    line-height: 0.8em;
}
.sea-section-box-body>h3{
    font-size: 2em;
    font-weight: 700;
    font-style: italic;
    font-family: Alegreya SC, serif;
    margin: 0;
    padding: 0.5em 0 0.5em;
}
.sea-section-box-header>h2{
    font-family: lato, sans-serif;
    text-transform: uppercase;
    padding: 0.5em 1em;
    margin: 0;
}
.sea-section-box-header-links{
    color: #FFD2AC;
    float: right;
    padding: 0.5em 1em;
}
.sea-section-box-header-links>a{
    text-decoration: none;
    font-size: 1em;
    font-weight: 700;
    color: #FFE4C1;
    text-transform: uppercase;
}
.sea-section-box-darken {
    background: transparent url(../img/bg_section_darken.png) repeat fixed top left;
    -webkit-box-shadow: 0px 0px 23px 5px rgba(0, 0, 0, 0.65);
    -moz-box-shadow:    0px 0px 23px 5px rgba(0, 0, 0, 0.65);
    box-shadow:         0px 0px 23px 5px rgba(0, 0, 0, 0.65);
    padding: 0.8em;
}
.sea-section-splash-text-no-padding,
.sea-section-splash-text {
    font-size: 0.8em;
    text-align: left;
}
.sea-section-box-white {
    background-color: #e6e6e6;
    color: #2a2a2a;
}
.sea-section-box-white>h3{
    color: #2a2a2a;
}
.sea-section-box-light-gray {
    background-color: #d9d9d9;
    color: #2a2a2a;
}
.sea-section-box-light-gray>h3{
    color: #2a2a2a;
}
.sea-section-box-light-gray>li>.sea-highlight-text,
.sea-section-box-light-gray>p>.sea-highlight-text,
.sea-section-box-white>li>.sea-highlight-text,
.sea-section-box-white>p>.sea-highlight-text {
    color: #684d36;
}
.sea-section-box-gold {
    background: #ff9f4d url(../img/bg_tile_gold.png) repeat fixed top left;
    color: #402f21;
}
.sea-section-box-gold>h3{
    color: #402f21;
}
.sea-section-box-gold>li>.sea-highlight-text,
.sea-section-box-gold>p>.sea-highlight-text {
    color: black;
}
.sea-section-box-gray {
    background-color: #bababa;
    color: black;
}
.sea-section-box-gray>li>.sea-highlight-text,
.sea-section-box-gray>p>.sea-highlight-text {
    color: #684d36;
}
.sea-section-box-dark-gray {
    background-color: rgba(0, 0, 0, 0.25);
    color: #e6e6e6;
}
.sea-section-box-dark-gray>li>.sea-highlight-text,
.sea-section-box-dark-gray>p>.sea-highlight-text {
    color: #684d36;
}
/*
    > Section boxes
      TABLET
*/
@media (min-width: 35.5em) {
    .sea-section-splash-text {
        padding-right: 25%;
    }
    .sea-section-splash-text-no-padding,
    .sea-section-splash-text {
        font-size: 1.4em;
    }
    .sea-section-box-darken>h3,
    .sea-section-box-darken>div>h3 {
          font-size: 4em;
    }
}
/*
    > Section: Coffee
*/
.sea-section-coffee-cup{
    background: transparent url(/static/img/bg_coffee_cup_hd.jpg) top right no-repeat;
    -webkit-background-size: cover; /* For WebKit*/
    -moz-background-size: cover;    /* Mozilla*/
    -o-background-size: cover;      /* Opera*/
    background-size: cover;         /* Generic*/
}
.sea-section-coffee-leaf{
    background: transparent url(/static/img/bg_coffee_leaf_hd.jpg) top right no-repeat;
    -webkit-background-size: cover; /* For WebKit*/
    -moz-background-size: cover;    /* Mozilla*/
    -o-background-size: cover;      /* Opera*/
    background-size: cover;         /* Generic*/
}
/*
    > Section: Tea
*/
.sea-section-tea-cup{
    background: transparent url(/static/img/bg_tea_cup_hd.jpg) top right no-repeat;
    -webkit-background-size: cover; /* For WebKit*/
    -moz-background-size: cover;    /* Mozilla*/
    -o-background-size: cover;      /* Opera*/
    background-size: cover;         /* Generic*/
}
/*
    > Section: Flowers
*/
.sea-section-flowers-eco-friendly{
    background: transparent url(/static/img/bg_flowers_eco_friendly_hd.jpg) top right no-repeat;
    -webkit-background-size: cover; /* For WebKit*/
    -moz-background-size: cover;    /* Mozilla*/
    -o-background-size: cover;      /* Opera*/
    background-size: cover;         /* Generic*/
}
.sea-section-flowers-field {
    position: relative;
    background: transparent url(/static/img/bg_flowers_field_hd.jpg) top right no-repeat;
    -webkit-background-size: cover; /* For WebKit*/
    -moz-background-size: cover;    /* Mozilla*/
    -o-background-size: cover;      /* Opera*/
    background-size: cover;         /* Generic*/
}
.sea-icon-flowers-pie-chart{
    position: relative;
    margin: 0 auto;
    bottom: 0;
}
@media (min-width: 48em) {
    .sea-icon-flowers-pie-chart{
        bottom: -45px;
    }
}
@media (min-width: 60em) {
    .sea-icon-flowers-pie-chart{
        bottom: 0;
    }
}
#sea-flowers-table-stats{
    font-weight: 900;
    color: black;
    font-size: 1.6em;
    width: 100%;
    margin-top: 1em;
}
#sea-flowers-table-stats td {
    width: 50%;
}
#sea-flowers-table-stats .sea-flowers-table-stats-percentage {
    width: 50%;
    padding-left: 25%;
}
@media (min-width: 48em) {
    #sea-flowers-table-stats td {
        width: 75%;
    }
    #sea-flowers-table-stats .sea-flowers-table-stats-percentage {
        width: 25%;
        padding-left: 0;
    }
}
.sea-section-links-hands {
    background: transparent url(/static/img/bg_links_hands_hd.jpg) center center no-repeat;
    -webkit-background-size: cover; /* For WebKit*/
    -moz-background-size: cover;    /* Mozilla*/
    -o-background-size: cover;      /* Opera*/
    background-size: cover;         /* Generic*/
}
/*
    > Section box spacing (MOBILE FIRST)
*/
.sea-section-box{
    margin: 20px 0 0;
}
/*
    > Section box spacing
      MID
*/
@media (min-height: 480px) and (min-width: 35.5em) {
    .sea-section-box{
        margin-top: 240px;
    }
}
/*
    > Section box spacing
      NORMAL
*/
@media (min-height: 720px) {
    .sea-section-box{
        margin-top: 360px;
    }
}
/*
    > Section box spacing
      BIG
*/
@media (min-height: 900px) {
    .sea-section-box{
        margin-top: 450px;
    }
}
/*

    Home
    ¨¨¨¨

    > Separator
*/
.sea-home-nav-wrapper {
    background: transparent;
}
@media (min-width: 35.5em) {
    .sea-home-nav-wrapper {
        background: transparent url(/static/img/sep_sm.png) center center no-repeat;
        background-position: 50% 80%;
    }
}
@media (min-width: 120em) {
    .sea-home-nav-wrapper {
        background-image: url(/static/img/sep.png);
    }
}
    
/*
    > Home Buttons (MOBILE first)
*/
.sea-button-nav {
    font-size: 1em;
    font-weight: 700;
    width: 120px;
    border-radius: 6px;
    white-space: normal;
    background-color: #684d36;
    color: #fff;
    line-height: 1.2em;
    margin: 50px auto 0;
}
.sea-button-nav:before {
    content: "";
}
.sea-commodity-icon, .sea-links-icon {
    margin-top: -20px;
    display: block;
}
.sea-commodity-icon {
    background: transparent url(/static/img/btn_comm_hd.png) center top no-repeat;
    -webkit-background-size: 120px 72px; /* For WebKit*/
    -moz-background-size: 120px 72px;    /* Mozilla*/
    -o-background-size: 120px 72px;      /* Opera*/
    background-size: 120px 72px;         /* Generic*/
}
.sea-links-icon {
    background: transparent url(/static/img/btn_links_hd.png) center top no-repeat;
    -webkit-background-size: 120px 72px; /* For WebKit*/
    -moz-background-size: 120px 72px;    /* Mozilla*/
    -o-background-size: 120px 72px;      /* Opera*/
    background-size: 120px 72px;         /* Generic*/
}
.sea-commodity-icon:hover {
    background-image: url(/static/img/btn_comm_hd_active.png);
}
.sea-links-icon:hover {
    background-image: url(/static/img/btn_links_hd_active.png);
}
/*
    > Home Buttons
      TABLET
*/
@media (min-width: 35.5em) {
    .sea-button-nav {
        font-size: 1.2em;
        width: 7em;
        margin-top: 90px;
    }
    .sea-commodity-icon,
    .sea-links-icon {
        background-position: 50% 55%;
        -webkit-background-size: 150px 90px; /* For WebKit*/
        -moz-background-size: 150px 90px;    /* Mozilla*/
        -o-background-size: 150px 90px;      /* Opera*/
        background-size: 150px 90px;         /* Generic*/
    }
    .sea-commodity-icon, .sea-links-icon {
        margin-top: 0;
    }
    .sea-commodity-icon {
        margin-right: 65px;
    }
    .sea-links-icon {
        margin-left: 65px;
    }
}
/*
    > Home Buttons
      SMALL SCREEN
*/
@media (min-width: 48em) {
    .sea-button-nav {
        font-size: 1.4em;
        width: 8em;
        margin-top: 120px;
    }
    .sea-commodity-icon,
    .sea-links-icon {
        background-position: 50% 50%;
        -webkit-background-size: 200px 120px; /* For WebKit*/
        -moz-background-size: 200px 120px;    /* Mozilla*/
        -o-background-size: 200px 120px;      /* Opera*/
        background-size: 200px 120px;         /* Generic*/
    }
    .sea-commodity-icon {
        margin-right: 65px;
    }
    .sea-links-icon {
        margin-left: 65px;
    }
}
/*
    > Home Buttons
      COMPUTER
*/
@media (min-width: 85.375em) {
    .sea-button-nav {
        font-size: 1.2em;
        width: 11em;
        margin-top: 132px;
    }
    .sea-commodity-icon,
    .sea-links-icon {
        background-position: 50% 62%;
        -webkit-background-size: 220px 132px; /* For WebKit*/
        -moz-background-size: 220px 132px;    /* Mozilla*/
        -o-background-size: 220px 132px;      /* Opera*/
        background-size: 220px 132px;         /* Generic*/
    }
    .sea-commodity-icon {
        margin-right: 85px;
    }
    .sea-links-icon {
        margin-left: 85px;
    }
    
}
/*
    > Home Buttons
      HD SCREEN
*/
@media (min-width: 120em) {
    .sea-button-nav {
        font-size: 1.6em;
        width: 12em;
        margin-top: 150px;
    }
    .sea-commodity-icon,
    .sea-links-icon {
        background-position: 50% 55%;
        -webkit-background-size: 250px 150px; /* For WebKit*/
        -moz-background-size: 250px 150px;    /* Mozilla*/
        -o-background-size: 250px 150px;      /* Opera*/
        background-size: 250px 150px;         /* Generic*/
    }
    .sea-commodity-icon {
        margin-right: 65px;
    }
    .sea-links-icon {
        margin-left: 65px;
    }
}
/*

    Commodity Trading
    ¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨

    > Comm Nav Links (MOBILE first)
*/
.sea-comm-nav-wrapper{
    margin-top: 2em;
}
.sea-comm-link {
    font-size: 0.5em;
    font-family: Alegreya SC, serif;
    text-decoration: none;
    display: block;
    height: 90px;
}
.sea-comm-link>h3{
    font-weight: 400;
}
.sea-link-coffee{
    background: transparent url(/static/img/icon_coffee_hd.png) center bottom no-repeat;
    -webkit-background-size: 70px 70px; /* For WebKit*/
    -moz-background-size: 70px 70px;    /* Mozilla*/
    -o-background-size: 70px 70px;      /* Opera*/
    background-size: 70px 70px;         /* Generic*/
}
.sea-link-coffee:hover{
    background-image: url(/static/img/icon_coffee_hd_active.png)
}
.sea-link-tea{
    background: transparent url(/static/img/icon_tea_hd.png) center bottom no-repeat;
    -webkit-background-size: 70px 70px; /* For WebKit*/
    -moz-background-size: 70px 70px;    /* Mozilla*/
    -o-background-size: 70px 70px;      /* Opera*/
    background-size: 70px 70px;         /* Generic*/
}
.sea-link-tea:hover{
    background-image: url(/static/img/icon_tea_hd_active.png)
}
.sea-link-flowers{
    background: transparent url(/static/img/icon_flowers_hd.png) center bottom no-repeat;
    -webkit-background-size: 70px 70px; /* For WebKit*/
    -moz-background-size: 70px 70px;    /* Mozilla*/
    -o-background-size: 70px 70px;      /* Opera*/
    background-size: 70px 70px;         /* Generic*/
}
.sea-link-flowers:hover{
    background-image: url(/static/img/icon_flowers_hd_active.png)
}
/*
    > Comm nav links
      TABLET
*/
@media (min-width: 35.5em) {
    .sea-comm-nav-wrapper{
        margin-top: 4em;
    }
    .sea-comm-link {
        font-size: 0.6em;
        height: 135px;
    }
    .sea-link-coffee,
    .sea-link-tea,
    .sea-link-flowers{
        -webkit-background-size: 110px 110px; /* For WebKit*/
        -moz-background-size: 110px 110px;    /* Mozilla*/
        -o-background-size: 110px 110px;      /* Opera*/
        background-size: 110px 110px;         /* Generic*/
    }
}
/*
    > Comm nav links
      SMALL SCREEN
*/
@media (min-width: 48em) {
}
/*
    > Comm nav links
      COMPUTER
*/
@media (min-width: 85.375em) {
    .sea-comm-nav-wrapper{
        margin-top: 6em;
    }
    .sea-comm-link {
        font-size: 0.8em;
        height: 200px;
    }
    .sea-link-coffee,
    .sea-link-tea,
    .sea-link-flowers{
        -webkit-background-size: 150px 150px; /* For WebKit*/
        -moz-background-size: 150px 150px;    /* Mozilla*/
        -o-background-size: 150px 150px;      /* Opera*/
        background-size: 150px 150px;         /* Generic*/
    }
}
/*
    > Comm nav links
      HD SCREEN
*/
@media (min-width: 120em) {
    .sea-comm-link {
        font-size: 0.9em;
        height: 230px;
    }
    .sea-link-coffee,
    .sea-link-tea,
    .sea-link-flowers{
        -webkit-background-size: 188px 188px; /* For WebKit*/
        -moz-background-size: 188px 188px;    /* Mozilla*/
        -o-background-size: 188px 188px;      /* Opera*/
        background-size: 188px 188px;         /* Generic*/
    }
}
/*

    Tea
    ¨¨¨

    > Tea type icons (MOBILE first)
*/
.sea-icon-tea-type {
    position: relative;
    z-index: 0;
    padding: 25%;
    margin-top: -3.5em;
    background: transparent;
}
@media (min-width: 35.5em) {
    .sea-icon-tea-type {
        margin: 0;
        padding: 10% 5% 10% 20%;
    }
}
/*

    Background images
    ¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨

    > Base settings (MOBILE first)
*/
img.ruler {
    width: 100%;
}
.sea-mobile-bg{
    position: static !important;
    z-index: -1;
    top: 0;
    left: 0;
    width: 100%;
    height: 125%; /* To compensate for mobile browser address bar space */
    background: url(/static/img/seacorp_bg.jpg) no-repeat; 
    background-size: 100% 100%;
}
.sea-desktop-bg{
    -webkit-background-size: cover !important;/* For WebKit*/
    -moz-background-size: cover !important;   /* Mozilla*/
    -o-background-size: cover !important;     /* Opera*/
    background-size: cover !important;        /* Generic*/
}
.sea-standard-page{
    background: #000 url(/static/img/seacorp_bg.jpg) no-repeat top center fixed;
}
.sea-contact-page{
    background: #000 url(/static/img/contact_bg.jpg) no-repeat top center fixed;
}
/*
    > BG Image
      TABLET
*/
@media (min-width: 35.5em) and (orientation: landscape){
    .sea-standard-page{
        background-image: url(/static/img/seacorp_bg_tab.jpg);
    }
    .sea-contact-page{
        background-image: url(/static/img/contact_bg_tab.jpg);
    }
}
/*
    > BG Image
      SMALL SCREEN
*/
@media (min-width: 48em) {
    
    .sea-standard-page{
        background-image: url(/static/img/seacorp_bg_sm.jpg);
    }
    .sea-contact-page{
        background-image: url(/static/img/contact_bg_sm.jpg);
    }
}
/*
    > BG Image Tweener
      1080px
*/
@media (min-width: 67.5em) {
    
    .sea-standard-page{
        background-image: url(/static/img/seacorp_bg_comp.jpg);
    }
    .sea-contact-page{
        background-image: url(/static/img/contact_bg_comp.jpg);
    }
}
/*
    > BG Image
      COMPUTER
*/
@media (min-width: 85.375em) {
    
    .sea-standard-page{
        background-image: url(/static/img/seacorp_bg_comp.jpg);
    }
    .sea-contact-page{
        background-image: url(/static/img/contact_bg_comp.jpg);
    }
}
/*

    Page content padding
    ¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨

    > Base settings (MOBILE first)
*/
.sea-content {
    box-sizing: border-box;
    padding: 0 24px 0;
    position: relative;
    margin-top: 0;
}
/*
    > Content padding
      TABLET
*/
@media (min-width: 35.5em) {
    .sea-content {
        padding: 70px 12% 0;
    }
}
/*
    > Content padding
      SMALL SCREEN
*/
@media (min-width: 48em) {
    .sea-content {
        padding: 70px 20% 0;
    }
}
/*
    > Content padding Tweener
      1080px
*/
@media (min-width: 67.5em) {
    .sea-content {
        padding: 70px 24% 0;
    }
}
/*
    > Content padding
      COMPUTER
*/
@media (min-width: 85.375em) {
    .sea-content {
        padding: 70px 28% 0;
    }
}
/*
    > Content padding
      HD SCREEN
*/
@media (min-width: 120em) {
    .sea-content {
        padding: 90px 31% 0;
    }
}
/*

    Footer
    ¨¨¨¨¨¨

    > Footer base (MOBILE FIRST)
*/
.sea-footer {
        width: 100%;
        height: 6em;
        margin: 8em auto 0;
        padding: 0;
        text-align: right;
}
.sea-copyright{
    padding-right: 2em;
    color: #4f4f4f;
}
/*

    Navigation bar
    ¨¨¨¨¨¨¨¨¨¨¨¨¨¨¨

    > Containers need transitions so they can push in and out all nice.
*/
#sea-main,
#sea-nav-bar,
.sea-nav-button {
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    -ms-transition: all 0.2s ease-out;
    -o-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
}
/*
    > The active state makes the nav bar slide into place.
*/
#sea-main.active #sea-nav-bar {
    left: 231px;            /* Equal to nav bar width in side mode */
    width: 231px;           /* Equal to nav bar width in side mode */
}
#sea-main.active .sea-nav-button {
    left: 231px;            /* Equal to nav bar width in side mode */
}
/*
    > Styling the nav bar items
*/
div.sea-menu{
    
}
#sea-nav-bar a {
    text-decoration: none;
}
#sea-nav-bar ul {
    list-style-type: none;
    list-style-image: none;
}
.sea-menu-children {
    background-color: transparent;
}
/*
    > The nav bar toggle button
*/
.sea-nav-button {
    position: fixed;
    display: block;                 /* shows this only on small screens */
    background: transparent url(../img/nav_bar_bg_transparent.png) repeat fixed top left;
    font-size: 10px;                /* button size */
    top: 50px;
    z-index: 50;
    width: 43px;
    height: 43px;
    padding: 4px;
    margin-top: -50px;
    content: url(../img/nav_bar_logo_button.png);
}
.sea-nav-button:hover,
.sea-nav-button:focus {
    background: #555;
}
.sea-menu-children,
.sea-menu-item,
.sea-menu-link
 {
    z-index: 50;
}
/*
    > The nav bar container as a side bar
      (On lower res screens)
*/
#sea-nav-bar {
    margin-left: -231px;             /* Equal to nav bar width in side mode */
    width: 231px;                    /* Equal to nav bar width in side mode */
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    z-index: 99;
    background: #555 url(../img/nav_bar_bg.png) repeat fixed top left;
    overflow hidden;
    font-size: 1.1em;
    -webkit-overflow-scrolling: touch;
}
.sea-menu-list {
    width: 231px;
    margin-top: 10px;
}
.sea-menu-item a {
    padding: 16px 0 16px 32px;
    color: #bbb;
}
.sea-sub-menu-item a {
    margin-left: 32px;
    padding: 10px 0 10px 16px;
    color: #bbb;
    font-size: 1em;
    text-transform: uppercase;
    border: none;
    border-left: 3px solid #ff9f4d;
}
.sea-sub-menu-item a:hover,
.sea-sub-menu-item a:active,
.sea-menu-item a:hover,
.sea-menu-item a:active {
    background-color: #111;
}
.sea-menu-has-children>.sea-menu-link:after {
    content: "" !important;         /* Removes dropdown down arrow icon */
}
.sea-menu-has-children>.sea-menu-link {
    pointer-events: none;           /* Disables dropdown link */
    cursor: default;
    padding: 0 0 0 6px;
    color: #999;
}
.sea-menu-has-children>.sea-menu-link:hover {
    background-color: transparent;  /* No dropdown hover */
}
#sea-nav-link-links,
#sea-nav-link-comm {
    color: #ff9f4d;
}
/*
    > Making the Nav Bar responsive
      MOBILE
*/
@media (max-width: 35.5em) {
    #sea-main.active {
        position: relative;
        left: 231px;                 /* Equal to nav bar width in side mode */
    }
    #sea-nav-bar li {
        display: list-item;
    }
    .sea-menu-children {
        display: block;
        position: relative;
    }
    #sea-dropdown-services {
        text-align: right;
        font-size: 0.8rem;
        border: none;
        border-bottom: 1px solid #444;
    }
    .sea-menu-children{
        background-color: #444;
        border: none;
        border-bottom: 1px solid #444;
    }
}
/*
    > Making the Nav Bar responsive
      TABLET
*/
@media (min-width: 35.5em) {
    #sea-main.active .sea-nav-button {
        left: 231px;                /* Equal to nav bar width in side mode */
    }
    .sea-nav-button {
        position: fixed;
        display: none;              /* Hides button */
    }
    #sea-nav-bar {
        left: 231px;                /* Equal to nav bar width in side mode */
        width: 100%;
        height: 75px;
        font-size: 1em;
        -webkit-box-shadow: 0px -31px 10px 39px rgba(85,85,85,1);
        -moz-box-shadow: 0px -31px 10px 39px rgba(85,85,85,1);
        box-shadow: 0px -31px 10px 39px rgba(85,85,85,1);
    }
    #sea-nav-bar div:before {
        content: url(../img/nav_bar_logo_tab.png);
        display: block;
        position: relative;
        width: 40px;                /* Logo image width */
        height: 60px;               /* Logo image height */
        margin-top: 10px;
        padding-left: 20px;
    }
    .sea-menu-list {
        position: relative;
        left: -100px;
        top: -60px;
        margin-left: auto;
        margin-right: auto;
        margin-top: 20px;
        width: 300px;
        display: block !important;
    }
	.sea-menu-item li {
        display: inline-block;                   /* Puts items on a single line */
	}
    .sea-sub-menu-header,
	.sea-sub-menu-item{
        display: list-item !important;           /* Puts the sub menu items in list form */
	}
    .sea-menu-has-children>.sea-menu-link:after {
        font-family: sans-serif;
        content: "\25be" !important;               /* Down arrow icon */
    }
    .sea-menu-has-children>.sea-menu-link {
        pointer-events: auto;                    /* Re-enables dropdown link */
        cursor: auto;
    }
    .sea-menu-has-children>.sea-menu-link:hover {
        background-color: transparent;           /* Re-activates dropdown hover effect */
    }
    .sea-menu-item a,
    #sea-dropdown-services {
        padding: 6px 0.2rem 3px 0.2rem;
        margin: 0 1.7em;
    }
    #sea-dropdown-services {
        color: #bbb;
    }
    .sea-sub-menu-item a {
        margin: 0 0 0 16px;
        padding: 16px 16px 16px 32px;
        font-size: 0.8em;
    }
    .sea-menu-children {
        margin: 0;
        background-color: #444;
        padding: 20px 0;
        -webkit-box-shadow: inset 0px 35px 14px -21px rgba(85,85,85,1);
        -moz-box-shadow: inset 0px 35px 14px -21px rgba(85,85,85,1);
        box-shadow: inset 0px 35px 14px -21px rgba(85,85,85,1);
    }
    .sea-menu-item>a{
        background-color: transparent;
        border: none;
        border-bottom: 3px solid #555;
    }
    .sea-menu-active>.sea-menu-link,
    .sea-menu-item>a:active,
    .sea-menu-item>a:hover {
        background-color: transparent;
        border: none;
        border-bottom: 3px solid #444;
    }
    .sea-sub-menu-header>a {
        margin: 0;
        padding: 16px;
        font-size: 0.9em;
    }
}
/*
    > Making the Nav Bar responsive
      SMALL SCREEN
*/
@media (min-width: 48em) {
    #sea-nav-bar {
        font-size: 1.1em;
    }
    .sea-menu-list {
        width: 320px;
    }
}
/*
    > Making the Nav Bar responsive
      Shrinks logo at 1080px.
*/
@media (min-width: 67.5em) {
    #sea-nav-bar div:before {
        content: url(../img/nav_bar_logo_comp.png);
        width: 225px;
    }
}
/*
    > Making the Nav Bar responsive
      COMPUTER
*/
@media (min-width: 85.375em) {
    #sea-nav-bar {
        font-size: 1.2em;
    }
    .sea-menu-list {
        width: 350px;
    }
}
/*
    > Making the Nav Bar responsive
      HD COMPUTER
*/
@media (min-width: 120em) {
    #sea-nav-bar {
        font-size: 1.4em;
    }
    #sea-nav-bar {
        height: 95px;
    }
    #sea-nav-bar div:before {
        content: url(../img/nav_bar_logo_hd.png);
        width: 250px;
        height: 70px;
    }
    .sea-menu-list {
        margin-top: 30px;           /* Move the menu items down a bit */
        width: 450px;
    }
}
/*
    > Photo Gallery
*/
.photo-box, .text-box {
    overflow: hidden;
    position: relative;
    height: 150px;
    text-align: center;
}

.photo-box-thin {
    height: 120px;
}


    .photo-box img {
        max-width: 100%;
        height: auto;
        min-height: 150px;
    }

    .photo-box aside {
        position: absolute;
        bottom: 0;
        right: 0;
        padding: 1em 0.5em;
        color: white;
        width: 100%;
        font-size: 80%;
        text-align: right;
        background: -moz-linear-gradient(top,  rgba(16,27,30,0) 0%, rgba(12,2,2,1) 90%); /* FF3.6+ */
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(16,27,30,0)), color-stop(90%,rgba(12,2,2,1))); /* Chrome,Safari4+ */
        background: -webkit-linear-gradient(top,  rgba(16,27,30,0) 0%,rgba(12,2,2,1) 90%); /* Chrome10+,Safari5.1+ */
        background: -o-linear-gradient(top,  rgba(16,27,30,0) 0%,rgba(12,2,2,1) 90%); /* Opera 11.10+ */
        background: -ms-linear-gradient(top,  rgba(16,27,30,0) 0%,rgba(12,2,2,1) 90%); /* IE10+ */
        background: linear-gradient(to bottom,  rgba(16,27,30,0) 0%,rgba(12,2,2,1) 90%); /* W3C */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00101b1e', endColorstr='#0c0202',GradientType=0 ); /* IE6-9 */

    }

    .photo-box aside span {
        color: #aaa;
    }

        .photo-box aside span a {
            color: #ccc;
            text-decoration: none;
        }

.text-box {
    background: rgb(49, 49, 49); /* bluish grey */
    color: rgb(255, 190, 94); /* steel blue */
}

    .text-box-head {
        color: #fff;
        padding-bottom: 0.2em;
        font-weight: 400;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        font-size: 24px;
    }

    .text-box-subhead {
        font-weight: normal;
        letter-spacing: 0.1em;
        text-transform: uppercase;
    }


@media (min-width: 30em) {
    .photo-box, .text-box {
        text-align: left;
    }

    .photo-box-thin {
        height: 250px;
    }
}