﻿body {
    /*padding-top: 50px;
    padding-bottom: 20px;*/
    padding: 0px;
    margin: 0px;
    font-family: 'Source Sans Pro';
    font-weight: lighter;
    color: #4d3a35;
    background-color: #ffffff;
}

/*For raise*/


.profileDropWt {
    border: solid 1px #808080;
    position: absolute;
    z-index: 2000;
    margin-left: -100px;
    width: 230px;
    font-size: 30px;
    background-color: #f5ece3;
    display: none;
}




.bottomPage {
    clear: both;
    margin-left: auto;
    margin-right: auto;
    width: 600px;
    height: 600px;
    /*background-color: aqua;*/
    color: #331710;
    font-size: 24px;
    /*position: relative;*/
    /*margin-top: 730px;*/
}

.goldType {
    color: #e9ad3f;
    padding-left: 45px;
    /*background-color: #ffffff;*/
    padding-bottom: 100px;
}
.benefits{
    width:1100px;
    margin-left:auto;
    margin-right:auto;
    /*background-color:antiquewhite;*/

}
.goldTypeHr {
    color: #e9ad3f;
    border-color: #e9ad3f;
    background-color: #e9ad3f;
    border-style: solid;
    width: 370px;
}

.featureLine {
    float: left;
    padding-top: 20px;
}

.goldLtr {
    /*color: #cac2c1;*/
    color: #ffffff;
    text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black, 0 0 10px black;
}

.hrDiv {
    float: left;
    padding: 20px
}

.svgFeature {
    /*width: 80px;*/
    /*text-align: center;*/
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 50%;
    height:130px;
}

.svgTitle{
    font-weight:bold;
}

.svg {
    float: left;
    min-width: 250px;
    text-align: center;
}

.svgCopy {
    max-width: 190px;
    margin: 15px;

}

/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
    max-width: 280px;
}



.indexPage {
    background: url(/img/background.jpg);
    /* z-index: -1; */
    background-size: cover;
    /**/
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: bottom left;
    /*background-position-y:-310px;*/
    position: relative;
    min-height: 400px;
}

.FBLogo {
    background: url(/img/logo-light.svg) no-repeat center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-position: top left;
    position: relative;
}

.FBMainCopy {
    width: 600px;
    margin-top: 60px;
    margin-left: auto;
    padding-left: 25px;
    margin-right: auto;
    padding-top: 5px;
    font-family: 'Source Sans Pro';
    height: 60px;
    font-size: 20px;
    text-shadow:none;
    color: #fff;
    /*background: linear-gradient(to left, rgba(85,118,88,.4),rgba(85,118,88,7));*/
    /*opacity: 0.9;*/
}

.mission {
    /*background-color: #f5ece3;*/
    
}



@font-face {
    font-family: 'SOURCESANSPRO-BLACK';
    src: url('../fonts/SOURCESANSPRO-BLACK.OTF') format('opentype');
}


@font-face {
    font-family: 'Source Sans Pro';
    src: url('../fonts/SourceSansPro-Regular.ttf') format('truetype');
}





@font-face {
    font-family: 'HIND REGULAR';
    src: url('../fonts/HIND REGULAR.TTF') format('truetype');
}

@font-face {
    font-family: 'GT-PRESSURA-MONO-TRIAL-REGULAR';
    src: url('../fonts/GT-PRESSURA-MONO-TRIAL-REGULAR.OTF') format('opentype');
}


/* from asweb  */

.FBBullets {
    min-height: 400px;
    margin-left: auto;
    margin-right: auto;
    width: 700px;
    font-size: 16px;
}

    .FBBullets header {
        padding-top: 20px;
    }


.fbIntro {
    padding-top: 20px;
    color: #76caa8;
    font-family: 'Source Sans Pro';
    font-size: 36px;
}


.bulletTop {
    margin-top: 60px;
    /*padding-bottom:20px;*/
    font-size: 24px;
}

/*flex section */
.thirdSection {
    /*background: url(/images/texture.jpg);*/
    /*background-position-y:-20px;*/
    background-size: cover; /* <------ */
    background-repeat: repeat;
    background-color: #f5ece3;
    /*position: absolute;*/
    /*width: 100%;
    height: 690px;*/
}

.bottomStructure {
    /*background: url(/img/features.jpg);*/
    background-size: cover; /* <------ */
    background-repeat: no-repeat;
    background-position: left left;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    /*float: left;
    top:-10px;
    position: relative;
    z-index: 0;
    display: inline-block;*/
    /*max-width: 700px;
    max-height: 550px;*/
}

.brownRight {
    /*width: 550px;
    height: 250px;*/
    background-color: #fdaa7e;
    /*z-index: 100;
    float: right;
    position: absolute;
    right: 0;*/
    /*top: 15px;*/
    color: #fff;
    padding-left: 50px;
    padding-right: 50px;
    padding-top: 25px;
    padding-bottom: 35px;
    height: 255px;
}

    .brownRight article {
        /*padding-top: 10px;*/
    }



.clearRightBox {
    /*width: 550px;
    height: 390px;*/
    margin-right: 30px;
    /*background-color: #fff;*/
    /*float: right;
    z-index: 100;
    position: absolute;*/
    /*color: #46363f;*/
    color: #fff;
    /*opacity: 0.7;*/
    /*right: 0;
    top: 280px;*/
    padding-left: 50px;
    padding-right: 50px;
    padding-top: 25px;
    padding-bottom: 25px;
}


/* flex classes added to above */
.mainDiv {
    display: flex;
    flex-direction: row;
}

.leftSide {
    order: 1;
    height: 55vh;
    width: 300px;
    /*background-color: aqua;*/
}

.rightSide {
    /*display: flex;
            flex-direction: column;*/
    order: 2;
}




footer {
    background-color: #6b5e65;
    height: 60px;
    line-height: 50px !important;
    vertical-align: middle;
    color: #ffffff;
    margin-top: -20px;
}

.contactButton {
    clear: both;
    padding-top: 50px;
    text-align: center;
    color: #331710;
    clear: both;
    text-align: center;
    border-radius: 8px;
    width: 125px;
    border: 5px solid #cac2c1;
    padding: 8px;
    margin-left: auto;
    margin-right: auto;
    font-weight: bold;
}

    .contactButton a, .contactButton a:hover, .contactButton a:visited {
        text-decoration: none;
        color: #331710;
    }
.points {
    background-color: #f5ece3;
    display: flex;
    flex-direction: column;
}

.pointFlex1 {
    width: 900px;
    margin-left: auto;
    margin-right: auto;
    order: 1;
}

.perfectPoints ul li {
    padding-top: 15px;
}

.perfectTitle {
    padding-top: 40px;
    font-size: 20px;
    color: #76caa8;
    font-family: 'GT-PRESSURA-MONO-TRIAL-REGULAR';
}

.headsContain {
    display: inline-block;
}

.heads {
    max-width: 150px;
}

.names {
    color: #f5ece3;
}


.content, footer {
    min-width: 395px;
}


/*@media (min-width: 600px) {
    

}*/
@media (max-width: 400px) {
    .mainDiv {
        display: flex;
        flex-direction: row;
    }

    .indexPage {
        min-width: 400px;
        min-height: 200px;
    }

    .FBLogo {
        width: 50px;
        height: 35px;
        margin-left: 25px;
        margin-top: 20px;
    }

    .FBMainCopy {
        width: 200px;
        font-size: 1em;
        margin-top: 10px;
        height: 35px;
    }

    .FBBullets {
        width: 330px;
        font-size: .7em;
    }

    .fbIntro {
        font-size: 1.8em;
    }

    .brownRight {
        padding-left: 10px;
        font-size: .7em;
        padding-right: 20px;
        padding-top: 10px;
        padding-bottom: 15px;
    }

    .mainDiv {
        flex-direction: column;
        min-width: 395px;
    }

    .leftSide {
        width: 100%;
    }

    .pointFlex1 {
        width: auto;
        font-size: .9em;
    }

    article ul {
        padding-right: 20px;
    }

    .perfectTitle {
        font-size: 1.2em;
        padding-left: 15px;
        text-align: center;
    }
}


/* Desktops and laptops ----------- */
@media  (min-width : 600px) {
   
    .mainDiv {
        display: flex;
        flex-direction: row;
    }

    .indexPage {
        /*height: 500px;*/
        min-width:600px;
    }


    .thirdSection {
        width: 600px;
        margin-left: auto;
        margin-right: auto;
    }

    .leftSide {
        order: 1;
        height: auto;
        width: 300px;
    }

    .FBLogo {
        width: 100px;
        height: 75px;
        margin-left: 45px;
        margin-top: 30px;
    }


    .FBBullets {
        width: 550px;
        font-size: .95em;
    }


    .brownRight {
        padding-left: 5px;
        padding-right: 5px;
        padding-bottom: 15px;
        padding-top: 5px;
        height:265px;
    }

   .perfectTitle{
       font-size:1.1em;
       padding-left:15px;
   }

    .perfectPoints {
        max-width: 560px;
    }

}







    /* Desktops and laptops ----------- */
    @media only screen and (min-width : 1100px) {
    /*@media (min-width : 1000px) {*/
        .mainDiv {
            display: flex;
            flex-direction: row;
        }

        .indexPage {
            height: 600px;
        }


        .thirdSection {
            width: 800px;
            margin-left: auto;
            margin-right: auto;
        }

        .leftSide {
            order: 1;
            height: auto;
            width: 400px;
        }

        .FBLogo {
            width: 250px;
            height: 150px;
            margin-left: 65px;
            margin-top: 40px;
        }
    }

