/* 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; }

h1 { font-size: 2.375em; color: #392346; margin-bottom: .25em; }
h2 { font-size: 1.8em; color: #999; margin-bottom: 1em; }

h2.inside { font-size: 1.6em; color: #392346; margin-bottom: .5em; }

h3 { font-size: 1.2em; color: #392346; margin-bottom: .25em; text-transform: uppercase }
h4 { font-size: 1.26em; color: #392346; margin-bottom: .5em; }

p { font-size: 1em; color: #999; line-height: 1.5em; margin-bottom: 1.5em; }

p span { color: #392346; }

.title { font-size: 1.8em; color: #FFF; margin-bottom: 15px; }

.services h2 { font-size: 2.625rem; margin-bottom: 0; color: #392346; }
.services p { font-size: 1.15rem; margin-bottom: 0; color: #392346; }

.white h1, .white h2, .services .white h2, .services .white p, .white p { color: #FFF; }

ul.nostyle { list-style: none; font-size: 1em; color: #999; line-height: 1.5em; margin-bottom: 1.5em; }
ol { font-size: 1em; color: #999; line-height: 1.5em; margin-bottom: 1.5em; list-style-position: inside; }
ol li { margin-bottom: 1em; list-style-position: inside; }

header .contactinfo { font-size: 1.15em; text-transform: uppercase; font-weight: 500; }
header .fas { color: #999; }
header .fa-phone-alt { padding: 0 3px 0 0; }
header .fa-comments { font-size: 1.25rem; padding: 0 3px 0 20px; }

.cta h2 { font-size: 2.5em; color: #392346; margin: 0; }
.cta p { font-size: 1.75em; color: #999; margin-bottom: 1em; }

.ctainside h2 { font-size: 2.5em; color: #392346; margin: 0; }
.ctainside p { font-size: 1.75em; color: #FFF; margin-bottom: 1em; }

nav { font-size: .86rem; text-transform: uppercase; }

header .entrybuttons { font-size: 1.1rem; text-transform: uppercase; }

.entrylinks { font-size: .86rem; color: #999; text-transform: uppercase; }

#banner .title, #banner2 .title { font-size: 2.625em; color: #FFF; }
#banner .titleblk, #banner2 .titleblk { font-size: 2.625em; color: #392346; }
#banner .subtitle, #banner2 .subtitle { font-size: 1.375em; color: #392346; }
#banner .subtitlewht, #banner2 .subtitlewht { font-size: 1.375em; color: #b2b2b2; }
#banner .fa, #banner2 .fa  { color: #FFF; margin-top: 15px; }

.featured { font-size: 1.5em; }

.featured2 .title { font-size: 2em; color: #FFF; margin: 0;  }
.featured2 .subtitle { font-size: 1.25em; color: #b2b2b2; }
.featured2 .fa { color: #FFF; }

.sidebarbox .title { font-size: 1.7em; color: #FFF; margin: 0 0 5px 0; line-height: 1.2em; }
.sidebarbox .subtitle { font-size: 1.15em; color: #b2b2b2; padding-bottom: 10px; }
.sidebarbox .fa { color: #FFF; }

.btn { font-size: 1.25em; }

.courses .far,
.courses .fas { color: #392346; }

.socialside { font-size: 1.1rem; }

blockquote { font-size: 1.4em; line-height: 1.4em; padding: 0 5%; color: #999; }
cite { display: block; font-size: .85em; color: #FFF; font-style: normal; padding: 20px 0; }

blockquote.inside { font-size: 1em; line-height: 1.5em; margin: 10px 0; padding: 0 0 20px 0; }
blockquote.inside cite { display: block; font-size: 1em; color: #392346; font-style: normal; padding: 20px 0 0; }

footer .title { font-size: 1.2em; color: #392346; margin-bottom: .25em; }
footer li { font-size: .95em; color: #FFF; }
footer .fa { color: #FFF; }
footer p { color: #392346; }
address { font-style: normal; }

.form, .form input, .form select, .form textarea { font-family: "museo-sans",sans-serif; font-size: 1em; color: #FFF; }
.form select { font-style: .9rem; }
.form .send { font-size: 1em; color: #FFF; }

.directions, .directions input { font-family: "museo-sans",sans-serif; font-size: 1.1em; color: #FFF; font-weight: 100; }

.referrals h2 { font-size: 2em; color: #8c8290; text-align: left; margin-bottom: .25em; } 
.referrals input, .referrals textarea, .referrals .send { font-size: 1em; color: #392346; font-family: "museo-sans",sans-serif; font-weight: 300; }
.referrals label { color: #FFF; }
.referrals p { font-size: .9em; line-height: 1.3em; color: #FFF; margin: 2px 0; } 
.referrals .send { font-size: 1.2em; color: #FFF; }


/* Placeholder Colour */
.form ::-moz-placeholder, .directions ::-moz-placeholder { opacity: .8; }
.form ::-webkit-input-placeholder, .form ::-moz-placeholder, .form :-ms-input-placeholder, .form :-moz-placeholder { color: #FFF; }


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

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

a { color: #392346; }
a:hover { color: #999; }

nav li a { color: #392346; }
nav li a:hover, nav li a.active { color: #999; }

.subnav li a { display: block; padding: 3%; background: #392346; color: #FFF; } 
.subnav li a:hover { background: #EEE; color: #392346; } 
.subnav li a.active { background: #EEE; color: #392346; } 

header .entrydent a { float: right; width: 155px; height: 22px; padding: 28px 0 28px 20px; background: url(../images/for-dentists.png) no-repeat; color: #ababab; background-size: cover; } 
header .entrydent a:hover { background: url(../images/for-dentists-hover.png) no-repeat; color: #392346; background-size: cover; } 
header .entrydent a.active { background: url(../images/for-dentists-hover.png) no-repeat; color: #392346; background-size: cover; } 

header .entrypat a { float: left; text-align: right; width: 155px; height: 22px; padding: 28px 20px 28px 0; background: url(../images/for-patients.png) no-repeat; color: #ababab; background-size: cover; } 
header .entrypat a:hover { background: url(../images/for-patients-hover.png) no-repeat; color: #FFF; background-size: cover; } 
header .entrypat a.active { background: url(../images/for-patients-hover.png) no-repeat; color: #FFF; background-size: cover; } 

header .contact a { color: #FFF; }
header .contact a:hover { color: #999; }

.entrylinks a { color: #999; padding: 0 10px; }
.entrylinks a:hover { color: #FFF; }
.entrylinks a.active { color: #FFF; }

.socialside a { display: block; color: #999; padding: 5px 0; }
.socialside a:hover { color: #FFF; }

.ctainside a { color: #FFF; }
.ctainside a:hover { color: #392346; }

.featured a { color: #FFF; }
.featured a:hover { color: #b2b2b2; }

.services .title a { color: #FFF; }
.services .title a:hover { color: #999; }

.form a { color: #999; }
.form a:hover { color: #FFF; }

.referrals a { color: #8c8290; }
.referrals a:hover { color: #FFF; }


footer a { color: #FFF; }
footer a:hover { color: #392346; }


/* ARROWS */
.nextbtn1 a { display: block; width: 30px; height: 30px; margin: 10px auto 0; background: url(../images/next-btn-white.png) no-repeat center; background-size: 30px; }
.nextbtn2 a { display: block; width: 30px; height: 30px; margin: 10px auto 0; background: url(../images/next-btn-purple.png) no-repeat center; background-size: 30px; }
.downbtn1 a { display: block; width: 30px; height: 30px; margin: 10px auto; background: url(../images/arrow-down.png) no-repeat center; background-size: 30px; }



/* BTNS */

.btn { margin: 10px 0; font-weight: 300; }
.btn a { display: inline-block; width: 260px; height: 26px; padding: 22px 0; background: url(../images/btn-bg.png) no-repeat center; text-align: center; color: #FFF; background-size: cover; }
.btn a:hover { color: #b2b2b2; }

.btn2 a { display: inline-block; width: 260px; height: 26px; padding: 22px 0; background: url(../images/btn2-bg.png) no-repeat center; text-align: center; color: #FFF; background-size: cover; }
.btn2 a:hover { color: #392346; }

.coursebtn a { display: inline-block; padding: 10px 20px; background: #392346; color: #FFF; }
.coursebtn a:hover { background: #b2b2b2; color: #FFF; }

.soldoutbtn a { display: inline-block; padding: 10px 20px; background: #E10609; color: #FFF; }
.soldoutbtn a:hover { background: #A60205; color: #FFF; }

.divarrow a { display: block; padding: 20px 0; font-size: 1.3em; color: #392346; }

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

/* ------------------------------------------------------------------------------------ */
/* 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: 60px 20px; }
.divcontentnarrow { position: relative; max-width: 800px; margin: auto; padding: 60px 20px; }
.divcontentnopad { position: relative; max-width: 1100px; margin: auto; padding: 0 20px; }
.divblock { float: left; width: 100%; margin-bottom: 30px; }
.divxtrapadbot { padding-bottom: 40px; }
.divxtrapad { padding: 60px 0; }

.entry-image IMG { float: left; border: 1px solid #999; width: 99%; height: auto; margin-bottom: 1em; }
.entry-image-medium IMG { float: left; width: 60%; padding: 0 15%; height: auto; margin: 1.5em 0; }

.icondiv { display: inline-block; width: 130px; height: 130px; margin-bottom: 30px; }
.icondivsml { display: inline-block; width: 80px; height: 80px; margin-bottom: 30px; }
.icondiv IMG, .icondivsml IMG { width: 100%; height: auto; }

.icondiv-alt { position: relative; width: 100%; height: 130px; margin: -68px auto 0; text-align: center; z-index: 999; }
.icondiv-alt IMG { width: 130px; height: 130px; }

.icondivadvert { position: relative; width: 100%; height: 130px; margin: -75px auto 0; text-align: center; z-index: 999; }
.icondivadvert IMG { width: 130px; height: 130px; }

.teethbg { background: url(../images/teeth-background-image.jpg) no-repeat bottom right; background-size: contain; } 
.purplefade { background: url(../images/purple-fade.jpg) repeat-x top #392346; }
.purple { background: #392346; }
.greybg { background: #adadad; }
.greyfade { background: url(../images/top-fade-grey.jpg) repeat-x top; }
.greyfadebot { display: block; width: 100%; height: 80px; margin-top: -80px; background: url(../images/bot-fade-grey.jpg) repeat-x bottom; }
.iconlarge { position: absolute; width: 100%; height: 520px; background: url(../images/icon-large-bg.png) no-repeat center center; background-size: auto 100%; }

.divtop { float: left; width: 100%; height: 75px; background: url(../images/top-curve.png) no-repeat center bottom; background-size: 100% 100%; }
.divbot { float: left;  width: 100%; height: 75px; background: url(../images/bot-curve.png) no-repeat center top; background-size: 100% 100%; }

.divadverttopwhite { float: left; position: relative; width: 100%; height: 75px; background: url(../images/top-curve-white.png) no-repeat center top; background-size: 100% 100%; z-index: 99; }
.divadverttop { float: left; position: relative; width: 100%; height: 75px; background: url(../images/top-curve-grey.png) no-repeat center top; background-size: 100% 100%; z-index: 99; }
.divadvertbot { float: left; position: relative; width: 100%; height: 75px; margin: -75px 0 0 0; background: url(../images/bot-curve-purple.png) no-repeat center bottom; background-size: 100% 100%; z-index: 99; }
.divadverttoppurple { float: left; position: relative; width: 100%; height: 75px; background: url(../images/top-curve-purple.png) no-repeat center top; background-size: 100% 100%; z-index: 99; }

header { float: left; position: relative; width: 100%; min-height: 160px; padding: 15px 0 0; background: #392346; }
header .divlogo { float: left; position: relative; width: 540px; height: auto; margin-top: 10px; z-index: 999; } 
header .divlogo IMG { width: 100%; height: auto; }
header .social { position: relative; margin-top: 5px; z-index: 999; }
header .social IMG { width: 31px; height: 31px; }
header .contact { float: right; margin-top: 35px; }

header .entrybuttons { position: absolute; right: 10px; top: 94px; width: 350px; height: 78px; z-index: 999; }

.entrylinks { position: absolute; top: 15px; left: 5px; }

#banner { float: left; position: relative; width: 100%; height: 650px; margin-top: -80px; background: #EEE; } 
#banner .divtop { position: absolute; top: 0; width: 100%; height: 75px; background: url(../images/top-curve-header.png) no-repeat center bottom; background-size: 100% 100%; z-index: 99; }
#banner .divbot { position: absolute; bottom: 0; width: 100%; height: 75px; background: url(../images/bot-curve.png) no-repeat center top; background-size: 100% 100%; z-index: 99; }
#banner .divtop2 { position: absolute; bottom: 0; width: 100%; height: 75px; background: url(../images/top-curve-2.png) no-repeat center bottom; background-size: 100% 100%; z-index: 99; }

.divbannercontent { display: inline-block; width: 400px; margin: 150px 15px 0; }
.divbannercontentcent { display: block; width: 260px; height: 190px; padding: 70px 30px; background: #000; margin: 70px auto; border-radius: 180px; }

#banner2 { float: left; position: relative; height: 650px; z-index: 80; border-radius: 200% 200% 200% 200%; left: -40%; margin-top: -70px; overflow: hidden; width: 180%; background: #666; }  
#banner2 .divbannercontent { display: inline-block; width: 400px; margin: 150px 15px 0; }

.divbot2 { float: left; position: relative; width: 100%; height: 75px; margin-top: -70px; background: url(../images/bot-curve-2.png) no-repeat center top; background-size: 100% 100%; z-index: 9999; }

#advert { float: left; position: relative; width: 100%; height: 600px; margin-top: -50px; } 
#advert .divtop { float: left; width: 100%; height: 75px; background: url(../images/top-curve.png) no-repeat center bottom; background-size: 100% 100%; }
#advert .divbot { position: absolute; bottom: 0; width: 100%; height: 75px; background: url(../images/bot-curve.png) no-repeat center top; background-size: 100% 100%; }


nav { float: left; width: 100%; height: 42px; margin-top: 0; background: #FFF; }
nav ul { list-style: none; padding: 0; margin: 0; text-align: center; } 
nav li { display: inline-block; padding: 0 8px; } 

.slicknav_menu { display: none; }

.subnav { margin-bottom: 30px; }
.subnav ul { list-style: none; padding-top: 10px; margin: 10px 0 0 0; }
.subnav li { line-height: 1.5em; border-bottom: 1px solid #999; }
.subnav li.last { border-bottom: none; }
.subnav li.top { padding: 3%; background: #392346; color: #FFF; font-size: 1.3em; } 

blockquote { float: left; border-bottom: 1px dashed #FFF; min-height: 300px; }
blockquote.inside { display: block; border-bottom: 1px dashed #392346; min-height: 100px; }

.featured .divtop { display: block; position: relative; height: 50px; margin-bottom: -30px; background: url(../images/featured-curve-top.png) no-repeat center; background-size: 100% 100%; z-index: 999; } 
.featured .divcaption { display: block; height: 50px; padding: 15px 0; margin-top: -8px; background: url(../images/featured-curve-bot.png) no-repeat bottom center; background-size: 100% 100%; } 
.featured IMG { width: 100%; height: auto; }

.featured2 .divtop { display: block; position: relative; height: 50px; background: url(../images/featured-curve-top.png) no-repeat center #392346; background-size: 100% 100%; z-index: 999; } 
.featured2 .divcontent { display: block; background: #392346; padding: 0; } 
.featured2 .divcaption { display: block; height: 50px; padding: 15px 0; margin-top: -8px; background: url(../images/featured-curve-bot.png) no-repeat bottom center; background-size: 100% 100%; } 

.services { float: left; position: relative; width: 50%; min-height: 475px; background: #EEE; }
.services .content { position: absolute; width: 90%; padding: 0 5%; bottom: 100px; }

.waterlase { background: url(../images/featured-waterlase.jpg) no-repeat center; background-size: cover; }
.diode { background: url(../images/featured-diode-laser.jpg) no-repeat center; background-size: cover; }
.itero { background: url(../images/featured-itero-scanner.jpg) no-repeat center; background-size: cover; }
.microscope { background: url(../images/featured-microscope.jpg) no-repeat center; background-size: cover; }
.dentalsurgery { background: url(../images/featured-surgery.jpg) no-repeat center; background-size: cover; }
.scanner { background: url(../images/featured-3d-scanner.jpg) no-repeat center; background-size: cover; }
.xray { background: url(../images/featured-digital-xray.jpg) no-repeat center; background-size: cover; }
.purifiers { background: url(../images/featured-air-purifiers.jpg) no-repeat center; background-size: cover; }


.sidebarbox { margin-bottom: 30px; }
.sidebarbox .divtop { display: block; position: relative; height: 35px; margin-bottom: 8px; background: url(../images/featured-curve-top.png) no-repeat center #392346; background-size: 100% 100%; 
z-index: 999; } 
.sidebarbox .divcontent { display: block; background: #392346; padding: 15px 15px 0 15px; } 
.sidebarbox .divcaption { display: block; height: 30px; background: url(../images/sidebar-curve-bot.png) no-repeat bottom center; background-size: 100% 100%; } 

.ctainside .divtop { float: left; width: 100%; height: 80px; margin-bottom: 20px; background: url(../images/top-curve-grey.jpg) no-repeat center bottom; background-size: 100% 100%; }
.ctainside .divbot { float: left; width: 100%; height: 110px; margin-top: 20px; background: url(../images/bot-curve-grey.jpg) no-repeat center bottom; background-size: 100% 100%; }
.ctainside .icondiv { display: inline-block; width: 130px; height: 130px; margin-top: -28px; }

.socialside { position: fixed; right: 0; top: 35%; width: 30px; min-height: 150px; padding: 10px 5px; border-radius: 10px 0 0 10px; text-align: center; background: #392346; z-index: 99999; }

.courses { float: left; width: 94%; padding: 3%; background: #EEE; margin: 15px 0 30px; text-align: left; }

section { display: block; width: 94%; padding: 3%; background: #EEE; margin: 30px 0; }

.video-container { position: relative; padding-bottom: 56.25%; 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 { pointer-events: none; width: 100%; height: 470px; }

.team IMG { width: 200px; height: 200px; } 

.associations { max-width: 1200px; margin: 20px auto; }
.associations ul { list-style: none; padding: 0; margin: 0; text-align: center; }
.associations li { display: inline-block; }
.associations IMG { vertical-align: middle; padding: 10px 15px; }

footer { float: left; width: 100%; background: url(../images/footer-border-top.jpg) no-repeat top #adadad; }
footer ul { list-style: none; margin: 0 0 30px 0; }
footer li { line-height: 1.6em; }
footer .one-fourth { width: 22.5%; margin-right: 3%; }


/* PARALLAX SLIDES */
.quicklinks { position: relative; width: 100%; min-height: 600px; margin: 0; z-index: 80; margin-bottom: 15px; }
.parallax { position: relative; width: 100%; min-height: 600px; margin: 0; z-index: 80; }
.surgery { background: url(../images/specialist-dental-surgery.jpg) 50% 0 no-repeat fixed; background-size: cover; }
.surgery2 { background: url(../images/harrow-specialist-dental-surgery.jpg) 50% 0 no-repeat fixed; background-size: cover; }
.surgery3 { background: url(../images/dentist-referral-surgery-hornchurch.jpg) 50% 0 no-repeat fixed; background-size: cover; }
.consult { background: url(../images/specialist-consultation.jpg) 50% 0 no-repeat fixed; background-size: cover; }
.consult2 { background: url(../images/dental-referral-consultation.jpg) 50% 0 no-repeat fixed; background-size: cover; }
.training { background: url(../images/dental-training-courses-in-hornchurch.jpg) 50% 0 no-repeat fixed; background-size: cover; }



/* Carousel Nav */
.slidernav { display: block; position: relative; bottom: 0; text-align: center; width: 100%; height: 40px; background: transparent; }
.slidernav a { display: inline-block; padding: 0; margin: 0; background: transparent; color: #FFF; text-decoration: none; }

#navbtns a { margin: 0 5px; display: inline-block;  }
#navbtns a.previous { width: 37px; height: 37px; background: url(../images/navbtn-prev.png) no-repeat center; background-size: 37px; }
#navbtns a.previous:hover { background: url(../images/navbtn-prev-hover.png) no-repeat center; background-size: 37px; }
#navbtns a.next { width: 37px; height: 37px; background: url(../images/navbtn-next.png) no-repeat center; background-size: 37px; }
#navbtns a.next:hover { background: url(../images/navbtn-next-hover.png) no-repeat center; background-size: 37px; }

.crsl-wrap { float: left; display: block; width: 100%; }

/* Logo Carousel */
.block { overflow: hidden; max-width: 1100px; margin: 35px auto 0; background: #fff; }
.animation { width: auto; min-height: 100px; font-size: 0px; }
.animation div { display: inline-block; width: auto; float: none; padding: 0 20px; vertical-align: middle; }


#CybotCookiebotDialog label { color: #392346!important; }
#CybotCookiebotDialog button { color: #392346!important; }

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

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


/* ACCORDION STYLE */
.accordiontitle { display: block; width: 100%; padding: 14px 0; background-color: #222f5c; margin-top: 40px; }

ul#accordion { padding: 2px 0; margin-bottom: 40px; }
ul#accordion li { list-style-type: none; }
ul#accordion p { color: #808081; }
ul#accordion a { text-decoration: none; color: #32a9e1; }
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: 300; }

/* 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: #32a9e1; border: none; font-size: 1.2em; }
.accordion__item.is-open .accordion__trigger { color: #fff; background-color: #9a9999; }
.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: 90%; margin-left: 10%; }
.form input { width: 96%; padding: 2%; background: #523e5d; border: 0; margin: 0 0 2px 0; } 
.form textarea { width: 96%; padding: 2%; height: 120px; overflow: auto; background: #523e5d; border: 0; margin: 0 0 15px 0; } 
.form select { width: 100%; padding: 2%; background: #523e5d; border: 0; margin: 0 0 10px 0; } 
.form [type=checkbox] { display: block; margin: 5px 8px 0 0; width: 15px; height: 15px; float: left; }
.form .send { float: left; display: block; width: 100%; min-height: 50px; padding: 2%; cursor: pointer; border: none; background: url(../images/arrow-btn-grey.jpg) no-repeat right #999; background-size: 35px 35px; text-align: left; -webkit-appearance: none;  color: #FFF; }


.referrals { float: left; width: 94%; padding: 3%; background: #392346; margin: 30px 0; border-radius: 10px; }
.referrals input { width: 96%; padding: 2%; background: #FFF; border: 0; margin: 0 0 5px 0; } 
.referrals textarea { width: 96%; padding: 2%; height: 80px; background: #FFF; border: 0; margin: 0 0 5px 0; } 
.referrals label { display: inline-block; margin: 10px 0; float: left; text-align: left; }
.referrals select { width: 100%; padding: 2%; background: #FFF; border: 0; margin: 0 0 5px 0; } 
.referrals [type=checkbox] { display: block; float: left; margin: 12px 8px 0 0; width: 17px; height: 17px; }
.referrals [type=radio] { display: block; float: left; margin: 15px 8px 0 0; width: 17px; height: 17px; }
.referrals .send { float: left; display: block; width: 100%; min-height: 50px; padding: 2%; cursor: pointer; border: none; background: url(../images/arrow-btn-grey.jpg) no-repeat right #999; background-size: 35px 35px; text-align: left; -webkit-appearance: none;  color: #FFF; }
.referrals .error { display: block; float: left; width: 100%; margin: 0 0 15px; color: #F70004; }

.treatments-half { width: 49%; display: inline-block; float: left; margin-right: 2%; }

.directions { display: inline-block; width: 100%; margin: 0; }
.directions input { float: left; width: 96%; padding: 2%; min-height: 40px; background: #CCC; border: 0; margin: 0 0 2px 0; } 
.directions .send { float: left; display: block; width: 100%; min-height: 50px; padding: 2%; cursor: pointer; border: none; background: url(../images/arrow-btn.jpg) no-repeat right #392346; background-size: 35px 35px; text-align: left; -webkit-appearance: none;  color: #FFF; }

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

.one-half, .one-third, .one-fourth, .two-thirds, .three-fourths, .full-width { display: inline; float: left; margin-right: 1%; min-height: 50px; }

.one-half { width: 49%; }
.one-third { width: 32.5%; }
.one-fourth { width: 24%; }
.two-thirds { width: 64%; }
.three-fourths { width: 72.5%; padding-right: 2%; }
.full-width { width: 100%; }
.column-last { margin-right: 0 !important; }


@media only screen 
and (min-width : 1200px) {

header .divlogo { width: 600px; height: auto; } 

}


@media only screen 
and (min-width : 768px) 
and (max-width : 1023px) {

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

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

.services h2 { font-size: 2rem; }

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

nav { display: none; }
.slicknav_menu { display: block; }

header { min-height: 120px; }
header .divlogo { width: 370px; height: auto; margin-top: 0; } 
header .social { margin-top: 8px; }
header .social IMG { width: 28px; height: 28px; }
header .contact { float: right; margin-top: 15px; }

header .entrybuttons { right: 20px; top: 80px; width: 318px; height: 74px; }

#banner { height: 550px; margin-top: -65px; } 
#banner .divtop { height: 65px; }
#banner .divbot { height: 65px; }
#banner .divtop2 { height: 65px; }
#banner2 { height: 550px; margin-top: -60px; }  

.divbot2 { height: 65px; margin-top: -60px; }

#banner .divbannercontent,
#banner2 .divbannercontent { margin-top: 120px; }

header .entrydent a { float: right; width: 144px; height: 22px; padding: 26px 0 26px 15px; } 
header .entrypat a { float: left; text-align: right; width: 144px; height: 22px; padding: 26px 15px 26px 0; } 

.divadverttop { height: 75px; }
.divadvertbot { height: 75px; }

.services { min-height: 400px; }
	
}



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

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

h1 { font-size: 1.7rem; }
h2 { font-size: 1.4rem; }
h2.inside { font-size: 1.35rem; }

.services h2 { font-size: 1.4rem; }
.services p { font-size: 1rem; }

header .contactinfo { font-size: 1em; }
header .fa-comments { font-size: 1.15rem; padding: 0 3px 0 10px; }

#banner .title, #banner2 .title, #banner .titleblk, #banner2 .titleblk { font-size: 1.6em; }
#banner .subtitle, #banner2 .subtitle, #banner .subtitlewht, #banner2 .subtitlewht { font-size: 1.05em; }

blockquote { font-size: 1.2em; }

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

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

nav { display: none; }
.slicknav_menu { display: block; }

.divcontent { width: 90%; margin: auto; padding: 40px 5%; }
.divcontentnopad { width: 90%; margin: auto; padding: 0 5%; }
.greyfadebot { margin-top: -50px; }

header { min-height: 130px; }
header .divlogo IMG { width: 290px; height: auto; } 	
header .divlogo { float: left; width: 100%; height: auto; text-align: center } 
header .contact { float: left; margin-top: 20px; width: 100%; }
header .social { margin-top: 12px; }
header .social IMG { width: 26px; height: 26px; }


#banner { height: 300px; margin-top: 0;  } 
#banner2 { height: 300px; margin-top: -35px;  }  

#banner .divtop { height: 40px; }
#banner .divbot { height: 40px; }
#banner .divtop2 { height: 40px; }

.divbot2 { height: 40px; margin-top: -35px; }

#banner .divbannercontent,
#banner2 .divbannercontent { width: 200px; margin-top: 30px; }

.divbannercontentcent { width: 140px; height: 140px; padding: 30px 30px; margin: 0 auto; }

#advert { position: none; height: 300px; margin-top: 0; } 
#advert .divtop { height: 40px; }
#advert .divbot { height: 40px; }

.divadverttopwhite { height: 40px; }
.divadverttop { height: 40px; }
.divadvertbot { height: 40px; margin: -40px 0 0 0; }

.featured, .featured2 { margin-bottom: 20px; }
.featured2 .divcontent { width: 100%; padding: 0; margin: 0; } 

.services { float: none; display: block; margin: auto; width: 100%; max-width: 525px; min-height: 250px; margin-top: 5px; }
.services .content { bottom: 35px; }

.sidebarbox .divcontent { width: 100%; padding: 0; margin: 0; } 

.ctainside .divtop { height: 40px; margin-bottom: 20px;  }
.ctainside .divbot { height: 60px; margin-top: 20px; }
.ctainside .icondiv { width: 100px; height: 100px; }

.icondiv-alt { height: 100px; margin: -50px auto 0; }
.icondiv-alt IMG { width: 100px; height: 100px; }

.icondivadvert { height: 100px; margin: -60px auto 0; }
.icondivadvert IMG { width: 100px; height: 100px; }

footer .one-fourth { width: 100%; margin-right: 0; }

.entry-image-medium IMG { width: 100%; padding: 0; }

/* PARALLAX SLIDES */
.quicklinks { position: none; float: left; width: 100%; min-height: 300px; }
.parallax { position: none; float: left; width: 100%; min-height: 300px; }

.surgery,
.surgery2,
.surgery3,
.consult,
.consult2,
.training { position: relative; background-size: cover; background-attachment: scroll !important; background-position: bottom !important; }


.teethbg { background: none; } 

.form { width: 100%; margin-left: 0; }

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

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

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

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

.one-half { width: 100%; }
.one-third { width: 100%; }
.one-fourth { width: 100%; }
.two-thirds { width: 100%; }
.three-fourths { width: 100%; padding-right: 0; }

}