/*----------------------------------------Reference--------------------------------------------*/
/*
 * 1. Global Generic Styling
 * 2. Desktop styling
 * 3. Tablet Styling
 * 4. Mobile Styling
 *---------------------------------------------------------------------------------------------*/
/*-------------------------------------1. Global generic styling-------------------------------*/



#header{padding:3rem 0;}
#left-menu{margin-top: 1.5rem;}
#left-menu h4{padding:0.5rem; line-height: 1em; margin: 0;}
#left-menu ul{list-style: none; line-height: 1em; margin: 0;}
#left-menu ul li a {padding: 0.5rem; border-top-style: solid; border-top-width: 1px;}

.object-right {float: right; margin-left: 2rem;}
.object-left {float: left; margin-right: 2rem;}
.object-center{text-align: center;}
.halfwidth{width:50%}
.hidden{display:none;}
.invisible{visibility: hidden}
.no-right-padding{padding-right:0;}
.no-left-padding{padding-left: 0;}

::-webkit-input-placeholder {color: #000}
:-moz-placeholder {color: #000}
::-moz-placeholder {color: #000}
:-ms-input-placeholder {color: #000}

fieldset {border: none; margin: 0; padding: 0;}
fieldset > legend {display: none;}

#footer p{margin-bottom: 0.5rem;}

.ezdc-form input.box, textarea {background: #000; color: #fff;}

.links-positioning>.medium-block-grid-3{padding-left:1rem;}


div[class*='object']+a[name*='eztoc']+h1,div[class*='object']+a[name*='eztoc']+h2,div[class*='object']+a[name*='eztoc']+h3,div[class*='object']+a[name*='eztoc']+h4,div[class*='object']+a[name*='eztoc']+h5,div[class*='object']+a[name*='eztoc']+h6{margin-top:2rem;}

#main_area > .row {}
/*----------------------------------popup----------------------------------*/
.popup-overlay{ z-index:100; background: rgba(0, 0, 0, .50); display: none; position:fixed; width: 100%; height: 100%; z-index: 999;}

/*--------------------------------button---------------------------------------------*/
button, .button
{border: 1px solid #ddd;
    border-radius: 0.5rem;
    background: #333;
    height: 2rem;
    padding: 0 0.9rem;
    text-transform: uppercase;
    font-weight: bold!important;
    color: #00a0af;}
/*--------------------------------default input styles-------------------------------*/
input[type="text"], input[type="password"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="week"], input[type="email"], input[type="number"], input[type="search"], input[type="tel"], input[type="time"], input[type="url"]
{height: 1.8rem; margin-bottom:0.625em;}
textarea{resize:none; margin-bottom:0.625em; height: 6.25rem;}
textarea:focus {background: #000; border-color: #fff;}
#footer fieldset {border: none;padding: 0;margin:0;}
#footer button, #footer .button {height: 1.8rem; padding: 0.1rem 1rem; float:right;}

/*--------------------------------padding overrides-------------------------------*/
.no-right-padding {padding-right: 0;}
.no-left-padding {padding-left: 0;}
.no-padding {padding: 0;}

/**topbar
==================================*/
.top-bar .title-area {padding-left: 2rem;}
.top-bar{height:5rem;}

/**container definition
 =================================*/
#frame-container{max-width: 1280px;position: relative;}
.parent-row{min-height:42rem;}
.row.child-row-top,.row.child-row-bottom{max-width: 62.5rem!important;width:100%!important;margin-left: auto;margin-right: auto;}
#disp-accessories,.row.child-row-top{min-height:35rem;}
#disp-accessories{position: absolute;height:inherit;width: 100%;}

#bottle{background-repeat: no-repeat;			height: 43rem;			width: 13rem;			position: absolute;			right: 20%;			top: 5%;			z-index: 0;}


#frame-top{height: 60px;position: absolute;top: 0;width: 100%;}
#frame-bottom{height: 4rem;position: absolute;bottom: 0;width: 100%;}
/**Inner row
==================================*/
.content-view-full{margin-top:3.5rem}
.content-view-full .class-landing-page {margin-top:-4rem}

/**Content padding
==================================*/
div[class*='attribute-']{padding: 1.8rem 6rem 0 6rem;}
div.class-landing-page div[class*='attribute-'] {padding: 1.8rem 0 0;}
div.attribute-image {padding: 0;}
div.module-body {padding-bottom: 3rem;}
#footer .attribute-layout{padding-top:0}
#footer .attribute-full{padding:0;}

/**footer links
==================================*/
#main_area .links .links-positioning{height: 11.25rem;margin-bottom: 3rem;}

.links-positioning>ul>li {padding-bottom: 0.5rem;position:relative;}
.links-positioning>ul>li>div {position:relative;}
.links-positioning>ul>li>div>a{position: absolute;width: 100%;height: 100%;}
.links-positioning>ul.medium-block-grid-2>li:first-child{width:35%; margin-left:15%;}
.links-positioning>ul.medium-block-grid-2>li:last-child{width:35%; margin-right:15%;}
.links-positioning>ul.medium-block-grid-1>li{width: 35%;margin-left: 34%;}
.links-positioning>ul.medium-block-grid-3{margin-left:1.5rem;}
/**footer
 =================================*/


/*--------------------------------top bar----------------------------------------*/

.top-bar-section ul {padding-top: 1rem;padding-left: 15px;}
.top-bar-section ul.right {padding-right: 1rem;}




/*-------------------------------page header links-------------------------------*/


/*---------------------------------frame-----------------------------------------*/


/**modpage
===========================*/

#edit-buttons{padding-left: 3rem;padding-right: 3rem;}
a#edit-done {
    background-position: -100px -6350px;
    float: right;
    height: 59px;
    text-indent: 0;
    width: 290px;
}
a#edit-done:hover span {
    background-position: 0 -6650px;
}

a#edit-done span {
    background-position: 0 -6550px;
    height: 54px;
    margin: 0 auto;
    width: 158px;
}

a#edit-random {
    background-position: 0 -5900px;
    float: left;
    height: 35px;
    width: 223px;
}
a#edit-random:hover {
    background-position: 0 -5950px;
}


.class-landing-page .mod-page {display: block; position: relative; z-index: 9; margin-top: -7.5rem;}



/*----------------------------------2. Desktop styling----------------------------------*/
@media only screen and (min-width: 64.063rem){




    /**mod your page
    =================================*/
    #edit-page-panel{position: absolute;height: 25rem;max-width: 60rem;background-color: rgba(0,0,0,0.8);width: 100%;z-index: 10;top: 9rem;border:2px solid #00a0af;border-radius: 5px;}
    .active-accessory,#edit-page-panel{-webkit-box-shadow: 0px 0px 10px 5px rgba(0,160,175,1);-moz-box-shadow: 0px 0px 10px 5px rgba(0,160,175,1);box-shadow: 0px 0px 10px 5px rgba(0,160,175,1);}
    .accessory-select,.scroll-container{border:2px solid #333;border-radius: 5px;}
    .accessory-select{padding: 2rem 1rem;min-height: 13.3rem;}
    .accessory-select ul li{padding: 0.5rem;min-height: 4.5rem;margin-bottom: 0.5rem;text-align: center;}
    .module-fg>.row{padding: 0 3rem 1rem 3rem;}
    .scroll ul{margin-left:0;}
    .active-accessory{border:2px solid #00a0af!important; border-radius: 5px; min-height:5rem;}
    .bx-wrapper .bx-controls-direction a.bx-next{top: 94%;width: 100%;left: 0;background: #000;border-bottom: solid 1px #333;border-radius: 5px;}
    .bx-wrapper .bx-controls-direction a.bx-next:after{content: "";margin:auto;display: block;width: 0;height: 0;border: inset 5px;border-color: rgba(255, 255, 255, 0.6) transparent transparent transparent;border-top-style: solid;margin-top: -2.5px;top: 22.5px;}
    .bx-wrapper .bx-controls-direction a.bx-prev{top:6%;width: 100%;left: 0;background: #000;border-top: solid 1px #333;border-radius: 5px;}
    .bx-wrapper .bx-controls-direction a.bx-prev:after{content: "";margin:auto;display: block;width: 0;height: 0;border: inset 5px;border-color:  transparent transparent rgba(255, 255, 255, 0.6) transparent;border-top-style: solid;margin-top: -2.5px;top: 22.5px;}
    .bx-wrapper {margin: 0!important;padding: 30px 10px!important;}
    /**buttons
    ==================================*/
    #edit-done{float:right;}/*#00a0af*/

    /**Accessory placement
    ===================================*/
    #disp-accessories .Dice {position:absolute;left:35%;top:0%;}
    #disp-accessories .Mirrorball{position:absolute;left:80%;top:0%}
    #disp-accessories .Dog{position:absolute;left:0%;top:45%; }
    #disp-accessories .Hat{position:absolute;left: 5%;top: 0%;}
    #disp-accessories .Stereo{position: absolute;left: 38%;top: 54%;}
    #disp-accessories .Unmeatable{position:absolute;left: 65%;top: 30%;}
    /*----------------------------------popup----------------------------------*/
    .popup { z-index: 999; display:none; position: fixed; -moz-border-radius: 15px; border-radius: 15px;}
    .popup .data-text-position{position: relative; width: 100%;padding: 32px 10px 20px 10px;overflow: hidden;}
    .popup .data-text{position: relative; width: 100%; overflow-y: auto; padding-right: 10px;}
    .popup .data-text ol{padding-left: 50px;}
    .popup .data-title{text-align: center;}
    .popup .close{ font-weight: bold; position: absolute; top: 10px; right: 5px; z-index: 1;}

    .agegateframe{width:962px; height: 36rem;}
    .agegateframe{padding-top:2rem;padding-left:3rem;}
    .agegateframe select {height: 1.3125rem;font-size: 0.8rem;padding: 0 0.5rem;}
    .agegateframe .dob .columns{padding-right:0.1rem; padding-left:0.1rem;width: 25%;}

    .agegateframe{padding-top:2rem;padding-left:3rem;}
    .agegate-header p{padding-top: 1.8rem;}
    .agegate-header .attribute-image{padding-top: 2.5rem;}
    .agegateframe .body-copy{padding-top:2rem; padding-bottom: 3rem;}

    .agegateframe .dob .row .columns:first-child,.agegateframe .dob .row .columns:last-child{ padding-left: 0.9375rem;}
    .agegateframe .dob .row .columns:last-child{clear: both;}
    .Age-check p {margin-bottom: 0.9rem; width: 70%;}
    .Age-check .data-text-position{position: relative;width: 100%;padding: 20px 12px;overflow: hidden;}
    .Age-check .data-text{position: relative; width: 100%;}
    .Age-check .agegate-footer p {text-transform: none; font-weight: normal; width: 100%; margin: initial; }
    .Age-check .agegate-footer img {margin: 0;}
    .Age-check .agegate-footer .object-left{margin-left:13.5rem;}
    .Age-check .agegate-footer .object-right{margin-right:13.5rem;margin-top:12px;}
    .Age-check .agegate-footer .text-center{clear: both; padding-top: 2rem;}
    .agegate-footer{margin-top: 2rem;text-align: center;}

    .data-text-position{padding: 20px 10px;}

    .link-elements{padding-top:2rem;margin-bottom:6rem}


    /*-------------------------------forms-------------------------------------------*/

    fieldset.phone-image {float: right; margin-top: -9rem; margin-right: -5rem;}
    .ezdc-form label {display: inline-block; width: 6.25rem; vertical-align: top;}
    .ezdc-form .ezdc-form_description-form_description label {width: auto;}
    .ezdc-form input.box, textarea {display: inline-block; width: 20rem; background: #000; color: #fff;}
    .ezdc-form button {margin-left: 20.75rem;}

}
/*----------------------------------3. Tablet Styling-----------------------------------*/
@media only screen and (min-width: 40.063em) and (max-width: 64.0629rem){

    /**mod your page
    =================================*/
    #edit-page-panel{position: absolute;height: 25rem;background-color: rgba(0,0,0,0.8);width: 100%;z-index: 10;top: 9rem;border:2px solid #00a0af;border-radius: 5px;}
    .active-accessory,#edit-page-panel{-webkit-box-shadow: 0px 0px 10px 5px rgba(0,160,175,1);-moz-box-shadow: 0px 0px 10px 5px rgba(0,160,175,1);box-shadow: 0px 0px 10px 5px rgba(0,160,175,1);}
    .accessory-select,.scroll-container{border:2px solid #333;border-radius: 5px;}
    .accessory-select{padding: 2rem 1rem;min-height: 13.3rem;}
    .accessory-select ul li{padding: 0.5rem;min-height: 4.5rem;margin-bottom: 0.5rem;text-align: center;}
    .module-fg>.row{padding: 0 3rem 1rem 3rem;}
    .scroll ul{margin-left:0;}
    .active-accessory{border:2px solid #00a0af!important; border-radius: 5px; min-height:5rem;}
    .bx-wrapper .bx-controls-direction a.bx-next{top: 94%;width: 100%;left: 0;background: #000;border-bottom: solid 1px #333;border-radius: 5px;}
    .bx-wrapper .bx-controls-direction a.bx-next:after{content: "";margin:auto;display: block;width: 0;height: 0;border: inset 5px;border-color: rgba(255, 255, 255, 0.6) transparent transparent transparent;border-top-style: solid;margin-top: -2.5px;top: 22.5px;}
    .bx-wrapper .bx-controls-direction a.bx-prev{top:6%;width: 100%;left: 0;background: #000;border-top: solid 1px #333;border-radius: 5px;}
    .bx-wrapper .bx-controls-direction a.bx-prev:after{content: "";margin:auto;display: block;width: 0;height: 0;border: inset 5px;border-color:  transparent transparent rgba(255, 255, 255, 0.6) transparent;border-top-style: solid;margin-top: -2.5px;top: 22.5px;}
    .bx-wrapper {margin: 0!important;padding: 30px 10px!important;}

    /**Accessory placement
        ===================================*/
    #disp-accessories .Dice {position:absolute;left:35%;top:0%;}
    #disp-accessories .Mirrorball{position:absolute;left:80%;top:0%}
    #disp-accessories .Dog{position:absolute;left:0%;top:45%; }
    #disp-accessories .Hat{position:absolute;left: 5%;top: 0%;}
    #disp-accessories .Stereo{position: absolute;left: 38%;top: 54%;}
    #disp-accessories .Unmeatable{position:absolute;left: 65%;top: 30%;}

    /**buttons
    ==================================*/
    #edit-done{float:right;}/*#00a0af*/

    /**topbar
    ================================*/


    /**popup
    ----------------------------------*/
    .popup { z-index: 999; display:none; position: fixed; -moz-border-radius: 15px; border-radius: 15px; width: 100%;}
    .popup .data-text-position{position: relative; width: 100%;padding: 32px 10px 20px 10px;overflow: hidden;}
    .popup .data-text{position: relative; width: 100%; overflow-y: auto; padding-right: 10px;}
    .popup .data-text ol{padding-left: 50px;}
    .popup .data-title{text-align: center;}
    .popup .close{ font-weight: bold; position: absolute; top: 10px; right: 5px; z-index: 1;}

    .agegateframe{max-width:962px;width:100%; height: 34rem;}
    .agegateframe{padding-top:4rem;padding-left:rem;}
    .agegateframe select {height: 1.3125rem;font-size: 0.8rem;padding: 0 0.5rem;}
    .agegateframe .dob .columns{padding-right:0.1rem; padding-left:0.1rem;width: 25%;}

    .agegateframe{padding-top:2rem;padding-left:3rem;}
    .agegate-header p{padding-top: 0.8rem;}
    .agegate-header .attribute-image{padding-top: 0.2rem;}
    .agegateframe .body-copy{padding-top:3rem;margin-top:-0.5rem}


    .agegateframe .dob .row .columns:first-child,.agegateframe .dob .row .columns:last-child{ padding-left: 0.9375rem;}
    .agegateframe .dob .row .columns:last-child{clear: both;}
    .Age-check p {margin-bottom: 0.9rem; width: 70%;}
    .Age-check .data-text-position{position: relative; width: 100%;padding: 20px 12px;overflow: hidden;}
    .Age-check .data-text{position: relative; width: 100%;}
    .Age-check .agegate-footer p {text-transform: none; font-weight: normal; width: 100%; margin: initial; }
    .Age-check .agegate-footer img {margin: 0;}
    .Age-check .agegate-footer .object-left{margin-left:13.5rem;}
    .Age-check .agegate-footer .object-right{margin-right:13.5rem;margin-top:12px;}
    .Age-check .agegate-footer .text-center{clear: both; padding-top: 2rem;}
    .agegate-footer{			margin-top: 5rem;text-align: center;}

    .data-text-position{padding: 20px 10px;}

    .link-elements{padding-top:2rem;margin-bottom:6rem}

    /*-------------------------------forms-------------------------------------------*/


    fieldset.phone-image {float: right; margin-top: -9rem; margin-right: -5rem;}
    .ezdc-form label {display: inline-block; width: 6.25rem; vertical-align: top;}
    .ezdc-form .ezdc-form_description-form_description label {width: auto;}
    .ezdc-form input.box, textarea {display: inline-block; width: 20rem; background: #000; color: #fff;}
    .ezdc-form button {margin-left: 20.75rem;}


}

@media only screen and (max-width: 820px){
    .agegateframe{background: #000;}
}
/*----------------------------------4. Mobile Styling-----------------------------------*/
@media only screen and (max-width: 40.062em){

    /**mod your page
            =================================*/
    #edit-page-panel{position: absolute;height: 61rem;background-color: rgba(0,0,0,0.8);width: 100%;z-index: 10;top: 9rem;border:2px solid #00a0af;border-radius: 5px;}
    .active-accessory,#edit-page-panel{-webkit-box-shadow: 0px 0px 10px 5px rgba(0,160,175,1);-moz-box-shadow: 0px 0px 10px 5px rgba(0,160,175,1);box-shadow: 0px 0px 10px 5px rgba(0,160,175,1);}
    .accessory-select,.scroll-container{border:2px solid #333;border-radius: 5px;}
    .accessory-select{padding: 2rem 1rem;min-height: 13.3rem;}
    .accessory-select ul li{padding: 0.5rem;min-height: 4.5rem;margin-bottom: 0.5rem;text-align: center;}
    .module-fg>.row{padding: 0 3rem 1rem 3rem;}
    .scroll ul{margin-left:0;}
    .active-accessory{border:2px solid #00a0af!important; border-radius: 5px; min-height:5rem;}
    .bx-wrapper .bx-controls-direction a.bx-next{top: 94%;width: 100%;left: 0;background: #000;border-bottom: solid 1px #333;border-radius: 5px;}
    .bx-wrapper .bx-controls-direction a.bx-next:after{content: "";margin:auto;display: block;width: 0;height: 0;border: inset 5px;border-color: rgba(255, 255, 255, 0.6) transparent transparent transparent;border-top-style: solid;margin-top: -2.5px;top: 22.5px;}
    .bx-wrapper .bx-controls-direction a.bx-prev{top:6%;width: 100%;left: 0;background: #000;border-top: solid 1px #333;border-radius: 5px;}
    .bx-wrapper .bx-controls-direction a.bx-prev:after{content: "";margin:auto;display: block;width: 0;height: 0;border: inset 5px;border-color:  transparent transparent rgba(255, 255, 255, 0.6) transparent;border-top-style: solid;margin-top: -2.5px;top: 22.5px;}
    .bx-wrapper {margin: 0!important;padding: 30px 10px!important;}
    a#edit-done span {height: 54px;margin: 0;width: 158px;}
    a#edit-done {float: right;height: 59px;text-indent: 0;width: 100%;}

    /**Accessory placement
    ===================================*/
    #disp-accessories .Dice {position:absolute;left:35%;top:-1.5%;}
    #disp-accessories .Mirrorball{position:absolute;left:80%;top:-1.5%;}
    #disp-accessories .Dog{position:absolute;left:10%;top:45%; }
    #disp-accessories .Hat{position:absolute;left: 15%;top: 0%;}
    #disp-accessories .Stereo{position: absolute;left: 38%;top: 54%;}
    #disp-accessories .Unmeatable{position:absolute;left: 65%;top: 30%;}
    /**buttons
    ==================================*/
    #edit-done{float:right;}/*#00a0af*/

    #bottle{right: 20%;			top: 2%;}

    /**topbar
    ================================*/
    .links, .menu{padding:0}
    .name img{position: absolute;z-index: 1;height: 5rem;}
    .top-bar-section ul.left {padding-top: 1.5rem;}
    .top-bar-section ul li > a {padding: 5px 0;}

    .links-positioning>ul>li>div>.small-block-grid-1 > li{text-align: center;}
    /*----------------------------------popup----------------------------------*/
    .popup { z-index: 999; display:none; position: fixed; -moz-border-radius: 15px; border-radius: 15px; width: 100%;}
    .popup .data-text-position{position: relative; width: 100%;padding: 32px 10px 20px 10px;overflow: hidden;}
    .popup .data-text{position: relative; width: 100%; overflow-y: auto; padding-right: 10px;}
    .popup .data-text ol{padding-left: 50px;}
    .popup .data-title{text-align: center;}
    .popup .close{ font-weight: bold; position: absolute; top: 10px; right: 5px; z-index: 1;}


    .agegateframe{padding-top:2rem;padding-left:3rem;}
    .agegate-header p{padding-top: 1.8rem;}
    .agegate-header .attribute-image{padding-top: 0.8rem;}
    .agegateframe .body-copy{padding-top:2rem}

    .agegateframe {max-width:962px;width:100%; height: 34rem;}
    .agegateframe {padding-top:1rem;padding-left:0rem;background: #000;}
    .agegateframe select {height: 1.3125rem;font-size: 0.8rem;padding: 0 0.5rem;}


    .agegateframe .dob .row .columns:first-child,.agegateframe .dob .row .columns:last-child{ padding-left: 0.9375rem;}
    .agegateframe .dob .row .columns:last-child{clear: both;}
    .Age-check .agegate-header p {margin-bottom: 0.9rem;width: 70%;padding-top: 0.45rem;}
    .Age-check .body-copy{text-align: center;}
    .Age-check .body-copy p {margin-bottom: 0.9rem;width: 100%;}
    .Age-check .data-text-position{position: relative; width: 100%;padding: 20px 12px;overflow: hidden;}
    .Age-check .data-text{position: relative; width: 100%;}
    .Age-check .agegate-footer p {text-transform: none; font-weight: normal; width: 100%; margin: initial; }
    .Age-check .agegate-footer img {margin: 0;}
    .Age-check .agegate-footer .object-left{margin-left:13.5rem;}
    .Age-check .agegate-footer .object-right{margin-right:13.5rem;margin-top:12px;}
    .Age-check .agegate-footer .text-center{clear: both; padding-top: 2rem;}
    .agegate-footer{margin-top: 0.5rem;text-align: center;}

    .data-text-position{padding: 20px 10px;}

    .module-body {padding: 1rem 1rem;}
    .module-body>h1{font-size: 2.5rem; padding-top:3rem}
    .link-elements{padding-top:2rem;}

    div[class*='attribute-'] {padding: 1.8rem 1rem 0 1rem;}

    fieldset.phone-image { margin-top: -3rem;margin-right: 0;}

    /*footer
    ========================*/
    #main_area .links .links-positioning {height: auto;margin-bottom: 4.5rem;}
    .links-positioning>ul.small-block-grid-1>li {width: 94%;margin-left: 1%;}
}