:root {
	--colore-rosa: rgba(231, 37, 136, 1);
    --colore-blu: rgba(17, 176, 225, 1);
    --colore-arancio: rgba(251, 149, 3, 1);
    --circle-dim: 35px
   
}

#watsup-home , #watsup-classifica {
    z-index: 30000;
    margin: auto;
    position: fixed;
    bottom: 30px;
    right: 30px;
    width: 50px;
    height: 50px;
    text-align: center;
    box-sizing: border-box; 
    font-size: 26px;
}

.footer{
	padding: 40px 4px 40px 4px;
}
.copy-link {
    letter-spacing: 1px;
}
   
.header.header-fixed {
    height: 80px;
}  

#panel-success , #calendar-success {
	padding: 20px;
	text-align: left;
    border-color: #02BC77 !important;
    background-color: #d9f5eb;
    border-left: 3px solid;
    border-radius: 2px;
}

#panel-error , #prenota-error{
	display:none;
	padding: 20px;
	border-left: 3px solid;
    border-radius: 2px;
	text-align: left;
	border-color: #e84c64 !important;
    background-color: #fce4e8;
    color: #655b5d;
}

.error-check{
	color: #e1534f
}

.material-switch > input[type="checkbox"] {
    display: none;   
}

.material-switch > label {
    cursor: pointer;
    height: 0px;
    position: relative; 
    width: 40px;  
}

.material-switch > label::before {
    background: rgb(0, 0, 0);
    box-shadow: inset 0px 0px 10px rgba(0, 0, 0, 0.5);
    border-radius: 8px;
    content: '';
    height: 16px;
    margin-top: -8px;
    position:absolute;
    opacity: 0.3;
    transition: all 0.4s ease-in-out;
    width: 40px;
}
.material-switch > label::after {
    background: rgb(255, 255, 255);
    border-radius: 16px;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3);
    content: '';
    height: 24px;
    left: -4px;
    margin-top: -8px;
    position: absolute;
    top: -7px;
    transition: all 0.3s ease-in-out;
    width: 24px;
}
.material-switch > input[type="checkbox"]:checked + label::before {
    background: inherit;
    opacity: 0.5;
}
.material-switch > input[type="checkbox"]:checked + label::after {
    background: inherit;
    left: 20px;
}

#consensi-box{
	margin-top: 20px;
	margin-bottom: 20px;
}	
	
.switch-container{
	width: 100%
}	
	
.switch-box{
	display: inline-block;
	width: 50px;
	margin-right: 20px;
	vertical-align: top;
    margin-top: 15px;
}
.switch-text{
	display: inline-block;
	width: calc(100% - 80px) !important;
	text-align: left;
	
}
.link-underline{
	text-decoration: underline;
}	

.body-dialog{
	max-height: 400px;
	overflow: auto;
}

.counter-sub-title{
	
}

.counter-content{
	
	
}

.material-switch > input[type="checkbox"]:checked + label::after {
    background: var(--colore-blu);
}

.banner-img{
	max-width: 250px;
}


a:hover {
   color: var(--colore-blu);
}


.alt-icon-color {
    color: var(--colore-blu) !important;
}

.btn-white-outline{
	border-radius: 20px;
}

.btn-black {
    background-color:  var(--colore-blu) !important;
    border-radius: 20px;
}

.btn-black:hover {
    background-color:  var(--colore-rosa) !important;
}

.section-padding-small{
	padding-top: 60px;
    padding-bottom: 60px;
}


#box-premi{
	background: #fff;	
}
.row-premio{
	color: #58595b;
}
#box-posizioni{
	margin: 20px;
	/* border: var(--colore-rosa) 2px solid; */
	border-radius: 20px;
	/* background: rgba(255,255,255, 0.5); */
	margin-right: 100px;
}

#fine-fidelity{
	/* background: rgba(255,255,255, 0.5); */
	font-family: 'Montserrat', sans-serif;
	font-weight: 500;
	font-style: italic;
	/* color: #808285 !important; */
	font-size: 14px;
	border-bottom-left-radius: 20px;
	border-bottom-right-radius: 20px;
}

#intestazione{
	color: #FFF;
	margin: 10px 5px 0px 5px;
	padding: 5px;
}

#box-link{
	color:  var(--colore-blu)  !important;
	margin-top: 30px;
}


.titolo-classifica {
	color:  var(--colore-blu)  !important;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 20px;
	font-family: 'Orbitron', sans-serif;
}
.verde , #box-link a{
	color:  var(--colore-rosa) !important;
}
#box-premi{
	
	padding-bottom: 10px;
	padding-top: 10px;
	
}
#box-premi{
	font-family: 'Montserrat', sans-serif;
}
.row-posizione{
	color: #FFF;
	margin: 10px 10px 10px 10px;
	min-height: 35px;
	margin-right: 20px;
	margin-left: 20px;
}
.color{
	background: #2b2b2b;
	min-height: 35px;
}

.posizione-utente .color{
	background: var(--colore-blu) !important;
}
#user-posizione{
	margin-right: 100px;
}
#user-posizione div{
	background: var(--colore-blu) !important;
	color: #FFF;
	font-weight: bold;
	clip-path: polygon(12px 0%, 100% 0%, calc(100% - 12px) 100%, 0% 100%);
	/*(100% , calc(100% - 12px)  ,0% 0%,100% 0%,calc(100% - 12px)  100%,0% 100%); */
	line-height: 35px;
	width: auto;
	display: inline-block;
	padding-left: 30px;
	padding-right: 30px;
	
}


.cliped{
	clip-path: polygon(0% 0%,0% 0%,100% 0%,calc(100% - 12px)  100%,0% 100%);
}

.numero{
	background-color: var(--colore-rosa) !important;
	font-weight: 600;
	min-width: 30px;
	text-align: center;
	clip-path: polygon(0 0, 100% 0, 100% calc(100% - 8px), 50% 100%, 0 calc(100% - 8px));
	-moz-box-shadow: 2px 2px 2px #333333, 5px 6px 3px rgb(0 0 0 / 50%);
	-webkit-box-shadow:2px 2px 2px #333333, 5px 6px 3px rgb(0 0 0 / 50%);
	box-shadow: 2px 2px 2px #333333, 5px 6px 3px rgb(0 0 0 / 50%);
	height: 35px;
}

.ribbon {
  position: absolute;
  left: -2px;
  top: -3px;
  height: 35px;
  -moz-box-shadow: 2px 2px 2px #333333, 5px 6px 3px rgb(0 0 0 / 50%);
  -webkit-box-shadow:2px 2px 2px #333333, 5px 6px 3px rgb(0 0 0 / 50%);
  box-shadow: 2px 2px 2px #333333, 5px 6px 3px rgb(0 0 0 / 50%);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 8px), 50% 100%, 0 calc(100% - 8px));
  border: #60b433 1px solid;
  
} 
.ribon-content {
 	background: var(--colore-rosa) !important;
    color: white;
    font-size: 1.1rem;
    text-align: center;
    font-weight: 400;
    background: var(--colore-rosa) linear-gradient(45deg, rgba(black, 0) 0%, rgba(white, 0.25) 100%);
    padding: 8px 2px 4px;
    clip-path: polygon(0 0, 100% 0, 100% calc(100% - 20px), 40% 100%, 0 calc(100% - 12px));
    width: 60px;
    min-height: 40px;
    transition: clip-path 1s, padding 1s, background 1s;
}

.top-60{
	margin-top: 60px;
}
  
#box-bg {
	background: #FFF;
	/* background-image: url("../img/banners/sfondo_fidelity.jpg"); */
  	height: 100%;
  	background-position: center;
  	background-repeat: no-repeat;
  	background-size: cover;
  	 
  	margin-bottom:50px ;
   max-height: 600px
}

.pl50{
	padding-left: 50px
}
.pl5{
	padding: 5px
}  
.powered{
	text-align: right ;
	line-height: 42px;
} 
.logo-powered{
	height: 42px
}
.logo-fidelity{
	width: 250px
}
.testo-classifica{
	margin-top: 30px
}

.only-phone{
	display: none
}
.only-phone-tablet{
	display: none !important
}


#dialog_privacy p , 
#dialog_privacy li ,
#dialog_cookie p ,
#dialog_cookie li ,
#dialog_condizioni p ,
#dialog_condizioni li 
{
	font-size: 13px;
    color: #626262;
}

/* Instagram story */
#instagram-modal {
	width: 700px
}

#active-instagram-img{
	width: 320px 
}

#active-instagram-title{
	
	
}


#active-instagram-text{
	font-size: 13px ;
	font-family: 'Ubuntu', sans-serif;
	
}

.instagram-navigation{
	color: #000;
    line-height: 16px;
    padding: 8px 8px;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    box-shadow: 0 3px 4px 0 rgb(0 0 0 / 10%);
}
.instagram-navigation:hover{
	color: #FFF;
	background: var(--colore-blu) !important
}

/* ----------- iPhone 4 and 4S ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 480px)
  and (-webkit-min-device-pixel-ratio: 2) {
.footer .container .col-md-6{
	   	text-align: center !important
   	}
   	
   	.table-phone{
	   	display: table-cell
   	}
   	.no-phone-tablet{
		display: none
	}
   	.no-phone{
	   	display: none
   	}
   	.only-phone{
	   	display: none
   	}
   	#container-classifica{
	   	height: 1230px !important;
	   	margin-top: 80px !important;
	}
   	
   	#container-classifica .intro-content-inner{
	   	 	 
	   	 vertical-align: top !important;
   	}
   	
   	
   	
	   	
}

/* ----------- iPhone 5, 5S, 5C and 5SE ----------- */


/* Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) {
.footer .container .col-md-6{
	   	text-align: center !important
   	}
   		.table-phone{
	   	display: table-cell
   	}
   	.no-phone-tablet{
		display: none
	}
   	.no-phone{
	   	display: none
   	}
   	.only-phone , .only-phone-tablet{
	   	display: block
   	}
   	#container-classifica{
	   	height: 1230px !important;
	   	margin-top: 80px !important;
	}
   	
   	#container-classifica .intro-content-inner{
	   		 margin-top: 80px !important;
	   	 vertical-align: top !important;
   	}
}

/* ----------- iPhone 6, 6S, 7 and 8 ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2) { 
.footer .container .col-md-6{
	   	text-align: center !important
   	}
   		.table-phone{
	   	display: table-cell
   	}
   	.no-phone-tablet{
		display: none
	}
   	.no-phone{
	   	display: none
   	}
   	.only-phone , .only-phone-tablet{
	   	display: block
   	}
   	#container-classifica{
	   	height: 1230px !important;
	   	margin-top: 80px !important;
	}
   	
   	#container-classifica .intro-content-inner{
	   		 margin-top: 80px !important;
	   	 vertical-align: top !important;
   	}
}

/* ----------- iPhone 6+, 7+ and 8+ ----------- */

/* Portrait and Landscape */
@media only screen 
  and (max-device-width: 736px)  { 
	.footer .container .col-md-6{
	   	text-align: center !important
   	}
   		.table-phone{
	   	display: table-cell
   	}
   	.no-phone-tablet{
		display: none
	}
   	.no-phone{
	   	display: none
	   	
	   	
   	}
   	.only-phone , .only-phone-tablet{
	   	display: block
   	}
   	#container-classifica{
	   	height: 1230px !important;
	   	margin-top: 80px !important;
	}
   	
   	#container-classifica .intro-content-inner{
	   	 	 margin-top: 80px !important;
	   	 vertical-align: top !important;
   	}
   	
   	#instagram-modal {
		width: 350px
	}

	#active-instagram-img{
		width: 300px 
	}
   	#active-instagram-text{
	   	padding-top: 10px;
   	}
   	
   	#instagram-footer-left , #instagram-footer-right{
	   -webkit-box-flex: 0;
	   -webkit-flex: 0 0 16.666667%;
	   -ms-flex: 0 0 16.666667%;
	   flex: 0 0 16.666667%;
	   max-width: 16.666667%;
	}	
   	
   	#instagram-footer-middle{
	   	-webkit-box-flex: 0;
	   	-webkit-flex: 0 0 66.666667%;
	   	-ms-flex: 0 0 66.666667%;
	   	flex: 0 0 66.666667%;
	   	max-width: 66.666667%;
   	}
   	
   	
}

@media only screen and (device-width: 768px) {
  /* For general iPad layouts */
}


/* Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 812px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: landscape) { 
	
	.footer .container .col-md-6{
	   	text-align: center !important
   	}
   		.table-phone{
	   	display: table-cell
   	}
   	.no-phone{
	   	display: none
   	}
   	.no-phone-tablet{
		display: none
	}
   	
   	
	.only-phone , .only-phone-tablet{
	   	display: block
   	}
   	#container-classifica{
	   	height: 1120px !important;
	   	margin-top: 80px !important;
	}
   	
   	#container-classifica .intro-content-inner{
	   	 margin-top: 80px !important;
	   	 vertical-align: top !important;
   	}
}
   

@media only screen 
  and (max-device-width: 768px)  {
   	
   	#box-bg{
	   	max-height: 570px;
	   	margin-bottom: 20px;
	   	margin-top: 20px;
   	}
   	
   	#box-posizioni{
	   	margin: 0px;
		margin-right: 0px;
		margin-top: 5px;
	}
	#user-posizione{
	   	margin: 0px;
		margin-right: 0px;
		margin-top: 5px;
	}
	.only-phone-tablet{
		display: block !important;
	}
	.no-phone-tablet{
		display: none !important;
	}
	
   	.logo-fidelity{
	   	width: 200px
   	}
   	
   	.titolo-classifica{
	   	font-size: 17px;
   	}
   	.footer{
	   	padding: 40px 0px 40px 0px;
   	}
   	.footer .container{
	   	padding-right: 0px;
	   	padding-left: 0px;
   	}
   	.footer .container .col-md-6{
	   	margin: 0px !important;
	   	padding: 0px !important;
   	}
}


.portfolio-grid .portfolio-item{
	width: 25%
}

.day:not(.disabled) {
        background: #2ecc71;
        color: #FFF;
    }

    .error_text {
        color: #eb5a46;
    }

    .error_text_hidden {

        display: none;
    }

    .error_text_visible {
        display: inline-flex;
    }

input, input[type="text"], input[type="email"], input[type="tel"], input[type="number"], input[type="password"], input[type="radio"], input[type="checkbox"], textarea, select {
    color: #222;
	text-transform: uppercase;
	font-size: 14px;
}