/* CSS Document */

html, body { width: 100%; font-size: 16px; font-family: "museo-sans",sans-serif; font-weight: 300; -moz-font-smoothing: antialiased; -webkit-font-smoothing: antialiased; -webkit-text-size-adjust: none; font-smoothing: antialiased; text-rendering: optimizeLegibility; overflow-x: hidden; }

* { margin: 0; padding: 0; border: 0; }
a { outline: 0; text-decoration: none; }

/* ------------------------------------------------------------------------------------ */
/* TYPE */
/* ------------------------------------------------------------------------------------ */

h1, h2, h3, h4, h5 { font-family: "museo-sans",sans-serif; font-weight: 300; line-height: inherit; }

h1 { font-size: 2.5rem; color: #47c5f7; line-height: 1.2em; margin: 0 0 .15em 0; }
h2 { font-size: 1.8rem; color: #626364; margin-bottom: 1em; }
h3 { font-size: 1.25rem; color: #47c5f7; line-height: 1.3em; margin-bottom: .5em; }

hgroup h2 { font-size: 1.625rem; }

h2.inside { font-size: 1.5rem; color: #47c5f7; margin-bottom: .5em; }

p, ol, ul { font-size: 1rem; color: #626364; line-height: 1.5em; margin-bottom: 1.5em; }

ol { list-style-position: inside; margin: 0 0 1.5em 0; }
ul.nostyle { list-style: none; margin: 0 0 1.5em 0; list-style-position: inside; }

.whyus ul { list-style: none; }
.whyus li { line-height: 1.6em; margin-bottom: 25px; }
.whyus li .fas { color: #47c5f7; }
.whyus h3 { margin-bottom: 2em; }

ul.fees { list-style: none; margin: 0 0 .5em 0; list-style-position: inside; }
ul.fees li { margin-bottom: 15px; }

span { color: #47c5f7; }

nav li { font-size: 0.93rem; }

header .divcontact .fas { font-size: 1.375rem; color: #47c5f7; }
header .divtel { font-size: 1.25rem; color: #FFF; }

address { font-style: normal; }

#banner h2 { font-size: 2.25rem; color: #47c5f7; line-height: 1em; margin: 0 0 .5em 0; } 
#banner p { font-size: 1.25rem; color: #FFF; margin: 0 0 .35em 0; }
#banner .fas { color: #47c5f7; }
#banner ul li { color: #FFF; line-height: 2em; }

#banner .more { position: absolute; width: 100%; bottom: 85px; font-size: 1.25rem; color: #47c5f7; text-shadow: 4px 4px 8px black; z-index: 99; }

.divbannercontent h2 { font-size: 3.75rem; color: #FFF; line-height: 1em; margin: 0 0 .25em 0; } 
.divbannercontent h3 { font-size: 1.75rem; color: #FFF; margin: 0; }

.featured .title { font-size: 1.7rem; color: #FFF;  }
.featured .description { font-size: 1rem; color: #FFF; line-height: 1.3em; margin-bottom: .35em; }

.testimonial blockquote { color: #FFF; font-size: 1.1rem; line-height: 1.5em; }
.testimonial blockquote cite { color: #626364; font-size: 1rem;  margin-bottom: 0; }

blockquote { color: #626364; font-size: 1.15rem; line-height: 1.6em; }
blockquote cite { display: block; color: #47c5f7; font-size: 1rem; margin-bottom: 30px; }

.btn, .btn1 { font-size: 1.1rem; }

.white h2,
.white p, 
.white ul,
.white ul li, 
.white ol { color: #FFF; }

.white blockquote { font-size: 1.25em; color: #FFF; line-height: 1.5em; margin-bottom: 30px; }

span.grey { color: #626364; }

footer ul li { font-size: .9rem; color: #FFF; line-height: 1.8em; }
footer .fas,
footer .far { color: #47c5f7; }
.footercontact { font-size: 1.125rem; }
.divcredits p { color: #FFF; }

.form, .referrals, .form input, .referrals input, .form textarea, .referrals textarea, .form .send, .referrals .send { font-size: 1rem; font-family: "museo-sans",sans-serif; font-weight: 300; color: #626364; }
.form p, .referrals p { text-align: left; margin: 8px 0 0 0; }



/* Placeholder Colour */
::-moz-placeholder { opacity: .8; }

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #626364;
}
::-moz-placeholder { /* Firefox 19+ */
  color: #626364;
 }
:-ms-input-placeholder { /* IE 10+ */
  color: #626364;
}
:-moz-placeholder { /* Firefox 18- */
 color: #626364;
}

.left { float: left; }
.right { float: right; }
.txtleft { text-align: left; }
.txtright { text-align: right; }
.txtcenter { text-align: center; }
.caps { text-transform: uppercase; }

.CookieDeclarationDialogText { display: none; }

/* ------------------------------------------------------------------------------------ */
/* LINKS */
/* ------------------------------------------------------------------------------------ */

a { color: #47c5f7; }
a:hover { color: #626364; }

header .divtel a { color: #FFF; }
header .divtel a:hover { color: #47c5f7; }

nav li a { color: #FFF; }
nav li a:hover,
nav li a.active { color: #47c5f7; }

.subnav a { color: #626364; }
.subnav a:hover { color: #FFF; }

.white a { color: #ccc; }
.white a:hover { color: #FFF; }

footer a { color: #FFF; }
footer a:hover { color: #47c5f7; }

.divcredits a { color: #47c5f7; }
.divcredits a:hover { color: #FFF; }

/* BTNS */
.btn { display: inline-block; margin: 10px; }
.btn a { display: inline-block; padding: 15px 30px; background: #47c5f7; text-align: center; color: #FFF; border-radius: 30px; }
.btn a:hover { background: #626364; }

.topbtn a { display: inline-block; padding: 8px 30px; background: #47c5f7; border-radius: 30px; color: #FFF; text-align: center; }
.topbtn a:hover { background: #000; }  

.featured .btn a { position: absolute; top: 0; right: 0; width: 50px; height: 50px; margin: 0; padding: 0; border-radius: 0; }
.featured .btn IMG { width: 100%; height: auto; }

.downbtn a { position: absolute; bottom: 50px; width: 100%; height: 25px; background: url(../images/down-arrow.png) no-repeat center; background-size: 25px; z-index: 999; } 

.scrollToTop { width: 50px; height: 50px; position: fixed; bottom: 80px; right: 20px; display: none; background: url(../images/back-to-top.png) no-repeat; z-index: 9999; cursor: pointer; background-size: 50px; }
.scrollToTop:hover { text-decoration: none; }

a.anchor { display: block; position: relative; top: -70px; visibility: hidden; }

/* ------------------------------------------------------------------------------------ */
/* STRUCTURE */
/* ------------------------------------------------------------------------------------ */

.mobilehide { display: block; }
.desktophide { display: none; }

.clearfix:after { content: ' '; display: block; clear: both; }

.divcontainer { float: left; position: relative; width: 100%; }
.divcontent { position: relative; max-width: 1100px; margin: auto; padding: 50px 20px; }
.divcontentxtrapad { position: relative; max-width: 1100px; margin: auto; padding: 80px 20px; }
.divcontentlesspad { position: relative; max-width: 1100px; margin: auto; padding: 30px 20px; }
.divcontentnopad { position: relative; max-width: 1100px; margin: auto; padding: 0 20px; }
.divcontentnarrow { position: relative; max-width: 800px; margin: auto; padding: 0 20px 50px; }


/* Xtra Padding & Margins */
.divpt30 { padding-top: 30px; }
.divpb30 { padding-bottom: 30px; }
.divpb80 { padding-bottom: 80px; }
.divxtrapad { padding: 40px 0; }

.divider { display: inline-block; width: 125px; height: 5px; background: #47c5f7; margin: 10px 0 25px 0; }

header { position: absolute; width: 94%; padding: 0 3%; min-height: 110px; background: rgba(23,66,82,0.5); z-index: 999; }
header .divlogo { float: left; width: 285px; height: auto; margin: 22px 0 0; }
header .divlogo IMG { width: 100%; height: auto; }
header .divcontact { float: right; text-align: right; width: 70%; margin: 10px 0 2px; }
header .divtel { position: relative; top: 4px; right: 20px; line-height: 2em; }


.sticky-header { position: fixed; top: 0; left: 0; padding: 0; width: 94%; padding: 0 3%; min-height: 68px; background: rgba(23,66,82,0.85); animation-duration: 0.8s; animation-name: fadeIn; border-bottom: 2px solid #47c5f7; z-index: 9999; }
.sticky-header nav { float: right; display: block; margin: 0; padding: 10px 0 0; }
.sticky-header nav ul { list-style: none; text-align: right; margin: 0; }
.sticky-header nav li { display: inline-block; padding: 12px 0 0 15px; }
.sticky-header nav li ul { padding-top: 15px; }
.sticky-header nav li ul li { margin: 0; padding: 0; }
.sticky-header .divlogo { float: left; width: 200px; height: auto; margin: 10px 0 0; }
.sticky-header .divlogo IMG { width: 100%; height: auto; }
.sticky-header .divcontact { display: none; }
.sticky-header .divtel { display: none; }


nav { float: right; display: block; margin: 0; padding: 10px 0 0; }
nav ul { list-style: none; text-align: right; margin: 0; }
nav li { display: inline-block; padding: 0 0 0 15px; }

.slicknav_menu { display: none; }

ul.subnav { display: block; list-style: none; }
ul.subnav li a { display: block; padding: 15px 10px; background: #EEE; border-bottom: 3px solid #FFF; }
ul.subnav li a:hover { background: #47c5f7; }

#banner { position: relative; width: 100%; height: 580px; }
#banner .divbannercontent { width: 450px; margin: 250px 0 0; }

.divbannercontentwrap { position: relative; width: 90%; height: 100%; padding: 0 5%; }
.divbannercontent { position: relative; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); }
.divbannerbot { position: absolute; bottom: 0; width: 100%; height: 75px; background: url(../images/banner-bottom.png) no-repeat center; background-size: 100% 100%; z-index: 90; } 


.offers { float: left; width: 90%; padding: 5%; background: #EEE; margin: 30px 0; border-radius: 10px; }


#featured { margin-top: 30px; }

.featured { display: block; position: relative; width: 100%; height: 350px; background: #CCC; overflow: hidden; }
.featuredcontent { position: absolute; float: left; bottom: 0; width: 100%; min-height: 30%; padding: 3% 0; background: rgba(41,171,226,0.75); }
.featuredtxt { position: absolute; width: 90%; padding: 0 5%;  top: 50%; left: 50%; transform: translate(-50%, -50%); }

.featured .metalbraces { position: absolute; width: 100%; height: 100%; background: url(../images/metal-braces-in-soho.jpg) no-repeat center; background-size: cover; transition-duration: 0.8s; transition-timing-function: ease; } 
.featured:hover .metalbraces { transform: scale(1.5); }

.featured .whitebraces { position: absolute; width: 100%; height: 100%; background: url(../images/white-braces-in-soho.jpg) no-repeat center; background-size: cover; transition-duration: 0.8s; transition-timing-function: ease; } 
.featured:hover .whitebraces { transform: scale(1.5); }

.featured .sixmonthsmiles { position: absolute; width: 100%; height: 100%; background: url(../images/six-month-smiles-in-soho.jpg) no-repeat center; background-size: cover; transition-duration: 0.8s; transition-timing-function: ease; } 
.featured:hover .sixmonthsmiles { transform: scale(1.5); }

.featured .incognito { position: absolute; width: 100%; height: 100%; background: url(../images/incognito-braces-in-soho.jpg) no-repeat center; background-size: cover; transition-duration: 0.8s; transition-timing-function: ease; } 
.featured:hover .incognito { transform: scale(1.5); }

.featured .winbraces { position: absolute; width: 100%; height: 100%; background: url(../images/win-lingual-braces-in-soho.jpg) no-repeat center; background-size: cover; transition-duration: 0.8s; transition-timing-function: ease; } 
.featured:hover .winbraces { transform: scale(1.5); }

.featured .invisalign { position: absolute; width: 100%; height: 100%; background: url(../images/invisalign-braces-in-soho.jpg) no-repeat center; background-size: cover; transition-duration: 0.8s; transition-timing-function: ease; } 
.featured:hover .invisalign { transform: scale(1.5); }

.teampic { display: inline-block; width: 200px; height: 200px; margin-bottom: 20px; }
.teampic IMG { width: 100%; height: auto; }

.feeswrap { display: block; float: left; padding: 5%; min-height: 530px; background: #47c5f7; margin-top: 30px; }
.feeswrapless { display: block; float: left; padding: 5%; min-height: 410px; background: #47c5f7; margin-top: 30px; }

.testimonial-review { min-height: 320px; padding: 5%; }
.testimonial .pic { min-height: 320px; padding: 5%; }
.testimonial .pic IMG { width: 100%; height: auto; }
.testimonial blockquote cite { display: block; margin-top: 15px; }

.case1 { background: url(../images/patient-stories/luul-case-study-collage.jpg) no-repeat center center; background-size: cover; }  
.case2 { background: url(../images/patient-stories/luke-case-study-collage.jpg) no-repeat center center; background-size: cover; }  
.case3 { background: url(../images/patient-stories/hd-case-study-collage.jpg) no-repeat center center; background-size: cover; }  
.case4 { background: url(../images/patient-stories/jessica-case-study-collage.jpg) no-repeat center center; background-size: cover; }  
.case5 { background: url(../images/patient-stories/g-case-study-collage.jpg) no-repeat center center; background-size: cover; }  
.case6 { background: url(../images/patient-stories/r-case-study-collage.jpg) no-repeat center center; background-size: cover; }  

.owl-theme .owl-controls .owl-page { display: inline-block; padding-top: 20px; zoom: 1; *display: inline; }
.owl-theme .owl-controls .owl-page span { display: block; width: 12px; height: 12px; margin: 5px 7px; filter: Alpha(Opacity=50); opacity: 0.5; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; background: #47c5f7; }

.owl-theme .owl-controls .owl-page.active span,
.owl-theme .owl-controls.clickable .owl-page:hover span { filter: Alpha(Opacity=100); opacity: 1; }

.associations IMG { margin: 10px 10px; vertical-align: middle; }

footer .footerlogo { display: block; width: 285px; height: auto; margin: 0 auto 30px; }
footer .footerlogo IMG { width: 100%; height: auto; }
.footercontact { margin: 30px 0; }
.divcredits { padding: 10px 0; }



/* PARALLAX SLIDES */
.parallax { position: relative; float: left; width: 100%; min-height: 600px; margin: 0; z-index: 80; background: #CCC; }
.casestudiesbg { background: url(../images/casestudies-bg.jpg) 50% 0 repeat fixed; background-size: cover; }
.compservicebg { background: url(../images/complete-service-bg.jpg) 50% 0 repeat fixed; background-size: cover; }



.video-container { position: relative; padding-bottom: 52%; padding-top: 35px; height: 0; overflow: hidden; margin: 20px 0; }
.video-container iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.maps iframe { width: 100%; height: 500px; }

.medivision { text-align: center; margin-bottom: 20px; }
.medivision IMG { width: 100%; height: auto; }

.entryimage IMG { width: 100%; height: auto; margin-bottom: 15px; }
.entryimage.medium IMG { width: 60%; height: auto; }
.entryimage.small IMG { width: 30%; height: auto; }


.lightgreybg { background: #EEE; }
.greybg { background: #626364; }
.greybgborder { background: #333; border-top: 5px solid #47c5f7; }
.bluebg { background: #47c5f7; }
.footerbg { background: url(../images/footer-angled-bg.png) no-repeat top left #626364; background-size: 100% 100%; }
.blueborder { border-top: 5px solid #47c5f7; border-bottom: 4px solid #47c5f7; }
.casestudiesbg { border-top: 5px solid #47c5f7; border-bottom: 4px solid #47c5f7; background: url(../images/casestudies-bg.jpg) repeat; }


 

/* ------------------------------------------------------------------------------------ */
/* COLLAPSABLE DATA TABLE (FEES) */
/* ------------------------------------------------------------------------------------ */

table { border: 1px solid #5e0a4f; width: 100%; margin: 0 0 30px 0; padding: 0; border-collapse: collapse; border-spacing: 0; }
table tr { border: 1px solid #5e0a4f; padding: 5px; }
table tr:nth-child(even) { background: #EEE; }
table tr:nth-child(odd) { background: #FFF; }
table th { padding: 10px; text-align: left; color: #FFF; }
table td { padding: 10px; text-align: left; color: #626364; }
table th { font-size: 1.1em; background: #47c5f7; font-weight: 300; }


/* ACCORDION STYLE */
ul#accordion { padding: 2px 0; margin-bottom: 40px; }
ul#accordion li { list-style-type: none; color: #626364; }
ul#accordion p { color: #626364; }
ul#accordion a { text-decoration: none; color: #47c5f7; }
ul#accordion a:hover { text-decoration: none; }
ul#accordion a:focus { text-decoration: underline; }

button { cursor: pointer; margin: 0; font-family: "museo-sans",sans-serif; font-weight: 400; text-align: center; }

/* Helpers */
.is-hidden { display: none; }
.accordion__item { width: 100%; border-top: 1px solid #fff;  }
.accordion__item:first-child { border: none; }
.accordion__trigger { display: block; width: 100%; padding: 10px 20px; color: #FFF; background-color: #47c5f7; border: none; font-size: 1.2em; }
.accordion__item.is-open .accordion__trigger { color: #fff; background-color: #333; }
.accordion__content { background-color: #EEE; padding: 20px;  }
.accordion__content p { margin: 0; margin-bottom: 1.5em; line-height: 1.4em; }

/* ------------------------------------------------------------------------------------ */
/* FORMS */
/* ------------------------------------------------------------------------------------ */

.form { float: left; width: 100%; padding: 0; }
.formwrap { float: left; width: 90%; padding: 15px 5%; }
.form input { width: 94%; padding: 0 3%; min-height: 40px; background: #FFF; border: 1px solid #CCC; margin: 0 0 2px 0; } 
.form textarea { width: 97%; height: 90px; padding: 3% 1.5%; background: #FFF; border: 1px solid #CCC; margin: 0 0 5px 0; } 
.form label { display: inline-block; margin: 10px 10px 0; float: left; width: 150px; text-align: left; }
.form [type=checkbox] { display: block; margin: 0 8px 5px 0; width: 17px; float: left; }
.form .send { float: right; margin: -25px 0 0 0; display: block; width: 53px; cursor: pointer; border: none; background: url(../images/send-btn.png) no-repeat; background-size: 53px 36px; -webkit-appearance: none; }


.referrals { float: left; width: 100%; padding: 0; }
.referrals input { width: 94%; padding: 0 3%; min-height: 40px; background: #FFF; border: 1px solid #CCC; margin: 0 0 8px 0; } 
.referrals textarea { width: 97%; height: 70px; padding: 1.5%; background: #FFF; border: 1px solid #CCC; margin: 0 0 8px 0; } 
.referrals [type=checkbox] { display: block; margin: 0 8px 5px 0; width: 17px; float: left; }
.referrals .send { float: right; margin: 20px 0 0 0; display: block; width: 53px; cursor: pointer; border: none; background: url(../images/send-btn.png) no-repeat; background-size: 53px 36px; -webkit-appearance: none; }


/* GRID 
------------------------------------------------------------------------------------ */

.one-half, .one-third, .one-fourth, .two-thirds, .three-fourths, .full-width { display: inline-block; float: left; margin-right: 2%; }

.one-half { width: 49%; }
.casestudies .one-half { width: 50%; margin: 0; }
.one-third { width: 32%; }
.one-third.featured { width: 33%; margin: .2%; }
.one-fourth { width: 23.5%; }
.two-thirds { width: 66%; }
.three-fourths { width: 74%; }
.full-width { width: 100%; }
.column-last { margin-right: 0 !important; }


@media only screen 
and (min-width : 768px) 
and (max-width : 1023px) {
	
nav { display: none; }
.slicknav_menu { display: block; }
.sticky-header { display: none; }

header { min-height: 100px; }
header .divlogo { width: 250px; }
header .divcontact { float: right; width: 60%; text-align: right; margin: 25px 0 0; }

.featured { display: block; position: relative; width: 100%; height: 350px; background: #CCC; overflow: hidden; }
.featuredcontent { position: absolute; bottom: 0; width: 90%; height: 40%; padding: 5%; background: rgba(41,171,226,0.75); }

.testimonial blockquote { font-size: 1rem; }
.testimonial blockquote cite { font-size: .95rem; }

}


@media only screen 
and (min-width : 320px) 
and (max-width : 767px) {
	
.mobilehide { display: none; }
.desktophide { display: block; }

/* ------------------------------------------------------------------------------------ */
/* TYPE */
/* ------------------------------------------------------------------------------------ */

html, body { font-size: 15px; }

h1 { font-size: 2rem; }
h2 { font-size: 1.6rem; }
h3 { font-size: 1.25rem; }

#banner h2 { font-size: 2rem; } 
#banner p { font-size: 1rem; }
#banner ul li { font-size: 0.95rem; line-height: 1.6em; }

.divbannercontent h2 { font-size: 3rem; } 
.divbannercontent h3 { font-size: 1.5rem; }

.whyus li { line-height: 2em; }
.whyus h3 { margin-bottom: 1em; }
.whyus li { margin-bottom: 15px; }

.testimonial blockquote { font-size: 1rem; line-height: 1.4em; }
.testimonial blockquote cite { font-size: .9rem; }

.divcontact a { color: #FFF; }
.divcontact a:hover { color: #47c5f7; }

.btn { margin: 5px; }

.scrollToTop { width: 40px; height: 40px; bottom: 50px; right: 10px; background-size: 40px; }

/* ------------------------------------------------------------------------------------ */
/* STRUCTURE */
/* ------------------------------------------------------------------------------------ */

nav { display: none; }
.slicknav_menu { display: block; }
.sticky-header { display: none; }

.divcontent { z-index: 9999; }

header { position: absolute; width: 96%; padding: 0 2%; min-height: 120px; background: rgba(23,66,82,0.5); z-index: 999; }
header .divlogo { float: none; display: block; width: 240px; height: auto; margin: 20px auto 0; }
header .divtel { right: 10px; }

.divcontact { float: none; text-align: left; position: absolute; top: 15px; left: 10px; width: 90%; margin: 0; }

#banner { height: 470px; }
#banner .divbannercontent { width: 100%; margin: 180px 0 0; }
#banner .overlay { position: absolute; width: 100%; height: 100%; background: rgba(0,0,0,0.6); z-index: 99; }

.divbannerbot { height: 45px; } 

.testimonial .pic { min-height: 230px; padding: 0; }
.testimonial-review { min-height: 150px; padding: 10%; }

.feeswrap { min-height: 300px; margin-top: 15px; }

.maps iframe { height: 350px; }

/* PARALLAX SLIDES */
.slide1 { position: relative; background-size: cover; background-attachment: scroll !important; background-position: bottom !important; }

.entryimage IMG,
.entryimage.medium IMG,
.entryimage.small IMG { width: 100%; height: auto; }

.form { width: 100%; padding: 30px 0 0; }
.form .send { margin: 0; }

.formwrap { width: 100%; padding: 15px 0; }

.g-recaptcha { transform: scale(0.77); -webkit-transform: scale(0.77); transform-origin: 0 0; -webkit-transform-origin: 0 0; margin-top: 15px; }

/* ------------------------------------------------------------------------------------ */
/* COLLAPSABLE DATA TABLE (FEES) */
/* ------------------------------------------------------------------------------------ */

table { border: 0; }
table thead { display: none; }
table tr { margin-bottom: 10px; display: block; border-bottom: 1px solid #5e0a4f; }
table td { display: block; text-align: right; font-size: .95em; border-bottom: 1px dotted #5e0a4f; }
table td:last-child { border-bottom: 0; }
table td:before { content: attr(data-label); float: left; font-weight: bold; }

/* ------------------------------------------------------------------------------------ */
/* GRID */
/* ------------------------------------------------------------------------------------ */

.one-half, .one-third, .one-fourth, .two-thirds, .three-fourths, .full-width { margin-right: 0; }

.one-half { width: 100%; }
.casestudies .one-half { width: 100%; margin: 0; }
.one-third { width: 100%; }
.one-third.featured { width: 100%; margin: 0.25em 0; }
.one-fourth { width: 100%; }
.two-thirds { width: 100%; }
.three-fourths { width: 100%; }
.full-width { width: 100%; }

}
