/* --------------------------SHIP A PARCEL - LIVRER UN COLIS------------------------------- */

/* GOOGLE API ------------------------------------------------------------------------- */ 


/* Petit marqueur � c�t� de la ville*/
.pac-icon {
  width: 0;
  background-image: none;
}

.pac-container.pac-logo {
	 text-decoration-color:  blue;
	background-color: white;
}

/* Pays*/
.pac-item{
	color: #575756;
}

/* Ville*/ 
.pac-item-query {
	color: #00b5d8;
	font-weight: bold;
	font-size: 17px;
}

.pac-item:hover{
	background-color: #A9A9A9;
	color: white;
}

/* ------------------------------------------------------------------------------------ */ 


/* PAGE EXPEDITION/INDEX -------------------------------------------------------------- */
#div_text{
	margin-top: 200px;
	display:flex;
	flex-wrap: wrap; 
	flex-direction: column; 
	justify-content: center;
}

#div_text h1 {
	color: #00b5d8;
	font-size: 55px;
	text-align: center;
}

#div_text h2 {
	color: white;
	font-size: 30px;
	text-align: center;
	margin-bottom: 0;
}

#div_text h6 {
	color: white;
	font-size: 15px;
	text-align: center;
	margin-bottom: 35px;
}

#form_trajet1 {
	background: none;
	display: flex;
	flex-wrap: wrap; 
	flex-direction: column; 
	justify-content: center;
	width: 100%;
}

#search_bar {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}

#search_bar button{
	background-color: #00b5d8;
	color: white;
}

#form_trajet1 .row{
	text-align: center;
}

#form_trajet1 .buttonb {
 	width: 25%;
 	height: auto;
 	align-self: center;
}

#form_trajet1 #departure,  #form_trajet1 #arrival{
	border: 3px solid #00b5d8;
	margin: auto;
	margin-bottom: 10px;
	padding: 10px 10px 10px 10px;
	width: 25%;
	align-self: center;
	border-radius: 5px;
	font-size: 1.2em;
	color: white;
}

@-moz-document url-prefix()
{ 
	#form_trajet1 input#departure{
		height: 50px;
	}
	#form_trajet1 input#arrival{
		height: 50px;
	}
}

#size-expe {
	display: flex;
	justify-content: space-around; 
	flex-wrap: wrap;
	flex-direction: row;
}

#size-expe fieldset {
	border: none;
	padding: 0px 50px 20px 50px;
}

.bg_bar {
	background-color: rgba(227,227,227,1.00); 
	color: white;
}

#size-expe legend {
	border-bottom: 0;
	font-size: 22px;
    margin-left: 5px;
    text-transform: initial;
    padding-top: 20px;
    margin-bottom: 0;
}

#size-expe *, *:before, *:after{
	box-sizing: initial; 
}

#reseach_bar_aside .div_aside_bar{
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
}

#clear_selection{
   	width: 100%;
   	background-color: #060531;
   	color: white;
 	padding: 4px;
 	margin-top: 20px;
}

#clear_selection:hover{
	background-color: white;
	color: #00b5d8;
	border: 2px solid #00b5d8;
}

.infobulle_gg_parcel_detail {
	color: #005bd8; 
	font-weight: bold;
	text-align:center;
	margin-left: 40%;
}

.infobulle_gg_parcel_detail:hover {
	color: purple; 
	font-weight: bold;
}

@media only screen and (max-width: 601px){
	#div_text{
		margin-top: 60px;
	}
	#div_text h1{
		font-size: 40px;
		padding-bottom: 5px;
	}
	#div_text h2{
		font-size: 20px;
	}
	#div_text h6{
		font-size: 12px;
		padding-left: 10px;
		padding-right: 10px;
	}
	#search_bar #departure, #search_bar #arrival{
		width: 50%;
	}
}

.input.text #departure {
	font-family: 'vegurregular';
}
/* ------------------------------------------------------------------------------------ */ 

/* PAGE EXPEDITION (expe.ctp) --------------------------------------------------------- */

#research_bar_aside {
/*	border: 3px solid #d3d3d3;
	background-color: transparent;
	height: auto;
	width: 17%;
	position: absolute; top: 80px; z-index: 1; left: 10px; padding-top: 15px;
*/
	display: flex; 
	flex-direction: row; 
	align-items: center;
}

.div_aside_bar {
	padding-top: 10px;
	padding-left: 10px;
	padding-right: 10px;
}

 .symbole_expe {
	border: 2px solid transparent;
    padding: 10px;
    background-color: #00b5d8;
}

.expe_autoValidation {
	width: 35px; 
	height: 35px;	
}

/* FOR THE PLACEHOLDER */ 

#research_bar_aside ::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color:    black;
}
#research_bar_aside :-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color:    black;
   opacity:  1;
}
#research_bar_aside ::-moz-placeholder { /* Mozilla Firefox 19+ */
   color:    black;
   opacity:  1;
}
#research_bar_aside :-ms-input-placeholder { /* Internet Explorer 10-11 */
   color:    black;
}
#research_bar_aside ::-ms-input-placeholder { /* Microsoft Edge */
   color:    black;
}

/* END OF THE CHANGEMENT OF PLACEHOLDER'S COLOR */ 

#research_bar_aside #dateinput{
	display: none;
}

#research_bar_aside .labels {
	text-decoration: none; 
	font-style: normal;	
	font-weight: bold;
	color: 	black; 
	font-size: 17px;
	margin-left: 5px;
}

#research_bar_aside #datepicker_input1, 
#research_bar_aside #datepicker_input2 {
	display: inline;
	width: 55%;
	color: black; 
} 

#research_bar_aside #amount, #research_bar_aside #weight {
	border:0; 
	color: black; 
	font-weight:bold; 
	width: 100%; 
	background-color: transparent;
	padding: 0;
    margin-left: 0;
    text-align: center;
}

.datepicker{
	display: flex;
	justify-content: center; 
	font-size: 20px;
}
/* Fond du calendrier (derri?re) */
#research_bar_aside .ui-datepicker-inline.ui-datepicker.ui-widget.ui-widget-content.ui-helper-clearfix.ui-corner-all {
	background-color: lightgray;
}

/*Fond de l'ent?te */ 
#research_bar_aside .ui-datepicker-header.ui-widget-header.ui-helper-clearfix.ui-corner-all {
	background-color: #00B5D8;
}

#research_bar_aside table thead tr{
	border-bottom: none;
}

/* Quand on clique sur une case du calendrier*/
#research_bar_aside .ui-state-default.ui-state-active{
	color: white;
	background-color: #00b5d8;
	border-color: black;
}

#research_bar_aside .ui-state-highlight a, .ui-widget-content .ui-state-highlight a, .ui-widget-header .ui-state-highlight a{
	color: white;
	background-color: #00b5d8; 
	border-color: black;
}
#research_bar_aside  .ui-datepicker-unselectable.ui-state-disabled{
	background-color: white;
} 
/*Highlight d'aujourd'hui*/
#research_bar_aside .ui-state-default.ui-state-highlight{
	background-color: #ADD8E6;
	color: white;
	border-color: #00B5D8;
}

/* fond du calendrier */ 
#research_bar_aside .ui-datepicker-calendar {
	background-color: lightgrey;
}
	
/* Mois */	
#research_bar_aside .ui-datepicker-title{
/*	background-color: gray;*/
	color: white;
}
		
/* Ann?e */		
#research_bar_aside .ui-datepicker-year{
	background-color: #00B5D8;
	color: white;
	border: none;
}
	
/* Jour de la semaine */	
#research_bar_aside .ui-datepicker-calendar th{
	color: #060531;
}
	
#research_bar_aside #input1, #research_bar_aside #input2{
	display: inline;
	color: black;
	border: none;
	background-color: transparent;
	font-size: 11px;
}	
	
#research_bar_aside span {
	text-align: center; 
	font-weight: bold;
}

/* Highlight des cases comprises entre les deux dates s?lectionn?es par l'utilisateur */
#research_bar_aside .dp-highlight .ui-state-default {
     background: blue;
     color: white;
}

#date_limit {
	display: flex; 
	flex-direction: column; 
	margin-top: 20px;
	text-align: center;	
}

#date_limit div p{
	color: white;
}

#date_limit #date_limit1 {
	border: 2px solid #00b5d8;
	padding: 5px 5px 5px 5px;
	background-color: #00b5d8;
}


#date_limit #date_limit2 {
	border: 2px solid #00b5d8;
	padding: 5px 5px 5px 5px;
	background-color: white;
}

#date_limit div span {
	color: black;
	background-color: white;
}

#div_third p{
	font-weight: bold;
	text-align: center;
}

#div_third p b{
	color: black;
	font-size: 33px;
}

#slider-range{
	background-color: white;
}

/* Couleur de fond pour les slide bar */ 
body div.ui-slider-range.ui-widget-header{
	 background:#00b5d8;
}


#fieldset_parcel_expe #tableaHeaders{
	background-color: #00b5d8;
}

#fieldset_parcel_expe #tableCells{
	background-color: white;
}

#fieldset_parcel_expe #tableaHeaders th{
	color: white;
	text-align: center;
}

#fieldset_parcel_expe{
	background-color: white;
	color: black;
	border: none;
	margin-bottom: 10px;
}

#modalquestions h1, #modalresponse .resp{
	color: #00b5d8;
	text-align: center;
}

#modalquestions textarea {
	height: 120px;
}

#modalquestions button {
	margin-left: 35%;
	width: 35%;
}


#form_trajet  .ui-slider-range.ui-widget-header{
	background : #00b5d8;
}

#valueDetour {
	margin: auto;
	color: #060531; 
	font-weight: bold; 
	font-size: 20px;
}

#slider-detour {
	width: 50%; 
	margin: auto;
}

#form_trajet {
	font-family: 'Euphemia';
	width: 100%;
  /*  background-color: rgba(183,181,173,1);*/
    opacity: 0.8;
    color: white;
    font-size: 1.000em;
   /* display: flex;  */ 
    padding: 10px 40px 10px 40px; 
    /*flex-direction: column;*/
    
    display: flex; 
    flex-direction: row; 
    align-items: center; 
    margin-top: 15px;    
    background-color: transparent; 
    margin-bottom: 5px;
}

#form_trajet div.input.text{
	/*width: 15%;*/
	margin-top: auto;
	margin-bottom: auto;
}

#form_trajet #departure, #form_trajet #arrival  {
	text-align: center; 
	background-color: white;
}


#form_trajet #input {
	height: 80px;
	padding-right: 400px;
	padding-left: 400px;
}

#form_trajet .row {
	width: 100%;
}


#div_form div div, #body_content div div{
	font-weight: bold;
}        

#input {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

#input #change_inputs {
   background-color: gray;
   margin-left: 100px;
   margin-right: 100px;
   margin-top: auto;
   margin-bottom: auto;
}

#form_trajet .input.range {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	width: 100%;
}

#detour{
	display: block;
  	width: 30%;
  	margin-right: auto;
  	margin-left: auto;
  	margin-top: 0;
}



.range-field input[type=range] + .thumb .value {
	color: black;
	font-weight: bold;
	width: 40px;
	margin-left:-9px;
	font-size: 16px;
	margin-top: 5px;
}

.range-field input[type=range] + .thumb.active{
	font-size: 26px;
	margin-top: 0;
}

#body_content {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}


#form_trajet .buttonb:hover{
	background-color: white;
	color: #039be5;
}
#result {
	border: 1px solid none;
	width: 1000px;
	background-color: white;
	display: flex;
	flex-wrap: wrap;
}

#body_content #result #map {
	height: 500px;
}

#result p {
	color: black;
	margin-bottom: 10px;
}

#form_tri {
    height: 50px;
    width: 300px;
    padding: 30px;
    background: none;
    opacity: 0.8;
    color: #d3d3d3;
    font-size: 1.000em;
    box-sizing: border-box;
    outline: none;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap
}

#form_tri select {
	color: #00b5d8; 
	background-color: white;
}

#form_tri select option:hover {
	background-color: #00b5d8;
	color:white;
}

.row #button_submit_expe {
	background-color: #1E90FF;
	margin-top: 15px;
}

.div_result {
	border: 1px solid none;
	display: flex; 
	justify-content: space-between;
	width:100%;
	flex-wrap: wrap;
	margin: 1px 0;
	background-color: white;
	padding: 20px;
}
.div_result:nth-child(odd) {
   color: black;
   background-color: white;
  }
  
.div_result:nth-child(even) {
  background-color: #E0E0E0;
  color: black;
 }

.first_div, .second_div, .thrid_div, .fourth_div {
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	align-items: center;
	margin: auto;
}

.thrid_div p{
	font-size: 0.813em;
	color: black;
	margin: 0;
	margin-bottom: 3px;
}

.thrid_div{
	font-size: 1.2em;	
}

.fourth_div .payement {
	color: #494949;
	font-size: 3.125em;
}

.div_details {
	margin: auto;
}

.div_details a {
	padding-top: 8px;
    padding-bottom: 8px;
    padding-left: 20px;
    padding-right: 20px;
   	margin: 20px;
    background-color: white;
    color: #00b5d8;
    border: 2px solid #00b5d8;
    width: 100%;
    text-align: center;
    margin-bottom: 20px;
    margin-top: 20px
}

.div_picture {
	margin-bottom: 30px;
	margin-top: 20px;
	margin-right: 20px;
	margin-left: 20px;
}

.div_city_sr{
	color: #00b5d8;
	font-size: 0.75em;
}

.div_owner {
	margin-bottom: 30px;
	margin-top: 20px;
	margin-right: 30px;
	margin-left: 30px;
	color: #00b5d8;
}

.img_parcel{
	height: 90px; 
	width: auto;
	border-radius: 15%;
	border: 3px solid grey;
}



#div_form_trajet .row {
	text-align: center; 
	width: 100%;
}

#div_form .button_research {
	display: block;
    border-radius: 50%;
    border: 1px solid white;
    background-color: white;
    color: #00b5d8;
    margin-left: 10px;
}

#div_form #change_inputs {
	margin-left: 20px;
	margin-right: 20px;
	background: white;
    color: black;
    border-radius: 20px;
}

#div_form .infos_search {
	display: flex; 
	flex-direction: row; 
	justify-content: center;
	align-items: center;
	width: 100%;
}

#div_form #button_submit_expe {
	display:block;
  	height: auto;
  	border-radius: 50%;
 	border: 1px solid white;
 	color : #00b5d8;
  	background-color: white;
  	margin-left: 10px;
}

.nb_parcel_resize_expe, .weight_resize_expe{
	display: none;
}

#fieldset_content {
	margin-top: 0;
	border: 0;
}
	
#slider-weight, #slider-amount {
	margin-top: 10px;
	margin-left: 20px;
	margin-right: 20px;
}

#connect_for_details {
	border: none;
	background-color: transparent; 
	color: darkblue; 
}
	
.map_expe {
	position: relative;
	width: 800px; 
	height: 380px;
}	

.researchBar {
		height: 85px; 
		margin-top: 5px;  
		box-shadow: 1px 5px 10px 1px #333;
    	background-color: rgba(0, 0, 0, 0.6);
    	border-radius: 5px; 
    	display: flex; 
    	flex-direction: column;
}

.articleBar {
	height: auto; 
	width: 800px; 
	padding: 10px; 
	box-shadow: 1px 5px 10px 1px #333; 
	background-color: rgba(0, 0, 0, 0.6); 
	border-radius: 5px; 
	display: flex; 
	flex-direction: column;
}

.divAll {
	display: flex; 
	flex-direction: row; 
	margin-top: 6%; 
	justify-content: space-around; 
	align-items:  flex-start;
}

.articleBar #row_div {
	overflow: auto; 
	height: 75vh;
}

.viewRight {
	display: flex; 
	flex-direction: column;
}

.filtreBar {
	height: 300px; 
	width: 800px; 
	margin-top: 10px; 
	padding: 10px; 
	box-shadow: 1px 5px 10px 1px #333;
    background-color: rgba(0, 0, 0, 0.6);
    border-radius: 5px;
}

.filtreBar h1 {
	margin:0; 
	padding: 0; 
	text-align: center;
}

@media only screen and (max-width: 1672px){
	div .task-item{
		margin-left: 0;
	 }
}
	
@media only screen and (max-width: 1576px){
	/*#row_div{
		margin-left: 200px;
		margin-right: 200px;
	 }*/
}

@media only screen and (max-width: 1440px){
	#form_trajet #input{
		padding-right: 200px;
		padding-left: 200px;
	 }
	/* #row_div{
		margin-left: 100px;
		margin-right: 100px;
	 }*/
	 #date_aside {
	 	display: none;
	 }
	/* .map_expe, .researchBar, .filtreBar {
	 	width: 550px;
	 }*/
	 .articleBar {
	 	width: 600px;
	 }
	 .divAll {
	 	justify-content: start;
	 }
	 
}

@media only screen and (max-width: 1276px){
	#size-expe fieldset{ 
		padding: 0;
	}
	#research_bar_aside .div_aside_bar {
		padding-left: 0;
		padding-right: 0;
	}
}

@media only screen and (max-width: 1024px){
	.map_expe {
		height: 450px;
	}
}


@media only screen and (max-width: 1198px){
	.divAll {
		flex-wrap: wrap-reverse;
	}
}


@media only screen and (max-width: 1162px){
	#row_div{
		margin-left: 50px;
		margin-right: 50px;
	 }
}


@media only screen and (max-width: 1024px){
	/*#row_div{ 
		width: 100%;
	 }*/
	 #form_trajet #input{
		padding: 0;
	 }
	 #size-expe #1, #size-expe #3, #size-expe #5 {
		margin-left: 20px;
	 }
	 .divAll {
	 	justify-content: center;
	 }
	 .articleBar{
	 	width: auto;
	 }
	 .filtreBar {
	 	display: none;
	 }
}

@media only screen and (max-width: 1050px){
	table.ui-datepicker-calendar{
	 	font-size: 15px;
	 }
}

@media screen and (max-height: 637px){
	.infosSendP, .sender .row .select-wrapper, 
	div.select-wrapper.input-field.col.s12 {
		display: none;
	}
	#sender div.input-field.col.s6, #recipient div.input-field.col.s6 {
		margin-top: 0;
	}
	.step-six .createexpe_paragraphe {
		display: none;
	}
	.step-six h1 {
		padding-top: 5px;
	}
}


@media only screen and (max-width: 993px){
	 #research_bar_aside{
	 	display: none;
	 }	
	 #fieldset_content{
		width: 100%;
	 }
	 #fieldset_content #map {
	 	height: 200px;
	 }
	 #info_detail{
	 	display: initial!important;
	 	font-size: 30px;
	 }
	 #detail{
	 	display: none;
	 }
	 #form_trajet{
	 	padding-bottom: 15px;
	 	padding-top: 15px;
	 	width: 100%;
	 }
	 #row_div{
	 	margin-left: auto; 
	 	margin-right: auto; 
	 }
	 #div_form {
	 	width: 100%;
	 	margin: 0;
	 }
	 .div_details{
	 	margin: 0;
	 }
}	

@media only screen and (max-width: 883px){
	.filtreBar {
		display: none;
	}
	 .articleBar, .viewRight {
	 	width: -webkit-fill-available;
	 }
	 .map_expe{
	 	width: auto;
	 }
}

@media only screen and (max-width: 768px){
	#input #change_inputs{
	 	margin-left: 50px;
	 	margin-right: 50px;
	 }
	 .map_expe {
	 	height: 300px;
	 }
	 #div_form #form_trajet .input {
	 	width: 35%;
	 }
	 #detour {
	 	width: 70%;
	 }
	 .filtreBar {
	 	display: none;
	 }
	 .divAll{
	 	justify-content: initial;
	 }
	 .viewRight {
	 	width: 100%;
	 }
	 .map_expe {
	 	width: auto;
	 }
	
}

@media only screen and (max-width: 720px){
	.articleBar {
		width: 100%;
	}
}

@media only screen and (max-width: 601px){
	 #form_trajet #departure, #form_trajet #arrival {
	 	width: 100%;
	 }
	 #input #change_inputs{
	 	margin-left: 20px;
	 	margin-right: 20px;
	 }
	 #fieldset_content #map {
	 	display: none; 
	 }
	  #fieldset_content{
		margin-top: 0;
	 }
	 .div_owner {
	 	display: none; 
	 }
	 #change_inputs{
	 	width: 20%;
	 	font-size: 30px;
	 	margin: 0;
	 }
	 #detour{
	 	padding-top: 10px;
    	border: none;
	 }
	 .div_details a{
	 	padding: 10px;
	 }
	 #info_detail{
	 	display: initial!important;
	 	font-size: 30px;
	 }
	 #detail{
	 	display: none; 
	 }
	 .div_owner{
	 	margin-bottom: 0;
	 	margin-top: 5px;
	 }
	 .second_div {
	 	margin-top: 2px;
	 }
	 .thrid_div{
	 	margin-top: 10px;
	 }
	 .fourth_div{
	 	width: 100%;
	 }
	 .div_city_sr {
	 	text-align: center; 
	 }
	 .img_parcel{
	 	height: 80px;
	 }
	 .range-field{
		width: 100%;
		margin-top: 50px;
	}
	.div_picture{
		margin-bottom: 10px;
	} 
	#input {
		justify-content: space-around; 
	}
}	

@media only screen and (max-width: 425px){

	.weight_parcel_expe, .nb_parcel_expe{
		display: none;
	}
	.nb_parcel_resize_expe, .weight_resize_expe{
		display: initial;
		font-size: 20px;
	}
	.second_div{
		width: 100%;
	}
	.second_div div{
		font-size: 13px;
	}
	#div_form {
		margin-top: 50px;
	}
	#div_form .infos_search {
		flex-direction: column;
	}
	#div_form #form_trajet .input {
	 	width: 100%;
	}
/*
	#form_trajet #departure, #form_trajet #arrival{
		height: 30px;
	}
	 #form_trajet #departure, #form_trajet #arrival {
	 	padding-right: 0;
	 	padding-left: 0;
	 	padding-top: 2px;
	 	padding-bottom: 2px;
	 }
	 #input #change_inputs{
	 	margin-left: 0;
	 	margin-right: 0;
	 }*/
	 #change_inputs{
	 	width: 25%;
	 }
	 #button_submit_expe {
	 	margin-top: 0;
	 }
	.row #button_submit_expe {
		margin-top: 30px;
	}
	.map_expe {
	 	display: none;
	 }
	 .researchBar {
	 	margin-top: 20px;
	 	height: 230px;  
	 }
	 .researchBar #form_trajet {
	 	flex-direction: column;
	 }
	
	
	
}	

@media only screen and (max-width: 375px){
	 .img_parcel{
	 	height: 60px;
	 }
	 .nb_parcel_resize_expe, .weight_resize_expe{
		font-size: 15px;
	}
	#div_form {
		position: inherit!important;
		margin: 0;
	}
	#div_form #change_inputs{
		padding: 0; 
	}

	
}	

/* ------------------------------------------------------------------------------------ */ 

/* PAGE EXPEDITION/N?EXPEDITION ----------------------------------------------------- */ 

.viewExpe {
	display: flex; 
	flex-direction: row; 
	margin-top: 8%; 
	justify-content: space-around; 
	align-items: center;	
}

.detailParcel {
	height: 600px; 
	width: 650px; 
	padding: 10px; 
	box-shadow: 1px 5px 10px 1px #333; 
	background-color: rgba(0, 0, 0, 0.6); 
	border-radius: 5px;
}

.infosPath {
	display: flex; 
	flex-direction: row; 
	align-items: center;  
	justify-content: space-around;
}

#favorite {
	color: #1a237e; 
	cursor: pointer;
}

.pathParcel {
	width: 30%; 
	text-align: center;
}

#sender_recipient_city {
	color: white;
}

.vehicleParcel{
	text-align: center;
}

.vehicleParcel p {
	margin: 5px 0px 0px 0px; 
	color: white;
}

#priceParcel {
	color: white; 
	font-size: 3em;
}

.proposeParcel, .descriptifParcel {
	display: flex; 
	flex-direction: column;
}

#detailP {
	text-align: center;
	margin: 10px;	
}

#detailP hr {
	margin: 5px;
}

.intitulParcel {
	display: flex; 
	flex-direction: row; 
	justify-content: space-around
}

.intitulParcel .picture img {
	height: 150px;
}

.descriptifParcel h2 {
	color: white;
}

.descriptifParcel p {
	color: white;
	margin: 0;
}

.descriptifParcel p i {
	color: white;
}

.descriptifParcel span {
	color: white;
	margin-top: 10px;
}

.fixedSParcel {
	display: flex; 
	flex-direction: column; 
	align-items: center; 
	margin: auto 0px auto 0px
}

.fixedSParcel img {
	width: 50px; 
	height: 50px;
}

.dimensParcel {
	color:white; 
	margin-top: 20px; 
	text-align: center;
}

.dimensParcel tbody, .dimensParcel tr {
	border: 2px solid white;
}

.dimensParcel #tableaHeaders {
	background-color: gray;
}

.dimensParcel #tableaHeaders th{
	text-align: center;
}

.favorite {
     display: none;
     width: 50%;
     margin-left: auto;  
     margin-right: auto;
}

.detailME {
	display: flex; 
	flex-direction: column;
}

.detailME #map {
	width: 900px; 
	height: 400px;
	border-radius: 10px;
}

.expeQ {
	display: flex; 
	flex-content: row; 
	justify-content: space-around;
}

.expeParcel {
	height: 300px; 
	width: 300px; 
	margin-top: 10px; 
	padding: 10px; 
	box-shadow: 1px 5px 10px 1px #333; 
	background-color: rgba(0, 0, 0, 0.6); 
	border-radius: 5px;
}

.expeParcel h2 {
	color: white; 
	text-align: center;
}

.profilParcel {
	display: flex; 
	flex-direction: row;
}

.profilParcel p, .profilParcel p a {
	color: white;
}

.expeParcel p, .questionsParcel h1 {
	text-align: center;
}

#report_a {
	float: right;
	color: tomato;
}

.questionsParcel {
	height: 300px; 
	width: 500px; 
	margin-top: 10px; 
	padding: 10px; 
	box-shadow: 1px 5px 10px 1px #333; 
	background-color: rgba(0, 0, 0, 0.6); 
	border-radius: 5px;
	overflow: auto;
}

.questionsParcel .pictureUserI {
	display: flex;
	felx-direction: row;
}

.questionsParcel h2 {
	font-style: italic;
}
.questionsParcel .pictureUserI a, .response .questionName  {
	color: white;
	margin-left: 10px;
}

.pictureUserI .questionName, 
.questions, 
.questionDate, 
.responseP{
	color: white;
}

.questions, .responseP {
	font-size: 1em;
	margin: 0;
}

.questionDate {
	font-size: 0.8em;
}

.doReport {
	color: tomato;
	margin-left: 10px;
}

.askR {
	margin-left: 10px;
	color: #d8e021;
}

.response {
	margin-left: 25px;
	margin-bottom: 10px;
}

.askQ {
	font-size: 2em;
	background-color: #060531;
	color: white;
	border: 1px solid white;
	padding: 5px;
	border-radius: 5px;
}

.askQ:hover {
	color: #060531;	
	background-color: transparent;
}
.questionsParcel h2 {
	text-align: center;
}

#report #textarea1, #modalquestions textarea{
	color: black;
}

#modalreport .reportQ {
	color: black;
}
@media only screen and (max-width: 1440px){
	.detailME #map {
		width: 600px;
	}
	.detailParcel {
		width: 550px;
	}
	.questionsParcel {
		width: 300px;
	}
}	

@media only screen and (max-width: 1024px){
	.detailME #map {
		width: 400px;
		height: 300px;
		display: none;
	}
	.expeQ {
		margin-top: 20px;
		flex-wrap: wrap;
	}
	.detailParcel {
		margin-top: 20px;
	}
}	

@media only screen and (max-width: 768px){
	.picture {
		display: none;
	}
}

@media only screen and (max-width: 604px){
	.viewExpe {
		flex-wrap: wrap;
	}
}

/* ------------------------------------------------------------------------------------ */ 



/* VIEWGEOLOCRUNNER ------------------------------------------- */ 

.viewGParcel {
	display: flex; 
	flex-direction: row; 
	margin-top: 6%; 
	justify-content: space-around; 
	align-items: center;
}

.viewGP {
	height: 500px; 
	width: 400px; 
	padding: 10px; 
	box-shadow: 1px 5px 10px 1px #333; 
	background-color: rgba(0, 0, 0, 0.6); 
	border-radius: 5px; 
	display: flex; 
	flex-direction: column;
}

.viewGP h1 {
	text-align: center;	
}

.viewGP h1 hr {
	margin: 5px;	
}

.viewGPicture {
	margin: auto; 
	margin-bottom: 0; 
	margin-top: 5px;
}

.viewGInfosP {
	margin: auto;  
	margin-bottom: 0; 
	margin-top: 0;
}

.viewGInfosP h2, .viewGInfosP div{
	color: white;
}

.viewGInfosP p {
	color: white; 
	display: flex; 
	flex-direction: row; 
	justify-content: space-around; 
	align-items: center;
}

.viewGParcel #map {
	width: 1400px; 
	height: 500px;
}

.viewGED {
	display: flex; 
	flex-direction: row; 
	align-items: center; 
	justify-content: space-around;
}

.viewGEDBox {
	height: 250px; 
	width: 300px; 
	margin-top: 5px; 
	padding: 10px; 
	box-shadow: 1px 5px 10px 1px #333; 
	background-color: rgba(0, 0, 0, 0.6); 
	border-radius: 5px; text-align: center;
}

.viewGEDBox h1 {
	text-align: center;  
	padding: 0; 
}

.viewGEDBox h1 hr{
	margin: 5px
}

.viewGEDBox h1 i{
	color: #FFFFFF; 
	margin-right: 20px;
}

.viewGEDBox h2 {
	margin: 0; 
	margin-top: 20px;
}

.viewGEDBox p {
	color: white;
}

.viewGED .fa-info-circle {
	display: none;
	color: aliceblue;
}

#modalDetailParcelGeoloc {
	top: 20%;
	height: 500px;
	border-radius: 10px;
	box-shadow: 1px 5px 10px 1px #333; 
	background-color: rgba(0, 0, 0, 0.8); 
	
}
 
	

#modalDetailParcelGeoloc  h1 {
	text-align: center;	
}

#modalDetailParcelGeoloc h1 hr {
	margin: 5px;	
}

@media only screen and (max-width: 1440px){
	.viewGParcel #map {
		width: 900px;
	}
}

@media only screen and (max-width: 1024px){
	.viewGParcel #map {
		width: 550px;
	}
	.viewGP {
		width: 300px;
	}
}

@media only screen and (max-width: 768px){
	.viewGP {
		display: none;
	}
	.viewGParcel #map {
		width: 700px;
	}
	#button-fullscreenMap {
		display: none;
	}
	.viewGED .fa-info-circle {
		display: initial;
	}
}

@media only screen and (max-width: 621px){
	.viewGParcel #map {
		width: 600px;
	}
}

@media only screen and (max-width: 498px){
	.viewGParcel #map {
		width: 500px;
		margin: auto;
	}
}

@media only screen and (max-width: 425px){
	.viewGED {
		flex-direction: column;
	}
}

@media only screen and (max-width: 375px){
	.viewGParcel #map {
		width: 100vx;
	}
}






/* ------------------------------------------------------------------------------------ */