@font-face {
    font-family: 'Museo500';
    src: url("../fonts/museo500.otf") format("opentype");
}
@font-face {
    font-family: 'Museo300';
    src: url("../fonts/museo300.otf") format("opentype");
}
@font-face {
    font-family: 'Museo700';
    src: url("../fonts/museo700.otf") format("opentype");
}
@font-face {
    font-family: 'LatoMedium';
    src: url("../fonts/lato-medium.ttf") format("truetype");
}
@font-face {
    font-family: 'LatoRegular';
    src: url("../fonts/lato-regular.ttf") format("truetype");
}
@font-face {
    font-family: 'BelloPro';
    src: url("../fonts/bellopro.ttf") format("truetype");
}
.subheading{
    font-weight:500;
    font-family:'LatoRegular',serif;
    font-size:1.35rem;
    margin-bottom:0px!important
}
.museo300{
	font-family:'Museo300',serif;
}
.museo500{
	font-family:'Museo500',serif;
}
.museo700{
	font-family:'Museo700',serif;
}
.bellopro{
	font-family:'BelloPro',serif;
}
#bild1
{
	max-width: 224px;
	transform: rotate(-7deg);
	display: none;
}
#bild2
{
	max-width: 224px;
	transform: rotate(-7deg);
	display: inline;
}
html, body {
    max-width: 100%;
    overflow-x: hidden;
}
body{
    font-family:'LatoMedium',serif;
    padding-top:54px;
    color:#ffffff
}
@media (min-width:992px){
    body{
        padding-top:0;
        padding-left:17rem
    }
}
.shadow{
	text-shadow: 2px 2px 2px #606060;
}
h1,h2,h3,h4,h5,h6{
	font-family:'LatoRegular',serif;
	font-weight:700;
	color:#343a40
}
.white{
	color:#ffffff
}
.black{
	color:#2f2f2f
}
.red{
	color:#d2000f
}
h1{
    font-size:2.5rem;
    line-height:5rem
}
h2{
    font-size:2.6rem
}
h3{
    font-size:1.5rem
}
.navbar-brand{
        font-size: 1rem;
}
@media (min-width:321px){
	h1{
	    font-size:2.9rem;
	    line-height:5rem
	}
	h2{
	    font-size:2.6rem
	}
	.navbar-brand{
        font-size: 1.3rem;
	}
	
	h3{
	    font-size:1.7rem
	}	
}
@media (min-width:415px){
	h1{
	    font-size:3.3rem;
	    line-height:5rem
	}
	h2{
	    font-size:2.6rem
	}
	.navbar-brand{
        font-size: 1.5rem;
	}
	
	h3{
	    font-size:2.6rem
	}	
}

.list-social-icons a{
    color:#495057
}
.list-social-icons a:hover{
    color:#d2000f
}
.list-social-icons a .fa-lg{
    font-size:1.75rem
}
.list-icons{
    font-size:3rem
}
.list-icons .list-inline-item i:hover{
    color:#d2000f
}
#sideNav .navbar-nav .nav-item .nav-link{
    font-weight:600;
    text-transform:uppercase;
}
@media (min-width:992px){
    #sideNav{
        text-align:center;
        position:fixed;
        top:0;
        left:0;
        display:flex;
        flex-direction:column;
        width:17rem;
        height:100vh
    }
    #sideNav .navbar-brand{
        display:flex;
        margin:auto auto 0;
        padding:.5rem
    }
    #sideNav .navbar-brand .img-profile{
        max-width:10rem;
        max-height:10rem;
        border:.5rem solid rgba(255,255,255,.2)
    }
    #sideNav .navbar-collapse{
        display:flex;
        align-items:flex-start;
        flex-grow:0;
        width:100%;
        margin-bottom:auto
    }
    #sideNav .navbar-collapse .navbar-nav{
        flex-direction:column;
        width:100%
    }
    #sideNav .navbar-collapse .navbar-nav .nav-item{
        display:block
    }
    #sideNav .navbar-collapse .navbar-nav .nav-item .nav-link{
        display:block
    }
}
section{
	border: 0px
}
section.resume-section{
    padding-top:1rem!important;
    padding-bottom:1rem!important
}
section.resume-section .resume-item .resume-date{
    min-width:none
}
@media (min-width:768px){
    section.resume-section{
        min-height:100vh
    }
    section.resume-section .resume-item .resume-date{
        min-width:18rem
    }
}
@media (min-width:992px){
    section.resume-section{
        padding-top:3rem!important;
        padding-bottom:3rem!important
    }
	#bild1
	{
		display: inline;
	}
	#bild2
	{
		display: none;
	}
}
.bg-primary{
    background-color:#d2000f!important;
    background-image: url('../img/bg_menu_sw.png');
}
.text-primary{
    color:#d2000f!important
}
a{
    color:#d2000f
}
a:active,a:focus,a:hover{
    color:#824027
}


.kontaktlink {
    color:#fff;
}
.kontaktlink:focus {
	color:#fff;
}

.kontaktlink:hover {
	color:#fff;
}


.btn-tonierot {
    color:#fff;
    background-color:#d2000f;
    border-color:#d2000f;
    position: relative;
    text-transform: uppercase;
    font-family: "Museo500", Helvetica, Roboto, Arial, sans-serif;
    font-weight: 700;
    text-decoration: none !important;
    border-width: 2px;
    line-height: 1.25;
    width: 220px;
    padding: 0.75em 1em !important;
    font-size: 1rem;
}
.btn-tonierot:focus {
	color:#fff;
    background-color:#b5000d;
    border-color:#b5000d;
}

.btn-tonierot:hover {
	color:#fff;
    background-color:#b5000d;
    border-color:#b5000d;
}

.btn-tonierotplay {
    color:#fff;
    background-color:#d2000f;
    border-color:#d2000f;
    position: relative;
    text-transform: uppercase;
    font-family: "Museo500", Helvetica, Roboto, Arial, sans-serif;
    font-weight: 700;
    text-decoration: none !important;
    border-width: 2px;
    line-height: 1.25;
    width: 50px;
    padding: 0.75em 1em !important;
    font-size: 1rem;
}
.btn-tonierotplay:focus {
	color:#fff;
    background-color:#b5000d;
    border-color:#b5000d;
}
.btn-tonierotplay:hover {
	color:#fff;
    background-color:#b5000d;
    border-color:#b5000d;
}

li{
	padding-top: 5px;
	padding-bottom: 5px;
}

#section1
{
	background-image: url('../img/bogen1_white.png'),url('../img/startseite.jpg'); 
	background-position: left bottom, right top;
	background-repeat: no-repeat, repeat;
	-webkit-background-size: 100% auto, cover;
	-moz-background-size: 100% auto, cover;
	-o-background-size: 100% auto, cover;
	background-size: 100% auto, cover;
}

#section2
{
	background-color:#ffffff;
	min-height: 2px;
	padding: 1rem;
}
#section3
{
	background-image: url('../img/bogen1_red.png'); 
	background-position: left bottom;
	background-repeat: no-repeat;
	-webkit-background-size: 100% auto;
	-moz-background-size: 100% auto;
	-o-background-size: 100% auto;
	background-size: 100% auto;
	min-height:2px;
}
#section4
{
	background-color:#82bedc;
	min-height:2px;
	max-height:110px;
	padding: 1rem;
}
#section5
{
	background-image: url('../img/bogen_blau_unten.png'),url('../img/bogen_oben_gelb_tonie.png'); 
	background-position: left top, left bottom;
	background-repeat: no-repeat, no-repeat;
	-webkit-background-size: 100% auto, 100% auto;
	-moz-background-size: 100% auto, 100% auto;
	-o-background-size: 100% auto, 100% auto;
	background-size: 100% auto, 100% auto;
	min-height:20px;
}
#section6
{
	background-color:#d2000f;
	min-height:2px;
	max-height:110px;
	padding: 1rem;
}
#section7
{
	background-image: url('../img/bogen2_red.png'),url('../img/bogen_blau_oben.png'); 
	background-position: left top, left bottom;
	background-repeat: no-repeat, no-repeat;
	-webkit-background-size: 100% auto, 100% auto;
	-moz-background-size: 100% auto, 100% auto;
	-o-background-size: 100% auto, 100% auto;
	background-size: 100% auto, 100% auto;
	min-height:20px;
}
#section8
{
	background-color:#ffd516;
	min-height:300px;
	max-height:110px;
	padding: 1rem;
}
@media (min-width:321px){
	#section8
	{
		background-color:#ffd516;
		min-height:250px;
		max-height:110px;
		padding: 1rem;
	}
}
@media (min-width:413px){
	#section8
	{
		background-color:#ffd516;
		min-height:200px;
		max-height:110px;
		padding: 1rem;
	}
}
@media (min-width:700px){
	#section8
	{
		background-color:#ffd516;
		min-height:2px;
		max-height:110px;
		padding: 1rem;
	}
}

#section9
{
	background-image: url('../img/bogen_gelb_unten.png'),url('../img/doppelbogen_grau.png'); 
	background-position: left top, left bottom;
	background-repeat: no-repeat, no-repeat;
	-webkit-background-size: 100% auto, 100% auto;
	-moz-background-size: 100% auto, 100% auto;
	-o-background-size: 100% auto, 100% auto;
	background-size: 100% auto, 100% auto;
	min-height:20px;
}
#section10
{
	background-color:#f9f9f9;
	min-height:2px;
	max-height:110px;
    padding: 1rem;
}
#section11
{
	background-color:#f9f9f9;
	min-height:20px;
}
#section12
{
	background-color:#393333;
	min-height:20px;
}

#unterschrift
{
	max-width: 300px;
}

#flieger
{
	max-width: 100px;
}

.fancynancybox
{
	max-height: 300px;
	padding: 30px
}