/*--------------------------------------------------------------
    This stylesheet contains main styling elements
    
	STV Fi-Goe Plauschturnier
--------------------------------------------------------------*/

/*defines font for the whole site*/
html,body {
    font-family: 'Raleway', sans-serif;
    margin:0;
	padding:0;
	height:100%;
}
/*Wrapper div to center content-divs*/
#wrapper{
    min-height:100%;
	position:relative;
}
/*Div to place navigation in. Sets the gradient by use of a repeated image*/
.navigation {
     position: fixed;
    top: 0;
    background-image:url(bar_green.png);
    background-repeat:repeat-x;   
    z-index:1;
    width:100%;   
}
/*Logo which is centered and always on top*/
.centered_icon {
    top:5px;
    position:fixed;
    display:block;
    left:50%;
    margin-left:-37px;
    width:74px;
    z-index:2;
}
.nav_inside {
    margin:auto;
    position:relative;
    width:center;
    }
/*unsorted list*/
ul {
    list-style-type: none;
    margin: 0px;
    padding:  0px 0px 0px 0px;
    overflow:hidden;
}
/*list entry*/
li {
    float: left;
}
/*anchor in the list*/
li a {
    display: block;
    color: white;
    text-align: center;
    padding: 24px 16px;
    text-decoration: none;
}
/*Backgroundcolor of navigation if hover or active*/
li a:hover {
    background-color: #404040;
}
.active {
    background-color: #404040;
}
/*General formatting for every element*/
.element {
    padding-top:10px;
    width: left; 
    padding-bottom:10px;
}
/*white element*/
.white-element {
    background-color:white;
    color:black;
    position:relative;
}
/*green element*/
.green-element {
    background-color:#57b057;
    color:white;
    position:relative;
}
.content {
    width:left;
    margin:auto;
    margin-bottom:10px;
    clear:both;
}
/*Main title on every page*/
.title {
    margin:auto;
    text-align:left;
    display:block;
    width:100%;
    margin-top:100px;
    margin-bottom:-20px;
}
/*main picture on homepage*/
.title_image {
    margin:auto;
    width:500px;
    display:block;
}
.btn {
  border-radius: 5px;
  padding: 15px 25px;
  font-size: 22px;
  text-decoration: none;
  margin: 20px;
  color: #fff;
  position: relative;
  display: inline-block;
  background-color: #57b057;
  box-shadow: 0px 3px 0px 0px #15B358;
}
.btn:active {
  transform: translate(0px, 5px);
  -webkit-transform: translate(0px, 3px); 
  box-shadow: 0px 1px 0px 0px;
  background-color: #404040;
}
/*testimonial on homepage*/
.testimonial {
    margin-bottom:0px;
    font-size:16pt;
    width:70%;
}
.testimonial_right {
    right:-30%;
    display:block;
    position:relative;
}
/*footer which sticks to the bottom*/
#footer {
	background-color:#404040;
	width:100%;
	height:100px;
	position:absolute;
	bottom:0;
	left:0;
    color:white;
}
/*last element of page needs to have more space to the footer*/
.last {
    padding-bottom:110px; 
}
/*shadow of the contents*/
.div-shadow {
    box-shadow:  1px -12px 12px -6px #9f9f9f;
}
/*special formatting for header 1*/
h1 {
    margin-left:auto;
    margin-right:auto;
    display: block;
}