/* ========================================== */
/* ====  CLEARS  ==== */


* {margin: 0; padding: 0;}

a {text-decoration: none;}

.clear {clear: both; width: 100%;}

body {
	background: #f4f4f4; 
	color: #333; 
	font-family: 'Open Sans', sans-serif;
	}




/* ========================================== */
/* ====  HEADINGS / TEXT / HR  ==== */

h1,h2,h3,h4,h5,h6 {
	font-family: 'Oswald', sans-serif; 
	font-weight: 400;
	text-transform: uppercase;
	}


p {line-height: 1.6em; margin-bottom: 1em;}

.weight-light {font-weight: 100;}
.yellow {color: #FFFA1C;}
.white {color: white;}
.uppercase {text-transform: uppercase;}

.smallHrYellow {margin: 30px auto; max-width: 50px; border: 1px solid #FFFA1C;}
.smallHrWhite {margin: 30px auto; max-width: 50px; border: 1px solid white;}



#topSpace {height: 43px;}

/* ========================================== */
/* ========================================== */
/* ========================================== */
/* ====  HEADER / NAV  ==== */


#header {
	padding: 10px 0; 
	font-family: 'Oswald', sans-serif; 
	background: url(../images/Bgrounds/navigation.jpg)#222 no-repeat center; 
	background-size: cover;
	position: fixed;
	top: 0;
	z-index:1000;
	width: 100%;
	border-bottom: 3px solid #043955;
	}


.wrapHead {width: 96%; margin: auto; max-width: 1400px;}


.logoSpace {width: 10px; display: inline-block;}


span.dag {
	font-weight:100; 
	text-transform: uppercase; 
	opacity: .5; 
	font-size: 0em;
	transition: font-size .35s ease;
	color: ;
	}


#header a {color: white;}


#header a img {width: auto; height: 24px;}


a.logoHead {font-size: 1.65em;}


a.logoHead:hover span.dag {font-size: 1em;}


/* ========================================== */
/* ====  NAVIGATION  ==== */

#header nav.fullNav {float: right; text-align: right;}

#header nav.fullNav ul {}

#header nav.fullNav ul li {
	list-style-type: none; 
	display: inline-block; 
	line-height: 40px; 
	text-transform: uppercase; 
	letter-spacing: 1px;
	}

#header nav.fullNav ul li span {opacity: .9; color: #f1f1f1;}

#header nav.fullNav ul li a {opacity: .75; font-weight: 100; padding: 0 14px;}
#header nav.fullNav ul li a:hover {opacity: 1;}

#header nav.fullNav ul li a.navBtn {
	background-color: #0080C0; 
	opacity: 1; 
	border-radius: 4px; 
	padding: 6px 14px; 
	text-shadow: 1px 1px 0px rgba(0,0,0,.5);
	max-width: 112px;
	}
	
	
#header nav.fullNav ul li a.navBtn:hover {background-color: #0076AE;} 


.menuBars {display: none;}


@media screen and (max-width: 1500px) {
	
	#header nav.fullNav ul {margin-top: 0px;}	
	
	}


@media screen and (max-width: 890px) {

span.dag {display:none;}

	}


@media screen and (max-width: 700px) {

	#header {background: #0a2a3c; border: none;}
	
	.fullNav {
		display: none; 
		width: 100%; 
		background-color: ; 
		margin-top: 10px; 
		position: relative; 
		z-index: 1000000;
		padding: 14px 0 7px 0;
		/*  box-shadow: 0px 12px 0px 14px black;  */
		}
	.fullNav span {display: ;}
	
	.img-small {display:block;}
	.img-large {display:none;}
	
	
	
	/* ========================================== */
	/* ====  HAMBURGER MENU  ==== */
	
	.menuBars {
		display: block;
		position: relative;
		overflow: hidden;
		margin: 0;
		padding: 0;
		width: 40px;
		height: 40px;
		font-size: 0;
		text-indent: -9999px;
		appearance: none;
		box-shadow: none;
		border-radius: none;
		border: none;
		cursor: pointer;
	
		background-color: ;
		float: right;	
		}
	
	.menuBars:focus {outline: none;}
	
	
	.menuBars span {
		display: block;
		position: absolute;
		top: 8px;
		left: 0px;
		right: 3px;
		height: 4px;
		background-color: #fdfdfd;
		border-radius: 1px;
		}
	
	.menuBars span::before,
	.menuBars span::after {
		position: absolute;
		display: block;
		left: 0;
		width: 100%;
		height: 4px;
		content: "";
		background-color: #fdfdfd;
		border-radius: 1px;
		}

	.menuBars span::before {top: 10px;}
	.menuBars span::after {bottom: -20px;}

	}
	
	
	
@media screen and (max-width: 490px) {
	
	
	.fullNav {float: none;}

	
	.fullNav ul li {
		width: 100%;
		display: inheret; 
		line-height: 0px; 
		text-transform: uppercase;
		text-align: center;
		background-color: ; 
		}
	
	
	.fullNav ul li a {display: block; background-color: ; margin-bottom: 14px;}

	.fullNav span {display: none;}

	#header nav.fullNav ul li a.navBtn {margin: 0 auto; padding: 0;}
	
	}

/* ========================================== */
/* ========================================== */
/* ========================================== */
/* ====  HERO  ==== */

#hero {}

#hero .heroContent {
	color: white; 
	margin: auto; 
	text-align: center; 
	width: 90%;
	max-width: 1400px;
	padding: 85px 0 100px 0;
	}

#hero .heroContent h1 {font-size: 2.85em; letter-spacing: 1px;}

#hero .heroContent p {font-size:1.1em; letter-spacing: 1px;}

#hero .heroContent img {width: 98%; max-width: 340px;}

#hero .heroContent a.callBtn {
	font-family: 'Oswald', sans-serif; 
	font-weight: 100; 
	text-align: center; 
	text-transform: uppercase; 
	padding: 10px 0; 
	color: #fefefe;
	background-color: rgba(256,256,256,.15); 
	border-radius: 6px; 
	display: block; 
	margin:20px auto 0px auto; 
	width: 112px; 
	letter-spacing: 1px;
	border: 2px solid #fefefe;
	display: none;
	}

#hero .heroContent a.callBtn:hover {
	background: #fefefe; 
	color: #333; 
	}



/*

	#hero a.heroButton {background: #C00; padding: 14px 34px; border-radius: 4px; color: white; font-weight: bold; letter-spacing: 1px; text-transform: uppercase;}
	
	#hero a.heroButton:hover {background: #F30; }
	
	#hero .arrow-down {display: none; width: 60px; height: auto; position: absolute; top: 550px; left: 0; right: 0; margin: auto; padding: 10px 40px; transition: all .25s ease; animation: bounceIn 1s;}
	
	#hero .arrow-down:hover {padding: 20px 40px 10px 40px;}

*/


/*  ======  ANIMATION  ======  */


@keyframes bounceIn {
  0% {
    transform: scale(0.1);
    opacity: 0;
  }
  80% {
    transform: scale(1.2);
    opacity: 1;
  }
  100% {
    transform: scale(1);
  }
}



@media screen and (max-width: 900px){
	
	#hero {margin-top: 43px;}
	#hero .heroContent {top: 20%;}
	#hero .arrow-down {display: block; top: 85%;}


	}

@media screen and (max-width: 800px) {
	
	.vanish {display: none;}
	#hero .heroContent h1 {font-size: 2.5em;}	

	}


@media screen and (max-width: 550px) {
	
	#hero .heroContent {}
	#hero .heroContent h1 {font-size: 2em;}

	}
	
	
@media screen and (max-width: 480px) {
	
	#hero {display: ;}
	#hero .heroContent p {letter-spacing:0px;}
	#hero .vanishText {display: none;}
	#hero .appearHR {display: block;}
	#hero .heroContent a.callBtn {display: inherit;}
	
	}


@media screen and (max-height: 650px) {
		
	#hero .arrow-down {bottom: 150px;}
	
	}


@media screen and (max-height: 500px) {
		
	#hero .arrow-down {display: none;}
	
	}


/* ========================================== */
/* ========================================== */
/* ========================================== */
/* ====  CALL OUT  ==== */

#callOut {margin: auto; text-align: center; /* background: #C00; */ background: url(../images/Bgrounds/grid.png) #0080C0; color: #fefefe; }

#callOut .callOutWrap {max-width: 875px; margin: auto; width: 80%; padding: 90px 0 80px 0;}

#callOut .callOutWrap h1 {font-size: 2em;}

#callOut .callOutWrap h1 span.smallHeadingTop {font-size: .5em; letter-spacing: 6px; /* color: #FFFA1C; */}


#callOut .callOutWrap h2 {font-size: 1.55em;}

#callOut .callOutWrap p {font-size: 1.1em;}



@media screen and (max-width: 700px) {
		
	.callOut {margin: auto; max-width: 550px; text-align: center;}
	#callOut .callOutWrap p {color: white; font-size: 1em;}
	
	}











/* ========================================== */
/* ========================================== */
/* ========================================== */
/* ====  ABOUT  ==== */


#sectionAbout {background: #F4F4F4;}

#sectionAbout .wrapAbout {width: 90%; max-width: 1400px; margin: auto; padding: 0 0 90px 0;}

#sectionAbout .wrapAbout #about {border-top: 90px solid transparent; height: ;} /*  Pushes div down from top  */ 

#sectionAbout .wrapAbout #about h1 {font-family: 'Oswald', sans-serif; font-weight: 400; text-transform: uppercase;}

#sectionAbout .wrapAbout #about h1 span.smallHeadingTop {color: #0080C0; font-size: .5em; letter-spacing: 6px;}

#sectionAbout .wrapAbout #about hr.smallHrBlue {margin: 30px auto 40px auto; max-width: 50px; border: 1px solid #0080C0;}

#sectionAbout .wrapAbout #about .lt-2col {float: left; width: 55%;}

#sectionAbout .wrapAbout #about .rt-2col {float: left; width: 30%; padding-left: 15%;}

#sectionAbout .wrapAbout #about .rt-2col img {width: 100%; margin-top: -60px;}


@media screen and (max-width: 1300px){

	#sectionAbout .wrapAbout #about .lt-2col {width: 50%;}
	#sectionAbout .wrapAbout #about .rt-2col {width: 35%; padding-left: 15%;}
	#sectionAbout .wrapAbout #about .rt-2col img {width: 100%; margin-top: -30px;}
	
	}


@media screen and (max-width: 1000px){

	#sectionAbout .wrapAbout #about .lt-2col {width: 50%;}
	#sectionAbout .wrapAbout #about .rt-2col {width: 35%; padding-left: 15%;}
	#sectionAbout .wrapAbout #about .rt-2col img {width: 100%; margin-top: 0px;}
	
	}





@media screen and (max-width: 700px){
	
	#sectionAbout .wrapAbout #about .lt-2col {float: none; width: 100%;}
	#sectionAbout .wrapAbout #about .rt-2col {float: none; width: 100%; padding-left: 0;  margin: 60px auto 0 auto;}
	#sectionAbout .wrapAbout #about .rt-2col img {display: none;}

	}


/* ========================================== */
/* ========================================== */
/* ========================================== */
/* ====  SERVICES  ==== */

#sectionServices {background: url(../images/Bgrounds/dark_wall.jpg) #403845 repeat;}

#sectionServices .wrapServices {width: 90%; max-width: 1400px; margin: auto; padding: 0 0 90px 0;}

#sectionServices .wrapServices #services {border-top: 90px solid transparent; height: ;}

#sectionServices .wrapServices #services h1 {font-family: 'Oswald', sans-serif; font-weight: 400; text-transform: uppercase; color: #fefefe;}

#sectionServices .wrapServices #services h1 span.smallHeadingTop {color: #B3FAFF; font-size: .5em; letter-spacing: 6px;}

#sectionServices .wrapServices #services hr.smallHrLightBlue {margin: 30px auto 40px auto; max-width: 50px; border: 1px solid #B3FAFF;}


		/* ========================================== */
		/* ====  SERVICE ICONS  ==== */

		#wrapIcons {width: 100%; max-width: 1200px; margin: auto;}
		
		#wrapIcons .iconBox-4-2 {
			width: 25%; 
			float: left;
			text-align: center;
			text-transform: uppercase;
			padding: 30px 0;
			color: #fefefe;
			}
		
		#wrapIcons .iconBox-4-2 img {margin-bottom: 16px;}

		#wrapIcons .iconBox-4-2:hover {box-shadow: 0px 5px 5px rgba(0,0,0,.35);}


		/* ====  SERVICE ICONS BGROUND COLORS  ==== */
		
		.bg-transBlue:hover, .bg-transBlue:focus {background-color: rgba(120,120,256,.2);}
		.bg-transRed:hover, .bg-transRed:focus {background-color: rgba(256,60,60,.2);}
		.bg-transGreen:hover, .bg-transGreen:focus {background-color: rgba(60,256,60,.2);}
		.bg-transPurple:hover, .bg-transPurple:focus {background-color: rgba(256,60,256,.2);}


#sectionServices .wrapServices #services .serviceButton {
	font-family: 'Oswald', sans-serif; 
	font-weight: 100; 
	text-align: center; 
	text-transform: uppercase; 
	padding: 10px 0; 
	color: #fefefe;
	background-color: rgba(256,256,256,.15); 
	border-radius: 6px; 
	display: block; 
	margin:80px auto 0px auto; 
	width: 112px; 
	letter-spacing: 1px;
	border: 2px solid #fefefe;
	}

#sectionServices .wrapServices #services .serviceButton:hover {
	background: #fefefe; 
	color: #333; 
	}




@media screen and (max-width: 700px) {
		
	#wrapIcons .iconBox-4-2 {width: 50%;}
	
	}



@media screen and (max-width: 380px) {
	
	#wrapIcons .iconBox-4-2 {width: 100%;}
	
	}




/* ========================================== */
/* ========================================== */
/* ========================================== */
/* ====  BUILD  ==== */

#build {margin: auto; text-align: center; /* background: #C00; */ background: url(../images/Bgrounds/grid.png) #0080C0; color: #fefefe; }

#build .buildWrap {max-width: 1024px; margin: auto; width: 100%; padding: 90px 0 80px 0;}

#build .buildWrap h1 {font-size: 2em;}

#build .buildWrap h1 span.smallHeadingTop {font-size: .5em; letter-spacing: 6px; /* color: #FFFA1C; */}

#build .buildWrap h2 {font-size: 1.55em;}

#build .buildWrap p {font-size: 1.1em;}

#build .buildWrap #buildItems .buildItem {width: 50%; float:left; height: ;}

#build .buildWrap #buildItems .buildItem img {width: 100%; margin: 0 auto; display: block; max-width: 250px;}

#build .buildWrap #buildItems .buildItem .buildButton {
	font-family: 'Oswald', sans-serif; 
	font-weight: 100; 
	text-align: center; 
	text-transform: uppercase; 
	padding: 10px 0; 
	color: #fefefe;
	background-color: rgba(256,256,256,.15); 
	border-radius: 6px; 
	display: block; 
	margin:20px auto 0px auto; 
	width: 112px; 
	letter-spacing: 1px;
	border: 2px solid #fefefe;
	}

#build .buildWrap #buildItems .buildItem .buildButton:hover {
	background: #fefefe; 
	color: #0080C0; 
	}



@media screen and (max-width: 900px){
	
	#build .buildWrap {max-width: 100%; margin: auto; width: 100%; padding: 90px 0 80px 0;}

}


@media screen and (max-width: 756px){
	
	#build {display: none;}

}



@media screen and (max-width: 700px) {
		
	#build .buildWrap #buildItems .buildItem {width: 100%; float: none; height: ;}
	
	}













/* ========================================== */
/* ====  BRANDS  ==== */

#sectionBrands {background: url(../images/Bgrounds/ltPattern.png) #F4F4F4 repeat;}

#sectionBrands .wrapBrands {width: 90%; max-width: 850px; margin: auto; padding: 90px 0 90px 0;}

#sectionBrands .wrapBrands h1 {font-family: 'Oswald', sans-serif; font-weight: 400; text-transform: uppercase;}

#sectionBrands .wrapBrands h1 span.smallHeadingTop {color: #0080C0; font-size: .5em; letter-spacing: 6px;}

#sectionBrands .wrapBrands hr.smallHrBlue {margin: 30px auto 40px auto; max-width: 50px; border: 1px solid #0080C0;}

#sectionBrands .wrapBrands .brandsWrap {text-align: center;}

#sectionBrands .wrapBrands .brandsWrap a {opacity: .5; padding: 0 20px;}

#sectionBrands .wrapBrands .brandsWrap a:hover {opacity: 1;}

#sectionBrands .wrapBrands .brandsWrap a img {height: 40px; padding: 20px 0;}

#sectionBrands .wrapBrands .buttonWrap {margin: 0 auto; width: 334px; margin-top: 50px;}

#sectionBrands .wrapBrands a.brandsButton {font-family: 'Oswald', sans-serif; font-weight: 100; text-align: center; text-transform: uppercase; padding: 10px 0px; background: #999; color: white; text-shadow: 1px 1px 0px #666; border-radius: 6px; display: block; width: 160px; letter-spacing: 1px; float: left; margin-right: 14px;}

#sectionBrands .wrapBrands a.brandsButton:hover {background: #555;}

#sectionBrands .wrapBrands a.catalogButton {font-family: 'Oswald', sans-serif; font-weight: 100; text-align: center; text-transform: uppercase; padding: 10px 0px; background: #0080C0; color: white; text-shadow: 1px 1px 0px #666; border-radius: 6px; display: block; width: 160px; letter-spacing: 1px; float: left;}

#sectionBrands .wrapBrands a.catalogButton:hover {background: #006289;}


@media screen and (max-width: 400px) {
		
#sectionBrands .wrapBrands .buttonWrap {margin: 0 auto; width: 100%; margin-top: 50px;}

#sectionBrands .wrapBrands a.brandsButton {width: 160px; float: none; margin: 0 auto;}

#sectionBrands .wrapBrands a.catalogButton {width: 160px; float: none; margin: 14px auto 0 auto;}

	
	}



/* ========================================== */
/* ====  ANCHORS  ==== */

#top {border-top: 20px solid transparent;}
#about, #services, #contact {border-top: 90px solid transparent; height: ;}

.rt-remote {font-family: 'Oswald', sans-serif; font-weight: 400; float: right; text-align: center; margin-left: 40px;}
.rt-remote a {color: white; opacity: .25;}
.rt-remote a:hover {opacity: .9;}


.rt-remoteDark {float: right; text-align: center; }
.rt-remoteDark a {color: #222; opacity: .25;}
.rt-remoteDark a:hover {opacity: .8;}


#menu {display:none;}
#menu a {display: block; text-align: center; color: white; font-size: 1.35em; padding: 14px;}








/* ========================================== */
/* ====  CONTACT  ==== */


#sectionContact {background: url(../images/Bgrounds/dark_wall.jpg) #222 repeat;}

#sectionContact .wrapContact {width: 90%; max-width: 1200px; margin: auto; padding: 0 0 90px 0;}
    	
#sectionContact .wrapContact #contact {}

#sectionContact .wrapContact #contact h1 {font-family: 'Oswald', sans-serif; font-weight: 400; text-transform: uppercase; color: #fefefe;}

#sectionContact .wrapContact #contact h1 span.smallHeadingTop {color: #B3FAFF; font-size: .5em; letter-spacing: 6px;}

#sectionContact .wrapContact #contact hr.smallHrLightBlue {margin: 30px auto 40px auto; max-width: 50px; border: 1px solid #B3FAFF;}

#sectionContact .wrapContact #contact h2 {font-family: 'Oswald', sans-serif; font-weight: 400; text-transform: uppercase; color: #fefefe;}

#sectionContact .wrapContact #contact p {color: #fefefe;}


#sectionContact .wrapContact #contact .contact-A {color: #f2f2f2; padding: 20px 0; min-height: 200px;}

#sectionContact .wrapContact #contact .contact-A .one3 {float:left ; width: 33.333%; text-align: center; height: 150px; display: block;}

#sectionContact .wrapContact #contact .contact-A .one3 p {}

#sectionContact .wrapContact #contact .contact-A .one3 img {width: 44px; margin-bottom: 8px;}

#sectionContact .wrapContact #contact .contact-A .one3 a {color: #f2f2f2;}

#sectionContact .wrapContact #contact .contact-A .one3 a:hover {color: #B3FAFF;}


#sectionContact .wrapContact #contact .contact-B {}

#sectionContact .wrapContact #contact .contact-B .contactMap {width: 45%; float: left;}

#sectionContact .wrapContact #contact .contact-B .contactMap #gMap {margin-top: 24px; height:445px;}


@media screen and (max-width: 1500px){
	
	#sectionContact .wrapContact #contact .contact-B .contactMap #gMap {height:425px;}
	
	}


@media screen and (max-width: 800px){
	
	#sectionContact .wrapContact #contact .contact-B .contactMap {width: 100%; margin-bottom: 40px;}
	#sectionContact .wrapContact #contact .contact-B .contactMap #gMap {height:300px; margin: 0;}
	
	}


@media screen and (max-width: 700px){
	
	#sectionContact .wrapContact #contact .contact-A .one3 {float: none; width: 100%;}
	#sectionContact .wrapContact #contact .contact-A .one3 p {font-size: 1.1em;}
		
	}






/*  =============================================  */
/*  ====  CONTACT FORM  ======  */

#sectionContact .wrapContact #contact .contact-B .contactForm {float: left; width: 45%; max-width: 100%; margin-left: 5%; padding: 14px 0 24px 4%; border-left: 1px solid #f2f2f2;}

#sectionContact .wrapContact #contact .contact-B .contactForm .requiredField {}

#sectionContact .wrapContact #contact .contact-B .contactForm label {font-size:.95em; color: #f2f2f2;}


#sectionContact .wrapContact #contact .contact-B .contactForm input#fullName,
#sectionContact .wrapContact #contact .contact-B .contactForm input#email {

	width: 99%;
	height: 2.2em;
	box-shadow: 0px 2px 2px -2px #999 inset;
	border: 1px solid rgb(220,220,220);
	padding: 0 0 0 1%;
	color: rgba(19,33,36,.9);
	background-color: rgb(244,244,244);
	margin-top: 4px;

	}

#sectionContact .wrapContact #contact .contact-B .contactForm textarea {

	width: 99%;
	height: 140px;
	box-shadow: 0px 2px 2px -2px #999 inset;
	border: 1px solid rgb(220,220,220);
	padding: 0 0 0 1%;
	color: rgba(19,33,36,.9);
	background-color: rgb(244,244,244);
	resize: vertical; /* allow vertical resize of textarea */
	margin-top: 4px;
	}



@media screen and (max-width: 800px){
	
	#sectionContact .wrapContact #contact .contact-B .contactForm {float: none; width: 100%; padding: 80px 0 0 0; margin: 0; border: none;}
	
	}



/* ========================================== */
/* ========================================== */
/* ========================================== */
/* ========================================== */
/* ========================================== */
/* ========================================== */
/* ========================================== */
/* ========================================== */




.serviceQuote {font-family: 'Oswald', sans-serif; font-weight: 100; text-align: center; text-transform: uppercase; padding: 10px 0; background: #999; color: white; text-shadow: 1px 1px 0px #666; border-radius: 6px; display: block; margin:20px auto 0px auto; width: 160px; letter-spacing: 1px;}

.serviceQuote:hover {background: #555;}

#sectionServicesTop {background:url(../images/BG-Embroidery_BW.jpg) #333 center center no-repeat; background-size: cover;}

#sectionServicesTop .wrapServicesTop {width: 90%; max-width: 1400px; margin: auto; padding: 0 0 90px 0;}

#sectionServicesTop .wrapServicesTop #servicesTop {border-top: 90px solid transparent; height: ;}

#sectionServicesTop .wrapServicesTop #servicesTop h1 {font-family: 'Oswald', sans-serif; font-weight: 400; text-transform: uppercase; color: #fefefe;}

#sectionServicesTop .wrapServicesTop #servicesTop h1 span.smallHeadingTop {color: #B3FAFF; font-size: .5em; letter-spacing: 6px;}

#sectionServicesTop .wrapServicesTop #servicesTop hr.smallHrLightBlue {margin: 30px auto 40px auto; max-width: 50px; border: 1px solid #B3FAFF;}


.hrTrans {border-top: 2px solid rgba(0,0,0,.1); border-bottom: 2px solid rgba(256,256,256,.85); width: 80%; max-width: 1200px; margin: auto;}


/* ========================================== */
/* ====  SERVICES PRINTING  ==== */


#sectionPrinting {background: #f4f4f4;}

#sectionPrinting .wrapPrinting {width: 90%; max-width: 1400px; margin: auto; padding: 0 0 90px 0;}

#sectionPrinting .wrapPrinting #printing {border-top: 90px solid transparent; height: ;} /*  Pushes div down from top  */ 

#sectionPrinting .wrapPrinting #printing .serviceImg-1 {background:url(../images/Services-Images-Blue.jpg) center no-repeat; background-size: cover; float: right; margin:10px 0 20px 40px; height: 300px; width: 400px;}



/* ========================================== */
/* ====  SERVICES EMBROIDERY  ==== */


#sectionEmbroidery {background: #F4F4F4;}

#sectionEmbroidery .wrapEmbroidery {width: 90%; max-width: 1400px; margin: auto; padding: 0 0 90px 0;}

#sectionEmbroidery .wrapEmbroidery #embroidery {border-top: 90px solid transparent; height: ;} /*  Pushes div down from top  */ 

#sectionEmbroidery .wrapEmbroidery #embroidery .serviceImg-2 {background:url(../images/Services-Images-Red.jpg) center no-repeat; background-size: cover; float: right; margin:10px 0 20px 40px; height: 300px; width: 400px;}


/* ========================================== */
/* ====  SERVICES BANNERS  ==== */


#sectionBanners {background: #F4F4F4;}

#sectionBanners .wrapBanners {width: 90%; max-width: 1400px; margin: auto; padding: 0 0 90px 0;}

#sectionBanners .wrapBanners #banners {border-top: 90px solid transparent; height: ;} /*  Pushes div down from top  */ 

#sectionBanners .wrapBanners #banners .serviceImg-3 {background:url(../images/Services-Images-Green.jpg) center no-repeat; background-size: cover; float: right; margin:10px 0 20px 40px; height: 300px; width: 400px;}


/* ========================================== */
/* ====  SERVICES LETTERING  ==== */


#sectionLettering {background: #F4F4F4;}

#sectionLettering .wrapLettering {width: 90%; max-width: 1400px; margin: auto; padding: 0 0 90px 0;}

#sectionLettering .wrapLettering #lettering {border-top: 90px solid transparent; height: ;} /*  Pushes div down from top  */ 

#sectionLettering .wrapLettering #lettering .serviceImg-4 {background:url(../images/Services-Images-Purple.jpg) center no-repeat; background-size: cover; float: right; margin:10px 0 20px 40px; height: 300px; width: 400px;}



@media screen and (max-width: 900px){

	#sectionPrinting .wrapPrinting #printing .serviceImg-1,
	#sectionEmbroidery .wrapEmbroidery #embroidery .serviceImg-2,
	#sectionBanners .wrapBanners #banners .serviceImg-3,
	#sectionLettering .wrapLettering #lettering .serviceImg-4 {width: 300px; height: 200px;}	

	}


@media screen and (max-width: 700px){

	#sectionPrinting .wrapPrinting #printing .serviceImg-1,
	#sectionEmbroidery .wrapEmbroidery #embroidery .serviceImg-2,
	#sectionBanners .wrapBanners #banners .serviceImg-3,
	#sectionLettering .wrapLettering #lettering .serviceImg-4 {width: 100%; float: none; height: 160px; margin: 0 0 14px 0;}	

	}

















#formButton {
    background-color: #68b12f;
    background: -webkit-gradient(linear, left top, left bottom, from(#68b12f), to(#50911e));
    background: -webkit-linear-gradient(top, #68b12f, #50911e);
    background: -moz-linear-gradient(top, #68b12f, #50911e);
    background: -ms-linear-gradient(top, #68b12f, #50911e);
    background: -o-linear-gradient(top, #68b12f, #50911e);
    background: linear-gradient(top, #68b12f, #50911e);
    border: 1px solid #509111;
    border-bottom: 1px solid #5b992b;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    box-shadow: inset 0 1px 0 0 #9fd574;
    -webkit-box-shadow: 0 1px 0 0 #9fd574 inset ;
    -moz-box-shadow: 0 1px 0 0 #9fd574 inset;
    -ms-box-shadow: 0 1px 0 0 #9fd574 inset;
    -o-box-shadow: 0 1px 0 0 #9fd574 inset;
    color: white;
    font-weight: bold;
    padding: 6px 20px;
    text-align: center;
    text-shadow: 0 -1px 0 #396715;
}
#formButton:hover {
    opacity:.85;
    cursor: pointer; 
}
#formButton:active {
    border: 1px solid #20911e;
    box-shadow: 0 0 10px 5px #356b0b inset; 
    -webkit-box-shadow:0 0 10px 5px #356b0b inset ;
    -moz-box-shadow: 0 0 10px 5px #356b0b inset;
    -ms-box-shadow: 0 0 10px 5px #356b0b inset;
    -o-box-shadow: 0 0 10px 5px #356b0b inset;
     
}






























/*  ============================  */
/*  =====  FOOTER  COPYRIGHT ====  */

#footer {padding: 16px 0; text-align: center; background-color: black;}
#footer p, a {font-size: .85em; color: #999;}
#footer a:hover {color: #FF6}




/* ========================================== */
/* ========================================== */
/* ========================================== */
/* ========================================== */
/* ========================================== */
/* ========================================== */
/* ========================================== */
/* ========================================== */


#quoteHero {background: url(../images/Printing_BW.jpg) #333 center no-repeat; background-size: cover;}

#quoteHero .wrapQuote {width: 90%; max-width: 1400px; margin: auto; padding: 0 0 90px 0;}

#quoteHero .wrapQuote #quoteHeroContent {border-top: 90px solid transparent; height: ;}

#quoteHero .wrapQuote #quoteHeroContent h1 {font-family: 'Oswald', sans-serif; font-weight: 400; text-transform: uppercase; color: #fefefe;}

#quoteHero .wrapQuote #quoteHeroContent h1 span.smallHeadingTop {color: #B3FAFF; font-size: .5em; letter-spacing: 6px;}

#quoteHero .wrapQuote #quoteHeroContent hr.smallHrLightBlue {margin: 30px auto 40px auto; max-width: 50px; border: 1px solid #B3FAFF;}




#sectionQuote {background: #F4F4F4;}

#sectionQuote .wrapQuote {width: 90%; max-width: 960px; margin: auto; padding: 60px 0 90px 0;}

#sectionQuote .wrapQuote #quoteLeftContent {float: left; width: 35%; padding-right: 7%;}

#sectionQuote .wrapQuote #quoteRightContent {float: left; width: 50%; padding-left: 7%; border-left: 1px solid #999;}


#sectionQuote .wrapQuote #quoteRightContent #quoteForm label {}



#sectionQuote .wrapQuote #quoteRightContent input#firstName,
#sectionQuote .wrapQuote #quoteRightContent input#lastName,
#sectionQuote .wrapQuote #quoteRightContent input#email,
#sectionQuote .wrapQuote #quoteRightContent input#phone,
#sectionQuote .wrapQuote #quoteRightContent input#company ,
#sectionQuote .wrapQuote #quoteRightContent select{

	width: 99%;
	height: 2.2em;
	box-shadow: 0px 2px 2px -2px #999 inset;
	border: 1px solid rgb(220,220,220);
	padding: 0 0 0 1%;
	color: rgba(19,33,36,.9);
	background-color: rgb(254,254,254);
	margin-top: 4px;

	}




#sectionQuote .wrapQuote #quoteRightContent textarea {

	width: 99%;
	height: 140px;
	box-shadow: 0px 2px 2px -2px #999 inset;
	border: 1px solid rgb(220,220,220);
	padding: 0 0 0 1%;
	color: rgba(19,33,36,.9);
	background-color: rgb(254,254,254);
	resize: vertical; /* allow vertical resize of textarea */
	margin-top: 4px;
	}









@media screen and (max-width: 700px) {
	
	#sectionQuote .wrapQuote #quoteLeftContent {float: none; width: 100%; padding-right: 0;}
	#sectionQuote .wrapQuote #quoteRightContent {float: none; width: 100%; padding-left: 0; border-left: none; margin-top: 60px;}
	
	
	}






