@charset "utf-8";


@media all and (max-width: 1680px) {
.oddContainer { width: 100%;}
.vBox { padding: 140px 0;}


}


@media all and (max-width: 1366px) {
.mainMenu ul {padding: 20px 40px;}
.socialM a { width: 50px;display: inline-block;}
.socialM a img {width: 100%;}
.menuBtn { width: 100px; height: 100px;}
.mainMenu { top: 100px;}
.header {height: 100px; text-align: center;}
.logo {margin-top: 12px;margin-left: 0;width: 230px;}
.mainMenu.open { height: 520px; }
.socialM {margin-left: 40px;margin-bottom: 20px;}
.mainMenu ul li a { padding: 8px 15px;}
.mainMenu.open {height: 490px;}
.mDetail {margin-left: 40px;}


.slide-citt {padding-top: 100px;width: calc(100% + 15px)}
.visionMid h2 { font-size: 58px;}
.visionTherapy h2,.visionFaq h2{ font-size: 36px;}
.faqBox h2 { font-size: 30px;}


.simform { padding: 30px 0;}
.next { bottom: 55px;}



} 
@media all and (max-width: 1200px) {
.leftBox { width: 970px;}
.vt p,.ve p {font-size: 14px; line-height: 1.7;margin-bottom: 10px;display: inline-block;width: 100%;}
.vt a,.ve a {  display: inline-block;}
.vt,.ve { padding: 30px;}
.vt h2,.ve h2 { margin-top: 0;font-size: 30px;}
.vt h2 span ,.ve h2 span {font-size: 48px;}
.request h2 { font-size: 24px;margin-top: 0;} 
.rqTxt,.rqSelect { width: 100%;padding: 10px 20px;font-size: 16px; }
.request p { margin-bottom: 30px;}
.request button { margin-top: 20px;}
.service h2 { font-size: 48px;margin-top: 100px;margin-bottom: 30px;}
.srvBox h3 {font-size: 30px;}
.srvBox p { line-height: 1.7; }
#service .owl-controls {margin-top: 0;margin-left: 82%;display: inline-block;top: -70px;}
#service .owl-controls .owl-buttons div {width: 65px;height: 65px;padding-top: 15px;}
.service {padding-bottom: 50px;}
.vBox {padding: 100px 0;}
.mainMenu ul li a {  font-size: 16px;}

  
.visionTop h3 { font-size: 20px; margin-top: 0;margin-bottom: 10px;line-height: 24px;}
.visionTherapy h2, .visionFaq h2 {font-size: 30px;}
.visionTherapy p { margin-bottom: 10px; line-height: 26px;}
.visionTherapy ul li { margin-bottom: 10px;}
.visionMid h2 {font-size: 48px;}


.spt-carousel .owl-controls .owl-nav div{width: 65px;height: 65px;padding-top: 15px;}


p.rqTxtCitt { margin-bottom: 10px;}
.questions li > span label { font-size: 24px;font-family: 'robotoregular';}
.questions input { padding: 10px;font-size: 24px;}
.final-message.show{font-size: 24px}
.next { width: 49px;height: 49px;}
.simform .number { font-size: 24px;}

} 
@media all and (max-width: 1024px) {
	.book, .quick, .ecall {
	    position: fixed;
	    right: 0;
	    top: 0;
	    z-index: 999;
	}
	.quick {
	    top: 65px;
	}
	.ecall {
	    top: 130px;
	}

}

@media all and (max-width: 992px) {
.col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 {float: left;}
.col-md-12 {width: 100%;}
.col-md-11 {width: 91.66666667%;}
.col-md-10 {width: 83.33333333%;}
.col-md-9 {width: 75%;}
.col-md-8 {width: 66.66666667%;}
.col-md-7 {width: 58.33333333%;}
.col-md-6 {width: 50%;}
.col-md-5 {width: 41.66666667%}
.col-md-4 {width: 33.33333333%;}
.col-md-3 {width: 25%;}
.col-md-2 {width: 16.66666667%;}
.col-md-1 {width: 8.33333333%;}
.col-md-pull-12 {right: 100%;}
.col-md-pull-11 {right: 91.66666667%;}
.col-md-pull-10 {right: 83.33333333%;}
.col-md-pull-9 {right: 75%;}
.col-md-pull-8 {right: 66.66666667%;}
.col-md-pull-7 {right: 58.33333333%;}
.col-md-pull-6 {right: 50%;}
.col-md-pull-5 {right: 41.66666667%}
.col-md-pull-4 {right: 33.33333333%;}
.col-md-pull-3 {right: 25%;}
.col-md-pull-2 {right: 16.66666667%;}
.col-md-pull-1 {right: 8.33333333%;}
.col-md-pull-0 {right: auto;}
.col-md-push-12 {left: 100%;}
.col-md-push-11 {left: 91.66666667%;}
.col-md-push-10 {left: 83.33333333%;}
.col-md-push-9 {left: 75%;}
.col-md-push-8 {left: 66.66666667%;}
.col-md-push-7 {left: 58.33333333%;}
.col-md-push-6 {left: 50%;}
.col-md-push-5 {left: 41.66666667%;}
.col-md-push-4 {left: 33.33333333%;}
.col-md-push-3 {left: 25%;}
.col-md-push-2 {left: 16.66666667%;}
.col-md-push-1 {left: 8.33333333%;}
.col-md-push-0 {left: auto;}
.col-md-offset-12 {margin-left: 100%;}
.col-md-offset-11 {margin-left: 91.66666667%;}
.col-md-offset-10 {margin-left: 83.33333333%;}
.col-md-offset-9 {margin-left: 75%;}
.col-md-offset-8 {margin-left: 66.66666667%;}
.col-md-offset-7 {margin-left: 58.33333333%;}
.col-md-offset-6 {margin-left: 50%;}
.col-md-offset-5 {margin-left: 41.66666667%;}
.col-md-offset-4 {margin-left: 33.33333333%;}
.col-md-offset-3 {margin-left: 25%;}
.col-md-offset-2 {margin-left: 16.66666667%;}
.col-md-offset-1 {margin-left: 8.33333333%;}
.col-md-offset-0 {margin-left: 0%;}

.menuBtn {width: 80px;height: 80px;}
.header {height: 80px;}
.leftBox {width: 750px;}
.logo { width: 180px;}
.mainMenu {top: 80px;}
.mainMenu ul {padding: 10px 20px;}
.mainMenu ul li a { font-family: 'robotoregular';  font-size: 14px;}
.socialM { margin-left: 20px; }
.mDetail {margin-left: 20px;}
.mDetail p { font-size: 14px;}
.mainMenu.open {height: 450px;}
.vt h2 span, .ve h2 span {font-size: 36px;}
.vt h2, .ve h2 { font-size: 20px;}
.request h2  {font-size: 20px; }
.request { padding: 30px;}
.service h2 {font-size: 36px;margin-top: 80px; }
.srvBox h3 {font-size: 24px;}
.leftText {width: 65%;}
.srvBox {width: 100%;}
#service .owl-controls {margin-top: 0;margin-left: 0; top: inherit;position: absolute;bottom: -80px;right: 0;}
.service {padding-bottom: 150px;}
.vBox {padding: 70px 0;}
.vBox p {font-family: 'robotoregular';font-size: 14px;}
.leftFoo p { font-size: 12px;}
.foo2 ul li a, .foo3 ul li a { font-size: 12px;}
.leftFoo {width: 220px }
.copyBox {width: 210px;}
.copyBox a {width: 40px;display: inline-block;}
.copyBox a img {width: 100%;}
footer { padding: 55px;}


.slide-citt {padding-top: 80px;}
.visionTherapy h2, .visionFaq h2 {font-size: 24px;}
.visionTherapy p { line-height: 22px;font-size: 14px;}
.visionTherapy ul li {margin-bottom: 7px;font-size: 14px;}
.visionTherapy { padding: 50px 0; }
div#faq {width: 100%;}
.faqBox {padding:0 90px 0 230px;}
.faqBox span { font-size: 360px;line-height: 360px; }

 
.spt-cnt-in h2 { font-size: 22px;}


.gaugeBox { padding: 50px 0;}
.simform {padding: 20px 0 30px;}
.questions input { font-size: 18px;}
.next {width: 42px;right: 110px;height: 42px;}
.simform .number { right: 110px;font-size: 18px;}
.rqTxtCitt { height: 40px;line-height: 38px;}
.final-message.show {font-size: 18px;}

.book{top: 80px;}
.quick{top:145px;}
.ecall{top:210px;}

}


@media all and (max-width: 768px) { 
.col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 ,.col-md-pull-12,.col-md-pull-11,.col-md-pull-10,.col-md-pull-9,.col-md-pull-8,.col-md-pull-7,.col-md-pull-6,.col-md-pull-5,.col-md-pull-4,.col-md-pull-3,.col-md-pull-2,.col-md-pull-1,.col-md-push-12,.col-md-push-11,.col-md-push-10,.col-md-push-9,.col-md-push-8,.col-md-push-7,.col-md-push-6,.col-md-push-5,.col-md-push-4,.col-md-push-3,.col-md-push-2,.col-md-push-1{  
float: none;
display:block;
width: 100%;} 
.col-md-pull-12,.col-md-pull-11,.col-md-pull-10,.col-md-pull-9,.col-md-pull-8,.col-md-pull-7,.col-md-pull-6,.col-md-pull-5,.col-md-pull-4,.col-md-pull-3,.col-md-pull-2,.col-md-pull-1,.col-md-pull-0 {right: 0;} 
.col-md-push-12,.col-md-push-11,.col-md-push-10,.col-md-push-9,.col-md-push-8,.col-md-push-7,.col-md-push-6,.col-md-push-5,.col-md-push-4,.col-md-push-3,.col-md-push-2,.col-md-push-1,.col-md-push-0 {left: 0;} 
.col-md-offset-12,.col-md-offset-11,.col-md-offset-10,.col-md-offset-9,.col-md-offset-8,.col-md-offset-7,.col-md-offset-6,.col-md-offset-5,.col-md-offset-4,.col-md-offset-3,.col-md-offset-2,.col-md-offset-1,.col-md-offset-0 {margin-left: 0;} 
 
.bgRotate { display: none;}
.head { width: 100%;margin-left: -24px;}
.leftBox {width: 100%;}
.mainMenu { left: -16px;width: 100%;} 
.slide {margin-top: 95px;margin-bottom: 15px;}
.vt { background-size: contain; background-position: right;background-color: #c6e6ff;}
.vt p, .ve p { margin-bottom: 20px;}
.vt h2, .ve h2 {font-size: 30px;}
.vt h2 span, .ve h2 span {font-size: 48px;}
.vt, .ve {padding: 40px;}
.request h2 {font-size: 30px;}
.request {padding: 40px 30px;}
.service h2 {font-size: 30px;margin-top: 50px;}
.vBox {padding: 50px 0;}
.vBox p {margin-bottom: 25px;}
.videoWrapper { position: relative; padding-bottom: 56.25%; padding-top: 25px; height: 0; }
.videoWrapper iframe { position: absolute; top: 0; left: 0; width: 100%;height: 100%; } 
.service {padding-bottom: 120px;}
.leftFoo {width: 100%;float: none; display: inline-block; padding: 30px 20px;}
footer {padding: 0;}
.copyBox {width: 50%;}
.foo2 {margin-right: 10px;}
.foo2 ul, .foo3 ul { padding-left: 20px;margin-bottom: 0;}
.rightImg img {width: 100%;}
.rightImg{  margin-left: 5%;width: 30%;}
.srvBox { padding: 40px 30px;}


.citt-table { margin-top: 80px;}
.slide-citt {padding-top: 0;}
.rightBox .requestCitt p {font-family: 'robotoregular'; font-size: 14px;}
.visionTherapy {padding: 30px 0;}
div#vision {margin-top: 30px;}
.visionMid h2 {font-size: 36px;}
.visionMid { padding: 50px 0;}
.visionFaq { padding: 30px 0;}
.faqBox p { font-size: 14px;}
.col-md-6-table { display: inline-block; width: 100%;}
.col-md-6-table-image {padding-right: 15px;} 
.slide-citt {width: 100%;max-width: 400px;margin: auto;display: block;}
.rightBox .requestCitt p { margin-bottom: 0;}
.visionTherapy,.visionFaq{padding: 20px 0;}
.rightBox .request h2 {font-size: 24px;}
.visionTop {padding: 40px 0px;}
 
 .col-md-6-table-image:after { left: 0;}
.spt-cnt-in h2 { font-size: 18px;}


.request button { display: block;}
.rightBox form {margin-top: 20px;}
.simform .number {right: calc(50% - 250px);}
.next { right: calc(50% - 250px); bottom: 55px;}

.noPadR{padding-right: 15px;}

.vconr, .serSTxt {margin-top: 20px; }

.profileBox{width: 33.33%;float: left;}
.proImage{float: none;}
.proImage img{width: 100%;}

} 


@media all and (max-width: 640px) { 
.copyBox p { font-size: 12px; } 
.copyBox { text-align: left;padding: 10px 20px 0; width: 100%;}
.foo2 ul li, .foo3 ul li { margin-bottom: 8px;margin-right: 0;display: block;}
.foo2, .foo3 {float: none;}
.leftFoo { padding: 30px 20px 0;}
.foo2 {margin-right: 0;}
.foo2 ul, .foo3 ul {padding-left: 0;margin-bottom: 0; margin: 0 20px;}
.foo2 { margin-top: 20px;}
.foo3 { margin-bottom: 20px;}
.srvBox h3 {font-size: 20px;}
.srvBox p{ font-family: 'robotoregular';margin-bottom: 20px; letter-spacing: inherit;}
.leftText a { display: inline-block;width: 100%;}
.citt-table {display: inline-block;}
.slide-citt { width: 100%;}
.col-md-6-table-image {padding-right: 15px;}
.slide-citt { width: 100%;}
 
 
 .rightBox .request h2 {font-size: 20px;}
 .visionTop h3 {font-size: 18px;}
.visionTherapy h2, .visionFaq h2 {font-size: 20px;}
.faqBox {padding: 0  20px;display: inline-block}
.faqBox span { display: none;}
.visionFaq .owl-item {height: inherit;display: inline-block;width: 100%;} 
#faq .owl-controls {position: relative;
transform: translateY(0%);
-webkit-transform: translateY(0%);
-moz-transform: translateY(0%);
-ms-transform: translateY(0%);
-o-transform: translateY(0%);
}
#faq .owl-controls .owl-page { display: inline-block;}


.spt-cnt { 
transform: translateX(0%);
-webkit-transform: translateX(0%);
-moz-transform: translateX(0%);
-ms-transform: translateX(0%);
-o-transform: translateX(0%);
}


.gaugeBox p { font-size: 14px;}
.questions li > span label { font-size: 20px;}
.simform {padding: 10px 0 20px;}
.questions input,.simform .progress::before,.controls { width: 440px;}
.next {right: calc(50% - 220px);bottom: 43px;}
.simform .number {right: calc(50% - 220px);}

.book, .quick, .ecall {top: 60px;width: 50px;height: 50px;}
.book img, .quick img, .ecall img {width: 100%;}
.quick{top:110px;}
.ecall{top:160px;}

button.closeD{width: 34px; padding: 5px; margin-top: 0; margin-bottom: 10px;}
.Abt ul li{height: 120px;}
.Abt ul li a{font-size: 18px;}

.head {margin-left: -15px; }
.gfield_label{display: none;}


}
 
@media all and (max-width: 480px) { 
.mainMenu ul {padding: 0px 10px;}
.socialM a {width: 40px;}
.mDetail p span { margin-bottom: 0;font-size: 12px}
.logo { margin-top: 8px; width: 130px;}
.menuBtn {width: 60px;height: 60px;}
.header {height: 60px;}
.mainMenu.open {height: 380px;top: 60px;}
.mainMenu ul li a {padding: 5px 10px;}
.socialM { margin-bottom: 15px;} 
.mainMenu {top: 60px;} 
.vt h2 span, .ve h2 span {font-size: 24px;}
.vt h2, .ve h2 {font-size: 18px;}
.vt, .ve {padding: 30px;}
.request h2 {font-size: 18px; line-height: 1.3;}
.request p{font-family: 'robotoregular';margin-bottom: 20px;}
.rqTxt, .rqSelect { padding: 6px 0px;font-size: 14px;}
.request button,.leftText a { width: 100%;padding: 8px 0px;    text-align: center;}
.service h2 {font-size: 20px; margin-top: 40px;margin-bottom: 20px;}
.leftText ,.rightImg {width: 100%;}
.leftText {margin-top: 20px;}
#service .owl-controls .owl-buttons div.owl-prev, .spt-carousel .owl-controls .owl-nav div.owl-prev {width: 45px;height: 45px; background: #fff url(/wp-content/themes/kanohi/img/left.png) no-repeat center;background-size: 15px;}
#service .owl-controls .owl-buttons div.owl-next, .spt-carousel .owl-controls .owl-nav div.owl-next {width: 45px;height: 45px; background: #fff url(/wp-content/themes/kanohi/img/right.png) no-repeat center;background-size: 15px;}
#service .owl-controls .owl-buttons div.owl-prev:before, #service .owl-controls .owl-buttons div.owl-next:before , .spt-carousel .owl-controls .owl-nav div.owl-prev:before, .spt-carousel .owl-controls .owl-nav div.owl-next:before{content: '';}
#service .owl-controls { bottom: -65px;}
.srvBox h3 {font-size: 16px;}
.srvBox p {line-height: 1.5;}
.vBox {padding: 30px 0;}
.service {padding-bottom: 90px;}
.ve { background-size: cover;}
.vt {background-size: cover;background-position: left;}
.vt, .ve {padding: 20px;}
.request {padding: 20px;}
.srvBox {padding: 20px;}
.leftFoo {padding: 20px 0px 0;}
.foo2 ul, .foo3 ul { margin: 0;}
.copyBox { padding: 10px 0px 0; }
.foo2 ul li a, .foo3 ul li a{ font-family: 'robotoregular';}
.foo2 ul li, .foo3 ul li {margin-bottom: 4px;}
.foo2 {margin-top: 10px;}
.foo3 {margin-bottom: 10px;}
.slide { margin-top: 75px;}


.citt-table {margin-top: 60px;}
.visionTop {padding: 40px 0px;}
.visionTherapy h2, .visionFaq h2 {font-size: 18px;line-height: 24px;}
.faqBox {padding: 0}
.faqBox h2 { margin-top: 0;}
.visionMid h2 {font-size: 24px;}
.visionMid {padding: 30px 0;}

  
.spt-car { padding-bottom: 50px;}
.rightBox .requestCitt p { line-height: 22px;}
.spt-cnt-in {padding: 10px;}
.spt-cnt-in p {font-size: 12px;}
 
 
.questions input,.simform .progress::before,.controls { width: 100%;} 
.next,.simform .number {right: 0;} 
.gaugeBox {padding: 30px 0;}
form .rqTxtCitt { width: 100%;}
.chartContainer{width: 100% !important;}
.demo-gauge { width: 250px; height: 250px; }
div#gauge {width: 250px !important;height: 250px !important;}
input.gaugeSub { width: 100%;}
#input_5_2 , #input_5_3 , #input_5_4 , #input_5_5 , #input_5_6 , #input_4_2 , #input_4_3{width: 100%!important;}
button.closeD{width: 34px; padding: 5px; margin-top: 0; margin-bottom: 10px;}

.profileBox {width: 50%;}
.profiles h2 {font-size: 24px;}
#vision .owl-controls .owl-buttons div{width: 45px; height: 45px; padding-top: 5.5px; }
.back{margin-bottom: 20px;display: block;}
.questions select{width: 100%;}
.next{width: 40px;height: 40px;bottom: 41px;}
.cMap{width: 100%;margin-top:10px;}
}

@media all and (max-width: 400px) {
.vt p br, .ve p br{display: none;}
.vt a, .ve a { text-align: center; width: 100%;padding: 8px 0;}

}
@media all and (max-width: 320px) {


}