/**
 *  @file
 *  slider.css
 *
 *  This file contains the CSS for the Revolution Slider plugin
 *
 */

/* ==========================================================================
   Basic slideshow styles
   ========================================================================== */

.container_12 .block-slideshow-block.grid_12{
    width: 100%;
    margin: -15px 0 15px 0;
    overflow: hidden;
}

#main-content .node .content .banner-container{
	margin: 0 auto;
	padding: 0px;
	position: relative;
	height: 403px;
	width: 960px;
	background-color: #fff;
}

	#main-content .node .content .banner{
		position: relative;
		width: 960px;
		height: 403px;
		background: black;
		overflow: hidden;
	}

		#main-content .node .content .banner ul{
			display: block;
			list-style: none;
			list-style-type: none;
			margin: 0px;
			padding: 0px;
			width: 100%;
			height: 100%;
		}
			#main-content .node .content .banner ul li{
				width: 100%;
				height: 100%;
			}

		#main-content .node .content .banner .footer-text{
			color: white;
			float: left;
			font-family: arial;
			width: 820px;
			font-size: 20px;
			-webkit-font-smoothing: antialiased;
			font-family:'News Gothic W01';
			text-align: left;
		}

			#main-content .node .content .banner .footer-arrow{
				display: inline;
				margin-top: -3px;
				margin-right: 5px;
			}

		#main-content .node .content .banner .splash{
			width: 820px;
			height: auto;
			text-align: left;
		}

		#main-content .node .content .banner .headline-one{
			width: 820px;
			height: 72px;
			-webkit-font-smoothing: antialiased;
		}

		#main-content .node .content .banner .headline-two{
			width: 820px;
			height: 72px;
			-webkit-font-smoothing: antialiased;
		}

		#main-content .node .content .banner .headline-three{
			width: 820px;
			height: 72px;
			-webkit-font-smoothing: antialiased;
		}

		#main-content .node .content .banner .headline-four{
			width: 820px;
			height: 72px;
			-webkit-font-smoothing: antialiased;
		}

		#main-content .node .content .banner .headline{
			font-size: 70px;
			font-family: arial;
			line-height: 80px;
			color: white;
			font-family:'NewsGothicW01-BoldObliq';
		}

		#main-content .node .content .banner .footer{
			width: 820px;
			text-align: right;
		}

		#main-content .node .content .banner .caption-hcenter{
			text-align: center;
		}

		#main-content .node .content .banner .caption-hleft{
			text-align: left;
		}

		#main-content .node .content .banner .caption-hright{
			text-align: right;
		}

   @media only screen and (min-width: 560px) and (max-width: 720px) {

		#main-content .node .content .banner-container, #main-content .node .content .banner{
			width:100%;
			height: auto;
		}

		#main-content .node .content .banner .splash{
			width: 80%;
		}

		#main-content .node .content .banner .headline-one{
			width: 90%;
		}

		#main-content .node .content .banner .headline-two{
			width: 90%;
		}

		#main-content .node .content .banner .headline-three{
			width: 90%;
		}

		#main-content .node .content .banner .headline-four{
			width: 90%;
		}

		#main-content .node .content .banner .footer{
			width: 90%;
		}

		#main-content .node .content .banner .splash-hcenter{
			text-align: center;
		}

		#main-content .node .content .banner .splash-hleft{
			text-align: left;
		}

		#main-content .node .content .banner .splash-hright{
			text-align: right;
		}

		.tp-leftarrow.default{
			background: none;
		}
		.tp-rightarrow.default{
			background: none;
		}

		#main-content .node .content .banner .footer-text{
			font-size: 85%;
			text-align: center;
			width: 90%;
		}

			#main-content .node .content .banner .footer-arrow{
				display: inline;
				margin-bottom: 0px;
				margin-right: 5px;
			}
   }

 @media only screen and (min-width: 340px) and (max-width: 559px) {

		#main-content .node .content .banner-container, #main-content .node .content .banner{
			width:100%;
			height: auto;
		}

		#main-content .node .content .banner .splash{
			width: 80%;
		}

		#main-content .node .content .banner .headline-one{
			width: 90%;
		}

		#main-content .node .content .banner .headline-two{
			width: 90%;
		}

		#main-content .node .content .banner .headline-three{
			width: 90%;
		}

		#main-content .node .content .banner .headline-four{
			width: 90%;
		}

		#main-content .node .content .banner .footer{
			width: 90%;
		}

		#main-content .node .content .banner .footer-text{
			width: 90%;
		}

		#main-content .node .content .banner .splash-hcenter{
			text-align: center;
		}

		#main-content .node .content .banner .splash-hleft{
			text-align: left;
		}

		#main-content .node .content .banner .splash-hright{
			text-align: right;
		}

		.tp-leftarrow.default{
			background: none;
		}
		.tp-rightarrow.default{
			background: none;
		}

		#main-content .node .content .banner .footer-text{
			font-size: 70%;
			text-align: center;
		}
			#main-content .node .content .banner .footer-arrow{
				display: inline;
				margin-bottom: 0px;
				margin-right: 5px;
			}
   }

	/* ==========================================================================
      Responsive layout changes
      ========================================================================== */


   @media only screen and (min-width: 0px) and (max-width: 339px) {

		#main-content .node .content .banner-container, #main-content .node .content .banner{
			width:100%;
			height: auto;
		}

		#main-content .node .content .banner .splash{
			width: 80%;
		}

		#main-content .node .content .banner .headline-last{
			width: 90%;
		}

		#main-content .node .content .banner .headline-first{
			width: 90%;
		}

		#main-content .node .content .banner .footer{
			width: 90%;
		}

		#main-content .node .content .banner .footer-text{
			width: 90%;
		}

		#main-content .node .content .banner .splash-hcenter{
			text-align: center;
		}

		#main-content .node .content .banner .splash-hleft{
			text-align: left;
		}

		#main-content .node .content .banner .splash-hright{
			text-align: right;
		}

		.tp-leftarrow.default{
			background: none;
		}

		.tp-rightarrow.default{
			background: none;
		}

		#main-content .node .content .banner .footer-text{
			font-size: 50%;
			text-align: center;
		}
			#main-content .node .content .banner .footer-arrow{
				display: inline;
				margin-bottom: 0px;
				margin-right: 5px;
			}
   }