/* Artfully masterminded by Rescue SCG  */

/* --------------------------------------------------
   Table of Contents
-----------------------------------------------------
:: Shared Styles
:: Homepage
*/

/* -----------------------------------------
   Shared Styles
----------------------------------------- */

body {
    background : url('../img/main-bg.png');
}

html,body {
    width: 100%;
    height: 100%;
    margin: 0px;
    padding: 0px;
    overflow-x: hidden;
}

.orange {
    color : #cf7019;
}

.brown {
    color : #30261c;
}

.white {
    color : #fff;
}

.orange-bg {
    background : #cf7019;
}

.left {
    float : left;
}

.right {
    float : right;
}

.clear {
    clear : both;
}

.serif {
    font-family : 'adobe-caslon-pro'
}

.orange-bg-distressed {
    background : url('../img/orange-bg-distressed.png');
    padding    : 6px 20px;
}
@media (max-width : 768px) {
    #training {
        margin-top: 20px;
    }

}

.quiz-cta {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    text-align: center;
    margin-top: 0.75rem;
    margin-bottom: 0.75rem;
}

.quiz-cta h2 {
    font-family: 'cartonslab';
    margin-bottom: 0;
    border-top: 2px solid #30261C;
    padding-top: 0.75rem;
}

.quiz-cta .button {
    margin-top: 0;
}

.quiz-cta p {
    padding-bottom: 0.75rem;
    border-bottom: 2px solid #30261C;
}

.video-container {
    margin         : 20px 0 0;
    position       : relative;
    padding-bottom : 56.25%;
    padding-top    : 30px;
    height         : 0;
    overflow       : hidden;
    box-shadow     : 0 0 5px rgba(0, 0, 0, 0.5);
}

.video-container.video-about {
    width  : 97%;
    margin : auto;
}
.video-container iframe,
.video-container object,
.video-container embed {
    position : absolute;
    top      : 0;
    left     : 0;
    width    : 100%;
    height   : 100%;
}
/* .quiz-container {
    text-align: center;
}
@media (min-width : 1024px) {
    .quiz-container {
        margin-top: -50px;
    }
}
#quiz {
    margin-top: 10px;
    background-color: #cf7019;
} */

.top-section {
    background     : url('../img/top-splatter.png') #30261c center bottom repeat-x;
    padding-bottom : 40px;
}

.small-top.top-section {
    background     : url('../img/top-splatter.png') #30261c center bottom repeat-x;
    padding-bottom : 0px;
}

.page-header {
    font-weight   : normal;
    font-family   : 'cartonslab';
    color         : #30261c;
    border-top    : 1px solid #30261c;
    border-bottom : 1px solid #30261c;
    text-align    : center;
    font-size     : 30px;
    padding       : 10px 20px;
}

.page-header.no-underline {
    border : none;
}

.underlined-container {

    padding       : 10px;
    border-top    : 1px solid #30261c;
    border-bottom : 1px solid #30261c;
    display       : inline-block;
    margin        : auto;
}

.about-header {
    border-top    : 1px solid #30261c;
    border-bottom : 1px solid #30261c;
    margin        : auto;
    padding       : 28px 0px;

}

/*.about-sub-header {*/
    /*font-size: 40px !important;*/
    /*margin: 10px;*/
    /*line-height: 40px;*/
    /**/
/*}*/

.about-header .page-header {
    border : none;
}

.about-negative-margin {
    margin-top : -70px;
}

.about-header-two {
    text-align : center;
}

.about-hero {
    background-image    : url(/wp-content/themes/downanddirty/style/img/jul-2017/about-bg.png);
    padding             : 20px;
    background-size     : cover;
    background-position : center;
}

.about-hero .hero-img {
    display : none;
}

.about-hero .hero-copy {
    position : static;
}

.about-hero #hero-distressed-copy {
    margin        : 0;
    margin-bottom : 20px;
}

.about-social img {

    width        : 22%;
    max-width    : 44px;
    margin-right : 2%;
}

.homepage-header .hero-img {
    margin    : 0;
    max-width : 100%;
}

.homepage-header .hero-img img {
    width : 100%;
}

.video-container.wide-screen {
    padding-bottom : 46%;
}

.main-dd-button:visited,
.main-dd-button {
    width            : 100%;
    background-color : #cf7019;
    font-family      : 'cartonslab';
    border           : none;
    margin           : 0;
    box-shadow       : none;
    margin-top       : 20px;
}

.center-block-link,
.center-block-link img {
    display : block;
    margin  : auto;
}

@media (max-width : 768px) {
    html .homepage-header,
    .homepage-header {
        height : 130px;
    }
}

.e-cigs-block {
    padding: 0 25px;
}

.e-cigs-block p {
    font-family: 'Montserrat', sans-serif;
    color: #30261C !important;
}

.e-cigs-block img {
    max-height: 180px;
}

.e-cigs-block .columns {
    margin-top: 24px;
}

.snapchat-image-container {
    display          : none;
    position         : absolute;
    top              : 0;
    left             : 0;
    background-color : white;
}

.snapchat-image-container .close-link {
    position         : absolute;
    top              : 10px;
    right            : 10px;
    background-color : #cf7019;
    border-radius    : 50%;
    padding          : 5px 8px;
    color            : white;
}

.snapchat-image-container img.snapchat {
    max-width  : 200px;
    margin     : auto;
    margin-top : 80px;
}

.main-dd-button:hover,
.main-dd-button:focus {
    background-color : #b75d0a;
}

.heading-alt {
    color         : #30261c;
    font-size     : 10px;
    text-align    : center;
    margin-top    : -25px;
    display       : block;
    font-family   : 'cartonslab';
    margin-bottom : 15px;
}

#menu-main-menu {
    float         : right;
    border-top    : 1px solid #cf7019;
    border-bottom : 1px solid #cf7019;
    list-style    : none;
    background    : #30261c;
    padding       : 10px;
}

#menu-main-menu li {
    float          : left;
    text-transform : uppercase;
}

#menu-main-menu li a {
    color       : #fff;
    font-family : 'cartonslab';
    font-size   : 24px;
}

#menu-main-menu li a:hover {
    color : #cf7019;
}

li.nav-divider {
    color       : #cf7019;
    font-family : 'times';
    font-size   : 24px;
    margin      : 0 15px;
}

li.nav-divider:last-child {
    display : none;
}

#menu-main-menu li.current-menu-item a {
    color : #cf7019;
}

.small-top #menu-main-menu {
    float         : right;
    border-top    : 1px solid #cf7019;
    border-bottom : 1px solid #cf7019;
    list-style    : none;
    background    : #30261c;
    padding       : 10px;
}

.small-top #menu-main-menu li {
    float          : left;
    text-transform : uppercase;
}

.small-top #menu-main-menu li a {
    color       : #fff;
    font-family : 'cartonslab';
    font-size   : 24px;
}

.small-top #menu-main-menu li a:hover {
    color : #cf7019;
}

.small-top li.nav-divider {
    color       : #cf7019;
    font-family : 'times';
    font-size   : 24px;
    margin      : 0 15px;
}

.small-top li.nav-divider:last-child {
    display : none;
}

.small-top #menu-main-menu li.current-menu-item a {
    color : #cf7019;
}

#header-like {
    margin : 30px 0;
}

.small-top #header-like {
    margin : 4px 0;
}

.footer {
    background : url('../img/top-splatter.png') #30261c center bottom repeat-x;
    padding    : 20px 0;
    margin-top : 40px;
}

.footer-navigation {
    font-family : 'cartonslab';
    font-size   : 18px;
    color       : #fff;
    text-align  : center;
    background  : #30261c;
}

.footer-menu {
    border-top    : 1px solid #cf7019;
    border-bottom : 1px solid #cf7019;
    list-style    : none;
    background    : #30261c;
    padding       : 10px 10px 7px 10px;
    float         : left;
    margin-bottom : 0;
}

.footer-menu li {
    float          : left;
    text-transform : uppercase;
}

.footer-menu li a {
    color       : #fff;
    font-family : 'cartonslab';
    font-size   : 18px;
}

.footer-menu li a:hover {
    color : #cf7019;
}

.footer-menu li.nav-divider {
    color       : #cf7019;
    font-family : 'times';
    font-size   : 24px;
    margin      : 0 15px;
    line-height : 30px;
}

.footer-menu li.current-menu-item a {
    color : #cf7019;
}

a.footer-fb {
    background  : url('../img/footer-social-icons.png') 0 0;
    width       : 27px;
    height      : 24px;
    text-indent : -9999px;
    display     : block;
}

a.footer-yt {
    background  : url('../img/footer-social-icons.png') -27px 0;
    width       : 27px;
    height      : 24px;
    text-indent : -9999px;
    display     : block;
}

.footer-social {
    padding : 0;
    margin  : 0;
}

.footer-social li {
    float      : left;
    list-style : none;
    padding    : 5px 5px 5px;
}

.footer h3 {
    color       : #cf7019;
    font-family : 'cartonslab';
    font-size   : 18px;
    font-weight : normal;
}

.copyright {
    background  : #cf7019;
    text-align  : center;
    padding     : 30px 0;
    font-family : 'cartonslab';
    color       : #30261c;
    font-size   : 12px;
}

/* -----------------------------------------
   Homepage
----------------------------------------- */

.homepage-header {
    background : url('../img/subheader-bg.png');
    height     : 330px;
}

.hero {
    position   : relative;
    text-align : center;
    margin-top : 40px;
    overflow   : hidden;
}

.hero-img {
    position   : relative;
    z-index    : 1;
    max-width  : 940px;
    margin     : 0 auto;
    box-shadow : 0 0 5px rgba(0, 0, 0, 0.15);
}

.hero-copy {
    position    : absolute;
    z-index     : 2;
    top         : 12px;
    left        : 40px;
    font-family : 'cartonslab';
    text-align  : left;
    font-size   : 15px;
}

.hero-copy h1 {
    font-family : 'cartonslab';
    color       : #30261c;
    text-align  : left;
    /*border-top: 1px solid #cf7019;
    border-bottom: 1px solid #cf7019;*/
    font-size   : 19px;
    line-height : 22px;
    /*padding: 10px 0;*/
    font-weight : normal;
    margin      : 12px 0 2px;
}

.hero-copy .about {
    margin        : 12px 0;
    padding       : 0 8px 8px;
    border-bottom : 1px solid #cf7019;
    width         : 43%;
}

.hero-copy .about h1 {
    font-size : 17px;
}

#hero-distressed-copy p {
    line-height   : 17px;
    margin        : 10px 0;
    padding       : 0 0 8px;
    border-bottom : 1px solid #cf7019;
}

#hero-distressed-copy h1 {
    padding       : 0 0 8px;
    margin-bottom : 0;
    border-bottom : 1px solid #cf7019;
}

.youchew {
    font-family : 'cartonslab';
}

#hero-distressed-copy {
    margin : 20px 0;
}

#hero-dnd {
    font-size : 36px;
}

h2.column-header {
    font-family   : 'cartonslab';
    color         : #30261c;
    font-size     : 18px;
    text-align    : center;
    padding       : 8px 0 5px;
    border-top    : 1px solid #30261c;
    border-bottom : 1px solid #30261c;
    margin-bottom : 20px;
    margin-top    : 20px;
    font-weight   : normal;
}

.boxgrid {
    width    : 100%;
    height   : 200px;
    float    : left;
    overflow : hidden;
    position : relative;
}

.boxgrid img {
    position : absolute;
    top      : 0;
    left     : 0;
    border   : 0;
}

.boxcaption {
    float      : left;
    position   : absolute;
    background : #000;
    width      : 100%;
    color      : #fff;
    padding    : 10px 10px 0 10px;
    opacity    : .8;
    /* For IE 5-7 */
    filter     : progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
    /* For IE 8 */
    -MS-filter : "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
}

.captionfull .boxcaption {
    bottom : 0;
    left   : 0;
}

.caption .boxcaption {
    bottom : 0;
    left   : 0;
}

.boxcaption h3 {
    font-family : 'cartonslab';
    font-size   : 14px;
    font-weight : normal;
}

.boxcaption p {
    font-size   : 11px;
    font-family : 'adobe-caslon-pro'
}

/* -----------------------------------------
   About
----------------------------------------- */

.sub-header {
    background : url('../img/subheader-bg.png');
    padding    : 40px 0 70px;
    text-align : center;

}

a.facebook-btn {
    background   : url('../img/facebook-button.png') 0 0;
    height       : 20px;
    width        : 77px;
    text-indent  : -9999px;
    display      : block;
    float        : left;
    margin-right : 20px;
}

a.facebook-btn:hover {
    background-position : 0 -20px;
}

a.facebook-btn:active {
    background-position : 0 -40px;
}

.youtube-btn {
    background  : url('../img/youtube-button.png') 0 0;
    height      : 20px;
    width       : 77px;
    text-indent : -9999px;
    display     : block;
    float       : left;
}

a.youtube-btn:hover {
    background-position : 0 -20px;
}

a.youtube-btn:active {
    background-position : 0 -40px;
}

/* -----------------------------------------
   Fact
----------------------------------------- */
a.fact-breath {
    background  : url('../img/fact-nav-sprite.jpg') 0 0;
    height      : 170px;
    width       : 294px;
    text-indent : -9999px;
    display     : block;
    box-shadow  : 0 0 5px rgba(0, 0, 0, 0.5);
}

a.fact-breath:hover, a.fact-nav-active-breath {
    background-position : 0 -172px;
}

a.fact-deforestation {
    background  : url('../img/fact-nav-sprite.jpg') -295px 0;
    height      : 170px;
    width       : 294px;
    text-indent : -9999px;
    display     : block;
    box-shadow  : 0 0 5px rgba(0, 0, 0, 0.5);
}

a.fact-deforestation:hover, a.fact-nav-active-deforestation {
    background-position : -295px -172px;
}

a.fact-animal {
    background  : url('../img/fact-nav-sprite.jpg') -590px 0;
    height      : 170px;
    width       : 294px;
    text-indent : -9999px;
    display     : block;
    box-shadow  : 0 0 5px rgba(0, 0, 0, 0.5);
}

a.fact-animal:hover, a.fact-nav-active-animal {
    background-position : -590px -172px;
}

a.fact-addiction {
    background  : url('../img/fact-nav-sprite.jpg') -885px 0;
    height      : 170px;
    width       : 294px;
    text-indent : -9999px;
    display     : block;
    box-shadow  : 0 0 5px rgba(0, 0, 0, 0.5);
}

a.fact-addiction:hover, a.fact-nav-active-addiction {
    background-position : -885px -172px;
}

a.fact-truth {
    background  : url('../img/fact-nav-sprite.jpg') -1180px 0;
    height      : 170px;
    width       : 294px;
    text-indent : -9999px;
    display     : block;
    box-shadow  : 0 0 5px rgba(0, 0, 0, 0.5);
}

a.fact-truth:hover, a.fact-nav-active-truth {
    background-position : -1180px -172px;
}

#facts .fact-sources a {
    color           : black;
    font-weight     : bold;
    text-decoration : underline;
}

.fact-sources .fact-sources-title {
    display: flex;
    padding: 20px;
    border-bottom: 2px solid #30261C;
    align-items: center;
    font-size: 22px;
}

@media only screen and (min-width: 80em) {
    .fact-sources .fact-sources-title {
        font-size: 36px;
    }
}

.fact-sources-collapse {
    display: flex;
    flex-grow: 1;
    justify-content: flex-end;
}

.fact-sources-collapse > img {
    cursor: pointer;
    max-height: 26px;
}

.fact-sources .fact-list {
    display: block;
}

.fact-sources.collapsed .fact-list {
    display: none;
}

.fact-sources.collapsed .fact-sources-collapse-button {
    transform: rotate(180deg);
}

.fact-breath-heading, .fact-deforestation-heading {
    font-weight   : normal;
    font-family   : 'cartonslab';
    color         : #fff;
    border-top    : 1px solid #30261c;
    border-bottom : 1px solid #30261c;
    text-align    : center;
    font-size     : 36px;
    padding       : 10px 20px;
    margin        : 40px 0 0;
}

.fact-breath-heading p, .fact-deforestation-heading p, p.video-heading {
    font-size     : 18px;
    margin        : 10px 0 0;
    line-height   : 24px;
    margin-bottom : 5px;
    font-family   : 'cartonslab' !important;
}

.facts-flag {
    background : url('../img/fact-landing-flag.jpg');
    width      : 940px;
    height     : 413px;
    margin     : 50px;
}

#facts p {
    font-family : 'adobe-caslon-pro';
}

#facts a {
    color : #fff;
}

.animal-fact {
    font-family : 'cartonslab';
    font-size   : 18px;
    line-height : 24px;
}

.references a {
    color : #fff;
}

.references a:hover {
    color : #cf7019;
}

.references p {
    font-size : 14px;
}

.breath-image-tag {
    font-weight : normal;
    font-family : 'cartonslab';
    background  : #cf7019;
    padding     : 5px 10px;
    text-align  : center;

}

.sidebar-heading {
    font-family : 'cartonslab';
}

.chew-5 p a {
    width       : 275px;
    color       : #30261c;
    font-family : 'cartonslab';
    font-size   : 12px;
    word-wrap   : break-word;
}

.chew-5 p a:hover {
    color : #fff;
}

.addiction-1 {
    font-family : 'cartonslab';
    font-size   : 30px;
    text-align  : center;
}

.chew-1 {
    font-family : 'cartonslab';
    font-size   : 28px;
    text-align  : center;

}

.chew-2 {
    font-family : 'cartonslab';
    font-size   : 22px;
}

.chew-3 {
    font-family : 'adobe-caslon-pro';
}

.chew-4 p {
    font-family : 'cartonslab';
    font-size   : 22px;
}

/* -----------------------------------------
   Tour
----------------------------------------- */

a.facebook-rsvp {
    display     : block;
    text-indent : -9999px;
    background  : url('../img/facebook-rsvp.png') 0 0;
    height      : 20px;
    width       : 120px;
}

a.facebook-rsvp:hover {
    background-position : 0 -20px;
}

a.facebook-rsvp:active {
    background-position : 0 -40px;
}

.event-post {
    border-bottom  : 1px solid #30261c;
    padding-bottom : 20px;
    margin-bottom  : 20px;
}

.event-post h3 {
    font-size   : 18px;
    font-family : 'cartonslab';
    color       : #cf7019;
    font-weight : normal;
    margin      : 0;
    padding     : 0;
    line-height : inherit;
}

.event-meta {
    color         : #fff;
    font-family   : 'cartonslab';
    font-size     : 12px;
    margin-bottom : 20px;
    display       : block;

}

.event-post p {
    color       : #fff;
    font-family : 'adobe-caslon-pro';
    font-size   : 14px;
}

div.event-post:last-child {
    border-bottom : none;
}

.orbit-progress {
}

.fb-slider img {
    min-width : 100%;
}

/* -----------------------------
	footer
------------------------------ */
._4s7c {
    border : none 0px;
}

.footer-legal {
    color           : #fff;
    text-decoration : none;
}

.footer-legal:hover {
    color : #30261c;
}

/*
	New Nav
*/
.top-bar {
    border     : none !important;
    list-style : none !important;
    background : none !important;
    margin-top : 0px;
}

.top-bar .right {
    border-top    : 1px solid #cf7019 !important;
    border-bottom : 1px solid #cf7019 !important;
    list-style    : none !important;
    background    : #30261c !important;
    padding       : 10px !important;
}

.top-bar .right li a {
    background  : none !important;
    color       : #fff !important;
    font-family : 'cartonslab';
    font-size   : 24px !important;
}

.top-bar .right li a:hover {
    color : #cf7019 !important;
}

.top-bar.expanded .title-area {
    background : none !important;
}

.small-top .top-bar {
    border     : none !important;
    list-style : none !important;
    background : none !important;
    margin-top : 15px;
}

.small-top .top-bar .right {
    border-top    : 1px solid #cf7019 !important;
    border-bottom : 1px solid #cf7019 !important;
    list-style    : none !important;
    background    : #30261c !important;
    padding       : 10px !important;
}

.small-top .top-bar .right li a {
    background  : none !important;
    color       : #fff !important;
    font-family : 'cartonslab';
    font-size   : 24px !important;
}

.small-top .top-bar .right li a:hover {
    color : #cf7019 !important;
}

.small-top .top-bar.expanded .title-area {
    background : none !important;
}

@media only screen and (min-width : 768px) {

    .top-bar {
        border     : none !important;
        list-style : none !important;
        background : none !important;
        margin-top : 140px;
    }

    .top-bar .right {
        border-top    : 1px solid #cf7019 !important;
        border-bottom : 1px solid #cf7019 !important;
        list-style    : none !important;
        background    : #30261c !important;
        padding       : 10px !important;
    }

    .top-bar .right li a {
        background  : none !important;
        color       : #fff !important;
        font-family : 'cartonslab';
        font-size   : 24px !important;
    }

    .top-bar .right li a:hover {
        color : #cf7019 !important;
    }

    .small-top .top-bar {
        border     : none !important;
        list-style : none !important;
        background : none !important;
        margin-top : 25px;
    }

    .small-top .top-bar .right {
        border-top    : 1px solid #cf7019 !important;
        border-bottom : 1px solid #cf7019 !important;
        list-style    : none !important;
        background    : #30261c !important;
        padding       : 10px !important;
    }

    .small-top .top-bar .right li a {
        background  : none !important;
        color       : #fff !important;
        font-family : 'cartonslab';
        font-size   : 24px !important;
    }

    .small-top .top-bar .right li a:hover {
        color : #cf7019 !important;
    }

}
