/*style for body on all pages*/
.body{margin-top:0px;
      color: #000000; 
      background-color: #739FD0;
}

/*style for superscript - power of two on main site*/
.sup{font-size: 70%;
     position: relative;
}

/*main area on angebote site*/
#angebote_text{max-width:822px; /*width of main (1024) - width navbar (200px) + 2px*/
		       min-width:200px;
               width:calc(98vw - 202px);
	           margin-top:0px;
               margin-left:202px;
               background-color: #FFFFFF; 
}

/*table on angebote site*/
#angebote_text table{border-collapse: collapse; /*collaps multiple borders into one*/
}


/*table cell on angebote site*/
#angebote_text td{width: 100%;                 
                  padding-right: 0px;
                  border: solid #739FD0;
                  border-width: 0px 0px 5px 0px;	
	              background-color: #e0e2e5; /*#346fc1;*/  
	              color: black;
	              font-family: Arial, Cabin, Helvetica, Nimbus Sans L, Sans;
}

#angebote_text h2{margin-top: 10px; 
                  margin-bottom: 10px; 
				  padding-left: 20px; 
				  color: black; /*white; 
				  /*display: inline-block;*/
}

#angebote_text li{margin-left: 10px;}

#angebote_text img{width:411px;
                   margin: 0px;                  
}

/*scale down images in angebote if viewport is too small*/
@media only screen and (max-width: 612px) {
    #angebote_text img{
	   min-width:200px;	
	   width:calc(98vw - 202px); 	
	}	
}				   
				   
/*class for headers on subsites*/
.header{margin-top:0px;
        margin-left:202px;
	    padding-left:20px; 
	    -moz-hyphens: auto;
	    -ms-hyphens: auto;
        hyphens: auto;
}

#main{max-width:1024px; /*width of main (1024) - width navbar (200px) + 2px*/
      min-width:402px;
      width: 98vw;
      margin: 0px auto;
      height:100%;
      background-color: #1E468B;
}   

#banner{max-width:1024px; /*width of main (1024) - width navbar (200px) + 2px*/
		min-width:402px;
        width:98vw;
	    position: relative;
        margin-top:0px; 
        left:0px;
        margin-bottom:0px;
        background-color: #1E468B; 
}

.banner_img{max-width:1024px; /*width of main (1024) - width navbar (200px) + 2px*/
		    min-width:402px;
            width: 98vw;
}

/*first line in header*/		 
#line1{height: 2px;
       max-width:1024px; /*width of main (1024)*/
	   min-width:402px;
       width:98vw;
       position: relative;           
       left:0px;
       color:#739FD0;	 
	   background-color: #739FD0;
	   border:none;
	   margin-left: 0px;
}

/*second line in header*/
#line2{height: 4px;
       max-width:1024px; /*width of main (1024)*/
	   min-width:402px;
       width:98vw; 
       position: relative;           
       left:0px;		 
       color:#739FD0;
       background-color: #739FD0;
       border: none;		 
       margin-left: 0px;		 
}

.seperator_line{max-width:822px; /*width of main (1024) - width navbar (200px) + 2px*/
		        min-width:200px;
                width:calc(98vw - 202px);	
                position: relative;           
                left:0px;	
	            color:#739FD0; 
		        margin-left: 0px;
		        margin-top:0px; 
		        margin-bottom:0px;
		        height: 8px; 
		        background-color:#739FD0;
		        border:none;
}

/*lines in content of start page*/
.seperator_line_home{max-width:822px; /*width of main (1024) - width navbar (200px) + 2px*/
		             min-width:200px;
                     width:calc(98vw - 202px); 	
                     position: relative;           
                     left:0px;	
	                 color:#739FD0; 
		             margin-left: 0px;
		             margin-top:-5px; 
		             margin-bottom:0px;
		             height: 8px; 
		             background-color:#739FD0;
		             border:none;
}   
	   
#ubanner{max-height: 30px;
		 min-height: 20px;
         height: calc(2.5vw - 1px); 		  
         margin-top:0;
         margin-left:5px;
         margin-bottom:0px;
         color:#ffffff;
		 /*font-size: 16px;*/
		 font-size: calc(4px + 0.9vw);
         font-family: Arial, Cabin, Helvetica, Nimbus Sans L, Sans;
         font-weight:bold;
}

/*set maximum font size to 16px*/
@media only screen and (min-width: 1333px) {
    #ubanner{
	   font-size: 16px; 	
	}	
}

#text{margin-top:0px;
      margin-left:202px;
	  background-color: #1456B5;
	  -moz-hyphens: auto; 
	  -ms-hyphens: auto;
      hyphens: auto;
} 
     
.text_default{margin-top:0px;
              margin-left:202px;
              background-color: #FFFFFF;
}     

.main_div_text{max-width:822px; /*width of main (1024) - width navbar (200px) + 2px*/
		       min-width:200px;
               width:calc(98vw - 202px); 
               background-repeat:no-repeat;
	           background-color: #1456B5;
	           margin-left:202px;
	           margin-bottom:0px;
	           padding-top:10px;
	           -moz-hyphens: auto;
	           -ms-hyphens: auto;
               hyphens: auto;
}

/*outer div on main site*/
.main_div_images{background-repeat:no-repeat;
	             background-color: #1456B5;
	             margin-left:202px;
	             margin-top:0px;
	             margin-bottom:0px;
}


/*text on main site*/
.main_text{font-family: Arial, Cabin, Helvetica, Nimbus Sans L, Sans; 
           margin-left:20px;
	       color:#ffffff;
	       margin-top:0px;
           text-align: justify; /*blocksatz*/
	       padding-right:100px;	   
}	   

/*reduce right padding of text if viewport is small (mobile device)*/
@media only screen and (max-width: 1024px) {
    .main_text{
	   padding-right:50px; 	
	}	
}

/* reduce text size for even smaller viewports*/
@media only screen and (max-width: 600px) {
    .main_text{
	   font-size:11px; 	
	}	
}

/*link on main site*/
a.main_text{text-decoration: none; 
            color:#98BDE7;
            margin-left: 0px;
			padding-right: 0px;
}

/*style for div with images on main site*/
.main_image_div{margin-bottom:0px; margin-left: 1px; padding: 0px;text-align:center;}   
			  

/*style images on main site*/
.main_img{ max-width:100%;
           min-width:200px;
           width:calc(98vw - 203px);
           padding-top:0px;
           padding-bottom:0px;		   
           margin-bottom:0px;
	       margin-top:0px;
		   margin-right: 0px;
		   margin: 0px;
		   padding: 0px;
		   border: none;		   
}
  
  
/*style counter on main site*/
.main_counter{text-align:center; 
              margin-top:80px;
}

/*image for counter on main site*/
img.main_counter{margin-top:0px;
                 border:none;
}
		 
/*style for images of bikes in angebote*/
.bike_img{width:50%; 
          float: left; 		 	 
	      margin: 10px 20px; /*margin on top/bottom and left/right*/	 
}

/*required to show bullets under angebote correctly*/
ul{padding-left: 20px;
   overflow: hidden;
}
 
/*image in link to travelbike*/
#travelbike_link{max-width:400px;
                 min-width: 180px;
	             width:calc(98vw - 240px);
}

/*embedded google street view*/
#ladenrundgang{max-width: 780px;
               min-width: 160px;
               max-height: 600px;
			   min-height: 160px;
               width:calc(98vw - 240px);
			   height:50vw;
}

/*div for list on service page*/
#service_text{background-color: #1E468B;
              padding-top: 10px;
			  padding-bottom: 10px;
			  margin-top:0px;
			  margin-left:20px;
			  margin-right:20px;
			  border: 2px solid black;
              border-radius: 10px;
			  -moz-hyphens: auto;
	          -ms-hyphens: auto;
              hyphens: auto;
}

/*div for map on anfahrt page*/
#map{max-width:720px;
     min-width: 160px;
     height: 450px;
	 min-height: 160px;
	 width:calc(98vw - 240px);
	 margin-left:20px;
	 margin-right:10px;
	 height:50vw;
}			 

/*input fields on kontakt pahe (name, vorname, mail-adresse)*/	
.kontakt_input{max-width:200px;
               min-width:160px;
               width:calc(98vw - 230px);
}

/*textarea on kontakt page*/
.kontakt_textarea{margin-right:10px;
	              max-width:400px;
                  min-width:160px;
                  width:calc(98vw - 230px);
}
			  

#navleiste{margin-right:0px;
           height:100%; 
           background-color: #1E468B;
           float:left;
}

#navleiste tr{/*background-image: url(button.jpg);*/}

#navleiste tr td{width:200px;
                 height:40px;
				 padding-bottom:4px;
}

/*th is used inside oeffnungszeiten*/                  
#navleiste tr th{text-align: left;
                 background-color: #1E468B;
}  
 

 
/*
Settings for table rows and cells inside navleiste
*/                  

/*style for table inside nav leiste*/                  
.navleiste_table{border: 0px;                                   
                 border-collapse: collapse; 
}  

/*general style for oeffnungszeiten*/
.zeiten{color:#ffffff;
        font-weight:bold;
        margin-left:5px;
        font-family: Arial, Cabin, Helvetica, Nimbus Sans L, Sans;
	    margin-bottom:0px;
	    font-size:110%;
}

/*style for divs in zeiten*/
div.zeiten{float: left;}

/*style for table inside oeffnungszeiten*/  
.zeiten_table{border: 0px;
              color:#ffffff;
              font-weight:bold;
              margin-left:5px;
}

/*style for instagram button div*/
.instagram{
    width: 200px;
    max-width: 100%;
    margin-top: 40px;
    text-align: center;
}

.button{font-family: Arial, Cabin, Helvetica, Nimbus Sans L, Sans;
        font-weight:bold;
        font-size: 110%;
	    background-color: #5c89c4;
        border: none;
        color: white;
	    width: 200px;
	    height: 40px;
	    margin-bottom: 10px;
        display:table-cell;
        vertical-align:middle; 
        padding-left: 5px;	
        text-decoration: none;
	    border: 1px solid black;
}

.button:hover{font-family: Arial, Cabin, Helvetica, Nimbus Sans L, Sans;
              font-weight:bold;
              font-size: 110%;
              background-color: #98bde7; 
              color: black;
	          width: 200px;
	          height: 40px;
	          margin-bottom: 10px;
              display:table-cell;
              vertical-align:middle; 
              padding-left: 5px;	
              text-decoration: none;
	          border: 1px solid white;	
}

a:link.nav{color:#ffffff;}

a:visited.nav{color:#ffffff;}

a:hover.nav{color:#000000;}

a:active.nav{color:#97C5E9;}

a:focus.nav{color:#ffffff;}

a.nav{font-family: Arial, Cabin, Helvetica, Nimbus Sans L, Sans;
      font-weight:bold;
      font-size:110%;
      text-decoration:none;
      margin-left:5px;
}
