/******************************************************************************
		
		C  S  S   -   D  A  T  E  I
		
		Projekt		:	Deine Körbchengröße		STYLES	2012
		
		Copyright	:	a-concept internet.studio
						http://a-concept.de
		
******************************************************************************/


/*	HELPFUL CLASSES
*******************************************************************************/
.invisible	{
	display: none;
}

.floatLeft {
	float: left;
	}

.floatRight {
	float: right;
	}


/*	IMAGE-CONTAINER
*******************************************************************************/
div.image {
	border:none;
	background:none;
}
div.image.floatRight {
	clear:right;
	margin:0 0 12px 12px;
}
div.image.centered {
	margin: 2px auto;
}


/*	a-concept Schriftzug
*******************************************************************************/
.acoinst {
	font-weight: bold;
}
.acoinst span {
	font-weight: normal;
	font-size:65%;
	position:relative;
	bottom:-0.25em;
}


/*	LINKS
*******************************************************************************/
a {
	text-decoration: underline;
	color: #AB5C17;
}

a:hover {
	text-decoration: none;
	color: #5B2F12;
}


/*	LOGO-TYPO
*******************************************************************************/
#header h6 {
	position: absolute;
	top: 30px;
	right: 5%;
	text-transform: uppercase;
	font-size: 41px;
	line-height: 38px;
}
#header h6 span {
	text-transform: lowercase;
}
#header h1 {
	position: absolute;
	top: 70px;
	right: 5%;
	font-size: 18px;
	line-height: 16px;
	font-weight:normal;
}
#header h1 a, 
#header h6 a {
	text-decoration: none;
	color: #120D0A;
}


/*	MAIN NAVIGATION
*******************************************************************************/
ul.rex-navi1 a {
	text-decoration:none;
}

ul.rex-navi1 li {
	float: left;
	list-style: none;
	margin-right: 35px;
}

ul.rex-navi1 li ul.rex-navi2 {
	position: absolute;
	bottom: 35px;
}

ul.rex-navi1 ul.rex-navi2 li {
	float: none;
	margin-bottom: 2px;
}

ul.rex-navi1 a.rex-active:hover,
ul.rex-navi1 a {
}

ul.rex-navi1 a:hover,
ul.rex-navi1 a.rex-active,
ul.rex-navi1 a.rex-current {
	text-decoration:underline;
}

ul.rex-navi2 a {
	color: #888;
}

ul.rex-navi2 a:hover,
ul.rex-navi2 a.rex-active,
ul.rex-navi2 a.rex-current {
	color: #444;
}

ul.rex-navi2 a.rex-current:before {
	content:"» ";
}


/*	TEXT STYLES
*******************************************************************************/
#contentContainer p {
	margin: 0 5% 10px 5%;
}

#contentContainer ol,
#contentContainer ul {
	margin: 0 5% 10px 7%;
}

#contentContainer h1 {
	margin:8px 5% 20px 5%;
	font-size:36px;
	line-height:34px;
	font-weight:normal;
}
#contentContainer h2, 
#contentContainer h3, 
#contentContainer h4, 
#contentContainer h5, 
#contentContainer h6 {
	margin:10px 5% 10px 5%;
	font-size:26px;
	line-height:24px;
	font-weight:normal;
}

div#textAD{
	margin:0 0 12px 12px;
	padding:5px;
	width:290px;
	float:right;
	clear:right;
	border:1px solid black;
	background-color:#fff;
}


/*	BRA FORM STYLES		BRA TEXT STYLES		BRA TABLE STYLES
*******************************************************************************/
#braForm {
	position: relative;
	top:0px;
	float:right;
	width:300px;
	height:273px;
	border:1px solid #120D0A;
	background: url('300px-modern_bra_plunge.jpg') no-repeat center center;
	margin:0 0 12px 12px;
}
#braForm legend {
	background-color:#fff;
	font-size:130%;
	text-align:center;
}

#braForm label {
	position: absolute;
	font-size:90%;
	line-height:100%;
	background-color:#fff;
	padding-right:5px;
}
#labelBrustumfang {
	top:123px;
	right:88px;
}
#labelUnterbrustweite {
	top:193px;
	right:92px;
}

#braForm .text {
	position: absolute;
	width:50px;
	font-family: 'Ubuntu Condensed', sans-serif;
	font-size:120%;
	text-decoration: none;
	color: #120D0A;
	text-align:center;
}

#brustumfang {
	bottom:127px;
	right:38px;
	border:2px solid red;
	background-color:red;
}
#brustumfang:focus,
#brustumfang:hover,
#unterbrustweite:focus,
#unterbrustweite:hover {
	background-color:#fff;
}
#unterbrustweite {
	top:184px;
	right:42px;
	border:2px solid #FFD800;
	background-color:#FFD800;
}

#braForm .braFormSubmit {
	position:absolute;
	left:32%;
	bottom: 10px;
	width:45%;
	text-align:center;
	border: 2px solid 120D0A;
	background-color: #fff;
	font-family: 'Ubuntu Condensed', sans-serif;
	font-size:90%;
	text-decoration: none;
	color: #120D0A;
	padding: 0.35em;
	cursor:pointer;
}
#braForm .braFormSubmit:hover {
	background-color:#ddd;
	color:#5B2F12;
}

span.braSize {
	font-size: 300%;
	line-height: 100%;
}		
span.inputSize {
	font-size: 150%;
	line-height: 100%;
}
.errorMessage {
	font-size: 150%;
	line-height: 100%;
	color: #f00;
}

#tableSizes {
	float:right;
	clear:right;
	background-color:#fff;
	width:300px;
	border:1px solid #120D0A;
	margin:0 0 12px 12px;
}
#tableSizes th,
#tableSizes td {
	height:2em;
	width:16%;
	vertical-align: middle;
	text-align:center;
}
#tableSizes td.sizeMinus0 {
	background-color:#fafafa;
	color:#f00;
}
#tableSizes td.sizeMinus1 {
	background-color:#eee;
}
#tableSizes td.sizeMinus2 {
	background-color:#ddd;
}