/*
Theme Name: 	Arkin - Framework 2
Theme URI: 		https://www.lemon.nl
Description: 	12/2023
Version: 		2.12
Author: 		Roeland ten Holder | Lemon
Author 			URI: roeland@lemon.nl
*/

/** ******************************** **/
/**      _____                       **/
/**    _(  _  )__________________    **/
/**   ( | (___)     | ____ |  _  |   **/
/**   |_|_______|_|_|______|_| |_|   **/
/**                                  **/
/**            www.lemon.nl          **/
/**                                  **/
/** ******************************** **/

/*************** FONTS ****************/
/*
'Palanquin Dark'	normal			500
'Noto Sans'			normal/italic	400,600,700
*/

.home-card h2, 
h1							{ font-size: 32px; line-height: 1em; font-weight: 500; font-style: normal; font-family: 'Palanquin Dark', Arial, Helvetica, Verdana, sans-serif; padding: 0 0 20px 0; }
.intro-card h2				{ font-size: 36px; line-height: 1em; font-weight: 500; font-style: normal; font-family: 'Palanquin Dark', Arial, Helvetica, Verdana, sans-serif; }
h2, h2 a 					{ font-size: 26px; line-height: 1em; font-weight: 500; font-style: normal; font-family: 'Palanquin Dark', Arial, Helvetica, Verdana, sans-serif; padding: 0 0 20px 0; }
h3, .quoteblock h2, h3 a 	{ font-size: 22px; line-height: 1em; font-weight: 500; font-style: normal; font-family: 'Palanquin Dark', Arial, Helvetica, Verdana, sans-serif; padding: 0 0 20px 0; }
h4, .content .card-body h4	{ font-size: 30px; line-height: 1em; font-weight: 500; font-style: normal; font-family: 'Palanquin Dark', Arial, Helvetica, Verdana, sans-serif; padding: 0 0 20px 0; }
.content h4					{ font-size: 18px; line-height: 1.5em; font-weight: 500; font-style: normal; font-family: 'Palanquin Dark', Arial, Helvetica, Verdana, sans-serif; padding: 0 0 20px 0; }
h5							{ font-size: 26px; line-height: 1em; font-weight: 500; font-style: normal; font-family: 'Palanquin Dark', Arial, Helvetica, Verdana, sans-serif; padding: 0 0 0 0; }
h6							{ font-size: 18px; line-height: 1em; font-weight: 500; font-style: normal; font-family: 'Palanquin Dark', Arial, Helvetica, Verdana, sans-serif; padding: 0 0 5px 0; }
body 						{ font-size: 16px; line-height: 1.5em; font-weight: 400; font-style: normal; font-family: 'Noto Sans', Arial, Helvetica, Verdana, sans-serif; }
.card-body,
p span.intro, 
span.intro, p.intro 		{ font-size: 18px; line-height: 1.5em; font-weight: 500; font-style: normal; font-family: 'Palanquin Dark', Arial, Helvetica, Verdana, sans-serif; }
.footer, .footer a,

.breadcrumbcontainer span,
.breadcrumbcontainer a,
.breadcrumb,
.small						{ font-size: 13px; line-height: 1.5em; font-weight: 400; font-style: normal; font-family: 'Noto Sans', Arial, Helvetica, Verdana, sans-serif; text-align: left; }
.gform_button.button,
.tag						{ font-size: 90px; line-height: 0.6em; font-weight: 400; font-style: normal; font-family: 'Noto Sans', Arial, Helvetica, Verdana, sans-serif; padding: 0 0 10px 0; }
ul.main-menu li a 			{ font-size: 30px; line-height: 0.9em; font-weight: 500; font-style: normal; font-family: 'Noto Sans', Arial, Helvetica, Verdana, sans-serif; display: inline-block; }
ul.main-menu li li a		{ font-size: 16px; line-height: 0.9em; font-weight: 500; font-style: normal; font-family: 'Noto Sans', Arial, Helvetica, Verdana, sans-serif; display: inline-block; }
ul.top-menu li a 			{ font-size: 18px; line-height: 0.9em; font-weight: 500; font-style: normal; font-family: 'Noto Sans', Arial, Helvetica, Verdana, sans-serif; padding: 0; margin-bottom: 5px; display: inline-block ;}

ul.small-top-menu li a 		{ font-size: 14px; line-height: 0.9em; font-weight: 500; font-style: normal; font-family: 'Noto Sans', Arial, Helvetica, Verdana, sans-serif; display: inline-block; color: #ffffff; }



h1 a, h2 a, h3 a, 
h4 a, h5 a, h6 a 			{ text-decoration: none; }


.has-keurmerk-topggz {
	position: absolute;
	right: 20px;
	bottom: 40px;
	width: unset;
}

.has-keurmerk-topggz p span {
	display: none;
}

.keurmerk-topggz {
	width: 80px;
	height: auto;
	border: 5px solid #fff !important;
	border-radius: 40px;
}

.card-body .keurmerk-topggz {
	position: absolute;
	right: 20px;
	top: -80px;
	width: 80px;
	height: auto;
	border: 5px solid #fff !important;
	border-radius: 40px;
}


.content li a,
.content p a:not(.btn):not(.card-link) {
	background: 
		linear-gradient(to right, #ffffff 0%, #ffffff 100%),
		linear-gradient(to right, #000000 0%, #000000 100%);
	background-size: 100% 1px, 0 1px;
	background-position: 100% 100%, 0 100%;
	background-repeat: no-repeat;
	transition: background-size 400ms;
	color: #777777;
	text-decoration: none;
}

.search-content a *,
.search-content a {
	text-decoration: none !important;
	color: #333333 !important;
}

.search-content a:hover *,
.search-content a:hover {
	opacity: 0.9;
}

.search-content a:hover h3 {
	text-decoration: underline !important;
}

.content li a:hover,
.content li a:focus,
.content p a:not(.btn):not(.card-link):hover,
.content p a:not(.btn):not(.card-link):focus {
	background-size: 0 1px, 100% 1px;
	transition: background-size 400ms;
	color: #000000;
	text-decoration: none;
}



#small-top-menu {
	position: absolute;
	right: 0;
}

.small-top-menu li {
	display: inline-block;
	margin: 0 7px;
}


.small-top-menu a,
.top-menu a,
.main-menu .sub-menu > li > a,
.main-menu .sub-menu > li.current-menu-item > a {
	padding: 4px 0;
	margin: 0;
	background: 
		linear-gradient(to right, transparent 0%, transparent 100%),
		linear-gradient(to right, #ffffff 0%, #ffffff 100%);
	background-size: 100% 1px, 0 1px;
	background-position: 100% 100%, 0 100%;
	background-repeat: no-repeat;
	transition: background-size 400ms;
	text-decoration: none;
}

.small-top-menu a:hover,
.top-menu a:hover,
.main-menu .sub-menu > li > a:hover,
.main-menu .sub-menu > li.current-menu-item > a {
	text-decoration: none;
	background-size: 0 1px, 100% 1px;
	transition: background-size 400ms;
}

nav .socials {
	margin: 15px 0 15px 15px;
	float: left;
}

nav .languages {
	margin: 15px 15px 15px 0;
	float: left;
}

.languages a i {
	display: inline-block;
	width: 32px;
	height: 32px;
	border-radius: 32px;
	border: 4px solid #ffffff;
	background-color: #ffffff;
}

.languages a i.flag {
	background-position: center center;
	background-repeat: no-repeat;
	background-size: 36px 24px;
}

.languages a i.flag.flag-en { background-image: url('images/flags/en.png'); }
.languages a i.flag.flag-gb { background-image: url('images/flags/gb.png'); }
.languages a i.flag.flag-iw { background-image: url('images/flags/iw.png'); }
.languages a i.flag.flag-ma { background-image: url('images/flags/ma.png'); }
.languages a i.flag.flag-nl { background-image: url('images/flags/nl.png'); }
.languages a i.flag.flag-pt { background-image: url('images/flags/pt.png'); }
.languages a i.flag.flag-tr { background-image: url('images/flags/tr.png'); }

.languages a:hover i.flag {
	opacity: 0.8;
}

nav .social-link {
	font-size: 32px;
	margin: 0 15px 0 0;
}

nav a.social-link:hover {
	opacity: 0.8;
}

.streamercontent p a:not(.btn):not(.card-link),
.streamercontent p a:not(.btn):not(.card-link):hover,
.streamercontent p a:not(.btn):not(.card-link):focus {
	color: #ffffff;
}

.relative { position: relative;}

.social-link,
.footer a 			{ color: #ffffff !important; text-decoration: none !important; }
.footer a:hover 	{ color: #ffffff; text-decoration: underline !important; }
.footer 			{ color: #ffffff; }

.social-link {
	font-size: 24px;
	margin: 0 10px 0 0;
}

/*<span style="text-decoration: underline;"></span>*/
span[style*="text-decoration: underline"],
u {
	text-decoration: none!important;
	padding: 0 2px;
	margin: 0 -2px;
}


/************* CONTAINERS *************/

.grid .content,
.grid {
	border: 1 px solid grey;
}

.headerwrapper 			{ margin-bottom: 40px; }
.breadcrumbcontainer 	{ margin: 20px -20px; }
.fullcontainer 			{ width: 100%; }
.widercontainer 		{ width: 100%; max-width: 860px; padding-left: 20px; padding-right: 20px; margin-left: auto; margin-right: auto; }
.widthcontainer 		{ width: 100%; max-width: 830px; padding-left: 20px; padding-right: 20px; margin-left: auto; margin-right: auto; }
.container 				{ width: 100%; max-width: 800px; padding-left: 20px; padding-right: 20px; margin-left: auto; margin-right: auto; }

.row:not(.has-intro-cards)		{ margin-left: -20px; margin-right: -20px; }
.row:not(.has-intro-cards) > *	{ padding-left: 20px; padding-right: 20px; }


iframe 					{ max-width: 100%; }

.wrap {
	max-width: 100vw;
	overflow-x: hidden;
}



/*************** COOKIE NOTICE ***************/
#cookie-notice {
	/* display: none; */
	background: transparent !important;
}

#cookie-notice.cookie-notice-visible {
	display: block;
	width: 100%;
	height: 100vh;
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 3000;
	background-color: rgba(74, 74, 74, .5) !important;
}

#cookie-notice.cookie-revoke-visible {
	display: block;
	position: fixed;
	bottom: 50px;
	left: 50px;
}

#cn-close-notice,
#cn-revoke-text {
	display: none;
}

#cookie-notice.cookie-notice-visible .cookie-notice-container {
	position: absolute;
	background-color: #f9f9f9 !important;
	text-align: left;
	min-width: unset;
	bottom: 5vh;
	left: 5%;
	margin: 0 auto;
	font-size: 16px;
	line-height: 1.5em;
	font-weight: normal;
	font-style: normal;
	font-family: 'QueulatCnd', Arial, Helvetica, Verdana, sans-serif;
	border-radius: 20px;
	z-index: 3001;
	width: 90%;
	max-width: 480px;
	padding: 30px 15px 20px 30px;
	max-height: 90vh;
}

#cn-notice-text {
	display: block;
	max-height: calc(90vh - 120px);
	overflow-x: hidden;
	overflow-y: auto;
	padding-right: 15px;
}

#cn-notice-buttons {
	display: block;
	height: 70px;
}

#cookie-notice.cookie-notice-visible h6 {
	color: #1876b6 !important;
	font-size: 20px;
	font-weight: 500;
	line-height: 1.2em;
	margin: 0;
	padding: 0 0 20px 0;
}

#cookie-notice.cookie-notice-visible p {
	margin-bottom: 20px;
	color: #333333 !important;
}

#cookie-notice.cookie-notice-visible .cn-button {
	margin-left: unset;
	margin-right: 10px;
	margin-top: 15px;
	margin-bottom: 10px;
	text-decoration: none !important;
	border-radius: 8px;
	padding: 8px 18px;
	font-size: 15px;
	font-weight: 600;
	background-color: #dfeef8 !important;
	border: 1px solid #dfeef8 !important;
	color: #1876b6 !important;
	transition: all 0.2s;
}

#cookie-notice.cookie-notice-visible #cn-refuse-cookie.cn-button:hover,
#cookie-notice.cookie-notice-visible #cn-accept-cookie.cn-button:hover {
	background-color: #8bbee2 !important;
	border: 1px solid #8bbee2 !important;
	text-decoration: none !important;
	transition: all 0.2s;
}

#cookie-notice.cookie-revoke-visible {
	background-color: transparent !important;
	position: fixed;
	top: unset;
	bottom: 30px;
	left: 30px;
	min-width: unset;
	width: auto;
	padding: 0;
	border-radius: 0;
}

.cookie-revoke-container {
	padding: 0;
}

#cn-revoke-cookie.cn-button {
	background-color: #8bbee2 !important;
	font-size: 0;
	border-radius: 50%;
	margin: 0;
	opacity: 0.5;
	position: relative;
	padding-left: 1.25em;
	width: 46px;
	height: 46px;
}

#cn-revoke-cookie.cn-button::before,
#cn-revoke-cookie.cn-button::after {
	font-size: 30px !important;
	display: inline-block;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	font: var(--fa-font-duotone);
	position: absolute;
	left: 8px;
	top: 50%;
	transform: translateY(-50%);
	text-align: center;
}

#cn-revoke-cookie.cn-button::before {
	color: var(--fa-primary-color, inherit);
	opacity: var(--fa-primary-opacity, 1);
	content: '\f564';
}

#cn-revoke-cookie.cn-button::after {
	color: var(--fa-secondary-color, inherit);
	opacity: var(--fa-secondary-opacity, 0.4);
	font-feature-settings: "ss01"; /* This will enable the second layer */
	content: '\f564\f564';
}









.epyt-video-wrapper,
.video-container { position: relative; padding-bottom: calc(56.25% + 100px); height: 0; overflow: hidden; margin-bottom: 23px; }

.epyt-video-wrapper iframe, .videocontaiepyt-video-wrapperner object, .epyt-video-wrapper embed, .epyt-video-wrapper video,
.video-container iframe, .video-container object, .video-container embed, .video-container video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }



.video-container.no-video {
	position: relative;
	background-color: #000000;
	background-position: center center;
	background-size: cover;
}
.video-container.no-video div {
	padding: 30px 30px 10px;
	background-color: #dfeef8;
	border-radius: 10px;
	position: absolute;
	bottom: 20px;
	width: calc(100% - 40px);
	left: 20px;
	opacity: 0.85;
}

.video-container.no-video div p {
	margin-bottom: 20px;
}

.video-container.no-video::before {
	position: absolute;
	display: block;
	left: calc(50% - 40px);
	top: calc(50% - 40px);
	width: 80px;
	height: 80px;
	border-radius: 50%;
	background-color: #000000;
	color: #ffffff;
	content: '\f04b';
	font-size: 40px !important;
	padding: 19px 0 0 30px;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	font: var(--fa-font-solid);
	opacity: 0.3;
}

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

.footer-has-oval {
	position: relative;
	overflow: hidden;
	width: 100%;
	min-height: 250px;
	z-index: 1;
}

.footer-oval {
	position: absolute;
	left: calc(50% - 1500px);
	top: -525px;
	width: 3000px;
	height: 700px;
	border-radius: 50%;
	pointer-events: none;
}

.footerwrapper .container {
	position: relative;
	z-index: +1;
	padding-top: 240px;
}

.footer {
	padding-top: 30px;
	padding-bottom: 10px;
}

.footer-has-oval .container {
	position: relative;
	top: 190px;
}

.btn-menu {
	position: absolute;
	width: 40px;
	height: 40px;
	right: 30px;
	margin-top: 40px;
	background: none;
	color: #ffffff;
	font-size: 36px;
	padding: 0;
	z-index: +1;
}



/********* MENU *********/

.has-menu {
	position: absolute;
}

.searchbox-container {
	margin-bottom: 30px;
	max-width: 90%;
}

#mainmenu {
	margin-bottom: 20px;
}

.offcanvas.offcanvas {
	transition: all 200ms;
}

#main-menu {
	position: fixed;
	top: 0;
	left: 0;
	background: none;
	border: none;
	color: #ffffff;
	width: 100%;
	height: 100vh;
	padding: 40px 40px 0 40px;
	z-index: 99999;
}



.close i {
	font-size: 44px;
	line-height: 50px;
}

.top-menu {
	margin: 15px;
}

.main-menu > li a {
	padding: 6px 25px 8px 25px;
	margin-top: 5px;
	margin-bottom: 5px;
}

.main-menu > li:hover > a,
.main-menu > li.current-menu-item > a,
.main-menu > li.current-menu-parent > a {
	border-radius: 50px;
}

.main-menu > li:hover > a {}

.menu-item-has-children {}

/* .main-menu li:not(.current-menu-item) .sub-menu */
.main-menu li .sub-menu {
	max-height: 0px;
	transition: all 1.5s;
	overflow: hidden;
	margin: 0 0 0 75px;
}

/* .main-menu li.current-menu-item .sub-menu,
.main-menu li.current-menu-parent .sub-menu {
	height: auto;
	max-height: 500px;
	margin: 15px 0 15px 75px;
} */

.main-menu li:hover .sub-menu {
	height: auto;
	max-height: 500px;
	transition: max-height 2s;
	margin: 15px 0 15px 75px;
}













/************* OVAL CONTAINERS *************/

.has-cards {
	overflow: hidden;
}

.card {
	position: relative;
	border-radius: 0;
	border: none;
	background-color: transparent;
}

.banner-card,
.normal-card {
	position: relative;
	text-align: center;
	max-width: calc(100% - 20px);
	margin-bottom: 20px;
	display: block;
	text-decoration: none;
}

a.banner-card:hover,
a.normal-card:hover {
	text-decoration: none;
}

.normal-card .card-header {
	position: relative;
	height: 300px;
	border-top-left-radius: 30px;
	border-top-right-radius: 30px;
	border: none;
	overflow: hidden;
	padding: 0;
}

.card-image {
	height: 300px;
	width: 100%;
	transition: all 300ms;
}

a.banner-card:hover .card-image,
a.normal-card:hover .card-image {
	transform: scale(1.1);
	transition: all 300ms;
} 

.quote-card .card-header {
	border-top-left-radius: 0px;
	border-top-right-radius: 0px;
	height: 450px;
}

.banner-card .card-header {
	text-align: center;
	padding: 20px 40px 0px;
	margin-left: -20px;
	margin-right: -20px;
	border-top-left-radius: 0px;
	border-top-right-radius: 0px;
	height: 70px;
	z-index: +1;
}

.streamer .shape,
.normal-card .card .shape,
.normal-card .card-header .shape,
.banner-card .card-header .shape {
	position: absolute;
	width: 130%;
	max-width: unset;
	height: auto;
}

.normal-card .card .shape,
.normal-card .card-header .shape{
	top: -5%;
	left: -37%;
}

.normal-card .shape-container,
.banner-card .card-header .shape-container {
	overflow: hidden;
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	pointer-events: none;
}

.banner-card .card-header .shape-container .shape {
	top: -40px;
	left: 1%;
	z-index: +1;
}

.normal-card .shape-container .shape {
	left: -37%;
	top: -12%;
}

.streamer .shape-container {
	display: block;
	position: relative;
	width: calc(100% + 40px);
	height: 100%;
	left: -20px;
	pointer-events: none;
}

.streamer .shape {
	right: -15%;
	bottom: -37%;
}

.normal-card .card-body {
	text-align: center;
	padding: 30px 40px 50px;
	margin-left: -20px;
	margin-right: -20px;
	position: relative;
}

.banner-card .card-body {
	height: 300px;
	padding: 0;
	width: 100%;
	overflow: hidden;
}

.has-background-img {
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
}

.card-oval {
	display: block;
	width: 100%;
	height: 100px;
	top: -100px;
	left: 0;
	position: absolute;
}

.card-oval::after {
	content: ' ';
	width: 250%;
	height: auto;
	aspect-ratio: 1 / 1;
	border-radius: 150%;
	position: absolute;
	bottom: -149px;
	left: -75%;
	border-width: 150px;
	border-style: solid;
	opacity: 1;
}

.transparent .card-oval::before {
	content: ' ';
	width: 250%;
	height: auto;
	aspect-ratio: 1 / 1;
	border-radius: 150%;
	position: absolute;
	bottom: -149px;
	left: -75%;
	border-width: 150px;
	border-style: solid;
	opacity: 1;
	z-index: -1;
}

.normal-card .card-oval {
	overflow: hidden;
}

.banner-card .card-oval {
	overflow: hidden;
	opacity: 1;
	bottom: unset;
	top: 69px;
	z-index: 1;
	width: calc(100% + 40px);
	left: -20px;
}

.banner-card .card-oval::after {
	bottom: 30px;
	z-index: 1;
}

.banner-card .card-header h4 {
	position: relative;
	margin-top: 30px;
	margin-bottom: -30px;
	z-index: 10;
}

.transparent .card-oval {
	height: 175px;
	top: -175px;
}

.transparent .card-oval::before {
	bottom: -74px;
}

.transparent .card-oval::after {
	bottom: -74px;
	opacity: 0.7;
}


.quote-card .card-body {
	padding-bottom: 20px;
}





.normal-card .btn,
.banner-card .btn {
	position: relative;
	top: -15px;
}
.intro-card .btn {
	position: relative;
	top: unset;
}

.streamer {
	min-height: 300px;
	border-bottom-left-radius: 30px;
	border-bottom-right-radius: 30px;
	overflow: hidden;
}

.streamer .streamercontent {
	padding: 40px 30px 20px 50px;
}
.streamer .order-2.streamercontent {
	padding: 40px 50px 30px 30px;
}



.streamercontent p {
	margin-bottom: 20px;
}


.streamer .has-background-img {
	position: relative;
}





.quoteblock h3 {
	color: #333333;
	padding-bottom: 8px;
}






.breadcrumbcontainer a,
.breadcrumbcontainer span,
.breadcrumb {
	color: #000000 !important;
	display: inline-block;
	text-decoration: none;
}

.breadcrumbcontainer a:hover,
a.breadcrumb:hover {
	text-decoration: underline;
}

/************** ELEMENTS **************/
.navbar-mainmenu {
	padding-top: 0;
	padding-bottom: 0;
}

.logo {
	width: 135px;
	max-width: 100%;
	height: auto;
	margin: 20px auto 20px;
}

.footer-has-oval .has-logo {
	position: absolute;
	bottom: 10px;
	left: 50%;
}

.footer-has-oval .has-logo {
	background-size: 180px auto;
	width: 180px;
	height: 140px;
}

.footer-has-oval .logo {
	width: 90px;
	margin-top: 32px;
}







.home-cards a:nth-child(3),
.home-cards a:nth-child(4) {
	border-bottom-left-radius: 30px;
	border-bottom-right-radius: 30px;
}


.home-cards {
	position: relative;
	margin: 0;
	padding: 0;
}


.home-cards a:nth-child(3),
.home-cards a:nth-child(4) {
	border-bottom-left-radius: 30px;
	border-bottom-right-radius: 30px;
}

.home-cards a:nth-child(1),
.home-cards a:nth-child(3) {
	text-align: right;
}


.intro-card {
	padding: 0 10px 20px;
	margin-bottom: 40px;
	border-bottom-left-radius: 30px;
	border-bottom-right-radius: 30px;
	height: calc(100% - 40px);
}


.intro-card .has-title {
	min-height: calc(100% - 49px);
}

.intro-card h2 {
	margin-bottom: 0px;
	padding: 10px 30px;
	min-height: 3.5em;
	text-align: center;
	display: grid;
	align-items: center;
}

.home-card {
	display: block;
	position: relative;
	min-height: 300px;
	height: 50vh;
	text-decoration: none;
	padding: 0 5%;
}

.home-card div {
	width: 80%;
	margin: 0;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
}

.row.home-cards a:nth-child(1) .has-title,
.row.home-cards a:nth-child(3) .has-title {
	padding-left: 17.5%;
}

.row.home-cards a:nth-child(2) .has-title,
.row.home-cards a:nth-child(4) .has-title {
	padding-right: 17.5%;
}

.home-card h2 {
	text-decoration: none;
	margin: 0 15px;
	color: #ffffff;
}


.home-card .btn {
	margin-right: 0;
}

.home-card .has-background-img {
	position: absolute;
	left: 0;
	width: 100%;
	height: 100%;
	mix-blend-mode: overlay;
	opacity: 0;
	transition: all 300ms;
}

.home-card:hover .has-background-img {
	opacity: 1;transition: all 500ms;
}


.home-cards .has-logo {
	position: absolute;
	background-size: 250px auto;
    width: 250px;
	height: 180px;
	left: calc(50% - 125px);
	top: calc(50% - 90px);
}

.home-cards .has-logo .logo {
	margin-top: 35px;
}

.transparent-card .card {
	border: 1px solid var(--darkgreen);
	border-bottom-left-radius: 30px;
	border-bottom-right-radius: 30px;
	padding: 20px 25px 65px;
	margin-bottom: 40px;
	overflow: hidden;
	height: calc(100% - 40px);
}

.transparent-card .card::before {
	position: absolute;
	top: -50%;
	left: -50%;
	content: " ";
	width: 200%;
	height: 200%;
	background-image: url('../Arkin-NPI/images/shape-video.svg');
	background-position: 250px 155px;
	background-size: 324px 300px;
	background-repeat: no-repeat;
	z-index: -1;
	opacity: 0.5;
}

.transparent-card:nth-of-type(2) .card::before {
	background-position: 300px 50px;
}
.transparent-card:nth-of-type(3) .card::before {
	background-position: 70px 30px;
	transform: rotate(-195deg);
}
.transparent-card:nth-of-type(4) .card::before {
	background-position: 222px -10px;
	transform: rotate(-311deg);
}

a.transparent-card,
a.transparent-card h4,
a.transparent-card p {
	text-decoration: none !important;
}

.transparent-card .card .btn {
	position: absolute;
	bottom: 12px;
	left: 20px;
	text-align: left;
	min-width: 80%;
	max-width: 300px;
	padding-left: 20px;
}

.transparent-card .card .btn-slide::before {
	position: absolute;
	top: 10px;
	left: 0;
	padding-left: 20px;
}



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

.gform_button.button,
.btn {
	border-radius: 24px;
	text-shadow: none;
	box-shadow: none;
	-webkit-box-shadow: none;
	padding: 10px 35px 11px;
	font-size: 16px;
	line-height: 1em;
	height: auto;
	color: #ffffff;
	display: inline-block;
	text-decoration: none !important;
	border-color: transparent !important;
	background: #555555;
	margin: 0 5px 10px 0;
	text-align: left;
}

.gform_button.button:hover,
a.btn:hover {
	text-decoration: none !important;
}

nav .btn-slide,
.footer-has-oval .btn-slide {
	padding: 10px 15px 10px;
	font-weight: 600;
}


.btn svg {
	width: 25px;
	height: auto;
	margin-left: 5px;
	margin-top: 4px;
	float: right;
}

.btn:hover svg {
	transition: color 500ms ease-out 0s;
}

.btn-slide {
	position: relative;
	background-size: 220% 100%;
	background-position: 100% 0%;
	transition: background-position 500ms ease-out 0s;
}

.card-link:hover .btn-slide,
.btn-slide:hover {
	background-position: 0% 0%;
	transition: background-position 500ms ease-out 0s;
}

.btn-slide::before {
	position: absolute;
	top: 10px;
	left: 0;
	padding-left: 35px;
	height: 100%;
	overflow: hidden;
	transition: width 500ms ease-out 0s;
	text-align: left;
	width: 0%;
	white-space: nowrap;
}

nav .btn-slide::before,
.footer-has-oval .btn-slide::before {
	padding-left: 15px;
}


.card-link:hover .btn-slide::before,
.btn-slide:hover::before {
	width: 100%;
}





#main-menu .btn {
	width: 100%;
}


.gform_wrapper u {
	text-decoration: none !important;
}

.gform_required_legend {
	display: none;
}

.gfield_error input[type=email],
.gfield_error input[type=text],
.gfield_error textarea,
input[type=email],
input[type=text],
textarea {
	width: 100% !important;
	border: none !important;
	background: transparent !important;
	border: 1px solid #555555 !important;
	font-size: 15px !important;
	line-height: 20px !important;
	padding: 5px !important;
	font-weight: 400 !important;
	color: #000 !important;
}

.gform_button.button input {
	padding: 0 !important;
	margin: 0 !important;
	background-color: transparent !important;
	border: 0 !important;
	color: #ffffff;
	text-transform: uppercase;
}