/*	Author: Sascha Milivojevic (website: www.hey-sascha.de / email: info@hey-sascha.de):

   
		------------------------------------------------------
   
		rabe-finanz.de		v1 stylesheet		16.01.2012		
  
		----------------------------------------------------*/
        
@import url('fonts.css');

/*	Browser CSS reset
  
		----------------------------------------------------*/

		html, body, div, span, applet, object, iframe,
		h1, h2, h3, h4, h5, h6, p, blockquote, pre,
		a, abbr, acronym, address, big, cite, code,
		del, dfn, em, font, ins, kbd, q, s, samp,
		small, strike, sub, sup, tt, var,
		dl, dt, dd, ol, ul, li,
		fieldset, form, label, legend, input,
		table, caption, tbody, tfoot, thead, tr, th, td {
				margin: 0;
				padding: 0;
				border: 0;
				outline: 0;
				font-weight: inherit;
				font-style: inherit;
				font-size: 100%;
				font-family: inherit;
				vertical-align: baseline;}
		
		img {
				vertical-align: bottom;}
		
		:focus {
				outline: 0;}
		
		ol, ul {
				list-style: none;}
		
		table {
				border-collapse: collapse;
				border-spacing: 0;
				font-size: 1em;}
		
		caption, th, td {
				text-align: left;
				font-weight: normal;}
		
		blockquote:before, blockquote:after, q:before, q:after {
				content: "";}
		
		blockquote, q {
				quotes: "" "";}
				
/*	Allgemeine Definitionen
  
		----------------------------------------------------*/
		
		html, body {
				margin: 0;
				padding: 0;
				height: 100%; }
		
		body {
				font-family: 'Open Sans', sans-serif;
				font-size: 12px;
				color: #333333;
				line-height: 18px;
				background-color: #fff;}
				
		a img { 
				border:none;}
				
		a {
				text-decoration: none;}
				
		h1,h3 {

				font-family: 'Open Sans', sans-serif;
				font-size: 28px;
				text-transform: uppercase;
				font-weight: 400;
				line-height: 35px;
				padding-bottom: 8px;
				margin: 51px 0 21px 0;
				color: #333;}
				
		h2,h4 {
				font-family: 'Open Sans', sans-serif;
				font-size: 18px;
				line-height: 25px;
				margin: 0 0 27px 0;
				color: #333;}
        
    h1 {
        font-size: 26px;
        margin-bottom: 0;
        font-weight: 700;}
        
    h2 {
        font-size: 22px;
        letter-spacing: 0.05em;
        font-weight: 300;
        line-height: 30px;
        margin-bottom: 21px;
        margin-top: 0px;}
        
    h3 {
        color: #333; 
        margin: 0 0 21px 0;
        text-shadow: #ddd 1px 1px 1px; }    
				
		h5 {
        clear: left;
        float: left;
				width: 100%;
        font-family: 'Open Sans', sans-serif;
				font-size: 13px;
				text-transform: uppercase;
				font-weight: 400;
        letter-spacing: 0.05em;
				line-height: 18px;
				margin: 150px 0 20px 0;
        padding-top: 100px;
				color: #f38900;}
				
		p {
				font-family: 'Open Sans', sans-serif;
        font-size: 16px;
				color: #333333;
				line-height: 25px;
				margin-bottom: 20px;}
				
		.mr20 {
				margin-right: 20px;}
				
		.mt20 {
				margin-top: 20px;}
        
    .mt40 {
				margin-top: 40px;}
				
		.button {
				background-color: #f38900;
				padding:5px;
				color: #fff;
				margin-top: 20px;
				float: right;}
				
		a.button:hover{
				color: #D8CBDD; }


/*	Layout styles
  
		----------------------------------------------------*/
    
    .mobile {
        display: none;}
          
    .desktop {
        display: inline;}
		
		.container {
				margin: 0px auto;
        width: 940px;
        padding: 0 10px;}
				
		#header {
				width: 940px;
        padding-top: 20px;
        margin-bottom: 51px;
        position: fixed;
        background-color: #fff;}
        
    .box {
      width: 100%;
      position: static;
      float: left;
      background-color: none;}
				
		.logo {
        float: left;
        text-align: center;
				width: 200px;
				height: 55px;
				padding-top: 10px;
        padding-bottom: 10px;
				text-align: left;}
        
    .nav {
        float: right;
        width: 700px;
        padding-top: 10px;}
        
    .kontakt {
        float: left;
        width: 460px;}
				
		.mod_navigation {
				padding-top: 5px;}
        
    #header ul {
      margin-top: 23px;
      float: right;}
								
		#header ul li {
        float: left;
        text-align: right;
        margin-left: 29px;
        color: #333;
				font-family: 'Open Sans', sans-serif;
        font-weight: 400;
				font-size: 14px;
        text-transform:uppercase;
				line-height: 35px;}
				
		#header ul li a{
				color: #333; }
				
		#header ul li a.active{
				color: #f38900; }
        
    #content a, #content a:visited {
        color: #f38900 !important;
        text-decoration: underline;}
        
    .content a:hover {
        text-decoration: none}
        
    .clear, .section {
        clear: left;
        float: left;
        width: 100%;}
        
    .section {
        clear: left;
        float: left;
        width: 100%;
        height:1px;
        color: #fff !important;
        border: none;}
				
		#header ul li a:hover{
				color: #f38900; }
        
    #content {
      padding-top: 130px;}
				
		#contentHeading{
				clear: left;
				margin-bottom: 0px;
				margin-top:2px;}
        
		.container img, #contentHeading img, .row1 img, .logo img{
        max-width: 100%;
			  width: auto\9; /* ie8 */}
        
    #contentHeading a {
        color: #f38900;
        text-decoration: underline; }
        
    #contentHeading a:hover {
        text-decoration: none; }
        
    .row1 {
        float: left;
        width: 48%;
        margin-right: 4%;}
        
    .row2 {
        float: left;
        width: 48%;}    
				
		#footer {
				float: left;
				width: 100%;
				padding-bottom: 100px;}
				
		#footer h1 {
				color: #333;
				border-bottom: 6px solid #333;}
				
		#footer ul li {
				border-bottom: 1px solid #333;
				font-family: 'Old Standard TT', serif;
				font-size: 16px;
				line-height: 35px;}
				
				
		#footer ul li.last {
				border: none;}
        
    #div1 ul li {
      float: left;
      margin-right: 40px;
      font-size: 14px;
      font-weight: 400;

      letter-spacing: 0.2em;}
        
@media screen and (min-width: 768px) and (max-width: 1023px){
      .container {
        width: 90%;}
        
      .nav {  
        width: 70%;
        float: left;}
        
      #header {
        width: 100%;
        position: static;}
        
      #header ul li {
        margin-left: 20px;}
        
      h3 {
        font-size: 26px;}
        
      h5 {
        padding-top: 50px;}
        
      .kontakt {
        width: 260px;}

}

@media screen and (min-width: 580px) and (max-width: 767px){
      .container {
        width: 90%;}
        
      .nav {  
        width: 100%;
        float: left;
        margin: 0;}
        
      #header {
        margin-bottom: 27px;
        width: 100%;
        position: static;}
        
      #header ul {
        float: left;
        margin-top: 10px;
        margin-bottom: 20px;}
        
      #header ul li {
        margin-left: 0;
        font-size: 18px;
        text-align: left;
        margin-right: 10px;}
        
      #header ul li.last {
				margin-right: 0;}
        
      h3 {
        font-size: 26px;}
        
      h5 {
        margin-top:0;
        padding-top: 50px;}
        
      .kontakt {
        width: 260px;}

}

@media screen and (max-width: 579px){
      .container {
        width: 90%;}
        
      .logo {
        width: 100%;
        height: 80px;
        text-align: center;
        margin:0;
        padding:0;}
        
      #content {
        padding-top: 0px;}
        
      .logo img {
        margin: 0 auto;
        padding: 0;}
        
      .nav {  
        display: none;}
        
      #header {
        padding-bottom: 27px;
        width: 100%;
        position: relative;}
        
      .row1, .row2 {
        width: 100%;
        margin:0;}
        
      .row2 {
        margin-bottom: 40px;}
        
      .clear { 
        margin: 30px 0;}
        
      #header ul {
        float: left;
        margin-top: 10px;
        margin-bottom: 20px;}
        
      #header ul li {
        margin-left: 0;
        font-size: 18px;
        text-align: left;
        margin-right: 10px;}
        
      #header ul li.last {
				margin-right: 0;}
        
      .mobile {
        display: inline;}
        
      .desktop, #div1 ul {
        display: none;}
        
      #div1 {
        margin-bottom: 40px;}
        
      h1 {
        font-size: 20px;
        line-height: 28px;
        margin-top: 20px;}
        
      h2, h4 {
        font-size: 18px;
        line-height: 26px;}
        
      h3 {
        font-size: 20px;}
        
      h5 {
        margin:0;
        padding: 0;}
        
      .kontakt {
        width: 260px;}

}