* {box-sizing: border-box;}
/*------------------- GENERAL CODE -----------------------*/

/* NOTE
html is set to 62.5% so that all the REM measurements
are based on 10px sizing. So basically 1.5rem = 15px :) */


/* mobile layout (overwrite for 645px and more) */

@media (max-width: 645px) {


html {
  font-size: 62.5%; }
body {
	font-size: 1.5em; /* currently ems cause chrome bug misinterpreting rems on body element */
	font-weight: 400;
	font-family: "Raleway", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
	margin: 0 0 0 0;
	letter-spacing: 1.4rem;
	background-color: none;
	}

#bodywrapper {
	width: 100%;  /* normal all versions 100% */
	height: auto;
	margin: 0px auto;	
	border: 0px solid #E61216;
	background-color: none;
	}

/*--------------- START TOP BLOCK CODE -------------------*/

#top  {
	position: fixed; 
	width: 100%;  /* normal all versions 100% */
	height: 170px;
	padding: 0% 0%;
	border: 0px solid #D41E23;
	background-image: url("../images/bkgrnd02.gif");
	background-repeat: repeat-x;
	background-attachment: fixed;
	background-color: #050545;
	}	
#topbox  {
	max-width: 380px;
	height: 170px;
	margin: 0px auto;
	border: 0px solid #F00;
	background-color: none;
	}	
	#logobox  {
		float: left;
		width: 110px;
		height: 121px;
		padding: 0 0 0 0;
		margin: -1.7rem 0 0 1.5rem;
		border: 0px solid #80FF00;
		background-color: none;
		}
		#logobox a:hover, a:focus {
			padding: 0 0 6px 0;
			border-bottom: 2px solid #FF8000;
			}
		.logotopimg {
			width: 100%;
			}	

	#navbox  {   
		position: absolute;
		xz-index:10000;
		xfloat: left;
		xheight: 50px;
		width:  15rem;
		margin: -1.2rem 0 0 18rem;		
		border: 0px solid #B3B3B3;
		background-color: none;
		}

		/*----------- START TOP NAV MENU CODE --------------*/

		#page-nav {
			width: 100%;
			background: #050545;	/* background of nav box - all */
  			}								/* If you want the navigation bar to stick  see ewd */

		/* SHOW Hamburger */
		#page-nav label {
			display: inline-block;
			color: #fff;
			background: 050545;
			font-style: normal;
			font-size: 4rem;
			line-height: 0.1;
			text-align: center;
			padding: 2rem 0 0 0.8rem;
			margin: 1rem 0 0 12rem;
			border: 0px solid #FAF347;
			}

		/* Toggle show/hide menu on checkbox click */
		#hamburger {
			display: none;
			}
		#page-nav ul {
			display: none;
			}
		#page-nav input:checked ~ ul {			
			margin: -3rem 0 0 0;
			display: block;
			}

		/* Break down menu items into vertical */
		#page-nav ul {
			xwidth: 150px;
			}
		#page-nav ul li {
			display: inline-block;
			padding: 7px;
  			}
		#page-nav ul li a {
			font-size: 1.6rem;	
			font-weight: bold;
			line-height: 0.8;
			letter-spacing: 0.4rem;
			color: #CCC;	/* -- menu text color -- */
			text-decoration: none;
			padding: 0 0 3px 0;
			margin: 0 0 0 -2rem;
			border-bottom: 2px solid #4C4C4C;  
			}
		#page-nav ul li a:link,
		#page-nav ul li a:visited {
			border-bottom: 2px solid none;  
			}
		#page-nav ul li a:hover, 
		#page-nav ul li a:focus,
		#page-nav ul li a:active {
			border-bottom: 2px solid #FF8000; 
			}

		/*--------------END TOP NAV MENU CODE---------------*/	

	#headbox  {
		float: left;
		xmax-width: 980px;
		height: 7rem;
		xpadding: 0 0 0 0;
		margin: -1rem 0 0 0;		
		border: 0px solid #FFF;
		background-color: none;
		}
		.headtop {
			color: #FFC200;
			font-size: 2rem;
			font-weight: bold;
			line-height: 1.2;
			letter-spacing: 0.30rem;
			font-style: normal;
			text-align: center;
 			margin: 0 0 0 0;
			padding: 0 0 0 0;
			}
		.subheadtop {
			color: #CCC;
			font-size: 0.9rem;
			font-weight: normal;
			line-height: 1.8;
			letter-spacing: 0.1rem;
			font-style: italic;
			text-align: center;
			padding: 0 0 0 0;
			margin: 0 0 0 0;
			}
			
/*---------------- END TOP BLOCK CODE --------------------*/

/*------- START SPECIAL -RETURN TO TOP- DIVIDER CODE -------*/	

.floatdivider01 { 
	clear: both; 
	max-width: auto;	
	margin: 15px 0 5px 0;
	font-size: 1.6rem;	
	font-weight: bold;
	line-height: 1.2;
	letter-spacing: 0.3rem;
	font-style: italic;
	text-align:center;
	text-decoration: none;
	background-color: #E6E6E6;
	}
	.floatdivider01 a {
		color: #2122A3;
		}

	.floatdivider01 a:link, a:visited {	
		text-decoration: none;
		}
	.floatdivider01 a:hover, a:focus { 
		border: none;
		color: #F63;
		} 

/*------- END SPECIAL -RETURN TO TOP- DIVIDER CODE ---------*/	

/*-------------- BEGIN MAIN SECTION CODE -----------------*/	

#mainsection  {
	max-width: 1280px;	
	height: auto;
	margin: 0px auto;
	background-color: none;
	border: 0px solid #F00;
	}	

#tempspacertopmiddle  {
	max-width: 1280px;	
	height: 16rem;       /*--Adjusts -RETURN TO TOP- Target--*/
	margin: 0 0 0 0;
	background-color: none;
	}

/*-------------- BEGIN DEPT SECTION CODE -----------------*/	

#digitalnav, #retailnav, #graphicsnav, #aboutnav, #contactnav {
	position: relative;
	top: -15rem;
	}

#digital  {
	overflow: hidden;
	max-width: 1280px;	
	background-color: none;
	}
#retail  {
	overflow: hidden;
	max-width: 1280px;	
	background-color: none;
	}
#graphics  {
	overflow: hidden;
	max-width: 1280px;	
	background-color: none;
	}
#about  {
	overflow: hidden;
	max-width: 1280px;	
	background-color: none;
	}
#contact  {
	overflow: hidden;
	max-width: 1280px;	
	background-color: none;
	}

/*--- SPECIFIC SECTION CODES FOLLOWED BY GENERAL CODES ---*/

.mainbox {
	max-width: 1280px;
	margin: 0px auto;
	overflow: hidden;
	padding: 0 0 0 0.6rem;
	border: 0px solid none;
	background-color: none;
	}

.headpanel {
	width: 100%;
	background-color: none;
	}

.mainimage {
	float: left;	
	width: 50%;
	margin: 0 2rem 1rem 0;
	padding: 0 0 0 0;
   	border: 0px solid #F0F;
	background-color: #CCC;
	}


h1 {
	text-align: center;
	color: #004080;
	font-size: 3.6rem;
	letter-spacing: 0.2rem;
	font-weight: bold;
	line-height: 1.0;
	font-style: normal;
	padding: 0px 0 0px 1em;
	margin: 0.75em 0 0.5em -1em;
	text-shadow: 4px 4px #E6E6E6;	
	border: 0px solid #CCC;
	}

h2 {
	text-align: left;
	color: #004080;
	font-size: 2.0rem;
	font-weight: bold;
	line-height: 1.25;
	letter-spacing: 0.05rem;
	font-style: normal;
	padding: 0 0 0 0;
	margin: 0 0 0 0;
	text-shadow: 2px 2px #E6E6E6;	
	border: 0px solid #CCC;
	}

p {
	color:  #787A7F;
	font-size: 1.6rem;	
	font-weight: normal;
	line-height: 1.5;
	letter-spacing: 0.1rem;
	font-style: normal;
	text-align: left;
	padding: 1rem 0 0 0;
	margin: 0 0 0 0;
	border: 0px solid #CCC;
	}

.bulletlist01 {
	xfloat: left;	
	width: 98%;	
	color:  #004080;
	font-size: 1.5rem;	
	font-weight: normal;
	line-height: 1.5;
	letter-spacing: 0.1rem;
	font-style: bold;
	text-align:left;
	padding: 0.5rem 0 0.5rem 0;
	margin: 2rem 0 1rem 0;
	background-color: none;
	border: 1px solid #CCC;
	border-radius: 20px;
	box-shadow: 3px 3px 4px 0px #CCC;
	}
	
.trailer {
	color:  #555;
	font-size: 1.8rem;	
	line-height: 1.3;
	letter-spacing: 0.2rem;
	font-weight: bold;
	text-align:left;
	padding: 1em 0 1em 0.5em;
	margin: -1em 0 1em 0;
	background-color: none;
	}
	
.sidebox {
	float: left;
	width: 98%;	
	padding: 0.5rem 0 0.5rem 0;
	margin: 1rem 0 0 0;
	}

/*---------------- END MAIN SECTION CODE -----------------*/	

/*--- CONTACT SECTION ONLY IS WITHIN MAIN SECTION CODE ---*/

#contactmainbox {
	width: 98%;	
	overflow: hidden;
	padding: 0 0 0 0;
	margin: 0 0 0 0;
	border: 2px solid none;
	background-color: none;
	}
			
	#contactleft, #contactmiddle, #contactright {
		xfloat: left;
		height: auto;
		width: auto;
		min-width: 360px;
		padding: 0 0 0 0;
		margin: 0 0 0 5rem;
		background-color: none;
		border: 0 solid #000;
		}

	#contactleft {
		margin: 0 0 2rem 2rem ;
		}

	#contactmiddle {
		}

	#contactright {
		margin: 2rem 0 0 3rem;
		}

		.contactbutton01 {
			list-style-type: none;
			width: 90%;
			min-width: 3.40rem;
			height: auto;
			font-size: 2.0rem;	
			font-weight: bold;
			line-height: 1.1;
			letter-spacing: 0.01rem;
			font-style: normal;
			text-align: center;
			padding: 1.5rem 0 1.5rem 0;
			margin: 0px auto;
			background-color: #0C0E7A;
			border: 1px solid #CCC;
			border-radius: 25px;
			box-shadow: 3px 3px 4px 0px #CCC;
			}

		.contactbutton01 a {
			text-decoration: none;
			color: #FFF;
			}
		.contactbutton01 a:link { color: #FFF; }
		.contactbutton01 a:visited { color: #FFAC00; }
		.contactbutton01 a:hover, a:focus { color: #FFAC00; } /* rollover color*/

			.contacttext01 {
				color:  #090928;
				font-size: 1.8rem;	
				font-weight: normal;
				line-height: 1.2;
				letter-spacing: 0.2rem;
				font-style: italic;
				text-align:left;
				padding: 0 0 0 0;
				margin: 0 0 0 0;
				}

			.contacttext02 {
				color:  #0C0E7A;
				font-size: 2.2rem;	
				font-weight: bold;
				line-height: 1.0;
				letter-spacing: 0.2rem;
				font-style: normal;
				text-align:left;
				padding: 0 0 0 0;
				margin: -1rem 0 0 0;
				}


/*----------- BEGIN FOOTER LAYOUT CODING -----------------*/

footer {
	clear: both;
	width: auto;
	height: 200px;
	color: #FFF;
	text-align: center;
	padding: 1rem 0 0 0;
	margin: 1rem 0 0 0;
	background-color: #050540;
	}

	.link02 a {
		list-style: none;
		text-decoration: none;
		color: #FFF;
		font-size: 1.4rem;
		font-weight: normal;
		line-height: 1.5;
		letter-spacing: 0.5rem;
		font-style: normal;
		padding-top: none;
		margin: 2rem 0 0 0;
		border: none;
		background-color: transparent;
		}

	.link02 a:link { color: #FFF; }
	.link02 a:visited { color: #E6E6E6; }
	.link02 a:hover, a:focus { color: #FFAC00; } /* rollover color*/

	.copyright {
		color: #FFF;
		font-size: 1rem;
		line-height: 2;
		text-align: center;
		padding: 5rem 0 0 0;
		padding: 2rem 0 0 0;
		}

} /* end mobile layout (640px and more) */



/*--------------- begin template code -------------------*/
.name {
	overflow: hidden;
	list-style: none;
	text-decoration: none;
	float: clear;
	height: 100%;
	width: 100%;
	color:  #090928;
	font-size: 1.25rem;	
	font-weight: normal;
	line-height: 1.2;
	letter-spacing: 0.04rem;
	font-style: normal;
	text-align:left;
	text-shadow: 2px 2px #999;	
	padding: 0 0 0 0;
	margin: 0 0 0 0;
	background-color: none;
	border: 0 solid #000;
	border-radius: 20px;
	box-shadow: 3px 3px 4px 4px #999;
	}
/*------ begin constants and temporary coding ------------*/
.clearleft { clear: left; }
.clearright { clear: right; }
.clearboth { clear: both; }
.clearnone { clear: none; }
.black { color: #000; }
.white { color: #FFF; }
.blue1 { color: #050540; }
.orange1 { color: #F60; }
.gold { color: #FFBE6B; }
.yellow { #FF0; }
.grayD { #666; }
.grayM { #CCC; }
.grayL { #E6E6E6; }
.italic { font-style: italic;}
/*----------------------- END ALL ------------------------*/