﻿html {
   width:100%;
   height:100%;
   background:url('images/bg.jpg') center center no-repeat;
   background-color:#B60000;
   color:#FFF;
   font-family: Arial, Helvetica, sans-serif;
}

h1#logo 
{
  background-image: url('images/logo.png');
  width:255px;
  height:48px;
  text-indent:-5000px;
}

::selection {
	background: #f00; /* Safari */
	
	}
::-moz-selection {
	background: #f00; /* Firefox */
}

#outer {
  position: absolute;
  top: 50%;
  left: 0px;
  width: 100%;
  height: 1px;
  overflow: visible;
}

#inner {
  width: 960px;
  height: 400px;
  margin-left: -480px;  /***  width / 2   ***/
  position: absolute;
  top: -200px;          /***  height / 2   ***/
  left: 50%;
}

h2 {
font-family:'Open Sans', sans-serif;
font-weight:700;
margin-top:0px;
font-size:20px;
letter-spacing:-1px;
text-shadow:1px 1px #633;
}

h3 {
font-family:'Open Sans', sans-serif;
font-weight:400;
margin-top:0px;
font-size:18px;
letter-spacing:-1px;
text-shadow:1px 1px #633;
}

a {
text-decoration:none;
color:#FC3;
}

a:hover {
background-color:#E03300;
}

/* carousel */

#viewport{
	width: 900px; /* Defines the size of the visible part of the carousel
		Attention : if you only want to see plain items in the viewport,
		the width of the viewport should take into account of :
		- the items width
		- the right and left padding of items
		- the number of items you want to see in the viewport
	 */
	overflow:hidden; /* Hides extra elements, those outside the viewport area */
	/* Fix for IE */
	position:relative;
}
#viewport ul{
	position: relative; /* Enables positionning of elements inside viewport */
	padding: 0; /* Resets default - User Agent - style */
	margin: 0;
}
#viewport li{
	width: 900px; /* Defines the size of inner element */
	height: 122px;
	float: left; /* Places list items side by side*/
	list-style: none; /* Resets default - User Agent - style */
  margin:1px;
}

/* Cosmetic */
#simplePrevious, #simpleNext{
	cursor: pointer;
	font-size: 0.8em;
	text-decoration: underline;	
}

  #viewport a 
  {
    display:inline-block;
    outline:1px solid #300;
    margin-right: 6px;
  }

  #viewport a:hover {
    outline:1px solid #FFF;
  }


  .modal {
    width:840px; 
    height:400px; 
    background-color:#000;
  }

  .modal h2
  {
    text-shadow:0px 0px;
  }