/* Reusable but site specific styles */

.logotype{
	width:fit-content;
	color: var(--white, #FFF);
	leading-trim: both;
	text-edge: cap;
	font-family: "Baloo 2";
	font-size: 44px;
	font-style: normal;
	font-weight: 800;
	line-height: 80%; /* 35.2px */
}


.cologobogo{
	fill: var(--black);
	transition: var(--transition);
}

a:hover .cologobogo{
	fill: white;
	transition: var(--transition);
}


footer a{
	color:white;
	text-decoration: none;
}

footer a:hover{
	color: var(--accent);
	text-decoration: underline;
}

.panel_blue{
	border-radius: 40px;
	background: var(--Blue-light, #80DDFF);
	padding: 32px;
	font-size: 20px;
	color: var(--dark);
	text-align: center;
	display: flex;
	flex-direction: column;
	gap: 32px;
	align-items: center;
	justify-content: center;
}

.panel_blue_large{
	font-size:24px;
	gap: 40px;
	padding: 40px;
}

.panel_blue h2,
.panel_blue h3{
	color: var(--dark);
}

.panel_blue ul{
	width: fit-content;
	margin-inline: auto;
}

.panel_blue ul li{
	list-style: disc;
	text-align: left;
}

.rrp_link{
	display: flex;
	align-items: center;
	gap: 4px;
	text-decoration: none;
	text-underline-offset: 0;
	margin-inline: auto;
	width: fit-content;
	color: var(--dark, #231D1C);
	text-align: right;
	leading-trim: both;
	text-edge: cap;
	font-size: 24px;
	font-weight: var(--strong);
	line-height: 1;
	text-transform: uppercase;
}

.rrp_link:hover{
	color: var(--orange);
}

.downloads{
	display: flex;
	flex-direction: column;
	gap: var(--gap);
	border-top: 2px solid var(--grey-light, #A3A3A3);
	padding-top:40px;
}

.download_link_row{
	display: flex;
	justify-content: center;
}

.download_link{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 4px;
	text-decoration: none;
	text-underline-offset: 0;
	border-radius: 0 32px;
	border: 4px solid var(--white, #FFF);
	width: 360px;
	padding: 4px 8px;
	color: var(--white, #FFF);
	font-size: 24px;
	font-weight: var(--strong);
	line-height: 1;
	text-transform: uppercase;
	text-align: center;
}

.download_link:hover{
	color:var(--orange);
	border-color: transparent;
	text-decoration: none;
}

.download_link:focus{
	background-color: var(--green);
	border-color: var(--green);
	color: var(--dark);
}

.download_link svg{
	width: 40px;
	min-width: 40px;
	height: auto;
}

.ecta_form{
	display: flex;
}

.ecta_form input[type="email"]{
	border-radius: 24px 0 0 0;
	border:0;
	min-height:44px;
	padding: 2px 4px 2px 10px;
	min-width: 300px;
	width:100%;
}

.ecta_form button{
	background-color: var(--orange);
	color:var(--dark);
	display: flex;
	width:44px;
	height:44px;
	align-items: center;
	justify-content: center;
	border-bottom-right-radius: 24px;
	border:0;
	cursor: pointer;
	padding:0;
	margin:0;
	transition: var(--transition);
}

.ecta_form button:hover{
	background-color: var(--dark);
	color: var(--orange);
}

.ecta_error,
.ecta_success{
	padding: 10px 20px 10px 50px;
	background-color: var(--white);
	color: var(--dark);
	border-top-left-radius: 24px;
	border-bottom-right-radius: 24px;
	border: 2px solid var(--grey-light);
	font-weight: var(--strong);
	background-image: url('/site/assets/images/correct.svg');
	background-repeat: no-repeat;
	background-position: left 10px center;
	background-size: 40px;
}

.ecta_error{
	background-image: url('/site/assets/images/incorrect.svg');
}


.ecta_privacy_link{
	color: var(--dark);
}

.ecta_privacy_link:hover{
	color: var(--orange);
	text-decoration: none;
}