#button_show_building {
	font-size: 1.6em;
	width: 100%;
	height: 64px;
	background-color: #206000;
	vertical-align: middle;
	}	
#button_up1 {
	font-size: 1.6em;
	width: 100%;
	height: 64px;
	background-color: #206000;
	vertical-align: middle;
	}
#button_up2 {
	font-size: 1.6em;
	width: 100%;
	height: 64px;
	background-color: #206000;
	vertical-align: middle;
	}
	
	
#button_show_building:hover {
	font-weight:bold;
	background-color: #207000;
	}	

#section _1{
	font: normal 72.01% Times, Arial, sans-serif;
	font-size: 1.0em;
}
#section _2{
	font: normal 72.01% Times, Arial, sans-serif;
	font-size: 1.0em;
}
.section_call{
	font: normal 72.01% Times, Arial, sans-serif;
	font-size: 1.2em;
}

.content {
	position:relative;
    width: 1000px;
	max-width: 100%;
	padding: 0px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	-webkit-box-shadow: 0px 0px 6px 1px rgba(255, 255, 190, .75);
	-moz-box-shadow: 0px 0px 6px 1px rgba(255, 255, 190, .75);
	box-shadow: 0px 0px 6px 1px rgba(255, 255, 190, .75);
}

@viewport{
    zoom: 1.0;
    width: extend-to-zoom;
}
@-ms-viewport{
    width: extend-to-zoom;
    zoom: 1.0;
}


#left_column {
	width: 4px;
	float: none;
	vertical-align: top;
	display: table-cell;
	padding:5px;
	background-color:#F8F8F8;
	border-bottom-left-radius: 6px;
}

/* http://www.mediaevent.de/css/zz-float.html */
.group,
[class*=colgroup] { zoom:1 }
.group:after,
[class*=colgroup]:after { /** Alle Elemente, deren class "colgroup" enthält **/
    content:".";
    display:block;
    height:0;
    clear:both;
    visibility:hidden
}
.col { position:relative}
.col :first-child { margin-top:0}

@media all and (min-width: 30em) and (max-width: 50em) {
    [class*=colgroup] .col {
        float:left;
        width:47.5%;
        margin-left:5%
    }

    [class*=colgroup] .col:nth-of-type(2n+1),
    .colspan-2+.col {
        clear:left;
        margin-left:0
    }

    .colgroup-1 .col {
        width:100%;
        float:none;
        margin-left:0
    }

    .colgroup-3 .colspan-2,
    .colgroup-3 .colspan-2+.col,
    .colgroup-3 .col.primary,
    .colgroup-3 .col.secondary {
        width:100%;
        float:none;
        margin-left:0
    }
    .colgroup-3 .col.secondary { margin:2em 0 0 0 }
}



@media all and (min-width: 50em) {
    [class*=colgroup] .col {
    margin-left:5%;
    float:left
    }

    [class*=colgroup] .col:first-of-type { margin-left:0 }
    .colgroup-4 .col { width:21.2% }
    .colgroup-4 .col:nth-of-type(4n+1) {
        clear:left;
        margin-left:0
    }

    .colgroup-4 .col.colspan-3 { width:73.8%}
    .colgroup-3 .col { width:30%}
    .colgroup-3 .col:nth-of-type(3n+1) {
        clear:left;
        margin-left:0
    }

    .colgroup-3 .col.colspan-2 { width:64% }
    .colgroup-3 .col.middle {
        margin:0 auto;
        float:none
    }

    .colgroup-3 .col.colspan-2>p {
        line-height:1.4;
        margin-top:0.7em
    }

    .colgroup-3 .col.primary { float:right }
    .colgroup-3 .col.secondary {
        float:left;
        margin-left:0
    }

    .colgroup-2 .col { width:47.5%}
    .colgroup-2 .col:nth-of-type(2n+1) {
        clear:left;
        margin-left:0
    }
    .colgroup-1 .col {
        width:100%;
        margin-left:0
    }
}
/* - - - - - - - - - - - - */


/* for mobile */
@media (min-width: 1601px) {
html {font-size:1.7em;}
.col#header_Ballycummisk {font-size:1.7em;}
.col#header_Trekking {font-size:2.0em;}
.col#header_hub {font-size:2.4em;}
}
@media (min-width: 1024px) and (max-width: 1600px) {
html {font-size:1.3em;}
.col#header_Ballycummisk {font-size:2.0em;}
.col#header_Trekking {font-size:2.0em; height:50px;}
.col#header_hub {font-size:2.2em;}
}
@media (min-width: 680px) and (max-width: 1023px) {
html { font-size:1.7em;}
.col#header_Ballycummisk {font-size:1.6em; width:600px;}
.col#header_Trekking {font-size:1.8em; height:50px;}
.col#header_hub {font-size:2.0em;}
}
@media (min-width: 440px) and (max-width: 679px) {
html {font-size:2.0em;}
.col#header_Ballycummisk {font-size:1.0em; width:400px;}
.col#header_Trekking {font-size:1.3em; height:40px;}
.col#header_hub {font-size:1.4em;}
}
@media (min-width: 240px) and (max-width: 439px) {
html {font-size:2.0em;}
.col#header_Ballycummisk {font-size:1.0em;}
.col#header_Trekking {font-size:1.3em; height:40px;}
.col#header_hub {font-size:1.4em;}
}
@media (min-width: 100px) and (max-width: 239px) {
html {font-size:2.0em;}
.col#header_Ballycummisk {font-size:1.0em;}
.col#header_Trekking {font-size:1.0em; height:46px;}
.col#header_hub {font-size:1.2em;}
}


.bildzoom3 {
	float: none;
	vertical-align: top;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

img.scaled3 {
margin-top: 0em; border:2px solid #D0D0D0;
  width: 100%;
}

#section {
    padding:10px;
}

/* - - - - - - - - - - - - - - - - - - -  Start: defining fonts - - - - - - - - - - - - - - - - - */
.topic {
	font: normal 72.01% Helvetica, Arial, sans-serif;
	font-size: 0.8em;
	/*background-color: #E8E8E8;*/
	/*padding: 0.4em;*/
}
/* - - - - - - - - - - - - - - - - - - -  Endt: defining fonts - - - - - - - - - - - - - - - - - */

/* - - - - -  link effects - - - - - - - - */
a:hover { font-weight:bold;}
a:visited { text-decoration: none;}
a{color:#FFF;text-decoration:none;}
	
body {
	background-color:#E6E6FA;
	margin:0;
	padding: 0;
	text-align: center;
	overflow-x: hidden;
  /* more adds for the smartphone*/
	overflow-y: scroll;
	-webkit-overflow-scrolling: touch;
 }
	
.col#headerline {

	max-width: 100%;
     -webkit-flex-flow: column wrap;
     -moz-flex-flow: column wrap;
     flex-flow: column wrap;
     -webkit-justify-content: center;
     -moz-justify-content: center;
     justify-content: center;
 }

.content {
	max-width: 100%;
    margin-left: 50%; /* centers the whole content */
    margin-right: 50%; /* centers the whole content */
	text-align: left;
    width: 1000px; /* determines width of whole content ex footer, could be called "wrapper"*/
	margin: 24px auto;
}