/* Variables init */
:root {
	--bg-body: #ededee;
	--bg-footer: #6c757d;
	--bg-gradientA: #ffffff;
	--bg-gradientZ: rgb(163 252 207 / 0%);
	--bc-header-title: #a3fccf;
	--cl-body: #000;
	--cl-gradientA: #a3fccf;
	--cl-gradientZ: #63bfed;
}

/*
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700;1,800&display=swap');
*/

/* ATTIVARE BLOCCO SE SI VUOLE CUSTOMIZZARE IL TEMPLATE */
/*
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
*/

@font-face {
	font-family: DinotRegular;
	src: url("fonts/DINOT.otf") format("opentype");
}
@font-face {
	font-family: DinotMedium;
	src: url("fonts/DINOT-Medium.otf") format("opentype");
}
@font-face {
	font-family: DinotBlack;
	src: url("fonts/DINOT-Black.otf") format("opentype");
}
@font-face {
	font-family: MotoGPdisplay;
	src: url("fonts/MGPDisplay-Bold.ttf") format("truetype");
	font-weight: bold;
}
@font-face {
	font-family: MotoGPinline;
	src: url("fonts/MGPInline-Regular.otf") format("opentype");
}

HTML {
	height: 100%;
}

BODY {
	display: flex;
	height: 100%;
	/*background-color: var(--bg-body);*/
	/*font-family: "Open Sans", Arial, sans-serif;*/
	font-family: DinotMedium, Arial, sans-serif;
	font-size: clamp(10px, 1vw, 16px);
	font-weight: 300;
	/*background: url("images/login-background.jpg") no-repeat center center fixed;
	background-size: cover;*/
	overflow: hidden;
	background-image: url(images/login-background.jpg);
    background-size: cover;
    background-repeat: no-repeat;
	color: var(--cl-body);
}

.background-image {
	position: fixed;
	top: 0;
	left: 0;
	min-width: 100%;
	min-height: 100%;
}

#header-login .title h1 {
    font-size: clamp(89px, 4vw, 89px);
    font-weight: 700;
	/*
    border-color: var(--bc-header-title);
    background: -webkit-linear-gradient(var(--cl-gradientA), var(--cl-gradientZ));
	*/
    border-color: #FFFFFF;
    background: #FFFFFF;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    position: absolute;
    top: 35vh;	/*5rem;*/
    left: 7.5vh;	/*5rem;*/
    width: 45%;
    text-align: left;
}

@media (max-width: 2000px) {
	#header-login .title h1 {
		font-size: clamp(67px, 4vw, 67px);
	}
}
@media (max-width: 1400px) {
	#header-login .title h1 {
		font-size: clamp(44px, 4vw, 44px);
	}
}
@media (max-width: 800px) {
	#header-login .title h1 {
		font-size: clamp(27px, 4vw, 27px);
	}
}

#header-login #image-title-login {
	left: 7.5vh;
	top: 38%;
	position: absolute;
	width: 50%;
	height: auto;
}

#header-login .title h1 span.default-line {
	font-family: MotoGPinline, Arial, sans-serif;
}
#header-login .title h1 span.first-line {
	font-family: MotoGPdisplay, Arial, sans-serif;
}

div.dorna-logo-login {
	display: flex;
	justify-content: space-between;
	align-content: flex-start;
    position: absolute;
    left: 7.5vh;	/*5rem;*/
    top: 7.5vh;	/*5rem;*/
    width: 20%;
	text-align: left;
}
div.dorna-logo-login img {
	padding-left: 1em;
	padding-right: 1em;
}
div.dorna-logo-login img:first-child {
	border-right: 1px solid #FFFFFF;
	padding-left: 0;
}
div.dorna-logo-login img:last-child {
	border-left: 1px solid #FFFFFF;
	padding-right: 0;
}
@media (max-height: 1400px) {
	div.dorna-logo-login {
		width: 17.5%;
	}
}
@media (max-height: 1000px) {
	div.dorna-logo-login {
		width: 15%;
	}
}
@media (max-height: 700px) {
	div.dorna-logo-login {
		width: 10%;
	}
}
div.dorna-logo-login img {
    width: auto;
	height: 3em;
}

div.catchphrase {
    position: absolute;
    right: 7.5vh;	/*5rem;*/
    bottom: 7.5vh;	/*5rem;*/
    width: auto;
	text-align: left;
}
div.catchphrase img {
    width: auto;
	height: 8em;
}

div.logos-login {
    position: absolute;
    left: 7.5vh;	/*5rem;*/
    bottom: 7.5vh;	/*5rem;*/
    width: 20%;
	text-align: left;
}
@media (max-height: 1400px) {
	div.logos-login {
		width: 17.5%;
	}
}
@media (max-height: 1000px) {
	div.logos-login {
		width: 15%;
	}
}
@media (max-height: 700px) {
	div.logos-login {
		width: 10%;
	}
}
div.logos-login img {
    width: auto;
	height: 3em;
}

div.custom01-login {
    position: absolute;
    left: 0;
    top: 0;
    width: 45%;
}
div.custom01-login img {
    width: 100%;
}
.page-register::before,
.page-login::before {
		content: "";
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		background-image: linear-gradient(var(--bg-gradientA), var(--bg-gradientA));
		opacity: 0.7;
	  z-index: -1;
}
div.background-login,
div.background-register {
	/*background-image: linear-gradient(var(--bg-gradientA), var(--bg-gradientZ));*/
	background-image: linear-gradient(var(--bg-gradientA), var(--bg-gradientA));
	position: absolute;
	top: 0;
	right: 5vw;	/*5rem;*/
	width: 28%;
	height: 50%;
	min-height: 480px;
	opacity: 0.7;
}
div.background-register {
	width: 40%;
}
div.page-login,
div.page-register {
	position: absolute;
	top: 0;
	right: 7.5vh;	/*5rem;*/
	margin: 0;
	padding: 3em;
	width: 28%;
	opacity: 1;
	font-family: DinotRegular, Arial, sans-serif;
}
div.page-confirm-operation {
	width: 50%;
}
div.page-register {
	width: 40%;
}
div.page-login fieldset legend,
div.page-register fieldset legend {
	font-family: DinotBlack, Arial, sans-serif;
	text-align: left;
}
div.page-login fieldset input.form-control,
div.page-register fieldset input.form-control,
div.page-register fieldset select.form-control{
	padding: 1em 0.75em;
	border: 0;
	border-radius: 0;
	background: none;
	border-bottom: 1px solid black;
	font-size: clamp(14px, 15px, 16px);
}
div.page-login fieldset label,div.page-register fieldset label{
	font-size: clamp(14px, 15px, 16px);
}
@media (max-width: 2000px) {
	div.page-login fieldset input.form-control,
	div.page-register fieldset input.form-control,
	div.page-register fieldset select.form-control,
	div.page-login fieldset label,div.page-register fieldset label{
		font-size: clamp(14px, 15px, 16px);
	}
}
@media (max-width: 1400px) {

	div.page-login fieldset input.form-control,
	div.page-register fieldset input.form-control,
	div.page-register fieldset select.form-control,
	div.page-login fieldset label,div.page-register fieldset label {
		font-size: clamp(14px, 15px, 16px);
	}
}
@media (max-width: 800px) {
	div.page-login fieldset input.form-control,
	div.page-register fieldset input.form-control,
	div.page-register fieldset select.form-control,
	div.page-login fieldset label,div.page-register fieldset label {
		font-size: clamp(12px, 4px, 12px);
	}
}

div.page-login fieldset a {
	font-size: clamp(10px, 1vw, 16px);
	color: var(--cl-body);
	text-decoration: none;
}
div.page-login fieldset a:hover {
	text-decoration: underline;
}
div.page-login button.btn-block {
	background-color: #000;
	border-color: #000;
	width: 100%;
	padding-top: 0.25rem;
	padding-bottom: 0.25rem;
	border-radius: 1rem;
	text-transform: uppercase;
}
@media (max-width: 1169.99px) {
	div.page-login button.btn-block,
	div.page-register button {
		font-size: 14px;
	}
}
div.page-register button.btn-block {
	width: 100%;
	padding-top: 0.25rem;
	padding-bottom: 0.25rem;
	border-radius: 1rem;
	text-transform: uppercase;
}
#autentica > fieldset > div.row.email_company-block > div:nth-child(2) > div > div > button {
	background: none;
	color: black;
	border: 0;
	border-bottom: 1px solid black;
	border-radius: 0;
	padding: 1rem 0.75rem;
	padding-top: 1.5rem;
	padding-bottom: .625rem;
}
.form-floating>.ms-parent~label {
	opacity: .65;
	transform: scale(.85) translateY(-.5rem) translateX(.15rem);
}
.ms-choice>span {
	font-size: 1rem;
	font-weight: 400;
}
div.page-register button.btn-cancel,
div.page-register button.btn-send-request,
div.page-register button.btn-register {
	border-radius: 0.6rem;
	width: 90%;
}
div.page-register button.btn-cancel {
	background-color: #626262;
	border-color: #626262;
}
div.page-register button.btn-register {
	background-color: #000;
	border-color: #000;
}
div.page-login p.lost-pwd {
	text-align: left;
	padding-top: 0.25rem;
}

button.g-recaptcha, div.grecaptcha-badge {
	bottom: 5px!important;
}

div#informativa {
	height: 75vh;
}
div#informativa div.testo-informativa {
	overflow: auto;
}
div#informativa .btn {
	width: 10vw;
}

#footer-login {
	background-color: rgba(0, 0, 0, .1);
    border: solid rgba(0, 0, 0, .15);
    border-width: 1px 0;
    box-shadow: inset 0 0.5em 1.5em rgb(0 0 0 / 10%), inset 0 0.125em 0.5em rgb(0 0 0 / 15%);
	height: 5vh;
    padding-top: 1vh;
}
#autentica > fieldset > .registration-alert {
	background-color: white !important;
	border-radius: 16px !important;
	padding: .5rem;
}

#autentica .contact-admin-loginpage {
	background-color: #198754 !important;
	border-radius: 16px !important;
	padding: .5rem;
	color: white;
	width: 50%;
	text-align: center;
	transform: translateX(50%);
}

#autentica .contact-admin-loginpage a {
	cursor: pointer;
	text-decoration: none;
	color: white;
}
#autentica > fieldset > .registration-alert:hover {
	cursor: pointer;
}
