@charset "utf-8";
/* CSS Document */

@import url('/fonts.css');

/************************************************
*** BASICS
************************************************/

html			{ box-shadow: none !important; }
body			{ font-family: "Martel Sans", sans-serif; font-weight: 300; font-size: 15px; line-height: 1.8; color: #000000; background: #9db999; overflow-x: hidden; }

a				{ color: #9db999; text-decoration: none; -webkit-transition: 0.3s; -moz-transition: 0.3s; -ms-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; }
a:active		{ color: #9db999; }
a:focus			{ color: #9db999; }
a:hover			{ color: #000000; text-decoration: underline; }

p 				{ margin-bottom: 0; }

.wrapper			{ margin: 0 auto; padding: 0; width: 100%; height: auto; }
.wrapper-block		{ display: block; width: 100%; height: 100%; }
.wrapper-img		{ background-size: cover; -moz-background-size: cover; -webkit-background-size: cover; -o-background-size: cover; background-position: center; }
.wrapper-img-home	{ background-image: url('../images/bg-home.jpg'); background-attachment: fixed; }
.wrapper-img-site	{ background-image: url('../images/bg-home.jpg'); }

#google-map			{ width: 100%; height: 400px; }


/************************************************
*** NAV
************************************************/

.img-logo	{ height: 70px; width: auto; }


.navigation-portrait									{ background-color: transparent; }
.navigation-portrait .nav-menus-wrapper					{ background-color: #9db999; }
.navigation-portrait .nav-menu li						{ background-color: transparent; margin: 0; border-top: 1px solid rgba(255,255,255,0.2); }
.navigation-portrait .nav-menu > li:last-child 			{ border-bottom: 1px solid rgba(255,255,255,0.2); }
.navigation-portrait .nav-menu li a						{ background-color: transparent; color: #ffffff; font-size: 15px; line-height: 1.0; font-weight: 400;
														  font-family: "Martel Sans", sans-serif; }

.navigation-portrait .nav-menu > li > a 								{ padding: 20px 13px; }
.navigation-portrait .nav-menu > li > ul > li > a						{ padding: 20px 13px 20px 21px; }
.navigation-portrait .nav-menu > li > ul > li > ul > li > a				{ padding: 20px 13px 20px 29px; }
.navigation-portrait .nav-menu > li > ul > li > ul > li > ul > li > a	{ padding: 20px 13px 20px 37px; }

.navigation-portrait .nav-menu li ul li a				{ display: block; font-weight: 400; text-transform: none; }
.navigation-portrait .nav-menu li ul li 				{ background-color: rgba(0,0,0,0.1); }
.navigation-portrait .nav-menu > li > .nav-dropdown		{ border-top: 0; }

.navigation-portrait .submenu-indicator					{ margin-top: 5px; }
.navigation-portrait .submenu-indicator-chevron			{ border-color: #ffffff !important; }
.navigation-portrait .nav-menus-wrapper-close-button	{ color: #ffffff; }

.navigation-portrait .nav-toggle::before 				{ background-color: transparent; box-shadow: none; }
.navigation-portrait .nav-toggle 						{ display: block; width: 100%; height: auto; margin: 0; padding: 0; top: 12px; text-align: center; color: #ffffff; }


.navigation-landscape									{ height: 60px; background-color: transparent; }
.navigation-landscape .nav-menu 						{ float: left; }
.navigation-landscape .nav-menu li						{ background-color: transparent; margin: 0; }
.navigation-landscape .nav-menu li a					{ background-color: transparent; color: #ffffff; font-size: 15px; line-height: 1.0; font-weight: 400; font-family: "Martel Sans", sans-serif; }
.navigation-landscape .nav-menu > li > a 				{ line-height: 1.35; text-align: center; padding: 10px; display: table-cell; vertical-align: middle; text-transform: uppercase;
														  width: 145px; height: 60px; }

.navigation-landscape .nav-menu li ul 					{ width: 250px; }
.navigation-landscape .nav-menu li ul li 				{ border-bottom: 1px solid rgba(255,255,255,0.2); }
.navigation-landscape .nav-menu li ul li:last-child		{ border-bottom: 0; }
.navigation-landscape .nav-menu li ul li a				{ display: block; width: 100%; height: auto; word-wrap: normal; line-height: 1.2; padding: 12px 14px; }
.navigation-landscape .nav-menu .nav-dropdown			{ white-space: normal; }
.navigation-landscape .nav-menu > li 					{ border-left: 1px solid rgba(255,255,255,0.2); }
.navigation-landscape .nav-menu > li:last-child			{ border-right: 1px solid rgba(255,255,255,0.2); }

.navigation-landscape .nav-menu > li:hover > a			{ background-color: #626261; }
.navigation-landscape .nav-menu > li.active > a			{ background-color: #626261; }
.navigation-landscape .nav-menu > li.active > ul > li.active a	{ background-color: #626261; }
.navigation-landscape .nav-menu li ul 					{ background-color: #9db999; }
.navigation-landscape .nav-menu li ul li a:hover		{ background-color: #626261; }
.navigation-landscape .nav-menu li ul li.focus > a 		{ background-color: #626261; }

.navigation-landscape .nav-menu > li > .nav-dropdown	{ border-top: 0; }
.navigation-landscape .nav-menu li a .submenu-indicator .submenu-indicator-chevron 			{ border-color: transparent #ffffff #ffffff transparent; }
.navigation-landscape .nav-menu li ul li a .submenu-indicator								{ top: 12px; }
.navigation-landscape .nav-menu > li > a > .submenu-indicator 	{ position: absolute; bottom: 10px; float: none; display: block; width: 125px; height: auto; margin: 0; padding: 0; text-align: center; }
.navigation-landscape .nav-menu > li > a > .submenu-indicator > .submenu-indicator-chevron 	{ padding: 0; margin: 0 auto; }

.f-icon 				{ position: absolute; font-size: 20px; text-decoration: none; top: 15px; right: 30px; display: block; float: right; width: auto; height: 100%; color: #ffffff !important; }
@media (max-width: 991px)
{
	.f-icon				{ top: 10px; }
}

.sidenav				{ margin: 0; padding: 0; }
.sidenav li 			{ list-style: none; margin: 0; margin-bottom: 5px; padding: 0; }
.sidenav li a 			{ display: block; padding: 10px; background: #f4f4f4; }
.sidenav li a:hover 	{ background: #9db999; color: #ffffff; }


/************************************************
*** BOX
************************************************/

.box 				{ display: table; width: 100%; height: auto; margin: 0; padding: 0; }
.box .box-img		{ display: table-cell; width: 50%; height: auto; margin: 0; padding: 0; background-size: cover; -moz-background-size: cover;
					  -webkit-background-size: cover; -o-background-size: cover; background-position: center; }
.box .box-content	{ display: table-cell; width: 50%; height: auto; margin: 0; padding: 15px; }

.box-2 				{ display: table; width: 100%; height: auto; margin: 0; padding: 0; }
.box-2 .box-img		{ display: table-cell; width: 50%; height: auto; margin: 0; padding: 0; background-size: cover; -moz-background-size: cover;
					  -webkit-background-size: cover; -o-background-size: cover; background-position: center; }
.box-2 .box-content	{ display: table-cell; width: 50%; height: auto; margin: 0; padding: 15px; }


/************************************************
*** REVIEWS
************************************************/

.wrapper-reviews > .container 									{ max-width: 800px; }
.wrapper-reviews .wrapper-carousel 								{ padding-top: 30px; padding-bottom: 45px; padding-left: 30px; padding-right: 30px; background-color: #f4f4f4; }
.wrapper-reviews .wrapper-carousel .carousel-control-prev		{ text-align: left; left: -45px; }
.wrapper-reviews .wrapper-carousel .carousel-control-next		{ text-align: right; right: -45px; }
.wrapper-reviews .wrapper-carousel .carousel-indicators			{ bottom: -40px; }
.wrapper-reviews .wrapper-carousel .carousel-indicators li		{ background-color: #9b9b9b; }
.wrapper-reviews .wrapper-carousel .carousel-inner				{ width: 80%; margin: 0 auto; }
.wrapper-reviews .wrapper-carousel .carousel-control-prev-icon 	{ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%239b9b9b' viewBox='0 0 8 8'%3e%3cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3e%3c/svg%3e"); }
.wrapper-reviews .wrapper-carousel .carousel-control-next-icon 	{ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%239b9b9b' viewBox='0 0 8 8'%3e%3cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3e%3c/svg%3e");
}

/************************************************
*** IMAGES
************************************************/

.img-3zu2						{ width: 100%; /* whatever width you want */ position: relative; overflow: hidden; margin: 0; padding: 0; }
.img-3zu2:after 				{ padding-top: 66%; /* 3:2 ratio */ display: block; content: ''; }
.img-3zu2 .img-3zu2-content		{ position: absolute; top: 0; bottom: 0; right: 0; left: 0; /* fill parent */ overflow: hidden; background-size: cover; -moz-background-size: cover;
								  -webkit-background-size: cover; -o-background-size: cover; background-position: center; }

.img-1zu1						{ width: 100%; /* whatever width you want */ position: relative; overflow: hidden; margin: 0; padding: 0; }
.img-1zu1:after 				{ padding-top: 99.99%; /* 1:1 ratio */ display: block; content: ''; }
.img-1zu1 .img-1zu1-content		{ position: absolute; top: 0; bottom: 0; right: 0; left: 0; /* fill parent */ overflow: hidden; background-size: cover; -moz-background-size: cover;
								  -webkit-background-size: cover; -o-background-size: cover; background-position: center; }

.img-2zu1						{ width: 100%; /* whatever width you want */ position: relative; overflow: hidden; margin: 0; padding: 0; }
.img-2zu1:after 				{ padding-top: 50%; /* 2:1 ratio */ display: block; content: ''; }
.img-2zu1 .img-2zu1-content		{ position: absolute; top: 0; bottom: 0; right: 0; left: 0; /* fill parent */ overflow: hidden; background-size: cover; -moz-background-size: cover;
								  -webkit-background-size: cover; -o-background-size: cover; background-position: center; }

.gallery a .img-1zu1-content 		{ -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; }
.gallery a:hover .img-1zu1-content	{ opacity: 0.7; }

@media (max-width: 991px)
{
	.gallery .col-12				{ padding-top: 20px; }
}

.gallery h3 						{ padding-top: 45px; }
.gallery h4 						{ padding-top: 25px; }
@media (max-width: 991px)
{
	.gallery h3 					{ padding-bottom: 45px; }
	.gallery h4 					{ padding-top: 50px; }
}
@media (min-width: 992px)
{
	.gallery h3 					{ padding-top: 150px; }
	.gallery h4 					{ padding-top: 80px; }
}

@media (max-width: 767px)
{
	.img-fluid-limit 	{ max-width: 200px; }
}

.img-bordered 	{ border: 3px solid #ffffff; }

.media img 		{ width: 64px; height: 64px; margin-right: 10px; }

.f-right		{ float: right; margin-left: 15px; margin-bottom: 5px; width: 100%; max-width: 300px; height: auto; }
@media (max-width: 767px)
{
	.f-right	{ float: none; display: block; width: 100%; max-width: 100%; height: auto; margin-left: 0; margin-bottom: 15px; }
}


/************************************************
*** FOOTER
************************************************/

.wrapper-footer a 		{ color: #ffffff; }


/************************************************
*** TO TOP
************************************************/

#back-top				{ position: fixed; bottom: 30px; left: 50%; margin-left: -20px; }
#back-top a				{ width: 40px; height: 40px; display: table-cell; vertical-align: middle; text-align: center; background: #d8e3d6; color: #9db999;
						  -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; font-size: 18px; line-height: 20px; }
#back-top a:hover		{ background: #9db999; color: #ffffff; }

@media (max-width: 991px)
{
	#back-top			{ display: none; }
}


/************************************************
*** HEADLINES
************************************************/

h1	{ font-family: "Martel Sans", sans-serif; font-weight: 400; font-size: 35px; line-height: 1.3; margin: 0; padding: 0; }
h2	{ font-family: "Martel Sans", sans-serif; font-weight: 400; font-size: 30px; line-height: 1.3; margin: 0; padding: 0; }
h3	{ font-family: "Martel Sans", sans-serif; font-weight: 400; font-size: 25px; line-height: 1.3; margin: 0; padding: 0; }
h4	{ font-family: "Martel Sans", sans-serif; font-weight: 400; font-size: 20px; line-height: 1.3; margin: 0; padding: 0; }
h5	{ font-family: "Martel Sans", sans-serif; font-weight: 400; font-size: 18px; line-height: 1.3; margin: 0; padding: 0; }
h6	{ font-family: "Martel Sans", sans-serif; font-weight: 700; font-size: 15px; line-height: 1.3; margin: 0; padding: 0; }


/************************************************
*** BUTTONS
************************************************/

.btn				{ text-decoration: none !important; -webkit-transition: 0.3s; -moz-transition: 0.3s; -ms-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; border-radius: 0; }
.btn:focus 			{ box-shadow: none; }

.btn-primary		{ color: #ffffff; background: #626261; border-color: #626261; }
.btn-primary:hover	{ color: #ffffff; background: #000000; border-color: #000000; }

.btn-active			{ background-color: #9db999; border-color: #9db999; }


/************************************************
*** FARBEN / TEXT
************************************************/

.text-white			{ color: #ffffff; }
.text-green			{ color: #9db999; }
.text-grey			{ color: #626261; }

.bg-white			{ background: #ffffff; }
.bg-green			{ background: #9db999; }
.bg-green-light		{ background: #d8e3d6; }

.text-alice			{ font-family: "Alice", serif; }


/************************************************
*** MARGINS / PADDINGS
************************************************/

.m-top-5	{ margin-top: 5px !important; }
.m-bot-5	{ margin-bottom: 5px !important; }

.m-top-10	{ margin-top: 10px !important; }
.m-bot-10	{ margin-bottom: 10px !important; }

.m-top-15	{ margin-top: 15px !important; }
.m-bot-15	{ margin-bottom: 15px !important; }

.m-top-30	{ margin-top: 30px !important; }
.m-bot-30	{ margin-bottom: 30px !important; }

.m-top-45	{ margin-top: 45px !important; }
.m-bot-45	{ margin-bottom: 45px !important; }


.p-top-5	{ padding-top: 5px !important; }
.p-bot-5	{ padding-bottom: 5px !important; }

.p-top-10	{ padding-top: 10px !important; }
.p-bot-10	{ padding-bottom: 10px !important; }

.p-top-15	{ padding-top: 15px !important; }
.p-bot-15	{ padding-bottom: 15px !important; }

.p-top-20	{ padding-top: 20px !important; }
.p-bot-20	{ padding-bottom: 20px !important; }

.p-top-30	{ padding-top: 30px !important; }
.p-bot-30	{ padding-bottom: 30px !important; }

.p-top-40	{ padding-top: 40px !important; }
.p-bot-40	{ padding-bottom: 40px !important; }

.p-top-45	{ padding-top: 45px !important; }
.p-bot-45	{ padding-bottom: 45px !important; }

.p-top-100	{ padding-top: 100px !important; }
.p-bot-100	{ padding-bottom: 100px !important; }

.p-top-150	{ padding-top: 150px !important; }
.p-bot-150	{ padding-bottom: 150px !important; }

.p-15		{ padding-top: 15px; padding-bottom: 15px; padding-right: 15px; padding-left: 15px; }
.p-20		{ padding-top: 20px; padding-bottom: 20px; padding-right: 20px; padding-left: 20px; }


/************************************************
*** RATIO
************************************************/

.ratio									{ position: relative; width: 100%; aspect-ratio: 16/9; background-size: cover; background-position: center; background-repeat: no-repeat; }
.ratio > div 							{ position: absolute; top: 0; left: 0; width: 100%;	height: 100%; background: rgba(0,0,0,0.5); display: flex; flex-wrap: wrap; align-items: center; width: 100%; }
.ratio > div .ratio-content				{ display: block; width: 100%; height: auto; padding: 20px; text-align: center; }
.ratio > div .ratio-content button		{ padding: 0; margin: 0; background: none; border: 0; outline: 0; box-shadow: none; font-size: 45px; color: #ffffff; }
.ratio > div .ratio-content button:hover{ color:#9db999; }
.ratio > div .ratio-content p 			{ padding-top: 10px; font-size: 13px; color: #ffffff; }
.ratio > div .ratio-content p a:hover 	{ color: #ffffff; }
