@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700&display=swap');

/* W3C Markup, IE10 Release Preview */ 
h1,.banner-title {font-size:20px;font-weight:300;margin-bottom:30px;margin-top:0;}
h2 {font-size:20px;font-weight:300;margin-bottom:30px;margin-top:0;}
h3 {font-size:20px;font-weight:300;margin-bottom:20px;margin-top:0;}
p {font-size:17px;margin-bottom:15px;line-height:1.4;}
a {color:#008FA6}
a:hover,a.active {color:#1d1d1b;text-decoration:none;}
b,strong {font-weight:400;}
ul {margin:0 0 15px 15px;padding:0;}
hr {border-color:#B7B7B6;}

/* Bootstrap overrides */
body {font-family: 'Open Sans', sans-serif;font-weight:300;color:#1d1d1b}
.nav-container {position:relative}
.navbar {    min-height: 0;    border: none;margin-bottom:0;}
.navbar-default {    background-color: #132B45;    border-color: #132B45;}
.navbar-default .navbar-nav > li > a {    color: #FFF;}
.navbar-default .navbar-nav > li > a:focus, .navbar-default .navbar-nav > li > a:hover {    color: #FFF;    }
.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:focus, .navbar-default .navbar-nav > .open > a:hover {    color: #FFF;    background-color: transparent;}
a:focus {    outline: none;}
.dropdown-menu {color:#FFFFFF;}
.dropdown-menu li {margin-bottom:10px}
.dropdown-menu li a {color:#FFFFFF}
.dropdown-menu ul {margin:10px 0 25px 15px;}
.dropdown-menu ul:last-child {margin-bottom:0;}
.dropdown-menu p{font-size:13px;}
.banner {background-size:cover;background-position:center center;height:250px;}
.banner2 {background-size:cover;background-position:center center;height:200px;}
.banner3 {background-size:cover;background-position:center center;height:100px;}
.banner-inline {background-size:cover;background-position:center center;padding:150px 0;}
.banner,.banner-inline {color:#FFFFFF}
.banner-content {position: relative;  top: 50%;  transform: translateY(-50%);}
.banner-content.banner-home {top: auto;  transform: none;}
.banner h1,.banner-inline h1,.banner-title{font-size:40px;letter-spacing:10px;margin-bottom:20px;margin-left:-5px;}
.banner .banner-home h1{font-size:50px;}
.aboutNav {position:absolute;bottom:0;left:0;right:0;}
.aboutNav .col-xs-12 div {background-color:#1F2F46;}
.aboutNav a {display:inline-block;padding:15px 20px;color:#FFFFFF;}
.aboutNav a:hover {background-color:#328FA5}
.banner h2,.banner-inline h2{font-size:40px;letter-spacing:5px;margin-bottom:20px;margin-left:-5px;}
.banner p,.banner-inline p{font-size:14px;margin-bottom:30px;}
a.btn {color:#FFFFFF;font-size:16px;display:inline-block;padding:10px 20px;line-height:16px;background-color:#328FA5;border-radius:0;font-weight:400}
.carousel {margin-bottom:30px;}
#mainCarousel .item {height:250px;;background-position:center center;background-size:cover;}
/*#mainCarousel .item .container {height:250px;position:relative}*/
.carousel-content-container {position:absolute;bottom:120px;right:0;left:0}
.carousel-control.left ,.carousel-control.right {    background-image: none;}
.carousel-control .icon-prev {    left: 25px;}
.carousel-control .icon-prev::before {    content: url('../images/chevron-left.gif');}
.brandCarousel .carousel-control .icon-prev::before {    content: url('../images/chevron-left-white.gif');}
.carousel-control .icon-next {    right: 15px;}
.carousel-control .icon-next::before {    content: url('../images/chevron-right.gif');}
.brandCarousel .carousel-control .icon-next::before {    content: url('../images/chevron-right-white.gif');}
.carousel-indicators {    bottom: 25px;z-index:9980;}
.carousel-indicators li {    border: 1px solid #fff;    border-radius: 0;    width: 16px;    height: 16px;    background-color: #ffffff;margin:0 3px;}
.carousel-indicators .active,.carousel-indicators li:hover {    width: 16px;    height: 16px;    background-color: #008fa6;border: 1px solid #008fa6;margin:0 3px;}
.scrolldown {position:absolute;bottom:5px;left:0;right:0;text-align:center;font-size:24px;color:#008fa6;cursor:pointer;z-index:9980;}
.scrolldown:hover {color:#ffffff;}

/* Layout */
.gutter-10.row {  margin-right: -5px;  margin-left: -5px;}
.gutter-10 > [class^="col-"], .gutter-10 > [class^=" col-"] {  padding-right: 5px;  padding-left: 5px;}
.fullwidth {padding:0}
.centpercent {width:100%}
.visible-xxs {display:none;}
.top-buffer {padding-top:30px;}
.top-buffer30 {padding-top:30px;}
.top-buffer50 {padding-top:50px;}
.bottom-buffer {padding-bottom:30px;}
.bottom-buffer10 {padding-bottom:10px;}
.bottom-buffer30 {padding-bottom:30px;}
.bottom-buffer50 {padding-bottom:50px;}
.bottom-buffer110 {padding-bottom:110px;}
.text-center .img-responsive {margin:0 auto;}
header {padding:20px 0}
header .text-sm-right {padding-top:16px;color:#1d1d1b}
header .text-sm-right a{color:#1d1d1b}
.accreditations {font-size:16px}
.staff h2 {margin-bottom:0 !important}
.staff .accreditations {font-size:20px !important}
.nav {	margin: 0 -15px;}
.carousel-inner {z-index:9940;}
.carousel-link {display:block;background-color:#F5F5F5;position:relative;z-index:9950;color:#1d1d1b;transition: all .25s ease-in-out;   -moz-transition: all .25s ease-in-out;   -webkit-transition: all .25s ease-in-out;}
.carousel-link:hover {background-color:#C5C5C5;}
.carousel-link img{width:100%}
.carousel-link div {padding:15px 15px 15px 15px}
.carousel-link p.title {font-size:20px;font-weight:400;color:#132B45;border-bottom:1px solid #132B45;margin-bottom:30px;padding-bottom:3px;}
.carousel-link p.title.nomargin {margin-bottom:0px;}
.carousel-link p.copy {font-size:16px;}
.read-more {color:#008FA6;position:absolute;bottom:0px;left:15px;}
.carousel-link p {font-size:17px;line-height:1.2;}
.carousel-link .learn-more {position:absolute;top:0;left:0;right:0;height:0;padding-top:50%;padding-bottom:50%;background-color:rgba(28,138,154,0.9);display:block;text-align:center;opacity:0;   transition: opacity .25s ease-in-out;   -moz-transition: opacity .25s ease-in-out;   -webkit-transition: opacity .25s ease-in-out;}
.carousel-link .learn-more span{color:#FFFFFF; font-size:17px; display:inline-block; text-align:center;width:auto;height:auto;border:1px solid #FFFFFF;padding:7px 15px;transform: translateY(-50%);}
.carousel-link:hover > .learn-more {opacity:1}
.brandCarousel {background-color:#132B45}
#brandCarousel {margin:0;padding:15px;}
.brandList{ text-align: justify;padding-top:25px;}
.brandList a{display:inline-block;max-width:19%;text-align:center;}
.brandList img{max-width:90%}
.brandList:after{content:""; display: inline-block; width: 100%; height: 0;}
.brands-panel {background-color:#132B45;padding-top:30px;padding-bottom:30px;}
.brands-panel a.brand-logo {display:block}
.brands-expand {display:none}
.meet-team-panel {/*width:100%;height:0;padding-bottom:71%;background-image:url(../images/family.jpg);background-size:cover;background-repeat:no-repeat;*/position:relative;padding-top:30px;}
.meet-team-panel .panel-caption{/*position:absolute;bottom:0;left:0;right:0;background-color:#575656;padding:15px;*/color:#FFFFFF;font-size:14px;}
.meet-team-panel .panel-btn {margin-bottom:20px;}
.testimonials-panel {background-color:#F5F5F5;position:relative;padding:30px;}
.testimonials-panel .carousel{position:absolute;top:30px;bottom:0px;left:30px;right:30px;padding-bottom:30px;margin-bottom:0;text-align:center}
.testimonials-panel .carousel-indicators {    }
/*.testimonials-panel .carousel-indicators .active {    background-color: #132B45;border: 1px solid #132B45;    margin:0 0 0 3px}
.testimonials-panel .carousel-indicators li {    background-color: #DADAD9;    border: 1px solid #DADAD9;    border-radius: 10px;width:12px;height:12px;margin:0 0 0 3px;}*/
.testimonials-panel p{font-size:18px;}
p.testimonial-heading {font-size:24px !important;}
p.testimonial-name {font-size:13px !important;margin-top:20px;}
.panel-link {display:block;background-color:#F5F5F5;position:relative;z-index:9950;padding:15px 15px 15px 15px;margin-bottom:10px;color:#1d1d1b}
a.panel-link:hover {background-color:#008FA6;color:#FFFFFF}
a.panel-link:hover p.title{color:#FFFFFF;border-color:#FFFFFF}
.panel-link p.title {font-size:20px;font-weight:400;color:#132B45;border-bottom:1px solid #132B45;line-height:1.2;padding-bottom:3px;}
.panel-link p {font-size:16px;line-height:1.2;}
.panel-appointment {background-color:#585857;color:#FFFFFF;background-image:url(../images/book-appointment.jpg);background-size:150px;background-repeat:no-repeat;padding:30px 30px 15px 200px;background-position:left center;}
/*.panel-appointment a.btn {color:#FFFFFF;background-color:transparent;border:1px solid #FFFFFF}
.panel-appointment a.btn:hover {color:#FFFFFF;background-color:#328FA5;border:1px solid #328FA5}*/
.panel-glasses {background-color:#F5F5F5;background-size:150px;background-repeat:no-repeat;padding:15px 15px 15px 165px;background-position:left center;}
.panel-glasses h2{font-size:24px;margin-bottom:15px;}
.preferred-brand {display:block;background-color:#F5F5F5;padding:30px 30px;margin-bottom:10px;text-align:center;position:relative}
.preferred-brand img {max-width:100%;display:inline-block;position: relative;  top: 50%;  transform: translateY(-50%)}

.banner-promotion {background-color:#328FA5;text-align:center;margin-top:50px;padding-bottom:50px;z-index:9960;position:relative;}
.banner-promotion img{margin-top:-40px;max-width:80%;}
.banner-promotion p {color:#FFFFFF;font-size:20px;margin-bottom:20px;}
.banner-promotion p.heading {font-size:30px;margin-bottom:5px;}
.banner-promotion a.btn {color:#FFFFFF;border-color:#FFFFFF}
.banner-promotion a.btn:hover {color:#333}
.relative {position:relative}
.product-grid {width:100%;height:0;padding-bottom:100%;background-repeat:no-repeat;background-position:center center;border:1px solid #B7B7B6;background-size:90%;}

.panel-intro {padding-bottom:50px;}

.opening-times {font-size:17px;}

input[type=text],input[type=email],textarea{border:1px solid #E1E1E1;padding:10px;width:100%;font-size:17px;margin-bottom:10px;}
input[type=submit] {color:#FFFFFF;font-size:16px;display:inline-block;padding:10px 20px;line-height:16px;background-color:#328FA5;border-radius:0;font-weight:400;margin-top:10px;border:none;}
input[type=submit]:hover {color: #333;}

.lower-nav {background-color:#132B45;padding:20px 0;color:#FFFFFF;font-size:12px;}
.lower-nav a {color:#FFFFFF;display:block;margin-bottom:3px;}
.lower-nav a:hover {color:#008FA6;}
.lower-nav p {font-size:15px;margin-bottom:5px;}
.lower-nav p.heading {font-size:18px;margin-bottom:10px;border-bottom:1px solid #FFFFFF;margin-top:20px;padding-bottom:5px;}
.btn-social {display:block;background-size:cover;width:100%;height:0;padding-bottom:100%}
.btn-social:hover {background-position:-100%}
.btn-facebook {background-image:url(../images/btn-facebook.png)}
.btn-twitter {background-image:url(../images/btn-twitter.png)}
.btn-linkedin {background-image:url(../images/btn-linkedin.png)}
.btn-youtube {background-image:url(../images/btn-youtube.png)}


footer {background-color:#435363;padding:20px 0;color:#FFFFFF;font-size:12px;}
footer p {font-size:12px;margin-bottom:20px;}
footer p.heading {font-size:18px;margin-bottom:10px;}
footer p.underline {border-bottom:1px solid #FFFFFF;margin-bottom:20px;padding-bottom:5px;}
footer .contact p {line-height:20px;}
footer a {color:#FFFFFF}
footer a:hover {color:#008FA6;}
footer .social {width:38px;}
footer .social img{width:38px;}
footer input[type=email]{height:35px;padding:0 10px;display:block;box-sizing:content-box;width:100%;margin:0 10px 0 0;color:#FFFFFF;background-color:#435363;border:1px solid #FFFFFF;box-sizing:border-box}
footer input[type=submit]{color:#FFFFFF;font-size:16px;padding:0;display:block;padding:0 20px;line-height:35px;background-color:#328FA5;border:none;width:100px;margin:27px 0 0 0;border:1px solid #328FA5;font-weight:400;}
.signupForm {padding-bottom:20px;}
.signupThanks {padding-bottom:20px;display:none;}
footer hr {border-color:#FFFFFF}
footer .text-sm-right {font-size:11px;line-height:18px;}
footer .text-sm-right a {display:block;font-size:14px;}
footer .christmas-hours {margin-top:20px;}
footer .opening-hours {width:260px;}
footer .opening-hours-days {float:left;width:140px;}
footer .opening-hours-times {float:left;width:120px;}
.logo-footer {width:181px;}
.flexbox {  display: flex;  justify-content: space-between;padding-bottom:40px}
.flexbox div,.flexbox a{ background-size:contain;background-position:center center;background-repeat:no-repeat;height:100px;width:26%;max-width:140px}
.contactThanks {display:none}
	
/* Format */
.copy-xsmall {font-size:10px;line-height:12px;-webkit-text-size-adjust: 100%;}
.green {color:#008FA6}
.turquoise {color:#328FA5}
.map {width:100%;height:200px;}
.registration-details {font-size:10px;margin-top:9px;}

.header-social {line-height:38px;}
.header-social img {width:38px;}
.header-logo img {width:237px;}

.modal {z-index:9980}
.vertical-alignment-helper {    display:table;    height: 100%;    width: 100%;    pointer-events:none; /* This makes sure that we can still click outside of the modal to close it */}
.vertical-align-center {    /* To center vertically */    display: table-cell;    vertical-align: middle;    pointer-events:none;}
.modal-backdrop.in {    filter: alpha(opacity=50);    opacity: .8;z-index:9975}
.modal-dialog {pointer-events: all;}
.modal-content {border-radius: 0;color:#FFFFFF;background-color:#328FA5;text-align:left;z-index:9990}
.modal-content h2 {color:#FFFFFF;border-bottom:1px solid #FFFFFF;padding-bottom:15px;margin-bottom:25px;}
.modal-content span {font-size:90%}
.modal-content button.close {    float: none;position: absolute;top:10px;right:15px;font-size: 24px;line-height:24px;text-shadow: none;    filter: none;    opacity: 1;color:#FFFFFF;font-weight:normal;cursor:pointer;width:20px;overflow: hidden}
.modal-content button.close img {max-width:100%}
.modalLink {cursor: pointer}
.modal-content .btn {color: #FFFFFF;border-color: #FFFFFF;background-color:transparent}
.modal-content .btn:hover {color: #328FA5;border-color: #FFFFFF;background-color:#FFFFFF}

/* Extra small devices (phones, less than 768px) */
@media (max-width: 479px) {
  .visible-xxs {   display: block !important;  }
  .hidden-xxs {    display: none !important;  }
}

/* Very Small devices (mobiles, 480px and up) */
@media (min-width: 480px) {
}

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {
	h2,.first-container h1 {font-size:30px;}
	.top-buffer {padding-top:60px;}
	.bottom-buffer {padding-bottom:60px;}
	.text-sm-right {text-align:right; }
	.navbar {border-radius:0}
	/*
	.nav {text-align:justify;max-height:42px;}
	.nav:after {    content: '';    display: inline-block;    width: 100%;}

	.nav > li {    display: inline-block;}
	.nav > li > a {   display: inline-block;   padding: 10px 0;}
	.navbar-nav > li {    float: none;}
	*/
	.navbar-nav {    /*float: none;*/max-width:720px;margin:0 auto}
	.nav > li > a {font-size:15px;padding:10px 14px}
  .nav > li.highlight > a {background-color:#328FA5}
	.dropdown-menu {padding-top:15px;z-index:1;opacity:0;-webkit-transition: opacity 1s;     transition: opacity 1s;display:block;}
	.dropdown-menu p{color:#1d1d1b;font-size:13px;}
	.dropdown-menu li {margin-bottom:10px}
	.dropdown-menu li a {color:#1d1d1b;font-size:13px;}
	.dropdown-menu li a:hover {color:#0090a7;}
	.dropdown-menu ul {margin:15px 0;}
	.navbar-default .navbar-nav > .open > a {position:relative}
	.navbar-default .navbar-nav > .open > a:after{	/*content:url('../images/dropdown.png');*/content:''; display: block;	width:calc(100% - 30px);	position:absolute;bottom:-5px;	z-index:9999;	text-align:center;	height:5px;background-color:#008FA6}
	.container > .navbar-collapse{    margin-right: -15px;    margin-left: -15px;}
	.navbar-nav li:first-child a{padding-left:0}
	.navbar-right li:last-child a{padding-right:0}
	.meet-team-panel .panel-caption{font-size:18px;/*padding:30px;*/}
	.meet-team-panel .panel-btn {float:none;/*padding-left:40px;*/margin-bottom:0;}
	.banner-promotion {padding-bottom:90px;}
	.banner-promotion img{margin-top:-70px;}
	.banner-promotion p.heading {font-size:35px;}
	footer .text-sm-right a {display:inline;margin-left:20px;}
	.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > .active > a:hover {
    color: #FFF;    background-color: transparent;}
	.navbar-nav .dropdown:hover > a:after,.navbar-nav .dropdown._active > a:after{	/*content:url('../images/dropdown.png');*/content:''; display: block;	width:calc(100% - 30px);	position:absolute;bottom:-5px;	z-index:9999;	text-align:center;	height:5px;background-color:#008FA6}
	/*.navbar-nav .dropdown.first:hover > a:after,.navbar-nav .dropdown.first.active > a:after{	width:calc(100% - 15px) !important;}*/
	ul.nav li.dropdown:hover > ul.dropdown-menu {    display: block;   opacity:1;z-index:9970;}
	.navbar-nav > li > .dropdown-menu {    margin-top: -1px;}
	.dropdown-eyecare {padding-left:115px;}
	.dropdown-eyewear {padding-left:292px;}
	footer {padding:90px 0;}
	footer .address {width:260px;float:left;}
	footer .email-signup {width:calc(100% - 560px);float:left;padding-right:40px;}
	footer .opening-hours {width:300px;float:left;}
	footer .text-sm-right {padding-right:95px}
	footer .social {position:absolute;top:20px;right:15px}
	.carousel-indicators {    bottom: 60px;}
	.scrolldown {bottom:40px;}
	.banner-content {position: relative;  top: 70%;  transform: translateY(-50%);}
	.flexbox div,.flexbox a{ height:70px;width:12%;}
  .modal-body {padding:50px}
  .modal-content button.close {width:100px;font-size:16px;line-height:28px;text-align: right;right:18px;}
  .modal-content button.close img{width:20px;margin-left:5px;}

}

@media (min-width: 880px) { 
	.carousel-control .icon-prev {    left: -70px;}
	.carousel-control .icon-next {    right: -65px;}
}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) { 
	h2,.first-container h1 {font-size:35px;}
	.container {padding-left:50px;padding-right:50px;}	
	.first-container {margin-top:-85px;background-color:#FFFFFF;position:relative;z-index:9950;}
	.top-buffer {padding-top:120px;}
	.bottom-buffer {padding-bottom:135px;}
	.nav-container.fixed {position:fixed;top:0;width:100%;z-index:9999;overflow:hidden;}
	.nav-container.fixed:hover {	overflow:visible}
	.navbar-nav {    max-width:940px;}
	.nav > li > a {font-size:16px;padding:10px 10px;}
	header {font-size:16px;}
	.banner,.banner2 {height:400px;}
	.banner3 {height:170px;}
	.banner .container,.banner-inline .container {background-color:transparent;}
	{font-size:60px;letter-spacing:20px;margin-left:-10px;padding-bottom:100px;}
	.banner .banner-home h1{font-size:60px;padding-bottom:0;}
	.banner .banner-about h1{margin-left:10px;}
	.banner h2,.banner-inline h2{font-size:60px;letter-spacing:10px;}
	.banner p,.banner-inline p{font-size:20px;}
	.carousel-control .icon-prev {    left: -20px;}
	.carousel-control .icon-next {    right: -15px;}
	.meet-team-panel .panel-caption{font-size:24px;}
	.testimonials-panel p{font-size:24px;}
	p.testimonial-name {font-size:16px !important;}
	footer p {font-size:14px;}
	footer p.heading {font-size:20px;}
	footer .text-sm-right a {font-size:14px;}
	footer .text-sm-right {    font-size: 14px;    }
	footer input[type="email"] {font-size:14px;max-width:65%;}
	.lower-nav {font-size:15px;}
	.lower-nav p.heading {font-size:20px;}
	.panel-intro {padding-bottom:30px;}
	.panel-intro p {font-size:20px;}
	.intro p {font-size:20px;} 
	.twoCol {column-count:2;column-gap:30px;-moz-column-count:2;-moz-column-gap:30px;}
	.panel-appointment {background-size:300px;padding-left:350px;}
	.panel-glasses {background-size:200px;padding-left:225px;}
	.preferred-brand {padding:50px 30px;}
	.aboutNav a {font-size:17px;}
	.opening-times {font-size:20px;}
	.map {height:400px;}
	#brandCarousel {padding:40px 15px;}
	.dropdown-menu p{font-size:15px;}
	.dropdown-menu li a {font-size:14px;}
	.dropdown-eyecare {padding-left:135px;}
	.dropdown-eyewear {padding-left:306px;}
	.flexbox div,.flexbox a{ height:100px;}
  .modal-dialog {width:800px}
  .modal-content h2 {font-size:30px}
  .modal-content button.close {width:100px;font-size:18px;line-height:34px;}
  .modal-content button.close img{width:22px;margin-left:5px;}
  .modal-content .btn {margin-top:15px}
}

@media (min-width: 1080px) { 
	.carousel-control .icon-prev {    left: -70px;}
	.carousel-control .icon-next {    right: -65px;}
	
}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) { 
	.navbar-nav{    max-width:1140px;}
	.carousel-control .icon-prev {    left: -20px;}
	.carousel-control .icon-next {    right: -15px;}
	.nav > li > a {font-size:17px;padding:10px 15px;}
	.banner,.banner2 {height:550px;}
	.dropdown-eyecare {padding-left:140px;}
	.dropdown-eyewear {padding-left:318px;}
	footer .email-signup {padding-right:100px;}
  .modal-dialog {width:900px}
}

@media (min-width: 1300px) { 
	.carousel-control .icon-prev {    left: -70px;}
	.carousel-control .icon-next {    right: -65px;}
	.container.full {padding-left:120px;padding-right:120px;width:100%;}
}