/* poppins-regular - latin */
@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 400;
	src: url('poppinsfont/poppins-v9-latin-regular.eot'); /* IE9 Compat Modes */
	src: local('Poppins Regular'), local('Poppins-Regular'),
		 url('poppinsfont/poppins-v9-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 url('poppinsfont/poppins-v9-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
		 url('poppinsfont/poppins-v9-latin-regular.woff') format('woff'), /* Modern Browsers */
		 url('poppinsfont/poppins-v9-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
		 url('poppinsfont/poppins-v9-latin-regular.svg#Poppins') format('svg'); /* Legacy iOS */
  }

/* -----------------------------------------------------------------------------------------------------*/
/* GENERAL */
html, body {
	height: 100%;
	width: 100%;
	font-family: 'Poppins', sans-serif;
	color: var(--color-text-dark);
	background-color: var(--color-background);
	
	transition: background-color 1s;
}
section {
	background-color: var(--color-background);
	z-index: 1;
}
.line {
	background-color: var(--color-line);
}
/* -----------------------------------------------------------------------------------------------------*/

.parallax {
	background: url('assets/prophylaxe.jpg') no-repeat center;
	background-size: cover;
	background-attachment: fixed;
	height: 200px;
}
.title {
	position: relative;
	color: #fff;
	top: 32%;
	margin: auto;
	text-align: center;
	font-size: 4em;
	text-shadow: 2px 2px 5px #000;
}
.dataprotection {
	width: 60%;
	height: 100%;
	margin: 3em;
	padding: 1em;
}
.dataprotection p {
	font-size: 0.95em;
}

/* -----------------------------------------------------------------------------------------------------*/
/* NAVIGATION BAR */
.navbar {
	/* padding: .8rem; */
	transition: top 0.5s ease;
	background-color: var(--color-navbar-background);
	transition: background-color 1s;
}
.navbar a {
	padding: 0;
	padding-top: 5px;
}
.navbar img {
	max-width: 170px;
	max-height: 62px;
}
.navbar-nav li {
	padding-right: 1px;
}
.nav-link {
	font-size: 1.1em !important;
}
.navbar-hide {
	top: -100px;
}
.navbar-scheme a {
	color: var(--color-navbar);
}
.navbar-scheme .active  a {
	color: var(--color-navbar-active);
}
.navbar-scheme a:hover {
	color: var(--color-navbar-hover);
}
.navbar-scheme .disabled {
	color: var(--color-navbar-disabled);
	cursor: context-menu;
}
.navbar-scheme .disabled:hover {
	color: var(--color-navbar-disabled);
}
.custom-toggler { 
	border-color: var(--color-navbar-togglerborder); 
} 
.custom-toggler .navbar-toggler-icon { 
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(140, 140, 140, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E"); 
}
/* -----------------------------------------------------------------------------------------------------*/


/* -----------------------------------------------------------------------------------------------------*/
/* WELCOME SECTION */
.padding {
	padding-bottom: 2rem;
}
/* -----------------------------------------------------------------------------------------------------*/

/* -----------------------------------------------------------------------------------------------------*/
/* BUTTON TO TOP */
#btntotop {
	position: fixed;
	bottom: 10px;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	background: var(--color-main);
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
	border: none;
	outline: none;
	cursor: pointer;
	right: -100px;
	
	transition: background 0.25s, right .5s ease;
}
#btntotop:hover {
	background: var(--color-main-lighter2);
}
#btntotop:active {
	background: var(--color-main-darker2);
}
#btntotop i {
	color: var(--color-textonmain);
}
.btntotop-show {
	right: 10px !important;
}
/* -----------------------------------------------------------------------------------------------------*/

/* -----------------------------------------------------------------------------------------------------*/
/* FOOTER */
footer {
	background-color: var(--color-background-footer);
	color: var(--color-footer);
	padding-top: 2rem;
}
hr.light {
	border-top: 1px solid var(--color-gray2);
	width: 75%;
	margin-top: .8rem;
	margin-bottom: 1rem;
}
footer a {
	color: var(--color-gray2);
}
hr.light-100 {
	border-top: 1px solid var(--color-gray2);
	width: 100%;
	margin-top: .8rem;
	margin-bottom: 1rem;
}
.footer-buttons {
	padding-bottom: 0.5em;
	font-size: 1.2em;
}
.footer-buttons a {
	color: var(--color-footer-buttons);
	transition: color 0.5s, font-weight 0.5s;
}
.footer-buttons a:hover {
	color: var(--color-gray2);
	text-decoration: none;
}
/* -----------------------------------------------------------------------------------------------------*/

/* -----------------------------------------------------------------------------------------------------*/
/* BOTTOMER */
.bottomer {
	display: none;
}
/* -----------------------------------------------------------------------------------------------------*/


/* -----------------------------------------------------------------------------------------------------*/
/* SVG LOGO */
.svg-style-nav {
	height: 70px;
}
#fake-tooth-nav {
	opacity:1;
	fill:none;
	stroke:#346aa4;
	stroke-width:6.5;
	stroke-linecap:round;
	stroke-linejoin:round;
	stroke-miterlimit:4;
	stroke-opacity:1;
	paint-order:normal
}
.draw {
	stroke-dasharray: 500;
	stroke-dashoffset: 500;
	animation: draw 3s linear forwards;
}
@keyframes draw {to {stroke-dashoffset: 0}}
.opacity {
	opacity: 0;
	animation:opac 1s;
	animation-delay: 2.5s;
	animation-fill-mode: forwards;
}
@keyframes opac {
	from {opacity:0} 
	to {opacity:1}
}
.svg-style-footer {
	height: 200px;
}
/* -----------------------------------------------------------------------------------------------------*/

/* -----------------------------------------------------------------------------------------------------*/
/*---Media Queries --*/
@media (max-width: 992px) {
	
}
@media (max-width: 768px) {
	.dataprotection {
		width: 70%;
	}
	.bottomer {
		display: flex;
		align-items: center;
		justify-content: space-around;
		position: fixed;
		margin: 0;
		height: 50px;
		bottom: 0;
		left: 0;
		width: 100%;
		background: rgba(52, 106, 164, 0.8);
		font-size: 2em;
		color: white;
		transition: all 1s;
	}

	.bottomer:hover {
		background: rgba(52, 106, 164, 1);
	}

	.bottomer i {
		cursor: pointer;
		transition: all 1s;
		text-decoration: none;
		color: white;
	}

	.bottomer i:hover {
		color: #ddd;
	}
}
@media (max-width: 576px) {
	.dataprotection {
		width: 90%;
		margin: 2em;
	}
	.title {
		font-size: 3em;
	}
	.dataprotection p {
		font-size: 0.9em;
	}
	
	.dataprotection h5 {
		font-size: 1.1em;
	}
}
/* -----------------------------------------------------------------------------------------------------*/

/* -----------------------------------------------------------------------------------------------------*/
/*--- Bootstrap Padding Fix --*/
[class*="col-"] {
    padding: 1rem;
}
/* -----------------------------------------------------------------------------------------------------*/