
*, *::before, *::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
html, body {
    height: 100%
}
body {    
	margin: 0 auto;
	padding: 0;
	font-family: Verdana,Arial,Helvetica,freesans,sans-serif,Tahoma,Georgia;
	overflow-x: hidden;
}

/* Mobile first: Blöcke bekommen 100% Breite */
header,
nav li,
article,
footer,
aside,
.sidebar_layout,
.index_article,
.index_aside {
    flex: 1 100%;
}

/*Maximale Seitenbreite, Hoehe mindestens 100%, wichtig! */
.wrapper {
    max-width: 80em;
    padding-bottom: 3.3em; /*fuer footer*/
    margin: 0 auto;
}
header  {              
    background-color: #7F3400;
}

#headerlogo {
margin: 1em 1em 0.5em 1em;
}
#headerlogo img {
    width: 6.25em;
    height: 3.1875em;
    min-width: 6.25em;
}
.navhead_item a {
	list-style: none;
	text-decoration: none;
	border: none;
}
.navhead_item a:hover,
.navhead_item a:focus {
	text-decoration: underline;
}

/*sticky footer*/
#hoeheseite {
    position: relative;
    min-height: 100%;
    margin: 0 auto;
}
#fuss {
    bottom: 0;
    position: absolute;
    width: 100%;
}

footer {
	display:flex;
	flex-flow: row wrap;
	justify-content: space-around;
	align-content: center;
	margin-top: 0.1em;
	min-height: 2.3em;
}
footer a, footer p {
    margin: 0em 0.5em 0em 0.5em;
}
article,
.article_foto_container,
.page_article,
.index_item,
.title,
.biketext {
    padding-left: 0.1em;
    margin-left: 0.1em;
}

/*Reihenfolge tauschen article first*/
.gpsview_article {
    display: flex;
    flex-direction: column;
}
.gpsview {
    order: 2;
}
.article {
    order: 1;
}
.photoalbum {
    order: 3;
}

/* Header Navigation */
.navhead_item {
     border: thin #333333 solid;
     padding: 0.5em;
     opacity: 90%;
     text-align: center;
}
.navhead_toggle {
    position: absolute;
    top:2.2em;
    left:0;
    right:0;
}
.navhead_menu_toggle {
    cursor: pointer;
    transition: all 0.5s ease-in-out;
    margin-right: 2em;
    float: right;
}
.navhead_container {
    display: flex;
    justify-content: flex-start;
}
.navhead_bar {
    display: flex;
    flex-direction: row;
    
}
.navhead_list {
    list-style: none;
    position: fixed;
    top: 5.4em;
    left: 0;
    width: 35%;
    display: flex;
    flex-direction: column;
    transform: translateX(-100%);
    transition: transform 0.5s;
    z-index: 10;
}
.navgpx_list {
    list-style: none;
    position: relative;
    top: 1em;
    left: 0;
    width: 80vw;
    display: block;
    z-index: 1000;
    margin-left: 0.5em;
    margin-bottom: 0.7em;
}
.navgpx_list a {
    width: 80vw;
    margin-left: 1em;
}
/* Ende Header Navigation */


/* Fonts Sizes */
h1, h2, h3, h4, h5, h6, .meta {
	font-family: Tahoma, Verdana, Arial, Helvetica, Georgia;
	font-weight: normal;
}
h2, h3, h6 {
	font-weight: bolder;
}
p  {font-size: 0.9em;} 
h1 {font-size: 1.7em;}
h2 {font-size: 1.2em;}
h3 {font-size: 1.2em;}
h4 {font-size: 1.05em;}
h5 {font-size: 0.95em;}
h6 {font-size: 1.05em;}

hr {
	background-color: #D4D4D4;
    height: 1px;
    border-width: 0;
	margin: 0.5em 0.1em 0.5em 0.1em;
}
div h2 {
    margin-top: 0.5em;
}
label {font-size: 1.0em;}

p, ol, ul, li {
	line-height: 1.6em;
}
h4 {
	line-height: 1.4em;
}
img {
    max-width:100%;
    height:auto;
}
/* Ende Fonts Sizes */


/* Colors */
body, a, h1, h2, h3, h4, h5, nav a {
	color: #2B1608;
}
p, td, tr, li a {
    color: #474747;
}
body, .sidebar_menu_toggle {
	background-color: #FFFFFB;
}
header a,
footer a,
footer p,
.sidebar label .toggleButton,
.sidebar_list label,
table tr.head,
.talpx th,
.download_button,
.download_button:hover,
.buttons a.active,
.buttons a:hover,
.starttxt,
.navhead_link:hover,
.active,
.menuNotActive a,
.form_kontakt,
.gallery .bottom nav a:hover,
.gallery .scrollbox .cont a:hover,
.gallery .scrollbox .cont a:focus,
.gallery .scrollbox .cont a.active {
    color: #FFFFFF;
}
.sidebar a:hover,
.sidebar_layout .sidebar_list label,
.talpx a,
.talpx a:hover,
table td.tourlink a:hover,
.talpx tr:nth-child(even),
.talpx tr:nth-child(odd),
._m_head h5,
.gallery .bottom nav a.active {
	color: #000000;
}
footer,
.download_button,
.gallery .bottom nav,
.thumbs a {
    background-color: #6A625A;
}
._m_cont_i,
.gallery .img .other {
	color: #6A625A;
}
.gallery .bottom .cont,
.gallery .bottom nav,
.gallery .bottom .panel {
	color:#bbbbbb;
}
.menuActive a,
.navhead_link:hover {
  color: #EBD277;
}
header,
.navhead_item,
.form_kontakt,
.talpx th {
	background-color: #7F3400;
}
/* Ende Colors */


/* Common */
.article_float p,
.article_float_bikes p {
    margin-top:0.4em;
}
.index_aside {
    padding: 0.5em;
    border-radius: 0.5em 0.5em;
    max-width: 93vw;
}
article,
/*index_article,*/
.page_article {
    margin-right: 0.5em;
}
.index_article {
    margin: 0 auto;
    max-width: 100vw;
}
.index_container {
    margin: 0.5em;
}
.article_container {
margin: 0 auto;
padding-left: 0.2em;
padding-right: 0.2em;
}

article {
    padding-left: 0.1em;
    padding-right: 0.3em;
    max-width: 100vw;
}
.splash img {
    width: 100%;
}
/* Achtung kein Leerzeichen, sonst klebt es nicht */
header.menufestkleben {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 10002;
}
.meta {
	margin-top: 0.3em;
	margin-right: 0.3em;
    padding-bottom: 0.5em;
	border-bottom: 0.1em solid #000000;
	font-style: italic;
}
.form_kontakt {
         border-radius: 0.2em;
         margin: 0;
         padding: 0.6em;
         cursor: pointer;
         font-size: 1.0em;
         color: #FFFFFF;
         background-color: #7F3400;
         text-decoration: none;
         text-align: center;
}
.form_kontakt:hover {
    text-decoration: underline;
    color: #EBD277;
}
#splash1 {
    background-size: contain;
    background-repeat: no-repeat;
    max-width: 100%;
    width: 100vw;
    height: 24vw;
}
#splash1_index, #splash1_tourenkarte {
    background-size: contain;
    background-repeat: no-repeat;
    width: 100vw;
    height: 24vw;
}

/* Kontaktformular */
#kontakt {
    margin-left: 2em;
    margin-top: 1em;
}
#kontakt p {
    margin-top: 1em;
    max-width:24em;
}
#kontakt img {
    max-width:7.5em;
    height:auto;
}
#kontakt #error {
    color:#702400;
    font-size: 0.9em;
}
#kontakt #Nachricht {
    width:23em;
    height:7em;
    border: 0.2em solid #DBDADA;
}
#kontakt #confirm {
    text-align:left;
    margin-top:19em;
} 

.textfloater, .textfloaterlinks {
     float:left;
     border-radius: 0.2em;
     margin: 0.2em 0.5em 0.5em 0.1em;
}
.textfloaterrechts {
    float:right;
    border-radius: 0.2em;
    margin: 0.2em 0.5em 0.5em 0.5em;
}
img.textfloater,
img.textfloaterlinks {
    max-width: 16.875em;
}
.bildeckenrund5 {
	border-radius: 0.2em;
}
.biketextfloater {
    display: flex;
    flex-direction: column;
}
.index_item {
    margin-top: 1em;
}
.index_actual {
    margin-top: 1em;
}
.index_actual img {
    border-radius: 50%;
}
.index_actual a, .sidebar a {
    text-decoration: none;
}
/* Ende Common */


/* Index Portfolio Box */   
.portfolio-box {
    background-color: #F4F4F4;
    border-radius: 0.3em;
    padding: 0.6em;
    margin: 0.1em;
    text-align: left;
}
.portfolio-item a {
text-decoration: none;
}
.portfolio-item a:hover {
text-decoration:underline;
}
.index_article {
    margin: 0 auto;
}
.portfolio-outer-index {
    display:inline-block;
    margin-top: 0.4em;
    margin-bottom: 0.4em;
    margin-left: 1.1em;
}
/* Ende Index Portfolio Box */


/* Bilder Artikel ausblenden Mobile */
@media screen and (max-width:27em){
    .article_float img {
        max-width: 40%;
    }
}

/* Navigation AlpX Uebersicht ausblenden Mobile */
@media screen and (max-width:54em){
    .navhead_item.nav_mobile_ausblenden,
    .nav_mobile_ausblenden {
        display: none;
    }
}

/* Bildschirm PC Ausgabe */
@media all and (min-width: 47em) {
    .navhead_list#navhead_float {
        width: 100%;
        flex: 1 1 0%;
        display: flex;
        justify-content: initial;
        transform: initial;
        transition: initial;
        flex-flow: row nowrap;
    }
    p  {font-size: 0.97em;} 
    
    h2 {font-size: 1.35em;} 
    
    .navhead_container {
        width: 80em;
        margin: 0 auto;
    }
    nav {
        display: flex;
        flex-flow: row nowrap;
        align-items: flex-end;
    }
    nav ul {
        display: flex;
        flex-flow: row wrap;
    }
    .navhead_item {
        display: flex;
        flex: 1 1 0%;
        justify-content: space-between;
        padding: 0em 0.5em 0.4em 0.5em;
    }
    nav .navhead_item {
         border: none;
         top: 0;
         opacity: 100%;
    }
    .navhead_menu_toggle, .sidebar_menu_toggle {
        display: none;
    }
    nav .navhead_list {
        position: initial;
        width: 100%;
        justify-content: initial;
        flex-direction: row;
        transform: initial;
        transition: initial;
        flex-flow: wrap;
    }
    ul, li {
	   line-height: 1.4em;
    }

    label {font-size: 0.9em;}
    
    main {
        display: flex;
    }   
	article,
    .article_float,
    .article_float_bikes {
	   display: block;
	}
	aside {
        display: block;
    	float: right;
	}
    .index_article {
    display: inline-block;
    margin-top: 0.9em;
    }
    .index_container {
        max-width: 30em;
    }
        .img_height {
        min-height: 11em;
    }
    .img_height_2 {
        min-height: 13em;
    } 
    #splash1,
    #splash1_tourenkarte {
        background-size: contain;
        background-repeat: no-repeat;
        width: 80em;
        height: 7.63vw;
        max-height: 6.11em;
        max-width: 80em;
    }
    #splash1_index {
        background-size: contain;
        background-repeat: no-repeat;
        width: 80em;
        height: 13.9vw;
        max-height: 11.11em;
        max-width: 80em;
    }
    img.textfloater,
    img.textfloaterlinks {
        max-width: 12.5em; 
    }    
        	
}

