/* Unfortunately the build process was not successfull, because styles where missing from the source code.
a. added this stylesheet
b. searched and replaced colors in the main css file
*/

body,
.navbar.header-navigation li a,
.well a, .well strong,
.text-body {
	color: #3d678c;
}

.btn,
.mainmenu .navigation li.active a:after,
.mainmenu .navigation li a:hover:after,
.mainmenu .navigation li a:focus:after {
	background-color: #00aba3;
}

.btn:hover,
.btn:focus {
	background-color: #00928b; /* darker turquise */
}

.bg-blue {
	background-color: #3d678c;
}

.mainmenu .navigation li a {
	color: #00aba3;
}

.mainmenu .navigation li a:after {
	border-color: #00aba3;
}

.over-turqoise.mainmenu .navigation li.active a:after,
.over-turqoise.mainmenu .navigation li a:hover:after,
.over-turqoise.mainmenu .navigation li a:focus:after {
	background-color: #FFF;
	transition: background-color .3s;
}

.over-turqoise.mainmenu .navigation li a {
	color: #FFF;
	transition: color .3s;
}

.over-turqoise.mainmenu .navigation li a:after {
	border-color: #FFF;
	transition: all .3s;
}

.turquise-box {
	background: #00aba3 url(../images/augenaerzte-spandau-hintergrund.jpg);
	background-size: 100% auto;
	color: #FFF;
}

.turquise-box h1,
.turquise-box h2 {
	color: #FFF;
}

.turquise-box .square {
    background: url(../images/square-white.svg) bottom center no-repeat;
}


/* Header */
@media screen and (min-width: 767px) {

	.navbar.header-navigation {
		margin: 0 auto;
    	padding: 85px 0 15px;
		float: none;
	}

	.navbar-nav {
		float: none;
		margin: 0;
		display: flex;
    	justify-content: center;
	}

	.keyvisual .container {
		padding: 43px 3%;
	}
}

@media screen and (max-width: 766px) {
	.keyvisual {
		padding-top: 50px;
	}
}

/* Sticky header */
@media screen and (min-width: 767px) {
	.has-header-sticky {
		height: auto;
	}

	.header-sticky {
		position: sticky;
		top: 0;
	}

	.header-sticked .tel.navbar-tel {
		opacity: 0;
		transition: opacity .2s;
	}

	.header-sticked .header-navigation {
		padding-top: 15px;
		transition: padding-top .3s;
	}
	.header-sticked .navbar.header-navigation li a {
		padding-bottom: 4px;
	}
}

.only-phone:hover,
.only-phone:focus,
.tel.large-text a:hover,
.tel.large-text a:focus {
    color: #de0019;
}


/* Parallax */
.parallax-back {
    background-size: cover;
	background-attachment: fixed;
	background-repeat: no-repeat;
}

/* Carousel */

#carousel .container {
	position: relative;
	padding-top: 50px;
	padding-bottom: 50px;
}

@media screen and (min-width: 992px) {
	#carousel .container {
		padding-left: 76px;
		padding-right: 76px;
	}
}

.splide__slide img {
	width: 100%;
}

.splide__arrow--next {
    z-index: 100000; /* override side navigation */
}

@media screen and (min-width: 1371px) {
	.splide__arrow--prev {
		left: -4em;
	}

	.splide__arrow--next {
		right: -4em;
	}
}

@media screen and (max-width: 1370px) {
	.position-fixed {
		right: -5px;
	}
}


/* Lightbox */
.lightboxOverlay {
	z-index: 100000;
}

.lightbox {
	z-index: 100001;
}


.lb-nav a.lb-next,
.lb-nav a.lb-prev {
    display: flex !important;
    align-items: center;
	background-size: 44px;
}

.lb-nav a.lb-prev {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23CCC'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e");
	background-position-x: 4%;
}

.lb-nav a.lb-next {
    justify-content: flex-end;
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23CCC'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
	background-position-x: 96%;
}

.lb-data .lb-close {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23CCC'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e");
}

.lb-cancel {
    display: inline-block;
    width: 2rem;
    height: 2rem;
	background: none !important;
    vertical-align: text-bottom;
    border: .25em solid #CCC;
    border-right-color: transparent;
    border-radius: 50%;
    animation: spinner-border .75s linear infinite;
}

button.btn:focus,
button.btn:focus-visible {
	outline: 0;
}

.keyvisual + .position-fixed {
	z-index: unset;
}

.skip-link {
  position: absolute;
  top: 1rem;
  left: 1rem;
  padding: 0.75rem 1rem;
  background: #000;
  color: #fff;
  border-radius: 0.5rem;
  text-decoration: none;
  transform: translateY(-200%);
  transition: transform 0.2s ease;
  z-index: 9999;
}

.skip-link:focus {
  transform: translateY(0);
}

/* Doctolib */
.doctolib-widget {
    position: fixed;
    top: 1rem;
    right: 0;
    display: block;
    text-align: center;
    font-size: 16px;
    width: auto;
    border-radius: 4px 0 0 4px;
	background-color: rgba(61, 103, 140, .5);
    padding: 5px;
    z-index: 999;
    box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.2);
    line-height: 1.4;
}
.doctolib-widget--btn {
    display: block;
    color:  var(--b-doctolib-btn-color,#3d678c) !important;
    text-decoration: none;
    padding: 4px 10px;
    margin-top: 5px;
    background: var(--b-doctolib-btn-bg, #fff);
    border-radius: 4px;
    font-weight: 700;
    transition: 0.2s;
}
a.doctolib-widget--btn:is(:hover, :focus) {
    --b-doctolib-btn-bg: #3d678c;
	--b-doctolib-btn-color: #FFF;
	text-decoration: none;
}
@media (max-width: 767px) {
    .doctolib-widget {
		font-size: 14px;
        top: auto;
        bottom: 10px;
    }
}
