/*

 * HTML5 Boilerplate

 *

 * What follows is the result of much research on cross-browser styling.

 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,

 * Kroc Camen, and the H5BP dev community and team.

 */



/* ==========================================================================

   Base styles: opinionated defaults

   ========================================================================== */



html,

button,

input,

select,

textarea {

    color: #222;

}



body {

    font-size: 1em;

    line-height: 1.4;

	/* background: url(images/bg.jpg) no-repeat top center; */

}



/*

 * Remove text-shadow in selection highlight: h5bp.com/i

 * These selection declarations have to be separate.

 * Customize the background color to match your design.

 */



::-moz-selection {

    background: #b3d4fc;

    text-shadow: none;

}



::selection {

    background: #b3d4fc;

    text-shadow: none;

}



/*

 * A better looking default horizontal rule

 */



hr {

    display: block;

    height: 1px;

    border: 0;

    border-top: 1px solid #ccc;

    margin: 1em 0;

    padding: 0;

}



/*

 * Remove the gap between images and the bottom of their containers: h5bp.com/i/440

 */



img {

    vertical-align: middle;

}



/*

 * Remove default fieldset styles.

 */



fieldset {

    border: 0;

    margin: 0;

    padding: 0;

}



/*

 * Allow only vertical resizing of textareas.

 */



textarea {

    resize: vertical;

}



/* ==========================================================================

   Chrome Frame prompt

   ========================================================================== */



.chromeframe {

    margin: 0.2em 0;

    background: #ccc;

    color: #000;

    padding: 0.2em 0;

}



/* ==========================================================================

   Author's custom styles

   ========================================================================== */

@font-face {

    font-family: 'rns_cameliaregular';

    src: url("rns_camelia-webfont.eot");

    src: url("rns_camelia-webfont.eot?#iefix") format('embedded-opentype'),

         url("rns_camelia-webfont.woff") format('woff'),

         url("rns_camelia-webfont.ttf") format('truetype'),

         url("rns_camelia-webfont.svg#rns_cameliaregular") format('svg');

    font-weight: normal;

    font-style: normal;



}







.container {width:96%; margin:auto; padding:0 2%;}

.row {max-width:1000px; width:100%; margin:auto; position:relative;}

header.container {padding-top:35px;}

.main {padding:20px 0 40px 2%; float:left; width:70%; z-index:

10; position:relative;}

.left {width:301px; height:450px; padding-top:26px;  text-align:center; position:absolute; top:35px; right:0px; background: url(images/circle.png) no-repeat;}

.logo {width:208px; height:188px; background: url(images/logo.png) no-repeat; display:block; text-indent:-9999px; float:left;}

.mainUl {margin:117px 0 0 0; padding:0px; }

.mainUl li {list-style-type:none; font-size:15px; float:left; font-family: 'rns_cameliaregular'; margin-left:15px; position: relative;}

.mainUl li:first-child {margin-left:0px;}

.mainUl li a {display:inline-block; text-decoration:none; color:#47c3d3;}

.mainUl li a:visited {text-decoration:none; color:#47c3d3;} 

.mainUl li a:hover {border-bottom:1px solid #47c3d3;}

.mainUl li a.selected {border-bottom:1px solid #47c3d3;}



h1 {font-family: 'rns_cameliaregular'; font-size:18px; color:#6a747b;}

h2 {font-size:16px; color:#47c3d3; margin:0px 0px 15px; letter-spacing:5px; font-family:"Times New Roman", Times, serif; text-transform:uppercase;}

h3 {font-size:13px; color:#fff; letter-spacing:3px; font-family:"Times New Roman", Times, serif;}

.main h3 {font-family: 'rns_cameliaregular'; font-size:16px; color:#47c3d3; border-top:1px solid #47c3d3; border-bottom:1px solid #47c3d3; padding:5px 0 2px;}

p {font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 

   font-weight: 300; font-size:13px; margin:0px 0 20px 0; line-height:150%;}

.main a {font-weight:bold; color:#47c3d3; text-decoration:none; font-size:13px;}

.main a:visited {font-weight:bold; color:#47c3d3; text-decoration:none; font-size:13px;} 

.main a:hover {text-decoration:underline;}



.main table {font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 

   font-weight: 300; font-size:13px;}

.main table tr td:first-child {width:75%;}   

.left a {color:#fff; text-decoration:none; font-size:13px;}

.left a:visited {color:#fff; text-decoration:none; font-size:13px;} 

.left a:hover {text-decoration:underline;}



.left p {color:#fff; margin:15px 0;}



footer { }

footer p {font-size:10px;}



.mobHeader {display:none;}

.staff {display: inline-block; margin-bottom: 30px;}

.staff-text {float: left; max-width: 70%; padding-right: 10px;}

.staff h2 {margin:0px 0px 15px; padding: 0px;}

.staff-pic {padding-left: 50px;}

.treatment-pics {margin-bottom: 30px;}


.formContainer {width:350px; margin-left:20px;}

.formDiv {margin-bottom:5px;}

label {float:left; display:block; width:120px; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 

   font-weight: 300; font-size:13px; }

input[type=text] {display:block; border:1px solid #6a747b; width:200px; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 

   font-weight: 300; font-size:13px; }

   input[type=email] {display:block; border:1px solid #6a747b; width:200px; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 

   font-weight: 300; font-size:13px; }

textarea {display:block; border:1px solid #6a747b; width:200px; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 

   font-weight: 300; font-size:13px; }

input[type=submit] {display:block; float:l; border:none; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 

   font-weight: 300; font-size:13px; color:#fff; background-color:#47c3d3;}

input[type=submit]:hover {color:#47c3d3; background-color:#fff;} 

.wpcf7-response-output {font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 

   font-weight: 300; font-size:16px; color:#000;}

.wpcf7 {padding-left:20px;}   

.sub-nav {display: none; position: absolute; top: 20px; left: -41px; width: 300px;}
.page-id-11 .sub-nav,
.page-id-217 .sub-nav {display: block;}

.sub-nav-a {display: none; position: absolute; top: 20px; left: -39px; width: 300px;}

.page-id-7 .sub-nav-a,
.page-id-9 .sub-nav-a,
.page-id-106 .sub-nav-a
 {display: block;}
 
.sub-nav-b {display: none; position: absolute; top: 20px; left: -39px; width: 300px;}


.page-id-13 .sub-nav-b,
.page-id-42 .sub-nav-b
 {display: block;}

@media only screen and (max-width: 768px){



}



@media only screen and (max-width: 650px){
  .ultra { display: none;}

	.formDiv input[type=text], .formDiv textarea {width:100%;}

	.formContainer {width:100%; margin-left:0px;}

header.container {padding-top: 0px;}	

.container {width:100%; margin:auto; padding:0; background-color:#FFF;}

.mobHeader {display:block; height:94px; width: 100%;padding: 0%; background-color:#fff;}

#mobile-wrap {-webkit-box-shadow: 0px 0px 5px 5px #000;

box-shadow: 0px 0px 5px 5px #000; }

.navon {-webkit-transition:margin 200ms ease; margin-left:-68%; max-width:101%; overflow:hidden; z-index:10; position:relative;}

.navoff {max-width:101%; overflow:hidden; z-index:10; position:relative; margin-left:0%;}

.menu {display:block; width:81px; height:32px; float:right; margin-right:4%; cursor:pointer;  background:url(images/menu.png) no-repeat; background-size:81px 32px; margin-top:16px;}

.mainHeader {position:absolute; padding:0px; margin:0px; top:0px; width:100%; height:auto; background-color:transparent; overflow:hidden;}

.mainHeader .logo {display:none;}

.mobHeader .logo {width:94px; height:94px; background: url(images/logo.png) no-repeat; background-size:94px 94px; margin:10px 0 0 2%;}

.mainUl {width:100%; height:auto; background-color:transparent; padding-top: 0px; margin: 0px 0 0 0;}

.mainUl li { list-style-type:none; float:none;}

.mainUl li a {display:block; text-decoration:none; padding:15px 5% 15px 33%; border-bottom:1px solid #120000; border-top:none; font-size:12px; color:#ffffff; background-color:#6a747b;}

.mainUl li a:visited {color:#FFF;} 

.mainUl li a:hover {border-bottom:1px solid #120000;}

.mainUl li a:active {border-bottom:1px solid #120000; background-color:#47c3d3;}

.mainUl li a.selected:hover {border-bottom:1px solid #47c3d3;}

.left {width: 301px;height: 500px;padding-top: 26px;text-align: center;position: static;background: url(images/circle.png) no-repeat; float:none; margin:auto; margin-bottom:60px;}

.main {padding: 20px 2% 40px 2%;float: none;width: 96%;z-index: 10;position: relative;}

.main img {width:100%; height:auto;}

footer {position: static;}

footer p {text-align:center;}

.mainUl li:first-child {margin-left: 15px;}

#formSpam 				{ display:none; }

.staff {display: inline-block; margin-bottom: 30px;}

.staff-text {max-width: 90%; padding: 0px;}

.staff h2 {margin:0px 0px 15px; padding: 0px;}

.staff-pic {padding: 0px;}

.sub-nav {display: inline-block; position: static; top: 20px; left: 0px; width: 100%; padding: 0; margin: 0;}

.sub-nav-a {display: inline-block; position: static; top: 20px; left: 0px; width: 100%; padding: 0; margin: 0;}

.sub-nav-b {display: inline-block; position: static; top: 20px; left: 0px; width: 100%; padding: 0; margin: 0;}

.sub-nav li,
.sub-nav-a li,
.sub-nav-b li {margin: 0 !important;}
}

/* ==========================================================================

   Helper classes

   ========================================================================== */



/*

 * Image replacement

 */



.ir {

    background-color: transparent;

    border: 0;

    overflow: hidden;

    /* IE 6/7 fallback */

    *text-indent: -9999px;

}



.ir:before {

    content: "";

    display: block;

    width: 0;

    height: 150%;

}



/*

 * Hide from both screenreaders and browsers: h5bp.com/u

 */



.hidden {

    display: none !important;

    visibility: hidden;

}



/*

 * Hide only visually, but have it available for screenreaders: h5bp.com/v

 */



.visuallyhidden {

    border: 0;

    clip: rect(0 0 0 0);

    height: 1px;

    margin: -1px;

    overflow: hidden;

    padding: 0;

    position: absolute;

    width: 1px;

}



/*

 * Extends the .visuallyhidden class to allow the element to be focusable

 * when navigated to via the keyboard: h5bp.com/p

 */



.visuallyhidden.focusable:active,

.visuallyhidden.focusable:focus {

    clip: auto;

    height: auto;

    margin: 0;

    overflow: visible;

    position: static;

    width: auto;

}



/*

 * Hide visually and from screenreaders, but maintain layout

 */



.invisible {

    visibility: hidden;

}



/*

 * Clearfix: contain floats

 *

 * For modern browsers

 * 1. The space content is one way to avoid an Opera bug when the

 *    `contenteditable` attribute is included anywhere else in the document.

 *    Otherwise it causes space to appear at the top and bottom of elements

 *    that receive the `clearfix` class.

 * 2. The use of `table` rather than `block` is only necessary if using

 *    `:before` to contain the top-margins of child elements.

 */



.clearfix:before,

.clearfix:after {

    content: " "; /* 1 */

    display: table; /* 2 */

}



.clearfix:after {

    clear: both;

}



/*

 * For IE 6/7 only

 * Include this rule to trigger hasLayout and contain floats.

 */



.clearfix {

    *zoom: 1;

}



/* ==========================================================================

   EXAMPLE Media Queries for Responsive Design.

   Theses examples override the primary ('mobile first') styles.

   Modify as content requires.

   ========================================================================== */



@media only screen and (min-width: 35em) {

    /* Style adjustments for viewports that meet the condition */

}



@media print,

       (-o-min-device-pixel-ratio: 5/4),

       (-webkit-min-device-pixel-ratio: 1.25),

       (min-resolution: 120dpi) {

    /* Style adjustments for high resolution devices */

}



/* ==========================================================================

   Print styles.

   Inlined to avoid required HTTP connection: h5bp.com/r

   ========================================================================== */



@media print {

    * {

        background: transparent !important;

        color: #000 !important; /* Black prints faster: h5bp.com/s */

        box-shadow: none !important;

        text-shadow: none !important;

    }



    a,

    a:visited {

        text-decoration: underline;

    }



    a[href]:after {

        content: " (" attr(href) ")";

    }



    abbr[title]:after {

        content: " (" attr(title) ")";

    }



    /*

     * Don't show links for images, or javascript/internal links

     */



    .ir a:after,

    a[href^="javascript:"]:after,

    a[href^="#"]:after {

        content: "";

    }



    pre,

    blockquote {

        border: 1px solid #999;

        page-break-inside: avoid;

    }



    thead {

        display: table-header-group; /* h5bp.com/t */

    }



    tr,

    img {

        page-break-inside: avoid;

    }



    img {

        max-width: 100% !important;

    }



    @page {

        margin: 0.5cm;

    }



    p,

    h2,

    h3 {

        orphans: 3;

        widows: 3;

    }



    h2,

    h3 {

        page-break-after: avoid;

    }

}


/*===============  VIDEO =============== */

.videoWrapper {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 */
    padding-top: 25px;
    height: 0;
}
.videoWrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}


