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, font, 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 { background: transparent; border: 0; margin: 0; padding: 0; vertical-align: baseline; }


:root{--blue: #115289; --celeste: #00B6C0; height: 100%;}


h1, h2, h3, h4, h5, h6 { clear: both; font-weight:normal; padding: 0 0 0 0; margin-bottom:0px; line-height:1.1; font-weight: bold;}
	h1{ font-size:21px; }
	h2{ font-size:18px; }
	h3{ font-size:16px; }
	h4{ font-size:14px; }
	h5{ font-size:13px; }

p{ font-size:14px;  line-height:1.4; padding:0 0 3px 0; font-weight:inherit; color: #596869;}
p a, label a{text-decoration: underline;}
ol, ul { list-style-position: inside; list-style-type: disc;}
img{width: 100%; margin: 0; height: auto; padding: 0;}
a img { border: none;}
a {text-decoration:none; color: var(--celeste);}
a:hover {}
hr{ border:none; border-top:1px dotted #000; font-size:1px; height:0px; padding:0px; display:block; margin:5px 0;}
button{display: block; font-size: 13px; background: var(--celeste); color: #FFF;; border: none; padding: 15px; width: 200px; border-radius: 32px; margin: 10px auto;}
.left{ float:left; }
.center{text-align: center;}
.myClear{clear:both; padding:0; margin:0; font-size:0px; height:0px; font-size:0px; display:block; }
.myRow {display: block; clear: both; padding:5px 0; margin: 0;}
.myIn {margin: 0 auto; width: 90%; padding: 0; max-width: 1200px;}

*::-webkit-scrollbar {width: 0px; background: transparent;}

.col_1_2{width: 50%; display: block; float: left;}
.col_2_3{width: 66.6%; display: block; float: left;}
.col_1_3{width: 33.3%; display: block; float: left;}

*{outline: none; -webkit-tap-highlight-color: transparent;}

input, textarea{width: 100%; background: #FFF; border-radius: 10px; padding: 15px 20px; box-sizing: border-box; font-size: 18px; border: 1px solid #ddd; color: #1c1c1c; display: block; -webkit-appearance: none; font-family: 'Roboto', sans-serif;}

textarea{resize: none;}
select{width: 100%; max-width: 300px; background: #FFF; border-radius: 10px;  box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16); padding: 10px 10px; box-sizing: border-box; font-size: 18px; border: 1px solid #ededed; margin: 0 0 0 5px; color: #1c1c1c; display: block; -webkit-appearance: none;}

input[type='radio'] { -webkit-appearance: radio; width: auto !important; margin: 0 10px 0 0 !important;}
input[type='checkbox'] { -webkit-appearance: checkbox; width: auto !important; margin: 0 10px 0 0 !important;}

input[type='radio'].input-first, input[type='checkbox'].input-first{margin: 2px 5px 0 0 !important;}

textarea{height: 100px;}
input::placeholder, textarea::placeholder{color: #c6c6c6;}



.input_cnt{display: flex; flex-wrap: wrap;}
.input_single{display: flex; margin: 20px 10px; align-items: center;}
.input_single:first-child{margin: 20px 10px 20px 0;}


.active, .navigation a:hover{background: #0d274a;}

.close{text-align: right; margin: 0;}
	
body{background: #FFF; font-size:14px; line-height:1.3; font-family: 'Roboto', sans-serif; font-weight: 400; color: #596869; height: 100%;}
	body.grigio{background-color: #F4F4F4;}
	
.bianco{background-color: #FFF; padding: 40px 20px; box-sizing: border-box;}

#header_user{background: var(--blue); padding: 20px 0; display: flex; align-items: center; justify-content: space-between;}
	.logo{width: 150px; }

.main-row{height: calc(100% - 80px); min-height: auto; min-height: 850px;}
.main-content{box-sizing: border-box; height: 99%; padding: 0;}
	

	.flexcol{height: 100%;}
	.home{background: none;}

.logo-left {display: block; height: auto; width: 140px; margin: 23px auto 0 auto;}
.navigation{width: 170px; min-width: inherit; max-width: inherit;}
.navigation a{padding: 0 10px; font-size: 14px;}

#contenitore{padding: 20px; box-sizing: border-box; display: flex; height: 100%; position: relative;}
	
.main{width: 80%; height: 100%; padding-right: 10px; box-sizing: border-box;}	
.sidebar{width: 20%; height: 100%; padding-left: 10px; box-sizing: border-box;}
	
	.info{padding: 10px 20px; border-radius: 10px; border: 1px solid #dddddd; color: #B23B3B; column-count: 3; width: 100%; height: 10%; box-sizing: border-box;}
	
		
	.cal_giorni{width: 100%; height: 20%; padding: 10px; box-sizing: border-box;}
		.top_month_name{margin: 0;}
	
		.swiper-container {height: calc(100% - 30px);}
			.swiper-slide{height: 100%;}
				.swiper-slide-active{background-color: #D8FFFA;}
			
			.swiper-slide.today .day_info:after {
			    content: 'Oggi';
			    display: block;
			    position: absolute;
			    top: 2px;
			    bottom: auto;
			    text-align: center;
			    background: #8CCCC5;
			    color: #FFF;
			    padding: 2px 5px;
			    border-radius: 3px;
			    font-size: 10px;
			}
			
			.swiper-slide-active .giro{background: var(--blue); color: #FFF; padding-left: 4px;}
				
		.day_number{font-size: 17px;}
				
				
	
	.map_e_list{display: flex; width: 100%; height: 70%; position: relative;}
		.map, .list{width: 50%; padding: 10px 0 0 0; box-sizing: border-box; height: 100%;}
	
	.check_appuntamenti{position: absolute; left: 10px; top: 20px; z-index: 99; background: #FFF; display: block; padding: 10px; box-sizing: border-box;}
		.check_appuntamenti input{display: inline-block; width: auto;}
	
	
	.list_items_cnt{ border-radius: 10px; border: 1px solid #dddddd; padding: 10px 0; box-sizing: border-box; height: 100%; max-height: 100%; overflow: scroll;}
	
		.list_item{padding: 15px 20px 10px 20px; box-sizing: border-box; border-bottom: 1px solid #ddd; cursor: pointer;}
			.list_item.selected_item{background-color: #D8FFFA;}
	
			.list_head{display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px;}
				.list_head h2{color: var(--blue);}
				.list_head span{font-weight: bold;}
			
			
			.list_orario{display: flex; align-items: center; justify-content: space-between;}
				.list_orario span{color: var(--celeste);}
				.list_orario label{display: flex; align-items: center;}
					.list_orario label input{margin-left: 10px; padding: 5px 15px; width: auto; max-width: none;}
				.list_orario button{background: var(--celeste); color: #FFF; height: auto; width: auto; margin: 0; padding: 8px 10px; border: none;}
	
	
	.label{font-size: 14px;}
	
	
	.cal_desc{width: 100%;}
	.cal_count{background: var(--blue); border-radius: 5px;}
	
	.giro .cal_count{background: #FFF; color: var(--blue);}
	
	
	.sel_orario{margin-left: auto; margin-right: 10px;}
	
	.warning_data{color: #d00b0b;}
	
	.count_veicoli{font-size: 24px; text-align: center; margin: 10px auto;}
	
	.sel_veicoli{ margin: 10px;}
		.sel_veicoli select{margin: 10px auto; width: auto;}
	
	
	.cambio_pwd{padding: 20px; width: 80%; box-sizing: border-box; max-width: 600px; margin: 0 auto;}
		.cambio_pwd h4{margin: 20px 0;}
		
			.pwd_cnt div{margin: 10px 0;}
				.pwd_cnt div label{margin-bottom: 5px;}
		
		
	.list-group-item{display: flex; align-content: center; justify-content: space-between;}	
		.list-group-item.selected{background-color: var(--celeste); color: #FFF;}
	
	.btn-primary{background-color: var(--blue);}	
		
	.modal-footer{display: flex; align-items: center; justify-content: space-between;}	
		
	.form-group{display: flex; align-items: center; justify-content: flex-start; box-sizing: border-box;}
		
		
	.radio-inline input, .radio input{-webkit-appearance:auto; position: relative !important; margin: 0 0 5px 0 !important;}
	
		.radio_cnt{}
		.radio{display: inline-block; float: none; margin: 0 5px; padding: 0;}
		.radio label{padding: 10px; margin: 0 0 10px 0; border: 1px solid #d9d9d9;display: inline-block; }
		
	.upload_slot{text-align: right;}	
	
	.modal-lg{/* width: 80%; max-width: 720px; */}	
		
	.modal-title{display: inline-block; font-size: 24px;}	
		
	.modal-body h4{font-size: 28px;}
	
	.cal_giornaliero{width: 100%; align-self: flex-end; height: 100%; padding: 0; box-sizing: border-box;}
	.legenda{overflow: hidden;}
		.legenda ul{list-style: none; display: flex; flex-wrap: wrap; justify-content: space-around;}
			.legenda ul li{padding: 5px 0; white-space: nowrap;}
				.legenda ul li.square_blu:before, .legenda ul li.square_verde:before{content: ''; width: 14px; height: 14px; border-radius: 2px; display: inline-block; background: var(--blue); vertical-align: middle; margin-right: 5px;}
				.legenda ul li.square_verde:before{background: #269318;}



		.appuntamenti{height: calc(100% - 80px); width: 100%;}
			.appuntamenti_head{background: var(--blue); padding: 10px; box-sizing: border-box; color: #FFF; font-size: 18px; text-align: center; font-weight: bold; margin-top: 4px;}
				.appuntamenti_head span{display: block;}
				.appuntamenti_head a{font-size: 14px; font-weight: normal; text-decoration: underline;}



			.appuntamenti_cnt{position: relative; height: calc(100% - 110px); overflow-y: scroll; border: 1px solid #ddd; border-radius: 0 0 10px 10px; padding: 10px 10px 0 10px; box-sizing: border-box;}
				.orario{height: 60px; border-top: 1px solid #ddd;}
					.orario span{background: #FFF; margin-top: -9px; display: block; width: 45px;}
	
			.slot_appuntamento{position: absolute; margin-top: 10px; left: 55px; right: 0; padding: 10px; color: #FFF; display: flex; align-items: center; justify-content: space-between;}
				.slot_appuntamento.confermato{background-color: #269318;}
				.slot_appuntamento.non_confermato{background-color: var(--blue);}

				.slot_appuntamento a{background: var(--celeste); color: #FFF; height: auto; width: auto; margin: 0; padding: 5px 15px; border: none; display: block; border-radius: 20px;}

			
			.conferma_action{text-align: center; margin-top: 7px;}
			.conferma_action a{background: #269318; padding: 10px 20px; color: #FFF; border-radius: 20px; text-align: center; display: inline-block;}



			/* APP */

			#app_header{height: 45px; background: #FFF; padding: 7px 15px; display: flex; align-items: center; justify-content: space-between; box-sizing: border-box; box-shadow: 0px 1px 5px #7b7b7b; position: relative; z-index: 999;}
			#app_header a{display: block; line-height: 1;}
			#app_header a.pulsante{background: #115289; color: #FFF; padding: 5px 10px; border-radius: 10px; border: none; box-shadow: none;}

			#app_header span{margin: auto; transform: translateX(-10px); font-size: 18px; font-weight: bold;}

			a.pulsante{font-family: 'Montserrat', sans-serif; background: #FFF; color: #8CCCC5; border: 1px solid #8CCCC5; border-radius: 30px; font-size: 13px; text-transform: uppercase; display: inline-block; padding: 10px 20px; margin: 15px 0; font-weight: 500; text-align: center; box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16); min-width: 150px;}



			#mappa_cnt{height: 40vh; display: block; width: 100%; position: relative;}

			.lista{height: calc(60vh - 45px); box-sizing: border-box; padding-bottom: 50px; overflow-y: scroll;}

			#mappa_cnt .btn{position: absolute; top: 0; left: 0; right: 0; z-index: 10; text-align: center;} 
			
			#mappa{background: #FF6600; position: absolute; left: 0; right: 0; top: 0; bottom: 0;}


			
		.ritiro_single_cnt{display: flex; align-items: center; justify-content: space-between; padding: 15px 15px; border-bottom: 1px solid #D8D8D8;}

		.ritiro_column{display: flex; flex-direction: column; width: 25%; margin-right: 10px;}
			.ritiro_column.ritiro_info{width: 50%; margin-right: 5px;}
			.ritiro_column.ritiro_stato{width: 20%; margin-right: 0;}
				
	
				.ora_ritiro{font-weight: bold; font-size: 22px; margin-right: 5px;}
				.nome_ritiro, .via_ritiro, .materiale_ritiro{font-size: 15px;}

				.qty_ritiro{color: #00B6C0;}
				.numero_client{text-decoration: underline;}
				
				.btn_apri{background: #525252; color: #FFF; text-align: center; padding: 10px 20px; box-sizing: border-box; border-radius: 10px;}


			.check_ritiro span{display: inline-block; vertical-align: middle;}
				.strumenti a{text-decoration: underline;}
				
			.ritiro_single_cnt .strumenti{display: none;}

			.ritiro_single_cnt.ritirato .ritiro_column_left{opacity: .3;}

			.ritiro_single_cnt.ritirato .strumenti{display: block;}
			.ritiro_single_cnt.ritirato .btn_apri{display: none;}
			
			.ritiro_single_cnt.sel{background: rgba(0, 182, 191, 0.25);}
			

			.footer_scarico{position: fixed; height: 50px; bottom: 0; left: 0; right: 0; background: #115289; display: flex; align-items: center; justify-content: space-between; padding: 0 15px; box-sizing: border-box;}

				.footer_scarico h2{color: #FFF;}

				.footer_scarico .btn_apri{background: #FFF; color: #115289;}




		
		.giri_cnt ul, .scarico_cnt{display: flex; flex-direction: column; list-style: none;}
			.giri_cnt ul li{display: flex; align-items: center; padding: 20px;  box-sizing: border-box; border-bottom: 1px solid #eaeaea;}
				.giri_cnt ul li span{color: #115289; font-size: 15px; width: 33%;}

					.giri_cnt ul li span.appuntamenti_giro{}

			.preso_in_carico{display: none;}
				.giri_cnt ul li .preso_in_carico span{color: #39C944; margin-right: 10px;}
			.giri_cnt ul li.attivo .preso_in_carico{display: block;}

			.giri_cnt ul li .preso_in_carico_io, .giri_cnt ul li .preso_in_carico{margin-left: auto;}

		.cerca{padding: 20px 20px 0 20px; box-sizing: border-box;}
		
		.scarico_singolo{padding: 20px; border-bottom: 1px solid #eaeaea;}
			
			.check_ritiro{display: none;}
			.scarico_singolo.ritirato .check_ritiro{display: block;}
			.ritirato .check_ritiro{display: block;}

			.scarico_singolo.ritirato .data_richiesta{display: none;}

			.scarico_row{display: flex; align-items: center; margin: 7px 0;}
				.scarico_row  div{margin-right: 10px; line-height: 1;}

				.tipologia{padding: 5px 10px; border-radius: 15px; background: #00B6C0; color: #FFF; font-size: 14px;}

				.nome_mezzo{font-size: 21px; color: #115289; text-transform: uppercase;}

				.button_pomili a{background: #00B6C0; color: #FFF; padding: 10px 20px; display: inline-block; border-radius: 40px; margin: 20px; float: right;}



				.pwd_change_cnt input{padding: 10px; margin: 10px 0; font-size: 14px; max-width: 200px;}
				
				.logout_cnt{margin: 10px 0;}
				
				
				

				.button_add{
					background: #115289;
				    color: #FFF;
				    padding: 12px 20px;
				    text-align: center;
				    border-radius: 50%;
				    line-height: 1;
				    /* display: inline-flex; */
				    font-size: 32px;
				    /* display: flex; */
				    position: fixed;
				    /* font-weight: 200; */
				    bottom: 20px;
				    right: 20px;
				   	}








	#documenti{margin: 20px 0;}
	
		#documenti textarea{margin: 10px 0; padding: 10px;}

			#documenti input{margin: 20px 0;}


		
		.doc_heading{margin-bottom: 5px;}


		
	.modal_container{max-width: none; width: 90%; max-height: none; height: 90vh; position: relative;}

		.modal_header h2{margin: 0 auto 10px auto;}

		.modal_content ul{list-style: none;}
			.modal_content ul li{padding: 20px 10px; box-sizing: border-box; width: 100%; display: block; border-bottom: 1px solid #EAEAEA;}
				.modal_content ul li.selezionato{background-color: var(--celeste); color: #FFF;}

		.modal_footer{display: flex; position: absolute; bottom: 20px; left: 0; right: 0;}
			.modal_footer button{margin: 0 10px;}
			.modal_btn_ko{background-color: #cecece;}
			
			
		
		
		
	.header_web{background: var(--blue); padding: 20px; box-sizing: border-box; color: #FFF; display: flex; justify-content: space-between; align-items: center;}	
			
			.header_web img{width: 150px;}
		
		.header_user a{float: none; color: #FFF;}
		
		
		.web_login h1{text-align: center;}
		.login_heading{width: 200px !important;}
			
			.login_cnt, .registrazione_cnt{width: 90%; max-width: 500px; margin: 20px auto; padding: 20px; box-sizing: border-box; border: 1px solid #BCBCBC; border-radius: 10px;}
		
			.login_cnt img, .registrazione_cnt img{width: 40px; margin: 0 auto; display: block;}
		
			#login_web{margin: 20px auto;}
				#login_web input{margin: 10px 0;}
				#login_web a{text-decoration: underline;}
		
			.registrati_box{text-align: center;}
		
		
		.registrazione_cnt{border: none; text-align: center;}
		
		#registrazione_privato, #registrazione_concessionaria{margin: 20px auto;}
			#registrazione_privato input, #registrazione_concessionaria input{margin: 10px 0;}
		
		
			.registrazione_cnt a{border: 1px solid var(--celeste); border-radius: 20px; padding: 5px 10px; line-height: 1;}
				.registrazione_cnt a.tab_sel{background-color: var(--celeste); color: #FFF;}
		
		
		.servizi{padding: 20px;}
			.servizi h1{margin-bottom: 20px;}
		
		.servizi_list{display: flex; align-items: center; flex-wrap: wrap;}
			.servizio_single{width: 100px; text-align: center; margin: 10px 20px;}
		
			.add_mezzo{width: 105px;}
		
		
		
		.richiesta_cnt{width: 90%; max-width: 900px; margin: 20px auto; box-sizing: border-box;}
		
		#richiesta_web{display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: flex-start;}
			#richiesta_web input, #richiesta_web textarea, #richiesta_web select{width: 48%; margin: 10px 1%; max-width: none;}
		
			.addr_search{width: 48%; margin: 10px 1%; max-width: none;}
				#richiesta_web .addr_search input{width: 100%; margin: 0;}
		
		.table{width: 100%; margin: 20px 0;}
			.table td{padding: 10px 0; border-bottom: 1px solid #eaeaea;}
			
		.send_ok{text-align: center;}
			.send_ok a{margin: 10px 0; display: inline-block; width: 100%;}	
		
		.appointments .link_back{margin: 20px auto; width: 90%; padding: 0; max-width: 1200px; display: block;}
		
		
		.documenti{width: 100%; margin: 20px 10px;}
		
			.documento_single{margin: 10px 0; display: block;}
				.documento_single a.rimuovi{margin-left: 20px; color: #d40000}
				.documenti select{margin: 20px 0;}
		
		.upload{display: flex;  align-items: center;}
			.upload a{margin-left: 20px;}
		
		
		
		
		.addr_info{display: flex; flex-direction: column; max-width: 300px; margin: 10px auto;}
		
		.addr_info *{margin: 5px 0;}
		
		
		
		.check_pwd_row input{margin-top: 10px;}
		
		.check_pwd_success *, .pwd_check *{margin: 10px 0;}
		
		
		
		.recovery_hint{margin: 20px 0;}
		
		
		.addr_sedi{display: flex; flex-direction: column; width: 100%;}
		#richiesta_web .addr_sedi .radio{display: inline-block; width: 31%; margin-right: 5px;}
			#richiesta_web .addr_sedi .radio label{text-align: center;}
			#richiesta_web .addr_sedi .radio input{margin: 0 auto 10px auto !important;}
		
		
			.sedi_cnt{display: flex; flex-direction: row; margin-top: 10px;}
		
		
		.account_cnt h1{margin: 10px 0;}
		
		.account_cnt .user_name, .account_cnt .client_name{margin: 10px 0;}
		
		.appointments h1{text-align: center; margin: 40px 0;}
		
			.appoint_single{background: #FFF; padding: 20px; box-sizing: border-box; border: 1px solid #C7C7C7; position: relative; margin: 10px 0;}
				.qty_tot{font-weight: bold;}
				
				.appoint_accordion{width: 100%;}
				
				
				.appoint_single.open img{transform: rotateZ(270deg);}
					.appoint_single img{width: 15px; position: absolute; right: 20px; top: 25px; transform: rotateZ(180deg); transition: all .3s ease;}
				
				.appoint_single .appoint_accordion{display: none; overflow: hidden;}
				.appoint_single.open .appoint_accordion{display: block;}
				
				
				.requests_list .scarico_singolo{background: #FFF;}
				
		
			.in_attesa .data_richiesta{color: #dda50b;}		
		
			.confermato .data_richiesta{color: var(--celeste);}
		
		
		
	.caronte_footer{padding: 20px; text-align: center;}
		.caronte_footer img{width: 100%; max-width: 500px; height: auto;}
		.caronte_footer span{height: auto; line-height: 1.3; display: block;}

.check_cnt {
	  display: block;
	  position: relative;
	  padding: 20px 20px 20px 35px;
	  margin: 20px 0;
	  padding-top: 3px;
	  cursor: pointer;
	  font-size: 15px;
	  -webkit-user-select: none;
	  -moz-user-select: none;
	  -ms-user-select: none;
	  user-select: none;
	  border-bottom: 1px solid #eaeaea;
	}
	
	.check_cnt.disabled{opacity: .4; pointer-events: none;}
	
	/* Hide the browser's default checkbox */
	input.checkbox {
	  position: absolute;
	  opacity: 0;
	  cursor: pointer;
	  height: 0;
	  width: 0;
	}
	
	/* Create a custom checkbox */
	.checkmark {
	  position: absolute;
	  top: 0;
	  left: 0;
	  height: 25px;
	  width: 25px;
	  background-color: #FFF;
	  border: 1px solid #BFBFBF;
	  border-radius: 3px;
	}
	
	
	/* When the checkbox is checked, add a blue background */
	.check_cnt input:checked ~ .checkmark {
	  background-color: var(--blue);
	}
	
	/* Create the checkmark/indicator (hidden when not checked) */
	.checkmark:after {
	  content: "";
	  position: absolute;
	  display: none;
	}
	
	/* Show the checkmark when checked */
	.check_cnt input:checked ~ .checkmark:after {
	  display: block;
	}
	
	/* Style the checkmark/indicator */
	.check_cnt .checkmark:after {
	  left: 9px;
	  top: 5px;
	  width: 5px;
	  height: 10px;
	  border: solid white;
	  border-width: 0 3px 3px 0;
	  -webkit-transform: rotate(45deg);
	  -ms-transform: rotate(45deg);
	  transform: rotate(45deg);
	}






	.action_bar{display: flex; align-items: center; justify-content: space-between;}
	
		.action_bar .button_pomili a{margin: 0;}
		
			.action_bar .button_pomili.grigio a{background: #BEBEBE;}





	.add_foto{background-color: var(--celeste); background-image: url(img/camera.svg); background-position: center 15px; background-repeat: no-repeat; color: #FFF; display: block; box-sizing: border-box; width: 100%; margin: 20px 0; padding: 40px 20px 15px 20px; text-align: center; border-radius: 10px;}




@media only screen and (max-width: 720px) {
	
	#richiesta_web input, #richiesta_web textarea, #richiesta_web select, .addr_search{width: 98%;}
	
	.input_single{display: flex; margin: 20px 0; align-items: center; width: 100%;}
	
	input[type='radio'] {padding: 0;}
	input[type='checkbox'] {padding: 0; border-radius: 0;}
	
	
}