@charset "UTF-8";

/* --------- Website Global Settings ------------------- */

* {margin: 0; padding: 0; }     /* general reset */

html { overflow-y: scroll; font-size: 100%; }    /* no side way shift of page */

.clearfloat {
	clear:both;
	}

body {
	font-family:Verdana,Geneva,Helvetica,arial,sans-serif;
	font-size: 100%;
}

/* -------------------- Typography  ------------------- */

h1 {	font-size:1.8rem;
	color:#333;
	margin:0.6rem 0 1rem;
}
	
h2 {font-size:1.4rem;
	color:#111;;
	padding:3px 0;}
	
h3 {font-size:1.2rem;
	color:#0079B3;
	padding:2px 0;}
	
h4 {font-size:0.95rem;
	color:#333;
	padding:3px 0;}
	
h5 {font-size:0.90rem;
	color:#333;
	padding:2px 0;}
	
p 	{font-size:0.95rem;
	color:#555;
	}


.page p {
	text-align:justify;	
}
	
.page li {
	font-size:0.85rem;
	color:#555;
	padding:.2rem 0;
}

/* ===================== Internal Pages Template ================ */

.heading {
    background-image: url("../images/design/head-bg.jpg");
    height: 85px;
}

.heading h1 {
    margin-left: 0.275em;
    padding-top: 0.3em;
	text-transform: uppercase;
	font-weight: 500;
}

.top-pane {
	margin-bottom: 1.5em;
}

.appoint {
	position: relative;
}

.appointment {
	position:absolute;
	right: 1rem;
	top:1rem;
}

.pages img {
	width:100%;
	margin-bottom: 1rem;
}

/* -------------------- Home PAGE Template ------------------- */

/* === LOGO === */				
.header { 
	width:100%;
   	padding:.5rem 0;
	background-color: #354E91; 
	height: 109px;
	position: relative;
}

.phone {
    position: absolute;
	right: 10px;
	top:2rem;
	color: white;
	font-size: 1.3rem;
}

.social {
	position: absolute;
	top:8px;
	right:1rem;
}

.social img {
	width: 35%;
	margin-right: 3px;
}

img.logo {
    max-height:100px ;
}

.title-bar {
	background-color: #354E91;
}

.topbar .menu > li > a{
		color:black;
	}

.topbar .menu > li > a:hover{
		color:red;
	}

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

img.logo {
    width:60%;
}
	 
.phone {
	font-size: .7rem;
}
.bxslider h2 {
	font-size:1.1rem;
}
.bxslider h5 {
	font-size:0.85rem;
}

 }
 
 @media only screen and (min-width:1000px){ 
 
.header {
		height: 120px;
	}
	 
.phone {
	font-size: 1.1rem;
}

	 img.logo {
    	width:50%; 
}

.bxslider h2 {
	font-size:1.3rem;
}
.bxslider h5 {
	font-size:1.0rem;
}
}

@media only screen and (min-width:1440px){
   
	.header {
		height: 120px;
	}
	
	.phone {
	font-size: 1.3rem;
}
	
	img.logo {
    width:45%;
	}
	
.bxslider h2 {
	font-size:1.5rem;
}

.bxslider h5 {
	font-size:1.15rem;
}
 }

.mob-bg {
	background-color:#354E91;
}

.header-small h2, .header-small h2 a {
	color: white;
}

/* === END LOGO === */

	
 .icons {
	display:inline-block; 
	float:right;
	margin:0.4rem 1.0rem 0.5rem 0;
	line-height:2.8rem;
}

.icon-panel {
	background-color:#8E939B;
	padding:0.5rem 1rem 0;
}

.icon-panel img {
	margin-top:0.5rem;
	width: 10%;
}

.icon-panel p, .icon-panel a h2 {
	color:#fff;
}

.icon-panel p {
	margin-bottom:0 ;
}

 .icon-panel a h2 { 
 text-decoration:underline;
 font-size:1.3rem;
 }
 
 .icon-panel a:hover h2 { 
 text-decoration:none;
 color:#E8E6E6;
 }

.icon-panel .button {
	background-color:#354E90;
}

.icon-panel .button:hover {
	background-color:#0d3190;
}

footer {		 
	height:2rem;
	margin-top:0.5rem;
	  }
	
footer p {
	font-size:0.7rem;	
}
		 
/* -- BX Slider CSS Updates -- */

.bxslider {
	font-family:"Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, sans-serif;
}

.bxslider h2 {
	color:rgba(250,250,250,0.8);
	padding:0;
	line-height:1.0;
}

.bxslider h5 {
	color:rgba(250,250,250,0.8);
	padding:0;
	line-height:0.7rem;
}

.bx-viewport ul {
	margin-left:0;
}

.hp-message {
	position:absolute;
	bottom:10px;
	right:40%;
	z-index:3000;
	background-color:rgba(103,114,123,0.7);
	padding:0.7rem;
}


/* -------------------- Pages-2016 Template ------------------- */
         
.page-bar {	
		width:100%;
		padding:0;
     	background:#0079B3;	
		margin-top:-6px;
		margin-bottom:.5rem; 
}

.page-bar h1 {
	color:white;
	padding:.2rem 0 0.4rem;
	margin:0;
	font-size:1.7rem;
}

 @media only screen and (max-width:721px){
.page-bar h1 {
	color:white;
	padding:.3rem 0;
	font-size:1.1rem;
}

h2 {
	padding:.1rem 0;
	font-size:1.3rem;
}
 }
 
 .side-img {
	 margin:.7rem;
	 width:100%;
 }

/* --- Booking Button CSS Responsive ---*/

.book-link {
	float: left!important;
	margin:-1rem 0 1rem 0;
}
			   

/* -------------------- Navigation CSS  ------------------- */

.top-bar, .top-bar ul {
	background-color:transparent;
	padding:0;
}

.top-bar ul ul {
	background-color:#EBEAEA;
}

#menu-top {
	z-index:2000;
	position: relative;
}

#menu-top .level > li > a {
	color:#777;
}

#menu-top .level li a {
	border-bottom:6px solid #fff;
	font-size: 0.9rem;
}

#menu-top .level .submenu li a {
	border-bottom:none;
}

#menu-top .level .submenu li a:hover {
	background:rgba(206,216,23,0.3)
}


#menu-top .level li a:hover {
	border-bottom:6px solid #555;
}

#menu-top .level .active a {
	border-bottom:6px solid #999;
	background:none;
}

#menu-top .level .submenu .active a {
	border-bottom:none; 
	background:#EBEAEA;
	color:black;
}

 @media only screen and (min-width:721px){
#menu-top .menu ul li a {
	border-bottom:none;
	text-align:left;
	font-size:0.85rem;
}
 }

#menu-top .menu ul li a {
	color:#777;
}

#menu-top .menu ul li a:hover {
	color:#222;
	border-bottom:none;
}


 /* ======= About Us Page CSS ========= */

 
 .staff img {
	 padding:0.5rem 0;
 }
 
 .staff p {
	 text-align:justify;
	 padding: .2rem 1.2rem 0;
	 font-size:0.7rem;
 }
 
  .staff h2 {
	 padding:.3rem 0;
	 background:#999;
	 color:white;
	 font-size:1rem;
 }
 
 .staff .column .inner {
	 background:#EAEAEA;
	 padding-bottom:0.6rem;
	 margin-bottom:1.5rem;
 }

.staff-pic {
	margin-bottom: 1.5rem;
}

 /* ======= Appointment CSS ========= */

.btn { padding: 10px 25px 10px 25px;
background-color: #ea7600;
border-radius: 25px;
font-size: 14px!important;
vertical-align:middle;
font-family: 'Lato Bold', Arial, Helvetica, sans-serif;
color: white!important;
cursor: pointer;
text-align:center;
}

/* ======= Contacts Lenses Page CSS ========= */


.contacts-order label {
   
    font-size: 0.7rem;
    font-weight: 400;
    line-height: 1.3;
    margin: 0;
}