@charset "utf-8";
/* CSS Document */
body{ background-color:#FFFFFF; background-repeat:repeat-x; margin:0; padding:0}
.spacer{ width:100%; height:1px; line-height:1px; clear:both}
h1{ font-family:'great_vibesregular'; font-size:30px; color:#000000; line-height:42px}
h2{ font-family:'open_sansregular'; font-size:28px; color:#fff; font-weight:normal; padding-left: 45px;    padding-top: 30px;}
h3{ font-family:'droid_serifregular'; font-size:35px; color:#fff; font-weight:normal; text-align:center;
		 text-transform:uppercase; padding-top:70px}
h4{ font-family:'droid_serifregular'; font-size:22px; color:#fff; font-weight:normal;  }


#top_line{ width:100%; max-width:1920px; height:7px; background-color:#008fca; margin:0 auto}
#top_bg{ width:100%; max-width:1920px; height:156px; background-image:url(../images/top_bg.png); background-size:cover; margin:0 auto; z-index:999; position:absolute} 

.wrapper{ width:100%; max-width:1920; height:auto; margin:0 auto}
.logo{ width:100%; max-width:366px; height:126px; float:left; margin-top:10px}


#top_rt{ width:100%; max-width:720px; height:auto; float:right}
#phn{ width:100%; max-width:475px; height:auto; float:right; margin-right:45px; margin-top:40px}
#phn p{ font-family:'droid_serifregular'; font-size:20px; color:#008fca}

#menu{ width:100%; max-width:650px; height:auto; float:right}
#menu ul{ text-decoration:none}
#menu ul li{ font-family:'droid_serifregular'; font-size:18px; color:#000000; float:left; padding: 40px 15px 0 0;}
#menu ul li a{ color:#000000}
#menu ul li a:hover{ color:#008fca !important}
.active a{ color:#008fca !important}


#banner{ width:100%; max-width:1920px; height:auto; margin:0 auto; overflow:hidden}


#welcome_bg{ width:100%; max-width:1920px; height:537px; background-image:url(../images/welcome_bg.jpg);
			 background-size:cover; margin:0 auto}
			 
#welcome{ width:100%; max-width:630px; height:auto; float:left; margin-top:20px}
#welcome p{ font-family:'droid_serifregular'; font-size:17px; color:#151515; line-height:26px; text-align:justify; padding-top:15px}
.line{ width:100%; max-width:627px; height:7px; background-color:#c0c0c0; margin-top:12px}
.readmore{ width:100%; max-width:155px; height:39px; margin-top:15px}

#amenities{ width:100%; max-width:446px; height:460px; float:right; background-image:url(../images/amenities_bg.png);
			 background-size:cover; margin-top:25px}	
#amenities ul{ text-decoration:none; margin-left: 45px;    margin-top: 10px}
#amenities ul li{ font-family:'droid_serifregular'; font-size:16px; color:#FFFFFF; line-height:40px; background-image:url(../images/bullets.png); background-repeat:no-repeat; background-position:0.1em; padding-left:35px}	

.line1{ width:100%; max-width:1140px; height:7px; background-color:#c0c0c0; margin-top:15px}

#attractions_bg{ width:100%; max-width:1440px; height:201px; background-image:url(../images/attractions_bg.png);
				 background-size:100%; background-repeat:no-repeat; margin:0 auto; overflow:hidden}	
.att{ float:left; margin: 30px 25px 0 0;}
.att_icon{ margin:0 auto; text-align:center; margin-top:12px}	

#info_bg{ width:100%; max-width:1440px; height:auto; background-color:#242424; margin:0 auto; overflow:hidden}
	
#loc{ width:100%; max-width:340px; height:auto; float:left; margin-top:60px; margin-left:15px}		
#loc_img{  float:left}
#loc_txt{ float:left}
#loc_txt p{ font-family:'droid_serifregular'; font-size:15px; color:#FFFFFF; padding-top: 6px;
    padding-left: 15px;} 	 		 

#phn_img{  float:left; margin-top:20px; margin-left:2px}
#phn_txt{ float:left}
#phn_txt p{ font-family:'droid_serifregular'; font-size:15px; color:#FFFFFF; padding-top: 25px;
    padding-left: 15px;} 	 		 

#email_img{  float:left; margin-top:20px; margin-left:2px}
#email_txt{ float:left}
#email_txt p{ font-family:'droid_serifregular'; font-size:15px; color:#FFFFFF; padding-top: 20px;
    padding-left: 12px;} 

#social{ width:100%; max-width:130px; height:auto; float:left; margin-top:60px; margin-left:30px}

#policy{ width:100%; max-width:152px; height:auto; float:left; margin-top:60px; margin-left:60px}
#policy p{ font-family:'droid_serifregular'; font-size:14px; color:#FFFFFF; line-height:28px; padding-top:8px}
#card{ margin-top:8px}

#weather{ width:100%; max-width:300px; height:auto; float:right; margin-right:20px; margin-top:30px; margin-bottom:35px}


#footer_bg{ width:100%; max-width:1440px; height:112px; background-color:#1e1e1e; margin:0 auto}	
#footer{ width:100%; max-width:1140px; height:auto; margin:0 auto}
#footer p{ font-family:'open_sansregular'; font-size:16px; color:#FFFFFF; line-height:28px; text-align:center; padding-top:28px}
#footer p a{ color:#F0FF00}

.line2{ width:100%; max-width:1140px; height:1px; background-color:#f19908; margin-top:50px}

#gallery{ margin-top:20px}

.line3{ width:100%; max-width:1140px; height:1px; background-color:#f19908; margin-top:20px; margin-bottom:20px}

.lineee {
    width: 100%;
    height: 1px;
    margin: 15px 0;
    clear: both;
    border-bottom: 1px dashed #FF0000;
}



/***************************contactus*****************************/
.contactus_lft{width: 100%;		max-width:555px; height:auto; float:left;}
.form{ width:100%; max-width:280px; height:auto; float:left; margin:10px 0 0 20px; border:1px #dcdcdc solid; padding-left:15px; ; padding-top:15px;  background-color:#FFF; margin-bottom:40px; padding-bottom:20px}
.contactus_rt{ width:99%; max-width:1140px; margin-left:15px}
.map{ width:99%; max-width:1140px;   margin:15px 0px !important; height: auto}
.contact_mid{ width:100%; max-width:540px; height:auto; float:right; margin-top:20px}	

.box1 {
    width: 100%;
    max-width: 1140px;
    height: 50px;
    background-color: #008fca;
    margin-top: 20px;
    
}

.att_img{ width:100%; max-width:291px; height:204px; float:left; margin-left:20px; margin-top:20px; margin-bottom:20px}
.att_txt{ width:100%; max-width:1100px; height:auto; margin-left:20px}
.att_txt p{  font-family:'open_sansregular'; font-size:16px; color:#000; text-align:justify; line-height:26px; padding-top:20px; padding-bottom: 25px;}

.testimonials{ width:100%; max-width:1420px; height:auto}
.testimonials p{  font-family:'open_sansregular'; font-size:16px; color:#000; text-align:justify; line-height:26px; padding-top:20px; padding-left:20px}









@media (max-width: 1000px) {.logo{ display:none;}
							#top_bg{ height:auto; overflow:hidden; position:relative}
							#welcome_bg{ height:auto; overflow:hidden}
							#welcome{ float:none; margin:0 auto; margin-top:20px}
							#welcome h1{ padding-left:8px}
							#welcome p{ padding-left:8px; padding-right:8px}
							.readmore{ margin-left:8px}
							#top_rt{ float:none; margin:0 auto}
							#phn{ float:none; margin:0 auto}
							#phn p{ text-align:center; line-height:26px; padding-bottom:20px}
							#amenities{ float:left; margin:0 auto; height:auto; margin-top:20px; background-color: #008fca;
										background-image: none; margin-left:10px}
							#amenities h2{ padding-left:10px}			
							#amenities ul{ margin-left:10px}			
							#amenities ul{ padding-bottom:30px}
							#amenities ul li{ background-position:0.1em 0.8em; }
							#attractions_bg{ background-image:url(../images/attractions_bg1.png); background-size:cover; height:auto}
							h3{ padding-top:40px; font-size:26px}
							.att_icon{ margin-bottom:20px}
							.att{ float:none; margin:0 auto; margin-top:20px}
							#gallery{ display:none}
							.line2{ display:none}
							.line3{ display:none}
							#info_bg{ height:auto; margin-top:20px}
							#loc{ float:none; margin:0 auto; margin-top:25px}
							#loc_img{ float:none; margin:0 auto; text-align:center}
							#loc_txt{ float:none; margin:0 auto}
							#loc_txt p{ text-align:center}
							#phn_img{ float:none; margin:0 auto; text-align:center; margin-top:20px}
							#phn_txt{ float:none; margin:0 auto}
							#phn_txt p{ text-align:center; padding-top:10px}
							#email_img{ float:none; margin:0 auto; text-align:center; margin-top:20px}
							#email_txt{ float:none; margin:0 auto}
							#email_txt p{ text-align:center; padding-top:10px}
							#social{ float:none; margin:0 auto; margin-top:20px}
							#social h4{ text-align:center}
							#policy{ float:none; margin:0 auto; margin-top:20px}
							#policy p{ text-align:center}
							#weather{ float:none; margin:0 auto; margin-top:25px; margin-bottom:20px}
							#footer p{ padding-bottom:20px}
							#banner{ height:auto}
							#menu { background-color:#008fca;}
							#menu ul li{ padding:10px}
							#menu ul li a{ color:#FFFFFF !important}
							#menu ul li a:hover{ color:#FFFFFF !important}
							.att_img{ float:none; margin:0 auto; margin-top:20px}
							.att_txt{ float:none; margin:0 auto}
							.att_txt p{ text-align:center; padding-bottom:20px; padding-left:5px; padding-right:5px}
							#footer_bg{ height:auto}
							.testimonials p{ padding-left:8px; padding-right:8px}
							
							
							
 	
	}
	
	

	
	@media (min-width: 1000px) {
	#cal_txt1{display:none !important;}
	#weather1{ display:none !important}
	.cal{ display:none}
	#lantern{ display:none}
	#booknow{ display:none}
		#social_1{ display:none}
		#book{ display:none}			


	
	}
	
	
	
@media (min-width: 950px) {#logo1{ display: none; margin-top:0px !important; margin-bottom:30px}
							 #logo{ width:auto}
							 .google-maps {
        position: relative;
        padding-bottom: 76%; // This is the aspect ratio
        height: 0;
        overflow: hidden;    }
		#social_1{ width:100%; max-width:110px; height:auto; float:right}			
.fb_1{ width:100%; max-width:auto; height:28px; float:left; margin-top:10px}
#book{ width:100%; max-width:142px; height:33px; float:right; margin-top:26px}



	
	}
	
	
	
	
	
	
	.toggle, [id^=drop] {
 display: none;
}
nav {
  margin: 0;
  padding: 0;

    font-family: "Lucida Sans Unicode", "Lucida Grande" !important;
}
nav:after {
  content: "";
  display: table;
  clear: both;
}
nav ul {
  padding: 0;
  margin: 0;
  list-style: none;
  position: relative;
}
nav ul li {
  margin: 0px;
  display: inline-block;
  float: left;

}
nav a {
  display: block;
  padding: 10px 10px;
  font-size: 18px;
  text-decoration: none;
}
nav a:active{ color:#000 }
nav ul li ul li:hover { background: #a71b1b;}
nav a:hover {  color:#693F00 !important; }
nav ul ul {
  display: none;
  position: absolute;
  top: 34px;
  z-index: 9999999;
}
nav ul li:hover > ul { display: inherit; }
nav ul ul li {
  width: 170px;
  float: none;
  display: list-item;
  position: relative;
    border-bottom: 1px solid #000;
}
nav ul ul ul li {
  position: relative;
  top: -60px;
  left: 100px;
}

@media all and (max-width : 800px) {
nav { margin: 0; display:block; z-index:9999 }
.toggle + a,
 .menu { display: none; }
.toggle {
  display: block; z-index:9999;
  padding: 15px 15px; 
  color: #000 !important;
  font-size: 13px;
  text-decoration: none;
  border: none;
  text-transform: uppercase;
  
}
.toggle:hover {}
[id^=drop]:checked + ul { display: block; z-index:9999 }
nav ul li {
  display: block;
  width: 100%;
}
nav ul ul .toggle,
 nav ul ul a { padding: 7px 40px; }
nav ul ul ul a { padding: 0 80px; }
nav a:hover,
 nav ul ul ul a { background-color: #F19908; color:#fff !important; border-radius:0; text-decoration:
 none}

nav ul li ul li .toggle, nav ul ul a {  }
nav ul ul {float: none;position: static;color: #000;}
nav ul ul li:hover > ul, nav ul li:hover > ul { display: none; }
nav ul ul li {display: block;width: 100%;}
nav ul ul ul li { position: static;}
}
@media all and (max-width : 700px) {
nav ul li {display: block;width: 100%;  display:block; background:#086d96  right !important}
}

/* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */

/* Carousel base class */
.carousel {
  height: auto;

}
/* Since positioning the image, we need to help out the caption */
.carousel-caption {
  z-index: 10;
}

/* Declare heights because of positioning of img element */
.carousel .item {
  height:auto;
  ;
}
.carousel-inner > .item > img {
  position: relative;
  top: 0;
  left: 0;
  min-width: 100%;
  height: auto;
}

.google-maps {
        position: relative;
        padding-bottom: 70% !important; // This is the aspect ratio
        height: 0;
    }
    .google-maps iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100% !important;
        height: 100% !important;
        max-height: 800px
    }
	 







