﻿/*html, body*/
html, body { height: 100%; overflow: hidden; }
body { font-family: "Gotham SSm A", "Gotham SSm B", sans-serif; color: #11393f; display: flex; display: -webkit-flex; flex-direction: column; -webkit-flex-direction: column; }
@supports not (-webkit-touch-callout: none) {
    #headers { transition: margin-top .5s; }
}
#after-header { position: relative; overflow: hidden; flex: 1; -webkit-flex: 1; display: flex; display: -webkit-flex; flex-direction: column; -webkit-flex-direction: column; }
#content-footer { overflow: auto; outline: none; width: 100%; -webkit-overflow-scrolling: touch; }
body.hide-nav > #headers { display: none; margin-top: 0 !important; }
/*margins*/
.m-t-20 { margin-top: 20px; }
.m-b-50 { margin-bottom: 50px; }
.m-b-20 { margin-bottom: 20px; }
/*elements & classes*/
.btn { background: #ddd; /*for iPhone*/ }
.btn-g { border: none; border-radius: 5px; height: 55px; color: white; text-transform: uppercase; padding: 16px 30px; font-size: 18px; display: inline-block; text-align: center; font-weight: bold; }
    .btn-g:hover { text-decoration: none; color: white; opacity: .8; }
    .btn-g:focus { color: white; }
    .btn-g.smaller { height: 48px; }
.a { text-transform: uppercase; font-size: 14px; cursor: pointer; font-weight: 500; }
    .a:hover { text-decoration: none; }
a > i { vertical-align: -2px; }
a:focus { text-decoration: none; }
a[onclick] { cursor: pointer; }
.plain { color: inherit; text-decoration: none !important; }
    .plain:hover { color: inherit; }
.justify-stretch { display: inline-block; width: 100%; }
ul > li > a:hover { cursor: pointer; text-decoration: none; }
.larger { font-size: 1.35em; }
.smaller { font-size: .75em; }
.hand { cursor: pointer; }
select.ng-empty { color: #949494; }
#breadcrumbs { margin: 60px 0 30px; }
.dis-none { display: none; }
.overlay { position: absolute; width: 100%; height: 100%; opacity: .8; }
.overlay-content { position: relative; }
.bg-cover { background-position: center; background-size: cover; }
.scale2 { -ms-transform: scale(2); /* IE */ -moz-transform: scale(2); /* FF */ -webkit-transform: scale(2); /* Safari and Chrome */ -o-transform: scale(2); /* Opera */ transform: scale(2); }
.ui-widget { z-index: 100 !important; outline: none; }
.weight-normal { font-weight: normal; }
.no-padding { padding: 0; }
.hover-fade:hover { opacity: .8; }
/*tooltips*/
.css-tooltip { position: relative; display: inline-block; border-bottom: 1px dotted black; cursor: pointer; }
    .css-tooltip .tooltiptext { visibility: hidden; width: 180px; color: #fff; position: absolute; z-index: 1; }
        .css-tooltip .tooltiptext > span { background-color: black; display: block; padding: 5px; border-radius: 6px; text-align: justify; position: relative; }
            .css-tooltip .tooltiptext > span::after { content: " "; position: absolute; border-width: 5px; border-style: solid; }
    .css-tooltip:hover .tooltiptext { visibility: visible; }
    .css-tooltip.right .tooltiptext { top: -5px; left: 100%; padding-left: 10px; }
        .css-tooltip.right .tooltiptext > span::after { top: 0; right: 100%; margin-top: 12px; border-color: transparent black transparent transparent; }
    .css-tooltip.below .tooltiptext { left: -5px; top: 100%; padding-top: 10px; }
        .css-tooltip.below .tooltiptext > span::after { top: 0; left: 50%; margin-left: -5px; margin-top: -10px; border-color: transparent transparent black transparent; }
.helper-text.has-icon { vertical-align: middle; }
    .helper-text.has-icon:before { content: ''; background: url(/res/img/infoicon.jpg); display: inline-block; width: 20px; height: 20px; background-size: contain; }
.helper-text.no-icon { border-bottom: dashed 1px #777; }
.ui-tooltip { background: black; border: 2px solid white; padding: 10px 20px; color: white; border-radius: 20px; font: bold 14px "Helvetica Neue", Sans-Serif; text-transform: uppercase; box-shadow: 0 0 7px black; }
/*colors*/
.bk-o { background-color: #F05622; }
.cl-o, .cl-o:hover, .cl-o-hover:hover { color: #F05622; }
.bk-ba1 { background-color: #11393f; }
.cl-ba1 { color: #11393f; }
.bk-ba2 { background-color: #0f3940; }
.bk-ba3 { background-color: #0a3237; }
.bk-ba4 { background-color: #062B31; }
.cl-ba4, .cl-ba4:hover { color: #062B31; }
.bk-bl { background-color: #4EC6DF; }
.cl-bl, .cl-bl:hover { color: #4EC6DF; }
.a.cl-bl:hover, .a:hover { color: #062B31; }
.bk-g1 { background-color: #C0C0C0; }
.cl-g1, .cl-g1:hover { color: #C0C0C0; }
.cl-g2, .cl-g2:hover { color: #818285; }
.bk-g3 { background-color: #F5F5F5; }
.cl-g3, .cl-g3:hover { color: #F5F5F5; }
.cl-w { color: white; }
.cl-b { color: black; }
/*headings*/
h1 { font: bold 80px "Gotham A", "Gotham B", sans-serif; text-transform: uppercase; }
h2 { font: bold 3.2em "Gotham A", "Gotham B", sans-serif; text-transform: uppercase; }
h3 { font-size: 30px; font-weight: bold; }
h4 { font-size: 24px; }
h1, h2, h3, h4 { color: #062B31; }
/*dialog*/
.dialog { display: none; position: fixed; width: 100%; height: 100%; top: 0; left: 0; z-index: 200; }
    .dialog > .overlay { background: #4ec6df; }
    .dialog > .content-wrap { overflow: auto; position: relative; height: 100%; }
        .dialog > .content-wrap > .content { margin: 0 auto 10px; top: 15%; position: relative; max-width: 560px; width: 90%; background: white; padding: 5px; }
            .dialog > .content-wrap > .content > iframe { width: 100%; }
/*bootstrap overrides*/
.form-control { height: 40px; padding: 6px 10px; max-width: 100%; }
    .form-control:focus { border-color: #ccc; -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 6px #eee; box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 6px #eee; }
.form-control-feedback { display: none; }
.has-feedback .form-control-feedback { display: block; top: 4px !important; right: 2px !important; }
.has-success .form-control { border-color: #4EC6DF; }
.has-success .form-control-feedback { color: #4EC6DF; }
.has-success .form-control:focus { border-color: #4EC6DF; -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 6px #55d8f2; box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 6px #55d8f2; }
.has-error .form-control, .form-control.has-error { border-color: #F05622; }
.has-error .form-control-feedback { color: #F05622; }
.has-error .form-control:focus { border-color: #F05622; -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 6px #fa5923; box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 6px #fa5923; }
/*videos - from http://alistapart.com/article/creating-intrinsic-ratios-for-video*/
.youtube-wrap { position: relative; padding-bottom: 56.25%; padding-top: 25px; height: 0; }
    .youtube-wrap > iframe, .dc-frame-w > iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.dc-frame-w { position: relative; padding-bottom: 70%; height: 0; }
/*nav top*/
#header-main.hide { display: none; }
#nav-top { background: #f5f5f5; margin: 0; width: 100%; display: flex; display: -webkit-flex; }
    #nav-top > .menu-wrap { height: 100%; flex: 16; -webkit-flex: 16; }
    #nav-top > .login-user { background: #11393f; color: white; height: 100%; text-align: center; padding-right: 0; padding-left: 0; z-index: 100; }
        #nav-top > .login-user > a { height: 100%; display: block; }
        #nav-top > .login-user:hover { background: #2d474a; color: #dcdcdc; }
        #nav-top > .login-user > a > .glyphicon { font-size: larger; vertical-align: middle; }
        #nav-top > .login-user > a > .text { vertical-align: middle; }
#nav-top-table { width: 100%; height: 100%; }
    #nav-top-table > tbody > tr > td { text-align: center; border-right: solid 1px #eaeaea; }
        #nav-top-table > tbody > tr > td:last-child { border-right: none; }
        #nav-top-table > tbody > tr > td > a { color: #11393f; height: 100%; text-decoration: none; font-size: 0.8em; }
            #nav-top-table > tbody > tr > td > a:hover, #nav-top-table > tbody > tr > td > a:active { color: #F05622; }
        #nav-top-table > tbody > tr > td > .to-english { color: #4dc7df; }
#global-search-link { width: 64px; color: #fff; position: relative; }
    #global-search-link > .box { width: 350px; display: flex; display: -webkit-flex; background: #3f5f63; height: 64px; transition: transform .5s; }
        #global-search-link > .box > i { padding: 22px 24px; vertical-align: middle; display: block; width: 64px; }
        #global-search-link > .box > input { width: 180px; background: transparent; border: none; flex: 1; -webkit-flex: 1; outline: none; }
        #global-search-link > .box > button { background: transparent; border: none; display: block; padding-right: 20px; outline: none; }
    #global-search-link.open > .box { transform: translate3d(-286px, 0, 0); }
#nav-top > .login-user { flex: 3; -webkit-flex: 3; }
/*  social icons*/
.social-icons > a { text-decoration: none; color: #11393f; display: inline-block; }
    .social-icons > a:hover { color: #F05622; }
    .social-icons > a:last-child { margin-right: 0; }
/*  user menu*/
#member-login:hover { opacity: .8; }
#user-menu > a > span { max-width: 70%; overflow: hidden; display: inline-block; white-space: nowrap; text-overflow: ellipsis; vertical-align: middle; margin-right: 5px; }
#user-menu > ul { background: #0A262B; list-style: none; padding: 0; text-align: left; display: none; }
    #user-menu > ul > .item:hover { opacity: .8; }
    #user-menu > ul > li > a { padding: 15px 20px; color: white; display: block; }
        #user-menu > ul > li > a > i { margin-left: 10px; }
    #user-menu > ul > li.separator > hr { margin: 0; border-color: #1D3F45; }
#user-menu:hover > ul { display: block; }
#user-menu > a > .ss-navigateup { display: none; }
#user-menu:hover > a > .ss-navigateup { display: inline-block; }
#user-menu:hover > a > .ss-navigatedown { display: none; }
/*nav main*/
#nav-main { margin: 0; width: 100%; }
    #nav-main > .menu-wrap { padding-right: 0; height: 100%; }
        #nav-main > .menu-wrap > ul { list-style: none; padding: 0; margin-bottom: 0; height: 100%; text-align: center; }
            #nav-main > .menu-wrap > ul > li { height: 100%; display: inline-block; }
                #nav-main > .menu-wrap > ul > li > a { color: #11393f; display: inline-block; height: 100%; }
                    #nav-main > .menu-wrap > ul > li > a:hover, #nav-main > .menu-wrap > ul > li > a:active { color: #F05622; }
                #nav-main > .menu-wrap > ul > li.active > a { color: #4EC6DF; }
    #nav-main > .boxed { text-align: center; position: relative; height: 100%; padding-right: 0; padding-left: 0; }
        #nav-main > .boxed > a { height: 100%; color: white; display: inline-block; width: 100%; }
            #nav-main > .boxed > a:hover { text-decoration: none; }
        #nav-main > .boxed:hover { opacity: .8; }
/*tagline*/
#tag-line { color: white; text-align: center; }
    #tag-line > .text { flex: 1; font-size: 28px; font-weight: bold; display: flex; padding: 5px 20px; min-height: 120px; }
        #tag-line > .text > .inner { margin: auto; line-height: 1.2em; }
    #tag-line > .socials { display: flex; font-weight: bold; }
        #tag-line > .socials > .social { width: 120px; display: flex; flex: 1; }
            #tag-line > .socials > .social > .inner { margin: auto; }
                #tag-line > .socials > .social > .inner > i { font-size: 28px; vertical-align: middle; }
                #tag-line > .socials > .social > .inner > span { vertical-align: middle; text-transform: uppercase; }
/*dc-slider/boxes - to be used for similar slider or boxes*/
.dc-slider-wrap { text-align: center; }
    .dc-slider-wrap > .container { overflow: hidden; padding: 0 40px; position: relative; }
        .dc-slider-wrap > .container > .arrow { vertical-align: top; font-size: 40px; cursor: pointer; margin-top: 130px; position: absolute; }
        .dc-slider-wrap > .container > .arrow-left { left: 0; }
        .dc-slider-wrap > .container > .arrow-right { right: 0; }
        .dc-slider-wrap > .container > .boxes { overflow: hidden; }
.dc-boxes { height: 300px; position: relative; transition: transform .5s; }
    .dc-boxes.dragging { transition: none; }
    .dc-boxes > .box { width: 270px; position: absolute; overflow: hidden; border-radius: 5px; cursor: pointer; vertical-align: top; margin: 0 15px; }
        .dc-boxes > .box > a { display: block; text-decoration: none; }
            .dc-boxes > .box > a > .banner { height: 104px; overflow: hidden; background-position: center; background-size: cover; }
            .dc-boxes > .box > a > .text { color: white; padding: 20px 10px 10px; height: 140px; text-align: left; font-size: 12px; }
                .dc-boxes > .box > a > .text > h6 { margin-top: 0; font-weight: 500; font-size: 16px; margin-bottom: 4px; }
            .dc-boxes > .box > a:hover { opacity: .8; }
        .dc-boxes > .box > .social { height: 30px; }
            .dc-boxes > .box > .social > a { display: block; float: left; width: 50%; color: white; font-size: 12px; height: 30px; padding-top: 5px; font-weight: 500; text-decoration: none; }
                .dc-boxes > .box > .social > a > .text { display: inline; }
/*footer*/
#footer { padding: 80px 0 50px; }
    #footer > .container > .row-1 { margin-top: 40px; }
        #footer > .container > .row-1 > .links-wrap > .input-group > .form-control { font-size: 16px; }
        #footer > .container > .row-1 > .links-wrap > .input-group > .input-group-btn > button { border: none; color: white; font-size: 16px; }
        #footer > .container > .row-1 > .links-wrap > .links { margin-top: 25px; text-transform: uppercase; font-size: 0.8em; font-weight: 500; }
            #footer > .container > .row-1 > .links-wrap > .links > a { color: white; margin-right: 10px; line-height: 2em; white-space: nowrap; }
        #footer > .container > .row-1 > .links-wrap > .badges { margin-top: 25px; }
            #footer > .container > .row-1 > .links-wrap > .badges > .badges-wrap { text-align: justify; max-width: 350px; }
                #footer > .container > .row-1 > .links-wrap > .badges > .badges-wrap > img { vertical-align: top; }
            #footer > .container > .row-1 > .links-wrap > .badges > .social-icons-wrap { font-size: 18px; }
                #footer > .container > .row-1 > .links-wrap > .badges > .social-icons-wrap > .social-icons { color: white; font-size: 32px; padding: 0; margin-top: 12px; }
                    #footer > .container > .row-1 > .links-wrap > .badges > .social-icons-wrap > .social-icons > i { margin-right: 8px; vertical-align: top; }
                        #footer > .container > .row-1 > .links-wrap > .badges > .social-icons-wrap > .social-icons > i:last-child { margin-right: 0; }

#footer-bottom { text-align: center; font-size: 14px; padding: 10px 0; color: white; }
    #footer-bottom > span > a { color: white; text-decoration: underline; }
    #footer-bottom > .terms { padding: 0 8px; margin: 0 8px; }
/*pages*/
#header-image { height: 420px; background-size: cover; background-position: center; margin-bottom: 40px; }
.date-caption { margin-bottom: 20px; font-size: 14px; }
    .date-caption > .type { margin-left: 20px; text-transform: uppercase; }
/*widgets*/
.widget { margin-top: 35px; margin-bottom: 10px; }
    .widget > .section { border-top: solid 2px #f5f5f5; border-left: solid 2px #f5f5f5; border-right: solid 2px #f5f5f5; }
        .widget > .section.header { font-size: 22px; font-weight: bold; padding: 18px 18px; text-transform: uppercase; }
        .widget > .section.close-off { border-bottom: solid 2px #f5f5f5; }
    .widget > .section { padding: 15px 18px; }
    .widget > .lower-link { display: block; color: white; text-align: center; padding: 18px 0; font-size: 18px; font-weight: bold; text-transform: uppercase; }
.widget-Story > .name { font-weight: bold; }
    .widget-Story > .name > a > img { width: 100%; margin-bottom: 5px; }
.widget-Facebook { text-align: center; }
.widget-OrderKit > .main > img { width: 100%; padding: 0 20px; }
.widget-fb-twitter { text-align: center; font-weight: 500; }
    .widget-fb-twitter > a { display: inline-block; text-decoration: none; }
        .widget-fb-twitter > a > i { font-size: 26px; }
    .widget-fb-twitter > .fb { margin-right: 20px; }
.widget-nav > .section { text-transform: uppercase; display: block; }
.widget-nav > a:hover { color: #F05622; }
.widget-nav > .section.bk-o { color: white; }
.widget.widget-headquarters { font-size: 14px; }
    .widget.widget-headquarters > .address { margin-bottom: 40px; }
.widget.widget-buttons > .btn-g { max-width: 270px; display: block; margin: 0 auto 15px; }
/*subnav*/
#subnav { height: 85px; text-transform: uppercase; font-weight: bold; position: relative; }
    #subnav > .container { height: 100%; }
        #subnav > .container > ul { list-style: none; padding: 0; height: 100%; margin-bottom: 0; }
            #subnav > .container > ul > li { display: inline-block; height: 100%; position: relative; }
                #subnav > .container > ul > li > .text { height: 100%; display: block; padding: 30px 40px 0; }
                #subnav > .container > ul > li.active { background: #eee; }
                    #subnav > .container > ul > li.active > .text { color: #11393f; }
                    #subnav > .container > ul > li.active > .arrow { position: absolute; left: 50%; margin-left: -16px; }
/*list items*/
.list-item { border-bottom: solid 2px #f5f5f5; padding-bottom: 40px; padding-top: 15px; }
/*paging*/
.paging { margin-top: 40px; text-transform: uppercase; margin-bottom: 80px; }
    .paging > .pageof { float: left; }
    .paging > .display { float: right; margin-top: -5px; }
    .paging > .links { text-align: center; }
        .paging > .links > .prev { margin-right: 30px; }
        .paging > .links > .next { margin-left: 30px; }
        .paging > .links > .pages { display: inline-block; margin-bottom: 10px; }
            .paging > .links > .pages > .page { margin: 0 8px; }
                .paging > .links > .pages > .page.active { background: #818285; color: white; padding: 4px 8px; border-radius: 4px; }
        .paging > .links > .disabled { color: #c0c0c0; }

        .paging > .links > .next, .paging > .links > .prev, .paging > .links > .pages > .page { cursor: pointer; }
        .paging > .links > .disabled, .paging > .links > .pages > .active { cursor: default; }
    .paging > .display > select { border-radius: 4px; padding: 5px; margin-left: 5px; }
/*cropper*/
.jquery-cropper > .zoom { position: absolute; bottom: 0; right: 5px; cursor: pointer; }
/* file upload*/
.jquery-file-upload { position: relative; }
    .jquery-file-upload > .wrap { width: 100px; height: 24px; position: relative; overflow: hidden; }
        .jquery-file-upload > .wrap > input[type=file] { opacity: 0; width: 250px; height: 24px; position: absolute; left: -150px; top: 0; cursor: pointer; }
        .jquery-file-upload > .wrap > .file { height: 24px; width: 100px; border: none; }
    .jquery-file-upload > .file-name { margin: auto 10px; }
    .jquery-file-upload > .wrap, .jquery-file-upload > .file-name, .jquery-file-upload > .cancel { display: inline-block; vertical-align: middle; }
/*  multi file upload*/
.fileMultiUpload { border: solid 1px #bbb; padding: 10px; width: 500px; max-width: 100%; }
    .fileMultiUpload > .jquery-file-upload { margin-bottom: 10px; }
    .fileMultiUpload > .misc-title { margin-top: 10px; }
    .fileMultiUpload > .upload-button { display: block; margin-bottom: 10px; margin-top: 10px; }
    .fileMultiUpload > .uploaded-files { width: 350px; max-width: 100%; }
/*stepflow*/
.stepflow-step > .row > .field { padding-bottom: 15px; }
.field-main > .form-group { margin-bottom: 0; }
.error-msg { color: #F05622; font-size: 12px; padding-left: 10px; }
.stepflow-field-label > .text > h5 { font-size: 20px; font-weight: bold; }
.dateFromListBoxes > select, .metric-height > select, .metric-height > input, .metric-weight > input { display: inline-block; }
.buttons-wrap > .next { float: right; }
.buttons-wrap > .cancel { margin-top: 15px; display: inline-block; }
.stepflow > .end-table { width: 100%; margin-top: 10px; }
.field-main > .yes-no > div { display: inline-block; border: solid 1px black; border-radius: 5px; padding: 6px 0px; width: 60px; text-align: center; cursor: pointer; }
    .field-main > .yes-no > div.active { background: #F05622; color: white; }
form.stepflow .field-grid > table > tbody > tr { border-bottom: solid 1px #eee; }
    form.stepflow .field-grid > table > tbody > tr > td { position: relative; }
        form.stepflow .field-grid > table > tbody > tr > td > .field > .cover-label { position: absolute; top: 6px; left: 5px; overflow: auto; word-wrap: break-word; width: 100%; max-height: calc(100% - 10px); }
    form.stepflow .field-grid > table > tbody > tr:last-child { border-bottom: none; }
form.stepflow .field-grid > table.with-border { border: solid 1px #eee; }
form.stepflow .field-main > select { min-width: 100px; }
.sf-progress { -webkit-appearance: none; appearance: none; width: 100%; }
    .sf-progress::-webkit-progress-bar { background-color: #eee; border-radius: 2px; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25) inset; }
    .sf-progress::-webkit-progress-value { background-image: -webkit-linear-gradient(-45deg, transparent 33%, rgba(0, 0, 0, .1) 33%, rgba(0,0, 0, .1) 66%, transparent 66%), -webkit-linear-gradient(top, rgba(255, 255, 255, .25), rgba(0, 0, 0, .25)), -webkit-linear-gradient(left, #09c, #f44); border-radius: 2px; background-size: 35px 20px, 100% 100%, 100% 100%; }
/*login dialog*/
#login-dialog > .content-wrap > .content > .conditional { display: none; }
#login-dialog.login > .content-wrap > .content > .login { display: block; }
    #login-dialog.login > .content-wrap > .content > .login > .restricted-msg { color: red; margin-bottom: 5px; font-size: 14px; }
    #login-dialog.login > .content-wrap > .content > .login > .forgot-link { display: block; }
#login-dialog.register > .content-wrap > .content > .register { display: block; }
#login-dialog.forgot > .content-wrap > .content > .forgot { display: block; }
#login-dialog.msg > .content-wrap > .content > .msg { display: block; }

#login-dialog > .content-wrap > .content > .options-wrap > .options-less,
#login-dialog > .content-wrap > .content > .options-wrap > .links { display: none; }
#login-dialog.expanded > .content-wrap > .content > .options-wrap > .options-less,
#login-dialog.expanded > .content-wrap > .content > .options-wrap > .links { display: block; }
#login-dialog.expanded > .content-wrap > .content > .options-wrap > .options-more { display: none; }

#login-dialog > .content-wrap > .content { }
    #login-dialog > .content-wrap > .content > .close { margin-top: 20px; margin-right: 15px; }
    #login-dialog > .content-wrap > .content > form, #login-dialog > .content-wrap > .content > .msg { padding: 10px 35px 50px; }
        #login-dialog > .content-wrap > .content > form.login { padding-bottom: 20px; }

#four-digit-code-wrap > input { width: 130px; display: inline-block; }
#four-digit-code-wrap > .btn { background: #ddd; }

#google-fb-logins { padding: 0 30px 20px; }
    #google-fb-logins > button { color: white; padding-top: 8px; width: 220px; margin: 0 5px 10px; }
        #google-fb-logins > button > span { vertical-align: 4px; }
        #google-fb-logins > button > i { font-size: 20px; margin-right: 10px; }
#fb-login { background: #3C5A99; }
#google-login { background: #DD4B39; }
#login-dialog > .content-wrap > .content > form > .caption { margin-bottom: 30px; color: #818285; }
    #login-dialog > .content-wrap > .content > form > .caption > .link { font-weight: bold; text-decoration: underline; cursor: pointer; }
#login-dialog > .content-wrap > .content > form > .button-wrap { margin-top: 30px; }
    #login-dialog > .content-wrap > .content > form > .button-wrap > button { width: 250px; margin-right: 30px; max-width: 100%; }
#login-dialog > .content-wrap > .content > .options-wrap { }
    #login-dialog > .content-wrap > .content > .options-wrap > .options-tog { background: #f6f6f6; color: #c0c0c0; text-align: center; padding: 20px; cursor: pointer; }
        #login-dialog > .content-wrap > .content > .options-wrap > .options-tog > i { margin-left: 20px; }
    #login-dialog > .content-wrap > .content > .options-wrap > .links { margin: 0 35px 20px; }
/*components*/
/*  home-news-item - used on 404s*/
.home-news-item { border-radius: 10px; text-align: left; overflow: hidden; }
    .home-news-item > .img { padding-bottom: 100%; background-position: center; background-size: cover; }
    .home-news-item > .bar { height: 10px; }
    .home-news-item > h4 { margin-top: 25px; }
/*  recent activity - dc, dashboard*/
#recent-activity { }
    #recent-activity > .list { max-height: 500px; overflow: auto; margin-bottom: 40px; }
        #recent-activity > .list > .item { margin-top: 30px; }
            #recent-activity > .list > .item > .date { font: bold 14px "Gotham A", "Gotham B", sans-serif; }
            #recent-activity > .list > .item > h5 { font-weight: 500; font-size: 18px; }
/*  dc stats, share*/
#dc-stats { height: 100px; text-align: center; color: white; }
    #dc-stats > .stat { height: 100%; padding: 20px 0 0; }
        #dc-stats > .stat > .lbl { font: bold 1em "Gotham A", "Gotham B", sans-serif; text-transform: uppercase; }
        #dc-stats > .stat > .text { font-size: 2em; font-weight: bold; }
#share-dc-wrap { text-align: center; height: 100%; padding: 0 20px 25px; overflow: hidden; }
    #share-dc-wrap > h4 { text-transform: uppercase; margin-top: 30px; font: bold 1.2em "Gotham A", "Gotham B", sans-serif; max-width: 160px; margin: 30px auto 20px; }
    #share-dc-wrap > .link { margin: 0 auto; }
        #share-dc-wrap > .link > span { color: white; padding: 0 6px; }
/*  rainbow*/
.rainbow { text-align: center; color: white; position: relative; overflow: hidden; }
    .rainbow > h5 { font: bold 18px "Gotham A", "Gotham B", sans-serif; margin-top: 30px; margin-bottom: 20px; text-transform: uppercase; }
    .rainbow > canvas { margin: 0 auto; width: 100%; padding: 0 10px; }
    .rainbow > .amount { position: absolute; bottom: 65px; width: 100px; left: 50%; margin-left: -50px; font-weight: bold; font-size: 18px; }
    .rainbow > .amounts { padding: 0 10px; font-size: 14px; margin-bottom: 40px; }
        .rainbow > .amounts > .lower-amount { float: left; }
        .rainbow > .amounts > .goal { float: right; }
/*  social*/
.fb-tw1 { margin-bottom: 20px; }
    .fb-tw1 > a { display: inline-block; border-radius: 5px; padding: 10px; color: white; text-decoration: none; }
        .fb-tw1 > a > .text { font-weight: 500; }
/*  event name/email*/
#name-email-c { padding: 10px 40px 20px; border-radius: 5px; }
    #name-email-c > h2 { font-size: 30px; }
    #name-email-c > .err-msg { color: red; margin-bottom: 10px; }
/*media queries are ordered by min-width, then max-width*/
@media(max-width: 479px) {
    h2 { font-size: 30px; }
    #header-top { height: 55px; font-size: 17px; }
        #header-top > .row > .box { padding: 15px 0 0; }
    #header-main { height: 88px; }
    body.scrolled > #headers { margin-top: -55px; }
    .btn-g { font-size: 14px; padding: 15px 20px; height: 50px; }
    .paging > .pages > .page { margin: 0 4px; }
    .paging > .links > .prev { display: none; }
    .paging > .links > .next { margin-left: 15px; }
    #mobile-steps > .texts > .text { font-size: 16px; }
    #mobile-phone-link { font-size: 18px; }
    #tag-line > .text { font-size: 20px; }
}

@media(max-width: 767px) {
    html { overflow: auto; }
    body { font-size: 14px; }
    .container { padding-right: 25px; padding-left: 25px; }
    .post-inner-image { display: none; }
    /*mobile header*/
    body.hide-mob-top > #headers { margin-top: 0 !important; }
    #header-top { color: white; text-align: center; font-weight: bold; text-transform: uppercase; }
        #header-top > .row { height: 100%; }
            #header-top > .row > .box { height: 100%; }
    #header-main { position: relative; width: 100%; background: white; z-index: 150; }
    #logo-main { height: 100%; padding: 5px; display: inline-block; }
        #logo-main > img { height: 100%; }
    #mobile-phone-link { text-align: center; display: block; position: absolute; width: 200px; left: 50%; margin-left: -80px; font-weight: bold; font-family: "Gotham A", "Gotham B", sans-serif; top: 36%; }
    /*mobile menu*/
    #mobile-hamburger { position: absolute; right: 20px; top: 50%; margin-top: -10px; font-size: 18px; }
        #mobile-hamburger > span > i { vertical-align: -2px; margin-left: 5px; }
    #mobile-menu { position: absolute; z-index: 110; color: white; font-size: 20px; width: 100%; height: 100%; border: solid 1px white; display: none; text-transform: uppercase; line-height: 20px; }
        #mobile-menu.open { display: block; }
        #mobile-menu > .overlay-content { padding: 20px 0; height: 100%; overflow: auto; }
            #mobile-menu > .overlay-content > .ul-wrap > ul { list-style: none; z-index: 200; position: relative; padding: 0; margin: 0; }
                #mobile-menu > .overlay-content > .ul-wrap > ul > li { margin-bottom: 12px; }
                    #mobile-menu > .overlay-content > .ul-wrap > ul > li:last-child { margin-bottom: 0; }
                    #mobile-menu > .overlay-content > .ul-wrap > ul > li > a { color: white; padding: 0 10px; display: block; }
                        #mobile-menu > .overlay-content > .ul-wrap > ul > li > a:focus { color: #F05622; }
                    #mobile-menu > .overlay-content > .ul-wrap > ul > li.active > a { color: #4EC6DF; }
                    #mobile-menu > .overlay-content > .ul-wrap > ul > li.separator > hr { border-color: #1D3F45; border-width: 2px; }
                    #mobile-menu > .overlay-content > .ul-wrap > ul > li.small { margin-bottom: 2px; font-size: 14px; }
        #mobile-menu > .overlay { height: 100%; width: 100%; position: absolute; z-index: 100; opacity: .95; }
    .member-login-name { padding-bottom: 25px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
        .member-login-name > i { float: right; }
        .member-login-name > span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; padding-right: 10px; display: block; }
    #mobile-user-menu { overflow: hidden; }
        #mobile-user-menu > li:first-child { padding-top: 25px; }
    /*menu search*/
    #mob-search-li { padding: 0 10px; }
        #mob-search-li > form > i { margin-right: 10px; vertical-align: middle; }
        #mob-search-li > form > input { border: none; background: transparent; width: 230px; }
        #mob-search-li > form > button { display: block; width: 150px; height: 30px; padding-top: 2px; font-size: 12px; border: none; border-radius: 2px; margin-top: 10px; }
    /*subnav*/
    #subnav-mobile { font-size: 24px; height: 90px; overflow: visible; position: relative; z-index: 100; }
        #subnav-mobile > .active { color: white; text-transform: uppercase; padding: 28px 30px 0; font-weight: bold; height: 90px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
            #subnav-mobile > .active > i { float: right; }
        #subnav-mobile > .other-pages { background: white; box-shadow: 0px 10px 10px #ddd; display: none; }
            #subnav-mobile > .other-pages > a { display: block; padding: 25px 30px 0; border-bottom: solid 2px #f5f5f5; height: 90px; }

    /*fb-twitter-mobile-top*/
    .two-boxes { text-align: center; font-weight: bold; height: 55px; font-size: 17px; text-transform: uppercase; color: white; }
        .two-boxes > a { color: white; height: 100%; padding: 14px 0 0; }
            .two-boxes > a > .text { display: inline-block; margin-left: 10px; vertical-align: 2px; }

    /*widgets*/
    #widgets-content-row { display: flex; display: -webkit-flex; flex-direction: column; -webkit-flex-direction: column; }
        #widgets-content-row > .widgets-col { order: 2; -webkit-order: 2; }
        #widgets-content-row > .content-col { order: 1; -webkit-order: 1; }

    /*dc slider*/
    .dc-slider-wrap > .container { padding: 0; }
        .dc-slider-wrap > .container > .arrow { display: none; }

    /*pages*/
    #mob-header-img { width: 100%; }

    /*footer*/
    #footer > .container > .row-1 > .links-wrap > .links > a { display: block; text-transform: uppercase; }
    #footer > .container > .row-2 { text-align: left; }
        #footer > .container > .row-2 > .badges-wrap { text-align: left; }
            #footer > .container > .row-2 > .badges-wrap > img { margin-right: 20px; }
    #footer-bottom > .terms { display: block; }
    .paging > .pageof, .paging > .display { display: none; }

    /*stepflow*/
    #mobile-steps-wrap { padding: 40px 0 0; height: 220px; margin-bottom: 20px; }
    #mobile-steps { width: 300px; margin: 0 auto; }
        #mobile-steps > .outer-bar { border-radius: 30px; background: #e4e5e5; height: 60px; }
            #mobile-steps > .outer-bar > .inner-bar { border-radius: 30px; height: 100%; }
        #mobile-steps > .texts { width: 300px; margin: 0 auto; font-size: 1.8em; }
            #mobile-steps > .texts > .text { width: 130px; text-align: center; margin-top: 10px; display: none; }
        #mobile-steps > .tt { background: black; width: 60px; color: white; font-weight: bold; padding: 6px 10px; position: relative; border-radius: 4px; margin-bottom: 10px; text-align: center; }
            #mobile-steps > .tt > i { color: black; position: absolute; bottom: -12px; left: 50%; margin-left: -6px; font-size: 14px; }

        #mobile-steps.step-1 > .outer-bar > .inner-bar { width: 60px; }
        #mobile-steps.step-2 > .outer-bar > .inner-bar { width: 40%; }
        #mobile-steps.step-3 > .outer-bar > .inner-bar { width: 70%; }
        #mobile-steps.step-4 > .outer-bar > .inner-bar { width: 100%; }
        #mobile-steps.step-1 > .texts > .step-1 { display: block; margin-left: -20px; }
        #mobile-steps.step-2 > .texts > .step-2 { display: block; margin-left: 40px; }
        #mobile-steps.step-3 > .texts > .step-3 { display: block; margin-left: 130px; }
        #mobile-steps.step-4 > .texts > .step-4 { display: block; margin-left: 190px; }
        #mobile-steps.step-1 > .tt { margin-left: 0; }
        #mobile-steps.step-2 > .tt { margin-left: 50px; }
        #mobile-steps.step-3 > .tt { margin-left: 155px; }
        #mobile-steps.step-4 > .tt { margin-left: 240px; }

        #mobile-steps.six-steps.step-2 > .outer-bar > .inner-bar { width: 36%; }
        #mobile-steps.six-steps.step-3 > .outer-bar > .inner-bar { width: 52%; }
        #mobile-steps.six-steps.step-4 > .outer-bar > .inner-bar { width: 68%; }
        #mobile-steps.six-steps.step-5 > .outer-bar > .inner-bar { width: 84%; }
        #mobile-steps.six-steps.step-6 > .outer-bar > .inner-bar { width: 100%; }
        #mobile-steps.six-steps.step-2 > .texts > .step-2 { display: block; margin-left: 35px; }
        #mobile-steps.six-steps.step-3 > .texts > .step-3 { display: block; margin-left: 80px; }
        #mobile-steps.six-steps.step-4 > .texts > .step-4 { display: block; margin-left: 130px; }
        #mobile-steps.six-steps.step-5 > .texts > .step-5 { display: block; margin-left: 180px; }
        #mobile-steps.six-steps.step-6 > .texts > .step-6 { display: block; margin-left: 190px; }
        #mobile-steps.six-steps.step-2 > .tt { margin-left: 50px; }
        #mobile-steps.six-steps.step-3 > .tt { margin-left: 105px; }
        #mobile-steps.six-steps.step-4 > .tt { margin-left: 150px; }
        #mobile-steps.six-steps.step-5 > .tt { margin-left: 200px; }
        #mobile-steps.six-steps.step-6 > .tt { margin-left: 240px; }

        #mobile-steps.four-steps.step-2 > .outer-bar > .inner-bar { width: 45%; }
        #mobile-steps.four-steps.step-3 > .outer-bar > .inner-bar { width: 60%; }
        #mobile-steps.four-steps.step-4 > .outer-bar > .inner-bar { width: 75%; }
        #mobile-steps.four-steps.step-5 > .outer-bar > .inner-bar { width: 100%; }
        #mobile-steps.four-steps.step-2 > .texts > .step-2 { display: block; margin-left: 35px; }
        #mobile-steps.four-steps.step-3 > .texts > .step-3 { display: block; margin-left: 80px; }
        #mobile-steps.four-steps.step-4 > .texts > .step-4 { display: block; margin-left: 130px; }
        #mobile-steps.four-steps.step-5 > .texts > .step-5 { display: block; margin-left: 180px; }
        #mobile-steps.four-steps.step-2 > .tt { margin-left: 50px; }
        #mobile-steps.four-steps.step-3 > .tt { margin-left: 105px; }
        #mobile-steps.four-steps.step-4 > .tt { margin-left: 150px; }
        #mobile-steps.four-steps.step-5 > .tt { margin-left: 200px; }

    /*components*/
    #dc-stats > .stat { padding-top: 20px; }
        #dc-stats > .stat > .text { font-size: 1.6em; }
        #dc-stats > .stat > .lbl { font-size: 12px; }

    #share-dc-wrap { display: none; }
    .rainbow { max-width: 200px; margin: 0 auto 15px; }
    .dataTables_wrapper { overflow: auto; }
    #tag-line > .socials { height: 85px; }
}

@media(max-width: 991px) {
    #footer { padding: 40px 0; }
        #footer > .container > .row-1 > .logo-wrap { text-align: center; margin-bottom: 40px; }
    #footer-bottom > .phone { display: block; }
}

@media(min-width: 480px) and (max-width: 767px) {
    #header-top { height: 95px; font-size: 1.5em; }
        #header-top > .row > .box { padding: 30px 0 0; }
    #header-main { height: 110px; }
    body.scrolled > #headers { margin-top: -95px; }
    #mobile-phone-link { font-size: 1.5em; }
    #stats > .stat { padding: 10px 0 0; }
}

@media(min-width:768px) and (max-width: 991px ) {
    body { font-size: 12px; }
    #nav-top { font-size: 9px; height: 28px; padding-left: 68px; }
        #nav-top > .login-user > a { padding-top: 9px; }
        #nav-top > .menu-wrap { padding: 8px 10px; }
    #logo-main > img { height: 55px; }
    body.scrolled > #headers > #header-main > #logo-main > img { height: 27px; }
    #header-main { height: 65px; }
    body.scrolled > #headers { margin-top: -28px; }
    #nav-main { font-size: 12px; height: 37px; padding-left: 68px; }
        #nav-main > .boxed > a { padding-top: 10px; }
        #nav-main > div > ul > li > a { padding: 10px 10px 0; }
    #footer > .container > .row-2 { text-align: center; }
    #stats > .stat { padding-top: 25px; }
    #share-dc-wrap > h4 { margin-top: 10px; }
    #share-dc-wrap > .link { max-width: 138px; }
}

@media (min-width:768px) {
    /*main header*/
    #header-main { text-transform: uppercase; font-weight: bold; position: relative; margin-top: 0; transition: margin-top .5s; transform: translateZ(0); display: flex; display: -webkit-flex; flex-direction: row; -webkit-flex-direction: row; z-index: 100; }
        #header-main > .navs { flex: 1; -webkit-flex: 1; }
    #logo-main { position: absolute; padding: 5px; z-index: 100; bottom: 0; }
        #logo-main > img { transition: height .5s; }

    #mobile-menu { display: none; }
    #footer-bottom > .terms { border-left: solid 2px white; border-right: solid 2px white; }
    /*spanish*/
    #es-top-nav { display: flex; flex: 1; align-items: center; }
        #es-top-nav > .links { flex: 8; text-align: center; }
            #es-top-nav > .links > a.active { color: #4dc7df; }
            #es-top-nav > .links > a { margin: 0 10px; color: #8d8d8d; text-decoration: none; }
        #es-top-nav > div > a:hover { color: #f05622; }
        #es-top-nav > .english-version, #es-top-nav > .social { flex: 2; text-align: center; }

    /*pages*/
    .widgets-wrap { max-width: 320px; }
    #header-image.not-wide { display: none; }
    .post-inner-image { width: 100%; margin-bottom: 40px; }
    /*stepflows*/
    #desktop-steps { width: 720px; margin: 50px auto 40px; }
        #desktop-steps > .step { float: left; width: 70px; text-align: center; }
            #desktop-steps > .step > .circle { width: 70px; height: 70px; background: #e4e5e5; border-radius: 35px; text-align: center; color: white; padding-top: 18px; font-size: 24px; font-weight: bold; }
            #desktop-steps > .step.active > .circle { background: #4EC6DF; }
            #desktop-steps > .step > .text { width: 120px; margin-left: -25px; margin-top: 10px; }
        #desktop-steps > .line { float: left; width: 140px; height: 5px; background: #e4e5e5; margin-top: 34px; }
    /*components*/
    #tag-line { display: flex; }
        #tag-line > .socials > .social > .inner > i { display: block; margin-bottom: 4px; }
}

@media(min-width:992px) and (max-width: 1199px) {
    body { font-size: 14px; }
    #nav-main { font-size: 14px; }
}

@media(min-width:992px) {
    #nav-top { height: 64px; padding-left: 130px; }
        #nav-top > .login-user { font-size: 0.8em; }
            #nav-top > .login-user > a { padding-top: 22px; }
    #logo-main { padding: 8px; }
        #logo-main > img { height: 124px; }
    #header-main { height: 140px; }
    #nav-top > .menu-wrap { padding: 20px 10px; }
    body.scrolled > #headers { margin-top: -64px; }
        body.scrolled > #headers > #header-main > #logo-main > img { height: 60px; }
    #nav-main { height: 76px; padding-left: 130px; }
        #nav-main > .boxed > a { padding-top: 28px; }
        #nav-main > div > ul > li > a { padding: 28px 15px 0; }
    #share-dc-wrap > .link { max-width: 155px; }
    #footer-bottom > .site-by { border-right: solid 2px #fff; padding-right: 8px; margin-right: 8px; }
}

@media(min-width:1200px) {
    body { font-size: 16px; }
    #nav-main { font-size: 18px; }
        #nav-main > div > ul > li > a, #nav-main > .boxed > a { padding-top: 26px; }
    body.lang-Spanish #nav-main { font-size: 16px; }
    #footer > .container > .row-2 > .badges-wrap { padding-right: 40px; }
    #share-dc-wrap > .link { max-width: 170px; }
}

@media print {
    #header-top, #header-main > .navs, #mobile-hamburger { display: none; }
    html, body, #after-header { height: auto; overflow: visible; }
}
