/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,300;0,500;1,700&display=swap');
@import url("https://fonts.googleapis.com/css?family=Quicksand:300,400,700");

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; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block; }

body {
  line-height: 1; }

ol, ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after {
  content: '';
  content: none; }

q:before, q:after {
  content: '';
  content: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

/* ----- Background color ----- */
/* ----- BUTTONS STYLE ----- */
/* ----- TEXTS STYLE ----- */
/*
Legenda:
hd -> header
ib -> infobox
ft -> footer
ig -> input group
cardheader -> tabelle
*/
/* --- formattazione degli A nelle pagine fisse --- */
/* --- END formattazione degli A nelle pagine fisse --- */
/* footer */
/* infobox */
/* nav */
/* tables */
/*
    $add-thead-bgcolor: orange;
    $add-thead-color: #606060;
*/
/* ..... SIZES ..... */
/* nav */
/* tables */
/* ..... WEIGHTS ..... */
/* header */
/* ..... BORDERS ..... */
/* nav */
/* ..... WIDTHs ..... */
/* nav */
/* ..... HEIGHTs ..... */
/* nav */
/* ----- Font Family ----- */
/* Font Family call */
/* ----- Vertical align Elements ----- */
/* ----- Mixin to customize scrollbars ----- */



.grecaptcha-badge {
	bottom: 5vh!important;
}


HTML {
  height: 100%;
  background-color: black;
  }
  

BODY {
	font-family: "Montserrat", sans-serif;
	font-size: clamp(10px, 1vw, 16px);
	font-weight: 300;
	height: 100vh;
	background-color: transparent;
	background-image: url("../images/Feralpi-BG-HQ.jpg");
	background-position: top;
	background-size: cover;
	display: flex;
}

A {
  color: white; }
  A:hover {
    text-decoration: none;
    color: #198754; }

/* Align class */
.textl {
  text-align: left; }

.textc {
  text-align: center; }

.textr {
  text-align: right; }

/* END Align class */
BUTTON:hover {
  cursor: pointer; }

/* ---------------------- Cookiebar ----------------------*/
#cookieBar {
  background-color: rgba(0, 0, 0, 0.65);
  padding: 5% 30%;
  width: 100%;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  transform-style: preserve-3d; }
  #cookieBar .bgcookie {
    background-color: white;
    padding: 1rem;
    text-align: center;
    font-size: calc(.7rem + .5vw); }
    #cookieBar .bgcookie P {
      margin: .5rem 0; }
    #cookieBar .bgcookie .btn {
      margin-top: 2rem;
      color: white;
}
#cookieBar .bgcookie .btn:hover {
    cursor: pointer; 
}
#cookieBar .bgcookie P A {
    color: darkgrey;
}


/* -------------------- END Cookiebar --------------------*/








/* INFORMATIVA COOKIE */
#informativa {
    background-color: white;
    margin: 50px;
    padding: 20px;
    overflow-y: auto;
}
.infoclose {
    align-self: center;
}

















#header-login {
	flex: 1;
	align-self: center;
}

#header-login .image  {
	display: flex;
    justify-content: center;
	margin-bottom: 5vh;
}

#header-login .title {
	display: flex;
    justify-content: center;
}
#header-login .title H1 {
	font-size: clamp(12px, 2.5vw, 40px);
	font-weight: 500;
	color: white;
}
  
form.login {
	flex: 1;
	align-self: center;
}

.page-login {
	position: relative;
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	display: flex;
    justify-content: center;
}
.page-login #autentica {
	width: 30vw;
}

.page-login #autentica A:hover{
	color: #ffffffa6;
}

.page-login #autentica LEGEND {
	font-weight: 500;
	font-size: clamp(14px, 1vw, 20px);
	color: white;
	margin-bottom: 30px!important;
}
.page-login #autentica .alert {
	display: block;
	font-size: clamp(8px, 1vw, 12px);
	background-color: #233543;
	border-radius: 0;
	border: 0;
    color: white;
}

.page-login #autentica #boxauth .input-group {
	-webkit-box-shadow: 1px 1px 2px 1px rgba(0,0,0,0.45); 
	box-shadow: 1px 1px 2px 1px rgba(0,0,0,0.45);
}
.page-login #autentica #boxauth .input-group:first-child {
	margin: 25px 0 10px;
}

.page-login #autentica #boxauth .input-group .form-control, .page-login #autentica #boxauth .input-group OPTION {
	font-weight: 300;
}
.page-login #autentica #boxauth .input-group .form-control::placeholder, .page-login #autentica #boxauth .input-group OPTION::placeholder {
	color: lightgrey;
}
.page-login #autentica #boxauth .input-group input[type="text"], .page-login #autentica #boxauth .input-group textarea {
	background-color: #f9f9f9 !important;
}
.page-login #autentica #boxauth .input-group .input-group-text {
	min-width: 3rem;
	background-color: #3ea938;
	border-radius: 0;
    border: 0;
}
.page-login #autentica #boxauth .input-group .form-control {
	border-radius: 0;
    border: 0;
	background-color: white!important;
}
.page-login #autentica #boxauth .input-group .input-group-text .fas {
	color: white;
}
.page-login #autentica #boxauth .input-group .input-group-text .fa:before {
	font: normal normal normal 14px/1 FontAwesome;
}
.page-login #autentica #boxauth #recaptcha {
	text-align: center;
	margin: 1rem 0;
}
.page-login #autentica #boxauth #recaptcha DIV {
	width: 100% !important;
}

.page-login #autentica #boxauth .btn {
	width: auto;
	margin: 5px auto;
	border: 0;
    width: 100%;
	-webkit-box-shadow: 1px 1px 2px 1px rgba(0,0,0,0.45); 
	box-shadow: 1px 1px 2px 1px rgba(0,0,0,0.45);
}
.page-login #autentica #boxauth .btn.btn-success, .page-login #autentica #boxauth .btn.btn-primary {
	background-color: #3ea938;
	margin-top: 15px;
}
.page-login #autentica #boxauth .btn.btn-success:hover, .page-login #autentica #boxauth .btn.btn-primary:hover {
	background-color: #32812e;
}
.page-login #autentica #boxauth .btn.btn-danger {
	background-color: #dc3545;
}

.page-login #autentica #boxauth .btn.btn-danger:hover {
	background-color: #bb2d3b;
}

.page-login #autentica H4, .page-login #autentica P {
	margin-top: .5rem;
	color: black;
}
.page-login #autentica .alert P {
	margin-top: 0;
	color: white;
}

/*
@media (max-height: 769px) {
	.page-login {
		top: 53vh; 
	}
	.page-login #autentica {
		padding: 1rem;
	}
	.page-login #autentica .alert {
		margin-bottom: 0;
	}
}
*/

/* ------------------------- PAGINA RECUPERO PASSWORD ------------------------- */

/*.reserved-page {
	flex: 1;
    align-self: center;
}
.reserved-page .card {
	border: none;
    border-radius: 0;
    background-color: transparent;
	width: 30vw;
    margin: 0 auto;
}
.reserved-page .card .card-header {
	color: white;
	background-color: transparent!important;
    border: 0;
	padding-bottom: 15px!important;
}
.reserved-page .card .card-header H4 {
	font-weight: 500;
	font-size: clamp(14px, 1vw, 20px);
}
.reserved-page .card .card-header, .reserved-page .card .card-body {
	padding:0;
}

.reserved-page .card .card-body #boxactiv button, .reserved-page .card .card-body #boxactiv .input-group {
	-webkit-box-shadow: 1px 1px 2px 1px rgb(0 0 0 / 45%);
    box-shadow: 1px 1px 2px 1px rgb(0 0 0 / 45%);
}

.reserved-page .card .card-body #boxactiv .btn.btn-success {
	background-color: #3ea938;
    border: 0;
}
.reserved-page .card .card-body #boxactiv .btn.btn-success:hover {
	background-color: #32812e;
}

.reserved-page .card .card-body #boxactiv .btn.btn-danger {
	background-color: #dc3545;
}
.reserved-page .card .card-body #boxactiv .btn.btn-danger:hover {
	background-color: #bb2d3b;
}

.reserved-page .card .card-body #boxactiv .input-group .input-group-text  {
	min-width: 3rem;
	background-color: #3ea938;
	border-radius: 0;
    border: 0;
	color: white;
	font-weight: 300;
}
.reserved-page .card .card-body #boxactiv .input-group  .form-control::placeholder, .reserved-page .card .card-body #boxactiv .input-group OPTION::placeholder {
	color: lightgrey;
	font-weight: 300;
}

.reserved-page .card .card-body #boxactiv .input-group .form-control  {
	border-radius: 0;
    border: 0;
	background-color: white!important;
}*/

	
/* ------------------------- END PAGINA RECUPERO PASSWORD ------------------------- */

#footer {
	position: fixed;
	width: 100%;
	bottom: 0;
	padding: .5rem 1rem;
	font-size: clamp(10px, 1vw, 12px);
	background-color: transparent;
	z-index: 9998;
  }
  #footer #mailTo:hover {
    cursor: pointer; }
  #footer DIV {
    color: white; }