﻿@charset "utf-8";
/* CSS Document */



@font-face {
    font-family: 'HelveticaNeueLTStd-Roman';
    src: url('/Styles/webfonts/HelveticaNeueLTStd-Roman.eot?#iefix') format('embedded-opentype'), url('/Styles/webfonts/HelveticaNeueLTStd-Roman.otf') format('opentype'), url('/Styles/webfonts/HelveticaNeueLTStd-Roman.woff') format('woff'), url('/Styles/webfonts/HelveticaNeueLTStd-Roman.ttf') format('truetype'), url('/Styles/webfonts/HelveticaNeueLTStd-Roman.svg#HelveticaNeueLTStd-Roman') format('svg');
    font-weight: normal;
    font-style: normal;
}


@font-face {
    font-family: 'HelveticaNeueLTStd-Th';
    src: url('/Styles/webfonts/HelveticaNeueLTStd-Th.eot?#iefix') format('embedded-opentype'), url('/Styles/webfonts/HelveticaNeueLTStd-Th.otf') format('opentype'), url('/Styles/webfonts/HelveticaNeueLTStd-Th.woff') format('woff'), url('/Styles/webfonts/HelveticaNeueLTStd-Th.ttf') format('truetype'), url('/Styles/webfonts/HelveticaNeueLTStd-Th.svg#HelveticaNeueLTStd-Th') format('svg');
    font-weight: normal;
    font-style: normal;
}


@font-face {
    font-family: 'HelveticaNeueLTStd-Hv';
    src: url('/Styles/webfonts/HelveticaNeueLTStd-Hv.eot?#iefix') format('embedded-opentype'), url('/Styles/webfonts/HelveticaNeueLTStd-Hv.otf') format('opentype'), url('/Styles/webfonts/HelveticaNeueLTStd-Hv.woff') format('woff'), url('/Styles/webfonts/HelveticaNeueLTStd-Hv.ttf') format('truetype'), url('/Styles/webfonts/HelveticaNeueLTStd-Hv.svg#HelveticaNeueLTStd-Hv') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* Hack to fix ie adding extra spacing around scaled svgs */
img[src$=".svg"] {
    width: 100%;
}

.no-select {
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Chrome/Safari/Opera */
    -khtml-user-select: none; /* Konqueror */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none;
}

html, body {
    margin: 0;
    padding: 0;
    font-family: 'HelveticaNeueLTStd-Roman', Tahoma, Geneva, sans-serif;
    font-size: 1em;
    line-height: 1.4;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background-color: #ffffff;
}

html {
    font-size: 75%;
}

h1 {
    font-size: 2em;
}

#wrapper {
    width: 100%;
    height: 100%;
    padding: 1.8vmin;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
    overflow: hidden;
    position: absolute;
    background-color: #ffffff;
}

#main-container {
    width: 100%;
    height: 100%;
    margin: 0 auto;
    background: #ececec;
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    z-index: 2;
}

#visualizer-wrapper {
    position: relative;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}

#logo {
    height: 92px;
    margin: 10px 0 0 24px;
    width: 245px;
    padding-bottom: 10px;
}

.clickable {
    cursor: pointer;
}

.nav-siding img {
    margin-top: 6px;
    margin-left: -2px;
}

.nav-shake img {
    margin-top: 6px;
    margin-left: -2px;
}

/* .nav-fence:hover,.nav-stone:hover,.nav-windows:hover, .nav-siding:hover, .nav-shake:hover, .nav-garage:hover, .nav-garage-paint:hover, .nav-paint:hover { background:#65B561; border-left:1px solid #0E420D; border-right:1px solid #0E420D; cursor:pointer; } */
.nav-fence:hover, .nav-stone:hover, .nav-windows:hover, .nav-siding:hover, .nav-shake:hover, .nav-garage:hover, .nav-garage-paint:hover, .nav-paint:hover {
    background: #eaeaea;
    /*border-left: 1px solid #0E420D;*/
    cursor: pointer;
}

.nav-windows img {
    margin-top: 7px;
    margin-left: 18px;
}

.nav-stone img {
    margin-top: 7px;
    margin-left: 14px;
}

.nav-fence img {
    margin-top: 7px;
    margin-left: 18px;
}

.nav-roof img {
    margin-top: 7px;
    margin-left: 0px;
}

.nav-trim img {
    margin-top: 7px;
    margin-left: 0px;
}

.nav-garage img {
    margin-top: 7px;
    margin-left: 0px;
}

.nav-garage-paint img {
    margin-top: 7px;
    margin-left: 0px;
}

.nav-paint img {
    margin-top: 7px;
    margin-left: 0px;
}

.nav-door img {
    margin-top: 7px;
    margin-left: 0px;
}

/*Note that this is postition:static because of the IE no dissapearing contenct bug.  There is script in plygem.js that makes the whole vizualiser move up and down to accomidate this.  Its nasty, but its the only way to get IE7 to work correctly*/
#Viz {
    width: 100%;
    height: 100%;
}

.nav-bar {
    height: 33px;
    width: 100%;
    background: #d9d9d9;
    position: absolute;
    z-index: 3001;
    top: 0;
    display: none;
}

.nav-bar-box {
    height: 33px;
    width: auto;
    /* background: #ff0000; */
    /* position: relative; */
    float: left;
    text-align: center;
}

.viz-nav-bar {
    width: 100%;
    background-color: #66b260;
    border-bottom: 1vmin solid #ECECEC;
    position: relative;
}

.nav-siding {
    height: 32px;
    /* width: 121px; */
    /* display: inline; */
    /* position: absolute; */
    float: left;
    padding: 0 50px;
}

.nav-shake {
    height: 33px;
    /* width: 120px; */
    /* margin-left: 122px; */
    display: inline;
    float: left;
    padding: 0 50px;
}

.nav-stone {
    height: 33px;
    /* width: 185px; */
    display: inline;
    /* margin-left: 244px; */
    float: left;
    padding: 0 50px;
}

.nav-fence {
    height: 33px;
    display: inline;
    float: left;
    padding: 0 50px;
}

.nav-windows {
    height: 33px;
    display: inline;
    float: left;
    padding: 0 50px;
}

.nav-roof {
    height: 33px;
    display: inline;
    float: left;
    padding: 0 50px;
}

.nav-trim {
    height: 33px;
    display: inline;
    float: left;
    padding: 0 50px;
}

.nav-garage {
    height: 33px;
    display: inline;
    float: left;
    padding: 0 50px;
}

.nav-garage-paint {
    height: 33px;
    display: inline;
    float: left;
    padding: 0 50px;
}

.nav-paint {
    height: 33px;
    display: inline;
    float: left;
    padding: 0 50px;
}

.nav-door {
    height: 33px;
    display: inline;
    float: left;
    padding: 0 50px;
}

.nav-bar-on {
    background: #eaeaea;
}

    .nav-bar-on p {
        color: #487e45 !important;
    }


.nav-bar p {
    display: inline;
    color: #000000;
    font-size: 17px;
    margin-top: 5px;
    /* position: absolute; */
    font-family: 'HelveticaNeueLTStd-Th';
}

.nav-siding p {
    text-align: center;
    width: 100%;
    line-height: 35px;
}

.nav-windows p {
    text-align: center;
    width: 100%;
    line-height: 35px;
}

.nav-stone p {
    text-align: center;
    width: 100%;
    line-height: 35px;
}

.nav-fence p {
    text-align: center;
    width: 100%;
    line-height: 35px;
}

.nav-shake p {
    text-align: center;
    width: 100%;
    line-height: 35px;
}

.nav-roof p {
    text-align: center;
    width: 100%;
    line-height: 35px;
}

.nav-trim p {
    text-align: center;
    width: 100%;
    line-height: 35px;
}

.nav-paint p {
    text-align: center;
    width: 100%;
    line-height: 35px;
}

.nav-door p {
    text-align: center;
    width: 100%;
    line-height: 35px;
}

.nav-garage p {
    text-align: center;
    width: 100%;
    line-height: 35px;
}

.nav-garage-paint p {
    text-align: center;
    width: 100%;
    line-height: 35px;
}

.popup-siding {
    position: absolute;
    z-index: 2;
    width: 860px;
    height: 228px;
    top: 0px;
    padding: 20px;
}

.popup-siding-bg {
    position: absolute;
    z-index: 1;
    width: 900px;
    height: 248px;
    background: #000;
    filter: alpha(opacity=60);
    opacity: 0.60;
    top: 0px;
}

.popup-siding img {
    border: 4px solid transparent;
    height: 55px;
    width: 55px;
    z-index: 5;
    align: center;
}

    .popup-siding img:hover {
        border: 4px solid #259e1d;
        cursor: pointer;
    }



.popup-windows {
    position: absolute;
    z-index: 2;
    width: 860px;
    height: 95px;
    top: 0px;
    padding: 20px;
}

.popup-windows-bg {
    position: absolute;
    z-index: 1;
    width: 900px;
    height: 115px;
    background: #000;
    filter: alpha(opacity=60);
    opacity: 0.60;
    top: 0px;
}

.popup-windows img {
    border: 4px solid transparent;
    height: 55px;
    width: 55px;
    z-index: 5;
    align: center;
}

    .popup-windows img:hover {
        border: 4px solid #259e1d;
        cursor: pointer;
    }


.popup-stone {
    position: absolute;
    z-index: 2;
    width: 860px;
    height: 95px;
    top: 0px;
    padding: 20px;
}

.popup-stone-bg {
    position: absolute;
    z-index: 1;
    width: 900px;
    height: 115px;
    background: #000;
    filter: alpha(opacity=60);
    opacity: 0.60;
    top: 0px;
}

.popup-stone img {
    border: 4px solid transparent;
    height: 55px;
    width: 55px;
    z-index: 5;
    align: center;
}

    .popup-stone img:hover {
        border: 4px solid #259e1d;
        cursor: pointer;
    }

.popup-fence {
    position: absolute;
    z-index: 2;
    width: 860px;
    height: 95px;
    top: 0px;
    padding: 20px;
}

.popup-fence-bg {
    position: absolute;
    z-index: 1;
    width: 900px;
    height: 116px;
    background: #000;
    filter: alpha(opacity=60);
    opacity: 0.60;
    top: 0px;
}

.popup-fence img {
    border: 4px solid transparent;
    height: 55px;
    width: 55px;
    z-index: 5;
    align: center;
}

    .popup-fence img:hover {
        border: 4px solid #259e1d;
        cursor: pointer;
    }



#wishlist-container {
    height: 539px;
    width: 100%;
    position: absolute;
    top: 33px;
}

#house-container {
    height: 585px;
    width: 100%;
    position: absolute;
    overflow: hidden;
}

#house-container-viz {
    height: 77.5%;
    width: calc(100% - 220px);
    position: absolute;
    overflow: hidden;
    /* left: 40px; */
    background-color: #999;
    top: 0;
}

#smart-styles {
    width: 220px;
    height: 100%;
    background-color: #3D3E39;
    position: absolute;
    top: 0;
    right: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

#floating-icons-wish {
    text-align: center;
    width: 93px;
    height: 44px;
    position: absolute;
    top: 500px;
    left: 795px;
    z-index: 1000;
    background-image: url(images/icons/icons-blankholder.png);
    background-repeat: no-repeat;
}

    #floating-icons-wish img {
        margin-top: 5px;
    }

#floating-print-wish {
    width: 93px;
    height: 44px;
    position: absolute;
    top: 446px;
    left: 795px;
    z-index: 1000;
    background-image: url(images/icons/icons-blankholder.png);
    background-repeat: no-repeat;
}

#save {
    margin-top: 10px;
    margin-left: 10px;
}

#toggle-wish {
    cursor: pointer;
    z-index: 1000;
    background: url(images/icons/visualize-wishlist.png) no-repeat;
    width: 260px;
    height: 37px;
    position: absolute;
    top: 549px;
    left: 640px;
}



#floating-icons-house img {
    border: 0px none #000;
}

    #floating-icons-house img#imgPro {
        left: 0px;
        /* top: -2px; */
        position: relative;
        /* background-size: 80%; */
        width: 3.8vh;
        height: 100%;
    }

#floating-icons-house > ul {
    margin: 0;
    padding: 1.25vmin 0 0 !important;
    width: 100%;
    text-align: right;
}

#floating-icons-house li, #home {
    list-style: none;
    display: inline-block;
    padding: 0 2.4vh 1.25vmin;
    position: relative;
    text-align: center;
}

    #floating-icons-house li i, #home i {
        color: #fff;
        font-size: 4vh;
        text-align: center;
        margin-bottom: 3px;
    }

    #floating-icons-house li a, #home, #floating-icons-house li > div {
        color: #fff;
        font-size: 1.5vh;
        text-align: center;
        text-decoration: none;
        padding: 0 !important;
        margin: 0 !important;
        display: block;
        cursor: pointer;
    }



    #floating-icons-house li span {
        line-height: 16px;
    }



/*681px; */
#WishList {
    clear: both;
    position: absolute;
    width: calc(100% - 220px);
    height: 22.5%;
    z-index: 1000;
    overflow: hidden;
    bottom: 0;
    left: 0;
}

    #WishList.visible {
        transform: translateY(0);
    }


#WishListTab {
    background: url("images/view-your-selections.svg") no-repeat scroll right top transparent;
    height: 34px;
    width: 255px;
    position: absolute;
    bottom: 100%;
    right: 0;
    cursor: pointer;
}

#AppliedProducts {
    background-color: #E0E0E0;
}

.surfacepopupmenubar {
    position: relative;
    z-index: 10;
}

#select-house-wrapper {
    padding: 0 2.5vmin;
    text-align: center;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    position: relative;
}

.select-house {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

    .select-house a, .select-house > div {
        width: 30vmin;
        max-width: 300px;
        margin: 0 2.2vmin 4.4vmin;
        border: 2px solid white;
        position: relative; /* This is here only to fix a rendering issue in Safari and iOS. See PLYGEM-88. */
        display: inline-block;
        vertical-align: middle;
    }

    .select-house img {
        max-width: 100%;
        display: block;
    }

#select-house-scroll {
    float: right;
    background-color: #ff0000;
    width: 10px;
    height: 79%;
    position: absolute;
    z-index: 20000;
    top: 16%;
    right: 1%;
}

#landing-upload {
    position: absolute;
    cursor: pointer;
    right: 0;
    width: 22%;
    background-color: #66b260;
    color: #fff;
    display: none;
}

    #landing-upload img {
        width: 100%;
    }

    #landing-upload p {
        font-size: 1.75vmin;
        padding: 1.5vmin;
    }

    #landing-upload .banner {
        width: 100.25%;
        padding: 3.5% 4%;
        background-color: rgba(255, 255, 255, 0.9);
        color: #6d6864;
        font-family: 'HelveticaNeueLTStd-Th';
        /* position: absolute; */
        left: 0;
        bottom: 25%;
        display: table;
        box-sizing: border-box;
        margin-top: -2%;
    }

        #landing-upload .banner img {
            width: 100%;
            max-width: 3vmin;
            display: block;
        }

        #landing-upload .banner div {
            display: table-cell;
            vertical-align: middle;
        }

        #landing-upload .banner .image {
            width: 0;
        }

        #landing-upload .banner .text {
            font-size: 2vmin;
            font-size: 2.5vmin;
        }

.project-popup-alert {
    /* color: #1B4824; */
    cursor: pointer;
    font-size: 15px;
    /* font-weight: bold; */
    /* height: 52px; */
    text-align: left;
    top: 8px;
    z-index: 10011;
}

    .project-popup-alert h1 {
        font-size: 2em;
        font-family: 'HelveticaNeueLTStd-Th';
        color: #3e3f37;
        margin-top: 4px;
        margin: 0;
        padding: 10px 30px 0 6%;
    }

.project-popup-alert-line {
    background: none repeat scroll 0 0 #1B4824;
    height: 1px;
    left: 0;
    position: absolute;
    text-align: center;
    top: 34px;
    width: 724px;
}

.project-popup-alert-Pro {
    /*color: #1B4824;
    cursor: pointer;
    font-size: 15px;
    font-weight: bold;
    height: 25px;
    left: 48px;
    position: relative;
    text-align: left;
    top: 17px;
    width: 766px;
    z-index: 10011;*/
    /* color: #1B4824; */
    cursor: pointer;
    /* font-size: 15px; */
    /* font-weight: bold; */
    /* height: 25px; */
    /* left: 116px; */
    position: absolute;
    /* text-align: left; */
    /* top: 17px; */
    width: 97%;
    z-index: 10011;
    top: 1%;
}

.project-popup-alert-line-Pro {
    background: none repeat scroll 0 0 #1B4824;
    height: 1px;
    left: 0;
    text-align: center;
    top: 34px;
    width: 724px;
}

#close {
    width: 3vh;
    /* height: 30px; */
    position: absolute;
    top: 0%;
    right: 0%;
    cursor: pointer;
    /* float: right; */
}

.close_down {
    top: 31% !important;
    right: .75% !important;
}

#close img {
    width: 3vh;
    /* height: 30px; */
    /* margin-top: -19px; */
    /* padding-top: 37px; */
    /* position: absolute; */
    /* top: 44px; */
    /* right: 4px; */
}

#chooseahouse {
    font-size: 1em;
    font-weight: bold;
    color: #65B561;
    width: 210px;
    cursor: pointer;
    margin-left: 330px;
    margin-top: -28px;
    position: relative;
    z-index: 2;
}

#feedbackImg {
    display: inline-block;
    float: right;
    cursor: pointer;
}

#products {
    padding: 1%;
    background-color: rgba(0, 0, 0, 0.74);
    height: 100%;
    overflow: auto;
    z-index: 1;
    font-family: 'HelveticaNeueLTStd-Th';
    font-size: 24px;
}

    #products hr {
        color: transparent;
        background-color: transparent;
        height: 0;
        /*display:none;*/
    }

#products-bg {
    width: 900px;
    height: 226px;
    background-color: #000;
    opacity: 0.6;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
    filter: alpha(opacity=50);
    position: absolute;
    top: 33px;
    zoom: 1;
}

.products-bg2 {
    width: 100%;
    background-color: #000;
    opacity: 0.6;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
    filter: alpha(opacity=50);
    position: relative;
    zoom: 1;
    display: none;
}

#products img {
    width: 70px;
    height: auto;
    margin: 3px;
    border: 2px solid transparent;
}

    #products img:hover, #products img.chosen {
        margin: 3px;
        border: 2px solid #65B561;
    }

.apply-all {
    font-size: 0.7em;
}

    .apply-all input {
        min-width: 0;
    }


/* ==========================================================================
   GHOST CENTER
   ========================================================================== */

.ghost-center {
    text-align: center;
    white-space: nowrap;
}

    .ghost-center:before {
        content: '';
        width: 0;
        height: 100%;
        margin-left: -0.2em;
        display: inline-block;
        vertical-align: middle;
    }

    .ghost-center > div {
        text-align: left;
        white-space: normal;
        display: inline-block;
        vertical-align: middle;
    }

/* ========================================================================== */

#FeedbackPopup, #EmailPopup {
    width: 100%;
    height: 100%;
    background: transparent;
    position: absolute;
    z-index: 10008;
    display: none;
    top: 0;
    left: 0;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

    #FeedbackPopup input, #FeedbackPopup textarea, #EmailPopup input, #EmailPopup textarea {
        max-width: 100%;
        box-sizing: border-box;
    }


#warning, #warning2 {
    width: 100%;
    height: 100%;
    background-color: transparent;
    position: absolute;
    z-index: 20008;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    margin: 0 auto;
    display:none;
}

.warning-inner {
    background-color: #fff;
    padding: 2%;
    position: relative;
}


    .warning-inner h2 {
        font-size: 3.25vmin;
        padding: 0;
        margin: 0;
        font-family: 'HelveticaNeueLTStd-Th';
        color: #3e3f37;
        text-transform: uppercase;
    }

    .warning-inner p {
        font-size: 1.5vmin;
        color: #3e3f37;
        text-transform: uppercase;
    }


#warning-close, #warning-close2 {
    width: 3vh;
    position: absolute;
    top: 2px;
    right: 2px;
    cursor: pointer;
}

#warning-yes, #warning-yes2 {
    width: 75%;
    text-align: center;
    border: solid 2px #66b260;
    color: #66b260;
    margin: 2% auto;
    cursor: pointer;
    font-size: 2vmin;
    text-transform: uppercase;
}



#warning-no, #warning-no2{
    width: 75%;
    text-align: center;
    border: solid 2px #66b260;
    color: #66b260;
    margin: 2% auto;
    cursor: pointer;
    font-size: 2vmin;
    text-transform: uppercase;
}

    #warning-yes:hover, #warning-no:hover, #warning-yes2:hover, #warning-no2:hover {
        color: #ffffff;
        background-color: #66b260;
    }



#ProWraper {
    left: 0;
    position: absolute;
    top: 11%;
    width: 100%;
    height: 89%;
    z-index: 500000;
    display: none;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

#feedbackInner, #EmailInner {
    z-index: 10009;
    width: 100%;
    max-width: 700px;
    background-color: transparent;
    border: 1px solid #fff;
    margin: 0 auto;
    position: relative;
}

#ProInner {
    z-index: 10009;
    width: 100%;
    height: 100%;
    background-color: #ffffff;
    display: none;
    box-sizing: border-box;
    padding: 3%;
}


#headerLine {
    background: none repeat scroll 0 0 #1B4824;
    display: none;
    height: 1px;
    left: 98px;
    position: absolute;
    text-align: center;
    top: 63px;
    width: 740px;
    z-index: 10010;
}


#feedbackHeader, #projectHeader, #EmailHeader, #ProHeader {
    cursor: pointer;
    position: relative;
    text-align: left;
    left: 39px;
    top: 14px;
    font-size: 15px;
    font-weight: bold;
    color: #1B4824;
    height: 22px;
    padding-top: 3px;
    width: 822px;
}

    #feedbackHeader img, #projectHeader img, #EmailHeader img, #ProHeader img {
        clear: none;
        float: right;
        margin-right: 55px;
        margin-top: -5px;
    }

#feedbackBackground, #EmailBackground, #ProBackground {
    width: 100%;
    height: 100%;
    background-color: #FFFFFF;
    filter: alpha(opacity=90);
    opacity: 0.9;
    position: absolute;
    top: 0;
    left: 0;
    border: 1px solid #fff;
}

#productpopupwrapper, #productpopupwrapper1, #productpopupwrapper2 {
    margin: 3% 6% 5%;
    text-align: left;
    height: auto;
}

#productpopupwrapper3 {
    width: 100%;
    position: relative;
    height: auto;
}

#productpopupwrapper {
    height: 650px;
    left: -4px;
    margin: 8px auto 0;
    overflow: hidden;
    position: relative;
    text-align: left;
    width: 88%;
}


#productpopupwrapper2 {
    font-size: 16px;
    font-weight: bold;
    font-family: 'HelveticaNeueLTStd-Th';
}

#productpopupwrapper3 {
    position: relative;
}

#productpopupwrapper3_logo {
    float: left;
    width: 15%;
}

    #productpopupwrapper3_logo img {
        height: 100%;
        width: 100%;
    }

#productpopupwrapper3 h1 {
    font-size: 6vh;
    text-align: left;
    margin: 0;
    font-weight: 400;
    color: #3c3d37;
    padding-left: 0%;
    font-family: 'HelveticaNeueLTStd-Th';
    margin-left: 2%;
}

#productpopupwrapper3 h2 {
    font-size: 2.5vmin;
    text-align: left;
    margin: 1% 0 2%;
    font-weight: 400;
    color: #3c3d37;
    padding-left: 0%;
    font-family: 'HelveticaNeueLTStd-Th';
    margin-left: 5%;
}

#email-content {
    margin: 3% 6% 5%;
    font-size: 1em !important;
    display: table;
}

    /* Email Dialog Content */

    #email-content .row {
        display: table-row;
    }

    #email-content input[type="text"], #email-content textarea {
        width: 100%;
        max-width: 350px;
        margin-bottom: 10px;
        display: table-cell;
    }

    #email-content label {
        margin-bottom: 2px;
        padding-right: 15px;
        text-align: right;
        display: table-cell;
    }

    #email-content .buttons {
        padding-top: 10px;
        text-align: right;
    }

        #email-content .buttons > div {
            display: table-cell;
        }

@media all and (max-width: 475px) {
    #email-content {
        display: block;
    }

        #email-content .row {
            display: block;
        }

        #email-content input[type="text"], #email-content textarea {
            display: block;
        }

        #email-content label {
            text-align: left;
            display: block;
        }
}

/* End Email Dialog Content */

.myHome {
    width: 100%;
    height: auto;
    margin: 0 auto;
}

    .myHome ul {
        margin: 0;
        padding: 0;
        list-style-type: none;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .myHome li {
        width: 30%;
        height: auto;
        box-sizing: border-box;
        max-width: 400px;
        margin: 0 auto;
    }

        .myHome li img {
            width: 100%;
        }


.myHome_caption {
    color: #3b3c36;
    /* background-color: #3b3c36; */
    width: 100%;
    font-size: 2.75vmin;
    /* font-weight: 400; */
    text-align: center;
    font-family: 'HelveticaNeueLTStd-Th';
    /* vertical-align: middle; */
}

    .myHome_caption img {
        height: 40px !important;
        width: 40px !important;
        float: left;
    }

#uploadImages {
    background-color: #3b3c36;
    font-size: 2.5vmin;
    color: #ffffff;
    padding: .5% 3%;
    float: right;
    font-family: 'HelveticaNeueLTStd-Th';
    cursor: pointer;
    margin-top: 3%;
    margin-right: 2%;
}


#MyProjectsPopup {
    z-index: 10009;
    width: 822px;
    height: 714px;
    background-color: transparent;
    position: absolute;
    border: 1px solid #fff;
    display: none;
    left: 0;
    right: 0;
    margin: 0 auto;
    position: absolute;
    top: 11%;
}

#MyProjectsPopupBackground {
    z-index: 10008;
    width: 822px;
    height: 714px;
    background-color: #FFFFFF;
    filter: alpha(opacity=90);
    opacity: 0.9;
    border: 1px solid #fff;
    display: none;
    left: 0;
    right: 0;
    margin: 0 auto;
    position: absolute;
    top: 11%;
}

#Picture {
    margin-top: 105px;
    margin-left: 25px;
}



#printProdHeader {
    margin-bottom: 15px;
    font-weight: bold;
}


#MyProjectsPopupInner td {
    padding: 2px;
    border: none;
    padding: 4px;
}



#MyProjectswrapper {
}

#closeme {
    display: none;
}

#Facebook {
    position: absolute;
    top: 535px;
    left: 40px;
    width: 861px;
}

#disclaimer {
    font-size: 10px;
    color: #302f2f;
    position: absolute;
    top: 0px;
    right: 0px;
    width: 400px;
    text-align: right;
    padding-right: 9px;
    letter-spacing: 0.04em;
}

#productpopupwrapper3 th, td {
    border: 0px solid #000000;
    padding: 0.5em;
}


/* ADAM 2/27/2012 */
#ProfilerBlock {
    display: inline-block;
}

    #ProfilerBlock .Profiler {
        display: inline-block;
        zoom: 1;
        *display: inline;
        padding: 4px;
        position: relative;
        width: 105px;
        text-align: center;
    }

    #ProfilerBlock .ProfileName {
        color: #ffffff;
        width: inherit;
        font-size: xx-small;
    }

    #ProfilerBlock .ProfilerCategory {
        color: #ffffff;
        width: 800px;
        position: relative;
        background-color: Black;
    }

.stoneTitle {
    font-size: xx-small;
    color: #ffffff;
}

.lblStoneCategoryClass {
    width: 900px;
    position: relative;
    color: #ffffff;
    width: 800px;
    background-color: Black;
}

#ProfilerStone {
    display: inline-block;
    zoom: 1;
    *display: inline;
    padding: 10px;
    position: relative;
    width: 150px;
}

.paintWrapping {
    display: inline-block;
    zoom: 1;
    *display: inline;
    padding: 4px;
    position: relative;
    width: 90px;
    text-align: center;
    font-size: 0.5em;
    vertical-align: top;
}

.stoneWrap {
    zoom: 1;
    position: relative;
}

.stoneCategory {
    color: #ffffff;
    position: relative;
    background-color: Black;
    padding: 0.2vh 0.8vh;
    font-size: 2.3vh;
    font-weight: 300;
    text-align: left;
    margin: 0px;
}

.stoneText {
    color: White;
    font-size: 0.5em;
}

.stoneInner {
    width: 90px;
    display: inline-block;
    zoom: 1;
    *display: inline;
    padding: 8px 4px;
    position: relative;
    vertical-align: top;
    text-align: center;
}

.sidingInner /* sidingInner is independent of stone inner because if it wasn't ctrl+f plygem.js for [~~1~~] and you will see how the divs turn on and off based what sidings should show. */ {
    display: inline-block;
    zoom: 1;
    *display: inline;
    padding: 4px;
    position: relative;
    width: 80px;
    height: 100px;
    vertical-align: top;
    text-align: center;
}

.clearfix:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
}

.makeMeBlock {
    display: inline-block;
    zoom: 1;
    *display: inline;
    padding: 4px;
    position: relative;
    width: 90px;
    vertical-align: top;
    text-align: center;
    line-height: 0.7;
}

.clearfix {
    display: inline-block;
}
/* start commented backslash hack \*/
* html .clearfix {
    height: 1%;
}

.clearfix {
    display: block;
}
/* close commented backslash hack */








/* good better best */
.hide {
}

.GBBClass {
    position: absolute;
    left: 600px;
}

#imgLogo {
    max-width: 100%;
}

.oneOfThreeHouses {
    width: 148px;
    height: 98px;
    padding: 2px;
    margin: 2px;
}

    .oneOfThreeHouses:hover {
        border: 1px solid green;
    }

.bottomBorderLine {
    border-bottom-width: 2px;
    border-bottom-color: #000000;
    border-bottom-style: solid;
    padding-bottom: 10px;
}

.imgClass {
    /* float: right; */
    position: absolute;
    z-index: 90002;
    /* left: 900px; */
    top: 200px;
}


#goodBetterBest {
    width: 100%;
    height: 89%;
    position: absolute;
    top: 11%;
    left: 0;
    display: none;
    z-index: 90001;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

#divInner {
    width: 100%;
    max-width: 940px;
    padding: 3.5% 5%;
    background-color: rgba(255, 255, 255, 0.7);
    border: 1px solid #fff;
    position: relative;
    box-sizing: border-box;
}

#imgTab {
    height: 34px;
    padding: 0 1%;
    background-color: #A7ABAC;
    color: white;
    font-size: 1.4em;
    line-height: 34px;
    text-transform: uppercase;
    position: absolute;
    bottom: 0;
    left: 0;
    cursor: pointer;
    z-index: 1000;
}

.gbbClose {
    top: 10px;
}

.push {
    width: 100px;
}
/*

#divOuter
{
    border: 1px solid #FFFFFF;
    position:absolute;
    top:19px;
    left:58px;
    width:822px;
    height:450px;
    opacity:0.7;
    overflow:hidden;
    background-color:Transparent;
    display:none;
}

*/

/* ==========================================================================
   Shutters and Gables
   ========================================================================== */
div.prod-shutter, div.prod-gable {
    width: 100%;
    height: 100%;
    padding: 1%;
    background-color: transparent;
    font-family: 'HelveticaNeueLTStd-Th';
    font-size: 24px;
    background-color: rgba(0, 0, 0, 0.74);
    overflow: auto;
    z-index: 1;
}

.products-shutter ul, .products-gable ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

ul.colors {
    display: none;
}

.products-shutter ul li, .products-gable ul li {
    display: inline-block;
    zoom: 1;
    *display: inline;
    vertical-align: text-top;
    position: relative;
    margin: 5px;
    padding: 0;
    text-align: center;
    width: 96px;
}

    .products-shutter ul li img, .products-gable ul li img {
        display: block;
        vertical-align: top;
        margin: 0 auto;
    }

        .products-shutter ul li img:hover, .products-gable ul li img:hover {
            margin: 0 auto;
        }

    .products-shutter ul li p, .products-gable ul li p {
        margin: 0;
        padding: 0;
        color: #fff;
        font-size: 0.5em;
        margin-top: 5px;
    }

span.applyToAll-shutter, span.applyToAll-gable {
    color: #fff;
}

.products-shutter ul li img, .products-gable ul li img {
    height: 80px;
}



/* ==========================================================================
   NEW PROJECT STYLES OR OVERWRITES
   ========================================================================== */


#footer {
    width: 100%;
    padding: 3.2vmin 0 1.3vmin;
    background-color: #ffffff;
    box-sizing: border-box;
}

body.page-default #footer {
    display: none;
}

#disclaimer_new {
    width: 100%;
    height: 100%;
    font-size: 1.5vh;
    padding: 0 220px 0 .75%;
    box-sizing: border-box;
    text-align: center;
    display: table;
}

    #disclaimer_new div {
        display: table-cell;
        vertical-align: middle;
    }

#like {
    width: 50%;
    float: left;
    font-size: .9em;
    padding: .75%;
    box-sizing: border-box;
}

    #like p {
        line-height: 2%;
        font-size: 1.5vh;
    }

#likeIcon {
    width: 12%;
    float: left;
    margin-right: 2%;
    cursor: pointer;
}


    #likeIcon img {
        width: 100%;
    }


#splash_layer {
    width: 100%;
    height: 100%;
    background-color: #ffffff;
    margin: 0 auto;
    z-index: 4;
}

#splash_header {
    width: 100%;
    height: 10%;
    background-color: #66b260;
    position: relative;
    top: 0;
    left: 0;
}

#splash_login {
    color: #ffffff;
    position: absolute;
    right: 2%;
    top: 37%;
    cursor: pointer;
    font-size: 1.75vh;
}

#splash_viz {
    width: 100%;
    height: 89%;
    background-color: #dfdfdf;
    position: relative;
    top: 1%;
    left: 0;
    padding: 2%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    box-sizing: border-box;
}

#splash-text {
    padding: 0 0 2.2vmin;
}

#splash_viz h1 {
    font-size: 5.5vmin;
    text-align: left;
    margin: 0;
    font-weight: 400;
    color: #3c3d37;
    font-family: 'HelveticaNeueLTStd-Th';
    text-align: center;
}

#splash_viz h3 {
    font-size: 3vmin;
    text-align: left;
    margin: 0;
    font-weight: 400;
    color: #3c3d37;
    font-family: 'HelveticaNeueLTStd-Th';
    text-align: center;
    border-bottom: .5px solid #66b260;
    padding-bottom: 1vmin;
    margin-bottom: 1.5vmin;
}

.splash-options {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-around;
}

    .splash-options h4 {
        font-size: 2.5vmin;
        text-align: center;
        margin: 0;
        font-weight: 400;
        color: #3c3d37;
        font-family: 'HelveticaNeueLTStd-Th';
    }

.splash-options1 {
    width: 100%;
    float: left;
}

.splash-options2 {
    width: 22%;
    float: right;
    display: none;
}

    .splash-options1 h4, .splash-options2 h4 {
        font-size: 2.5vmin;
        text-align: left;
        margin: 0;
        font-weight: 400;
        color: #3c3d37;
        font-family: 'HelveticaNeueLTStd-Th';
    }

.splash_select {
    width: 100%;
    height: auto;
    /* background-color:#66b260; */
    margin: 0 auto;
}



    .splash_select ul {
        margin: 0;
        padding: 0;
        list-style-type: none;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .splash_select li {
        width: 30%;
        height: auto;
        cursor: pointer;
        box-sizing: border-box;
        max-width: 330px;
        margin: 0 auto;
    }

        .splash_select li img {
            width: 100%;
            height: 100%;
        }

.splash_caption {
    color: #ffffff;
    background-color: #3b3c36;
    width: 100%;
    font-size: 2.25vh;
    line-height: 2em;
    /* font-weight: 400; */
    text-align: center;
    font-family: 'HelveticaNeueLTStd-Th';
}

    .splash_caption i {
        margin-left: 5px;
    }

#inspired_layer {
    width: 100%;
    height: 100%;
    background-color: #ffffff;
    position: absolute;
    top: 0;
    left: 0;
    margin: 0 auto;
    z-index: 3;
    display: none;
}

#inspired_header {
    width: 100%;
    height: 10%;
    background-color: #66b260;
    position: absolute;
    top: 0;
    left: 0;
}

    #inspired_header > div {
        padding-right: 120px;
    }

    #inspired_header a {
        position: absolute;
        top: 50%;
        right: 1%;
        -webkit-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
    }

    #inspired_header h1 {
        font-size: 4vh;
        text-align: left;
        margin: 0;
        font-weight: 400;
        color: #ffffff;
        padding-left: 1%;
        font-family: 'HelveticaNeueLTStd-Th';
        /* margin-top: .5%; */
    }

    #inspired_header h3 {
        font-size: 1.6vh;
        text-align: left;
        /* margin: 0 0 2%; */
        font-weight: 400;
        color: #ffffff;
        padding-left: 1%;
        font-family: 'HelveticaNeueLTStd-Th';
        /* line-height: 1vh; */
        margin-top: -0.3%;
        letter-spacing: .02em;
    }


#inspired_left {
    position: absolute;
    width: 79%;
    height: 90%;
    left: 0;
    top: 10%;
}

#inspired_scene {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    height: 78%;
    background-color: #ffffff;
}

.selected-style {
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

#likeThis {
    width: 100%;
    position: absolute;
    bottom: 16%;
    left: 0;
    height: 6%;
    /* background-color: #3b3c36; */
}

    #likeThis h1 {
        font-size: 3vh;
        color: #44723f;
        text-align: left;
        margin: 0;
        font-family: 'HelveticaNeueLTStd-Th';
        /* margin: .5% 1%; */
        padding: .25% 1%;
        background-color: #e0e0e0;
    }

#inspired_products {
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    height: 16%;
    background-color: #e0e0e0;
    white-space: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
}

#inspired_products_scroll {
    position: absolute;
    width: 100%;
    bottom: 0;
    left: 0;
    right: 0;
    height: 10px;
    display: none;
}

.products_slider {
    width: auto;
    height: 100%;
    /* background-color: #000; */
    display: inline-block;
    position: absolute;
    bottom: 0;
}

    .products_slider ul {
        margin: 0;
        padding: 0;
        list-style-type: none;
    }

    .products_slider li {
        width: auto;
        height: auto;
        display: inline-block;
        /* background-color: #ff0000; */
        padding: 1em;
        box-sizing: border-box;
    }



.products_tn {
    width: 8vh;
    height: 8vh;
    float: left;
    background-color: #999999;
    position: relative;
    cursor: pointer;
}

    .products_tn:after {
        content: "";
        background-image: url(../images/heart.svg);
        background-repeat: no-repeat;
        position: absolute;
        bottom: 0;
        right: 0;
        display: block;
        width: 3vh;
        height: 3vh;
        /* padding: 0%; */
        box-sizing: border-box;
        margin: 3%;
    }

    .products_tn.favorited:after {
        background-image: url(../images/heart_active.svg);
    }

    .products_tn img {
        width: 100%;
    }

.products_text {
    width: auto;
    float: left;
}

    .products_text h2 {
        font-size: 2vh;
        float: left;
        color: #000;
        margin: 0;
        margin-left: 11px;
    }

    .products_text p {
        font-size: 1.75vh;
        float: left;
        color: #000;
        margin: 0;
        margin-left: 11px;
        font-family: 'HelveticaNeueLTStd-Th';
        clear: both;
    }

#inspired_right {
    position: absolute;
    width: 21%;
    height: 90%;
    background-color: #3d3e39;
    right: 0;
    top: 10%;
    overflow-y: hidden;
}


.select_styles {
    width: 100%;
    /* background-color: #ff0; */
    padding: 4% 4% 0;
    color: #ffffff;
    text-align: left;
    font-family: 'HelveticaNeueLTStd-Th';
    box-sizing: border-box;
}

    .select_styles h1 {
        margin: 0;
        font-size: 2.5vmin;
    }

    .select_styles p {
        margin: 0;
        font-size: 1.8vh;
        display: block;
    }

.select_arrow {
    width: 14%;
    float: right;
    padding: 2%;
}

.style_slider {
    width: 100%;
    position: relative;
}

.style_slider_box {
    width: 100%;
    position: relative;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    overflow-y: hidden;
}

    .style_slider_box ul {
        width: 100%;
        min-height: 100%;
        margin: 0;
        padding: 0;
        list-style-type: none;
        position: absolute;
        top: 0;
        -webkit-transition: 300ms top ease;
        -moz-transition: 300ms top ease;
        -o-transition: 300ms top ease;
        transition: 300ms top ease;
    }


    .style_slider_box li {
        width: 90%;
        display: block;
        /*height: 25vmin;*/
        /* background-color: #ff0000; */
        margin: 0 auto;
        padding: 3%;
        border: 3px solid transparent;
        overflow: hidden;
        position: relative;
        cursor: pointer;
        box-sizing: border-box;
    }


        .style_slider_box li img {
            width: 100%;
        }

.smart-style.active {
    border-color: white;
}

.style_slider_text {
    width: 100%;
    color: #fff;
    font-size: 1.6vh;
    text-align: left;
    line-height: 1;
    /* margin: 1% 0 0 0; */
    /* background-color: #ff0000; */
    background-color: #3d3e39;
    padding: 1% 1% 0;
    /*position: absolute;
    bottom: 0;*/
    box-sizing: border-box;
}

.slide_up, .slide_down {
    width: 100%;
    cursor: pointer;
}

.slide_up {
    margin: 2vmin 0 1vmin;
}

.slide_down {
    margin: 1vmin 0 2vmin;
}

    .slide_up img, .slide_down img {
        max-width: 40px;
        margin: 0 auto;
        display: block;
    }

#no-smart-styles {
    width: 100%;
    height: 100%;
    color: white;
    font-size: 1.4em;
    text-align: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: absolute;
    top: 0;
    left: 0;
    cursor: default !important;
}


/* Portrait and Landscape iPad */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 1) {


    .select_styles h1 {
        font-size: 3.5vmin;
        color: #ffffff;
        text-align: left;
        font-family: 'HelveticaNeueLTStd-Th';
        margin: 0;
    }
}

/* Portrait and Landscape */
@media only screen and (max-device-width: 768px) and (-webkit-min-device-pixel-ratio: 1), only screen and (max-width: 768px) {

    .splash_caption {
        color: #ffffff;
        background-color: #3b3c36;
        width: 100%;
        font-size: 1.5vh;
        line-height: 2em;
        text-align: center;
        font-family: 'HelveticaNeueLTStd-Th';
    }

    #splash_viz h3 {
        font-size: 3.2vmin;
    }

    .select_styles p {
        font-size: 2.2vmin;
    }

    #disclaimer_new {
        padding: 0 .75%;
        font-size: 1vh;
        box-sizing: border-box;
    }

    #like p {
        line-height: 2%;
        font-size: 1vh;
    }

    #inspired_header h3 {
        font-size: 1.1vh;
    }

    .style_slider_text {
        font-size: 1.8vmin;
    }

    #inspired_header h3 {
        font-size: 1.1vh;
    }

    #floating-icons-house > ul {
        padding: 0;
        display: inline-block;
        float: right;
        width: 100%;
    }

    #disclaimer_new {
        font-size: 1.8vmin;
    }

    #smart-styles {
        width: 25%;
    }

    #house-container-viz, #WishList {
        width: 75%;
    }

    #floating-icons-house li, #home {
        padding: 0 1vmin 1.0vmin;
    }

        #floating-icons-house li i, #home i {
            font-size: 2vh;
        }

    #floating-icons-house img#imgPro {
        width: 2vh;
    }

    .nav-bar p {
        font-size: 14px;
    }

    #products {
        font-size: 20px;
    }
}

button, input, optgroup, select, textarea {
    color: inherit;
    font: inherit;
    margin: 0;
    border: solid 1px #999999;
    border-radius: 2px;
    padding: 5px;
}

    button, input[type="button"], input[type="submit"], input[type="reset"] {
        background-color: #DDDDDD;
    }

input {
    min-width: 67px;
}

.prowide {
    width: 260px;
}

.viz-palette {
    width: 100%;
    height: 100%;
    padding-top: 33px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 3000;
    display: none;
    box-sizing: border-box;
}

    .viz-palette > .content-wrapper {
        width: 100%;
        max-height: 100%;
        overflow-x: hidden;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

.loading-msg {
    position: absolute;
    top: 50% !important;
    left: 50% !important;
    background-color: #86aaba;
    color: #fff;
    text-align: center;
    padding: 10px 20px;
    opacity: 0.8;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
    filter: alpha(opacity=80);
    border-radius: 15px; /* IE9 */
    transform: translate(-50%, -50%);
}

#imageloadingmessagediv {
    position: absolute;
    top: 200px;
    left: 200px;
    text-align: center;
    z-index: 99;
    display: none;
}

.loading-msg-inner {
    font-size: 10px;
}

#share-area {
    background-color: rgba(0, 0, 0, 0.65);
    text-align: center;
    position: absolute;
    top: 0;
    left: 0;
    cursor: pointer;
    z-index: 2999;
}

    #share-area a {
        padding: 1.2vh 2.4vh;
        color: white;
        text-decoration: none;
        display: block;
    }

    #share-area i {
        font-size: 4vmin;
    }

#share-menu {
    height: 100%;
    margin: 0;
    padding: .7vmin !important;
    /*background-color: rgba(0, 0, 0, 0.35);*/
    background-color:#3D3E39;
    border-left: 1px solid rgba(255, 255, 255, 0.4);
    top: 0;
    left: 100%;
    white-space: nowrap;
}

    #share-menu li {
        /*height: 100%;
        margin: 0;
        padding: 0 !important;
        float: none;
        display: inline-block;
        position: relative;*/
        list-style-type: none;
        padding: 1.5vmin 0;
            color: #fff;
    }

        #share-menu li a {
            height: 100%;
            padding: 0 1.4vmin !important;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            cursor: pointer;
        }

#ztip {
    margin: 34px 0 0 -8px;
    font-size: 1.0em !important;
    z-index: 1500 !important;
}

#vrdialog {
    height: 100% !important;
}

    #vrdialog #dialogcontent {
        max-height: 100%;
        overflow-x: hidden;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

        #vrdialog #dialogcontent > div {
            height: auto !important;
        }

#interest-area td {
    white-space: nowrap;
}

#interest-area tr td:first-child {
    padding-right: 10px;
}

.create-new-account input[type="checkbox"] {
    min-width: 0;
}

.account-column {
    width: 49%;
    display: inline-block;
    vertical-align: top;
}

    .account-column tr td:first-child {
        white-space: nowrap;
    }

    .account-column .prowide {
        max-width: 230px;
    }


/* ==========================================================================
   TOUR
   ========================================================================== */

#tour {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    display: none;
    z-index: 5000;
}

.tour-step {
    width: 100%;
    max-width: 300px;
    background-color: white;
    display: none;
    z-index: 5001;
}

    .tour-step .main {
        border: 1px solid #E0E0E0;
        border-bottom: none;
        position: relative;
    }

    .tour-step .header {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

        .tour-step .header h3 {
            margin: 0;
            padding: 2vmin 0 0 2vmin;
            font-size: 3vmin;
            font-family: 'HelveticaNeueLTStd-Th';
            font-weight: normal;
        }

        .tour-step .header .close {
            width: 3vmin;
            margin: 4px 4px 0 0;
            cursor: pointer;
        }

    .tour-step p {
        margin: 0;
        padding: 3.5vmin 2vmin 4.5vmin;
        font-size: 1.2em;
    }

    .tour-step .footer {
        width: 100%;
        color: white;
        font-size: 1.2em;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

        .tour-step .footer div {
            padding: 1.4vmin;
            background-color: #3D3E39;
        }

        .tour-step .footer button {
            padding: 1.4vmin;
            background-color: #66B260;
            border: 0;
            -webkit-box-flex: 1;
            -ms-flex-positive: 1;
            flex-grow: 1;
            border-radius: 0;
        }

            .tour-step .footer button:focus {
                outline: none;
            }

    .tour-step.arrow-right .main:before {
        content: '';
        width: 0;
        height: 0;
        border-top: 26px solid transparent;
        border-bottom: 26px solid transparent;
        border-left: 21px solid #E0E0E0;
        position: absolute;
        top: 50%;
        left: 100%;
        transform: translateY(-50%);
    }

    .tour-step.arrow-right .main:after {
        content: '';
        width: 0;
        height: 0;
        border-top: 25px solid transparent;
        border-bottom: 25px solid transparent;
        border-left: 20px solid white;
        position: absolute;
        top: 50%;
        left: 100%;
        transform: translateY(-50%);
    }

    .tour-step.arrow-up .main:before {
        content: '';
        width: 0;
        height: 0;
        border-left: 26px solid transparent;
        border-right: 26px solid transparent;
        border-bottom: 21px solid #E0E0E0;
        position: absolute;
        left: 50%;
        bottom: 100%;
        transform: translateX(-50%);
    }

    .tour-step.arrow-up .main:after {
        content: '';
        width: 0;
        height: 0;
        border-left: 25px solid transparent;
        border-right: 25px solid transparent;
        border-bottom: 20px solid white;
        position: absolute;
        left: 50%;
        bottom: 100%;
        transform: translateX(-50%);
    }
