body{
	margin:0;
}

#Bar{                  
     position: relative; 
	 width: 100%; 
	 margin-bottom:5px;
	 height:75px;
	 color: #fff;
}

  @media only screen and (max-width: 500px) {
	 #Bar {
	 background-color:#FFF;
	 position: relative; 
	 width: 100%; 
	 margin:auto;
	 height:75px;
	 }		 
  }
  
  nav {
	 text-align: center;
	 display:block;
	 margin:auto;
	 width:100%;
	 color: #fff;
}


nav ul {  
	 font-family:initial, serif;
	 display: inline-block;
	 background: #ffffff; 
	 margin:auto;
	width:98%;
}


#leNhmk { 
text-transform: uppercase;
		float: left;
		padding-top:11px;
	}         
	
#riMenu{
	float:right;
	width:35px;
	position:relative;
	right:40px;
	}

#logo{
	height:50px;
	float:left;
	padding-top:11px;
}

	
	#riMenu:hover a {
		color: #142093;
    }
			
	nav ul li a {
			 text-decoration: none;
			 padding: 18px 18px;
			 color: #757575; 
			 display: block; 
    }

	
	 
	  	@media screen and (max-width: 930px) {
    nav  ul { 
	 background: -webkit-linear-gradient(top, #efefef 0%,#bbbbbb 100%); 
	 background: -moz-linear-gradient(top, #efefef 0%, #bbbbbb 100%); 
	 background: linear-gradient(top, #efefef 5%, #bbbbbb 95%);  
	 font-family:initial, serif;
	 display: inline-block;
	 background: #ffffff; 
	 position: relative;
	 list-style: none;
	 width:100%;	
                 }
     }	

	 
   
	 	@media screen and (max-width: 420px) {
    nav  ul { 
	 background: -webkit-linear-gradient(top, #efefef 0%,#bbbbbb 100%); 
	 background: -moz-linear-gradient(top, #efefef 0%, #bbbbbb 100%); 
	 background: linear-gradient(top, #efefef 5%, #bbbbbb 95%);  
	 font-family:initial, serif;
	 display: inline-block;
	 background: #ffffff; 
	 position: relative;
	 list-style: none;
	 margin:auto;
	 width:100%;	
                 }
     }	
	 
	@media screen and (max-width: 420px) {
    nav  ul li { 
		text-decoration: none;
		display: inline-block; 
		border-radius:0;
	    color: #757575; 
		width:25%;
		padding:0;
		margin:0;
                 }
     }	

     	@media screen and (max-width: 420px) {
    nav  ul li a { 
		text-decoration: none;
		padding: 15px 5px;
		font-weight:bold;
		display: block; 
	    color: #757575; 
		margin:0;
             }
}	
/*-------------------------------------------------*/
.bar3
{
	display:none;
}
     	.bar2
{
	display:none;
}
     	.bar1
{
	display:none;
}
     	.barContainer
{
	display:none;
}
     	@media screen and (max-width: 815px) {
    .bar3{ 
		display:block;
             }
    .bar2{ 
		display:block;
             }
    .bar1{ 
		display:block;
             }
    .barContainer{ 
		display:block;
             }
}

     
#subBar{
	width:100%;
	text-align:center;
	display:inline-block;
	text-decoration:none;
}

#sBars{
	text-transform: uppercase;
	margin:auto;
	display:inline-block;
	width:8%;
	height:50px;
	border-spacing: 10px;
    box-sizing: border-box;
	padding: 15px 5px;
	text-align:left;
}
#sBars a{
text-decoration:none;
color:#000;	
cursor: pointer;
}

#sBars:hover a{
text-decoration:underline;
color:blue;	
cursor: pointer;
}




	     	@media only screen and (max-width: 815px) {
    #subBar{ 
         top:5px;	  
	}}
	
     	@media only screen and (max-width: 815px) {
    #subBar{ 
	 width:100%;
	 margin:0;
	 display:none;
	 background-color:#2b2827;
	 border-bottom-style: solid; 
	 border-width:1px;
          
	}
    #sBars{ 
	 width:100%;
	 margin:0;
	 display:none;
	 background-color:#2b2827;
	 border-bottom-style: solid; 
	 border-width:1px;
          
	}}
     	@media only screen and (max-width: 815px) {
    #sBars  a{ 
	margin-left:20px;
	color:white;
	}}
   	@media only screen and (max-width: 815px) {
    #sBars:hover  { 
	  background-color:#000000;
	}}
	@media only screen and (max-width: 815px) {
    #sBars:hover a  { 
	  color:#fff;
	}}
   	@media only screen and (max-width: 815px) {
    #stripes{ 
	  display:none;
	}}

	
	
/*-------------------subBody------------------------------*/
#subBody{

	width:100%;
position:relative;
margin:0px;
padding:0px; 

}

#firstPic{
	width:100%;
	position:relative;
}

#widePic{
	width:100%;
}

#oneThirdPic{
width:19.5%;	
display:inline-block;
margin:1px;

}
@media only screen and (max-width: 815px) {
    #oneThirdPic{ 
	  width:100%;
	}}


#thirdPic{
	width:100%;

		position:relative;
		float:left;
}

#fourthPic{
	width:100%;
	position:relative;
	float:right;
}
/*---------------------FOOTER----------------------------*/
#footer{
	height:50px;
	width:100%;
	background: #393e40; 
	display:grid;
}


/*--------------historia-------------------*/
#textDiv{
	width:60%;
	margin:auto;
    position:relative;
	padding-top:25px;
}



@media only screen and (max-width: 815px) {
    #textDiv{ 
	  width:90%;
	}}



/*--------------kalendarium-------------------*/

#subKalText{
	width:59%;
	padding:15px;
	float:right;
	position:relative;			
				
}

@media only screen and (max-width: 815px) {
    #trumpet{ 
	  width:100%;
	  float:none;
	}}


  #kontaktborder{                               /*Kontakt sidan E5E4E2*/
	 /*box-shadow: 0px 0px 8px rgba(0,0,0,0.45);*/
	 background-color:  #FFF;
     position:relative;
     width:800px;
	 margin:auto;
}

  @media only screen and (max-width: 960px) {
     #kontaktborder{
	    /*box-shadow: 0px 0px 8px rgba(0,0,0,0.45);*/
	    background-color:#FFF; 
	    margin-bottom:30px;
        position:relative;
	    width: 90%;
    }	
}

  @media only screen and (max-width: 480px) {
     #kontaktborder{
	    /*box-shadow: 0px 0px 8px rgba(0,0,0,0.45);*/
	    background-color:#FFF;
	    margin-bottom:30px;
        position:relative;	 
	    margin:auto;
	    width: 95%;

    }	
}

#innerkontaktborder{
     position:relative;
	 padding-bottom:15px;
	 padding-left:15px; 
	 padding-top:10px;
	 margin:auto;
	 float:left;
}

h2:hover{
	 cursor:default;
}

  #personborder b{
	 cursor:default;
}

  #innerkontaktborder{
	 cursor:default;
}

  #personborder{
	 padding-bottom:20px;
	 position:relative;
     padding-left:10px;
	 padding-top:15px;
	 margin:auto;
	 width:95%;
	 height:1400px;
}

#personborder img{
	border-radius: 8px;
}

@media only screen and (max-width:400px){
  #personborder{
	    padding-bottom:15px;
	    position:relative;
	    margin-right:auto;
	    margin-left:auto;
        padding-left:8px;
	    padding-top:15px;
	    width:95%;
    }
  }  
    @media only screen and (max-width:780px){
  #personborder{
	    padding-bottom:15px;
	    position:relative;
	    margin-right:auto;
	    margin-left:auto;
        padding-left:8px;
	    padding-top:15px;
	    width:95%;
	    height:2500px;
    }
}
	#personborder div p{ 
	 padding-top: 2px;
    }
	
    #personborder a{
		 text-decoration:none;
		 color: #000;
	}
	
	  #personborder a:hover{
		 text-decoration: none;
		 color: #000099;
	}
	
	  #personborder b:hover{
		 text-decoration: none;
		 color: #000099;
	}
	
  #person-col3{
	 padding-bottom:15px;
	 position: relative;
     width: 50%;
     float:left;	 
}

  #person-col1{
	 padding-bottom:15px;
	 position: relative;
     width: 50%;
     float:left;	 
}

  #person-col2{
     padding-bottom: 15px;
	 position: relative;
	 float: right;
	 width: 50%;
	 margin:auto;
}

  @media only screen and (max-width: 800px) {
     #person-col3 {
        display: inline-block; 
        position:relative;
	    margin:auto;
	    width:100%;
		
    }	
     #person-col2 {
        display: inline-block; 
        position:relative;
	    margin:auto;
	    width:100%;
		
    }	
     #person-col1 {
        display: inline-block; 
        position:relative;
	    margin:auto;
	    width:100%;
		
    }	
}

  @media only screen and (max-width: 420px) {
     #person-col3 {
        display: inline-block; 
        position:relative;
	    font-size:90%;
	    margin:auto;
	    width:100%;
    }
     #person-col2 {
        display: inline-block; 
        position:relative;
	    font-size:90%;
	    margin:auto;
	    width:100%;
    }
     #person-col1 {
        display: inline-block; 
        position:relative;
	    font-size:90%;
	    margin:auto;
	    width:100%;
    }
}

  @media only screen and (max-width: 320px) {
     #personborder {
	    	 width:100%;
    }  
     #kontaktborder {
	    	 width:100%;
    }  
     #person-col3 {
	    	 width:100%;
    }  
     #person-col2 {
	    	 width:100%;
    }  
     #person-col1 {
	    	 width:100%;
    }  
}