*,
*::after,
*::before {
	box-sizing: border-box;
}

:root {
	font-size: 16px;
	--wrap-width: 60%;
	--black: #232323;
	--white: #FFF;
    --red: rgba(227, 87, 69, 1);
    --gray: rgba(70, 64, 64, 1);
    --gray_light_o: rgba(211, 211, 211, 0.95);
    --blue: rgba(80, 172, 226, 1);
}

body {
	margin: 0;
	--color-text: var(--black);
	--color-bg: #f1f3ed;
	--color-link: rgba(227, 87, 69, 1);
	--color-link-hover: #000;
	color: var(--black);
	background-color: var(--color-bg);
	font-family: 'Poppins', sans-serif;	
	overflow:visible;
    overflow-x:auto;
}

main {
bottom:0;
}

#maini {
min-width: 268px;
}



/* Page Loader */
.js .loading::before {
	content: '';
	position: fixed;
	z-index: 100000;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: var(--color-bg);
}

.js .loading::after {
	content: '';
	position: fixed;
	z-index: 100000;
	top: 50%;
	left: 50%;
	width: 60px;
	height: 60px;
	margin: -30px 0 0 -30px;
	pointer-events: none;
	border-radius: 50%;
	opacity: 0.4;
	background: var(--color-link);
	animation: loaderAnim 0.7s linear infinite alternate forwards;
}

@keyframes loaderAnim {
	to {
		opacity: 1;
		transform: scale3d(0.5,0.5,1);
	}
}

a{
-webkit-tap-highlight-color: transparent;
}

a {
	text-decoration: none;
	color: var(--color-link);
	outline: none;
}

a:hover,
a:focus {
	color: var(--color-link-hover);
	outline: none;
}

a.corp {
	text-decoration: none;
	color: var(--color-text);
	outline: none;
}

a.corp:hover,
a.corp:focus {
	color: var(--color-link);
	outline: none;
}

a.whitetored {
	color: #FFF;
}

a.whitetored:hover,
a.whitetored:focus {
	color: var(--red);
}


a.redtogray {
	color: var(--red);
}

a.redtogray:hover,
a.redtogray:focus {
	color: var(--gray);
}


a.graytogray {
	color: var(--gray);
}

a.graytogray:hover,
a.graytogray:focus {
	color: var(--gray);
}


a.whitetogray {
	color: #FFF;
}

a.whitetogray:hover,
a.whitetogray:focus {
	color: var(--gray);
}


.more-button-cont {
	padding: 2em 0;
    position: relative;
}

.more-button-cont a{
	display: inline-block;
    margin: 0 auto;
    padding: 1em 3em;
    border: 1px solid;
	background-color: white;
}

p {
line-height: 1.7;
}

.slim {
font-weight:200;
}

.center {
text-align:center;
}

[data-scroll] {
	will-change: transform;
}

.frame {
	padding: 0;
    position: relative;
    z-index: 10;
    margin: 0 auto;
    width: var(--wrap-width);
}

.frame ul {
list-style-type: none;
padding:0;
margin:0;
}

.frame ul li {
display:inline-block;
}

.frame__title-wrap {
	font-weight:300;
	margin: 0 0;
	display:inline-block;
}

.frame__links {
	display:inline-block;
	float:right;
	font-weight:300;
}

.frame a {
	margin: 0 0 -3px;
	padding: 0;
	text-transform: lowercase;
	display:inline-block;
}

.frame a span {
	padding: 10px 0 10px;
    display: block;
	border-bottom:2px solid transparent;
	border-bottom: 2px dashed var(--black);
}

.frame a.w--current span,
.frame a:hover span {
	color:var(--black);
	border-bottom:2px solid var(--black);
}

.frame a.corp:hover span,
.frame__title span,
.frame__title:hover span {
	border-bottom:2px solid transparent !important;
}


.frame__links li:not(:last-child) {
	margin-right: 0.5rem;
}

/*
.frame__demo--current,
.frame__demo--current:hover {
	color: var(--color-text);
} */



.content {
	display: block;
	position: relative;
	padding:0 0 0 0;
}

.content.headbg {
position:fixed;
padding:0 !important;
bottom:0;
}


.item {
	margin:0 auto;
	max-width: 100%;
	position: relative;
	will-change: transform;
}


.item h2{
	font-weight:800;
	font-size:200%;
	text-transform:uppercase;
	text-align:center;
}

.item h3{
	font-weight: 200;
    font-size: 250%;
    line-height: 1.4;
    color: #00bbc5;
}

.item__img-wrap {
	--aspect-ratio: 1/1.5;
	overflow: hidden;
	width: 100vw;
	margin: 0 auto;
	padding-bottom: calc(100% / (var(--aspect-ratio)));
	max-width: 100%;
	will-change: transform;
}

.item__img-wrap .title_cont{
	position: absolute;
    z-index: 3;
    width: var(--wrap-width);
    bottom: 10vh;
    left: 50%;
    transform: translateX(-50%);
	text-align:left;
}

.item__img-wrap h1 {
    font-size: 5em;
    line-height: 1.3;
    text-transform: uppercase;
	position:relative;
	z-index:2;
}

.item__img-wrap h2 {
    font-size: 2em;
    line-height: 1.3;
    text-transform:inherit;
	text-align:left;
	position:relative;
	z-index:2;	
}

.item .item__img-wrap {
	--image: url(../images/spacer.gif);
	height:100%;
	}
	

.slim {font-weight:100;}	

.scrollsec,
.scrollsec_top {
	width: 98vh;
    height: 98vh;
    left: 72%;
    top: -6vh;
    min-width: 50vh;
    min-height: 50vh;
    display: block;
    transform: translateX(-50%) rotate(29deg);
    content: '';
    -webkit-mask-size: cover;
    mask-size: cover;
    position: fixed;
    z-index: 1;
    background-color: white;
    -webkit-mask-image: url(../images/easywoodhouse_logo.svg);
    mask-image: url(../images/easywoodhouse_logo.svg);
}


.scrollsec { 
    width: 82vh;
    height: 82vh;
    left: 66%;
    top: -2vh;
	background-color: rgba(181, 182, 168, .09);
}	

section {
position:relative;
}

#fantop {
	padding: 0 !important;
    background-color: transparent;
    margin: -100vh 0 0 0 !important;
    position: absolute;
    top: 0;
	height:0 !important;
	min-height:0 !important;
	overflow:hidden;
}	

#udv .item__img-wrap {
	overflow:hidden;
	position:absolute;
	z-index: 2;
}

#udv .scrollsec {
	width: 124em;
    height: 120em;
    left: 62em;
    top: -18em;
    transform: translateX(-50%) rotate(29deg);
 }
 
#udv .item__img-wrap {
	padding:0 !important;
}

 
#vallalas .item__img-wrap {
	overflow:hidden;
	position:absolute;
	z-index: 2;
}

#vallalas .scrollsec {
    width: 146em;
    height: 129em;
    left: 40%;
    top: -50em;
    transform: translateX(-50%) rotate(-4deg);
 }
 
#vallalas .item__img-wrap {
	padding:0 !important;
}

#vallalas .item h3 {
margin-bottom:0;
}

#galeria .item__img-wrap {
	overflow:hidden;
	position:absolute;
	z-index: 2;
}

#galeria .scrollsec {
    width: 146em;
    height: 144em;
    left: 72%;
    top: -75em;
    transform: translateX(-50%) rotate(31deg);
 }
 
#galeria .item__img-wrap {
	padding:0 !important;
}

#galeria .item__caption {
padding:0;
min-height:0;
}

#kapcsolat .item__caption {
min-height:0;
}

#kapcsolat .item__img-wrap {
	overflow:hidden;
	position:relative;
	z-index: 2;
}

#kapcsolat .scrollsec {
    width: 146em;
    height: 144em;
    left: 72%;
    top: -75em;
    transform: translateX(-50%) rotate(31deg);
 }
 
#kapcsolat .item__img-wrap {
	padding:0 !important;
}

#kapcsolat ul {
	list-style-type: none;
    margin: 3em 0 0 0;
    padding: 0;
    display: block;
    position: relative;
    width: 100%;
}

#kapcsolat ul li{
padding:0 1em;
display:inline-block;
width:calc(100% / 3.1);
text-align:center;
vertical-align: middle;
position:relative;
}


#kapcsolat li.footer {
	position: relative;
    display: block;
    width: 100%;
    margin: 3em 0;
	color: var(--gray);
}

#kapcsolat li.footer span:first-child{
    border-right: 1px solid;
}

#kapcsolat li.footer span{
	padding:0.5em;
}


#kapcsolat .item__caption-wrap {
width:90%;
}


#kapcsolat li.flogo {
	text-align:center;
	width: 100%;
    bottom: 0;
    position: relative;
    display: block;
}

#kapcsolat li.fb a {
	padding: 1em;
    border: 1px solid transparent;
	display:block;
	user-select: none;
	-webkit-tap-highlight-color: transparent;
    tap-highlight-color: transparent;
    outline: none;
}

#kapcsolat li.fb a:hover {
    border: 1px solid transparent;
}

#kapcsolat li.fb a span {
	color:#FFF !important;
	position:relative;
	z-index:2;
	transition:all 0.1s ease;
}

#kapcsolat li.fb a:hover span {
	color:#FFF !important;
	position:relative;
	z-index:2;
}

#kapcsolat li.fb a i span{
	color:var(--red) !important;
	white-space: nowrap;
    padding-left: 6em;
    font-weight: 300;
    display: block;
	position:relative;
	z-index:3;
	transition:all 0.1s ease;
}

#kapcsolat li.fb a:hover  i span {
	color:var(--gray) !important;
}

#kapcsolat li.fb a:before {
    width: 3em;
    height: 3em;
    left: 50%;
    top: -0.5em;
    display: block;
    transform: translateX(calc(-50% + 5em));
    content: '';
    -webkit-mask-size: cover;
    mask-size: cover;
    position: absolute;
    z-index: 2;
    background-color: var(--gray);
    -webkit-mask-image: url(../images/facebook-logo.svg);
    mask-image: url(../images/facebook-logo.svg);
    cursor: pointer;
	transition:all 0.1s ease;
}

#kapcsolat li.fb a:hover:before {
	background-color: #4267b2;
}


#kapcsolat li.fb a:hover:after {
    width: 2.8em;
    height: 2.8em;
    top: -0.4em;
    transform: translateX(calc(-50% + 5em));
    content: '';
    position: absolute;
    z-index: 1;
    background-color: #FFF;
    cursor: pointer;
	border-radius:50%;
}



#kapcsolat li.tel a,
#kapcsolat li.mail a {
	padding:1em;
    border: 1px dashed;
	display:block;
}	

#kapcsolat li.tel a:hover,
#kapcsolat li.mail a:hover {
	padding: 1em;
    border: 1px solid #e35745;
	display:block;
	color:#FFF;
}

#kapcsolat li.tel:after,
#kapcsolat li.mail:after {
	display: block;
    background-color: var(--black);
    padding: 1em 0.5em 0.5em;
    text-align: center;
    content: '';
    color: var(--black);
    margin:0;
	max-height:0;
	position:absolute;
	width:calc(100% - 2em);
	pointer-events: none;
	opacity:0;
	transition: all 0.2s ease;
}

#kapcsolat li.tel:hover:after,
#kapcsolat li.mail:hover:after  {
    background-color: var(--red);
    padding: 0.5em;
    content: attr(data-info);
    color: var(--black);
    margin:-1px 0 0;
	max-height:100%;
	opacity:1;
}

#kapcsolat li.masolva:after,
#kapcsolat li.masolva:hover:after  {
    background-color: var(--gray);
    content: attr(data-prog) !important;
    color: var(--black);

}

#kapcsolat li.masolva a {
    border: 1px dashed var(--gray);
	color:var(--gray);
}

#kapcsolat li.masolva a:hover {
    border: 1px solid var(--gray);
	color:var(--gray);
}

#kapcsolat .partner {
	display: block;
    padding: 1.5em;
    border: 1px solid var(--gray);
    border-left: none;
    border-right: none;
    color: var(--gray);
    margin-top: 6em;
    width: 100%;
	font-weight: 300;
    font-size: smaller;
	}
	
	
#kapcsolat .partner a {
color: darkcyan;
font-weight: 800;
}	

#kapcsolat .partner a:hover {
color: var(--gray);

}	

#kapcsolat .flogo svg {
width:7em;
}


#kapcsolat .flogo a:after {
    width: 1em;
    height: 1em;
    left: 50%;
    top: -0.5em;
    display: block;
    transform: translateX(calc(-50% + 4em));
    content: '';
    -webkit-mask-size: cover;
    mask-size: cover;
    position: absolute;
    z-index: 1;
    background-color: var(--red);
    -webkit-mask-image: url(../images/gotop.svg);
    mask-image: url(../images/gotop.svg);
    cursor: pointer;
	transition:all 0.1s ease;
}

#kapcsolat .flogo a:hover:after {
    background-color: var(--gray);
	transition:all 0.1s ease;
}


#kapcsolat .flogo a svg {
transform: scale(1); 
transition:all 0.1s ease;
}

#kapcsolat .flogo a:hover svg {
transform: scale(0.9); 
}


#kapcsolat .flogo a svg .ftl {
   stroke:#FFF;
}

#kapcsolat .adatvedelem {
	display: block;
	max-height:0;
	padding:0;
	overflow:hidden;
	
}

#kapcsolat .adatvedelem.open {

	display: block;
    width: 100%;
    padding: 2em 0;
	max-height:100%;
}

#kapcsolat a.button_ok {
    padding: 0.5em 2em;
    background: var(--red);
    color: var(--black);
    margin-top: 0.5em;
    display: inline-block;
    border: 1px solid var(--red);
	transition: all .2s ease;
}

#kapcsolat a.button_ok:hover {
    background: var(--black);
    color: var(--red);
    border: 1px solid var(--red);
}

/* 
#kapcsolat .flogo a:hover svg .ftl {
   stroke:var(--gray);
} */


#top {
padding:0 !important;
margin:0 !important;
height:0 !important;
height:0 !important;
}

section {
padding:20vh 0 0;
}

section:last-child {
padding:0;
}


.item__img {
	--overflow: 120px;
	height: calc(100% + (2 * var(--overflow)));
	top: calc( -1 * var(--overflow));
	width: 100%;
	position: absolute;
	background-image: var(--image);
	background-size: cover;
	background-position: 50% 0%;
	will-change: transform;
}


.item__caption {
	padding: 3em 0;
    margin:0 auto;
    width: 100%;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    min-height: 80vh;
}

.udv {
background-color:#fff;
}

.vallalas {
background-color:#fff;
}

.vallalas ul {
margin: 0 0 3em;
padding:0;
list-style-type:none;
}

.vallalas ul li{
display:inline-block;
width:calc(100% / 4.1);
padding:0;
margin:0;
text-align:center;
}

.vallalas ul li h3{
	display: block;
    padding: 0;
    margin: 0;
    font-size: 1.2em;
    font-weight: 300;
	text-align:center;
}

.vallalas ul li p{
	display:block;
	padding:0;
	margin:0;
	text-align:center;
}

.vallalas ul li p i{
	 font-weight: 200;
}


.vallalas svg {
width:90%;
height:90%;
}

.galeria {
background-color:transparent;
}

.kapcsolat {
background-color:#232323;
color:#FFF;
}



#foc {
transition:all 0.5s ease;
}

.item__caption-wrap {
	width: var(--wrap-width);
    margin: auto;
	z-index:3;
}

.item__caption-title {
	font-family: 'Poppins', sans-serif;
	font-weight: 400;
	font-size: 3rem;
}

.item__caption-copy {
	margin: 0;
}

#it_1 {height:100vh; padding-bottom:100% !important;}


#pixie {
position:absolute;
top:0;
z-index:10;
width:100vw;
height:100vh;}


.navbar-wrapper {
	height: 3rem;
    position: fixed;
    top: 0;
	transform: translateY(0%);
    width: 100%;
    z-index: 100;
	transition: transform 0.2s ease;
}

.navbar-wrapper.off {
	/* transform: translateY(calc(-100% - 2px)); */
}

nav {
	background-color: #FFF;
    display: block;
    content: '';
    position: relative;
    width: 100%;
    z-index: 10;
	top:0;
}

nav.pinned {
	color: var(--color-text);
	transition: 0.2s ease color;
	-webkit-transition: 0.2s ease color;

}

.half {
width: 45%;
display: inline-block;
}


#popimg_cont {

display:none;

}

#popimg_cont.open {

display:block;
width:100vw;
height:100vw;
position:fixed;
top:0;
z-index:1000;

}

#close_popimg {
	position: fixed;
    top: 1em;
    right: 1em;
    z-index: 1001;
    padding: 0;
    cursor: pointer;
    height: 2em;
    width: 2em;
    overflow: hidden;
	opacity:.5;
	-webkit-animation: opacity 0.2s ease-out !important;
    -moz-animation: opacity 0.2s ease-out !important;
    -o-animation: opacity 0.2s ease-out !important;
    animation: opacity 0.2s ease-out !important;
}

#close_popimg:hover {
	opacity:1;
	-webkit-animation: opacity 0.2s ease-out !important;
    -moz-animation: opacity 0.2s ease-out !important;
    -o-animation: opacity 0.2s ease-out !important;
    animation: opacity 0.2s ease-out !important;
}


#close_popimg svg {
	fill: var(--black);
    width: 2em;
}


.menu {
    background-color: transparent;
    border: none;
    cursor: pointer;
    display: inline-block;
    padding: 0;
    margin: 0 1em -0.2em;
    outline: 0;
    vertical-align: bottom;
}

.menu svg {
width:2em;
height:2em;
}

.line {
  fill: none;
  stroke: black;
  stroke-width: 7;
  transition: stroke-dasharray 600ms cubic-bezier(0.4, 0, 0.2, 1),
    stroke-dashoffset 600ms cubic-bezier(0.4, 0, 0.2, 1);
}
.line1 {
  stroke-dasharray: 60 207;
  stroke-width: 7;
}
.line2 {
  stroke-dasharray: 60 60;
  stroke-width: 7;
}
.line3 {
  stroke-dasharray: 60 207;
  stroke-width: 7;
}
.opened .line1 {
  stroke-dasharray: 90 207;
  stroke-dashoffset: -134;
  stroke-width: 7;
}
.opened .line2 {
  stroke-dasharray: 1 60;
  stroke-dashoffset: -30;
  stroke-width: 7;
}
.opened .line3 {
  stroke-dasharray: 90 207;
  stroke-dashoffset: -134;
  stroke-width: 7;
}

#hambi {
display:none;
}

.call {
	display: inline-block;
    background-color: #fee119;
    color: var(--black);
    padding: 0.1em 0.6em;
}

@media only screen and (max-width: 90.375em) {

:root {
	font-size: 16px;
	--wrap-width: 80%;
}

.item__img-wrap h1 {
    font-size: 5.5vw;
}

.item__img-wrap h2 {
    font-size: 1.6vw;
    line-height: 1.5;
}	

}

@media only screen and (max-width: 67.5em) {

:root {
	font-size: 16px;
	--wrap-width: 90%;
}


.item__img-wrap h1 {
    font-size: 6.5vw;
}

.item__img-wrap h2 {
    font-size: 100%;
    line-height: 1.5;
}	

.item__img.bl {
width: calc(100vw - 3em);
    margin: 0 1em;
    overflow-y: hidden;
}	

.item__caption {
    margin: 0 1em;
    width: calc(100% - 2em);
}	


.item h3 {
    font-weight: 200;
    font-size: 185%;
}


}

@media only screen and (max-width: 63em) {

.vallalas ul li {
    width: calc(100% / 2.1);
}

.vallalas svg {
    width: 80%;
    height: 80%;
}	


#kapcsolat ul {
	list-style-type: none;
    margin: 3em 0 0 0;
    padding: 0;
    display: block;
    position: relative;
    width: 100%;
}


#kapcsolat ul li {
    padding: 0 1em;
    display: inline-block;
    width: calc(100% / 2.1);
    text-align: center;
    vertical-align: middle;
    position: relative;
}

#kapcsolat ul li.fb{
padding:0 1em 2em;
display:block;
width:100%;
text-align:center;
vertical-align: top;
}


}

@media only screen and (max-width: 45.625em) {

#kapcsolat ul li {
    padding: 0;
    display: inline-block;
    width: 100%;
    text-align: center;
    vertical-align: middle;
    position: relative;
}

#kapcsolat ul li.tel{
margin-bottom: 3em;
}

#kapcsolat li.tel:after, #kapcsolat li.mail:after {
    padding: 1em 0em 0.5em;
    width: 100%;
}

.more-button-cont a {
    margin: 0 auto;
    padding: 1em;
}

#kapcsolat li.footer span {
    padding: 1em 0;
    display: block;
}




#hambi {
display:inline-block;
}

.frame {
width:100%;
}

.frame__title-wrap {
z-index:2;
width: 100%;
display:block;
background-color: #FFF;
position: relative;
}

.frame__title-wrap>ul li{
width:49%;
text-align:right;
}

.frame__title-wrap>ul li:first-child{
padding: 0 1.5em;
text-align:left;
}


.frame__links {
    display: block;
    float: none;
    font-weight: 300;
    position: absolute;
	z-index:1;
    background-color: var(--red);
    width: calc(100% - 2em);
    margin: 0 1em;
    padding: 0 0 3em;
	min-width: 236px;
}

.frame__links ul li {
	display:block;
}

.frame__links ul li a {
	display:block;
	color:#FFF;
	margin:0.5em 1.5em; 
}


#mnal {
transform: translateY(-200%);
transition: transform 0.2s ease;
}

#mnal.open {
transform: translateY(5%);
}


#mnal .call {
display:none;
}



}

@media only screen and (max-width: 42em) {

.vallalas ul li {
    width: 100%;
}

.vallalas svg {
    width: 80%;
    height: 80%;
}	

}

@media only screen and (max-width: 28.25em) {

#hambi a {
    position: absolute;
    right: 1em;
    top: 3.5em;
}	

#mnal.open {
transform: translateY(21%);
}


}

@media only screen and (max-width: 24.125em) {

#kapcsolat ul li.fb {
	padding: 0 0 2em;
}

#kapcsolat li.fb a {
	padding: 1em 0;
}

#kapcsolat li.fb a i span {
	padding-left:30%;
}

}


#fakemess {
	position: fixed;
    bottom: 1.53em;
    right: 1.51em;
    display: block;
    z-index: 100000;
}


#fakemess .close {
	width: 2em;
    height: 2em;
    margin: 0 -1em -0.5em auto;
    display: block;
    content: '';
    position: relative;
    z-index: 1;
    cursor: pointer;
}

#fakemess .close svg {
	width: 0.5em;
    height: 0.5em;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    content: '';
    position: absolute;
    z-index: 1;
    stroke: var( --red);
	transition:all 0.1s ease;
}

#fakemess .close:hover svg {
    stroke: var(--gray);
}

#fakemess .fml_cont {
	width: 3.73em;
    height: 3.75em;
    position: relative;
    background-color: var(--red);
    border-radius: 50%;
    cursor: pointer;
}

#fakemess .fml_log{
	width: 2.65em;
    height: 2.65em;
    left: 50%;
    top: 50%;
    display: block;
    transform: translate(-50%, -50%);
    content: '';
    -webkit-mask-size: cover;
    mask-size: cover;
    position: absolute;
    z-index: 1;
    background-color: #FFF;
    -webkit-mask-image: url(../images/messenger.svg);
    mask-image: url(../images/messenger.svg);
    transition: all 0.1s ease;
	}
	
#fakemess .fml_cont:hover {
	background-color:var(--gray);
}	

#addslider:before {
    position: absolute;
    width: 100%;
    height: 100%;
    display: block;
    background-color: var(--black);
    mix-blend-mode: lighten;
    z-index: 6;
    content: '';
}	


@media only screen and (max-height: 40em) {

#kapcsolat li.footer {
    position: relative;
    bottom: 0;
    padding: 3em 0 2em;
    display: block;
    width: 100%;
}

#kapcsolat li.flogo {
	position:relative;
}

}

@media only screen and (max-width: 24.4375em) {

.item h3 {
    font-size: 150%;
}

}

.cookienfobot {
	position: fixed;
    bottom: 0;
    z-index: 3;
    width: 100%;
    left: 0;
    background: var( --black);
	padding: 0 4.3em 0 4em;
}

.cookienfobot p {
    font-size: 72%;
    line-height: 1.3;
    color: var(--white);
    position: relative;
    padding: 0.2em 0 0;
}

.cookienfobot p.button {
    line-height: 0;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    padding: 0;
    margin: 0;
}

.cookienfobot p.button a{
    font-size: 99%;
}

.cookienfobot p a {
    color: var(--red);
}

.cookienfobot p.button a strong {
    padding:0;
    width: 1.95em;
    height: 1.95em;
    background: var(--red);
    border-radius: 50%;
    color: var(--black);
    display: inline-block;
    position: absolute;
    left: -3em;
    top: 50%;
    transform: translateY(-50%);
}

.cookienfobot p a strong span {
    position: absolute;
	left:50%;
	top:50%;
	transform:translate(-50%,-50%);
}

.cookienfobot p.button a:hover strong {
     background: var(--white);
     color: var(--black);
 }


.cookienfobot p.button a strong svg {
	width: 0.7em;
    height: 0.7em;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    content: '';
    position: absolute;
    z-index: 1;
    stroke: var( --black);
    transition: all 0.1s ease;
}

.cookienfobot p.button a:hover strong svg {
    stroke: var( --gray);
}

.cookienfobot p a i span {
position:relative;
font-style:normal;
}

.cookienfobot p a i span:before {
    content: '';
    height: 0.12em;
    position: absolute;
	background: var(--red);
    left: 50%;
    bottom: 0.1em;
    width: 100%;
    transform: translateX(-50%);
	transition: all 0.2s;
}

.cookienfobot p a:hover i span:before {
    width: 70%;
	transition: all 0.2s;
}