@charset "utf-8";
/* CSS Document */
/* drtl.css */

 Responsive Image  
img.responsive {
	width:100%;
	height: auto;
}
/*Make Image Scalable - Assign this class to any image to make it scale with the browser window size*/
img.scalable {
	height: auto !important;
	width: auto !important;
	max-width: 100%;
}
/* ===================== */
/*	Special Footer Link  */
/* ===================== */
a.SpFooter:link {
	color: #CCC;
	text-decoration: none;
}
a.SpFooter:hover {
	color:#FFF;	
	text-decoration: none;	
}
a.SpFooter:visited {
	color:#CCC;
	text-decoration: none;		
}
a.SpFooter:active {
	color:#CCC;	
	text-decoration: none;	
}
/*================================*/
/* Phone Layout: 480px and below. */
/*================================*/
@media only screen and (min-width: 320px) and (max-width: 767px) and (orientation: Landscape) {  /*(max-width: 767px) */
/*@media only screen and (min-width: 400px) and (max-width: 600px) { */	
 Responsive Image  
img.responsive {
	width:100%;
	height: auto;
}
/*Make Image Scalable - Assign this class to any image to make it scale with the browser window size*/
img.scalable {
	height: auto !important;
	width: auto !important;
	max-width: 100%;
}
img.scalableSmall {
	height: auto !important;
	width: auto !important;
	max-width: 90%;
}
.header {
	position: relative;
	width: 100%;
}
h5 { /* Right Top Text */
	top: -10%;/* -40% */
	right: 2%;
	left: 82%;/* 80.5% */
	position: absolute;
}
h6 { /* Right Mid Text */
	top: 9%;/* -22% */
	right: 2%;
	left: 82%;/* 80.5% */
	position:absolute;
}
h7 { /* CastleRoofing Logo */
	top: 50%;/* 28% 45% */
	right: 2%;
	left: 82%;/* 80.5% */	
	position:absolute;
}
h8 { /* Carson Ticket */
	top: 18%;
	right: 0;
	left: 58%;
	position:absolute;
	width: 60px;
}
.cursor: pointer; cursor: hand;	
{
}
.columns-wrapper-products{
	width: 80%;
	height: auto;	
	background-color: #FFF;
}
.columns-wrapper_upcoming_events {
	overflow: hidden;
	background-color: #FFF;
	height: 1800px;/* 400px */
	width: 100%;
}
.column_1_of_3_upcoming {
	width: 100%;/* 33% */
	height: 900px;/* 500px */	
	float: left;
	padding-top: 0px;
	font-size:12px;
}
.column_2_of_3_upcoming {
	width: 100%;/* 33% */
	height: 400px;/* 500px */	
	float: left;
	font-size:12px;	
}
.column_3_of_3_upcoming {
	width: 100%;/* 33% */
	height:  350px;/* 500px */
	float: left;
	padding-top: 0px;
	font-size:12px;	
}
.columns-wrapper-products{
	width: 80%;
	height: auto;
	background-color: #FFF;
}
.TitleArea {
	width: 100%;
	height: 35px;
	background-color: #FFF;
}
.TitleArea1 {
	width: 33%;
	float: left;
	height: 50px;
	background-color: #FFF;
}
.TitleArea2 {
	width: 33%;
	float: left;
	height: 45px;
	font-size: 1.2em;
	padding-top: 5px;
	background-color: #FFF;
}
.TitleArea3 {
	width: 33%;
	float: left;
	height: 50px;
	background-color: #FFF;
}
/* =========== */
/*	  Footer   */
/* =========== */
.footerAll {
	border-radius: 0px 0px 6px 6px;
	background-color: #000;
	width:100%;/* 93.6% */
	height:70px;
}
.footer1 {
	width: 30%;
	height: 50px;
	float: left;
	margin-top:15px;
	font-size:7px;
	text-align: left;
	margin-left:10px;
	color:#CCC;
}
.footer2 {
	width: 33.33%;
	height: 65px;
	float: left;
}
.footer3 {
	width: 30%;
	height: 50px;
	float: left;
	text-align:right;
	margin-top:15px;
	font-size: 7px;		
}
}
/*================================*/
/* Phone Layout: 480px and below. */
/*================================*/
@media only screen and (min-width: 320px) and (max-width: 767px) and (orientation: Portrait) {  /*(max-width: 767px) */
/*@media only screen and (min-width: 400px) and (max-width: 600px) { */	
 Responsive Image  
img.responsive {
	width:100%;
	height: auto;
}
/*Make Image Scalable - Assign this class to any image to make it scale with the browser window size*/
img.scalable {
	height: auto !important;
	width: auto !important;
	max-width: 100%;
}
img.scalableSmall {
	height: auto !important;
	width: auto !important;
	max-width: 100%;
}
.header {
	position: relative;
	width: 100%;
}
h5 { /* Right Top Text */
	top: -25%;/* -40% */
	right: 2%;
	left: 80.5%;/* 80.5% */	
	position: absolute;
}
h6 { /* Right Mid Text */
	top: -10%;/* -22% */
	right: 2%;
	left: 80.5%;/* 80.5% */	
	position:absolute;
}
h7 { /* CastleRoofing Logo */
	top: 45%;/* 28% */
	right: 2%;
	left: 80.5%;/* 80.5% */	
	position:absolute;
}
h8 { /* Carson Ticket */
	top: 18%;
	right: 0;
	left: 58%;
	position:absolute;
	width: 60px;
}
.cursor: pointer; cursor: hand;	
{
}
.columns-wrapper-products{
	width: 80%;
	height: auto;
	background-color: #FFF;	
}
.columns-wrapper_upcoming_events {
	overflow: hidden;
	background-color: #FFF;
	height: 1850px;/* 400px */
	width: 100%;
}
.column_1_of_3_upcoming {
	width: 100%;/* 33% */
	height: 900px;/* 500px */
	float: left;
	padding-top: 0px;
	font-size: 12px;
}
.column_2_of_3_upcoming {
	width: 100%;/* 33% */
	height: 450px;/* 500px */
	float: left;
	font-size: 12px;
}
.column_3_of_3_upcoming {
	width: 100%;/* 33% */
	height: 350px;/* 500px */
	float: left;
	padding-top: 0px;
	font-size: 12px;
}
.TitleArea {
	width: 100%;
	height: 35px;
}
.TitleArea1 {
	width: 33%;
	float: left;
	height: 50px;	
}
.TitleArea2 {
	width: 33%;
	float: left;
	height: 45px;
	font-size: 1.2em;	
	padding-top:5px;			
}
.TitleArea3 {
	width: 33%;
	float: left;
	height: 50px;					
}
/* =========== */
/*	  Footer   */
/* =========== */
.footerAll {
	border-radius: 0px 0px 6px 6px;
	background-color: #000;
	width:100%;/* 93.6% */
	height:70px;
}
.footer1 {
	width: 30%;
	height: 50px;
	float: left;
	margin-top:15px;
	font-size:7px;
	text-align: left;
	margin-left:10px;
	color:#CCC;
}
.footer2 {
	width: 33.33%;
	height: 65px;
	float: left;
}
.footer3 {
	width: 30%;
	height: 50px;
	float: left;
	text-align:right;
	margin-top:15px;
	font-size: 7px;		
}
}
/*=====================================================================*/
/* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */
/*=====================================================================*/
/* @media only screen and (min-width: 481px) { */
@media only screen and (min-width: 768px) and (max-width: 1024px) and (Orientation: Landscape) {	
.header {
	position: relative;
	width: 100%;
}
h5 { /* Right Top Text */
	top: -4%;
	right: 3%;
	left: 83%;/* 80.5% */	
	position: absolute;
}
h6 { /* Right Mid Text */
	top: 14%;/* 7% */
	right: 3%;
	left: 83%;/* 80.5% */	
	position:absolute;
}
h7 { /* CastleRoofing Logo */
	top: 46%;
	right: 3%;/* 3% */
	left: 83%;/* 80.5% */	
	position:absolute;
}
h8 { /* Carson Tickets */
	top: 28%;
	right: 0;
	left: 60%;
	prosition: absolute;
	width: 107px;	
}
{
.cursor: pointer; cursor: hand;
}
.columns-wrapper-products{
	width: 80%;
	height: auto;
	background-color: #FFF;	
}
.columns-wrapper_upcoming_events{
	width: 100%;
	height: auto;	
}
.TitleArea {
	width: 100%;
	height: 35px;
}
.TitleArea1 {
	width: 33%;
	float: left;
	height: 55px;	
}
.TitleArea2 {
	width: 33%;
	float: left;
	height: 35px;
	font-size: 1.2em;	
	padding-top:20px;			
}
.TitleArea3 {
	width: 33%;
	float: left;
	height: 55px;					
}

/* =========== */
/*	  Footer   */
/* =========== */
.footerAll {
	border-radius: 0px 0px 6px 6px;
	background-color: #000;
	width:100%;
	height:70px;
}
.footer1 {
	width: 30%;
	height: 50px;
	float: left;
	margin-top:15px;	
}
.footer2 {
	width: 33.33%;
	height: 65px;
	float: left;
}
.footer3 {
	width: 30%;
	height: 50px;
	float: left;
	text-align:right;
	margin-top:15px;
}
}
/*=====================================================================*/
/* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */
/*=====================================================================*/
/* @media only screen and (min-width: 481px) { */
@media only screen and (min-width: 768px) and (max-width: 1024px) and (orientation: Portrait) {	
.header {
	position: relative;
	width: 100%;
}
h5 { /* Right Top Text */
	top: -8%;
	right: 3%;
	left: 78%;/* 80.5% */
	position: absolute;
}
h6 { /* Right Mid Text */
	top: 9.8%;/* 7% */
	right: 3%;
	left: 78%;/* 80.5% */
	position:absolute;
}
h7 { /* CastleRoofing Logo */
	top: 46%;
	right: 3%;
	left: 78%;/* 80.5% */	
	position:absolute;
}
h8 { /* Carson Tickets */
	top: 28%;
	right: 0;
	left: 60%;
	prosition: absolute;
	width: 107px;	
}
.cursor: pointer; cursor: hand;
{
}
.columns-wrapper-products{
	width: 80%;
	height: auto;	
	background-color: #FFF;
}
.columns-wrapper_upcoming_events{
	width: 80%;
	height: auto;	
}
.TitleArea {
	width: 100%;
	height: 35px;
}
.TitleArea1 {
	width: 33%;
	float: left;
	height: 55px;	
}
.TitleArea2 {
	width: 33%;
	float: left;
	height: 35px;
	font-size: 1.2em;	
	padding-top:20px;			
}
.TitleArea3 {
	width: 33%;
	float: left;
	height: 55px;					
}

/* =========== */
/*	  Footer   */
/* =========== */
.footerAll {
	border-radius: 0px 0px 6px 6px;
	background-color: #000;
	width:100%;
	height:70px;
}
.footer1 {
	width: 30%;
	height: 50px;
	float: left;
	margin-top:15px;	
}
.footer2 {
	width: 33.33%;
	height: 65px;
	float: left;
}
.footer3 {
	width: 30%;
	height: 50px;
	float: left;
	text-align:right;
	margin-top:15px;
}
}
/*===================================================================================================*/
/* Desktop Layout: 769px to a max of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout. */
/*===================================================================================================*/
/* @media only screen and (min-width: 769px) { */
@media only screen and (min-width: 1025px)and (max-width: 1920px)  { 
.header {
	position: relative;
	width: 100%;
}
h5 { /* Right Top Text */
	top: 2%;/* 9% */
	right: 0;
	left: 80.5%;
	position: absolute;
}
h6 { /* Right Mid Text */
	top: 18%;/* 23% */
	right: 0;
	left: 80.5%;
	position:absolute;
}
h7 { /* CastleRoofing Logo */
	top: 47%;/* 52% */
	right: 0;
	left: 80.5%;	
	position:absolute;
}
h8 { /* Carson Tickets */
	top: 37%;
	right: 0;
	left: 65%;
	prosition: absolute;
	width: 132px;	
}
.cursor: pointer; cursor: hand;
{
}
.columns-wrapper_upcoming_events {
	overflow: hidden;
	background-color: #FFF;
	height: 1000px;/* 400px */
	width: 100%;
}
.column_1_of_3_upcoming {
	width: 33%;
	height: 1000px;/* 400px */
	border-right-width: thin;
	border-right-style: solid;
	border-right-color: #000;
	float: left;
	padding-top: 0px;
}
.column_2_of_3_upcoming {
	width: 33%;
	height: 1000px;/* 400px */
	border-right-width: thin;
	border-right-style: solid;
	border-right-color: #000;
	float: left;
}
.column_3_of_3_upcoming {
	width: 33%;
	height: 1000px;/* 400px */
	float: left;
	padding-top: 0px;
}
.calendar {
	width: 90%;
	height: 90%;	
}
.TitleArea {
	width: 100%;
	height: 40px;
}
.TitleArea1 {
	width: 33%;
	border-right-width: thin;
	border-right-style: solid;
	border-right-color: #000;
	float: left;
	height: 40px;	
}
.TitleArea2 {
	width: 33%;
	border-right-width: thin;
	border-right-style: solid;
	border-right-color: #000;
	float: left;
	height: 30px;
	font-size: 1.35em;	
	padding-top:10px;		
}
.TitleArea3 {
	width: 33%;
	float: left;
	height: 40px;				
}
/* =========== */
/*	  Footer   */
/* =========== */
.footerAll {
	border-radius: 0px 0px 6px 6px;
	background-color: #000;
	width:100%;/* 93.6% */
	height:80px;/* 50px */
}
.footer1 {
	width: 30%;
	height: 50px;
	float: left;
	margin-top:18px;
	color:#CCC;	
	margin-left: 30px;
	font-size:12px;	
}
.footer2 {
	width: 30%;
	height: 65px;
	padding-top: 10px;
	float: left;
	margin-left: 40px;	
}
.footer3 {
	width: 30%;
	height: 50px;
	float: left;
	text-align:right;
	margin-top:15px;
}
}