/* @override http://www.twajs.com/test/templates/default.css */


/*colors:
	color: #ff5cc0;
	color: #a6a6a6;
*/	
	
@import "reset-elements.css";


a{
	text-decoration: none;
}

h1, h1 a{
	font-size:28px;	
	color: #a6a6a6;
	letter-spacing: -1px;
}
	

body {
	text-align: center;
	background: white url(background.png) repeat-x;
	font: 12px Helvetica, Arial, Sans-serif;
	color: #333;
}

div#Center{
	width: 800px;
	margin: 0 auto;
	text-align: left;
	position: relative;
}

/* Main Menu */

div#Menu{
	position: relative;
}

ul#MainMenu,
ul#MainMenuLinks,
ul#MainMenuButtons
 {
	height: 70px;
	padding: 0 1px 0 20px;
	background: url(menusides.png) no-repeat 19px;
	margin-bottom: 25px;
}


ul#MainMenuLinks
 {
	position: absolute;
	height: 70px;
	width: 600px;
	top:0;
	background: none;
	left: 0;
}

ul#MainMenu li,
ul#MainMenuLinks li,
ul#MainMenuButtons li{
	float: left;
	height: 70px;
	width: 140px;
	background: url(menubuttons.jpg) no-repeat;
	overflow: hidden;
}

ul#MainMenuLinks li{
	background: none;
}

ul#MainMenu li:hover,
ul#MainMenuButtons li.Hover
{
	background-position: 0 -70px;
}
ul#MainMenu li.Active,
ul#MainMenu li:active,
ul#MainMenuButtons li.Pressed
{
	background-position: 0 -140px;
}

ul#MainMenu li a,
ul#MainMenuLinks li a
{
	display: block;
	text-align: center;
	text-transform: uppercase;
	letter-spacing: 1px;
	position: relative;
	width: 140px;
	margin-bottom: 29px;
	height: 70px;
}


ul#MainMenu li a span,
ul#MainMenuLinks li a span{
	display: block;
	position: absolute;
	width: 140px;
	cursor: pointer;
}

ul#MainMenu li a span.shadow,
ul#MainMenuLinks li a span.shadow{
	color: #eee;
	top: 31px;
	left: 1px;
}
ul#MainMenu li a span.highlight,
ul#MainMenuLinks li a span.highlight
{
	color: #8b8b8b;
	top: 30px;
	left: 0;
}

ul#MainMenu li a:hover span.highlight,
ul#MainMenuLinks li a:hover span.highlight
{
	color: #ff5cc0;
}

ul#MainMenu li a.Active span.highlight{
	color: #777;
}


div#Logo{
	position: absolute;
	width: 270px;
	height: 150px;
	background: url(twajs-logo.png) no-repeat;
	top: 0;
	right: -53px;
	overflow: hidden;
}
div#Logo:hover{
	background-position: 0 -150px;
}

div#Logo a{
	display: block;
	position: relative;
	width: 216px;
	height: 103px;
	right: -20px;
}

div#Logo a span{
	display: none;
}


/* Sub Menu */


div#ViewSearch{
	margin-left: 20px;
	height: 75px;
	margin-bottom: 15px;
	overflow: hidden;
}

ul.ViewHeaders{
	background: url(viewsearch-bgleft.png) no-repeat 0;
	height: 34px;
	padding-left: 20px;
	float: left;
	padding-right: 5px;
	text-transform: uppercase;
	color: #a6a6a6;
}
ul.ViewHeaders li{
	float: left;
	height: 20px;
	text-align: center;
	padding-top: 11px;
	padding-right: 5px;
	padding-left: 5px;
	width: 80px;
}

/*
ul.ViewHeaders li:hover{
	cursor: pointer;
	color: #ff5cc0;
}
*/

form#SearchForm{
	float: left;
	background: url(viewsearch-bgright.png) no-repeat;
	padding-top: 4px;
	height: 30px;
	margin-left: 0;
	padding-left: 10px;
	position: relative;
	width: 190px;
}
form#SearchForm label{
	display: none;
}
form#SearchForm input#SearchField{
	background: url(search-bg.png) no-repeat 1px 6px;	
	border: 0;
	height: 18px;
	font: 12px Helvetica, Arial, Sans-serif;
	color: #a6a6a6;
	width: 140px;
	padding-right: 4px;
	padding-top: 7px;
	padding-left: 25px;
}
form#SearchForm button#SearchButton{
	cursor: pointer;
	border: 0;
	background: none;
	height: 24px;
	width: 20px;
	padding: 0;
	position: absolute;
	margin: 0;
	top: 5px;
	right: 3px;
}


div#MenuTypeContainer,
div#MenuCollectionSpecialContainer{
	clear: both;
	padding-top: 10px;
	padding-left: 10px;
}
div#MenuTypeContainer{
	background: url(viewsearch-arrow.png) no-repeat 151px 0;
}

div#MenuCollectionSpecialContainer{
	background: url(viewsearch-arrow.png) no-repeat 61px 0;
	height:30px;
}

ul#MenuType li,
ul#BrandMenu li,
ul#SpecialMenu li{
	float: left;
	height: 30px;
}

ul#MenuType li a,
ul#BrandMenu li a,
ul#SpecialMenu li a{
	display: block;
	float: left;
	padding: 10px 10px 0;
	height: 20px;
	text-transform: uppercase;
	color: #a6a6a6;
}



ul#SpecialMenu {
	float: left;
	overflow: hidden;
	width: 200px;
	padding-left: 10px;
	border-left: 1px solid #bfbfbf;
	margin-left: 10px;
}


div#MenuTypeContainer ul li a:hover,
div#MenuCollectionSpecialContainer ul li a:hover{
	color: #ff5cc0;
}


/* Footer Menu */

div#FooterMenu{
	clear: both;
	padding-top: 40px;
	margin-left: 210px;
	width: 800px;
}
div#FooterMenu p,
div#FooterMenu li a
{
	color: #a6a6a6;
	padding: 13px;
	display: block;
}

div#FooterMenu p,
div#FooterMenu li
{
	float: left;
}


div#FooterMenu p{
	cursor: default;
}

div#FooterMenu ul a{
	color: #ff5cc0;
}
div#FooterMenu a{
	color: #a6a6a6;

}

div#FooterMenu a:hover{
	text-decoration: underline;
	color: #ff5cc0;

}


/* Front Page Slide */

div#bigpicture{
	position: absolute;
	top: 0;
	left: 20px;
	width: 760px;
	height: 550px;
	overflow: hidden;
}

ul#bigpictureslide{

}
ul#bigpictureslide li{
	width: 760px;
	height: 550px;
	display: none;
}

ul#bigpictureslide li span{
	position: absolute;
	top: 80px;
	width: 760px;
	height:470px;
	overflow: hidden;
}

ul#bigpictureslide li span img.mainPart{
	position: absolute;
	top: -80px;
	left: 0;
}

ul#bigpictureslide li img.topPart{
	position: absolute;
	top: 0;
	left: 0;
}

ul#bigpictureslide li p.textonslide{
	position: absolute;
	top: 277px;
	left: 577px;
	letter-spacing: 1px;
	color: #a6a6a6;	
	font-size: 20px;
}

div#bigpicture div#roundedcorners{
	position: absolute;
	bottom: 0;
	width: 760px;
	height: 16px;
	background: url(frontpageslide-roundedcorners.png) no-repeat;
}

div#MenuFrontContainer{
	height: 550px;
}






/* Product list + Basket&Ordered listing */

#ProductListing{
	position: relative;
	left: -20px;
}

ul.basket-list,
ul.order-list{
	position: relative;
	left: -20px;
	width: 400px;
	margin-right: 20px;
}


ul.Products li,
ul.basket-list li,
ul.order-list li{
	float: left;
	position: relative;
}

ul.Products li a,
ul.basket-list li,
ul.order-list li{
	display: block;
	padding: 10px 20px 10px;
	width: 160px;
	text-align: center;
	overflow:hidden;
	height:220px;

}

ul.Products li a:hover img{
	filter:alpha(opacity=75);-moz-opacity:.75;opacity:.75;
}



ul.Products li a span,
ul.basket-list li span,
ul.order-list li span
{
	display: block;
}

ul.Products li a span.Name,
ul.basket-list li span.Name,
ul.order-list li span.Name
{
	font-size: 15px;
	color: #a6a6a6;
	margin-top: 5px;
}
ul.Products li a span.Collection,
ul.basket-list li span.Collection,
ul.order-list li span.Collection{
	color: #777;
	text-transform: uppercase;
	font-size: 10px;
	margin-top: 2px;
	letter-spacing: 1px;
}
ul.Products li a span.Price,
ul.basket-list li span.Price,
ul.order-list li span.Price{
	font-size: 16px;
	color: #ff5cc0;
	margin-top: 3px;
}

ul.basket-list li span.Price{
	margin-top: 7px;
}
ul.basket-list li a.Delete span{
	display: none;
}
ul.basket-list li a.Delete{
	display: block;
	width: 22px;
	height: 21px;
	background: url(button-delete.png) no-repeat;
	position: absolute;
	top: 150px;
	right: 18px;
}

ul.basket-list li a.Delete:hover{
	background-position: 0 bottom;
}
ul.basket-list li a.Delete:hover span{
	display: block;
	position: absolute;
	top: 25px;
	width: 50px;
	left: -15px;
	color: #999;
}


/* imageList1 = sold products */

ul#imagesList1 li{
		float: left;
}
ul#imagesList1 li a{
	display: block;
	padding: 10px 20px 10px;
	width: 160px;
	text-align: center;
}
ul#imagesList1 li a:hover img{
	filter:alpha(opacity=75);-moz-opacity:.75;opacity:.75;
}
ul#imagesList1 li a:hover img{
	filter:alpha(opacity=75);-moz-opacity:.75;opacity:.75;
}



/* Single Product Page */

div#Product{
	margin-left: 20px;
	position: relative;
}

div#Product #BigImageContainer{
	width: 760px;
	height: 400px;
	overflow: hidden;
	position: relative;
}
div#BigImageContainer img#BigImage{
	width: 360px;
	position: absolute;
	left: 0;
	top: 0;
	display: none;
}

div#Product #Images{
	width: 360px;
	width: 360px;
	overflow: hidden;	
}
div#Product #Images li{
	width: 360px;
	width: 360px;
}


div#Product #Info{
	position: absolute;
	right: 20px;
	top:0;
	width: 360px;
}

div#Product #Info h1{
	margin: 50px 0 10px;
}
div#Product #Info p.Collection{
	color: #777;
	text-transform: uppercase;
	font-size: 12px;
	margin: 10px 0 20px;
	letter-spacing: 1px;
}

div#Product #Info div.DescriptionFull{
	font-size: 12px;
	margin: 20px 0;
	line-height: 20px;
}

div#Product #Info p.Price{
	color: #ff5cc0;
	font-size: 20px;
	margin: 20px 0;
	letter-spacing: 1px;
}

div#Product #Info p.Price{
	color: #ff5cc0;
	font-size: 20px;
	margin: 20px 0;
	letter-spacing: 1px;
}

div#Product #Info form#AddBasket input,
div#basket form input,
form#orderForm input.submit
{
	border: 0;
	background: url(addtobasket.png) no-repeat;
	width: 200px;
	height: 25px;
	text-align: left;
	padding-left: 42px;
	text-transform: uppercase;
	color: #a6a6a6;
	overflow: hidden;
	font-size: 10px;
}
div#Product #Info form#AddBasket input:hover,
div#basket form input:hover{
	color: #ff5cc0;
	background-position: 0 -25px;
}


/* page */

div#page{
	left: 40px;
	position: relative;
}


/* basket */

div#basket form p{
	font-weight: bold;
	color: #777;
}
div#basket form p strong{
	font-weight: normal;
	font-size: 16px;
	color: #ff5cc0;
	margin-left: 5px;
}

div#basket form{
	position: absolute;
	right: 0;
	top: 140px;
	width: 240px;
	padding-left: 160px;
	height: 100px;
	background: url(basket-arrow.png) no-repeat 80px 23px;
}
div#basket form input{
	display: block;
	margin-top: 15px;
}


/* order page */

#order legend{
	display: none;
}
#order p.order-summary{
	display: block;
	float: right;
	width: 240px;
	padding-top: 20px;
	padding-bottom: 10px;
	font-weight: bold;
	color: #777;
}
#order p.order-summary strong{
	font-weight: normal;
	font-size: 16px;
	color: #ff5cc0;
	margin-left: 5px;
}

form#orderForm{
	width: 400px;
	float: right;
	background: url(basket-arrow.png) no-repeat 85px 315px;
}

form#orderForm #lastName, form#orderForm #city{
	display: none;	
}

fieldset#personalDataBlock div{
	margin-bottom: 10px;
	height: 25px;
	background: url(form-text-input.png) no-repeat right top;
}
fieldset#personalDataBlock div#comment{
	margin-bottom: 10px;
	height: 80px;
	background: url(form-textarea.png) no-repeat right top;
}

fieldset#personalDataBlock label{
	padding-top: 8px;
	display: block;
	width: 145px;
	text-align: right;
	float: left;
	clear: both;
	color: #777;
	text-transform: uppercase;
	font-size: 10px;
	margin-top: 2px;
	letter-spacing: 1px;
}
fieldset#personalDataBlock input{
	width: 220px;
	padding-top:6px;
	height: 17px;
	margin-top:1px;
	margin-right: 10px;
	float: right;
	border: 0;
	background: none;
}

fieldset#personalDataBlock textarea{
	width: 220px;
	padding-top:6px;
	height: 70px;
	float: right;
	border: 0;
	background: none;
	margin-top:1px;
	margin-right: 10px;
}

fieldset#personalDataBlock input,
fieldset#personalDataBlock textarea{
	font: 12px Helvetica, Arial, Sans-serif;
	color: #333;
}
form#orderForm span{
	width: 218px;
	height: 50px;
	float: right;
}
form#orderForm em{
	float: left;
	margin-left: 160px;
}
form#orderForm input.submit{
	display: block;
	clear: both;
	float: left;
	margin-left: 160px;
	margin-top: 10px;
	margin-bottom: 30px;

}
form#orderForm a{
	color: #ff5cc0;
}

/* thank you */

div#order-thanks{
	height: 240px;
	margin-top:50px;
	width: 280px;
	padding-right: 220px;
	background: url(check-done.jpg) no-repeat right top;
}

div#order-thanks h1{
	padding-top: 20px;
}

div#order-thanks p.order-id{
	font-weight: bold;
	color: #777;
	margin: 20px 0;
}
div#order-thanks p.order-id strong{
	font-weight: normal;
	font-size: 16px;
	color: #ff5cc0;
	margin-left: 5px;
}

div#order-thanks p{
	line-height: 20px;
	margin-bottom: 20px;
}
div#order-thanks p a{
	color: #ff5cc0;
}



/* plain pages */

div#page div.DescriptionFull p{
	margin-bottom: 10px;
	line-height: 20px;
}

div#page div.DescriptionFull p a{
	color: #ff5cc0;
}


div#page div.DescriptionFull h1{
	margin-bottom: 10px;	
}


/* kollektioner */
ul.kollektion li img{
	display:block;
	clear:both;
	float:left;
	margin-bottom:20px;
}

ul.kollektion li div{
	display:block;
	float:left;
	width:300px;
	margin-left:20px;
	margin-top:40px;
}