/* CSS Document */
@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,700');
@import url('https://fonts.googleapis.com/css?family=Roboto+Slab:300,400,700');

body 						{ background:#fff; font-family: "Roboto", Helvetica, Arial, "sans-serif"; margin-top:0; padding-top:0; background-image:url('/img/tascherei-background.jpg'); }

h1 							{ color:#fff; font-family: "Roboto Slab", Helvetica, Arial, "sans-serif"; }
h2 							{ color:#5B7D87; font-family: "Roboto Slab", Helvetica, Arial, "sans-serif"; }

a 							{ color:#000; text-decoration:underline; }
a:hover 					{ color:#000; text-decoration:underline; }
p 							{ font-family: 'Roboto', serif; color:#fff; font-weight: 400; }
p a 						{ color:#fff; }

.logo 						{ width:200px; margin-bottom:25px; margin:0 auto; text-align: center; }

.center 					{ margin:0 auto; text-align:center; }

.main-img 					{ border-radius: 15px; }

.container 					{ background-image:url('/img/container-background.png'); border-radius: 15px; }

.container .jumbotron 		{ position: relative; padding:0; margin-top:15px;  }
.container .jumbotron h1	{ color:#fff; font-size:38px; }
.container .jumbotron p 	{ width:90%; text-align: center; margin:0 auto; padding-bottom:25px; }
.jumbotron-overlay 			{ position: absolute; left: 0; right: 0; bottom:0px; margin-left: auto; margin-right: auto; width: 994px; background-image:url('/img/overlay-background.png'); -webkit-border-bottom-right-radius: 15px; -webkit-border-bottom-left-radius: 15px; -moz-border-radius-bottomright: 15px; -moz-border-radius-bottomleft: 15px; border-bottom-right-radius: 15px; border-bottom-left-radius: 15px; }

.col-tasche 				{ margin-bottom:25px; }
.head-tasche				{ color:#fff; width: 100%; background:#5B7D87; padding-top:5px; padding-bottom:5px; }
.col-tasche h2				{ color:#fff; margin-top:5px; margin-bottom:5px; padding-top:5px; padding-bottom:5px; }
.overlay-tasche				{ position: absolute; left: 0; right: 0; bottom:35px; height:50px; margin-left: auto; margin-right: auto; width: 482px; background-image:url('/img/container-background.png'); }
.col-tasche h3 				{ margin-top: 12px; margin-bottom: 10px; }
.img-tasche 				{ width: 482px; }
.row-tasche 				{ background:#5B7D87; max-width: 482px; }
.row-tasche .col-lg-2,				
.row-tasche .col-lg-8 		{  }

.col-tasche h4, 
.col-tasche h5, 
.col-tasche h6   			{ font-size:13px; font-weight: 400; color: #fff; }
.col-tasche h4 a, 
.col-tasche h5 a, 
.col-tasche h6 a   			{ text-decoration:none; color: #fff; }

.footer p 					{ color:#000; text-align: center; }
.footer p a 				{ color:#000; }

.modal-body p 				{ color:#000; }
.modal-body p a				{ color:#000; }

@media only screen and (min-width:1024px) and (max-width:1279px) {
    

	
}

@media only screen and (min-width:992px) and (max-width:1023px) {
    
    .container .jumbotron p 	{ width:80%; }
    .jumbotron-overlay 			{ position: absolute; left: 0; right: 0; bottom:0px; margin-left: auto; margin-right: auto; width: 100%; }
    
    .overlay-tasche             { width: 100%; bottom: 32px; }

    .col-tasche-sm              { padding-left:2px; padding-right:2px; }
    
    .head-tasche                { width: auto; margin:0 auto; }

}

@media only screen and (min-width:800px) and (max-width:979px) {
    
    .logo 						{ width:150px; margin-bottom:15px; margin:0 auto; text-align: center; }

    .container .jumbotron h1	{ font-size:28px; }
    .container .jumbotron p 	{ width:80%; }
    .jumbotron-overlay 			{ position: absolute; left: 0; right: 0; bottom:0px; margin-left: auto; margin-right: auto; width: 100%; }
    
    .overlay-tasche             { width: 100%; bottom: 32px; }

    .col-tasche-sm              { padding-left:2px; padding-right:2px; }
    
    .head-tasche                { width: 482px; margin:0 auto; }
    .footer                     { padding-left:0px; padding-right:0px; }
    .footer p, .footer p a 		{ font-size:12px; }

}

@media only screen and (min-width:768px) and (max-width:799px) {
    
    .logo 						{ width:150px; margin-bottom:15px; margin:0 auto; text-align: center; }

    .container .jumbotron h1	{ font-size:28px; }
    .container .jumbotron p 	{ width:80%; }
    .jumbotron-overlay 			{ position: absolute; left: 0; right: 0; bottom:0px; margin-left: auto; margin-right: auto; width: 100%; }
    
    .overlay-tasche             { width: 100%; bottom: 32px; }

    .col-tasche-sm              { padding-left:2px; padding-right:2px; }
    
    .head-tasche                { width: 482px; margin:0 auto; }
    .footer                     { padding-left:0px; padding-right:0px; }
    .footer p, .footer p a 		{ font-size:12px; }
	
}

@media only screen and (min-width:600px) and (max-width:767px) {
    
    .logo 						{ width:100px; margin-bottom:15px; margin:0 auto; text-align: center; }

    .container .jumbotron h1	{ font-size:22px; margin-top:10px; margin-bottom:5px; }
    .container .jumbotron p 	{ width:95%; padding-bottom:10px; font-size:14px; }
    .jumbotron-overlay 			{ position: absolute; left: 0; right: 0; bottom:0px; margin-left: auto; margin-right: auto; width: 100%; }
    
    .overlay-tasche             { width: 100%; bottom: 32px; height: 40px; }
    .col-tasche h3              { font-size:18px; }
    
    .col-tasche h4, .col-tasche h5, .col-tasche h6 { font-size: 11px; }

    .col-tasche-sm              { padding-left:2px; padding-right:2px; }
    
    .head-tasche                { width: 482px; margin:0 auto; }
    .footer                     { padding-left:0px; padding-right:0px; }
    .footer p, .footer p a 		{ font-size:12px; }
	
}

@media only screen and (min-width:480px) and (max-width:599px) {
    
    .logo 						{ width:100px; margin-bottom:15px; margin:0 auto; text-align: center; }

    .container .jumbotron h1	{ font-size:16px; margin-top:10px; margin-bottom:5px; }
    .container .jumbotron p 	{ width:95%; padding-bottom:10px; font-size:10px; }
    .jumbotron-overlay 			{ position: absolute; left: 0; right: 0; bottom:0px; margin-left: auto; margin-right: auto; width: 100%; }
    
    .overlay-tasche             { width: 100%; bottom: 32px; height: 40px; }
    .col-tasche h3              { font-size:18px; }
    
    .col-tasche h4, .col-tasche h5, .col-tasche h6 { font-size: 11px; }

    .col-tasche-sm              { padding-left:2px; padding-right:2px; }
    
    .footer                     { padding-left:0px; padding-right:0px; }
    .footer p, .footer p a 		{ font-size:12px; }
	
}

@media only screen and (min-width:320px) and (max-width:479px) {
    
    .logo 						{ width:100px; margin-bottom:15px; margin:0 auto; text-align: center; }

    .container .jumbotron h1	{ font-size:16px; margin-top:10px; margin-bottom:5px; }
    .container .jumbotron p 	{ width:95%; padding-bottom:10px; font-size:10px; }
    .jumbotron-overlay 			{ position: absolute; left: 0; right: 0; bottom:0px; margin-left: auto; margin-right: auto; width: 100%; }
    
    .overlay-tasche             { width: 100%; bottom: 32px; height: 40px; }
    .col-tasche h3              { font-size:18px; }
    
    .col-tasche h4, .col-tasche h5, .col-tasche h6 { font-size: 11px; }

    .col-tasche-sm              { padding-left:2px; padding-right:2px; }
    
    .footer                     { padding-left:0px; padding-right:0px; }
    .footer p, .footer p a 		{ font-size:12px; }
	
}
