/*
Theme Name:   palm-beach-child
Description:  trekking-marokko.de/
Author:       Gunnar
Author URL:   https://trekking-marokko.de/
Template:     palm-beach
Version:      1.0
License:      GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html
Text Domain:  palm-beach-child
*/

:root
{
	--navi-color: #fff;
	--site-title-color: #fff;
	--main-color: #98362b;
	--main-colorrgb:152, 54, 43;
	--sand-color: #FFF7D6;
	--gras-color: #24611A;
	--text-color: #151e41;
	--header-background-color: #98362b;
	--navi-submenu-color: #98362b;
	--navi-hover-color: #ff8d2c;
	--button-hover-color: #ff8d2c;
	--title-line-height: 1.3;
	--link-color:#DC143C;
	--medium-text-color: #232323;
	---tm-highlight: #556a52;
}

.home .post .entry-meta{
	display: none;
}


.header-title {
	text-transform: inherit;
	font-style: normal;
	font-weight:700;
	font-family: sans-serif;
	font-size:5em;
	color: rgb(21, 30, 65);
	text-shadow: unset;
	text-align: center;
	font-size: 2.7em!important;
	padding-top: 15px;
	display: block!important;
	min-height: 80px;
	letter-spacing: 0.025em;
	margin-top: 20px;
}
.header-main {
	justify-content: space-between;
}
.site-title{
	font-family: sans-serif;
	letter-spacing: 0.1em;
}
.site-title a:hover, .site-title a:active {
	color: #7a865e;
	color: var(--navi-hover-color);
}
a:hover, .site-title a:active {
	color: #005a82;
}
.wp-block-image figcaption, .wp-block-embed figcaption{
	font-size:1rem;
}
body.admin-bar header {
	top: 32px!important;
}
body{
	font-family: sans-serif;
	font-weight:300;
	letter-spacing: 0.03em;
	font-display: swap;
}
#masthead {
	position: sticky;
	top: 0;
	left: 0;
	right: 0;
	z-index: 10000!important;
	transition: transform 0.3s ease-in-out;
}
.header-hidden {
	transform: translateY(-100%);
}
body.page .entry-content {
	font-size: 18px;
	margin-top:20px;
}
.site-description{
	display: none;
}
.entry-content > * {
	max-width: 1280px;
	margin-left: auto;
	margin-right: auto;
}
.entry-content > .pl_blue {
	max-width: none;
	margin-left: 0;
	margin-right: 0;
}
.header-title-image {
	position:relative;
margin-bottom: 30px;
}
.header-title-image img{
	width:100%;
	object-fit:cover;
	height:100%;
}
.header-title-image::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(180deg, rgba(255,255,255,0.0) 40%,rgba(255,255,255,0.0872) 57%, rgba(255,255,255,0.31054) 81%, rgba(255,255,255,0.9240) 98%, rgba(255,255,255,1) 100%, rgba(255,255,255,1) 100%);
}
#content{
	max-width:unset;
	padding: 0;
}
#primary{
	max-width:unset;
	margin-left: 10%;
}
#secondary{
	margin-right: 10%;
	    border-left: 1px solid;
    border-color: #ddd;
        padding-left: 20px;
}
.sidebar {
    float: right;
    width: 20%;
}
.content-area {
	width: 60%;
}
.wp-post-image {
    width: 100%;
    aspect-ratio: 4 / 3;
        object-fit: cover;
}
.post-template-template-fullwidth .content-area {
	width: 80%;
}
.post-template-template-fullwidth #primary{
	max-width:1100px;
	margin:auto;
}
.entry-meta {
	display: none;
}
.ul_realfullwidth{
	width:100%;
	max-width: unset!important;
}
.ul_realfullwidth.ul_columns ,.ul_realfullwidth.wp-block-group  {
	padding: 0 0!important;
}
.ul_normalwidth  {
	max-width:1280px;
	padding: 0 0!important;
	margin-left:auto;
	margin-right:auto;
}
.ul_fullwidth  img{
	width:100%;
}
  .ul_white_columns .fullwidthcontent,
  .ul_realfullwidth .fullwidthcontent {
    padding: 0 !important;
    max-width: 100%;
  }
.wp-block-group .ul_fullwidth {
	padding:0!important;
}
.fullwidthcontent{
	padding: 0 6.5em!important;
}
.fullwidth-content-area {
	width:100%!important;
}
.ul_fullwidth_text {
  width: 70%;
  margin: auto;
}
figure {
	margin: 0;
	width: 100%;
}

.more-link {
 		display: flex;
    padding: 0.6rem 2rem 0.6rem 1rem;
    width: fit-content;
    float: left;
background-color: #e8e5da;
border-color: #e8e5da;

}
.more-link:before {
	content: "";
    display: inline-block;
    width: 20px;
    height: 20px;
    background-image: url(/wp-content/uploads/arrow_right.svg);
    background-size: cover;
    margin-right: .4em;
  }
.more-link:hover, .more-link:active {
    border-color: var(---tm-highlight);
   background-color: var(---tm-highlight);
}

.post-column .post{
	    background-color: rgba(232, 229, 218, 0.3);
    box-shadow: 1px 1px 5px 0 rgba(82, 82, 82, .25);
}

.entry-title {
    display: block;
        padding: 0 20px;
  }
  .entry-title a:hover{
color: var(---tm-highlight);
  }
  .post-wrapper .post-column article .entry-content {
        padding: 0 20px 20px;
}


.trekk-close-button{  width: 25px!important;
    height: 25px!important;
    line-height: 25px!important;
    font-size: 20px!important;
    top: 10px;
    background-color: #ff8d2c!important;
    border-radius: 5px!important;
    position: absolute!important;
right: 10px!important;
color:#fff;
}

#findbookingboxcontent {
    max-width: fit-content;
}
#findbookingbox, #findbookingboxcontent{
	padding: 18px 26px!important;
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    align-items: center;
    background-color: var(---tm-highlight);
    flex-wrap: wrap; 
    border-radius: 8px;
    color: #fff;
    font-family: 'Mulish';
    border: 1px dotted;
    margin-left: auto;
    margin-right: auto;
    top: 700px;
    gap: 25px;
	z-index:99;

   
}
#findbookingbox{
	position: absolute;
top:75%;
left: 50%;
 transform: translate(-50%, 0%);
}

#findbookingbox input, #findbookingboxcontent input, #findbookingbox select
{
	color: var(--main-color)!important;
	border-radius: 5px;
	box-shadow: rgba(35,119,196,0.15) 0 5px 15px;
	line-height: 1;
	height: 38px;
    background-size: 20px;
    background-color:white;
	width: 250px;
}

#findbooking, #findbookingContent
{	
	background: var(--main-color);
	color: white;	
	border:1px solid white;
	border-radius: 5px;
	box-shadow: rgba(35,119,196,0.15) 0 5px 15px;
	justify-content: center;
	display: flex;
	gap: 7px;
	align-items: center;
	font-size: 1rem;
	 line-height: 1.4;
	text-transform:unset;
	letter-spacing:0.03em;
}

#findbooking:hover svg path , #findbookingContent:hover svg path { fill: var(--main-color)!important; }
#findbooking svg path, #findbookingContent svg path   { fill: #ff8d2c }
#findbooking:hover, #findbookingContent:hover 
{
border-color: #fff;
	background: #ff8d2c;
	color: #fff;
}

#findbook, #findbookContent { text-decoration: none!important;}
#findbookingbox a { padding: 0px; 
display: flex; 
	justify-content: center;}

	#MarokkoStaedte{
	width:250px;
}
#findbookingbox .dropdown label {display: none;}

@media (max-width:1300px)
{

	#findbookingbox
	{
		margin-bottom: 20px;
		line-height: 1;
		padding: 18px 20px;
		    top: 60%;
	}
	
	#findbookingbox input
	{
		margin-left: 0px;
		margin-top: 0px;
		margin-bottom: 0px;	 
	}
	
}

@media (max-width:1000px)
{

	#findbookingbox
	{
		
		    top: 500px;
	}
}

@media (max-width:767px) {
	.content-area {
	width: 90%;
}
.site-title {  
    letter-spacing: 0em;
}
#primary {
    margin-left: 5%;
    margin-right: 5%;
     margin-top:75px;
}
.sidebar {
    width: 90%;
     margin-left: 5%;
    margin-right: 5%;
}
.header-title {
    font-size: 2em !important;
  }
#findbookingbox, #findbookingboxcontent {
    padding: 13px 16px !important;
    top: 65%!important;
		margin-bottom: 20px;
		line-height: 1;
		max-width:min-content;
		    gap: 14px;
	}
	
	#findbookingbox input
	{
		    height: 35px;
		margin-left: 0px;
		margin-top: 0px;
		margin-bottom: 0px;	 
	}
	
}
/*anzeige ende */