@import "reset.css";
@import "skeleton.css";
@import "superfish.css";
@import url('ui.totop.css');
@import url('twitter.css');
@import url('../css2');
@import url('../css2-1');
article,aside,audio,canvas,command,datalist,details,embed,figcaption,figure,footer,header,hgroup,keygen,meter,nav,output,progress,section,source,video{display:block}mark,rp,rt,ruby,summary,time{display:inline}
/* Global properties ======================================================== */
html {width:100%}

body {
  font-family:Arial, Helvetica, sans-serif;
  font-size:12px;
  line-height:20px;
  color:#898989;
  min-width:960px;
  background:url(../images/body_bg.jpg) 50% 0 no-repeat #1b1b1b;
  -webkit-text-size-adjust: none;
}
.main{
  width: 1010px;
  margin:0 auto;
}

/*********************************fonts*************************************/
.reg {text-transform:uppercase}
.f_left {float:left}
.f_right {float:right}
.align_right {text-align:right}
.align_center {text-align:center}

.it{font-style:italic}
.let{letter-spacing:-1px}

/*********************************CLASSES**********************************/
.m_bottom_zero{ margin-bottom:0 !important;}
.m_left_zero{ margin-left:0 !important;}
.p_bottom_zero{ padding-bottom:0 !important;}
.p_left_zero{ padding-left:0 !important;}

.clear {clear:both;width:100%;line-height:0;font-size:0;}
.wrapper {width:100%;overflow:hidden}
.extra_wrapper{ overflow:hidden;}
.container{width:100%}
.extra_last, .last{ margin-bottom:0 !important; padding-bottom:0 !important;}
.extra_last{ border:none !important; background:none !important;}
.bg_none{ background:none !important;}

/*==================================== Links ======================================================== */
a {
  color:#898989;
  outline:none;
  text-decoration:none;
  cursor:pointer;
}
a:hover{
  color:#fff;
  text-decoration:none;
}

.button{
  display:inline-block;
  padding:6px 24px;
  margin: 27px 0 0;
  letter-spacing: -1px;
  border-bottom: 1px solid #3c3c3c;
  font-size: 20px;
  line-height: 24px;
  color:#ff3d23;
  background: url('../images/button.png') repeat-x;
  text-transform: uppercase;
 }
.button:hover{
  color:#fff;
  border-color: #fff;
}

/*********************************Displays*************************************/
.block{ display:block;}
.inline-block{ display:inline-block;}

/*********************************header*************************************/

header {padding: 18px 0 45px;}
header h1{
  width: 461px;
  margin-left: -1px;
  float: left;
}
/* Logo link reset */
header h1 a.logo {
  display: inline-block;
  background: none;
  text-indent: 0;
}

/* Logo image */
header h1 a.logo img {
  display: block;
  max-width: 50%;   /* never wider than its container */
  height: auto;      /* keeps proportions */
}

.address{
  float: right;
  font-size: 14px;
  line-height: 20px;
  color: #fff;
  padding: 62px 0 0 0;
  text-align: right;
}

/*********************************content*************************************/
#content {padding:0px 0px 0px 0px;}
.cont_pad{padding:11px 0 65px !important;}

/*===============================>> Paragraphs <<=============================*/

p {margin-bottom:20px}
.p2{ margin-bottom:20px;}
.p3{ margin-bottom:15px;}
.p4{ margin-bottom:24px;}
/*================================>> LISTS <<========================================*/
.list1{}
.list1 li{
  background:url(../images/marker1.png) 1px 6px no-repeat;
  padding-left:15px;
  margin-bottom: 10px;
}
.list1 a{
  text-transform: uppercase;
}

/*================================>> H <<========================================*/
h2,h3,h4{
  font-weight:normal;
}
h2{
  font-size: 36px;
  line-height: 44px;
  color:#fff;
  letter-spacing: -1px;
}

h2.ind{ margin-bottom:17px;}
h2.ind1{ margin-bottom:39px;}
h2.ind2{ margin-bottom:12px;}
h2.ind3{ margin-bottom:25px;}
h2.ind4{ margin-bottom:20px;}

h3{
  font-size: 30px;
  line-height: 36px;
  color:#ff3d23;
  letter-spacing: -2px;
}
h3 span{display: block;margin-top: -6px;}
h3.ind1{ margin-bottom:17px;}

h4{
  font-size: 20px;
  line-height: 24px;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: -1px;
  margin-bottom: 10px;
}
h4 a{color: #fff;}
h4 a:hover{color: #ff3d23;}
/*================================>> GOOGLE FONTS  <<========================================*/
.sf-menu>li>a, h2, h3, #carousel .title1, #carousel .title2, .join_us, .button, #twitter .tweet_time, h4, .rules>figure, .djs li a{font-family: 'Voltaire', sans-serif;}
.welcome_box .title{font-family: 'Courgette', cursive;}

/*================================>> hovers <<========================================*/
.sf-menu a em, .link1, #carousel .es-nav-prev, #carousel .es-nav-next, .join_us, .button, #twitter a, .list1 a, h4 a, .djs li a{-webkit-transition: all 0.5s ease;-moz-transition: all 0.5s ease;-o-transition: all 0.5s ease;transition: all 0.5s ease;}

/*********************************page_1*************************************/
.ext_list>li, .ext_box{ overflow:hidden;}
.ext_list>li>figure, .ext_box>figure{ float:left;}
.ext_list>li>div, .ext_box>div{overflow:hidden;}

.bg_content{background: url('../images/bg_content.png') repeat;padding-top: 27px;}

.link1{color: #898989;text-transform: uppercase;}
.link1:hover{color: #fff;}

.welcome_box{
  font-size: 14px;
}
.welcome_box .title{
  font-size: 65px;
  line-height: 78px;
  color: #fff;
  letter-spacing: -2px;
  margin-bottom: 8px;
}

.m_bot1{margin-bottom: 13px;}

.join_us{
  background: url('../images/join_us.png') repeat-x;
  border-bottom: 1px solid #393939;
  display: block;
  font-size: 36px;
  line-height: 44px;
  color: #ff3d23;
  letter-spacing: -2px;
  padding: 24px 0 32px 25px;
  margin: 7px 0 0;
}
.join_us>span{
  display: block;
  margin-right: 31px;
  padding: 5px 0 0;
  background: url('../images/join.png') right 0 no-repeat;
}
.join_us>span span{display: block;margin-top: -12px;}

.stripe1{height: 2px;margin: 48px 10px 43px;background: url('../images/stripe.png') repeat-x;}
.stripe2{height: 2px;margin: 50px 10px 43px;background: url('../images/stripe.png') repeat-x;}

.about{margin-bottom: 19px;}
.about>div{}
.about h3{line-height: 33px;}
.about>figure{
	margin: 5px 18px 0 0;
}

.gallery{}
.gallery li{overflow:hidden;margin-bottom: 10px;}
.gallery li a{display: block;margin-left: 10px;float: left;}
.gallery li a:first-child{margin-left: 0;}
/*********************************page_2*************************************/
.about1{}
.about1>div{}
.about1>figure{
	margin: 5px 19px 0 0;
}

.rules{}
.rules>div{}
.rules>figure{
  width: 59px;
  padding: 18px 0 20px;
  text-align: center;
  background: url('../images/num_bg.png') repeat-x;
	margin: 5px 21px 0 0;
  font-size: 20px;
  line-height: 24px;
  color: #fff;
}
/*********************************page_3*************************************/
.gallery_list{}
.gallery_list li{overflow: hidden;padding-bottom: 20px;clear: both;}
.gallery1{position: relative;}
/*********************************page_4*************************************/
.events_list>li{
  position: relative;
  clear: both;
  padding-bottom: 18px;
  margin-bottom: 1px;
}
.events_list>li:after{
  display: block;
  position: absolute;
  left:0;
  bottom:-7px;
  width: 100%;
  height: 25px;
  background: url('../images/event_list_glow.png') 50% 0 no-repeat;
  content: "";
}
.events_list>li.last:after{display: none;}
.events_list>li>div{background: url('../images/events_bg.jpg') repeat-x #1e1e1e;padding: 16px 20px 22px 19px;}
.events_list>li>figure{
	margin: 0 0 0 0;
}
.events_list h4{margin-bottom: 1px;}
.events_list .button{margin-top: 19px;}
.events_list time{
  display: block;
  text-transform: uppercase;
  color: #ff3d23;
  margin-bottom: 6px;
}

/*********************************page_5*************************************/
.categories{
  background: url('../images/stripe.png') 0 bottom repeat-x;
  padding-bottom: 35px;
  margin-bottom: 43px;
}
.tags li{margin-bottom: 10px;}
.tags a{
  display: inline-block;
  margin-left: 21px;
  text-transform: uppercase;
}
.tags li a:first-child{margin-left: 0;}
.tags a:hover{color: #ff3d23;}

/*================================>> Page 6 <<========================================*/
.djs{}
.djs li{margin-bottom: 4px;}
.djs li a{
  background: url('../images/dj_bg.png') repeat-x;
  display: block;
  padding: 6px 15px 6px 24px;
  font-size: 20px;
  line-height: 24px;
  text-transform: uppercase;
  letter-spacing: -1px;
  color: #fff;
}
.djs li a:hover{
  background: url('../images/dj_h.png') repeat-x;
  color: #ff3d23;
}

/* Contact form */
#contact-form {
  padding:0px 0 0 0;
  position: relative;
}
#contact-form .success
{
  display: block;
  position: absolute;
  width: 100%;
  top: 0;
  left:0;
  z-index: 99;
  background: #000;
  border: 1px solid #000;
  text-align: center;
  padding: 20px 0;
  color: #fff;
}
#contact-form textarea, #contact-form input {
  margin:0;
  font-size:12px;
  border:none;
  border-bottom: 1px solid #3f3f3f;
  color:#898989;
  padding:15px 18px 12px;
  outline:none;
  position:relative;
  font-family:Arial, Helvetica, sans-serif;
  background:#fff;
}
#contact-form input {
  width:264px;
  background: url('../images/test_field.png') repeat-x;
}
#contact-form textarea {
  overflow:auto;
  width:344px;
  height:335px;
  resize:none;
  float:left;
  margin: 0 0 0 0;
  background: url('../images/textarea.png') repeat-x;
}
  
#contact-form label {
  display:inline-block;
  position: relative;
  min-height:55px;
  overflow:hidden;
 }
#contact-form label.message {
  display:block;
  padding-bottom:0;
}
#contact-form .button {
  margin-left:8px;
}
#contact-form .error, #contact-form .empty, #contact-form .success {display:none;}
#contact-form .error, #contact-form .empty {
  text-align:left;
  color:red;
  font-size:11px;
  position: absolute;
  right: 10px;
  top: 5px;
}
#contact-form .buttons2 {
  overflow:hidden;
  text-align:right;
  position:relative;
  clear:both;
  padding-top:27px;
}
#contact-form .buttons2 a {
	cursor:pointer;
	margin-top:0;
	text-align:center;
}
#contact-form span{
  display:block;
  margin: 0px 0 0 5px;
 }

.map_wrapper{
  overflow:hidden;
  display:block;
  margin-bottom:14px;
}
#map_canvas {
   width:100%;
   height:484px;
}
.adress{}
.adress span{
  display:inline-block;
  width:69px;
}
.adress dt{ margin-bottom:14px;}

.demo{color: #ff3d23;}
.demo:hover{color: #fff;}

.address_box{}
.address_box>div{}
.address_box>figure{
	margin: 0 0 0 0;
  width: 240px;
}
/****************************footer************************/
footer {
  padding:42px 0;
  color: #ffffff;
  text-transform: uppercase;
}
footer a{color: #ffffff;}
footer a:hover{color: #ff3d23;}
footer .privacy{float: left;}
footer .social{
  float: right;
  padding-top: 6px;
  overflow:hidden;
}
footer .social a{
  display:block;
  float:left;
  width:30px;
  height:30px;
  overflow:hidden;
  margin-left:4px;
}
footer .social a:first-child{margin: 0 0 0 0;}
footer .social a img{margin-top: -31px;}
footer .social a:hover img{
  margin-top:0px;
}


/*==================================RESPONSIVE LAYOUTS===============================================*/
@media only screen and (max-width: 1024px) {
  .main{width: 1000px;}
}

@media only screen and (max-width: 995px) {
 body{min-width:768px;}
 .main{width: 768px;}
 .join_us > span{margin-right: 5px;}
 .about>figure{float: none;margin: 0 0 15px;}
 .about img, .gallery img{width: 100%;}
 .gallery>li>a{width: 80px;}
 .about1>div{overflow: visible;}
 .about1>figure{margin-bottom: 10px;}
 #carousel2 li{width: 187px !important;}
 #carousel2 li .inner{margin-right: 10px;}
 #carousel2 li img, .events_list img{width: 100%;}
 #carousel2{margin-right: 0;}
 .events_list>li>figure{float: none;}
 #contact-form textarea, #contact-form input{width: 262px;}
}

@media only screen and (max-width: 767px) {
 body{min-width:420px;}
 .main{width: 420px;}
 header h1, header .address{float:none;}
 header h1, header h1 a{width: 100%;background-size: contain;}
 header .address{text-align: center;padding-top: 10px;}
 .pad_box{padding: 0px 10px;}
 .gallery>li>a{width: 195px;}
 footer .privacy{margin-bottom: 15px;}
 footer .privacy, footer .social{float: none; }
 .stripe1{margin: 0 0 30px;}
 .about1>figure, .address_box>figure{float: none;margin: 0 0 15px;}
 .residents img, .about1 img, .gallery1 img{width: 100%;}
 #carousel2{margin-bottom: 30px;}
 #carousel2 li{width: 200px !important;}
 .gallery_list>li{padding-bottom: 30px;}
 #contact-form textarea, #contact-form input{width: 364px;}
 
}

@media only screen and (max-width: 479px) {
 body{min-width:300px;}
 .main{width: 300px;}
 .gallery>li>a{float: none;width: 100%;margin: 0 0 10px;}
 .gallery>li{margin-bottom: 0;}
 #carousel2 li{width: 280px !important;}
 h3 span{display: inline;}
 #contact-form textarea, #contact-form input{width: 244px;}
}

.announcement-banner {
  background: #ffcc00; /* bright yellow, adjust as needed */
  color: #111;
  text-align: center;
  font-size: 1.2rem;
  font-weight: bold;
  padding: 12px;
}