/*!
* Start Bootstrap - Blog Home HTML Template (http://startbootstrap.com)
* Code licensed under the Apache License v2.0.
* For details, see http://www.apache.org/licenses/LICENSE-2.0.
*/

/* Fonts in fonts.css Open+Sans , Fira+Sans , Merriweather , Economica , Black+Ops+One , Titillium+Web */


html,
body {
width: 100%;
height: 100%;
padding-top: 0px; /* Required padding for .navbar-fixed-top. Remove if using .navbar-static-top. Change if height of navigation changes. */
font-family: 'Titillium Web',Arial,sans-serif;
background-color:#FFFFFF;
background-image:url(../images/webdesign2016/bg_bergsichten.jpg);
background-repeat:no-repeat;
background-attachment:fixed;
background-position:center top;
margin-top:0px;
word-wrap:break-word!important;
-moz-hyphens: auto;
-webkit-hyphens: auto;
-ms-hyphens: auto;
-o-hyphens: auto;
hyphens: auto;
}

.clear {
display:block;
clear:both;
line-height:0;
height:1px;
font-size:0;
visibility:hidden;
}

/* hack chrome Browserleiste abstand */

@media screen and (-webkit-min-device-pixel-ratio:0) {
body {
/* margin-top:-20px; */
}
}

button:focus {
outline: none;
}

a:focus {
outline: none;
}

.slider_navi {
background-color:#000000;
background-image:url(../images/webdesign2016/bg_navigation.png);
margin:0px;
padding:0px;
}

/* ///////////////// well box //////////////////////// */

.well {
background-color:#f5f5f5!important;
}

/* ///////////////// news_box //////////////////////// */

.news_box {
clear:both;
display:block;
background-color:#f7f7f7!important;
border: 1px dashed #d3d2d2;
margin-bottom:30px!important;
background-image:url(../images/webdesign2016/bg_news_box.png);
background-repeat:repeat;
/* background-attachment:fixed; */
background-position:left top!important;
-webkit-border-top-right-radius: 0px;
-webkit-border-bottom-left-radius: 0px;
-moz-border-radius-topright: 0px;
-moz-border-radius-bottomleft: 0px;
border-top-right-radius: 0px;
border-bottom-left-radius: 0px;
}

.my_inner_news_box {
padding:10px 15px 0px 15px;
margin-bottom:0px;
}

@media screen and (max-width:640px) {
.my_inner_news_box {
padding:5px 10px 0px 10px;
margin-bottom:0px;
}
}


/* /////////////////////////////////////////////////// */

/* Content inner box */
.my_inner_content {
padding:40px;
margin-bottom:40px;
}

@media screen and (max-width:640px) {
.my_inner_content {
padding:15px;
margin-bottom:0px;
}
}

/* /////////////////////////////////////////////////// */

.well .color_black,
.color_black {
background-color:#212121!important;
}

.well .color_orange,
.color_orange {
background-color:#e37326!important;
/* border: 1px solid #e37326!important; */
}

.well .color_grau,
.color_grau {
background-color:#545454!important;
/* border: 1px solid #e37326!important; */
}

.well .color_hellgrau,
.color_hellgrau {
background-color:#f5f5f5!important;
/* border: 1px solid #e37326!important; */
}

.well .color_orange_hell,
.color_orange_hell {
background-color:#fcf6e9!important;
border: 1px solid #ffc8a2!important;
}

.well .color_white,
.color_white {
background-color:#FFFFFF!important;
border-top: 0px dashed #999999;
}


/* max-width: 50px; */
/*
hr {
clear:both;
border-top: 3px dashed #ea7815;
margin: 20px 0px 30px 0px;
}
*/

hr {
clear:both;
background-image:url(../images/webdesign2016/bg_haarlinie.png)!important;
width:100%!important;
height:20px!important;
margin: 15px 0px 25px 0px!important;
border: 0px dashed #ea7815;
}

/* Haarlinie Gipfelbuch */
.gipfelbuch {
clear:both;
background-image:none!important;
width:100%!important;
height:7px!important;
margin: 15px 0px 10px 0px!important;
border-top: 7px solid #f5f5f5;
}

/* Haarlinie Shop */
.linie_shop {
clear:both;
background-image:none!important;
width:100%!important;
height:2px!important;
margin: 0px 0px 1px 0px!important;
border-top: 2px solid #f5f5f5;
}

hr.light {
border-color: #fff;
}

a {
color:#e37326;
-webkit-transition: all .35s;
-moz-transition: all .35s;
transition: all .35s;
}

a:hover,
a:focus {
color:#000000;
text-decoration:none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
font-family: 'Fira Sans',Arial,sans-serif;
margin-top:0px;
word-wrap: break-word;
}

h1 {
color:#e37326;
font-weight:700;
font-size: 2.7em;
letter-spacing:-2px;
}

@media screen and (max-width:480px) {
h1 {
font-weight:600!important;
font-size: 2.1em;
letter-spacing:-1px!important;
}
}

h2 {
color:#000000;
margin: 0.4em 0em 0.4em 0em;
font-weight:700;
font-size: 2.0em;
letter-spacing:-1px;
}

h3 {
color:#125471;
margin: 0.3em 0 0.6em 0;
font-weight:700;
font-size: 1.6em;
letter-spacing:-1px;
}

@media screen and (max-width:480px) {
h3 {
margin: 0.3em 0 0.6em 0;
font-weight:600;
font-size: 1.5em;
letter-spacing:-1px;
line-height:26px;
}
}


h4 {
color:#e37326;
margin: 0.3em 0 0.6em 0;
font-weight:700;
font-size: 1.8em;
letter-spacing:-1px;
line-height:1.2em;
}

h5 {
color:#FFFFFF;
margin: 0 0 0 0;
font-weight:700;
font-size: 1.8em;
letter-spacing:-1px;
line-height:1.5em;
}

p {
margin-top:0px;
margin-bottom: 20px;
font-size: 1.3em;
line-height: 1.4em;
font-weight:400;
color:#333333;
text-align: justify;
text-justify: inter-word;
letter-spacing:0px;
}

@media screen and (max-width:480px) {
.col-md-9 p,
.col-sm-9 p {
text-align: left;
}
}

p.bildunterschrift {
clear:both;
font-size: 1.0em;
font-style:italic;
color:#999999;
word-wrap: break-word;
float:left;
padding-bottom:10px;
text-justify: inter-word;
}

.img-responsive {

}

@media screen and (max-width:768px) {
.img-responsive {
margin-bottom:20px;
}
}

p.anzeige {
margin-top:0px;
margin-bottom: 0px;
font-size: 0.8em;
font-weight:400;
color:#333333;
text-align: left;
letter-spacing:3px;
}


/* ///////////////////// Table /////////////////////////////////// */

@media screen and (max-width:480px) {
table {
float:left;
display:block;
width:100%;
}
}

@media screen and (max-width:480px) {
td {
clear:both;
display:block;
margin:0px;
padding:0px;
width:100%!important;
}
}

/* ///////////////// Text Bild umfliessen //////////////////////// */

.bild_links {
margin-right: 15px;
margin-top: 5px;
margin-bottom:15px;
float:left;
width:50%;
}

.bild_rechts {
text-align:right;
margin-left: 15px;
margin-top: 5px;
margin-bottom:15px;
float:right;
width:50%;
}

@media screen and (max-width:768px) {
.bild_rechts,
.bild_links {
width:100%;
}
}

/* Abstand anpassen, wenn toogle menue eingeblendet wird */

@media (min-width: 1px) and (max-width: 991px) {
.my_jump_mobile {
}
}


/* ///////////////// Gliederung //////////////////////// */

ul {
clear:both;
list-style-type:square;
margin-left:25px;
margin-top:15px;
}

li {
line-height:1.4em;
padding: 0px 0px 10px 0px;
margin-bottom: 20px;
font-weight:400;
color:#333333;
font-size:1.3em;
}

/* ///////////////// tabellen //////////////////////// */

table.borderless td,table.borderless th {
border: none !important;
margin-top:0px !important;
}

.borderless table {
border-top-style: none;
border-left-style: none;
border-right-style: none;
border-bottom-style: none;
}

table h1,
table h2,
table h3 {
margin-top:0px;
}

table img {
margin-top:4px;
}

td {
width:50%;
}

@media (min-width: 1px) and (max-width: 768px) {
table.borderless td,table.borderless th {
width:100%;
float:left;
display:block;
}
}


/* ///////////////// Modal Fenster //////////////////////// */

.modal-dialog {
#max-width:1200px!important;
text-align:center!important;
/*
margin-left:40%;
margin-right: 40%;
*/
}

@media (min-width: 1px) and (max-width: 991px) {
.modal-dialog {
width:90%!important;
/*
width:90%;
margin-left:5%;
margin-right:5%;
*/

}
}

.modal-dialog img {
max-width:100%;
}

.modal.in .modal-dialog 
{
    -webkit-transform: translate(0, calc(50vh - 50%));
    -ms-transform: translate(0, 50vh) translate(0, -50%);
    -o-transform: translate(0, calc(50vh - 50%));
    transform: translate(0, 50vh) translate(0, -50%);
}

table img .modal-dialog{
cursor:pointer;
}

.thumbnail {}

/* ///////////////// Video //////////////////////// */

.responsive-video {
padding-bottom: 56.25%;
position: relative;
overflow: hidden;
displax: block;
height: 0;
}

.responsive-video iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border: 0;
}

/* ///////////////// glyphicon //////////////////////// */

.my_glyphicon_orange {
padding-right:5px;
font-size:0.8em;
color:#e37326;
}

.my_glyphicon_schwarz {
color:#000000;
padding-right:5px;
font-size:0.8em;
}

.my_glyphicon_weiss {
color:#FFFFFF;
}

.my_glyphicon_blau {
color:#0786bd;
}