@charset "utf-8";
/* CSS created and developed by 12bis3.de */

/* --------------
basic definitions
-------------- */


body {
	color: #383838;
	font-size: 100%;
	height: 100%;
	background: #fff no-repeat fixed url(../images/wine-gateway-europe-wine-cellar.jpg);
	background-size:cover;
	font-family: 'Open Sans', Arial, Helvetica, sans-serif;
	font-weight: 400;
	padding: 0;
	margin: 0;
}

html {
	height: 101%;
}

ul#skip-links {
	position: absolute;
	left: -9999px;
}

a {
	text-decoration: none;
	color: #13235b;
	outline: none;
}

a:hover, a:focus {
	
}

b, strong {
	font-weight: 600;
}

i, em {
	font-style:italic;
}

img {
	border: none;
	outline: none;
}

h1, h2, h3, h4, h5, h6, p, ul, ol, dl {
	padding: 0;
	margin:0;
}



/* -------------
main definitions
--------------*/

div#container {
	width: 100%;
	margin: 0 auto;
	overflow: hidden;
	line-height: 150%;
	margin-bottom: 50px;
}




/* ---------------
header definitions
----------------*/

header {
	width: 100%;
}

header > div {
	width: 900px;
	margin: 0 auto;
	height: 150px;
	position: relative;
}

header a img {
	top: 25px;
	left: 0;
	right: auto;
}

header img {
	position: absolute;
	right: 0;
	top: 70px;
}


/* ------------------
navigation defintions
------------------- */

nav {
	width: 100%;
	position: fixed;
	background: rgba(56,30,22,0.6); 
	bottom: 0
}

nav > div {
	width:787px;
	padding: 0 0 0 113px;
	height: 50px;
	margin: 0 auto;
}

nav ul {
	overflow: hidden;
	margin: 0;
	list-style-type: none;
	display: block;
}

nav ul li {
	display: inline-block;
	margin: 0 17px;
}

nav ul li a {
	display: inline-block;
	padding: 13px 15px;
	font-size:112.5%;
	text-transform: uppercase;
	color: #fff;
	font-weight: 300;
	background: none;
	-webkit-transition: background 0.5s ease, color 0.5s ease;
    transition: background 0.5s ease, color 0.5s ease;
}

nav ul li a:hover, nav ul li a:focus, nav ul li a.nav-active {
	background: rgba(255,255,255,0.5); 
	color: #fff
}

nav ul li:last-of-type {margin: 0; float: right}
nav ul li:last-of-type a {font-size: 66.6%; padding: 15px 0 0 0; background: none}
nav ul li:last-of-type a:hover, nav ul li:last-of-type a:focus, nav ul li:last-of-type a.nav-active {background: none; color: #fff; text-decoration: underline}	



/* ----------------
content definitions
-----------------*/

#content {
	width: 100%;
	background: rgba(255,255,255,0.7);
}

#content > div {
	width:655px;
	padding: 40px 100px 30px 145px;
	margin: 0 auto;
}


h1 {
	font-size: 175%;
	color: #13235b;
	margin-bottom: 0.7em;
	line-height:115%;
	letter-spacing:0.05em;
	position: relative;
	font-weight:400;
}


h2 {
	font-size: 137.5%;
	margin-bottom: 0.6em;
	line-height:115%;
	letter-spacing: 0.05em;
	font-weight:400;
	color: #13235b;
}

h3 {
	font-size: 150%;
	margin-bottom: 0.7em;
	color: #666;
	font-weight: 300;
	letter-spacing:0.08em;
}

h4 {
	font-size: 137.5%;
	margin-bottom: 0.5em;
	color: #666;
	font-weight: 300;
}

h5 {
	font-size: 112.5%;
	font-weight: normal;
	margin-bottom: 0.3em;
	color: #666;
	font-weight: 300;
}

h6 {
	font-size: 100%;
	font-weight: normal;
	margin-bottom: 0.3em;
	color: #666;
	font-weight: 5300;
}

p {
	margin-bottom:1em;
}

#content ul {
	margin: 0 0 1em 30px;
	list-style-type: none;
}

#content ul li, #content ol li {
	margin-bottom: 0.2em;
}

#content ul li:before {
	width: 7px;
	height: 7px;
	content: "• ";
	margin: 0 11px 0 -16px;
	display: inline-block;
	vertical-align: -1px;
}	

#content ol {
	margin: 0 0 1em 30px;
}

figure.image-left {
	margin: 0.4em 20px 0.6em 0;
	float: left;
}

figure.image-right {
	margin: 0.4em 0 0.6em 20px;
	float: right;
}

figure.image-content {
	margin: 1.2em 0 1.2em 0;
	padding: 0;
	text-align:center;
}

figure.image-content img {
	display: block;
}


figure.images {
	margin: 2em 0;
	overflow: hidden;
}

figure.images img {
	width: 100%;
	height: auto;
	margin: 0 0 10px 0;
	display: block;
}

figure.images p {text-align:right; clear: left; padding-top: 0.8em;}

figcaption {
	color: #333;
	font-size:87.5%
}

.acc-content.acc-active {
	display: block;
}

.acc-list.acc-active li:last-of-type {
	border: none;
}

h3.acc-head, h4.acc-head {
	padding: 15px 10px;
	font-size:137.5%;
	letter-spacing:0.05em;
	margin: 0 0 10px 0;
	position: relative;
	cursor: pointer;
	background: #f5e6ee;
	-webkit-transition: color 0.5s ease, background-color 0.5s ease;
    transition: color 0.5s ease, background-color 0.5s ease;
	color:#a00e59;
}
h4.acc-head {padding: 8px 10px; font-size:125%; padding-left:190px}

h3.acc-head:last-of-type {
	margin-bottom: 1.5em;
}

h3.acc-head a, h4.acc-head a {
	float: right;
	text-indent:-9999px;
	background: url(../images/sprite-24.png) no-repeat -76px -1px;
	margin-top:10px;
	width:47px;
	height:24px;
	display: inline-block;
}
h4.acc-head a {background-position:  -76px -1px; margin-top:0;}

h3.acc-head.acc-active a {background-position:-124px -1px}
h4.acc-head.acc-active a {background-position:  -124px -1px}
h3.acc-head a:last-of-type, h3.acc-head.acc-active a:first-of-type, h4.acc-head a:last-of-type, h4.acc-head a:first-of-type {display:none}
h3.acc-head.acc-active a:last-of-type, h4.acc-head a:last-of-type {display:inline-block}


h3.acc-head:hover, h3.acc-head.acc-active, h4.acc-head:hover, h4.acc-head.acc-active {
	color: #fff;
	background-color: #a00e59;
}

h3.acc-head.acc-active {
	margin: 0;
	border: none;
}


.acc-content {
	margin-bottom: 1.5em;
	background: #fff;
	padding: 25px 0 10px 0;
	display: none;
}
form .acc-content {padding: 10px 0 0 0;}

.acc-content:last-of-type {
	margin-bottom: 1.5em;
}


dl.text-image {
	width: 100%;
	overflow: hidden;
	margin-bottom: 1.5em;
}

dl.text-image dt {
	width: 120px;
	float: left;
	margin: 0.4em 20px 0 0;
}
dl.text-image dt img {width:100%; height: auto}

dl.text-image dd {
	width: 100%;
	margin: 0;
}



div.video {
	margin: 1.5em 0;
}




/* -------------
form definitions
--------------*/

#content form {
	margin: 1.5em 0 2em 0;
	overflow: hidden;
}

#content form p {
	margin-bottom: 1em;
	overflow: hidden;
}

form label {
	width: 180px;
	margin-right: 12px;
	display: inline-block;
	float: left;
	vertical-align: top;
	font-size: 100%;
	text-align: right;
	padding-top: 0.4em;
}

input, textarea, select {
	color: #383838;
	background: rgba(255,255,255,0.4);
	border: none;
	font-size: 106.25%;
	font-family: 'Open Sans', Arial, Helvetica, sans-serif;
	font-weight: 300;
	outline: none;
	-webkit-transition: background 0.5s ease;
    transition: background 0.5s ease;
	padding: 10px;
}
input:hover, textarea:hover, select:hover {background: rgba(255,255,255,0.7);}

#content input[type=text] {
	width: 400px;
}

#content input[type=submit] {
	border: none;
	width: auto;
	padding: 10px 100px;
	margin-left: 192px;
	background: rgba(255,255,255,0.8);
	font-weight:400;
	cursor: pointer;
}
#content input[type=submit]:hover {background-color: #13235b; color: #fff}

#content select {
	padding: 8px 10px;
	width: 420px;
	background: rgba(255,255,255,1);
}

#content textarea {
	padding: 10px;
	width: 400px;
	height: 200px;
	background: rgba(255,255,255,0.7);
}

p.error {color: #990000; font-weight: 400;}
p.error input, p.error select, #content p.error textarea {background: #990000; color: #fff}