/*

HOOLUX MEDICAL 2015

SITE STYLESHEET

http://hooluxmedical.com/

*/


/* ======================
    GLOBAL
====================== */

html,
body
{
    height: 100%;
}

body
{
    background-color: #fff;

    color: #404040;
    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
    font-weight: 400;

    padding: 0;
}

a
{
    color: #c9b990;
    font-size: 14px;
    outline: 0;
}

.container
{
    max-width: 970px;
}

.text-left
{
    text-align: left;
}

.bottom-20
{
    margin-bottom: 20px;
}

.top-20
{
    margin-top: 20px;
}

.top-40
{
    margin-top: 40px;
}

.top-70
{
    margin-top: 70px;
}

.hidden
{
    display: none;
}

p a,
a:active,
a:hover,
a:focus
{

    color: #e7e7e7;
    outline: 0;
    text-decoration: none;
}

.red
{
    color: red;
}

/* ======================
    IMAGES
====================== */

.img-responsive
{
    margin: 0 auto;
}

.alignme
{
    display: inline-block;
    float: none;

    margin-right: -4px;

    vertical-align: middle;
}

.welcome-top-block .img
{
    width: 100%;
}

/* ======================
    FONTS
====================== */

h1
{

    color: #e7e7e7;
    font-size: 2.4em;

    letter-spacing: 1.5px;
    line-height: 1.5;
    text-transform: uppercase;
}

h2
{
    font-size: 48px;
    line-height: 1.2;
    margin-bottom: 20px;

    margin-top: 20px;
}

h3
{

    color: #c9b990;
    font-family: 'Open Sans', sans-serif;
    font-size: 18px;
    font-weight: 600;
    line-height: 1.6;
    margin-bottom: 15px;

    margin-top: 20px;
}

p
{
    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
    line-height: 1.8;

    padding-bottom: 20px;
}

/* ======================
    MAIN NAVIGATION
====================== */

.navbar-default
{
    background-color: #000;
    border: none;
    border-radius: 0;
}

.navbar-default .navbar-collapse,
.navbar-default .navbar-form
{
    min-height: 65px;
}

.main-nav
{
    border-bottom: none;
}

.nav li a
{
    padding-bottom: 10px;
    padding-left: 12px;
    padding-right: 12px;

    text-transform: capitalize;
}

.navbar
{
    margin-bottom: 0;
    padding: 0;
}

.navbar-brand
{

    background: url(../images/_placeholder_logo_white.png) center;
    background-repeat: no-repeat;
    display: block;
    height: 40px;
    margin-bottom: 15px;
    margin-left: 15px;
    margin-top: 15px;
    padding: 13px 15px;

    text-indent: -9999px;

    width: 120px;
}

.navbar-nav
{
    float: right;
}

.navbar-default .navbar-nav > li > a
{

    color: #dadada;
    font-size: 13px;
    font-weight: 400;

    margin-top: 10px;
}

.welcome-page .navbar-default .navbar-nav > li > a.welcome,
.technology-page .navbar-default .navbar-nav > li > a.technology,
.content-page .navbar-default .navbar-nav > li > a.content,
.about-page .navbar-default .navbar-nav > li > a.about
{
    color: #c9b990;
}

.navbar-default .navbar-nav > li > a.active:hover,
.navbar-default .navbar-nav > li > a.active:focus
{
    cursor: default;
}

.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus
{
    background-color: transparent;
}

.navbar-default
{
    border-bottom: 0;
}

/* ======================
    BUTTONS
====================== */

.btn-lg,
.btn-group-lg > .btn
{

    border-radius: 0;
    font-size: 14px;

    letter-spacing: 1px;

    min-width: 120px;
    padding: 15px 40px;
    text-transform: uppercase;
}

.btn-default
{
    background-color: #404040;
    border: 0;
    color: #fff;
}

.btn-lg:focus
{
    box-shadow: none;
    outline: 0 !important;
}

/* ANGULAR DISABLED BUTTONS */

.btn-default.disabled,
.btn-default[disabled],
fieldset[disabled] .btn-default,
.btn-default.disabled:hover,
.btn-default[disabled]:hover,
fieldset[disabled] .btn-default:hover,
.btn-default.disabled:focus,
.btn-default[disabled]:focus,
fieldset[disabled] .btn-default:focus,
.btn-default.disabled.focus,
.btn-default[disabled].focus,
fieldset[disabled] .btn-default.focus,
.btn-default.disabled:active,
.btn-default[disabled]:active,
fieldset[disabled] .btn-default:active,
.btn-default.disabled.active,
.btn-default[disabled].active,
fieldset[disabled] .btn-default.active
{
    background-color: #e1e1e1;
    border-color: #ccc;
}


/* ======================
    SUB NAVIGATION
====================== */

.subnav
{

    display: block;
    position: absolute;
    right: 2em;
    top: 20em;
}

.subnav li
{

    content: '.';
    float: none;

    list-style: none;

    margin-top: 10px;
    text-align: right;
}

.subnav li a
{
    display: inline-block;

    text-transform: capitalize;

    width: 100%;
}

.subnav .label
{
    color: #5a5a5a;
    margin-right: 10px;

    opacity: 0;
       -moz-transition-duration: 350ms;
    -webkit-transition-duration: 350ms;
            transition-duration: 350ms;
       -moz-transition-property: color, opacity;
    -webkit-transition-property: color, opacity;
            transition-property: color, opacity;
       -moz-transition-timing-function: ease-in-out;

    -webkit-transition-timing-function: ease-in-out;
            transition-timing-function: ease-in-out;
}

.subnav li .dot
{

    cursor: pointer;
    display: inline-block;
    float: right;
    height: 21px;

    width: 20px;
}

.subnav li .dot .inner
{
    background: #3e3e3e;
       -moz-border-radius: 20px;

    -webkit-border-radius: 20px;
            border-radius: 20px;

    display: inline-block;
    height: 10px;
    left: -5px;
    position: relative;
    top: 2px;
       -moz-transform: scale(.6);
        -ms-transform: scale(.6);
    -webkit-transform: scale(.6);
            transform: scale(.6);
       -moz-transition: 250ms -moz-transform ease-in-out, 200ms opacity ease-in;
        -ms-transition: 250ms -ms-transform ease-in-out, 200ms opacity ease-in;

    -webkit-transition: 250ms -webkit-transform ease-in-out, 200ms opacity ease-in;
            transition: 250ms -webkit-transform ease-in-out, 200ms opacity ease-in;

    width: 10px;

         -o-border-radius: 20px;
}

.subnav li a:hover .label
{
    opacity: 1;
}

.subnav li a:hover .dot .inner
{

    background: #c9b990;
       -moz-transform: scale(1.5);
        -ms-transform: scale(1.5);
    -webkit-transform: scale(1.5);
            transform: scale(1.5);
}

.subnav li.active .dot .inner
{
    background: #c9b990;
}

.subnav .nav.navbar-nav > li > a
{
    padding: 0;
}

.subnav .navbar-nav > li > a:hover,
.subnav .navbar-nav > li > a:focus
{

    border-bottom: none;
    font-weight: normal;
}


/* SUB NAVIGATION - MOBILE */

.mobile-subnav
{
    display: none;
}


/* ======================
    MOBILE NAVIGATION
====================== */

.nav > li > a:hover,
.nav > li > a:focus
{
    background-color: transparent;
    color: #3d464d;
}

.fa-lg
{
    color: #3d464d;
}

.navbar-default
{
    border-bottom: 0;
}

.navbar-toggle
{

    border: 2px solid #e7e7e7;
    border-radius: 0;
    margin-top: 17px;
    padding: 0 5px;
}

.navbar-default .navbar-toggle:hover
{
    border-color: #3d464d;
}

.navbar-default .btn-link
{
    border: 2px solid #e7e7e7;
}

h2.menu
{

    color: #e7e7e7;
    font-size: 14px;

    margin: 0;
    padding: 4px 15px 4px 15px;

    text-transform: uppercase;
}

.navbar-default .btn-link:hover h2.menu,
.navbar-default .navbar-toggle:focus h2.menu
{

    color: #e7e7e7;
    text-decoration: none;
}

.navbar-default .btn-link:hover,
.navbar-default .btn-link:focus
{
    background-color: #3d464d;

    border: 2px solid #3d464d;
    text-decoration: none;
}

.fullscreen .modal-dialog
{

    color: #e7e7e7;
    height: 100%;
    margin: 0 0 0 0;
    padding: 0;
    width: 100%;
}

.fullscreen .modal-content
{
    background-color: #c9b990;
    border-radius: 0;
    color: #e7e7e7;
    font-size: 22px !important;

    height: 100%;

    opacity: .97;

    text-transform: uppercase;
}

.fullscreen .modal-body ul
{

    margin-top: 0;
    overflow: auto;
}

.fullscreen .modal-body li
{
    padding: 10px 0 10px 0;
}

.fullscreen .modal-body li:first-child
{
    padding-top: 0;
}

.fullscreen .modal-body li a:hover
{
    background-color: transparent;
    color: #3d464d;
}

.fullscreen .modal-body a
{

    color: #e7e7e7;
    line-height: 14px;
}

.modal-header
{
    border: 0;
}


/* ======================
    FOOTER
====================== */

.footer-wrapper
{

    height: auto !important;
    height: 100%;
    margin: 0 auto -60px;
    min-height: 100%;
    overflow: auto;
}

.footer,
.push
{
    height: 60px;
}

.footer
{
    background-color: #f5f7f9;

    color: #5a5a5a;
    font-size: 12px;
    padding-bottom: 15px;

    padding-top: 22px;
}

.footer-links a
{

    color: #5a5a5a;
    font-size: 12px;
}

.footer-links a:hover
{
    color: #c9b990;
}

/* ======================
    PAGE TITLE
====================== */

.hide
{
    display: none;
}

/* ======================
    UPDATE BROWSER MSG
====================== */

body .buorg
{
    background: #f5f7f9;

    border-bottom: 1px solid #e5e9ed;
    font-family: 'Open Sans', sans-serif;
    padding-bottom: 8px;

    padding-top: 6px;
}

body .buorg a
{

    color: #ff646a;
    text-decoration: underline;
}

body #buorgclose
{
    font-size: 25px;
    height: 30px;
    right: 15px;

    top: 5px;

    width: 22px;
}

/* ======================
    WELCOME
====================== */

.compliance-image
{

    background-size: 860px 330px;
    width: 100%;
}

.tick
{
    height: 175px;

    text-indent: -10000px;
}

.tick-container
{
    position: absolute;
    top: 0;

    width: 100%;
}

.tick span
{

    background: url(../images/welcome/compliance/tick.svg) no-repeat top center;
    background-size: 35px 35px;
    height: 35px;
    position: absolute;

    width: 35px;
}

.tick:first-child span
{
    left: 47%;
    top: 43%;
}

.tick:nth-child(2) span
{
    left: 11%;
    top: 51%;
}

.tick:nth-child(3) span
{
    left: 46%;
    top: 5%;
}

.tick:nth-child(4) span
{
    left: 10%;
    top: 12%;
}

.compliance-block .intro
{
    font-weight: normal;
}

.compliance-block .more-info
{
    text-decoration: underline;
}

.compliance-block .well
{
    border-top: 1px solid #e1e1e1;
    margin-top: 20px;
}

.compliance-block .download-pdf
{
    font-weight: bolder;
    color: #c9b990;
    text-align: left;
    padding-top: 20px;
}

/* ======================
    INDEX PAGE VIDEO
====================== */

.intro-vid-homepage .video-foot-achor
{
    font-size: 2em;
}

.fa-chevron-right
{
    font-size: 12px;

    text-indent: 5px;
}

.fa-chevron-down
{
    font-size: 32px;
}

/* ======================
    INDEX PAGE BENEFIT BLOCKS
====================== */

.benefit
{

    background-size: 100px;
    position: relative;

    width: 100px;
}

.benefit-icon-wrap
{

    min-height: 110px;
    position: relative;
}

.benefits-block .waiting
{
    bottom: 2px;
}

.benefits-block .lit
{
    bottom: 5px;
}

.benefits-block .compliance
{
    bottom: 8px;
}

.benefits-block .insights
{
    bottom: 15px;
}

.benefits-block a
{
    color: #404040;
}

/* ======================
    TECHNOLOGY PAGE
====================== */

.technology-page,
.technology-page .navbar-default,
.welcome-top-block
{
    background-color: #000;
    color: #e7e7e7;
}

.technology-page .navbar-default .navbar-nav > li > a
{
    color: #dadada;
}

/* ======================
    CONTENT/SECTION BLOCKS
====================== */

.container-fluid.top
{
    padding-top: 280px;
}

body.individual .container-fluid.top
{
    padding-top: 370px;
}

.intro-vid-homepage
{
    position: relative;
    top: 25px;
}

.block
{
    margin-top: 80px;
    padding-bottom: 80px;
}

.block-top
{
    padding-bottom: 65px;
    padding-top: 125px;
}

.block-no-top
{
    padding-bottom: 65px;
    padding-top: 0;
}

.block.border,
.block-top.border,
.technology-page .block.border,
.about-page .block.border,
.welcome-page .block.border
{
    border-bottom: 1px solid rgba(225, 225, 225, 0);
}

.compliance-block hr,
.referrals-block hr,
.patient-block hr,
.booking hr
{
    background-image: linear-gradient(to right, rgba(210, 210, 210, .1), rgba(210,210,210,1), rgba(210, 210, 210, .1));

    border: 0;
    height: 2px;
    margin-top: 0;
}

.delivery hr
{
    background-image: linear-gradient(to right, rgba(37, 37, 37, .3), rgba(37,37,37,1), rgba(37, 37, 37, .3));

    border: 0;
    height: 2px;
    margin-top: 0;
}

.compliance-block hr,
.booking hr
{
    margin-top: -1px;
}

.white
{
    background-color: #fff;
}

.welcome-top-block
{
    margin-top: 0;
}

/* ALT BLOCKS FOR WELCOME PAGE */

.alt-block
{

    border-bottom: 1px solid rgba(225, 225, 225, 0);
    margin-top: 80px;

    min-height: 100%;
    padding-bottom: 80px;
    position: relative;
}

.block .copy
{
    margin-top: 10%;
}

.literacy-img
{

    background: url('../images/welcome/1.6_Health-Literacy_Still.jpg') 57% 20% no-repeat #fff;
    background-size: cover;
    min-height: 600px;
    padding-bottom: 0;
}

.insights-img
{

    background: url('../images/welcome/business_insights.jpg') 57% 20% no-repeat #fff;
    background-size: cover;
    min-height: 796px;
    padding-bottom: 0;
}

.biometric-img
{

    background: url('../images/technology/technology_4.jpg') 0 0 no-repeat #000;
    background-size: cover;
    min-height: 600px;
    padding-bottom: 0;
}


/* ======================
    ABOUT
====================== */

.content-buzzfit-top,
.about-top
{
    margin-top: 120px;
}

/* ======================
    ANIMATIONS
====================== */

.moving,
.dly-anim
{
    visibility: hidden;
}

.show-for-animation
{
    visibility: visible;
}

.no-animate
{
    visibility: visible;
}

/* ======================
    CONTENT/BUZZFIT PAGE
====================== */

.show-reel
{
    position: relative;
}

.show-reel .vimeo-embed
{

    background-color: blue;
    margin-left: 40%;
    margin-right: 40%;
    position: absolute;
    top: 24.7%;

    width: 20%;
}

.waiting-room-tile
{

    background: url(../images/content/content_bg_smaller-compressed.jpg) no-repeat top center;
            background-size: contain;
    height: 679px;
    margin-top: 40px;
    position: relative;

    width: 100%;
    -webkit-background-size: contain;
       -moz-background-size: contain;
         -o-background-size: contain;
}

.content-tv
{
    width: 59%;
}

.content-reel-vimeo-container
{
    margin-left: 23.3%;
    margin-right: 23.3%;
    position: absolute;
    top: 9.9%;

    width: 49.4%;
}

.share a
{
    background-color: #eee;
    background-position: center;
    background-repeat: no-repeat;
    color: #fff;
    direction: ltr;
    text-indent: -10000px;
    width: 30px;
}

.share-twitter
{
    background: url(../images/share/share-twitter.svg);
    background-size: 20px;
}

.share-linkedin
{
    background: url(../images/share/share-linkedin.svg);
    background-size: 22px;
}

.share-gplus
{
    background: url(../images/share/share-gplus.svg);
    background-size: 24px;
}

.share-whatsapp
{
    background: url(../images/share/share-whatsapp.svg);
    background-size: 18px;
}

/* ======================
    FORMS
====================== */

.white textarea:focus,
.white input[type='text']:focus,
.white input[type='email']:focus,
.white input[type='number']:focus,
.white .uneditable-input:focus
{
    border-color: rgba(201, 185, 144, .8);
    box-shadow: 0 1px 1px rgba(0, 0, 0, .075) inset, 0 0 8px rgba(201, 185, 144, .8);
    outline: 0 none;
}

.help-block
{

    color: #f0c72f;
    font-size: 13px;

    padding-top: 10px;
}

.help-block.dark
{
    color: #3d464d;
}

.form-group label,
.form-group label.white-label,
.contact-form label
{
    display: none;
}

.check a:hover
{
    color: #e7e7e7;
}

.form-control
{
    background-color: transparent;
    background-image: none;
    border: 2px solid #e7e7e7;
    border-radius: 0;
    -webkit-box-shadow: none;
            box-shadow: none;

    color: #e7e7e7;
    font-family: 'Open Sans', sans-serif;

    height: 54px;
    margin-top: 28px;

    -webkit-appearance: none;
}

.form-control.no-top
{
    margin-top: 0;
}

.form-control.top
{
    margin-top: 10px;
}

.form-control::-webkit-input-placeholder
{

    color: #e7e7e7;
    font-weight: 400;
}

.form-control::-moz-placeholder
{
    color: #e7e7e7;
}

.form-control:-ms-input-placeholder
{
    color: #e7e7e7;
}

.white .form-control
{
    border: 2px solid #e5e9ed;
}

.white .form-control::-webkit-input-placeholder
{
    color: #aaa9ae;
}
.white .form-control::-moz-placeholder
{
    color: #aaa9ae;
}

.white .form-control:-ms-input-placeholder
{
    color: #aaa9ae;
}

label
{
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
}

/* CONTACT FORM MSGS */

.success
{
    background-color: #c9b990;

    color: #fff;
    padding: 15px;
}

.errors
{
    background-color: #ff646a;

    color: #e7e7e7;
    padding: 15px;
}

/* LOCATIONS */



/* ======================
    IFRAMES - RESPONSIVE
====================== */


iframe.map
{

    border: 0;
    height: 1350px;
    padding: 0;
    width: 100%;
}

.myIframe
{

    height: 0;
    padding-bottom: 54.25%;
    padding-top: 30px;
    position: relative;

    -webkit-overflow-scrolling: touch;
}

.myIframe iframe
{
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;

    width: 100%;
}

.footer-wrapper
{
    overflow: hidden;
}

/* ======================
    MEDIA QUERIES
====================== */

/* MOBILE - XS */

@media (min-width:0) and (max-width:767px){
    .item .col-sm-3 img
    {
        padding-bottom: 20px;
    }

    .text-xs-center
    {
        text-align: center;
    }

    .container.pad
    {
        padding-left: 15px;
        padding-right: 15px;
    }

    .text-left.center-xs,
    .center-xs
    {
        text-align: center;
    }

    .navbar
    {
           -moz-transition: background .5s ease-in-out,padding .5s ease-in-out;
        -webkit-transition: background .5s ease-in-out,padding .5s ease-in-out;
                transition: background .5s ease-in-out,padding .5s ease-in-out;
    }

    .top-nav-collapse
    {
        padding: 0;
    }

    .navbar-nav
    {
        float: none;
    }

    .main-nav
    {
        border-bottom: none;
    }

    .subnav
    {
        display: none;
    }

    /* FOOTER */

    .footer-wrapper
    {
        margin: 0 auto -95px;
    }

    .footer,
    .push
    {
        height: 95px;
    }

    /* CONTENT/BUZZFIT */

    .content-buzzfit-top
    {
        padding-bottom: 20px;
    }

    .waiting-room-tile
    {

        background: none;
        height: auto;
        margin-bottom: 0;
        width: 100%;
    }

    .content-tv
    {
        display: none;

        width: 60%;
    }

    .content-reel-vimeo-container
    {
        margin: 0 auto;
        position: relative;

        width: 100%;
    }

    .tick span
    {

        background-size: 20px 20px;
        height: 20px;
        width: 20px;
    }

    /* WELCOME PAGE TICKS IN COMPLIANCE */

    .tick
    {
        height: 83px;
    }

    /* MOBILE SUBNAV */
    .mobile-subnav
    {
        display: block;

        width: 100%;
    }
}

/* TABLET - SM */

@media (min-width:767px) and (max-width:992px){
    /* FOOTER */

    .footer-wrapper
    {
        margin: 0 auto -65px;
    }

    .footer,
    .push
    {
        height: 65px;
    }
    .footer
    {
        padding-top: 15px;
    }

    #revenue h3
    {
        min-height: 30px;
    }

    /* CONTENT/BUZZFIT */

    .waiting-room-tile
    {
        max-height: 440px;
    }

    /* WELCOME PAGE TICKS IN COMPLIANCE */

    .tick
    {
        height: 128px;
    }

    .footer .copy
    {
        text-align: left;
    }
}

/* LAPTOP - MD */

@media (min-width:992px) and (max-width:1200px){
    .myIframe
    {
        padding-bottom: 53.25%;
    }

    .footer-wrapper
    {
        margin: 0 auto -65px;
    }

    .footer,
    .push
    {
        height: 65px;
    }

    .container.text
    {
        width: 840px;
    }

    /* CONTENT/BUZZFIT */

    .waiting-room-tile
    {
        max-height: 610px;
    }

    /* WELCOME PAGE TICKS IN COMPLIANCE */

    .tick
    {
        height: 172px;
    }
}

/* DESKTOP - LG */

@media (min-width:1200px){
    .container.text
    {
        width: 840px;
    }
}
