/* -------------------------------------------------------------- */
/* -------------------------------------------------------------- */
/* --------------------- HELENA DE VALLIER ---------------------- */
/* -------------------- ORIENTALISCHER TANZ --------------------- */
/* -------------------------------------------------------------- */
/* -------------------------  C S S ----------------------------- */
/* ----------------------- HANDCODED BY ------------------------- */
/* ------------------------ STUDIO PXP -------------------------- */
/* -------------------------------------------------------------- */
/* ---------------- _._ --- _,-'""`-._ -------------------------- */
/* --------------- (,-.`._,'(       |\`-/| ---------------------- */
/* ------------------- `-.-' \ )-`-( , o o) --------------------- */
/* -------------------------- `_----\`_`"\_ --------------------- */
/* -------------------------------------------------------------- */
/* -------------------------------------------------------------- */

h1,h2,h3,p,h5,ul {
	font-family: 'Crimson Text', serif;
	}

h1	{
	font-size: 21px;
	line-height: 23px;
	font-weight: 400;
	font-style: italic;
	letter-spacing: 1px;
	color: #F0F;
	text-transform: uppercase;
	margin-top: 8px;
	}

h2	{
	font-size: 17px;
	font-weight: 500;
	font-style: italic;
	line-height: 19px;
	letter-spacing: 0.4px;
	color:#A6D;
	text-transform: uppercase;
	}

h3	{
	font size: 17px;
	font-weight: 300;
	font-style: italic;
	letter-spacing: 0.4px;
	color: #F0F;
	text-transform: uppercase;
	margin-top: 0px;
	margin-bottom: 12px;
	}

p 	{
	margin-top: -4px;
	font-size: 14px;
	line-height: 16px;
	letter-spacing: 0.3px;
	color:#84B;
	}
	
h5	{
	font-size: 9px;
	line-height: 11px;
	letter-spacing: 1.2px;
	color:#84B;
	}
	
a   {
	color: #C6F;
	text-decoration: none;
	}

a:hover {
	text-decoration: underline;
	}
	
/* -------------------- NAVIGATION ------------------------- */

ul {
    	padding: 0px;
	font-size: 17px;
	font-weight: 300;
	font-style: italic;
	text-transform: uppercase;
	color:#84B;
	}
	
/* -------------------------------------------------------- */


body 	{ 
	background: #000 url(../pictures/background.jpg) no-repeat left top fixed; 
	background-color: black;
	}

#main 	{
	margin: 300px auto;
	padding: 32px;
	max-width: 600px;
	background-color: #000;
 	-moz-box-shadow: 	0px 0px 40px #000;
  	-webkit-box-shadow:	0px 0px 40px #000;
  	box-shadow:		0px 0px 40px #000;
	}
	
header  {
	text-align: center;
	padding-bottom: 12px;
	border-bottom: 1px solid #F0F;
	}

#logo	{
	padding-bottom: 8px;
	border-bottom: 1px solid #F0F;
	}

nav	{
	padding-top: 12px;
	}

section {
	text-align:left;
	padding: 12px;
	border-bottom: 1px solid #F0F;
	}

footer  {
	text-align:center;
	}

/* -------------------------------------------------------------- */
/* ----------------------- EMBEDDED VIDEOS ---------------------- */
/* -------------------------------------------------------------- */

.video-container {
    	position: relative;
    	padding-bottom: 56.25%;
    	padding-top: 30px; height: 0; overflow: hidden;
	}
 
.video-container iframe,
.video-container object,
.video-container embed {
    	position: absolute;
    	top: 0;
    	left: 0;
    	width: 100%;
    	height: 100%;
	}

/* -------------------------------------------------------------- */
/* ----------------------- SMALLER SCREENS ---------------------- */
/* -------------------------------------------------------------- */

@media only screen and (max-width: 600px) {

h3	{
	font size: 17px;
	font-size: 4vw;
	}

ul 	{
	font size: 17px;
	font-size: 3vw;
	}

#main	{
	padding: 12px;
	}

#logo	{
	padding-bottom: 0px;

}

/* -------------------------------------------------------------- */
/* ------------------------- END OF CSS ------------------------- */
/* -------------------------------------------------------------- */