/** COLOR PALETTE
 * # rgb(218,41,28,1)		RED (PANTONE 485 C)
 * # rgb(218,41,28,.8)		RED_ALT
 * # 01B320					GREEN
 * # 047E90					BLUE
 * # EB7102					GOLD
 *
 * # 000000					BLACK
 * # 161616					GREY_DRK
 * # 323232					GREY_MED 
 * # 484848					GREY_LHT
 * # rgb(255,255,255,1)		WHITE
 * # rgb(255,255,255,.9)	WHITE_DRK
 * # rgb(255,255,255,.8)	WHITE_MED
 * # rgb(255,255,255,.7)	WHITE_LHT
 */
/* Base Styles
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/* NOTE
html is set to 62.5% so that all the REM measurements throughout Skeleton
are based on 10px sizing. So basically 1.5rem = 15px :) */

body {
    background-color: #000;
    color: #FEFEFE;
    font-family: "Muli", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
/* Buttons
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.button,
button,
input[type="submit"],
input[type="reset"],
input[type="button"] {
    color: #FEFEFE;
    border-color: #FEFEFE;
    outline: 0;
}

.button-smlblk {
    color: #000000;
    border-color: #000000;
    text-align:left;
    width: 180px;
}


.button-inside {
	background-color:rgba(0,0,0,.9);
}



.button:hover,
.button-inside:hover,
.button-inside:hover,
button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover,
.button:focus,
.button-inside:focus,
button:focus,
input[type="submit"]:focus,
input[type="reset"]:focus,
input[type="button"]:focus {
    color: rgba(255,255,255,1);
    border-color: rgba(255,255,255,.8);
    background-color: rgba(218,41,28,1);
    text-decoration:none;
    outline: 0;
}
/* Links
–––––––––––––––––––––––––––––––––––––––––––––––––– */

a {
	color: rgba(218,41,28,1);
    text-decoration: none;
}
a:hover {
	color: rgba(218,41,28,.8);
    text-decoration: underline;
}
a span.text-white {
    color: #FEFEFE;
    font-weight: 500;
}
a span.text-grey {
    color: #888888;
}
/* Links
–––––––––––––––––––––––––––––––––––––––––––––––––– */

ul {
    list-style: none;
}
/* NavBar
----------------------------------------------------*/

.header {
    margin-top: 6rem;
    text-align: center;
}
.docs-header {
    text-transform: uppercase;
    font-size: 1.4rem;
    letter-spacing: .2rem;
    font-weight: 600;
}
.docs-section {
    border-top: 1px solid #eee;
    padding: 4rem 0;
    margin-bottom: 0;
}
.value-prop {
    margin-top: 1rem;
}
.value-props {
    margin-top: 4rem;
    margin-bottom: 4rem;
}
.value-img {
    display: block;
    text-align: center;
    margin: 2.5rem auto 0;
}
.heading-font-size {
    font-size: 1.2rem;
    color: #FEFEFE;
    letter-spacing: normal;
}
.docs-example .row,
.docs-example.row,
.docs-example form {
    margin-bottom: 0;
}
.docs-example h1,
.docs-example h2,
.docs-example h3,
.docs-example h4,
.docs-example h5,
.docs-example h6 {
    margin-bottom: 1rem;
}
.heading-font-size {
    font-size: 1.2rem;
    color: #FEFEFE;
    letter-spacing: normal;
}
.navbar {
    display: none;
}
/* Site Specific
----------------------------------------------------*/

.map-height-short {
    height: 400px;
}
.bg-example {
    display: none;
}
#hero_carousel {
    display: none;
}
h1.section-head {
    font-size: 2.4rem;
    font-weight: 600;
    margin-bottom: 3rem;
}
h6.section-head {
    font-size: 1.8rem;
    font-weight: 600;
    margin-bottom: 1.2rem;
}
h5.section-head {
    position: relative;
}
h5.section-head:before {
    border-color: #666;
    top: -.6rem;
    bottom: -.6rem;
    left: -1.8rem;
    content: "";
    display: block;
    position: absolute;
    margin: auto;
    width: 2rem;
    border: 1px solid #666;
    border-right: 0;
    z-index: 0;
}
h5.section-head:after {
    clear: both;
    content: " ";
}
div.FooterA {} div.FooterB {
    background-color: #161616;
}
div.FooterA p,
div.FooterA ul,
div.FooterB p,
div.FooterB ul {
    color: #888888;
}
/* Larger than phone */

@media (min-width: 550px) {
    .header {
        margin-top: 18rem;
    }
    .value-props {
        margin-top: 9rem;
        margin-bottom: 7rem;
    }
    .value-img {
        margin-bottom: 1rem;
    }
}
/**
 <img style="-webkit-user-select: none;background-position: 0px 0px, 10px 10px;background-size: 20px 20px;background-image:linear-gradient(45deg, #eee 25%, transparent 25%, transparent 75%, #eee 75%, #eee 100%),linear-gradient(45deg, #eee 25%, white 25%, white 75%, #eee 75%, #eee 100%);cursor: zoom-in;" src="http://getskeleton.com/examples/landing/images/values-bg.jpg" width="1456" height="910">
 */
/* Larger than tablet */

@media (min-width: 750px) {
    /* Navbar */
    
    .navbar + .docs-section {
        border-top-width: 0;
    }
    .navbar,
    .navbar-spacer {
        display: block;
        width: 100%;
        height: 6.5rem;
        background: rgba(218,41,28,.95);
        z-index: 99;
        border-top: 1px solid #eee;
        border-bottom: 1px solid #eee;
    }
    .navbar-spacer {
        display: none;
    }
    .navbar > .container {
        width: 100%;
    }
    .navbar-list {
        list-style: none;
        margin-bottom: 0;
    }
    .navbar-item {
        position: relative;
        float: left;
        margin-bottom: 0;
    }
    .navbar-link {
        text-transform: uppercase;
        font-size: 1.2rem;
        font-weight: 600;
        letter-spacing: .2rem;
        margin-right: 35px;
        text-decoration: none;
        line-height: 6.5rem;
        color: rgba(255,255,255,.95);
    }
    .navbar-link.active {
        color: rgba(255,255,255,.95);
    }
    .navbar-link:hover {
        color: rgba(255,255,255,.95);
    }
    .has-docked-nav .navbar {
        position: fixed;
        top: 0;
        left: 0;
    }
    .has-docked-nav .navbar-spacer {
        display: block;
    }
    /* Re-overiding the width 100% declaration to match size of % based container */
    
    .has-docked-nav .navbar > .container {
        width: 80%;
    }
    /* Popover */
    
    .popover.open {
        display: block;
    }
    .popover {
        display: none;
        position: absolute;
        top: 0;
        left: 0;
        background: rgba(255,255,255,.95);
        border: 1px solid #eee;
        border-radius: 4px;
        top: 92%;
        left: -50%;
        -webkit-filter: drop-shadow(0 0 6px rgba(0, 0, 0, .1));
        -moz-filter: drop-shadow(0 0 6px rgba(0, 0, 0, .1));
        filter: drop-shadow(0 0 6px rgba(0, 0, 0, .1));
		z-index:999;
    }
    .popover-item:first-child .popover-link:after,
    .popover-item:first-child .popover-link:before {
        bottom: 100%;
        left: 50%;
        border: solid transparent;
        content: " ";
        height: 0;
        width: 0;
        position: absolute;
        pointer-events: none;
    }
    .popover-item:first-child .popover-link:after {
        border-color: rgba(255, 255, 255, 0);
        border-bottom-color: #ccc;
        border-width: 10px;
        margin-left: -10px;
    }
    .popover-item:first-child .popover-link:before {
        border-color: rgba(238, 238, 238, 0);
        border-bottom-color: #ccc;
        border-width: 11px;
        margin-left: -11px;
    }
    .popover-list {
        padding: 0;
        margin: 0;
        list-style: none;
    }
    .popover-item {
        padding: 0;
        margin: 0;
    }
    .popover-link {
        position: relative;
        color: #323232;
        display: block;
        padding: 8px 20px;
        border-bottom: 1px solid #eee;
        text-decoration: none;
        text-transform: uppercase;
        font-size: 1.2rem;
        font-weight: 600;
        text-align: center;
        letter-spacing: .2rem;
    }
    .popover-item:first-child .popover-link {
        border-radius: 4px 4px 0 0;
    }
    .popover-item:last-child .popover-link {
        border-radius: 0 0 4px 4px;
        border-bottom-width: 0;
    }
    .popover-link:hover {
        color: #323232;
        background: rgba(0,0,0,.1);
    }
    .popover-link:hover,
    .popover-item:first-child .popover-link:hover:after {
        border-bottom-color: rgba(0,0,0,.1);
    }
    .bg-example {
        background-image: url(../images/example-bg.jpg);
        background-position: center center;
        background-size: cover;
        display: block;
    }
    #hero_carousel {
        display: inline-block;
        width: 960px;
        height: 390px;
        overflow: hidden;
    }
    #hero_carousel ul {
        width: 1920px;
        padding: 0;
        margin: 0;
    }
    #hero_carousel ul li {
        width: 960px;
        text-align: center;
        height: 390px;
        list-style: none;
        float: left;
    }
    #hero_carousel ul li div.hero_wrapper {
        padding: 4rem;
        vertical-align: top;
    }
    #hero_carousel div.hero_wrapper>img {
        box-shadow: 0 0 .6rem .6rem rgba(0, 0, 0, 0.50), 0 0 1.8rem 1.8rem rgba(0, 0, 0, 0.2);
        display: inline-block;
        height: 300px;
        margin: 0 2rem;
    }
    #hero_carousel div.hero_wrapper>div {
        display: inline-block;
        height: 300px;
        margin: 0 2rem;
        text-align: left;
        vertical-align: top;
    }
}

/* Larger than desktop */
@media (min-width: 1000px) {} 

/* Larger than Desktop HD */
@media (min-width: 1200px) {}


.icon-stack {
    font-size: 2rem;
    color: #FEFEFE;
    margin-right: .6rem;
}


/* header logo and phone text */
div.logo_header {
    margin: 4rem auto 2rem auto
}
div.logo_header .logo_image {
    display:block;    
}
div.phone_link {
	display: inline-block;
	border-left:0;
    margin:1rem;
}
a.phone-link {
    float: none;
    position: relative;
    color: #FEFEFE;
    text-align: left;
    letter-spacing: 1.2px;
}
a.phone-link:hover,
a.phone-link:focus,
a.phone-link:active {
    text-decoration: none;
}
a.phone-link span {
    text-align: left;
    width: auto;
    height: auto;
}
a.phone-link .phone-num {
    display: block;
    position: static;
    font-size: 2rem;
    font-weight: 500;
    margin-left: 1.5rem;
}
a.phone-link .head_hours {
    display: block;
    font-size: 1.5rem;
    font-weight: 300;
    margin-left: 1.5rem;
}
/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 550px) {}

/* Larger than tablet */
@media (min-width: 750px) {}

/* Larger than desktop */
@media (min-width: 1000px) {	
	div.logo_header .logo_image {
		display: inline-block;
		vertical-align: middle
	}
	div.phone_link {
		display: inline-block;
		vertical-align: middle;
		border-left: 2px solid #fefefe;
		margin: 2rem;
		margin-bottom: 0;
	}
}

/* Larger than Desktop HD */
@media (min-width: 1200px) {}
/*	
  -moz-box-shadow: rgba(0, 0, 0, 0.8) 3px 3px 10px inset;
  -webkit-box-shadow: rgba(0, 0, 0, 0.8) 3px 3px 10px inset;
  box-shadow: rgba(0, 0, 0, 0.8) 3px 3px 10px inset;
  -webkit-transition: box-shadow 0.2s ease-in;
  -moz-transition: box-shadow 0.2s ease-in;
  transition: box-shadow 0.2s ease-in;
  */