@charset "UTF-8";
/* CSS Document */
body {font-family: 'Roboto', sans-serif;}

.intro {line-height:36px; font-size:18px;}
.colorme {padding-top:20px; padding-bottom:20px; margin-top:-30px;}
.grn {background-color:#23AA86;}
.grn h1, .grn h2 {color:#000000;}
.grn p, .grn li {color:#FFFFFF!important;}
h1, h2, h3 {color:#000000;}
p {color:#9A9A9A; font-size:16px;}
li {display:block; color:#9A9A9A;}
a {color:#000000!important;}
li:before {
    /*Using a Bootstrap glyphicon as the bullet point*/
    content: "\e080";
    font-family: 'Glyphicons Halflings';
    font-size: 9px;
    float: left;
    margin-top: 4px;
    margin-left: -17px;
    color: #CCCCCC;
}
nav li:before {content: "";}
.bg {padding: 5px; position: absolute; left: 0; top: 0; bottom: 0; right: 0; z-index: 2; margin: 125px auto; width:700px; height: 250px;}

.bg-rad-blk {/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+100&1+0,0+60 */

background: -moz-radial-gradient(center, ellipse cover,  rgba(0,0,0,1) 0%, rgba(0,0,0,0) 60%, rgba(0,0,0,0) 100%); /* FF3.6-15 */

background: -webkit-radial-gradient(center, ellipse cover,  rgba(0,0,0,1) 0%,rgba(0,0,0,0) 60%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */

background: radial-gradient(ellipse at center,  rgba(0,0,0,1) 0%,rgba(0,0,0,0) 60%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#00000000',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */


color:#FFFFFF; text-shadow: #000000 2px 2px 10px;}

.special {position:relative; margin-top: 0px; background:url(../images/bg-offer.gif) no-repeat; background-size:cover; width: 100%; padding: 15px; border-top-left-radius: 20px;}
.special p {color:#FFFFFF;background:#a03434; position: relative; box-sizing: border-box; line-height: 18px;}
.special span {text-transform:uppercase; font-weight: 900; font-size: 24px; line-height: 24px; letter-spacing: 1.75px}

@keyframes down-motion {
    0%   {margin-top:0px;}
    50%  {margin-top:25px;}
    100%   {margin-top:0px;}
}
.down-mo {margin-top: 0px;
    -webkit-animation-name: down-motion;
    -webkit-animation-duration: 4s;
    animation-name: down-motion;
    animation-duration: 4s;
    animation-iteration-count: infinite;
}
.mobile-header {color: white!important; padding: 10px; box-sizing: content-box; text-align: center; display:none; background-color: black;}
.mobile-header h3 { color: #fff!important;}

.bg-blk70 {background:rgba(0,0,0,0.4); color:#FFFFFF!important;}
.bg-red {background:rgba(225,0,0,0.8); color:#FFFFFF!important;}
.bg-green {background:#23AA86; color:#FFFFFF}
.bg-grey {background:#3a3a3a; color:#FFFFFF}
.bg-lt-grey {background:#eeeeee; color:#000000}
#bg-ten49 {background:rgba(26,26,26,0.8);}
#bg-ten30 {background:rgba(26,26,26,0.8);}
#bg-homestead p {color:#000000;}
.wh-text {color:#FFFFFF;}
#ten49 .btn {background:#F68E24; color: white; font-size:18px; border-radius:0px; min-width:180px; transition:background .5s, color .5s; -webkit-transition:background .5s, color .5s; }
#ten30 .btn {background:#29949e; color: white; font-size:18px; border-radius:0px; min-width:180px; transition:background .5s, color .5s; -webkit-transition:background .5s, color .5s;}
.button-wrap .btn {width:100%; margin:5px auto!important; }
#btn-hover a:hover {color:#bfa342!important;}
#bg-pattern {background-image: url(../images/radius-map.jpg)}
#ten49-color {background-color: #F68E24; color: #fff;}
button {-webkit-appearance:none; -moz-appearance:none;appearance: none;
}

#hero-text {font-size:70px; text-transform: uppercase; font-weight: 300!important;}
.special {position:relative; margin-top: -72px; background-color:#F70004; background-repeat: no-repeat; background-size:cover; width: 100%; padding: 10px; border-top-left-radius: 20px;}
.special p {color:#FFFFFF; position: relative; box-sizing: border-box; line-height: 18px;}
.special span {text-transform:uppercase; font-weight: 900; font-size: 24px; line-height: 24px; letter-spacing: 1.75px}


.btn {margin:60px auto 0px auto; display: block;}
.btn100 {width:100%; margin:60px auto 0px auto; display: block; padding:10px 0px; text-transform: uppercase; letter-spacing: 2px;}

.btn a {color:#FFFFFF;}
.btn:hover {background:#000000; color:#fff;}
.button-wrap {width:95%; max-width:300px; display:block; margin:20px auto;}
.fancy-thumb {width:33%;}
#btn-ten30 {background-color:#29949e; color: #fff;}
#ten30 .btn {background-color:#29949e; color: #fff;}
.nav {background:#ccc;}
.nav a {color:#FFFFFF;}
.nav a:hover {color:#000;}
.nav li:before {content:''}
.tab-pane {padding:20px; padding-bottom: 20px;border-left: 1px solid #ccc; border-bottom:1px solid #ccc; border-right:1px solid #ccc; background: #fff;}
#ten49-tab {background:#F68E24;}
#ten30-tab {background:#29949e;}
.locations {margin:15px 0px; padding: px; border: 1px solid #ccc; background:#eee; min-height:1050px!important;}
.locations img {padding-bottom:0px;}
.locations-dark {background-color: #1a1a1a; margin:15px 0px; border: 1px solid #ccc; min-height:1050px!important;}

.overlay-box { position: relative; overflow: hidden;}
.overlay {background:rgba(0,0,0,0.7); position: absolute; width:100%; height: 100%;
bottom:-70%; transition: 1s bottom; -webkit-transition: 1s bottom;}
.overlay p {text-align:center; padding-top:20px; font-size:16px!important; color: #FFFFFF; text-transform: uppercase;}
.overlay a button {margin:auto; position: absolute; left: 0; right: 0; bottom:0; top:0; width:180px; height:50px; border-radius: 5px; border:none; outline:none; font-size:16px; opacity:0.0; transition: 1s opacity; -webkit-transition: 1s opacity;}
.overlay-box:hover > .overlay {bottom: -0%;}
.overlay-box:hover > .overlay a button {opacity:1;}
.logo {width:100%; min-height:135px; margin: auto; display: block;}
.logo img {width:95%; max-width:250px; display: block; margin: auto; padding-top: 8px;position: center center;}
.hero-slider {height:700px; overflow: hidden;}
.slide {width:100%; background-size: cover; background-position: center center;}
.slide-wrap {text-align:center; font-size:14px; background: rgba(0,0,0,0.6); position: absolute; width: 100%; bottom:0; padding-top:10px;}
.slide-wrap p {color:#FFFFFF;}
#hero-slide1 {background-image:url(../images/bg-hikers.jpg); height:600px; overflow: hidden; background-position: 65%; background-repeat: no-repeat; background-size:cover;}

#hero-slide2 {background-image:url(../images/bg-mountain.jpg); height:600px; overflow: hidden;; }

.carousel-item {
	width: 100%!important;}
.carousel-inner img {width: 100%!important; object-fit: cover;}

#jumbo-dumbo {padding:0px; margin: 0px; background: none;}
#main-mess {position:absolute; z-index: 1; width:500px; height: 250px; text-align: center; margin:auto; top: 0; left: 0; bottom: 0; right: 0; padding-top: 0px;}
#main-mess h1 {font-family: "bree-serif",serif; font-size:75px; line-height:65px; font-weight:300; font-style: italic;}
#main-mess h2 {font-family: "bree-serif",serif; font-size:30px; line-height:65px; font-weight:300; ; color: #FFFFFF}
.map-wrapper {margin-top:30px;}

.map-ten30 {width:100%; height: 300px; background: url(../images/map-ten30.jpg) no-repeat; background-size:1100px; background-position: center center;}

.map-ten49 {width:100%; height: 300px; background: url(../images/map-ten49.jpg) no-repeat; background-size:1100px; background-position: center center;}

footer.row {text-align: center; padding: 30px 0px;}

/*======== Greystar Required Links CSS ==============*/
#disclaimer {text-align:center;}
#eho {display:inline-block; margin-right:5px;}
#ada {display:inline-block; margin-right:5px; width:25px;}
#greystar {display:block; margin:15px auto; width:125px;}
#privacy, #dmca {color:#fff; text-decoration: underline; font-size:12px;}
#clx {}
/*====================================================*/

/*======================================
========================================
===============Tablet==================
=======================================
========================================*/
@media screen and (max-width: 2950px) and (min-width: 1201px) {
	.tab-pane {height: 310px;}
	
}

@media only screen and (max-width:1600px) {
	#hero-text {font-size: 65px}
	
}
@media only screen and (max-width:900px) {
.overlay p {font-size:14px!important;}
	#hero-text {font-size: 60px}
}

@media only screen and (max-width: 768px) {
	.bg,.bg-rad-blk {width:100%!important;}
	#main-mess {width:95%!important; position: relative;}
	#main-mess h1 {font-size:60px!important; line-height:60px!important;}
	.slide-wrap p {font-size:14px; color: #FFFFFF; width:90%; margin: auto; display: block; padding: 10px 0px 15px 0px;}
		#ten49-mobile {margin-top: 90px;}
	
	#hero-text {font-size:48px; text-transform: uppercase; font-weight: 300!important;}
	.down-mo {display:none;}
}
@media only screen and (max-width: 480px) {
    #hero-slide1 {background-position: 85% 120px;}
	.btn {background: #eee; height: 35px; width: 180px; margin:60px auto 0px auto; display: block;}
	.special {position:relative; margin-top: 0px; background:url() no-repeat; background-size:cover; width: 100%; padding: 10px; border-top-left-radius: 20px;}
.special p {color:#FFFFFF;background:#a03434; position: relative; box-sizing: border-box; line-height: 18px; padding: 8px}
.special span {text-transform:uppercase; font-weight: 900; font-size: 24px; line-height: 24px; letter-spacing: 1.75px}
#ten49-mobile {margin-top: 90px;}
	#hero-text {font-size:24px; text-transform: uppercase; font-weight: 300!important;}


}

