/*--- Global Components for Web Deals ---*/
html, body { margin: 0px!important; padding: 0px!important; font-family: Arial; }
.pinkbold { color: #FF0068!important; font-weight: bold; }
.bluebold { color: #176FAF!important; font-weight: bold; }
.orangebold { color: #FFCC00!important; font-weight: bold; }

*:focus { outline: none!important; } /*-- Clear Outlines in multiple Browser --*/


/*----- HEADER Components -----*/
#header-container { height: 100px!important; }

#header-leftcol { float: left; width: 300px; }
#header-rightcol { float: right; width: 650px; text-align: right!important; width: auto!important; margin-right: 35px!important; }

.cbp-af-header {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	background: url('../images/navbg.png') bottom left repeat-x;
	z-index: 10000;
	height: 140px;
	overflow: hidden;
	-webkit-transition: height 0.3s;
	-moz-transition: height 0.3s;
	transition: height 0.3s;
}

.cbp-af-header.cbp-af-header #header-leftcol img {
	-webkit-transition: height 0.3s;
	-moz-transition: height 0.3s;
	transition: height 0.3s;
	line-height: 130px;
	height: 110px;
	padding-left: 15px!important;
	padding-top: 10px!important;
	}
	
.cbp-af-header .cbp-af-inner {
	width: 1100px;
	margin: 0 auto;
}

.cbp-af-header nav {
	display: inline-block;
	position: relative;
	font-family: Arial, san serif!important;
	width: 650px;
}

 /* We just have one-lined elements, so we'll center the elements with the line-height set to the height of the header */
.cbp-af-header nav a {
	display: inline-block;
	text-decoration: none;
	padding-top: 55px; padding-bottom: 55px; padding-left: 5px; padding-right: 5px;
}

.cbp-af-header nav {
	float: right;
	color: #CCCCCC;
}

.cbp-af-header nav a {
	color: #888888; text-transform: uppercase; font-weight: bold!important; letter-spacing: -1px!important;
	font-size: 13px!important; text-shadow: 1px 1px #FFFFFF;
}

.cbp-af-header nav a:hover {
	color: #FF0068;
}

/* Transitions and class for reduced height */
.cbp-af-header nav a {
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.cbp-af-header.cbp-af-header-shrink {
	height: 100px;
}

.cbp-af-header.cbp-af-header-shrink #header-leftcol img {  
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
	padding-left: 15px!important;
	padding-top: 10px!important;
	height: 70px;
	}

.cbp-af-header.cbp-af-header-shrink nav a {
	padding-top: 35px; padding-bottom: 35px;
}




/*--- HOME Components ---*/
#home { background: url('../images/bluepattern-bg.gif') fixed repeat; padding-top: 150px; }
#home-container { width: 1100px; height: 1350px; margin: 0 auto!important; }

#banner-container { background: #FF0068; padding: 3px; width: 1053px; height: 420px; margin-left: auto; margin-right: auto; overflow: hidden!important; }

#banner-container #banner-leftcol { float: left; background: #176FAF; width: 320px; height: 420px; margin-right: 3px!important; }
#banner-container #banner-rightcol { float: left; background: #176FAF; width: 730px; height: 420px; }

#highlight-container { margin-left: 11px; padding-top: 75px!important; padding-bottom: 50px!important; }

#highlightbox { float: left; display: inline-block; width: 250px; height: 250px; margin-left: 9px; margin-right: 9px; }
#highlightbox .hlimg { border: 3px solid #FF0068; width: 250px; height: 188px; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
#highlightbox .hlimg:hover { border: 3px solid #00FFFF; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }

#highlightbox .hltitle { 
	position: absolute; background: url('../images/whitebox.png') top left no-repeat; width: 200px!important; height: 60px!important; 
	text-align: center!important; vertical-align: middle!important; margin-left: 25px; margin-top: -40px; padding-top: 20px;
	font-family: 'Rokkitt', serif!important; font-size: 17px; text-align: center!important;
	}

#home-container .hometitle { 
	font-family: 'Rokkitt', serif!important; font-size: 48px; letter-spacing: -2px!important; color: #FFFFFF!important; text-align: center!important; 
	padding-bottom: 5px; margin-bottom: 50px; border-bottom: 1px solid #FFFFFF; 
	}

#bannertext-container { position: absolute; width: 300px; height: 150px; margin-left: 775px; margin-top: -400px; text-align: center!important; }

#bannertext-container .bannertext1 { 
	float: right; font-family: 'Rokkitt', serif!important; font-weight: bold; font-size: 38px; color: #FFFFFF; 
	letter-spacing: -1px!important; background: #FF0068; padding: 10px; margin-bottom: 10px; width: 405px; 
	}
#bannertext-container .bannertext2 { float: right; font-family: 'Rokkitt', serif!important; font-size: 18px; background: #51F3C3; padding: 10px; width: 250px; }
	
	
/*--- For T-SHIRT Container ---*/
/* the container */
.allinone_carousel {
	position:relative;
}
.allinone_carousel img {
	max-width:none;
	max-height:none;
}
.allinone_carousel_list {
	margin:0;
	padding:0;
	list-style:none;
	display:none;
}

.allinone_carousel_list ul li img { border: none!important; }

.allinone_carousel .contentHolder {
	position:relative;
	overflow:hidden;
}
.mycanvas {
	position:absolute;
	top:8px;
	right:10px;
	z-index:1000;
}

.myloader {
	background:url('../img/skins/loader.gif');
	width:37px;
	height:37px;
	position:absolute;
	left:49%;
	top:49%;
	z-index:999;
}

/***powerful SKIN***/

.allinone_carousel.powerful .contentHolderUnit {
	position:absolute;
	/*float:left;
	display:block;*/
	width:300px;
	height:380px;
	overflow:hidden;
	cursor: pointer;
	background:url('../images/skins/powerful/empty.gif') repeat;
}

.allinone_carousel.powerful .elementTitle {
	position:absolute;
	left:0;
	top:370px;
	width:100%;
	text-align:center;
	font: bold 16px/25px 'Droid Sans', Verdana, Helvetica, sans-serif;
	color:#FFFFFF;
	text-transform: uppercase;
}
.allinone_carousel.powerful .playOver {
	position:absolute;
	width:100px;
	height:100px;
	background:url('../images/skins/powerful/play_over.png') 0 0 no-repeat;
	display:none;
	z-index:200;
	cursor: pointer;
}

.allinone_carousel.powerful .playOver:hover {
	background:url('../images/skins/powerful/play_over2.png') 0 0 no-repeat;
	display:none;
	z-index:200;
	cursor: pointer;
}

.text {
	position:absolute;
	left:0;
	width:100%;
	text-align:center;
	font-weight: normal;
	color:#FFFFFF;
	text-transform: none;
}


.allinone_carousel.powerful .bannerControls {
	position:absolute;
	left:0;
	top:0;
	z-index:101;
	width:100%;
}

.allinone_carousel.powerful .leftNav {
	position:absolute;
	left:-23px;
	width:110px;
	height:157px;
	background:url('../images/skins/powerful/leftNavOFF.png') 0 0 no-repeat;
	cursor: pointer;
}
.allinone_carousel.powerful .leftNav:hover {
	background:url('../images/skins/powerful/leftNavON.png') 0 0 no-repeat;
}
.allinone_carousel.powerful .rightNav {
	position:absolute;
	right:-23px;
	width:110px;
	height:157px;
	background:url('../images/skins/powerful/rightNavOFF.png') 0 0 no-repeat;
	cursor: pointer;
}
.allinone_carousel.powerful .rightNav:hover {
	background:url('../images/skins/powerful/rightNavON.png') 0 0 no-repeat;
}
.allinone_carousel.powerful .bottomNav {
	position:absolute;
	height:35px;
	width:0;
	padding-left:9px;
	margin-left:-3px;
	z-index:140;
}
.allinone_carousel.powerful .bottomNavButtonOFF {
	float:left;
	display:block;
	width:13px;
	height:13px;
	background:url('../images/skins/powerful/bottomNavOFF.png') 0 0 no-repeat;
	padding-left:9px;
	cursor: pointer;
}

.allinone_carousel.powerful .bottomNavButtonON {
	float:left;
	display:block;
	width:13px;
	height:13px;
	padding-left:9px;
	background:url('../images/skins/powerful/bottomNavON.png') 0 0 no-repeat;
	cursor: pointer;
}

.allinone_carousel.powerful .bottomNavLeft {
	position:absolute;
	width:0px;
	height:35px;
	bottom:-10px;
	z-index:140;
}
.allinone_carousel.powerful .bottomNavRight {
	position:absolute;
	width:0px;
	height:35px;
	bottom:-10px;
	z-index:140;
}

.allinone_carousel.powerful .bottomOverThumb {
	position:absolute;
	width:88px;
	height:106px;
	background:url('../images/skins/powerful/bottomOverThumbBg.png') 23px bottom no-repeat;
	bottom:27px;
	margin-left:-25px;
}
.allinone_carousel.powerful .bottomOverThumb img {
	border:4px solid #FFFFFF;
}

.hideElement {
	display:none;
}





/*--- ABOUT US Components ---*/
#about { background: #010101; padding-top: 110px!important; }
#about-container { background: url('../images/aboutbg.jpg') top center no-repeat; width: 1100px; height: 750px; margin: 0 auto!important;  }

#aboutcontent { background: url('../images/about-tshirt.png') 0px 15px no-repeat; width: 700px; height: 450px; padding-top: 200px; padding-left: 380px; padding-right: 20px; font-size: 12px; color: #DDDDDD!important; }

#aboutcontent .about-title1 { font-family: 'Rokkitt', serif!important; font-size: 75px; letter-spacing: -1px!important; color: #FFFFFF!important; }
#aboutcontent .about-title2 { font-family: 'Rokkitt', serif!important; font-size: 35px; letter-spacing: -1px!important; color: #DDDDDD!important; }
#aboutcontent p { line-height: 1.4em; margin-bottom: 5px!important; }





/*--- STEPS Components ---*/
#steps { background: url('../images/stepbg.jpg') fixed repeat; }
#steptopbg { background: url('../images/cloudtopbg.png') top center no-repeat; padding-top: 100px; }
#steps-container { width: 1100px; height: 1050px; margin: 0 auto!important; }

#steps-container .steptitle { font-family: 'Rokkitt', serif!important; font-size: 60px; letter-spacing: -2px!important; color: #FFFFFF!important; width: 390px; text-align: center!important; }
#steps-container .steptitle2 { font-family: 'Rokkitt', serif!important; font-size: 20px; color: #FFFFFF!important; width: 390px; text-align: center!important; }

#steps-container #step1 { position: absolute!important; width: 470px; margin-top: 65px!important; }
#steps-container #step1 .step1img { background: #FF0068; padding: 3px; width: 460px; height: 300px; margin-left: auto; margin-right: auto; margin-bottom: 20px; }

#steps-container #arrow1 { position: absolute!important; width: 140px; height: 55px; margin-top: 200px; margin-left: 475px; }
#steps-container #arrow2 { position: absolute!important; width: 85px; height: 110px; margin-top: 365px; margin-left: 545px; }

#steps-container #step2 { position: absolute!important; width: 480px; margin-top: 65px!important; margin-left: 620px; }
#steps-container #step2 .step2img { background: #FF0068; padding: 3px; width: 473px; height: 300px; margin-left: auto; margin-right: auto; margin-bottom: 20px; }

#steps-container #step3 { position: absolute!important; width: 300px; margin-left: 400px; margin-top: 480px; }
#steps-container #step3 .step3img { width: 270px; height: 300px; margin-left: auto; margin-right: auto; margin-bottom: 20px; }

#cloudtext { background: url('../images/cloudtext.png') top left no-repeat; width: 300px; height: 110px; padding-top: 30px; margin-left: auto; margin-right: auto; }
#cloudtext .cloudtitle { 
	font-family: 'Rokkitt', serif!important; font-size: 45px; width: 260px; color: #FFFFFF!important; 
	text-align: center!important; letter-spacing: -1px!important; font-weight: bold; line-height: 45px!important;
	margin-left: auto; margin-right: auto;
	}
#cloudtext .clouddesc { font-family: 'Rokkitt', serif!important; font-size: 20px; width: 260px; color: #FFFFFF!important; text-align: center!important; margin-left: auto; margin-right: auto; }





/*--- SERVICES Components ---*/
#services { background: url('../images/pink-bg.jpg') fixed repeat!important; padding-top: 110px!important; }
#services-container { width: 1100px; height: 850px; margin: 0 auto!important; }

#servicestitle { 
	font-family: 'Rokkitt', serif!important; font-size: 60px!important; letter-spacing: -2px!important; 
	color: #FFFFFF!important; text-align: center!important; text-shadow: 1px 1px #222222!important; margin-bottom: 30px!important;
	}

#services-imgbox { background: #FFFFFF; width: 903px; height: 300px; padding: 3px!important; margin: 0px auto!important; margin-bottom: 50px!important; }
#imgbox-leftcol { float: left; width: 450px; height: 300px; }
#imgbox-rightcol { float: right; width: 450px; height: 300px; }

#services-imgbox .boxtitle01 { 
	position: absolute; background: #FF0068; font-family: 'Rokkitt', serif!important; font-size: 30px; color: #FFFFFF; letter-spacing: -1px!important; 
	width: 340px; text-align: left!important; padding-left: 15px; padding-top: 10px; padding-bottom: 10px; margin-left: -30px!important; margin-top: -75px!important;
	}
#services-imgbox .boxtitle02 { 
	position: absolute; background: #51F3C3; font-family: 'Rokkitt', serif!important; font-size: 30px; color: #222222; letter-spacing: -1px!important; 
	width: 340px; text-align: right!important; padding-right: 15px; padding-top: 10px; padding-bottom: 10px; margin-left: 580px!important; margin-top: -270px!important; 
	}
#services-desc { 
	width: 1050px; font-family: 'Rokkitt', serif!important; font-size: 24px; color: #FFFFFF; letter-spacing: -0.5px!important; text-align: center;
	margin: 0px auto!important; line-height: 1.0em!important; margin-bottom: 30px!important;
	}

#services-buttonbox { 
	background: url('../images/services-tornpaperbg.png') top left no-repeat; width: 850px; height: 130px; 
	margin: 0px auto!important; padding-top: 45px; padding-bottom: 45px; padding-left: 35px; padding-right: 15px; 
	}

#services-boxpdf { float: left; width: 75px; height: 74px; display: inline-block; padding-top: 20px; margin-right: 15px; }

#services-button01 a, #services-button01 a:link, #services-button01 a:visited { 
	float: left; background: url('../images/services-button01.jpg') 0px 0px no-repeat; display: inline-block; width: 140px; height: 110px; margin-right: 15px;
	font-family: 'Rokkitt', serif!important; font-size: 18px; color: #CC0000; text-align: center; text-decoration: none; padding-left: 90px; padding-top: 20px;
	}
#services-button01 a:hover { background: url('../images/services-button01.jpg') 0px -130px no-repeat; color: #222222; text-decoration: none; }

#services-button02 a, #services-button02 a:link, #services-button02 a:visited { 
	float: left; background: url('../images/services-button02.jpg') 0px 0px no-repeat; display: inline-block; width: 140px; height: 110px; margin-right: 15px;
	font-family: 'Rokkitt', serif!important; font-size: 18px; color: #CC0000; text-align: center; text-decoration: none; padding-left: 90px; padding-top: 20px; 
	}
#services-button02 a:hover { background: url('../images/services-button02.jpg') 0px -130px no-repeat; color: #222222; text-decoration: none; }

#services-button03 a, #services-button03 a:link, #services-button03 a:visited { 
	float: left; background: url('../images/services-button03.jpg') 0px 0px no-repeat; display: inline-block; width: 140px; height: 110px;
	font-family: 'Rokkitt', serif!important; font-size: 18px; color: #CC0000; text-align: center; text-decoration: none; padding-left: 90px; padding-top: 20px;
	}
#services-button03 a:hover { background: url('../images/services-button03.jpg') 0px -130px no-repeat; color: #222222; text-decoration: none; }




/*--- GALLERY Components ---*/
#our-gallery { background: url('../images/hex-bg.png') #E6E6E6 fixed repeat; padding-top: 110px; font-size: 12px; }
#gallery-container { width: 1100px; margin: 0 auto!important; }

#circleblue { background: url('../images/circleblue.png') 0px 0px no-repeat; }
#circlepink { background: url('../images/circlepink.png') 550px 60px no-repeat; height: 850px; padding-left: 100px; padding-right: 100px; }

#gallery-container .gallerytitle { 
	background: url('../images/dots.png') right 15px no-repeat; font-family: 'Rokkitt', serif!important; font-size: 60px!important; letter-spacing: -2px!important; color: #FF0090!important; 
	width: 420px; text-align: center!important; width: 500px; text-align: left!important; margin-bottom: 15px!important; text-shadow: 1px 1px #FFFFFF!important;
	}
#gallery-container .gallerydesc { background: #FFFFFF; padding: 10px; color: #222222; line-height: 1.4em; width: 480px; margin-bottom: 35px; }

#gallerybox { width: 1000px; margin: 0 auto!important;  }

#gthumb-container { background: #FFFFFF; float: left; display: inline-block; width: 286px; height: 200px; padding: 1px; margin-left: 10px!important; margin-right: 10px!important; margin-bottom: 20px!important; }
#gthumb-container .gthumb-img { border: 3px solid #FF0068; width: 280px; height: 165px; margin-bottom: 10px; margin: 0px auto!important; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
#gthumb-container .gthumb-img:hover { border: 3px solid #00FFFF; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
#gthumb-container .gthumb-title { text-align: center!important; font-size: 11px; font-weight: bold; padding-top: 5px; padding-bottom: 5px; }


/*--- CONTACT US Components ---*/
#contact { background: url('../images/contactbg.jpg') top left repeat; padding-top: 140px; }
#contact-container { width: 1032px; padding-left: 68px!important; padding-bottom: 25px!important; margin: 0 auto!important; }

#contactbox1 { 
	float: left; display: inline-block; background: #52F2C2; width: 480px; height: 300px; 
	-webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; margin-right: 2px; margin-bottom: 2px; 
	}
#contactbox1:hover { background: #FFCC00; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
#contactbox1 .contactlogo { width: 400px; height: 100px; padding-top: 100px; margin: 0 auto!important; }

#contactbox2 { 
	float: left; display: inline-block; background: #FF0068; width: 480px; height: 300px; color: #222222; text-align: center;
	-webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; margin-right: 2px; margin-bottom: 2px; 
	}
#contactbox2:hover { background: #8DEC00; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }

#contactbox3 { 
	float: left; display: inline-block; background: #2B38B6; width: 480px; height: 300px; color: #FFFFFF; text-align: center;
	-webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; margin-right: 2px; margin-bottom: 2px; 
	}
#contactbox3:hover { background: #8E00D2; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }

#contactbox4 { float: left; display: inline-block; background: #F6F6F6; width: 476px; height: 296px; padding: 2px!important; margin-right: 2px; margin-bottom: 2px; }
#contactbox4 #googlemap { width: 476px; height: 296px; }

#contactbox2 .contacttitle, #contactbox3 .contacttitle { font-family: 'Rokkitt', serif!important; font-size: 75px; letter-spacing: -2px!important; }
#contactbox2 .contacttitle { padding-top: 40px; padding-bottom: 10px; text-shadow: 1px 1px #FFFFFF!important; }
#contactbox3 .contacttitle { padding-top: 40px; padding-bottom: 20px; text-shadow: 1px 1px #222222!important; }

#contactbox2 .contactdesc2 { font-family: 'Nunito', sans-serif!important; }
#contactbox2 .contactdesc2 a, #contactbox2 .contactdesc2 a:link, #contactbox2 .contactdesc2 a:visited { color: #FFFFFF!important; text-decoration: none!important; }
#contactbox2 .contactdesc2 a:hover { color: #196EAE!important; text-decoration: none!important; }

#contactbox3 .contactdesc3 { font-family: 'Nunito', sans-serif!important; font-size: 28px; padding-top: 15px; }
#contactbox3 .contactdesc4 { font-family: 'Nunito', sans-serif!important; font-size: 18px; }




/*--- FOOTER Components ---*/
#footer-container { background: url('../images/footerbg.jpg') top left repeat-x #222222; }

#footerbox { width: 1050px; padding-top: 25px; padding-left: 25px; padding-right: 25px; padding-bottom: 15px; margin-left: auto; margin-right: auto; }

#footer-leftcol { float: left; width: 750px; }

#footer-leftcol .footernav { font-size: 12px!important; color: #FFFFFF; padding-bottom: 15px!important; padding-left: 10px; }
#footer-leftcol .footernav a, #footer-leftcol .footernav a:link, #footer-leftcol .footernav a:visited { 
	color: #FF0068; text-decoration: none; padding-left: 3px; padding-right: 3px; font-weight: bold;
	-webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s;
	}
#footer-leftcol .footernav a:hover { color: #FFFFFF; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }

#footer-leftcol .copyrights { border-top: 1px solid #444444; padding-top: 15px; padding-left: 10px; font-size: 11px; color: #CCCCCC; line-height: 1.4em; }
#footer-leftcol .copyrights a, #footer-leftcol .copyrights a:link, #footer-leftcol .copyrights a:visited { 
	color: #FF0068; text-decoration: none; font-weight: bold; 
	-webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s;
	}
#footer-leftcol .copyrights a:hover { color:#FFFFFF; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }

#footer-rightcol { width: 280px; float: right; }

#socialbox { padding-top: 5px; padding-bottom: 6px; padding-right: 10px; width: 270px; margin-left: auto; margin-right: auto; margin-bottom: 10px!important; border-bottom: 1px solid #444444; }
#socialbox .socialleft { float: right; width: 100px; font-size: 10px; font-weight: bold; text-transform: uppercase; color: #CCCCCC; }
#socialbox .socialright { float: right; width: 100px; }

#footerlogo { padding-left: 100px; width: 180px; }
#footerlogo .kdlogo { 
	background: url('../images/kdlogo.png') 0px 0px no-repeat; width: 180px; height: 50px; margin-left: auto; margin-right: auto;
	-moz-border-radius: 3px; -webkit-border-radius: 3px; -khtml-border-radius: 3px; border-radius: 3px; }
#footerlogo .kdlogo:hover { background: url('../images/kdlogo.png') 0px -50px no-repeat; }
