@charset "utf-8";
/* CSS Document */

body{ font-family: 'Open Sans', sans-serif; font-size:17px; background:#fff; color:#212121; font-weight:300; margin:0; padding:0; line-height:32px;}

@font-face{font-family:'Noto Sans Malayalam'; src:url('../fonts/NotoSansMalayalam-Regular.eot');src:url('../fonts/NotoSansMalayalam-Regular.eot?#iefix') format('embedded-opentype'),url('../fonts/NotoSansMalayalam-Regular.woff2') format('woff2'),url('../fonts/NotoSansMalayalam-Regular.woff') format('woff');font-style:normal}

a, p, i, img{-moz-transition:0.3s ease-in-out; -ms-transition:0.3s ease-in-out; -o-transition:0.3s ease-in-out; -webkit-transition:0.3s ease-in-out; }
ul li, a{text-decoration:none !important; list-style:none; outline:none !important; -moz-transition:0.3s ease-in-out; -ms-transition:0.3s ease-in-out; -o-transition:0.3s ease-in-out; -webkit-transition:0.3s ease-in-out;}
.no-pad{padding:0 !important}
p, li{ font-weight:300; line-height:32px;}
h1, h2, h3, h4, h5{ letter-spacing:2px;}
button{-moz-transition:0.3s ease-in-out; -ms-transition:0.3s ease-in-out; -o-transition:0.3s ease-in-out; -webkit-transition:0.3s ease-in-out;}
<!--a:hover{ color:#212121 !important;}-->
.left{ padding-left:0 !important;} .right{ padding-right:0 !important;}





.topmenu_otr{ width:100%; height:auto; float:left; margin:0px; padding:30px 0;}
.inrtopmenu_otr{ width:100%; height:auto; float:left; margin:0px; padding:30px 0; background:#ededed;}
div#overlay { display: none; }

a#toggle {position: fixed;top:22px; right:21px; width:37px;height:34px;background:#2c2f3c; text-align: center;color: white;display: none;transition: all ease-out 0.3s;}
a#toggle i {position: relative;top:29%; transform: translateY(-50%);}
main#content { padding: 10px; }
#menu {text-align: right;transition: all ease-out 0.3s; position:relative; top:15px;}
#menu a { color: white; }
#menu ul {margin: 0;padding: 0;}
#menu ul li {display: inline-block;position: relative;}
#menu ul li > a {display: inline-block;padding:0 11px; text-transform:uppercase; color:#2c2c2c; font-size:16px;}
#menu ul li > a > i {margin-left: 15px;transition: all ease-out 0.3s;-webkit-transition: all ease-out 0.1s;}
#menu ul li ul {display: none;position: absolute;top:30px;width:275px; text-align: left; z-index:10;  }
#menu ul li ul li { display: block; background:#49b99e;}
#menu ul li ul li:hover{ background:#ccc; color:#f00 !important;}
/*#menu ul li ul li:hover { background:#1eb26d}*/
#menu ul li ul li a { display: block; padding:13px 15px; color:#fff; text-transform:none; font-weight:300;}
#menu ul li:hover > a > i { transform: rotateZ(90deg); }
#menu ul li:hover ul { display: block;}
.logo{ max-width:300px;}



.banner_otr{ width:100%; height:auto; float:left; margin:0px; padding:0; position:relative;}
.banner_otr .banner-content{ position:absolute; top:46%; right:8%;}
.banner-content p{ font-size:55px; text-transform:uppercase; font-weight:800; line-height:65px;}
.banner-content p span{ color:#49b99e;}
.banner_otr .item img{ width:100%;}
.banner_otr .owl-buttons{ display:none;}
.banner_otr .owl-pagination{ position:absolute; bottom:1%; right:10%;}
.banner_otr .item{ position:relative;}
.banner_btmimg{ width:100%; height:auto; float:left; margin:0px; position:absolute; bottom:0px;}
.banner_btmimg img, .abt_bgbtm img{ width:100%;}
.owl-theme .owl-controls{ margin:0 !important;}
.top_content{ width:100%; height:auto; float:left; margin:0px; padding:50px 0; position:relative;}
.abt_bgbtm{ width:100%; height:auto; float:left; margin:0px; z-index:11; }



.inbnr_logo{ position:absolute; top:15%; left:10%;}
.about_clg{ width:100%; height:auto; float:left; margin:0px; text-align:center}
.about_clg p{ margin:0px auto; width:77%; text-align:center; }
.about-hope{ width:55% !important; margin-bottom:30px !important;}
.about_clg h1{ font-size:35px; text-transform:none; font-weight:700; letter-spacing:normal;}
.about_clg h1 span { font-size:55px; color:#49b99e;}
.about_clg h3{ font-size:30px; font-weight:700; color:#49b99e; letter-spacing:normal; margin-bottom:25px;}
.about_clg a, .about_help a{ background:#212121; padding:13px 22px; color:#fff; text-transform:600; text-transform:uppercase;}

.newsarea h2, .carou_slider h2, .lifeline_mgt h2, .testimonial h2{ font-size:33px; text-transform:uppercase; letter-spacing:2px; font-weight:800; color:#212121; margin-top:5px; }
/*.about_clg h1 span, .newsarea h2 span, .carou_slider h2 span{ color:#3eb97a;}*/

.about_page ul{ margin:0 0 30px 20px; padding:0;}
.about_page ul li{ list-style:decimal;}
.btm_line { width:20%; height:1px; margin:20px auto 15px auto; background:#e4e4e4;}
.btm_line1 { width:40%; height:1px; margin:20px auto 15px auto; background:#e4e4e4;}

.about_help{ width:100%; height:auto; float:left; margin:50px 0 80px;}
.about_help h2{ font-size:55px; font-weight:700; margin:30px 0 20px;}
.about_help p{ width:90%; margin-bottom:35px;}
.about_help a{ background:#49b99e;}

.assessment{ width:100%; height:auto; float:left; margin:60px 0;}
.assessment h3{color:#49b99e; text-transform:uppercase; font-size:34px; font-weight:700; letter-spacing:normal;}
.assessment .item ul { padding:0; margin:0;}
.assessment .item ul li{ background:url(../images/icon.png) left top no-repeat; padding-left:40px;}
.assessment .item ul li h4{ font-weight:600;}
.assessment .item ul li p{ margin-bottom:10px; font-size:16px;}
.assessment .owl-buttons{ display:none;}
.assessment .owl-pagination{ float:left; margin-left:38px;}




.carou_slider{ width:100%; height:auto; float:left; margin:0px;text-align:center;}
.carou_slider h2{ font-size:33px; margin:20px 0 10px 0}
.carou_slider h3{ font-size:20px; text-transform:uppercase; font-weight:800;} 
.carou_slider p{ margin-bottom:20px; }
.carou_slider .owl-wrapper-outer{ margin-bottom:27px;}
.carou_slider .item { text-align:center; height:auto; position:relative; margin-bottom:10px;}
.carou_slider .owl-buttons, .mgt_message .owl-buttons, .mgt_message .owl-pagination{ display:none !important;}
.carou_slider .owl-pagination{ margin-bottom:20px;}
.carou_slider #owl-demo1{ margin-top:50px;}
.footerlinks{ width:100%; height:auto; float:left; margin:0px;}

.testimonial{ width:100%; height:auto; float:left; margin:40px 0 10px; text-align:center;}
.testimonial h4{ font-size:15px; text-transform:uppercase; font-weight:800; color:#7c880f;}
.testimonial span{ font-size:14px; font-style:italic; font-weight:bold; margin-bottom:30px;}
.testimonial .owl-buttons{ display:none;}
.testimonial .owl-pagination{ margin-top:20px;}
.map_otr{ width:100%; height:auto; float:left; margin:20px 0; position:relative;}



/*....................................about page...........................*/

.about_page, .contact_page{ width:100%; height:auto; float:left; margin:20px 0 0 0; min-height:350px; text-align:left}
.about_page h2{ color:#2c2f3c; font-size:30px; font-weight:700; width:100%; letter-spacing:0; float:left;}
.about_page h3{ margin-top:0; letter-spacing:0; font-weight:600; color:#212121;}
.about_page h1{font-size:38px; text-transform:uppercase; font-weight:800; color:#49b99e;}
.about_page p{ margin-bottom:40px;}
.about_page ul{ padding:0;}
.inr_bg{ width:100%; height:444px; float:left; margin:0px; background:url(../images/inr-bg.jpg) top right no-repeat}
.inr_bg1{ width:100%; height:322px; float:left; margin:0px; background:url(../images/inr-bg1.jpg) top left no-repeat}
.help-program{ width:100%; height:auto; float:left; margin:0px auto; text-align:center}
.help-program h3{ font-weight:600; color:#49b99e;}
.mal-content{ width:100%; height:auto; float:left; margin:30px 0; padding:50px 20px; background:#212121;}
.mal-content p{font-family:'Noto Sans Malayalam'; text-align:center; color:#fff; margin:0px auto;}
.mal-content p span{ color:#49b99e; font-weight:600;}
.mal-content h3{ font-size:18px; color:#49b99e; font-weight:700;}
.mal-content ul li{ color:#fff; list-style:circle; font-size:15px;} 
.mal-content ul{ border-right:1px solid #303032; margin:30px 0 30px 20px;}
.no-border{ border:none !important;}
.opening-times{ width:100%; height:auto; float:left; margin:20px 0; padding:10px 15px 0 ;/* border:1px solid #ebebeb;*/ background:#49b99e;}
.opening-times i{ float:left; margin-right:10px; font-size:18px; font-weight:100; color:#fff;}
.opening-times h4{ margin:0; padding:0; font-weight:700; text-transform:uppercase; padding-bottom:10px; border-bottom:1px solid #2bac8d; color:#fff;}
.opening-times ul{ margin:0; padding:0}
.opening-times ul li{list-style:none; font-size:16px; color:#fff; border-bottom:1px solid #2bac8d; padding-bottom:3px;}
.opening-times ul li span{}

/*....................................end about page...........................*/



/*..................................contact page.........................*/

.location_map{ width:100%; height:auto; float:left; margin:50px 0 0 0; }
.contact_page h2{ text-transform:uppercase;  font-weight:800; font-size:28px; margin-top:0; color:#212121; text-align:left;}
.contact_page span{   font-size:15px; letter-spacing:2px; font-weight:300; width:100%; height:auto; float:left; margin-bottom:30px; text-align:left; color:#49b99e;}
.contact_page i{ font-size:50px; color:#e65b4f; margin-bottom:20px;}
.contact_page p{ margin-bottom:40px; text-align:left;}

.contact_page .form-control{ border:1px solid #e4e4e4; padding:12px; height:auto !important;}
.contact_page{ margin-bottom:0px;}
.send_btn{ width:auto; height:auto; margin:18px 0; padding:10px 35px; background:#49b99e; border:none; color:#fff; text-transform:uppercase; float:left;}
.send_btn:hover{ background:#212121; color:#fff;}

/*..................................end contact page.........................*/

.footerarea{ width:100%; height:auto; float:left; margin:0px; background:#121215; padding:26px 0 0px; text-align:center;}
.footerarea img{ margin:40px 0 5px}
.footerarea p{ color:#fff; font-size:16px; margin:25px 0 5px; }
.footerarea .social_icons{ margin-bottom:50px;}
.footerarea .social_icons i{ color:#fff; font-size:15px; margin:0 10px;}
.footerarea .social_icons i:hover, .ftr-btm a:hover{ color:#49b99e !important}
.ftr-btm{ padding:30px 0; background:#000; width:100%; height:auto;}
.ftr-btm p{ margin:0;}
.ftr-btm span, .ftr-btm a{ color:#f3b910;}


/*..................................gallery page.........................*/

.img-gallery h3{ text-align:center; font-weight:700; font-size:42px; letter-spacing:normal; margin-bottom:40px;}
.img-gallery{ width:100%; height:auto; float:left; margin:30px 0 70px;}
.img-gallery .effect-oscar{ width:100%; height:241px; margin-bottom:15px !important; float:left;}
.gal_popup a img{ }
.gal_popup .fancybox{ width:100%; height:241px; overflow:hidden; float:left; margin:0px 0 15px 0 !important;}












/*..................................media queries.........................................................*/

@media only screen and ( max-width: 640px )
{
.imglist_top .gallery1 a img{ width:100% !important;}
}

@media only screen and ( max-width: 768px )
{
.carou_slider, .ftrtoparea{ margin:20px 0 0 0; width:100%;}
.newslist{}	
.right_side p{ text-align:center;}
	}
	
@media screen and (max-width: 768px) {
	.assessment .item ul li{ background:none; text-align:left; padding-left:0}
	.top_content{ padding:14px 0;}
	.about_clg h1 span, .about_help h2{ font-size:38px;}
	.about_clg h1{ font-size:26px;}
	.btm_line{ width:40%;}
	.about_clg p, .about-hope, .about_help p{ width:98% !important;}
	.about_clg a, .about_help a{ font-size:14px;}
	.about_clg h3{ font-size:26px;}
.newsarea h2, .carou_slider h2, .lifeline_mgt h2, .testimonial h2{ font-size:28px;}
.treatment .v-trt{ margin-bottom:35px;}
.topmenu_otr{ padding:22px 0 0 !important;}
#menu ul li > a{ font-weight:100; padding:5px 10px}
#menu ul li > a:hover{ background:#49b99e;}
#menu ul li ul li{border-bottom:1px solid #0195d3;}
#menu ul li ul li a{ padding:6px 15px;}
.footerarea p{ text-align:center;}
a#toggle { display: block; right:10px; z-index:100 }
main#content {margin-top: 65px;transition: all ease-out 0.3s;}
#menu {position: fixed;width: 250px;height: 100%;top: 0;left: 0;overflow: hidden;overflow-y: auto;background:#2c2f3c;transform: translateX(-250px);}
#menu ul {text-align: left;background-color: transparent;}
#menu ul li { display: block; }
#menu ul li a { display: block;  color:#fff;}
#menu ul li a > i { float: right; margin-top:7px;}
#menu ul li ul {display: none;position: static;width: 100%;background-color: rgba(120,128,26, 0.2) !important;}
#menu ul li:hover > ul { display: none; }
#menu ul li:hover > a > i { transform: rotateZ(0); }
#menu ul li.open > a { background-color: rgba(0, 0, 0, 0.3); }
#menu ul li.open > a > i { transform: rotateZ(90deg); }
#menu ul li.open > ul { display: block; }
div#overlay {display: block;visibility: hidden;position: fixed;left: 0;top: 0;width: 100%;height: 100%;background-color: rgba(0, 0, 0, 0.8);transition: all ease-out 0.3s;z-index: 1;opacity: 0;}
html.open-menu { overflow: hidden; }
html.open-menu div#overlay {visibility: visible;opacity: 1;width: calc(-150%);left: 250px;}
html.open-menu a#toggle,html.open-menu main#content { }
html.open-menu nav#menu {z-index: 3;transform: translateX(0);}

.topmenu_otr{ padding:14px 0;}
.banner_otr{margin-top:20px;}
.logo{ max-width:230px;}
.banner_btmimg{ bottom:-35px;}
.news_img{ width:82px;}
.news_img span{ padding:0 !important;}
.ftrtopcon p{ font-size:26px; display:block; margin:0 0 22px 0;}
.ftrtopcon a{ padding:9px 20px; font-size:17px;}
.ftrtoparea{ padding:20px 0; margin-bottom:20px;}
.innercontent{margin:100px 0 20px 0;}
}

@media only screen and ( max-width: 1024px )
{
#menu ul li > a{ padding:6px 8px; font-size:15px;}
}




@media only screen and ( max-width: 50em ) /* 800 */
{
#nav{position: relative;}
#nav > a{}
#nav:not( :target ) > a:first-of-type, #nav:target > a:last-of-type{display:block;}
/* first level */
#nav > ul{height: auto;display: none;position: absolute;left: 0;right: 0; background:#48545f;}
#nav:target > ul{display: block;}
#nav > ul > li{width: 100%;float: none;}
#nav > ul > li a{ width:100%;}
#nav > ul > li ul li{ margin-left:20px;}
/* second level */
#nav li ul{position: static;}
}