page_style.css

/*##########========== World Map ==========##########*/
#map {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  overflow: hidden;
  padding: 0;
}




.leaflet-popup-content {
  width: 1500px;
  /*z-index: 1500;*/
  /*opacity: 0.50;*/
}





/*##########========== Location target text input ==========##########*/
#target {
	border: none;
	box-shadow: 0pt 0pt 6pt 0px rgba(61,59,61,0.48);"
}

/*#####===== Clear location target =====#####*/
#clear_location_text {
	color: #C3C3C3;
	background-color: transparent;
	padding-top: 6px;
	box-shadow: none!important;
    outline: 0;
    border-width: 0px;
}

#clear_location_text:hover {
	color: #999999;
    transition-delay: 0;
}


/*#####===== Zoom to location =====#####*/
#zoom_to_location {
	color: #C3C3C3;
	background-color: transparent;
	padding-top: 6px;
	box-shadow: none!important;
    outline: 0;
    border-width: 0px;
}

#zoom_to_location:hover {
	color: #999999;
    transition-delay: 0;
}




/*##########========== Initial panel ==========##########*/
#initial_panel {
	background-color: white;
  	opacity: 0.85;
  	padding: 20px 20px 20px 20px;
  	margin: auto;
  	border-radius: 5pt;
  	box-shadow: 0pt 0pt 6pt 0px rgba(61,59,61,0.48);
    padding-bottom: 2mm;
    padding-top: 1mm;
}

#close_initial_panel {
	box-shadow: none!important;
    outline: 0;
    color: #C3C3C3;
    transition: color 100ms 100ms;
    border-width: 0px;
}

#close_initial_panel:hover {
	color: #999999;
    transition-delay: 0;
}









/*##########========== Placeholder colours ==========##########*/
#target::placeholder {
	color: #DEDEDE;
	transition: color 500ms 500ms;
}

#target::placeholder:active {
	color: white;
	transition-delay: 0;
}




::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #DEDEDE;
  opacity: 1; /* Firefox */
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: #DEDEDE;
}

::-ms-input-placeholder { /* Microsoft Edge */
  color: #DEDEDE;
}





/*##########========== Scroll bars ==========##########*/
::-webkit-scrollbar {
    width: 0px;
}






/*##########========== Controls panel ==========##########*/

.leaflet-control-layers{ 
	z-index: 1000;
	background-color: transparent;
	box-shadow: 0pt 0pt 0pt 0pt;
    width: 140px;
    padding-top: 171px;
}
.leaflet-touch .leaflet-control-layers {
  border: none;
}

#controls_panel_Data_text {
	padding: 0px 0px 0px 10px;	
}

/*###= Add your survey panel =###*/
#add_your_survey_panel {
	background-color: white;
  	padding: 20px 20px 20px 20px;
  	margin: auto;
  	border-radius: 5pt;
  	box-shadow: 0pt 0pt 6pt 0px rgba(61,59,61,0.48);
    padding-bottom: 2mm;
    padding-top: 1mm;
    z-index: 30000;
}

#add_your_survey2 {
	box-shadow: none!important;
    outline: 0;
	background-color: transparent;
	border-width: 0px;
	font-size: 12px;
}

#close_add_your_survey_division {
	box-shadow: none!important;
    outline: 0;
    color: #C3C3C3;
    transition: color 100ms 100ms;
}

#close_add_your_survey_division:hover {
    color: #999999;
    transition-delay: 0;
}

#close_add_your_survey_controls {
	box-shadow: none!important;
    outline: 0;
	background-color: transparent;
	color: #C3C3C3;
	border-width: 0px;
	font-size: 12px;
}

#close_add_your_survey_controls2 {
	box-shadow: none!important;
    outline: 0;
	background-color: transparent;
	color: #C3C3C3;
	border-width: 0px;
	font-size: 12px;
}

/*###= Filter data panel =###*/
#display_filterdata_panel {
	box-shadow: none!important;
    outline: 0;
	background-color: transparent;
	border-width: 0px;
	font-size: 12px;
}

#close_filterdata_panel_controls {
	box-shadow: none!important;
    outline: 0;
	color: #C3C3C3;
	background-color: transparent;
	border-width: 0px;
	font-size: 12px;
}

#filterdata_panel {
	background-color: white;
  	padding: 20px 20px 20px 20px;
  	margin: auto;
  	border-radius: 5pt;
  	box-shadow: 0pt 0pt 6pt 0px rgba(61,59,61,0.48);
    padding-bottom: 2mm;
    padding-top: 1mm;
    z-index: 10000;
    
    /*opacity: 0.6;
    transition: 0.3s;*/
}

#download_RESBANK_filtered {
	background-color: #BBE2B4;
	transition: 0.3s;
}

#download_RESBANK_filtered:hover {
	background-color: #89BE8B;
}

#display_filtered_data {
	background-color: #BBE2B4;
	transition: 0.3s;
}
#display_filtered_data:hover {
	background-color: #89BE8B;
}

#close_filterdata_panel {
	box-shadow: none!important;
    outline: 0;
    color: #C3C3C3;
    transition: color 100ms 100ms;
}

#close_filterdata_panel:hover {
    color: #999999;
    transition: 0.3s;
}

#show_filterdata_panel_inputs {
	box-shadow: none!important;
    outline: 0;
    color: #C3C3C3;
    transition: color 100ms 100ms;
}

#show_filterdata_panel_inputs:hover {
    color: #999999;
    transition: 0.3s;
}

#hide_filterdata_panel_inputs {
	box-shadow: none!important;
    outline: 0;
    color: #C3C3C3;
    transition: color 100ms 100ms;
}

#hide_filterdata_panel_inputs:hover {
    color: #999999;
    transition: 0.3s;
}

/*###= Country report panel =###*/
#display_Country_report_panel {
	box-shadow: none!important;
    outline: 0;
	background-color: transparent;
	border-width: 0px;
	font-size: 12px;
}

#close_country_report_panel_controls {
	box-shadow: none!important;
    outline: 0;
    color: #C3C3C3;
	background-color: transparent;
	border-width: 0px;
	font-size: 12px;
}

#download_Country_report_panel {
	background-color: white;
  	padding: 20px 20px 20px 20px;
  	margin: auto;
  	border-radius: 5pt;
  	box-shadow: 0pt 0pt 6pt 0px rgba(61,59,61,0.48);
    padding-bottom: 2mm;
    padding-top: 1mm;
    z-index: 10000;
}

#download_Country_report {
	background-color: #BBE2B4;
	transition: 0.3s;
}

#download_Country_report:hover {
	background-color: #89BE8B;
}

#download_Country_data {
	background-color: #BBE2B4;
	transition: 0.3s;
}

#download_Country_data:hover {
	background-color: #89BE8B;
}

#close_country_report_panel {
 	box-shadow: none!important;
    outline: 0;
    color: #C3C3C3;
    transition: color 100ms 100ms;
}

#close_country_report_panel:hover {
    color: #999999;
    transition: 0.3s;
}

/*###= Download RESBANK panel =###*/
#display_download_RESBANK_panel {
	box-shadow: none!important;
    outline: 0;
	background-color: transparent;
	border-width: 0px;
	font-size: 12px;
}

#close_download_RESBANK_panel {
	box-shadow: none!important;
    outline: 0;
    color: #C3C3C3;
    transition: color 100ms 100ms;
}

#close_download_RESBANK_panel:hover {
    color: #999999;
    transition: 0.3s;
}

#close_download_RESBANK_panel_controls {
	box-shadow: none!important;
    outline: 0;
	color: #C3C3C3;
	background-color: transparent;
	border-width: 0px;
	font-size: 12px;
}

#download_RESBANK_panel {
	background-color: white;
  	padding: 5px 5px 5px 5px;
  	margin: auto;
  	border-radius: 5pt;
  	border-width: 0px;
  	box-shadow: 0pt 0pt 6pt 0px rgba(61,59,61,0.48);
    padding-bottom: 2mm;
    padding-top: 1mm;
    z-index: 20000;
}

#download_RESBANK {
	background-color: #BBE2B4;
	transition: 0.3s;
}

#download_RESBANK:hover {
	background-color: #89BE8B;
}

/*###= Download P50 panel =###*/
#display_download_P50_panel {
	box-shadow: none!important;
    outline: 0;
	background-color: transparent;
	border-width: 0px;
	font-size: 12px;
}

#close_download_P50_panel {
	box-shadow: none!important;
    outline: 0;
    color: #C3C3C3;
    transition: color 100ms 100ms;
}

#close_download_P50_panel:hover {
    color: #999999;
    transition: 0.3s;
}

#close_download_P50_panel_controls {
	box-shadow: none!important;
    outline: 0;
	color: #C3C3C3;
	background-color: transparent;
	border-width: 0px;
	font-size: 12px;
}

#download_P50_panel {
	background-color: white;
  	padding: 5px 5px 5px 5px;
  	margin: auto;
  	border-radius: 5pt;
  	border-width: 0px;
  	box-shadow: 0pt 0pt 6pt 0px rgba(61,59,61,0.48);
    padding-bottom: 2mm;
    padding-top: 1mm;
    z-index: 20000;
}

#download_P50 {
	background-color: #BBE2B4;
	transition: 0.3s;
}

#download_P50:hover {
	background-color: #89BE8B;
}

/*###= Download buttons =###*/
#upload_resistancebank_template {
	box-shadow: none!important;
	outline: 0;
	background-color: transparent;
    border-width: 0px;
}

#display_summary_metrics_exposure {
	background-color: transparent;
	border-width: 0px;
	font-size: 12px;
}

/*###= About panel =###*/
#display_about_panel {
	box-shadow: none!important;
    outline: 0;
	background-color: transparent;
	border-width: 0px;
	font-size: 12px;
}

#close_about_panel_controls {
	box-shadow: none!important;
    outline: 0;
	color: #C3C3C3;
	background-color: transparent;
	border-width: 0px;
	font-size: 12px;
}

#about_panel {
	background-color: white;
  	padding: 5px 5px 5px 5px;
  	margin: auto;
  	border-radius: 5pt;
  	border-width: 0px;
  	box-shadow: 0pt 0pt 6pt 0px rgba(61,59,61,0.48);
    padding-bottom: 2mm;
    padding-top: 1mm;
    z-index: 20000;
}

#close_about_panel {
	box-shadow: none!important;
    outline: 0;
    color: #C3C3C3;
    transition: color 100ms 100ms;
}

#close_about_panel:hover {
    color: #999999;
    transition: 0.3s;
}

/*###= Limitations panel =###*/
#display_limitations_panel {
	box-shadow: none!important;
    outline: 0;
	background-color: transparent;
	border-width: 0px;
	font-size: 12px;
}

#close_limitations_panel_controls {
	box-shadow: none!important;
    outline: 0;
	color: #C3C3C3;
	background-color: transparent;
	border-width: 0px;
	font-size: 12px;
}

#limitations_panel {
	background-color: white;
  	padding: 5px 5px 5px 5px;
  	margin: auto;
  	border-radius: 5pt;
  	border-width: 0px;
  	box-shadow: 0pt 0pt 6pt 0px rgba(61,59,61,0.48);
    padding-bottom: 2mm;
    padding-top: 1mm;
    z-index: 20000;
}

#close_limitations_panel {
	box-shadow: none!important;
    outline: 0;
    color: #C3C3C3;
    transition: color 100ms 100ms;
}

#close_limitations_panel:hover {
    color: #999999;
    transition: 0.3s;
}

/*###= GitHub repository =###*/
#open_GitHub_repository {
	box-shadow: none!important;
    outline: 0;
	background-color: transparent;
	border-width: 0px;
	font-size: 12px;
}

/*###= Youtube tutorial =###*/
#open_Youtube_video {
	box-shadow: none!important;
    outline: 0;
	background-color: transparent;
	border-width: 0px;
	font-size: 12px;
}





/*##########========== Form ==========##########*/

#form_panel {
/*Appearence*/
	background-color: white;
  	padding: 20px 20px 20px 20px;
  	margin: auto;
  	border-radius: 5pt;
	box-shadow: 0pt 0pt 6pt 0px rgba(61,59,61,0.48);
    padding-bottom: 2mm;
    padding-top: 1mm;
    z-index: 40000;

/*Functions*/
	overflow-y: scroll;

/*Fonts*/
	font-size: 16px;
}

#close_form {
	box-shadow: none!important;
    outline: 0;
    color: #C3C3C3;
    transition: color 100ms 100ms;
	border-width: 0px;
}

#close_form:hover {
	color: #999999;
    transition: 0.3s;
}

.mandatory_star {
	color:red;
}


/*#####===== USER INFORMATION =====#####*/
#show_user_information_panel {
	border-width: 0px;
}

#hide_user_information_panel {
	border-width: 0px;
}

/*#####===== STUDY INFORMATION =====#####*/
#show_study_information_panel  {
	border-width: 0px;
}

#hide_study_information_panel {
	border-width: 0px;
}

/*#####===== AMR =====#####*/
#show_amr_panel  {
	border-width: 0px;
}

#hide_amr_panel {
	border-width: 0px;
}


#Chicken_ecoli_question_button {
	border-width: 0px;
}



/*#####===== COMMENTS =====#####*/
#show_comments_panel  {
	border-width: 0px;
}

#hide_comments_panel {
	border-width: 0px;
}

/*#####===== Submit button =====#####*/
#submit {
	background-color: #BBE2B4;
	transition: 0.3s;
}

#submit:hover {
	background-color: #89BE8B;
}