/*
Theme Name: lawsofcolor
Theme URI: https://lawsofcolor.com/
Author: Vivid Software Solutions
Author URI: https://www.vividsoftwaresolutions.com/
Description: Custom WP theme for Laws of Color
*/
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,700|Oswald:400,700,300|Roboto+Slab:400,700,300,100|Raleway:300,400,700);
body {
    margin: 0;
    font-family: "Lora", sans-serif;
    -webkit-font-smoothing: antialiased;
    font-weight: normal;
    color: #666;
    font-size: 1.3125rem;
}

:root {
    font-size: 16px;
/*  --goldColor: #91735c;
    --greenColor: #0c6c73;*/
}

.home-entry h1 {
    font-size: 2.75rem;
    letter-spacing: 0.05rem;
    font-weight: normal;
    padding-bottom: 0.3em;
    line-height: 1.25;
    margin-top: 24px;
    margin-bottom: 15px;
}
.home-entry h2{
    font-size: 2.75rem;
    font-family: "Lora", sans-serif;
    clear: both;
    color: #91735c;
    /* font-weight: 600; */
    margin-top: 24px;
    margin-bottom: 15px;
}

.content p{
    font-family: "Lora";
    font-size: 1.3125rem;
    padding: 10px 0;
    line-height: 2.2rem;
}


/* HEADER ELEMENTS */
#header{ width: 100%;  background-color: #000; border-bottom: 1px solid #1b3649;}
#header h1{color: #ccc; font-size: 21px; padding: 0; margin: 10px 0 0 0; }
#header h2{color: #efefef; font-size: 12px; padding: 0; margin: 0; font-style: italic;}

.navbar-toggle{background-color: #2c6886;}
.navbar-toggle .icon-bar{border: 1px solid #fff;}

/* HOME ELEMENTS */
.splash-image{background: url("https://loc1.b-cdn.net/wp-content/themes/lawsofcolor/images/bg-splash.jpg") no-repeat top center; min-height: 598px; height: auto}
.headline{font-family: 'Oswald',Arial; font-size: 38px; font-weight: 700; color: #fff; line-height: 42px; padding-bottom: 5px;}
.video-holder {
    border: 6px #fff solid;
    -webkit-box-shadow: 0px 0px 21px 2px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 21px 2px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 21px 2px rgba(0,0,0,0.75);
}
.blue{color:#239aed}
.parallax-window {  min-height: 598px;  }
.payments{text-align: center;}
.trainer{ font-size: 16px; color:#fff; font-family: 'Raleway',Arial;}
.trainer img {padding: 0 10px;}

.course-about h3{font-family: 'Raleway', Arial; font-weight: 300; font-size: 40px; letter-spacing: 2px;}
.course-headline{font-weight: 700; font-size: 20px; padding-bottom: 10px;}
.course-desc {font-family: 'Raleway', Arial;font-size: 1.325rem;line-height: 34px}

.table-curriculum{font-family: 'Raleway', Arial; font-size: 16px;}
.table>tbody>tr>td {padding: 20px 0;}

table#bonus-table tr td {border: 0px; padding: 7px 10px;}

.home-page h1,.home-page h2, .home-page h3, .home-page h4, .home-page h5{
    font-family: 'Raleway', Arial; font-weight: 300; font-size: 40px; letter-spacing: 2px; color: #000; margin: 25px 0px;
}

.author a{color: #fff; text-decoration: none;}
.author a:hover{ color: #fff;text-decoration: underline}
/******BLOCK QUOTE TESTIMONIALS
	http://dabblet.com/gist/2932576
********/
.testimonial {
    margin: 0;
    /*background: #B7EDFF;*/
    padding: 10px 50px;
    position: relative;
    font-family: Georgia, serif;
    color: #999;
    border-radius: 5px;
    font-style: italic;
    /*text-shadow: 0 1px 0 #ECFBFF;*/
    /*background-image: linear-gradient(#CEF3FF, #B7EDFF);*/
}

.testimonial:before, .testimonial:after {
    content: "\201C";
    position: absolute;
    font-size: 80px;
    line-height: 1;
    color: #999;
    font-style: normal;
}

.testimonial:before {
    top: 0;
    left: 10px;
}
.testimonial:after {
    content: "\201D";
    right: 10px;
    bottom: -0.5em;
}
.arrow-down {
    width: 0;
    height: 0;
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
    border-top: 15px solid #B7EDFF;
    margin: 0 0 0 25px;
}
.testimonial-author {
    margin: 0 0 0 25px;
    font-family: Arial, Helvetica, sans-serif;
    color: #999;
    text-align:left;
}
.testimonial-author span {
    font-size: 12px;
    color: #666;
}

blockquote {border-left:none; font-size: 16px;  line-height: 24px; }
.carousel-caption{ position: relative; text-shadow: none; top:0px; left: 0px; right: 0px; bottom: 0px;}
.carousel-indicators li{background-color: #2aabd2; border: 1px solid #ccc}
.carousel-caption img{ padding: 10px 0;}


/* MAIN MENU NAVBAR */
.navbar{border-radius: 0; min-height: 46px; font-family: "Roboto Slab"; }
.navbar-nav>li>a {color: #2c6886; font-size: 16px;}
.navbar-nav>li>a:hover {color:#e3a010; font-size: 16px;}
.dropdown-menu>li>a{padding: 10px 20px;}

/* highlight current top level menu when active */
#menu-main-menu .current-menu-parent > a {  color:#e3a010; font-size: 16px;}

/* MAIN SUB MENU NAVBAR */
.navbar-inverse{background-color: #0b5178; border-color: #0b5178; border-top: 4px #3f8798 solid; margin-bottom: 0px;}
.navbar-inverse .navbar-nav>.active>a, .navbar-inverse .navbar-nav>.active>a:focus, .navbar-inverse .navbar-nav>.active>a:hover {  background-color: transparent;  }
.navbar-nav>li>a { padding-top: 10px; padding-bottom: 8px;}
.navbar-inverse .navbar-nav>li>a { font-family: "Roboto Slab"; font-size: 14px;  color: #fff;}
.navbar-inverse .navbar-nav>li>a:hover {color:lightblue;}
.navbar-inverse .navbar-nav>.open>a, .navbar-inverse .navbar-nav>.open>a:focus, .navbar-inverse .navbar-nav>.open>a:hover{background-color: #17325c;}
ul#menu-main-sub-menu { margin-left: 210px;}
.nav>li>a:focus, .nav>li>a:hover{background-color: transparent;}

/* ABOUT PAGE */
#about-header{background: url("./images/about-header.jpg") no-repeat top center; min-height: 433px; height: auto}
.ab-headline{
    padding-top: 100px;
    font-size: 120px;
    font-family: "Raleway",Arial;
    color: rgb(53, 53, 53);
    font-weight: 300;
}
.ab-byline{padding: 0 0 0 20px;}


/************************ COMMONLY SHARED LIB ***********************/
/* fade menu styles */
a {  transition: all .35s ease-in-out;  }
/* common pads */
.pad-top-15{padding-top: 15px;}
.pad-top-20{padding-top: 20px;}
.pad-top-30{padding-top: 30px;}
.pad-top-35{padding-top: 35px;}
.pad-top-40{padding-top: 40px;}
.pad-right-15{padding-right: 15px;}
.pad-right-20{padding-right: 20px;}
.pad-right-35{padding-right: 35px;}
.pad-right-40{padding-right: 40px;}
.pad-right-60{padding-right: 60px;}

/* vertical center an item */
.vertical-center {  display: flex;  align-items: center; }

/* centered columns styles */
.row-centered {  text-align:center; }
.col-centered {
    display:inline-block;
    float:none;
    /* reset the text-align */
    text-align:left;
    /* inline-block space fix */
    margin-right:-4px;
}
/************************** ./ *****************************/

/* WHITE BUTTON GOLD OUTLINE, GOLD FONTS */

.btn-gold { padding: 10px 30px;  font-family: "Roboto Slab";  font-weight: 700;  color:#fff; background-color: #167ac6  }
.btn-gold:hover {  background-color: transparent; border-color: #167ac6;   color: #167ac6; }
.btn-gold.disabled:hover,
.btn-gold.disabled:focus,
.btn-gold.disabled:active,
.btn-gold.disabled.active,
.btn-gold[disabled]:hover,
.btn-gold[disabled]:focus,
.btn-gold[disabled]:active,
.btn-gold[disabled].active,
fieldset[disabled] .btn-gold:hover,
fieldset[disabled] .btn-gold:focus,
fieldset[disabled] .btn-gold:active,
fieldset[disabled] .btn-gold.active {
    background-color: #e5bb60;
    border-color: #e5bb60;
}
/******* GOLD BUTTON WHITE FONTS ********/

.btn-gold-reverse {background-color: #167ac6;   color: #fff;  padding: 10px 30px;  font-family: "Roboto Slab";  font-weight: 700;   }
.btn-gold-reverse:hover {  background-color: transparent; border-color: #167ac6;   color: #167ac6; }
.btn-wide {width: 240px;}
.btn-100{width: 100%;  padding:15px 0;}

.home-page .btn-gold-reverse:hover {color:#167ac6; }


/* HOME BLOG */
.posttext img{ border: 1px solid #ccc;
    float: left;
    margin: 5px 15px 10px 0;
    padding: 4px;
}
.postbody h3{color: #666; margin-top: 0px; font-size: 24px;font-family: 'Open Sans', arial, sans-serif;}
.postbody h3 a{color: #333; text-decoration: none}
.postbody h3 a:hover {color: #1388c0; text-decoration: none;}
.posttext{float: left}
.posttext p a, .posttext p a:hover {text-decoration: underline; color: #337ab7}
.posttext p{font-family: 'Open Sans', arial, sans-serif; font-size: 16px; color: #666;  line-height: 22px}
.blog-post{float: left; padding: 15px 0px; border-bottom: 1px solid #f1f1f1}
.date{clear: both; color: lightgray}

/* FOOTER ELEMENTS */
footer{background-color: #263238;  padding:25px 0px 20px 0px; margin-top: 40px;}
.privacy{font-size: 13px;}
.ftr-text{color: #546e7a; font-size: 12px; line-height: 20px;}
.ftr-wide-links a{font-family: "Roboto Slab"; color: #cfcfcf; font-weight: 300; font-size: 16px}
.ftr-wide-links a:hover{font-family: "Roboto Slab"; color: #e5bb60}

article.single-post h1 {font-family: "Lora", sans-serif; font-size: 2rem;}

/****************** SIDE MENU ******************/
.menu-cap{font-family: "Roboto Slab"; font-size: 22px;font-weight: 300; color:#263238; padding-top: 12px;}
.menu-cap-right{font-family: "Roboto Slab"; font-size: 25px;font-weight: 300; color:#263238; padding:17px 0px 7px 22px; }
.side-menu {padding-top: 25px;}
.side-menu ul li ul{margin-left:20px;}
.side-menu ul{
    list-style: none outside none;
    margin: 0;
    padding: 0;
    width: 100%;
}
.side-menu ul li{
    border-bottom: 1px solid #8399a4;
    font-family: 'Roboto Slab',sans-serif;
    font-size: 14px;
    list-style: none outside none;
    padding: 10px 0;
    border-bottom:none;
    background:linear-gradient(#3f8798,#3f8798) bottom left /* left or right or else */ no-repeat;
    background-size:15% 1px;
    font-weight:300;
}
.side-menu ul li a{
    color: #8399a4;
    display: block;
    font-family: 'Roboto Slab',sans-serif;
    padding: 0.3em 0.5em 0.3em 2px;
    text-decoration: none;
    width: 100%;
}
.side-menu ul li a:hover{
    /*background-color: #e8f7ff;*/
    display: block;
    font-family: 'Roboto Slab',sans-serif;
    padding: 0.3em 0.5em 0.3em 2px;
    text-decoration: none;
    width: 100%;
    color: #e3a010;
}
.side-menu ul li.current_page_item > a {
    /*background-color: #dcf2ff;*/
    /*color: #ba2c5e;*/
    /*font-weight: bold;*/
}
/* SIDEBAR COLLAPSE*/
.side-menu ul.sub-menu {display: none;}
.side-menu .current_page_parent ul.sub-menu {display: block;}
.side-menu .current_page_ancestor ul.sub-menu {display: block;}
.side-menu li.current-menu-item ul.sub-menu {display: block;}
.side-menu ul.sub-menu li.current-menu-item ul.sub-menu {display: block;}
.side-menu ul.sub-menu ul.sub-menu {display: none;}
.side-menu ul.sub-menu li.current_page_ancestor ul.sub-menu {display: block;}
.side-menu a {color: #666666;}
.side-menu li.current-menu-item a {color: #e3a010;}
.side-menu li.current-menu-item ul.sub-menu a {color: #666666;}
/*end side menu*/

.side-menu img { padding: 10px 0;}

ul#features {margin: 0; padding-left: 25px;}
ul#features li{list-style: none outside none; padding: 5px 0 5px 20px; color:#fff; font-size: 20px;
    background: url('./images/check.png') no-repeat left center; }
ul#features li a{text-decoration: none; color: #fff; border-bottom: 1px dotted #fff;}
ul#features li a:hover{color: #fff; border-bottom: 1px dotted #c7ddef;}

ul#features-black {margin: 0; padding-left: 25px;}
ul#features-black li{list-style: none outside none; padding: 5px 0 5px 20px; color:#353535; font-size: 16px;
    background: url('./images/check-black.png') no-repeat left center; font-family: 'Raleway', Arial;}
ul#features-black li a{text-decoration: none; color: #fff; border-bottom: 1px dotted #fff;}
ul#features-black li a:hover{color: #fff; border-bottom: 1px dotted #c7ddef;}


.assistive-text {
    clip: rect(1px 1px 1px 1px);
    clip: rect(1px, 1px, 1px, 1px);
    position: absolute !important;
}

.page-content{color:#263238; padding-top: 20px; font-weight: 300; font-size: 16px;}
.page-content p{line-height: 26px; margin-bottom: 20px; }
.page-content h1{font-family: "Roboto Slab"; font-size: 36px;color:#263238;font-weight: 300;}
.page-content h2{font-family: "Roboto Slab"; font-size: 28px;color:#263238;font-weight: 300;}
.page-content h3{font-family: "Roboto Slab"; font-size: 28px;color:#263238;font-weight: 300;}
.page-content h4{font-family: "Roboto Slab"; font-size: 28px;color:#263238;font-weight: 300;}

.right-menu{
    background-color: #eff4f5;
    border-top: 4px solid #3f8798;
    margin-top: 40px;
}

span.caret {
    color: #e3a010;
}

.nav .open>a, .nav .open>a:focus, .nav .open>a:hover {
    background-color: transparent;
    border-color: #337ab7;
}

.contact-us{ width: 100%; padding: 7px 20px;font-size: 18px; color: #333; font-weight: 300;}
.contact-phone{width: 100%; padding: 7px 20px; font-size: 18px; color: #333; font-weight: 300;}
.contact-email{width: 100%; padding: 7px 20px; font-size: 18px; color: #333; font-weight: 300;}
.contact-email a{text-decoration: none; color: #333; font-weight: 300;}
.contact-email a:hover{text-decoration: none;color:#e3a010; font-weight: 300;}

.img-shaddow{
    -webkit-box-shadow: 0px 0px 12px -1px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 12px -1px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 12px -1px rgba(0,0,0,0.75);
}
.wrap-left{
    float: left;
    padding: 4px;
    margin: 0px 20px 10px 0px;
}



/* Responsive
-------------------------------------------------- */

@media (min-width: 1200px) {
    #header h1{ text-align: center}
    #header h2{ text-align: center}
    .headline{padding-top: 10px;}
    ul#features{padding-bottom: 10px;}
    .payments{padding-top: 10px;}
}

@media (max-width: 1200px) {

}

@media (max-width: 991px) {
    ul#features{padding:0px 0 10px 0px;}
    ul#features li{font-size: 16px; padding: 2px 0px 2px 20px;}
    .headline{font-size: 24px;}
    .navbar {margin-bottom: 0px;}
}

@media (min-width: 768px) {

}

@media (min-width: 768px) and (max-width: 991px) {
}

@media (max-width: 767px) {

}
/* Landscape phones and down  xs */
@media (max-width: 480px) {
    .table-curriculum{font-family: 'Raleway', Arial; font-size: 13px;}
    .home-page h1,.home-page h2, .home-page h3, .home-page h4, .home-page h5{font-size: 30px;}
}