﻿@charset "utf-8";
/* CSS Document */

body{ font-family: 'Open Sans', sans-serif; font-size:16px; background:#fff; color:#2a2a2a; font-weight:300; margin:0; padding:0}
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-size:16px; font-weight:300; line-height:32px;}
h1, h2, h3, h4, h5{ font-family: 'Roboto Slab', serif !important;}
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:35px 0; }

a#toggle {position: fixed;top:21px; right:21px; width:38px;height:38px;background:#2c2f3c; text-align: center;color: white;display: none;transition: all ease-out 0.3s;}
a#toggle i {position: relative;top:42%; transform: translateY(-50%);}
main#content { padding: 10px; }
.active-menu{ border-bottom:2px solid #72c7e3;}
#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 15px; font-weight:400; font-size:18px; color:#2d2e2d; font-family: 'Roboto Slab', serif;}
#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:#7c880f;}
#menu ul li ul li:hover{ background:#ffb93c;}
/*#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:250px;}



.banner_otr{ width:100%; height:auto; float:left; margin:0px; padding:6px 0; background: linear-gradient(to right, #f69244, #ffba79); position:relative;}
.banner_otr .item img{ margin:0px auto; width:100%;}
.banner_otr .owl-buttons, .owl-buttons{ display:none;}
.banner_otr .owl-pagination{ position:absolute; bottom:3%; right:13%;}
.banner_otr .item{ margin:0px auto; max-width:1466px; position:relative;}
.banner_otr .banner-head{ position:absolute; top:18%; left:12%;}
.button-style{ background:#f69143; padding:18px 35px; color:#fff; font-family: 'Roboto Slab', serif; font-size:21px; border-radius:5px; position:relative; top:35px; display:inline-block;}
.banner_otr .item h2{ font-family: 'Roboto Slab', serif; font-size:80px; color:#fff; text-shadow:1px 1px 1px #000;}
.banner_btmimg{ width:100%; height:auto; float:left; margin:0px; position:absolute; bottom:0px;}
.banner_btmimg img, .abt_bgbtm img{ width:100%;}

.latest-news, .temple-list{ width:100%; height:auto; float:left; margin:0px 0 20px; text-align:center;}
.latest-news .item img{ height:287px;}
.latest-news h2, .temple-list h2{ font-size:36px; color:#f58431; font-weight:600; font-family: 'Roboto Slab', serif; margin:50px 0; }
.latest-news .item, .temple-list .item{ border:1px solid #f7e8d9; padding-bottom:20px;}
.latest-news h3, .temple-list h3{ font-size:17px; line-height:25px; color:#4a403c; text-transform:uppercase; font-weight:800; margin:0;}
.latest-news h4, .temple-list h4{ color:#ec883b; font-family: 'Roboto Slab', serif; margin:22px 0 11px;}
.latest-news p, .temple-list p{ width:95%; margin:4px auto; height:95px; overflow:hidden; color:#4a403c}
.latest-news .owl-theme .owl-controls .owl-page span, .temple-list .owl-theme .owl-controls .owl-page span{ margin:5px 2px; width:19px; height:19px;}
.latest-news .owl-pagination, .temple-list .owl-pagination { margin:20px 0;}

.about-section{ max-width:1466px; height:auto; margin:50px auto; background: linear-gradient(to bottom, #f8ba7b 0%, #f47c27 100%) !important; display:flow-root; position:relative;}
.abt-content p{ color:#000; margin-bottom:40px;}
.abt-content h2{ color:#4a403c; font-size:31px; font-weight:600;}
.abt-content{ width:50%; padding:70px 84px; float:left;}
.abt-content .button-style{ background:#fff;  padding:15px 35px; color:#4a403c; font-family: 'Roboto Slab', serif; font-size:19px !important; border-radius:5px; position:relative; top:0px;}
.abt-banner{ width:50%; float:right;}
.abt-banner .owl-buttons{ display:none;}
.abt-banner .owl-pagination{ position:absolute; bottom:10px; right:20px;}

.temple-list{ width:100%; height:auto; float:left; margin:30px 0;}
.temple-list h3 { font-size:34px; line-height:37px; text-transform:none;  font-family: 'Open Sans', sans-serif !important; font-weight:800; margin:40px 0px 10px !important;}
.temple-list p { height:154px; overflow:hidden }
.temple-list .item{ padding-bottom:80px;}


.owl-theme .owl-controls{ margin:0 !important;}
.top_content{ width:100%; height:auto; float:left; margin:0px; padding:50px 0; position:relative;}
.error-page { text-align:center; padding:40px 0;}
.error-page h2{ font-size:150px; text-align:center; font-weight:600;  color:#f69143;}
.error-page p{ font-size:22px; font-weight:600;}




/*....................................inner page...........................*/

.inrbanner_otr{ width:100%; height:auto; float:left; margin:0px;}
.temple-content{ width:100%; height:auto; float:left; margin:30px 0 40px;}
.temple-content h2{ margin-bottom:20px;}
.temple-content p{ text-align:left; width:95%;}
.temple-content ul{ margin-left:17px; padding:0;}
.temple-content ul li{ list-style:circle; font-weight:400;}
.temple-content h3{ color:#f69143; font-size:21px; float:left; margin:0 5px 0 0; padding:0; line-height:32px; }
.temple-content span{ font-size:22px; font-weight:700; line-height:35px; color:#f69143;}

.about-page{ width:100%; height:auto; float:left; margin:30px 0 40px;}
.about-page ul { margin:0 0 20px; padding:0;}
.about-page ul li{ font-weight:600;}

.gallery-page .grid{ padding:10px 0 40px 0; float:left;}
.gallery-page .grid p{color:#fff; background:#f69143; padding:15px 20px; display:inline !important; position:relative; top:28px; text-transform:uppercase;font-weight:700; border-radius:5px;}
.gallery-page .grid h2{font-weight:400; color:#fff; font-family: 'Open Sans', sans-serif !important; text-transform:capitalize; text-shadow:1px 1px 1px #000; }
.gallery-page figure{ margin-bottom:30px;}

.gallery_page{ width:100%; height:auto; float:left; margin:40px 0;}
.gallery_page ul{ padding-left:0;  margin-top:5px; float:left}
.gallery_page .gal_popup img{ width:100%; height:250px; margin-bottom:30px;}
figure.effect-layla figcaption{ padding:20px !important}
figure.effect-layla figcaption::after{ top:10px !important; bottom:10px !important; right:21px !important; left:21px !important}
figure.effect-layla figcaption::before{top:16px !important; right: 44px !important; bottom: 16px !important; left: 44px !important;}


.news-page h2{ margin-bottom:20px;}
.news-page span{color:#f69143;}
.news-page ul li{ padding-bottom:30px; border-bottom:1px solid #ebebeb; float:left; margin-top:30px;}

.contact-page span {color:#f69143;}
.contact-page img { height:210px; margin-bottom:20px;}

/*..................................end contact page.........................*/

.footerarea{ width:100%; height:auto; float:left; margin:0px; background:#212221; padding:45px 0 ;}
.footerarea p{ color:#fff; font-size:16px; margin:0;}
.footerarea p span, .footerarea p a{ color:#fff;}
.footerarea p a:hover{ color:#fff !important;}
.right_side{ width:100%; height:auto; float:right; margin:0; padding:0;}
.right_side p{ color:#fff; margin:0; padding:0; font-size:16px; text-align:right;}
.right_side p b{ color:#6dc5e2;}


.audio-list{ width:100%; height:auto; float:left; margin:0px;}
.audio-list li{ padding:10px; margin-bottom:10px; border-bottom:1px solid #ebebeb;}
.audio-list li span{ float:left; margin-right:10px;}
.audio-list .button-style{ padding:5px 15px; font-size:18px; font-weight:400; top:-13px; margin-left:20px;}


.bg-imgleft{ width:100%; height:551px; float:left; margin:0px; position:absolute; top:74%; background:url(../images/bg-pattern.png) no-repeat;}
.bg-imgright{ width:100%; height:551px; float:left; margin:0px; position:absolute; top:74%; right:0; background:url(../images/bg-patternR.png) right no-repeat;}






/*..................................media queries.........................................................*/


	
@media screen and (max-width: 768px) {
.audio-list .button-style{top:0}

.banner-head .button-style{ padding:7px 14px; font-size:15px; top:2px;}
.banner_otr .banner-head{ top:8%;}
.banner_otr .item h2{ font-size:24px;}
.abt-content, .abt-banner{ width:100%;}	
.abt-content{ padding:30px;}
.topmenu_otr{ padding:22px 0 0 !important;}
#menu ul li > a{ font-weight:100; padding:5px 10px}
#menu ul li > a:hover{ background:#ffb93c;}
.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:0 8px; font-size:15px;}
}

@media screen and (min-device-width: 1280px) and (max-device-width:1366px) { 
.contact-icon i, .location-icon i, .mail-icon i{ padding:24% 0;}
.location-icon i, .mail-icon i{padding:21% 0;}
}


@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;}
}

@media screen and (-webkit-min-device-pixel-ratio:0){
.product-name ul li{ line-height:35px;}
}