/******************************************************************/
/***************************** Tablet *****************************/
/******************************************************************/
@media (min-width: 768px) {	
	/* Balken */
	.bg-balken {
		background-color: #333333;
		width: 100%;
		position: fixed;
		z-index: 100;
		top: 0;
	}

        .bg-balken .logo img {
            margin: 10px 0;
            /* width: 100px;*/
            height:50px;
        }
	
	.bg-balken .btn-navi {
		margin-top: 15px;
	}
	
	.bg-balken .demo {
		margin: 15px 15px 0 0;
	}
	
	/* Header */
	.logo img {
		margin: 15px 0 0 0;
	}
	
	.demo {
        float: right;
		width: 188px;
		margin: 25px 15px 0 0;
	}
	
	.headertext {
		color: #FFFFFF;
		text-align: center;
		padding: 25px 15px;
	}
	
	.headertext h1 {
		font-size: 50px; 
		margin-top: 0;
        font-weight: 900;
	}
	
	.headertext h2 {
		font-size: 30px; 
	}
	
	.headertext .button {
		border: 1px solid #FFFFFF;
		padding: 5px 10px;
		width: 260px;
		display: inline-block;
		margin: 20px 5px 0 5px;
	}
	
	.headertext .button a {
		color: #FFFFFF;
		font-size: 24px;
		text-decoration: none;
	}
	 
	.headertext .button:hover {
		background-color: #FFC100;
	}
	
	.headertext .button:hover a {
		color: #333333;
	}
	
	/* Navi */
	.btn-navi {
		background-color: transparent;
		margin-top: 30px;
	} 
	
	.navbar-toggle {
		margin: 9px 10px;
	}
	
	.navbar-default .navbar-collapse, .navbar-default .navbar-form {
		position: absolute;
		z-index: 2;
		background-color: #333333;
		width: 100%;
		padding:0 10px;
	}
	
	
	/* Content */


	/* Startseite */
	.funktionen .border {
		border-bottom: none;
	}

	.funktion {
		padding: 15px 15px 30px 15px;
	}
	
	.funktion h3 {
		text-align: left;
	}
		 
	.funktion .bild {
		padding: 0 15px 0 0;
	}
	
	.funktion .bild img {
		margin: 0;
	}
	
	.funktion .text {
		padding: 0 0 0 15px;
		text-align: left;
	}
	
	.tarif .features {
    	min-height: 338px;
	}

	/* Footer */
	.bg-footer {
		padding: 10px 0;
	}
	
	.footer {
		padding: 20px 0;
	}
	
	.bg-footer h4 {
		font-size: 24px;
		font-weight: 400;
		margin: 0 0 15px 0;
		color: #FFFFFF;
	}
	
	.newsletter {
		padding-left: 0;
	}
	
	.social {
		padding-left: 0;
	}
	
	/* Copy */
	.copy .links {
		padding-bottom: 0;
	}
	
	.copy .rechts {
		text-align: right;
	}
	
}


/***************************************************************************/
/***************************** kleiner Desktop *****************************/
/***************************************************************************/
@media (min-width: 1030px) { 
	/* Balken */
	.bg-balken .navi li:hover ul.dropdown {
		background-color: #333333;
		padding: 0 15px 10px 15px;
		left: 15px;
	}
	
	.bg-balken .navi {
		margin-top: 20px;
	}
	
	/* Header */
	.headertext {
		padding: 150px 15px 70px 15px;
	}

    .headertext h1 {
		font-size: 60px;
	}

	/* Navi */
	.navi {
		margin-top: 30px;
		padding: 0 0 0 30px;
	}
	
	.navi ul {
		margin: 0;
		padding: 0;
	}
	
	.navi li {
		list-style: none;
		display: inline; 
		padding-right: 25px;
	}
	
	.navi li:last-child {
		padding-right: 0;
	}
	
	.navi img {
		margin-left: 5px;
	}
	
	.navi a {
		color: #FFFFFF;
		font-size: 18px;
		text-decoration: none;
	}
	
	.navi a:hover {
		color: #FFC100;
	}
	
	.navi ul.dropdown {
		display: none;
	}
	
	.navi li:hover ul.dropdown {
		display: block;
		position: absolute;
    	z-index: 10000;
		margin-top: -1px;
	}
	
	.navi ul.dropdown li {
		display: block;
		padding: 10px 0 0 0;
	}

	/* Content */	
	
	
	/* Startseite */
	.tarif .features {
    	min-height: 657px;
	}
	
	/* Footer */	
	
	
}

/**************************************************************************/
/***************************** großer Desktop *****************************/
/**************************************************************************/
@media (min-width: 1200px) { 
	/* Balken */
	.bg-balken .navi li:hover ul.dropdown {
		 left: -15px;
	}
	
	/* Header */
	.headertext {
		padding: 145px 15px;
	}
	
	/* Navi */
	.navi {
		padding: 0;
	}

	/* Content */
	
	
	/* Startseite */
	.tarif .features {
    	min-height: 634px;
	}

	/* Footer */

	
}

/**************************************************************************/
/***************************** größerer Desktop *****************************/
/**************************************************************************/
@media (min-width: 1270px) { 
	/* Allgemein */
	.container {
		width: 1220px;
		padding: 0;
	}
	
}

@media (min-width: 1400px) { 
	/* Header */
	.headertext {
		padding: 200px 15px;
	}
}


/**********************************************************************************/
/***************************** Smartphones (portrait) *****************************/
/**********************************************************************************/
@media (max-width : 320px)
and (orientation : portrait) {	
	
}


/***********************************************************************************/
/***************************** Smartphones (landscape) *****************************/
/***********************************************************************************/
@media (min-width : 321px)
and (max-width : 767px) 
and (orientation : landscape) {	

}


/****************************************************************************/
/***************************** iPads (portrait) *****************************/
/****************************************************************************/
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {

}


/*****************************************************************************/
/***************************** iPads (landscape) *****************************/
/*****************************************************************************/
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {

	

}


/***********************************************************************/
/**************************** Windows Phone ****************************/
/***********************************************************************/
@-ms-viewport{
    width: device-width;
}