/* @group Color scheme */
/* kuler.adobe.com
 * Base color: #40bfff
 * Links, hovers: #40bfff
 * Text: #466c7f
 * Bold headlines: #20607f
 * Normal headlines: #3399cc
 */
/* @end color scheme */


/* @group Reset */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
a {
	text-decoration: none;
	color: inherit;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* @end reset */

/* @group CSS Grid */
/* 12 columns, 60 pixels each, with 20 pixel gutter */

.grid_1 { width:60px; }
.grid_2 { width:140px; }
.grid_3 { width:220px; }
.grid_4 { width:300px; }
.grid_5 { width:380px; }
.grid_6 { width:460px; }
.grid_7 { width:540px; }
.grid_8 { width:620px; }
.grid_9 { width:700px; }
.grid_10 { width:780px; }
.grid_11 { width:860px; }
.grid_12 { width:940px; }

.column {
	margin: 0 10px;
	overflow: hidden;
	float: left;
	display: inline;
}
.row {
	width: 960px;
	margin: 5px auto;
	overflow: hidden;
}
.row .row {
	margin: 0 -10px;
	width: auto;
	display: inline-block;
}

/* @end grid */


/* @group Basic HTML Elements */
/* Define styles for basic elements: body, h1-h6, ul, ol, a, p, etc. */

article, footer, header, nav {display: block;}

a {
	color: #000;
	text-decoration: none;
}

article {
	background: #fff url(../img/pricetag.png) no-repeat top right;
	border: 1px solid #fff;
	display: block;
	margin: 10px !important; /* to ensure the visibility of the drop shadow */
	position: relative;
}

.no_bg {
	background-image:none;
}

article footer {text-align: center;}

article h1, article p {margin: 10px 50px;}

body {
	background: #fff no-repeat top center;
	color: #000;
	cursor: default;
	font: 13px/1.5 "Helvetica Neue", Helvetica, Geneva, sans-serif;
	font-weight: 300;	
}

em {font-style: normal;}

h1, h2, h3, h4, h5, h6 {
	color: #1b80b2;
	font-weight: 300;
}

h1 {
	font-family: 'Lobster';
	font-size: 30px;
	color: #000;
}

h1 em {
	font-family: 'Lobster';
	color: #000;
	display: block;
	font-size: 22px;
	padding: 0 5px;
}

h2 {
	font-family: 'Lobster';
	font-size: 20px;
}

h3 {
	font-size: 15px;
	font-weight: bolder;
}

label {vertical-align: text-top;}

label, p, select {
	font-size: 15px;
	font-weight: 200;
	line-height: 2;
}

.padded {
	font-size: 15px;
	font-weight: 200;
	line-height: 2;
        padding:15px;
}

/* @end basic elements */


/* @group Background */

img.bg {
	/* Set rules to fill background */
	min-height: 100%;
	min-width: 1024px;

	/* Set up proportionate scaling */
	width: 100%;
	height: auto;

	/* Set up positioning */
	position: fixed;
	top: 0;
	left: 0;
}

@media screen and (max-width: 1024px){
	img.bg {
		left: 50%;
		margin-left: -512px;
	}
}

/* @end background */


/* @group Layout */

.canvas {
	background: #fff;
	border: 1px solid #fff;
	display: block;
	margin: 10px;
	min-height: 725px;
}

.headline {
	/*background: url(../img/bg-headline.png) no-repeat 10px 22px;*/
	color: #1B80B2;
	font-family: 'Lobster', 'Helvetica Neue', Helvetica, Geneva, sans-serif;
	font-size: 24px;
	padding: 25px;
}

.headline span {
	display: inline-block;

}

#container {
	position: relative;
}

#container>header {
	padding: 10px 0;
	top: 0;
	width: 100%;
}

#content {
	margin-top: 20px;
}

#home article:last-child {
	left: 160px;
	position: relative;
}

#notify {
	background: #fff;
	border-bottom: 1px solid #fff;
	height: 50px;
	left: 0;
	padding: 20px 0;
	position: absolute;
	text-align: center;
	top: 0;
	width: 100%;
}

header #logo {
	left: 100px;
	position: absolute;
	top: -50px;
}

header nav {padding: 10px;}

header nav ul {float: right;}

/* @group Layers */

#container>header {z-index: 1000;}

/* @end layers */

/* @end layout */


/* @group Lists */

.inline li {
	display: -moz-inline-stack;
	display: inline-block;
	zoom:1;
	*display:inline;
	list-style-type: none;
	padding: 5px 10px;
}

.inline li:first-child {
	padding-left: 0;
}

.inline li:last-child {
	padding-right: 0;
}

/* @end lists */


/* @group Navigation */

@media screen {
	header nav a {
		background-image: url(../img/icons.png);
		background-repeat: no-repeat;
		display: block;
		text-indent: -2000px;
		width: 20px;
	}

	#basket   {background-position: 0 0;}
	#register {background-position: -20px 0;}
	#login    {background-position: -40px 0;}
}

/* @end navigation */

/* @group Canvas */

.canvas {
	position: relative;
}

.canvas>h2 {
	padding: 20px;
}

.canvas em {
	color: #000;
	font-style: normal;
}

/* @end canvas */


/* @group Forms */

button, .btn {
	background-color: #eee;
	border: 1px solid #ddd;
	border-radius: 5px;
	cursor: pointer;
	color: #000;
	font-size: 15px;
	font-weight: normal;
	line-height: 20px;
	padding: 5px 15px 6px;
	text-shadow: #fff 1px 1px 0px;
}

.form {
	padding: 0 10px;
	min-height: 450px;
}

#paymentLogin {
	min-height: 50px;
}

.form footer {
	background: #fff;	
	box-shadow: 0px -1px 10px rgba(0,0,0,0.3);
	-webkit-box-shadow: 0px -1px 10px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px -1px 10px rgba(0,0,0,0.3);
	bottom: 0;
	left: 0;
	padding: 10px 0;
	position: absolute;
	text-align: center;
	width: 100%;
}

.form .hint {
	vertical-align: middle;
}

@media screen {
	.form .hint {
		background: url(../img/show-hint.png) no-repeat top left;
		display: inline-block;
		height: 13px;
		position: relative;
		top: 3px;
		width: 13px;
	}
	.form .hint span {display: none;}
}

.form label {font-weight: bolder;}

.form input[type="select"], .form input[type="text"], .form input[type="password"] , .form input[type="select"]{
	border: 1px solid #ddd;
	border-radius: 5px;
	font-size: 15px;
	height: 21px;
	line-height: 20px;
	padding: 4px;
}

.form input[type="text"]:focus,.form input[type="select"]:focus, .form input[type="password"]:focus {
	background: #fafafa;
	border: 1px solid rgb(82, 168, 236);
	border: 1px solid rgba(82, 168, 236, 0.746094);
}

textarea {
	border: 1px solid #ddd;
	border-radius: 5px;
	font-size: 15px;
	height: 70px;
	line-height: 20px;
	padding: 4px;
        width:50;
}

textarea:focus {
	background: #fafafa;
	border: 1px solid rgb(82, 168, 236);
	border: 1px solid rgba(82, 168, 236, 0.746094);
}

.form .pos {
	color: #1b80b2;
	font-size: 15px;
	font-weight: 200;
	line-height: 2;
	text-decoration: underline;
}

.span {
	color: #1b80b2;
	font-size: 15px;
	font-weight: 200;
	line-height: 2;
}

.form .row {padding: 2px 0;}

.form .row:hover {
	/*background: rgba(255, 89, 107, 0.3);
	border-radius: 5px;*/
}

legend {
	font-family: 'Lobster';
	font-size: 14px;
}

/* @group Measurement capture */

#measurement-hints {height: 550px;}

#measurement-hints img {padding-top: 25px;}

#measurement-hints li {
	height: 550px;
	overflow: auto;
}

/* @end measurement capture */

/* @end forms */

/* @group Misc */

.actions {
	padding: 20px 0;
}

.actions li {
	display: inline;
	list-style-type: none;
}

.recom {
	font-family: 'Lobster';
	font-size: 18px;
	padding: 10px;
}

.cart {
	background: url(../img/cart.png) no-repeat top left;
	display: block;
	float: left;
	text-indent: -2000px;
	width: 20px;
}

.shirtcount {
    width:30px;
    margin: 0px 20px;
}

.shirtcomment {
    width: 120px;
    height: 40px;
}

#fabrics {
	max-height: 365px;
	overflow: auto;
}

#fabrics li {
	background-image: url(../img/fabrics.png);
	background-repeat: no-repeat;
	height: 42px;
	margin: 2px;
	width: 56px;
}

#fabrics li span {
	color: #000;
	display: block;
	left: 60px;
	position: relative;
	width: 100px;
}

#darkblue    {background-position: 0 -420px;}
#darkblue .fabric-preview div  {background-position: 0 0;}
#lightblue   {background-position: -56px -420px;}
#lightblue .fabric-preview div  {background-position: -280px 0;}
#turquoise   {background-position: -112px -420px;}
#turquoise .fabric-preview div  {background-position: -560px 0;}
#green       {background-position: -168px -420px;}
#green .fabric-preview div  {background-position: -840px 0;}
#lila        {background-position: -224px -420px;}
#lila .fabric-preview div  {background-position: -1120px 0;}
#grey        {background-position: -280px -420px;}
#grey .fabric-preview div  {background-position: -1400px 0;}
#marble      {background-position: -336px -420px;}
#marble .fabric-preview div  {background-position: -1680px 0;}
#bluestriped {background-position: -392px -420px;}
#bluestriped .fabric-preview div  {background-position: 0 -210px;}
#blueshadow  {background-position: -448px -420px;}
#blueshadow .fabric-preview div  {background-position: -280px -210px;}
#pencil      {background-position: -504px -420px;}
#pencil .fabric-preview div  {background-position: -560px -210px;}
#whiteshadow {background-position: -560px -420px;}
#whiteshadow .fabric-preview div  {background-position: -840px -210px;}
#lilachecked {background-position: -616px -420px;}
#lilachecked .fabric-preview div  {background-position: -1120px -210px;}
#whitechecked{background-position: -672px -420px;}
#whitechecked .fabric-preview div  {background-position: -1400px -210px;}
#greychecked {background-position: -728px -420px;}
#greychecked .fabric-preview div  {background-position: -1680px -210px;}

.fabric-preview {
	background: #fff;
	border: 1px solid grey;
	display: none;
	left: 500px;
	padding: 20px;
	position: absolute;
	top: 200px;
	z-index: 100;
}

.fabric-preview h2, .fabric-preview p {
	color: #000;
}

.fabric-preview div {
	background-image: url(../img/fabrics.png);
	height: 210px;
	width: 280px;
}

#fabrics li:hover .fabric-preview {
	display: block;
}

#fabrics input[type="radio"] {
	clear: both;
	display: block;
}

/* @end misc */

/* @group Progressive enhancements */

/* @group Box shadows */
/* h offset | v offset | blur | color */

article:hover, .canvas {
	-webkit-box-shadow: 1px 1px 10px rgba(0,0,0,0.3);
	-moz-box-shadow: 1px 1px 10px rgba(0,0,0,0.3);
	box-shadow: 1px 1px 10px rgba(0,0,0,0.3);
	margin: 10px !important; /* to ensure the visibility of the drop shadow */
}

input[type="text"]:focus,input[type="select"]:focus, input[type="password"]:focus {
	-webkit-box-shadow: 0px 0px 8px rgba(64, 192, 255, 0.496094);
	-moz-box-shadow: 0px 0px 8px rgba(64, 192, 255, 0.496094);
	box-shadow: 0px 0px 8px rgba(64, 192, 255, 0.496094);
}

/* @end box shadows */

/* @group Hover effects */
@media screen {

	a:hover {
		text-decoration: underline;
	}

	.form .pos:hover {
		color: #000;
	}
	
	article:hover footer {
		background: #fff;
		box-shadow: 0px -1px 10px rgba(0,0,0,0.3);
		-webkit-box-shadow: 0px -1px 10px rgba(0,0,0,0.3);
		-moz-box-shadow: 0px -1px 10px rgba(0,0,0,0.3);
	}
	
	.btn:hover {
		border: 1px solid #999;
		color:  #000;
		text-decoration: none;
	}

	#basket:hover   {background-position: 0 -20px;}
	#register:hover {background-position: -20px -20px;}
	#login:hover    {background-position: -40px -20px;}
}
/* @end hover effects */

/* @group Rounded corners */


.btn, .canvas, .tipsy-inner, button, input[type="text"], input[type="password"], input[type="select"] {
	-khtml-border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}

/* @end rounded corners */

/* @group Transitions */

article {
	-webkit-transition-duration: .2s, .2s, .2s;
	-webkit-transition-property: background, border-color, color;	
}

input[type="text"] , input[type="select"] {
	-webkit-transition: border 0.2s linear, -webkit-box-shadow 0.2s linear;
}

/* @end transitions */

/* @group Transparencies */

.canvas, #notify, article {background-color: rgba(255,255,255,0.8);}

/* @end transparencies */

/* @group Gradients */

.btn, button {
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#fff), to(#ddd));
	background: -moz-linear-gradient(top, #fff, #ddd);
}

/* @end gradients */
/* @end progressive enhancements */

/* @group jQuery plugins */

/* @group tipTip */
/* TipTip CSS - Version 1.2 */

#tiptip_holder {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 999;
}

#tiptip_holder.tip_top {
	padding-bottom: 5px;
}

#tiptip_holder.tip_bottom {
	padding-top: 5px;
}

#tiptip_holder.tip_right {
	padding-left: 5px;
}

#tiptip_holder.tip_left {
	padding-right: 5px;
}

#tiptip_content {
	font-size: 13px;
	font-weight: bolder;
	line-height: 2;
	color: #000;
	/*text-shadow: 0 0 2px #000;*/
	padding: 4px 8px;
	border: 1px solid #fff;
	background-color: #fff;
	background-color: rgba(255,255,255,0.9);
	/*background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(transparent), to(#000));*/
	border-radius: 6px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	box-shadow: 0 0 3px #555;
	-webkit-box-shadow: 0 0 3px #555;
	-moz-box-shadow: 0 0 3px #555;
}

#tiptip_arrow, #tiptip_arrow_inner {
	position: absolute;
	border-color: transparent;
	border-style: solid;
	border-width: 6px;
	height: 0;
	width: 0;
}

#tiptip_holder.tip_top #tiptip_arrow {
	border-top-color: #fff;
	border-top-color: rgba(255,255,255,0.35);
}

#tiptip_holder.tip_bottom #tiptip_arrow {
	border-bottom-color: #fff;
	border-bottom-color: rgba(255,255,255,0.35);
}

#tiptip_holder.tip_right #tiptip_arrow {
	border-right-color: #fff;
	border-right-color: rgba(255,255,255,0.35);
}

#tiptip_holder.tip_left #tiptip_arrow {
	border-left-color: #fff;
	border-left-color: rgba(255,255,255,0.35);
}

#tiptip_holder.tip_top #tiptip_arrow_inner {
	margin-top: -7px;
	margin-left: -6px;
	border-top-color: rgb(255,255,255);
	border-top-color: rgba(255,255,255,0.9);
}

#tiptip_holder.tip_bottom #tiptip_arrow_inner {
	margin-top: -5px;
	margin-left: -6px;
	border-bottom-color: rgb(255,255,255);
	border-bottom-color: rgba(255,255,255,0.9);
}

#tiptip_holder.tip_right #tiptip_arrow_inner {
	margin-top: -6px;
	margin-left: -5px;
	border-right-color: rgb(255,255,255);
	border-right-color: rgba(255,255,255,0.9);
}

#tiptip_holder.tip_left #tiptip_arrow_inner {
	margin-top: -6px;
	margin-left: -7px;
	border-left-color: rgb(255,255,255);
	border-left-color: rgba(255,255,255,0.9);
}

/* Webkit Hacks */
@media screen and (-webkit-min-device-pixel-ratio:0) {	
	#tiptip_content {
		padding: 4px 8px 5px 8px;
		background-color: rgba(255,255,255,0.9);
	}
	#tiptip_holder.tip_bottom #tiptip_arrow_inner { 
		border-bottom-color: rgba(255,255,255,0.9);
	}
	#tiptip_holder.tip_top #tiptip_arrow_inner { 
		border-top-color: rgba(255,255,255,0.9);
	}
}
/* @end tiptip */

/* @group Contactable */
#contactable {
	background-image:url(../img/contact.png);
	color:#FFFFFF;
	background-color:#000;
	cursor:pointer;
	height:102px;
	left:0;
	margin-left:-5px; 
	*margin-left:-5px; 
	overflow:hidden;
	position:fixed;
	*position:absolute;
	text-indent:-100000px;
	top:202px;
	*margin-top:10px;
	width:44px;
	z-index:100000;
}

#contactForm {
	background-color:#000;
	border:2px solid #FFFFFF;
	color:#FFFFFF;
	height:450px;
	left:0;
	margin-left:-400px;
	*margin-left:-434px;
	margin-top:-160px;
	overflow:hidden;
	padding-left:30px;
	position:fixed;
	top:300px;
	width:360px;
	*width:394px;
	z-index:99;
}

form#contactForm input {
	background:#fff none repeat scroll 0 0;
	outline-style:none;
	outline-width:medium;
	width:325px;
	padding:5px;
	border:1px solid #dfdfdf;
	font-size:1em;
	margin-bottom:10px;
}

#commentcustomer {

}

form#contactForm .submit {
	background: #F5410F none repeat scroll 0 0;
	outline-style:none;
	outline-width:medium;
	width:325px;
	padding:5px;
	border:3px solid #F52D0F;
	outline-color:-moz-use-text-color;
	font-family: georgia;
	font-size:1em;
	cursor:pointer;
	color:#FFF;
	text-transform:uppercase;
	font-weight:bolder;
	font-family:Helvetica;
	margin-top:10px;
}

form#contactForm p {
	width:325px;
	font-size:0.9em;
}

form#contactForm .disclaimer {
	*margin-left:20px;
}

#contactForm .red {
	color:	#F5410F;
}

#overlay {
	background-color:#000;
	display:none;
	height:100%;
	left:0;
	margin:0;
	padding:0;
	position:absolute;
	top:0;
	width:100%;
	z-index:0;
} 
.error { background-color: #FF3300; padding: 10px 50px }
.success { background-color: #66FF66; padding: 10px 50px }
.warning { background-color: #FF6600; padding: 10px 50px ; line-height:1em}


.inputError { background-color: #FF3300}
.inputSuccess { background-color: #66FF66}

#name.error { background-color: #EDBE9C; } 
#email.error { background-color: #EDBE9C; }
#comment.error { background-color: #EDBE9C; }

form#contactForm label{
	*margin-left:20px;
}

form#contactForm #loading {
	background: url(../img/ajax-loader.gif) no-repeat;
	width:55px;
	height:55px;
	margin: 100px auto;
	display:none;
}

#callback {
	font-family: georgia;
	font-size:1.1em;
	color: #FFF;
	width:325px;
	margin: 100px auto;	
	display:none;
}


.holder {
	margin:0 auto;
	*margin-left:20px;
	padding-top:20px;	
}	

/* @end contactable */

/* @end jquery plugins */

/* @group Debug */

#details, #registration, #signin {margin-bottom: 60px;}
#shirt-model, #shirt-back {
	height: 460px;
	overflow: hidden;
	position: relative;
}
#shirt-model>svg, #shirt-back {
	position: absolute;
	top: 0;
}

#shirt-back {
	height: 300px;
	left: 590px;
	top:  525px;
}

#fabric-indicator {
	background: url(../img/a-fabric.jpg) no-repeat;
	border: 1px solid #eee;
	height: 60px;
}

.canvas footer {
	background: #fff;	
	box-shadow: 0px -1px 10px rgba(0,0,0,0.3);
	-webkit-box-shadow: 0px -1px 10px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px -1px 10px rgba(0,0,0,0.3);
	bottom: 0;
	display: block;
	left: 0;
	padding: 10px 0;
	position: absolute;
	text-align: center;
	width: 100%;
}

#paypal, #slip {
	left: 50px;
	margin-bottom: 60px;
	margin-top: 30px;
	position: relative;
}

#paypal p, #slip p {
	color: #aaa;
}

/* @end debug */

#logout {
	background: url() no-repeat 10px 22px;
	text-indent: 0px;
	width: auto;
}
#changePassword {
	background: url() no-repeat 10px 22px;
	text-indent: 0px;
	width: auto;
}
#myOrders {
	background: url() no-repeat 10px 22px;
	text-indent: 0px;
	width: auto;
}

/* @group Experimental */

.shirt-preview {
	background-image: url(../img/preconfigured.png);
	height: 242px;
	margin: 10px 50px;
	width: 200px;
}

.uni .shirt-preview {background-position: -200px 0;}
.cocktail .shirt-preview {background-position: -400px 0;}

.smallbtn {
	background: black;
	border: white;
	color: white;
	border-radius: 10px;
	font-size: 11px;
	padding: 4px 10px;
	text-decoration: none;
}
#index .smallbtn {display: none; margin-left: 50px;}

/* @end experimental */

.selected {
    border: 1px solid red;
}

.fabric_label {
	border-radius: 10px;
	font-size: 11px;
	text-decoration: none;
}

.fieldset_title {
	font-size: 18px;
	font-weight: bold;
}

#feedback-btn {
	background: url(../img/feedback.png);
	position: fixed;
	left: -2px;
	top: 30%;
	height: 80px;
	width: 30px;
}

#feedback-btn:hover {
	left: 0;
}

#cartTotal {
    border-top: 1px solid #1B80B2;
}

#cartTotalWithDiscount {
    border-style:solid none double none;
    border-color: #1B80B2;
    border-width: 1px;
    font-weight: bold;
}

.bigBlueLink {
	color: #1b80b2;
	font-size: 16px;
        font-weight: bold;

}