/********* General Disaster Styles */
#social{
	position:relative;
}

#social ul{
	list-style: none;
	top: 605px;
	left: 880px;
	position: absolute;
	z-index: 1;
	margin:0 !important;
	padding: 0;
}

#social li{
	margin: 4px 0px 0px 0px;
	padding: 0;
}

#social li.disaster-gplus{
	width: 65px;
}

.disaster{
	position:relative;
	height: 820px;
	top:20px;
}

.sky{
	position:absolute;
	top: 0px;
	height:400px;
}

.house{
	top: 80px;
	float:right;
	width: 879px;
	height: 394px;
	position: relative;
	background-repeat: no-repeat;
}

.ground{
	height:240px;
	position:relative;
	top: 472px;
}

.ground>div>div{
	position: relative;
	left: 203px;
	width: 475px;
	height: 152px;
}

.ground>div>a{
	line-height:12px;
	padding: 12px 15px;
	margin-top: 15px;
	position: absolute;
	width:170px;
	font-size:16px;
	color: #ffffff;
	border-radius:5px;
	transition: background-color .25s;-webkit-transition: background-color .25s;
}

.ground>div>a:hover{text-decoration: none;}

.ground>div>a>span{
	position: relative;
	display: inline-block;
	width: 19px;
	height: 18px;
	background-image: url(../images/yourlocalsecurity/disaster/dwnld-ico.png);
	top: 3px;
	left: 4px;
}

#meat{sans-serif;margin-top: -20px;}

.disaster, #contentArea, #sidebar{font-family: 'Signika Negative', 'Open Sans', sans-serif;}

#grass{top: 568px; position: absolute;display: block;width: 100%;height: 15px;background-image: url('../images/yourlocalsecurity/disaster/grass.png');}

.disaster h1{
	padding-top: 10px;
	position:relative;
	color: #FFFFFF;
	font-size: 48px;
	font-weight: normal;
}

.disaster .nav ul{
	position:relative;
	top: 10px;
	color: #FFFFFF;
	margin-top: 4px !important;
}

.blurb{
	z-index:1;
	margin-top: 20px;
	position: absolute;
	width: 290px;
	height: 75px;
	padding: 15px 20px 20px 25px;
	background-color: #FFFFFF;
	transition: height .35s;-webkit-transition: height .35s;
}
.blurb div{overflow: hidden;text-overflow: ellipsis;width: 290px;height: 70px;transition: height .35s;-webkit-transition: height .35s;}


.regions{height:230px;width:400px;position:absolute;margin-top: 10px;margin-left: 550px;}
.regions h2{padding: 12px;font-size: 12pt;text-transform: uppercase;text-align: center;font-weight: normal;color: #FFFFFF;}
.regions span{display:block;height:160px;width:260px;margin:10px auto;background-image:url(../images/yourlocalsecurity/disaster/map.png);background-repeat:no-repeat;}

.map-earthquake {background-position: -5px -5px;}
.map-flood {background-position: -5px -175px;}
.map-hurricane {background-position: -275px -5px;}
.map-tornado {background-position: -275px -175px;}
.map-wildfire {background-position: -5px -345px;}



.expand-blurb-btn{padding: 5px 10px;border-radius:5px;color:#FFFFFF;position:absolute;bottom:-14px;cursor:pointer;display: inline-block;
width: 80px;}

.disaster .nav li{padding: 5px 10px; border-radius: 5px;transition: background-color .2s;-webkit-transition: background-color .2s;}
.disaster .nav li:hover {cursor:pointer;}


span.tip-ico{
	border: 4px solid #ffffff;
	display: block;
	height: 24px;
	width: 24px;
	border-radius: 50%;
	background-color: #c93314;
	font-size: 36px;
	line-height: 30px;
	font-weight: bold;
	color: #ffffff;
	padding: 4px 4px 9px 9px;
	transition: transform .1s;-webkit-transition: -webkit-transform .1s;
	-webkit-animation-duration:1s;-moz-animation-duration:1s;-o-animation-duration:1s;animation-duration:1s;
}
span.tip-ico:hover{cursor:pointer;-webkit-transform: scale(1.1,1.1);transform: scale(1.1,1.1);-ms-transform: scale(1.1,1.1);}
.tip-details{z-index:2;position: relative;margin-top: -130px;margin-left: -120px;width: 240px;color: #485155;text-align: center;background-color: #FFFFFF;padding: 20px;border:1px solid #ddd; -webkit-animation-duration:1s;-moz-animation-duration:1s;-o-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;-moz-animation-fill-mode:both;-o-animation-fill-mode:both;animation-fill-mode:both;}
.tip-details h3{padding-bottom: 5px;font-size: 24px;border-bottom: 1px solid #c2c2c2;margin: 20px 0 15px 0;}
.tip-details p{font-size: 15px;line-height: 22px;}
.tip-details a{font-family: verdana;position: absolute;top: 10px;right: 15px;color: #485155;opacity: .3;font-weight: bold;}
.tip-details a:hover{text-decoration: none;opacity:.7;cursor:pointer;}
.tip{display: block;height:32px;width:32px;position:absolute;}


/********* Tornado Styles */
.tornado {background-color: #1abc9c;height: 820px;position:absolute; width: 100%;}
.tornado .sky{background-image: url(../images/yourlocalsecurity/disaster/bg-tornado.png);}
.tornado .house{background-image: url(../images/yourlocalsecurity/disaster/house-tornado.png);margin-right: -2px;}
.tornado .ground{border-top: #009979 5px solid;background-color: #02a785;}
.tornado .ground>div>div{background-image: url(../images/yourlocalsecurity/disaster/basement-tornado.png);}
.tornado .ground>div>a:hover{background-color:#02997a;}
.tornado .blurb.expanded{height:420px;}
.tornado .blurb div.expanded{height:420px;}
.tornado .regions{background-color:#05ad8e;}
.tornado .regions h2{background-color: #059d82;}
.tornado .expand-blurb-btn{background-color: #0c7b65;}
.tornado .nav li:hover {background-color: #067e67; cursor:pointer;}
.tornado .nav li.active {background-color: #009074;}


.tornado .tip.tip1{left: 340px; top: 290px;}
.tornado .tip.tip2{left: 270px; top: 150px;}
.tornado .tip.tip3{left: 520px; top: 275px;}
.tornado .tip.tip4{left: 800px; top: 290px;}
.tornado .tip.tip5{left: 20px; top: 65px;}
.tornado .tip.tip6{left: 140px; top: 30px;}
.tornado .tip.tip7{left: 330px; top: 25px;}
.tornado .tip.tip8{left: 440px; top: 50px;}


/********* Hurricane Styles */
.hurricane {background-color: #8452b8; display:none;height: 820px;position:absolute; width: 100%;}
.hurricane .sky{background-image: url(../images/yourlocalsecurity/disaster/bg-hurricane.png);}
.hurricane .house{background-image: url(../images/yourlocalsecurity/disaster/house-hurricane.png);width: 980px;margin-right:-20px;}
.hurricane .ground{border-top: #613b8b 5px solid;background-color: #6b4298;}
.hurricane .ground>div>div{background-image: url(../images/yourlocalsecurity/disaster/basement-hurricane.png);}
.hurricane .ground>div>a:hover{background-color:#5c3983;}
.hurricane .blurb.expanded{height:460px;}
.hurricane .blurb div.expanded{height:460px;}
.hurricane .regions{background-color:#70449e;}
.hurricane .regions h2{background-color: #613b8b;}
.hurricane .expand-blurb-btn{background-color: #5d3881;}
.hurricane .nav li:hover {background-color: #4e2e71; cursor:pointer;}
.hurricane .nav li.active {background-color: #5d3881;}


.hurricane .tip.tip1{left: 270px; top: 150px;}
.hurricane .tip.tip2{left: 422px; top: 15px;}
.hurricane .tip.tip3{left: 60px;  top: 325px;}
.hurricane .tip.tip4{left: 900px; top: 220px;}
.hurricane .tip.tip5{left: 790px; top: 320px;}
.hurricane .tip.tip6{left: 560px; top: 300px;}
.hurricane .tip.tip7{left: 500px; top: 200px;}
.hurricane .tip.tip8{left: 325px; top: 295px;}


/********* Earthquake Styles */
.earthquake {background-color: #417cc5; display:none;height: 820px;position:absolute; width: 100%;}
.earthquake .sky{background-image: url(../images/yourlocalsecurity/disaster/bg-earthquake.png);}
.earthquake .house{background-image: url(../images/yourlocalsecurity/disaster/house-earthquake.png);width:877px;}
.earthquake .ground{border-top: #31609e 5px solid;background-color: #3768aa;}
.earthquake .ground>div>div{background-image: url(../images/yourlocalsecurity/disaster/basement-earthquake.png);height: 204px;}
.earthquake .ground>div>a:hover{background-color:#305b95;}
.earthquake .blurb.expanded{height:480px;}
.earthquake .blurb div.expanded{height:480px;}
.earthquake .regions{background-color:#396cb0;}
.earthquake .regions h2{background-color: #31609e;}
.earthquake .expand-blurb-btn{background-color: #2d62a2;}
.earthquake .nav li:hover {background-color: #285088; cursor:pointer;}
.earthquake .nav li.active {background-color: #2d62a2;}


.earthquake .tip.tip1{left: 215px; top: 340px;}
.earthquake .tip.tip2{left: 330px; top: 265px;}
.earthquake .tip.tip3{left: 180px; top: 240px;}
.earthquake .tip.tip4{left: 480px; top: 270px;}
.earthquake .tip.tip5{left: 710px; top: 220px;}
.earthquake .tip.tip6{left: 150px; top: 5px;}
.earthquake .tip.tip7{left: 180px; top: 90px;}
.earthquake .tip.tip8{left: 15px; top: 50px;}

/********* Flood Styles */
.flood {background-color: #23a2d6; display:none;height: 820px;position:absolute; width: 100%;}
.flood .sky{background-image: url(../images/yourlocalsecurity/disaster/bg-flood.png);}
.flood .house{background-image: url(../images/yourlocalsecurity/disaster/house-flood.png);width:877px;}
.flood .ground{border-top: #197cad 5px solid;background-color: #1b87b8;}
.flood .ground>div>div{background-image: url(../images/yourlocalsecurity/disaster/basement-flood.png);height:225px;width:955px;margin:-5px 0 0 -207px}
.flood .ground>div>a:hover{background-color:#197ba8;}
.flood .ground>div>a{z-index: 2;}
.flood .blurb.expanded{height:550px;z-index:3;}
.flood .blurb div.expanded{height:550px;z-index:3;}
.flood .regions{background-color:#1c8dc0;}
.flood .regions h2{background-color: #197cad;}
.flood .expand-blurb-btn{background-color: #0d7cb0;}
.flood .nav li:hover {background-color: #116791; cursor:pointer;}
.flood .nav li.active {background-color: #0d7cb0;}


.flood .tip.tip1{left: 260px; top: 300px;}
.flood .tip.tip2{left: 720px; top: 290px;}
.flood .tip.tip3{left: 385px; top: 200px;}
.flood .tip.tip4{left: 470px; top: 280px;}
.flood .tip.tip5{left: 630px; top: 100px;}
.flood .tip.tip6{left: 207px; top: 25px;}
.flood .tip.tip7{left: 250px; top: 100px;}
.flood .tip.tip8{left: 335px; top: 120px;}
.flood .tip.tip9{left: 600px; top: 10px;}

/********* Wildfire Styles */
.wildfire {background-color: #8e8281; display:none;height: 820px;position:absolute; width: 100%;}
.wildfire .sky{background-image: url(../images/yourlocalsecurity/disaster/bg-wildfire.png);}
.wildfire .house{background-image: url(../images/yourlocalsecurity/disaster/house-wildfire.png);width:895px;}
.wildfire .ground{border-top: #5b5453 5px solid;background-color: #706666;}
.wildfire .ground>div>div{background-image: url(../images/yourlocalsecurity/disaster/basement-wildfire.png);}
.wildfire .ground>div>a:hover{background-color:#5e5656;}
.wildfire .blurb.expanded{height:450px;}
.wildfire .blurb div.expanded{height:450px;}
.wildfire .regions{background-color:#766c6c;}
.wildfire .regions h2{background-color: #625b5b;}
.wildfire .expand-blurb-btn{background-color: #615b58;}
.wildfire .nav li:hover {background-color: #514a4a; cursor:pointer;}
.wildfire .nav li.active {background-color: #615b58;}


.wildfire .tip.tip1{left: 170px; top: 250px;}
.wildfire .tip.tip2{left: 750px; top: 290px;}
.wildfire .tip.tip3{left: 50px; top: 345px;}
.wildfire .tip.tip4{left: 815px; top: 310px;}
.wildfire .tip.tip5{left: 30px;  top: 230px;}
.wildfire .tip.tip6{left: 600px; top: 325px;}
.wildfire .tip.tip7{left: 150px; top: 330px;}
.wildfire .tip.tip8{left: 435px; top: 150px;}
.wildfire .tip.tip9{left: 310px; top: 290px;}


/********* Content Article/Sidebar Styles */
#contentArea{margin: 80px 0;}
#contentArea h2{font-size:42px;line-height: 48px;font-weight:normal;}
#contentArea h3{color:#346995; font-size:24px;margin:25px 0 10px 0;font-weight:normal;}
#contentArea ul{font-size: 14px; font-weight:lighter;}
#contentArea h4{font-size: 16px; font-weight: normal; margin: 40px 0 0 0;}
#contentArea img{height:150px;position:relative;top: 6px;}
#contentArea img.l{float:left;margin-right:15px;}
#contentArea img.r{float:right;margin-left:15px;}


#sidebar{margin-top: 80px;}
#sidebar h2{font-size:30px;font-weight:normal;margin: 80px 0 -40px;}
#sidebar h3{font-size:24px;margin:50px 0 5px 0;font-weight:normal;padding-bottom: 5px;border-bottom: 1px solid #e1e1e1;}

#sidebar h3.tnado{color:#00b796;}
#sidebar h3.hcane{color:#8d44b2;}
#sidebar h3.equake{color:#3768aa;}
#sidebar h3.fl{color:#23a2d6;}
#sidebar h3.wfire{color:#e75c0c;}

#sidebar a{color:rgb(65, 65, 66);display:block;padding:4px 0;font-weight:lighter;}
#sidebar a:hover{color:#346995;}

#sidebar div{margin-bottom: 50px;}
#sidebar div h2{margin: 0px;}
#sidebar span{display: inline-block;height:16px;width: 16px;background-image: url(../images/yourlocalsecurity/disaster/dwnld-ico-grey.png);position:relative; top:2px;margin-right:5px;}





/********* Safety Tip Animations */
@-webkit-keyframes bounceIn {
	0% {
		opacity: 0;
		-webkit-transform: scale(.3);
	}
	50% {
		opacity: 0;
		-webkit-transform: scale(.3);
	}
	
	75% {
		opacity: 1;
		-webkit-transform: scale(1.05);
	}
	
	100% {
		-webkit-transform: scale(1);
	}
}

@-moz-keyframes bounceIn {
	0% {
		opacity: 0;
		-moz-transform: scale(.3);
	}
	50% {
		opacity: 0;
		-moz-transform: scale(.3);
	}
	
	75% {
		opacity: 1;
		-moz-transform: scale(1.05);
	}
	
	100% {
		-moz-transform: scale(1);
	}
}

@-o-keyframes bounceIn {
	0% {
		opacity: 0;
		-o-transform: scale(.3);
	}
	50% {
		opacity: 0;
		-o-transform: scale(.3);
	}
	
	75% {
		opacity: 1;
		-o-transform: scale(1.05);
	}
	
	100% {
		-o-transform: scale(1);
	}
}

@keyframes bounceIn {
	0% {
		opacity: 0;
		transform: scale(.3);
	}
	50% {
		opacity: 0;
		transform: scale(.3);
	}
	
	75% {
		opacity: 1;
		transform: scale(1.05);
	}
	
	100% {
		transform: scale(1);
	}
}

.bounceIn {
	-webkit-animation-name: bounceIn;
	-moz-animation-name: bounceIn;
	-o-animation-name: bounceIn;
	animation-name: bounceIn;
}

@-webkit-keyframes bounceOut {
	0% {
		-webkit-transform: scale(1);
	}
	
	25% {
		opacity: 1;
		-webkit-transform: scale(1.1);
	}
	
	50% {
		opacity: 0;
		-webkit-transform: scale(.3);
		top:0px;
	}
	100% {
		opacity: 0;
		-webkit-transform: scale(.3);
		top:1000px;
	}		
}

@-moz-keyframes bounceOut {
	0% {
		-moz-transform: scale(1);
		top:0px;
	}
	
	25% {
		opacity: 1;
		-moz-transform: scale(1.1);
		top:0px;
	}
	
	50% {
		opacity: 0;
		-moz-transform: scale(.3);
		top:0px;
	}
	100% {
		opacity: 0;
		-moz-transform: scale(.3);
		top:1000px;
	}
}

@-o-keyframes bounceOut {
	0% {
		-o-transform: scale(1);
	}
	
	25% {
		opacity: 1;
		-o-transform: scale(1.1);
	}
	
	50% {
		opacity: 0;
		-o-transform: scale(.3);
		top:0px;
	}
	100% {
		opacity: 0;
		-o-transform: scale(.3);
		top:1000px;
	}	
}

@keyframes bounceOut {
	0% {
		transform: scale(1);
	}
	
	25% {
		opacity: 1;
		transform: scale(1.1);
	}
	
	50% {
		opacity: 0;
		transform: scale(.3);
		top:0px;
	}
	100% {
		opacity: 0;
		transform: scale(.3);
		top:1000px;
	}
}

.bounceOut {
	-webkit-animation-name: bounceOut;
	-moz-animation-name: bounceOut;
	-o-animation-name: bounceOut;
	animation-name: bounceOut;
}