
.main {
	background-image: url(img/background_gray.png);
	background-repeat: repeat-x;
	/*background-color:  rgba(0, 0, 0, 0.5);*/
}

#mainpage{
	background-image: url(img/IMG_back_home.jpg);
	position:absolute;
	left:0px;
	top:0px;
	min-height:100%;
	width:100%;
	background-size:cover;
	background-visibility:visible;
}

/*
*top navigation
*/
#navi {
	position:fixed;
	width:100%;
	z-index:100;
}

.primary-navigation {
    font-family: Helvetica, Arial, sans-serif;
    font-size: 1.15em;
    /*text-transform: uppercase;*/
    color: #fff;
    text-align: center;
    /*padding-left: 1em;*/
	position:fixed;
	z-index: 99;
	display: block;
	/*background-color: rgba(0,0,0,0.8);*/
	width: 100%;
	left: 0;
	top:0px;
	text-shadow: 0 0 5px black;
	/*background-image: url(img/IMG_back_about.jpg);
	background-position: -100px -250px;
	background-repeat:repeat;*/
}

.primary-navigation-about {
    font-family: Helvetica, Arial, sans-serif;
    font-size: 1.15em;
    /*text-transform: uppercase;*/
    color: #fff;
    text-align: center;
    /*padding-left: 1em;*/
	position:fixed;
	z-index: 99;
	display: block;
	/*background-color: rgba(0,0,0,0.8);*/
	width: 100%;
	left: 0;
	top:0px;
	text-shadow: 0 0 5px black;
	background-image: url(img/IMG_back_about.jpg);
	background-position: -100px -250px;
	background-repeat:repeat;
}

.primary-navigation li,
#link-navigation li,
.primary-navigation-about li{
    display: inline-block;
    /*margin: 0 1.5em;*/
    padding: 0 2px;
    vertical-align: middle;
}

.ie6 .primary-navigation li,
.ie7 .primary-navigation li,
.ie6 .primary-navigation-about li,
.ie7 .primary-navigation-about li
{
    display: inline;
}

.primary-navigation .home,
.primary-navigation-about .home {
    /*margin-bottom: -25px;*/
	opacity:0.8;
}

.primary-navigation .home:hover,
.primary-navigation-about .home:hover{
	opacity:1;
}

.primary-navigation .home img,
.primary-navigation-about .home img{
    display: block;
	width: 120px;
	height: 120px;
}

.primary-navigation a,
.primary-navigation-about a{
    display: inline-block;
    padding-bottom: 40px;
	padding-top: 40px;
    color: #fff;
	/*color: #000;*/
    text-decoration: none;

    border-bottom: 3px solid transparent;

    -webkit-transition: border 0.2s ease-in-out;
    -moz-transition: border 0.2s ease-in-out;
    -o-transition: border 0.2s ease-in-out;
    transition: border 0.2s ease-in-out;
}

.exclude-padding{
	padding: 0px !important;
}

.primary-navigation a:hover,
.primary-navigation-about a:hover{
	text-decoration: underline;
}

/*
* index page
*/

img.back{
	top: 0px;
	display:block;
	left: 30%;
	/*width: 100%;*/
	height:100%;
	margin-left:auto;
	margin-right:auto;
	position:absolute;
	z-index:1;
}

#link-navigation {
	text-align: center;
	width: 50%;
	bottom: 5px;
	vertical-align: middle;
	position:fixed;
	left: 25%;
	z-index:98;
}
#link-navigation a{
	padding-bottom:10px;
	padding-top:10px;
}

/* 
* about Page
*/
.space{
	height:200px;
	width:100%;
}

#aboutpage{
	background-image: url(img/IMG_back_about.jpg);
	position:absolute;
	left:0px;
	top:0px;
	height:2000px;
	width:100%;
	background-repeat:repeat;
	background-attachment:fixed;
	background-position: -100px -250px;
}

.aboutboxes {
	/*float: left;
	left:90px;*/
    margin: 10px;
    padding: 5px;
    /*width: 500px;
    /*height: 500px*/
    border: 1px solid black;
}

#aboutImg{
	top: 0px;
	left: 0px;
	width: 100%;
	position:absolute;
	z-index:1;
}

#someText{
	position: relative;
	display: block;
	background-color: rgba(255, 255, 255, 0.9);
	top: 150px;
	/*left: 70px;
	width: 700px;*/
	z-index: 90;
}

#someText p{
	padding:20px;
	font-size:16px;
}
#someText h2{
	padding:20px;
	font-size:20px;
}
#someText h3{
	padding:20px;
	font-size:17px;
}

#map {
	position: relative;
	display: block;
	background-color: rgba(255, 255, 255, 0.9);
	top: 150px;
	/*right: 70px;
	padding: 20px;*/
	text-align:center;
	z-index: 90;
}

#map iframe{
	width:90%;
	height:90%;
	frameborder:0; 
	style:border:0;
	float:left;
	margin:25px;
	/*allowfullscreen;*/
}

#graz_city{
	width: 300px;
	height: 100px;
}

/*
* folio page
*/

.images {	
	width:80%;
	height:100%;
	left:10%;
	position:absolute;
	top:0;
	transition:1s;
	visibility:hidden;
}

#navMiddle 
{
    display:block;
    width:100%;
    height:15%;
    margin-top:10%;
}

#prev
{
    width:3%;
    /*height:3%;*/
    float:left;
    margin-left:3%;
	top:50%;
	left:3%;
	position:fixed;
    opacity:0.3;
	z-index:98
}

#prev:hover 
{
    opacity:0.8;
}

#next
{
    width:3%;
    /*height:3%;*/
    float:right;
    margin-right:3%;
	top:50%;
	right: 3%;
	position:fixed;
    opacity:0.3;
	z-index:98;
}

#next:hover 
{
    opacity:0.8;
}

.slider {
}

#description {
    display: block;
    position: fixed;
    background-color: rgba(0, 0, 0, 0.8);
    bottom: 0px;
	right: 0px;
	width:500px;
    height:50px;
	z-index:2;
}

#description p{
	font: Arial;
	font-size:20px;
	color: gray;
	position: fixed;
	right: 0px;
	margin-right: 5%;
	visibility: hidden;
}