/*==========================================================

                        NORMALIZE

==========================================================*/

html, body, div, span, applet, object, iframe,

h1, h2, h3, h4, h5, h6, p, blockquote, pre,

a, abbr, acronym, address, big, cite, code,

del, dfn, em, img, ins, kbd, q, s, samp,

small, strike, strong, sub, sup, tt, var,

b, u, i, center,

dl, dt, dd, ol, ul, li,

fieldset, form, label, legend,

table, caption, tbody, tfoot, thead, tr, th, td,

article, aside, canvas, details, embed,

figure, figcaption, footer, header, hgroup,

menu, nav, output, ruby, section, summary,

time, mark, audio, video {

  margin: 0;

  padding: 0;

  border: 0;

  font-size: 100%;

  font: inherit;

  vertical-align: top;

}



article, aside, details, figcaption, figure,

footer, header, hgroup, menu, nav, section {

  display: block;

}



body {

  line-height: 1;

}



ol, ul {

  list-style: none;

}



blockquote, q {

  quotes: none;

}



blockquote:before, blockquote:after,

q:before, q:after {

  content: '';

  content: none;

}



table {

  border-collapse: collapse;

  border-spacing: 0;

}



button,

input[type='button'] {

  background: none;

  border: none;

  display: inline-block;

  margin: 0;

  padding: 0;

  outline: none;

  outline-offset: 0;

  overflow: visible;

  cursor: pointer;

  -webkit-appearance: none;

}

button::-moz-focus-inner,

input[type='button']::-moz-focus-inner {

  border: none;

  padding: 0;

}



.container, .container-fluid {

  margin-right: auto;

  margin-left: auto;

  -moz-box-sizing: border-box;

  -webkit-box-sizing: border-box;

  box-sizing: border-box;

}



/*===============   Fluid grid    ====================*/

.container-fluid [class*="grid_"] {

  float: left;

  width: 8.33333%;

  min-height: 1px;

}



.container-fluid .grid_1 {

  width: 8.33333%;

}



.container-fluid .grid_2 {

  width: 16.66667%;

}



.container-fluid .grid_3 {

  width: 25%;

}



.container-fluid .grid_4 {

  width: 33.33333%;

}



.container-fluid .grid_5 {

  width: 41.66667%;

}



.container-fluid .grid_6 {

  width: 50%;

}



.container-fluid .grid_7 {

  width: 58.33333%;

}



.container-fluid .grid_8 {

  width: 66.66667%;

}



.container-fluid .grid_9 {

  width: 75%;

}



.container-fluid .grid_10 {

  width: 83.33333%;

}



.container-fluid .grid_11 {

  width: 91.66667%;

}



.container-fluid .grid_12 {

  width: 100%;

}



.container-fluid .preffix_1 {

  margin-left: 70px;

}



.container-fluid .preffix_2 {

  margin-left: 140px;

}



.container-fluid .preffix_3 {

  margin-left: 210px;

}



.container-fluid .preffix_4 {

  margin-left: 280px;

}



.container-fluid .preffix_5 {

  margin-left: 350px;

}



.container-fluid .preffix_6 {

  margin-left: 420px;

}



.container-fluid .preffix_7 {

  margin-left: 490px;

}



.container-fluid .preffix_8 {

  margin-left: 560px;

}



.container-fluid .preffix_9 {

  margin-left: 630px;

}



.container-fluid .preffix_10 {

  margin-left: 700px;

}



.container-fluid .preffix_11 {

  margin-left: 770px;

}



.container-fluid .preffix_12 {

  margin-left: 840px;

}



.container, .container-fluid {

  width: 1170px;

}



.container .row {

  margin-left: -30px;

}

.container [class*="grid_"] {

  float: left;

  min-height: 1px;

  margin-left: 15px;

}

.container .grid_1 {

  width: 70px;

}

.container .grid_2 {

  width: 170px;

}

.container .grid_3 {

  width: 270px;

}

.container .grid_4 {

  width: 370px;

}

.container .grid_5 {

  width: 470px;

}

.container .grid_6 {

  width: 570px;

}

.container .grid_7 {

  width: 670px;

}

.container .grid_8 {

  width: 770px;

}

.container .grid_9 {

  width: 870px;

}

.container .grid_10 {

  width: 970px;

}

.container .grid_11 {

  width: 1070px;

}

.container .grid_12 {

  width: 1170px;

}

.container .preffix_1 {

  margin-left: 130px;

}

.container .preffix_2 {

  margin-left: 230px;

}

.container .preffix_3 {

  margin-left: 330px;

}

.container .preffix_4 {

  margin-left: 430px;

}

.container .preffix_5 {

  margin-left: 530px;

}

.container .preffix_6 {

  margin-left: 630px;

}

.container .preffix_7 {

  margin-left: 730px;

}

.container .preffix_8 {

  margin-left: 830px;

}

.container .preffix_9 {

  margin-left: 930px;

}

.container .preffix_10 {

  margin-left: 1030px;

}

.container .preffix_11 {

  margin-left: 1130px;

}

.container .preffix_12 {

  margin-left: 1230px;

}



@media (min-width: 980px) and (max-width: 1199px) {

  .container, .container-fluid {

    width: 940px;

  }



  .container .row {

    margin-left: -20px;

  }

  .container [class*="grid_"] {

    float: left;

    min-height: 1px;

    margin-left: 20px;

  }

  .container .grid_1 {

    width: 60px;

  }

  .container .grid_2 {

    width: 140px;

  }

  .container .grid_3 {

    width: 210px;

  }

  .container .grid_4 {

    width: 300px;

  }

  .container .grid_5 {

    width: 380px;

  }

  .container .grid_6 {

    width: 460px;

  }

  .container .grid_7 {

    width: 540px;

  }

  .container .grid_8 {

    width: 620px;

  }

  .container .grid_9 {

    width: 700px;

  }

  .container .grid_10 {

    width: 780px;

  }

  .container .grid_11 {

    width: 860px;

  }

  .container .grid_12 {

    width: 940px;

  }

  .container .preffix_1 {

    margin-left: 100px;

  }

  .container .preffix_2 {

    margin-left: 180px;

  }

  .container .preffix_3 {

    margin-left: 260px;

  }

  .container .preffix_4 {

    margin-left: 340px;

  }

  .container .preffix_5 {

    margin-left: 420px;

  }

  .container .preffix_6 {

    margin-left: 500px;

  }

  .container .preffix_7 {

    margin-left: 580px;

  }

  .container .preffix_8 {

    margin-left: 660px;

  }

  .container .preffix_9 {

    margin-left: 740px;

  }

  .container .preffix_10 {

    margin-left: 820px;

  }

  .container .preffix_11 {

    margin-left: 900px;

  }

  .container .preffix_12 {

    margin-left: 980px;

  }

  

  





}

@media (min-width: 768px) and (max-width: 979px) {

  .container, .container-fluid {

    width: 748px;

  }



  .container .row {

    margin-left: -20px;

  }

  .container [class*="grid_"] {

    float: left;

    min-height: 1px;

    margin-left: 20px;

  }

  .container .grid_1 {

    width: 44px;

  }

  .container .grid_2 {

    width: 108px;

  }

  .container .grid_3 {

    width: 165px;

  }

  header .brand {

  float: left;

  margin-top: -10px;

margin-bottom:30px;

}

  .container .grid_4 {

    width: 236px;

  }

  .container .grid_5 {

    width: 300px;

  }

  .container .grid_6 {

    width: 364px;

  }

  .container .grid_7 {

    width: 428px;

  }

  .container .grid_8 {

    width: 492px;

  }

  .container .grid_9 {

    width: 556px;

  }

  .container .grid_10 {

    width: 620px;

  }

  .container .grid_11 {

    width: 684px;

  }

  .container .grid_12 {

    width: 748px;

  }

  .container .preffix_1 {

    margin-left: 84px;

  }

  .container .preffix_2 {

    margin-left: 148px;

  }

  .container .preffix_3 {

    margin-left: 212px;

  }

  .container .preffix_4 {

    margin-left: 276px;

  }

  .container .preffix_5 {

    margin-left: 340px;

  }

  .container .preffix_6 {

    margin-left: 404px;

  }

  .container .preffix_7 {

    margin-left: 468px;

  }

  .container .preffix_8 {

    margin-left: 532px;

  }

  .container .preffix_9 {

    margin-left: 596px;

  }

  .container .preffix_10 {

    margin-left: 660px;

  }

  .container .preffix_11 {

    margin-left: 724px;

  }

  .container .preffix_12 {

    margin-left: 788px;

  }

}

@media (max-width: 767px) {

  .container, .container-fluid {

    width: 420px;

    padding: 0;

  }



  .container .row {

    margin-left: 0;

  }



  .row + .row,

  [class*="grid_"] + [class*="grid_"] {

    margin-top: 30px;

  }



  .container [class*="grid_"], .container-fluid [class*="grid_"] {

    float: none;

    display: block;

    width: 100%;

    margin-left: 0;

  }

}

@media (max-width: 479px) {

  body {

    padding: 0;

  }



  .container, .container-fluid {

    width: 300px;

    padding: 0 15px;

  }



  .row {

    margin-left: 0;

  }

}

.container:before, .container-fluid:before, .row:before, .container:after, .container-fluid:after, .row:after {

  display: table;

  content: "";

  line-height: 0;

}

.container:after, .container-fluid:after, .row:after {

  clear: both;

}

@media (min-width: 1200px) and (max-width: 1350px) {

	/* http://www.menucool.com */



/*slider frame*/



#sliderFrame, #sliderFrame div {

    box-sizing: content-box;

}



#sliderFrame 

{

    box-sizing: content-box;

    width:100%;

    box-shadow: 0 0 5px #BBB;

	background-color:#FFF;

}



#slider, #slider div.sliderInner {

    width:100%;

	height:500px;/* Must be the same size as the slider images */

}



#slider {

    float:left;

	background:#fff url(loading.gif) no-repeat 50% 50%;

	position:relative;

    transform: translate3d(0,0,0);

}



/* the link style (if an image is wrapped in a link) */

#slider a.imgLink, #slider .video {

	z-index:2;

	position:absolute;

	top:0px;left:0px;border:0;padding:0;margin:0;

	width:100%;height:100%;

}

#slider .video {

	background:transparent url(video.png) no-repeat 50% 50%;

}



/* Caption styles */

#slider div.mc-caption-bg, #slider div.mc-caption-bg2 {

/*	position:absolute;

	width:400px;

	height:auto;

	padding:10px 0;

	left:120px; 

	bottom:10px;

	z-index:3;

	overflow:hidden;

	font-size:0;*/

}

#slider div.mc-caption-bg {

    /* NOTE: Its opacity is to be set through the sliderOptions.captionOpacity setting in the js-image-slider.js file.*/

	background:#DDD;/* or any other colors such as Black, or: background:none; */

	border:1px solid white;

	border-radius: 5px;

}

#slider div.mc-caption-bg2 {

    background:none;

}

#slider div.mc-caption {

	font:bold 13px/16px Arial;

	color:#069;

	z-index:4;

	text-align:center;

    background:none;

}

#slider div.mc-caption a { 

	color:#060;

}





/* ------ built-in navigation bullets wrapper that is relative to the #slider ------*/

#slider div.navBulletsWrapper  {

	display:none;

}



/* --------- Others ------- */



#slider div.loading 

{

    width:100%; height:100%;

    background:transparent url(loading.gif) no-repeat 50% 50%;

    filter: alpha(opacity=60);

    opacity:0.6;

    position:absolute;

    left:0;

    top:0; 

    z-index:9;

}



#slider img, #slider>b, #slider a>b {

	position:absolute; border:none; display:none;

}



#slider div.sliderInner {

	overflow:hidden; 

	-webkit-transform: rotate(0.000001deg);/* fixed the Chrome not crop border-radius bug*/

	position:absolute; top:0; left:0;

}



#slider>a, #slider video, #slider audio {display:none;}

#slider div {-webkit-transform: translate3d(0,0,0);transform: translate3d(0,0,0);}







/* -- thumbnails -- */

#thumbs 

{

    float:left;

    margin-left:10px;

    width:230px;

    font:normal 11px/13px Arial;

    border-top:1px solid #CCC;

    color:#666;

}

#thumbs .thumb 

{

    border:1px solid #CCC;

    border-top:1px solid #FFF;

    padding:4px 10px;

    background:#EEE;

	width:210px;

	color:#666;

}

#thumbs .thumb-on 

{

    background:#FFF;

}



#thumbs img{border:1px solid #DDD; cursor:pointer; width:70px; height:48px;}



#thumbs .frame {float:left;padding:2px;border:1px solid #CCC;background:white;border-radius:3px;box-shadow:0 0 3px #BBB;font-size:0;line-height:0;}

#thumbs .thumb-content {float:left;width:110px;padding-left:18px;}



/* Captions in #thumbs .thumb-content */

#thumbs .thumb-content p {font-weight:bold; color:#419AAD; margin:0 0 3px;padding:0; font-size:13px !important;}

#thumbs .thumb-on .thumb-content p {color:#EC5B26;}


#appointment-img  > img:hover{

	margin-top:100px;

	

	}

}



@media (min-width: 1350px) and (max-width: 1900px) {

	/* http://www.menucool.com */



/*slider frame*/



#sliderFrame, #sliderFrame div {

    box-sizing: content-box;

}



#sliderFrame 

{

    box-sizing: content-box;

    width:100%;

    box-shadow: 0 0 5px #BBB;

	background-color:#FFF;

}



#slider, #slider div.sliderInner {

    height: 500px;

    width: 100%;

}



#slider {

    float:left;

	background:#fff url(loading.gif) no-repeat 50% 50%;

	position:relative;

    transform: translate3d(0,0,0);

}



/* the link style (if an image is wrapped in a link) */

#slider a.imgLink, #slider .video {

	z-index:2;

	position:absolute;

	top:0px;left:0px;border:0;padding:0;margin:0;

	width:100%;height:100%;

}

#slider .video {

	background:transparent url(video.png) no-repeat 50% 50%;

}



/* Caption styles */

#slider div.mc-caption-bg, #slider div.mc-caption-bg2 {

	position:absolute;

	width:400px;

	height:auto;

	padding:10px 0;/* 10px will increase height.*/

	left:120px; /*if the caption needs to be aligned from right, specify by right instead of left. i.e. right:20px;*/

	bottom:10px;/*if the caption needs to be aligned from top, specify by top instead of bottom. i.e. top:150px;*/

	z-index:3;

	overflow:hidden;

	font-size:0;

}

#slider div.mc-caption-bg {

    /* NOTE: Its opacity is to be set through the sliderOptions.captionOpacity setting in the js-image-slider.js file.*/

	background:#DDD;/* or any other colors such as Black, or: background:none; */

	border:1px solid white;

	border-radius: 5px;

}

#slider div.mc-caption-bg2 {

    background:none;

}

#slider div.mc-caption {

	font:bold 13px/16px Arial;

	color:#069;

	z-index:4;

	text-align:center;

    background:none;

}

#slider div.mc-caption a { 

	color:#060;

}





/* ------ built-in navigation bullets wrapper that is relative to the #slider ------*/

#slider div.navBulletsWrapper  {

	display:none;

}



/* --------- Others ------- */



#slider div.loading 

{

    width:100%; height:100%;

    background:transparent url(loading.gif) no-repeat 50% 50%;

    filter: alpha(opacity=60);

    opacity:0.6;

    position:absolute;

    left:0;

    top:0; 

    z-index:9;

}



#slider img, #slider>b, #slider a>b {

	position:absolute; border:none; display:none;

}



#slider div.sliderInner {

	overflow:hidden; 

	-webkit-transform: rotate(0.000001deg);/* fixed the Chrome not crop border-radius bug*/

	position:absolute; top:0; left:0;

}



#slider>a, #slider video, #slider audio {display:none;}

#slider div {-webkit-transform: translate3d(0,0,0);transform: translate3d(0,0,0);}







/* -- thumbnails -- */

#thumbs 

{

    float:left;

    margin-left:10px;

    width:230px;

    font:normal 11px/13px Arial;

    border-top:1px solid #CCC;

    color:#666;

}

#thumbs .thumb 

{

    border:1px solid #CCC;

    border-top:1px solid #FFF;

    padding:4px 10px;

    background:#EEE;

	width:250px;

	color:#666;

}

#thumbs .thumb-on 

{

    background:#FFF;

}



#thumbs img{border:1px solid #DDD; cursor:pointer; width:96px; height:63px;}



#thumbs .frame {float:left;padding:2px;border:1px solid #CCC;background:white;border-radius:3px;box-shadow:0 0 3px #BBB;font-size:0;line-height:0;}

#thumbs .thumb-content {float:left;width:110px;padding-left:18px;}



/* Captions in #thumbs .thumb-content */

#thumbs .thumb-content p {font-weight:bold; color:#1D9DB4; margin:0 0 3px;padding:0; font-size:13px !important; text-align:center;}

#thumbs .thumb-on .thumb-content p {color:#EC5B26;}

#appointment-img  > img{

	 

	

	}

#appointment-img  > img:hover{

	 

	

	}

}



@media (min-width: 980px) and (max-width: 1199px) {

	/* http://www.menucool.com */



/*slider frame*/



#sliderFrame, #sliderFrame div {

    box-sizing: content-box;

}



#sliderFrame {

    background-color: #fff;

    border: 1px solid #ccc;

    box-shadow: 0 0 5px #bbb;

    box-sizing: content-box;

    margin: 0 auto;

    padding: 20px;

    width: 100%;

}

#slider, #slider div.sliderInner {

    height: 350px;

    width: 96%;

}



#slider {

   /* float:left;*/

	background:#fff url(loading.gif) no-repeat 50% 50%;

	position:relative;

    transform: translate3d(0,0,0);

}



/* the link style (if an image is wrapped in a link) */

#slider a.imgLink, #slider .video {

	z-index:2;

	position:absolute;

	top:0px;left:0px;border:0;padding:0;margin:0;

	width:100%;height:100%;

}

#slider .video {

	background:transparent url(video.png) no-repeat 50% 50%;

}



/* Caption styles */

#slider div.mc-caption-bg, #slider div.mc-caption-bg2 {

	position:absolute;

	width:400px;

	height:auto;

	padding:10px 0;/* 10px will increase height.*/

	left:120px; /*if the caption needs to be aligned from right, specify by right instead of left. i.e. right:20px;*/

	bottom:10px;/*if the caption needs to be aligned from top, specify by top instead of bottom. i.e. top:150px;*/

	z-index:3;

	overflow:hidden;

	font-size:0;

}

#slider div.mc-caption-bg {

    /* NOTE: Its opacity is to be set through the sliderOptions.captionOpacity setting in the js-image-slider.js file.*/

	background:#DDD;/* or any other colors such as Black, or: background:none; */

	border:1px solid white;

	border-radius: 5px;

}

#slider div.mc-caption-bg2 {

    background:none;

}

#slider div.mc-caption {

	font:bold 13px/16px Arial;

	color:#069;

	z-index:4;

	text-align:center;

    background:none;

}

#slider div.mc-caption a { 

	color:#060;

}





/* ------ built-in navigation bullets wrapper that is relative to the #slider ------*/

#slider div.navBulletsWrapper  {

	display:none;

}



/* --------- Others ------- */



#slider div.loading 

{

    width:100%; height:100%;

    background:transparent url(loading.gif) no-repeat 50% 50%;

    filter: alpha(opacity=60);

    opacity:0.6;

    position:absolute;

    left:0;

    top:0; 

    z-index:9;

}



#slider img, #slider>b, #slider a>b {

	position:absolute; border:none; display:none;

}



#slider div.sliderInner {

	overflow:hidden; 

	-webkit-transform: rotate(0.000001deg);/* fixed the Chrome not crop border-radius bug*/

	position:absolute; top:0; left:0;

}



#slider>a, #slider video, #slider audio {display:none;}

#slider div {-webkit-transform: translate3d(0,0,0);transform: translate3d(0,0,0);}







/* -- thumbnails -- */

#thumbs 

{

    float:left;

    

   

    font:normal 11px/13px Arial;

    border-top:1px solid #CCC;

    color:#666;

}

#thumbs .thumb 

{

    border:1px solid #CCC;

    border-top:1px solid #FFF;

    padding:11px 9px;

    background:#EEE;

	width:168px;

	color:#666;

}

#thumbs .thumb-on 

{

    background:#FFF;

}



#thumbs img{border:1px solid #DDD; cursor:pointer; width:70px; height:48px;}



#thumbs .frame {float:left; margin-left:35px; padding:2px;border:1px solid #CCC;background:white;border-radius:3px;box-shadow:0 0 3px #BBB;font-size:0;line-height:0;}

#thumbs .thumb-content {float:left;width:150px;margin-top:10px;}



/* Captions in #thumbs .thumb-content */

#thumbs .thumb-content p {font-weight:bold; color:#1D9DB4; margin:0 0 3px;padding:0;}

#thumbs .thumb-on .thumb-content p {color:#EC5B26;}

}



@media (min-width: 768px) and (max-width: 979px){

	

		/* http://www.menucool.com */



/*slider frame*/



#sliderFrame, #sliderFrame div {

    box-sizing: content-box;

}



#sliderFrame {

    background-color: #fff;

    border: 1px solid #ccc;

    box-shadow: 0 0 5px #bbb;

    box-sizing: content-box;

    margin: 0 auto;

    padding: 20px;

    width: 100%;

}

#slider, #slider div.sliderInner {

    height: 350px;

    width: 94%;

}



#slider {

   /* float:left;*/

	background:#fff url(loading.gif) no-repeat 50% 50%;

	position:relative;

    transform: translate3d(0,0,0);

}



/* the link style (if an image is wrapped in a link) */

#slider a.imgLink, #slider .video {

	z-index:2;

	position:absolute;

	top:0px;left:0px;border:0;padding:0;margin:0;

	width:100%;height:100%;

}

#slider .video {

	background:transparent url(video.png) no-repeat 50% 50%;

}



/* Caption styles */

#slider div.mc-caption-bg, #slider div.mc-caption-bg2 {

	position:absolute;

	width:400px;

	height:auto;

	padding:10px 0;/* 10px will increase height.*/

	left:120px; /*if the caption needs to be aligned from right, specify by right instead of left. i.e. right:20px;*/

	bottom:10px;/*if the caption needs to be aligned from top, specify by top instead of bottom. i.e. top:150px;*/

	z-index:3;

	overflow:hidden;

	font-size:0;

}

#slider div.mc-caption-bg {

    /* NOTE: Its opacity is to be set through the sliderOptions.captionOpacity setting in the js-image-slider.js file.*/

	background:#DDD;/* or any other colors such as Black, or: background:none; */

	border:1px solid white;

	border-radius: 5px;

}

#slider div.mc-caption-bg2 {

    background:none;

}

#slider div.mc-caption {

	font:bold 13px/16px Arial;

	color:#069;

	z-index:4;

	text-align:center;

    background:none;

}

#slider div.mc-caption a { 

	color:#060;

}





/* ------ built-in navigation bullets wrapper that is relative to the #slider ------*/

#slider div.navBulletsWrapper  {

	display:none;

}



/* --------- Others ------- */



#slider div.loading 

{

    width:100%; height:100%;

    background:transparent url(loading.gif) no-repeat 50% 50%;

    filter: alpha(opacity=60);

    opacity:0.6;

    position:absolute;

    left:0;

    top:0; 

    z-index:9;

}



#slider img, #slider>b, #slider a>b {

	position:absolute; border:none; display:none;

}



#slider div.sliderInner {

	overflow:hidden; 

	-webkit-transform: rotate(0.000001deg);/* fixed the Chrome not crop border-radius bug*/

	position:absolute; top:0; left:0;

}



#slider>a, #slider video, #slider audio {display:none;}

#slider div {-webkit-transform: translate3d(0,0,0);transform: translate3d(0,0,0);}







/* -- thumbnails -- */

#thumbs 

{

    float:left;

    

   

    font:normal 11px/13px Arial;

    border-top:1px solid #CCC;

    color:#666;

}

#thumbs .thumb 

{

    border:1px solid #CCC;

    border-top:1px solid #FFF;

    padding:11px 9px;

    background:#EEE;

	width:130px;

	color:#666;

}

#thumbs .thumb-on 

{

    background:#FFF;

}



#thumbs img{border:1px solid #DDD; cursor:pointer; width:70px; height:48px;}



#thumbs .frame {float:left; margin-left:28px; padding:2px;border:1px solid #CCC;background:white;border-radius:3px;box-shadow:0 0 3px #BBB;font-size:0;line-height:0;}

#thumbs .thumb-content {float:left;width:130px;margin-top:10px;}



/* Captions in #thumbs .thumb-content */

#thumbs .thumb-content p {font-weight:bold; color:#1D9DB4; margin:0 0 3px;padding:0;}

#thumbs .thumb-on .thumb-content p {color:#EC5B26;}

	}

@media (min-width: 320px) and (max-width: 767px) {

	.brand_name img {

    width: 230px;

}

	

		/* http://www.menucool.com */



/*slider frame*/



#sliderFrame, #sliderFrame div {

    box-sizing: content-box;

}



#sliderFrame {

    background-color: #fff;

    border: 1px solid #ccc;

    box-shadow: 0 0 5px #bbb;

    box-sizing: content-box;

    margin: 0 auto;

    padding: 20px;

    width: 100%;

}

#slider, #slider div.sliderInner {

    height: 200px;

    width: 100%;

}



#slider {

   /* float:left;*/

	background:#fff url(loading.gif) no-repeat 50% 50%;

	position:relative;

    transform: translate3d(0,0,0);

}



/* the link style (if an image is wrapped in a link) */

#slider a.imgLink, #slider .video {

	z-index:2;

	position:absolute;

	top:0px;left:0px;border:0;padding:0;margin:0;

	width:100%;

	height:auto;

}

#slider .video {

	background:transparent url(video.png) no-repeat 50% 50%;

}



/* Caption styles */

#slider div.mc-caption-bg, #slider div.mc-caption-bg2 {

	position:absolute;

	width:400px;

	height:auto;

	padding:10px 0;/* 10px will increase height.*/

	left:120px; /*if the caption needs to be aligned from right, specify by right instead of left. i.e. right:20px;*/

	bottom:10px;/*if the caption needs to be aligned from top, specify by top instead of bottom. i.e. top:150px;*/

	z-index:3;

	overflow:hidden;

	font-size:0;

}

#slider div.mc-caption-bg {

    /* NOTE: Its opacity is to be set through the sliderOptions.captionOpacity setting in the js-image-slider.js file.*/

	background:#DDD;/* or any other colors such as Black, or: background:none; */

	border:1px solid white;

	border-radius: 5px;

}

#slider div.mc-caption-bg2 {

    background:none;

}

#slider div.mc-caption {

	font:bold 13px/16px Arial;

	color:#069;

	z-index:4;

	text-align:center;

    background:none;

}

#slider div.mc-caption a { 

	color:#060;

}





/* ------ built-in navigation bullets wrapper that is relative to the #slider ------*/

#slider div.navBulletsWrapper  {

	display:none;

}



/* --------- Others ------- */



#slider div.loading 

{

    width:100%; height:100%;

    background:transparent url(loading.gif) no-repeat 50% 50%;

    filter: alpha(opacity=60);

    opacity:0.6;

    position:absolute;

    left:0;

    top:0; 

    z-index:9;

}



#slider img, #slider>b, #slider a>b {

	position:absolute; border:none; display:none;

}



#slider div.sliderInner {

	overflow:hidden; 

	-webkit-transform: rotate(0.000001deg);/* fixed the Chrome not crop border-radius bug*/

	position:absolute; top:0; left:0;

}



#slider>a, #slider video, #slider audio {display:none;}

#slider div {-webkit-transform: translate3d(0,0,0);transform: translate3d(0,0,0);}







/* -- thumbnails -- */

#thumbs 

{

    float:left;   

    font:normal 11px/13px Arial;

    border-top:1px solid #CCC;

    color:#666;

	visibility:hidden;

	height:0px;

}

#thumbs .thumb 

{

    border:1px solid #CCC;

    border-top:1px solid #FFF;

    padding:11px 9px;

    background:#EEE;

	width:130px;

	color:#666;

}

#thumbs .thumb-on 

{

    background:#FFF;

}



#thumbs img{border:1px solid #DDD; cursor:pointer; width:70px; height:48px;}



#thumbs .frame {float:left; margin-left:28px; padding:2px;border:1px solid #CCC;background:white;border-radius:3px;box-shadow:0 0 3px #BBB;font-size:0;line-height:0;}

#thumbs .thumb-content {float:left;width:130px;margin-top:10px;}



/* Captions in #thumbs .thumb-content */

#thumbs .thumb-content p {font-weight:bold; color:#1D9DB4; margin:0 0 3px;padding:0;}

#thumbs .thumb-on .thumb-content p {color:#EC5B26;}



}

#retina-prob > img{

	filter: grayscale(0%);

    padding: 20px;

    transition: all 0.5s ease-in-out 0s;

    width: 100%;

	}

#retina-prob > img:hover{

	 filter: grayscale(100%);

	  transition: all 0.5s ease-in-out 0s;;

	}

#appointment-img  > img{

	

	 filter: grayscale(0%);

	  transition: all 0.5s ease-in-out 0s;

	}

#appointment-img  > img:hover{

	

	 filter: grayscale(100%);

	  transition: all 0.5s ease-in-out 0s;

	}

