/*   Aminos MAIN CSS  

SECTIONS
	
1. Core Styling
2. 
3. Section 1 (fold)
4. Section 2 ()
Turquoise
#26CAD3

*/
@import url(https://fonts.googleapis.com/css?family=Oswald:400,300,700);
@import url(https://fonts.googleapis.com/css?family=Roboto:400,700);

/*    Core Styling body, p, headers, etc..   */

body {
    font-family: 'Oswald', Helvetica;
    background: #F6F6F6;
}

p {
    font-family: 'Roboto', 'Open Sans', helvetica, sans-serif;
    margin-bottom: 10px;
    font-size: 16px;
}

nav ul li {
}

.navbar { border-bottom:5px solid #26CAD3; }

.navbar-nav > li > a {
    line-height: 51px;
}

.logo {padding-top: 10px;}

.black-bg {
    background-color: #000;
    color: #fff;
}

.white-bg {
    background-color: #ffffff;
    color: #000;
    overflow: hidden;
}

.grey-bg {
    background-color: #2e2e2e;
    color: #fff;
}

.light-grey-bg {
    background-color: #f1f0f0;
    color: #000;
}

.yellow-bg {
    background-color: #FFD700;
}

.turquoise-bg {
    background-color: #14D7F2;
}

.video-container{
    border: 10px solid black;
    border-radius: 10px;
    }

h1, h2, h3, h4 {
    text-transform: uppercase;
    font-family: 'Oswald';
    letter-spacing: 1.2px;
}

h3 span {
    color: #66d01a;
}

h2,h3,h4 {margin :15px auto;}

.first {
    font-size: 1.2em;
    color: #FF4500;
    font-style: italic;
    margin-right: 5px;
}

.turquoise-bar, .yellow-bar {
    background-color: #14D7F2;
    padding: 10px 20px;
    margin: 10px auto;
    width: auto;
    text-align: center;
}

.grey-bar {
    background-color: #777;
    padding: 10px 20px;
    margin: 10px auto;
    width: auto;
    text-align: center;
}

.red-bar {
    background-color: #ff0000;
    padding: 10px 20px;
    margin:;
    width: auto;
    text-align: center;
}

.white-text {
    color: #fff;
}

.black-text {
    color: #000;
}

.black-shadow {
    box-shadow: 3px 3px 0px #000000 !important;
}


.btn-buy {
    width: 100% !important;
}

.spacer-big {
    content: "";
    height: 100px;
    margin: 20px auto;
    width: 100%;
}

.spacer-small {
    content: "";
    height: 50px;
    margin: 10px auto;
    width: 100%;
}

.spacer-xsmall {
    content: "";
    height: 10px;
    margin: auto;
    width: 100%;
}

/*    Fold Section   --->  Section 1   */

#player_wrapper {
    /*background: url('/assets/img/reload/video-bg.jpg') no-repeat;*/
    background-size: 100% 100%;
    padding: 20px;
}

.ingredients {
    text-transform: uppercase;
    background: url('') no-repeat;
    background-position: right center;
    background-size: 800px auto;
    overflow: visible;
    padding: 40px 20px;
}

.ingredients ul {
    margin-top: 10px;
}

.ingredients ul li {
    list-style-image: url('/assets/img/reload/check.png');
    list-style-position: inside;
    margin-top: 10px;
}

.box {
    border: solid #919191 1px;
    margin: 10px;
    padding: 10px;
    box-shadow: 2px 2px 5px #e3e3e3;
}

.vcenter {
    vertical-align: middle;
}

a.list-group-item.active, a.list-group-item.active:hover, a.list-group-item.active:focus {
    background-color: #FFD700;
    border-color: #FFD700;
    color: #000;
    z-index: 2;
    text-transform: uppercase;
}

.glyphicon.glyphicon-ok {
    color: green;
    float: left;
    padding-right: 10px;
    vertical-align: middle;
}

.glyphicon.glyphicon-remove {
    color: red;
    float: left;
    vertical-align: middle;
}

.fastaction {
    min-height: 520px;
}

.list-group {
}


/*    The Answer Section   --->  Section 2   */
#section1 {
    padding:;
}

#section1 h2, #section1 p {
    margin-top: 20px;
}

#white1 {
    background: url('/assets/img/reload/white_top.png') no-repeat;
    background-position: left top;
    background-size:;
}

#white01 {
    background: url('/assets/img/reload/white-left.png') no-repeat;
    background-position: left top;
    background-size: 100% auto;
}

#black2 {
    background: url('/assets/img/reload/white-left.png') no-repeat;
    background-position: left top;
    background-size: 100% auto;
}

/*    Ingredients Section   --->  Section 3   */

#ing1 {
    min-height: 120px;
    background-image: url('/assets/img/reload/ing_1.png');
    padding-left: 86px;
    background-position: left top;
    background-repeat: no-repeat;
}

#ing2 {
    min-height: 120px;
    background-image: url('/assets/img/reload/ing_2.png');
    padding-left: 86px;
    background-position: left top;
    background-repeat: no-repeat;
}

#ing3 {
    min-height: 120px;
    background-image: url('/assets/img/reload/ing_3.png');
    padding-left: 86px;
    background-position: left top;
    background-repeat: no-repeat;
}

#ing4 {
    min-height: 120px;
    background-image: url('/assets/img/reload/ing_4.png');
    padding-left: 86px;
    background-position: left top;
    background-repeat: no-repeat;
}

/*    Testosteron Stages Section   --->  Section 4   */

.test-stage {
    min-height: 100px;
    opacity: .6;
    padding: 10px 10px 10px 30px;
    margin-bottom: 10px;
}

.test-stage:before {
    content: "";
    background-image: url('/assets/img/reload/yellow-left-up.png');
    background-size: cover;
    position: absolute;
    left: -99px;
    top: 0px;
    min-height: 101px;
    min-width: 100px;
}

.test-stage:hover {
    opacity: 1;
}

.test-stage:hover > .test-stage-pic {
    visibility: visible;
}

.test-stage-pic {
    position: absolute;
    right: 00px;
    top: 0px;
    height: 100px;
    visibility: hidden;
}

.red-text {
    color: #ff0000;
}

.grey-text {
    color: #777;
}

.red-arrow ul li {
    list-style-image: url('/assets/img/afterburnfuel/secondary/red_arrow.png');
}

.red-arrow li {
    list-style-position: inside;
    padding: 0px 0px 10px 30px;
}

.glyphicon {
    -moz-osx-font-smoothing: grayscale;
    display: inline;
    font-family: "Glyphicons Halflings";
    font-size: ;
    font-style: normal;
    font-weight: normal;
    line-height: ;
    position: relative;
    top: ;
}
.glyphicon-check {
    color: green;
}

/* RESPONSIVE  TWEAKS */

/* PHONES LESS THAN 768px*/

@media (max-width: 768px) {

    .btn-buy, .btn-lrg {
        font-size: .8em;
        width: 100% !important;
        margin-right: auto;
        margin-left: auto;
        height: autos;
        padding: 10px;
        display: block;
    }

    .container {
        width: 100%;
    }

}

/* Tablets 768px to 991px */
@media (min-width: 768px ) and (max-width: 991px ) {

    .yellow-stripe-left:before {
        content: "";
        background-image: url('/assets/img/reload/yellow-left-down.png');
        background-size: contain;
        background-repeat: no-repeat;
        position: absolute;
        height: 102px;
        width: 120px;
        left: -87px;
        top: -2px;
    }

    .yellow-stripe-left:after {
        content: "";
        background-image: url('/assets/img/reload/yellow-right-up.png');
        background-size: contain;
        background-repeat: no-repeat;
        position: absolute;
        height: 100px;
        width: 120px;
        right: -105px;
        top: 0px;
    }

    .btn-buy, .btn-lrg {
        font-size: .6em;
        width: 100% !important;
        margin-right: auto;
        margin-left: auto;
        height:;
        padding: 10px;
    }

    .container {
        width: 100%;
    }

}

/* Desktops 992px to 1199px */
@media (min-width: 992px ) and (max-width: 1199px ) {

}

/* Desktops 1200px and Up - Retina Desktops */
@media (min-width: 1200px ) {

}

/* Mobile 768px and Below - Phones to Tablets */
@media (max-width: 768px ) {

    .yellow-stripe-left:before {
        top: -1px;
    }

    .yellow-stripe-left:after {

        top: 0px;
    }

}

.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 5px;
    height: 0;
    overflow: hidden;
}

.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

#player_wrapper {
    height: auto;
}

#video-container {
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
}

.img-circle {border:4px solid gray ; }