@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,900|PT+Serif|Noto+Sans+HK:400,500,700,900&display=swap');

/*most awesome fixes of all time */

html {
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
}


*, *:before, *:after { box-sizing: inherit; }

a:focus, *:focus{ outline:0; /*removes the dotted border on links*/}
/*##############################*/
/*### Font Import von Google ###*/
/*##############################*/

/*################################*/
/*### Container, Divs, Spalten ###*/
/*################################*/
html, body {background: #F9FAFF; font-family: 'Noto Sans HK', sans-serif; }

.container {margin-top: 0px}

.col-md-4 {min-height: 40px}
.col-md-6 {min-height: 40px}

.header {background: #fff; padding: 10px 0px 20px 0px}
.content {background: url(../images/bg.jpg) bottom center; background-repeat:no-repeat; background-size: cover; background-color: #a5bacb; /* #666 je nach Motiv */ }
.bestellformular {min-height: 770px; background: rgba(255, 255, 255, 0.9); margin-top: 15px; padding: 15px; border-radius: 0px; border-color: transparent; box-shadow: 0px 25px 50px rgba(0, 0, 0, 0.15);}
.img-shadow {box-shadow: 0px 15px 50px rgba(0, 0, 0, 0.40)}
.vorteil {padding-top: 15px; padding-bottom: 15px}
.row-vorteile {background: rgba(0,0,0,0.1);}
.footer{margin-top: 15px; margin-bottom: 15px}

.thumbnail {margin-bottom: 0px}
.thumbnail img {display: none}
.thumbnail .caption {padding: 9px 9px 9px 9px; margin-bottom: -14px}

.form-group {
    margin-bottom: 1px;
}

label {
    margin-bottom: 0px;
    margin-top: 5px;
}

.form-control {
	border: none;
}

.form-control:focus {
		border: none;
		border-bottom: .25rem solid #004273;
    outline: 0;
    -webkit-box-shadow: 0px 10px 35px -5px rgba(0, 0, 0, 0.2);
    box-shadow: 0px 10px 35px -5px rgba(0, 0, 0, 0.2);
    transform: scale(1.02);
    -webkit-transform: scale(1.02);
    transition: all 0.25s cubic-bezier(0.25, 0.15, 0.35, 1);
    -webkit-transition: all 0.25s cubic-bezier(0.25, 0.15, 0.35, 1);
}


.form-control {
    border-radius: 0px;
    border-color: transparent;
    box-shadow: none;
    -webkit-box-shadow: none;
    margin-bottom: 0.75rem;
    box-shadow: 0px 10px 35px -5px rgba(0, 0, 0, 0.05);
    transition: all 0.25s cubic-bezier(0.25, 0.15, 0.35, 1);
    -webkit-transition: all 0.25s cubic-bezier(0.25, 0.15, 0.35, 1);
}

select:not([multiple]) {
    -webkit-appearance: none;
    -moz-appearance: none;
    background-position: right 50%;
    background-repeat: no-repeat;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAMCAYAAABSgIzaAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBNYWNpbnRvc2giIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NDZFNDEwNjlGNzFEMTFFMkJEQ0VDRTM1N0RCMzMyMkIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NDZFNDEwNkFGNzFEMTFFMkJEQ0VDRTM1N0RCMzMyMkIiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo0NkU0MTA2N0Y3MUQxMUUyQkRDRUNFMzU3REIzMzIyQiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo0NkU0MTA2OEY3MUQxMUUyQkRDRUNFMzU3REIzMzIyQiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PuGsgwQAAAA5SURBVHjaYvz//z8DOYCJgUxAf42MQIzTk0D/M+KzkRGPoQSdykiKJrBGpOhgJFYTWNEIiEeAAAMAzNENEOH+do8AAAAASUVORK5CYII=);
    padding: .5em;
    padding-right: 1.5em
}

.submit-button {margin: 2rem 0 1.2rem 0!important}

#abo_type {margin-bottom: 8px}
#abo_premiums {margin-bottom: 8px}
#address_fields {margin-bottom: 14px}

.impressum {background: none; background-color:#333; color: #fff; height: 100%; margin-bottom: -99999px; padding-bottom: 99999px;}
.impressum a:hover {color: #fff}
.impressum a {color: #fff}
.impressum h1 {color: #fff}

.impressum-agb {padding-left: 30px; padding-right: 30px; padding-bottom: 30px; background-color: #F4F4F4}

.modal-dialog {margin-top: 30px}
.modal-body {max-height: 250px; overflow-y: scroll; margin-top: 0px}

.breadcrumb {
    background-color: #a5a815;
}


@media (min-width: 1024px) {
	.content {background: url(../images/bg.jpg) bottom center; background-repeat:no-repeat; background-size: cover; background-color: #a5bacb; /* #666 je nach Motiv */ min-height: 830px}
	.container {   width: 1000px;margin-top: 15px;}
  	.header {background: #fff; padding: 12px 0px 10px 0px}
 	.thumbnail img {display: block}
 	.form-group {margin-bottom: 10px}
 	.bestellformular {background:rgba(255, 255, 255, 0.9);}

/*  lead {text-shadow: 0px 0px 6px rgba(0,0,0,0.8);}	*/
/*  h1 {text-shadow: 0px 0px 6px rgba(0,0,0,0.8);}	*/
	}

/*##############*/
/*### Button ###*/
/*##############*/

.btn-success {
    background-color: #711b45;
    color: #fff;
    border-color: #711b45;
    box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.2);
    transition: all 0.25s cubic-bezier(0.25, 0.15, 0.35, 1);
    -webkit-transition: all 0.25s cubic-bezier(0.25, 0.15, 0.35, 1);
    border-radius: 0px;
}

.btn-success:hover, .btn-success:focus {
    background-color: #a72a87;
    border-color: #e20613;
	color: #fff;
    transform: scale(1.05);
    -webkit-transform: scale(1.05);
    box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.3);
    transition: all 0.25s cubic-bezier(0.25, 0.15, 0.35, 1);
    -webkit-transition: all 0.25s cubic-bezier(0.25, 0.15, 0.35, 1);
}



.btn-lg { padding: 10px 40px; margin-top: .5rem; }

/*###################*/
/*### Typographie ###*/
/*###################*/
h1 {color: black; font-size: 2.3em; font-weight: 600; font-family: 'Noto Sans HK', sans-serif;}
h3 {margin: -5px -9px 5px -9px; background-color: #f2ad3c; color: #fff; padding: 10px; font-weight: 700; } /*Objektfarbe */
h4 {margin-top: 0px; font-size: 1.5em; font-weight: 700; }
h5 {margin-bottom: 0px; font-weight: 700}
.lead {color: #000;   margin-bottom: 5px;  font-size: 1.15em;  line-height: inherit; font-weight: 300; letter-spacing: 0.03em}
.question {color: #000;   margin-bottom: 5px;  font-size: 1.15em;  line-height: inherit; font-weight: 200; letter-spacing: 0.03em}

.black {color: #000; text-shadow: none; font-size: 1.4em;}

.glyphicon {color: #fff;}

.werbeeinverstand {font-size: 0.9em;}
.agb {font-size: 0.8em; margin-bottom: 15px}

.lieferbedingungen {margin-top: 10px}

.breadcrumb > .active {
    color: #fff;
}

.breadcrumb > li {
    color: #bebebe;
}

ul, ol {
	list-style-type: none;
}

ul li {margin-bottom: 0.75rem; }

ul li:before { content:"\27A4\0020"; margin-left: -1.15em; }

.text-white {color: #fff!important;}
/*####################*/
/*### pretty stuff ###*/
/*####################*/
::selection {background: #711b45; color: #fff}   /*Objektfarbe */
::-moz-selection {background: #711b45; color: #fff}  /*Objektfarbe */
::-webkit-selection {background: #711b45; color: #fff} /*Objektfarbe */

h1::selection {background: #004273; color: #fff}	/*Objektfarbe */
h1::-moz-selection {background: #004273; color: #fff}	/*Objektfarbe */
h1::-webkit-selection {background: #004273; color: #fff}	/*Objektfarbe */

a:hover {color: #a72a87;}	/*Objektfarbe */
a {color: #711b45; font-weight: bolder;}	/*Objektfarbe */

.success a:hover {color: #fff}	/*Objektfarbe */
.success a {color: #fff}	/*Objektfarbe */
.success h3 {margin: -5px -9px 5px -9px; background-color: #a5a815; color: #fff; padding: 10px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;} /*Objektfarbe */

/*##########################*/
/*##### Sharing button #####*/
/*##########################*/
    .btn-twitter {
    background: #00acee;
    border-radius: 0;
    color: #fff;
		margin-bottom: 5px;
    }
    .btn-twitter:link, .btn-twitter:visited {
    color: #fff
    }
    .btn-twitter:active, .btn-twitter:hover {
    background: #0087bd;
    color: #fff
    }
    .btn-facebook {
    background: #3b5998;
    border-radius: 0;
    color: #fff;
		margin-bottom: 5px;
    }
    .btn-facebook:link, .btn-facebook:visited {
    color: #fff
    }
    .btn-facebook:active, .btn-facebook:hover {
    background: #30477a;
    color: #fff
    }
    .btn-googleplus {
    background: #e93f2e;
    border-radius: 0;
    color: #fff;
		margin-bottom: 5px;
    }
    .btn-googleplus:link, .btn-googleplus:visited {
    color: #fff
    }
    .btn-googleplus:active, .btn-googleplus:hover {
    background: #ba3225;
    color: #fff
    }
	.btn-youtube {
    background: #cd201f;
    border-radius: 0;
    color: #fff;
		margin-bottom: 5px;
    }
    .btn-youtube:link, .btn-youtube:visited {
    color: #fff
    }
    .btn-youtube:active, .btn-youtube:hover {
    background: #b31217;
    color: #fff
    }
	    .btn-whatsapp {
    background-color: #56c443;
    border-radius: 0;
    color: #fff;
	margin-bottom: 5px;
    }
    .btn-whatsapp:link, .btn-whatsapp:visited {
    color: #fff
    }
    .btn-whatsapp:active, .btn-whatsapp:hover {
    background-color: #56c443;
    color: #fff
    }

/*###############*/
/*### gewinne ###*/
/*###############*/
.hovereffect {
    width: 100%;
    height: 100%;
    float: left;
    overflow: hidden;
    position: relative;
    text-align: center;
    cursor: default;
}

.hovereffect .overlay {
    width: 100%;
    height: 100%;
    position: absolute;
    overflow: hidden;
    left: 0;
    top: 0;
    background-color: #661732;
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
    color: white;
}

.hovereffect .overlay .tel {
	margin-top: .25rem;
	white-space: nowrap;
}

.hovereffect:hover .overlay {
    opacity: 1;
    filter: alpha(opacity=100);
    top: 0px;
    -webkit-transition-delay: 0s;
    transition-delay: 0s;
}

.hovereffect img {
    display: block;
    position: relative;
}

.center-wrapper {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);}

.gewinn{
    padding: 10px;
}

@media (max-width: 1023px) {
    .horizon{
        max-width: 95% !important;
    }}

@media (max-width: 1200px) {
    .horizon{
        max-width: 94% !important;
    }}