html {
    height: 100%;
    font-size: 1em;
	font-family: verdana, Helvetica, sans-serif;
}

body {
  background-color: whitesmoke;
  height: 100%;
  margin:0.5em;
}

h1 {
	margin: 0.4em 0 ;
}

h2 {
	margin: 0.1em 0 ;
}

#footer {
	background-color: #333;
	padding: 0.5em;
	color: white;
	display:flex;
	justify-content: space-around;
	align-items:  center;
    margin: 1em 0 2em 0;
}

#footer a {
	color:white;
}

.footerMsg{
max-width:25%;
}
    
    

.genFlexContainer,
.genFlexContainerNowrap
{
    display: flex;
    flex-wrap: nowrap;
}


.genFlexContainerWrap
{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}


.home-colContainer {
  /*border: 0.1em solid black;*/
  padding: 0.3em;
}

.flexContainer {
	/*border-radius: 1em;*/
  border: 0.1em solid black;
  padding: 0.3em;
  flex-direction: row;
  display: flex;
  flex-wrap: nowrap;
  /*justify-content: space-evenly;*/
}

.genFlexContainerNowrap div[class^="home-col-"]
{
	width: 50%;
	margin: 0 0.3em 0 0;
}

.genFlexContainerNowrap div[class^="home-col-"] > h1
{
	text-align:center;
}

.flexSpaceBetween{
    justify-content: space-between;
}

.flexWrap
{
	flex-wrap: wrap;
}

.center-txt
{
	text-align:center;
}

.italic
{
	font-style: italic;
}

.red
{
	color:red;
}

.required
{
	border: solid red 0.1em;
	padding: 0.5em;
}
.inline-block
{
	display:inline-block;
}

.flexSpaceAround
{
	justify-content	: space-around;
	max-width: 520px;
}

.flexSpaceBetween
{
	justify-content:space-between;
	
}

.topimg {
	background-image: url("/img/karst2.jpg");
    margin: 0 0 0.1em 0;
    text-align: center;
	font-size: 3em;
	color: white;
	font-weight: bolder;
}

#alert-bar {
	position: absolute;
	top: 0;
	background: #d98787;
	border-radius: 0.5em;
	left: 0.5em;
	right: 0.5em;
	overflow: scroll;
	overflow-x: hidden;
	height: 3.5em;
	padding: 0.5em;
    display: none;
}

#alert-bar-close {
    background: #ac0202;
    color: white;
    right: 0;
    top: 0em;
    position: absolute;
    margin: 0.2em;
}

.userPageContent
{
	padding: 0.5em 0em;
	min-height: 70%;

	
}

#login-login-form {
	text-align: center;
	margin : auto;
}

#login-login-form > input {
    padding: 0.3em;
    font-size: 1em;
    margin: 0 0 0.5em 0;
}

#login-login-form > label {
    display: inline-block;
    margin: 0 0 0.3em 0;
}

.topmenu > .rigthy 	
{
	float:right;
}

.login::before
{
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: "\f007";
	
}


.topmenu {
  overflow: hidden;
  background-color: #333;
  padding: 0.2em 0.5em;
}

.topmenu a {
  float: left;
  /*font-size: em;*/
  color: white;
  text-align: center;
  padding: 0.5em 0.5em;
  text-decoration: none;
}

.dbStat 
{
  font-size: 1em;  
  background-color: #333;
  padding: 0.2em;
  margin-top: 0.4em;
  border-radius: 1em 1em 0.5em 0.5em;
}

.dbStat > span
{
	
	padding: 0.5em 0.5em;
	color: white;
}

.dropdown {
  float: left;
  overflow: hidden;
}

.dropdown .dropbtn {
  font-size: 1.4em;  
  border: none;
  outline: none;
  color: white;
  padding:  0.5em  0.5em;
  background-color: inherit;
  font-family: inherit;
  margin: 0;
}

.topmenu a:hover, .dropdown:hover .dropbtn {
  background-color: red;
}

.dropdown-content {
  font-size: 1.4em;  
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 0.5em;
  box-shadow: 0px  0.5em 0.7em 0px rgba(0,0,0,0.2);
  z-index: 1;
}

.dropdown-content a {
  float: none;
  color: black;
  padding:  0.5em  0.5em;
  text-decoration: none;
  display: block;
  text-align: left;
}

.dropdown-content a:hover {
  background-color: #ddd;
}

.dropdown:hover .dropdown-content {
  display: block;
}

#connectBtn:hover {
	cursor:pointer;
}

.home_newsblock,
.home-recentChg
{
	border-radius: 1em;
	background-color: #e1e1e1;
	/*999 -> ccc -> fff */
	padding : 0.5em 0.3em 0.3em 0.5em;
	margin: 0 0 0.3em 0;
	color :#000000;
}

.home_newsblock {
  padding: 0.3em;
}

.home-recentChg:hover
{
	background-color:#999999;
}

.home_newsblock h2,
.home-recentChg h2
{
	margin: 0;
}

.newsSubTitle, .newsFooter	 {
	font-size: 0.7em;
	font-style:italic;
	padding : 0.3em;

}

.newsContent,
home-caveChgtContent {
	font-size:1em;
	padding : 0 0 0 1em;

}

.changelog {
  margin: 0.3em 3em;	
}

.changelogItem
{
	margin:0.2em;
}

.changelogItem:hover
{
	color:red;
}

.searchColLocalName
{
	vertical-align:bottom;
}

.search-btnDoSearch
{
    margin : 0.5em;
}

#search-gpx-download
{
	font-size: 1em;
	font-style: bold;
	font-weight: bolder;
	color: #454545;
	background: #E6E6E6;
}

/* input in seach page*/
input[name^="value_"] {
    margin: 0 0 0 0.5em;
}

.displayItem
{
	display:block;
	font-style:italic;
	font-weight: bold;
}

.displayItemValue
{
	margin: 0.1em 0.5em;
    max-width: 30em;
}

.displayItemValue:hover
{
	background:silver;
}

#displayCaveAccess
{
	width:100%;
	margin : 0.5em;
	display: flex;
}

#displayOpenMap {
	display:block;
	margin: 0.2em;
	text-align:center;
	background-color: #333;
	color:white;
	padding: 0.7em 0.3em;
}


.displayCaveAccessImg
{
	max-width: 40%;
	/*min-width: 20em; */
	float:left;
	margin: 0 1em 0 0 ;
}

.sketchAccessTxt
{
	max-width: 55%;
}

.displaySketchAccessImg
{
	display: block;
	margin: auto;
	max-width: 380px;
}

.displayShortDescription > p
{
	margin : 0.5em;
}

.displayCaveMaps
{
	border: 0.1em solid black;
	padding: 0.3em;
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.displayCaveMapsImg
{
	max-width: 425px;
	max-height: 240px;
}

.displayCaveMap
{
	margin: 1em;
}
.displaySciData, .displayChangeLog
{
	display:flex;
	flex-direction: row;
	flex-wrap: nowrap;
	border: 0.1em solid black;
	padding: 0.3em;
}

div [class|="displaySciDataCol"] > ul > li
{
	margin: 0.45em;
}

div [class|="displaySciDataCol"]
{
	width:50%;
	margin:0.5em;
}

/* no more used
#displayActionMenu
{
	margin : 0 1em 0 ;
}
*/

#returnToList
{
    margin: 0 0 0 0.5em;
    padding: 0.1em;
}

#returnToList > i
{
	color:black;
}

#returnToList:hover,
.displayTitleWrapper > span:hover
{
    color:white;
    background:grey;
}

#display-dummynext:hover
{
	/*Prevent hover background*/
	background:none;
}

#returnToList:visited,
#display-adminBar > a:visited,
#display-adminBar > a 
{
	color:black;
	text-decoration: none;
}


#display-adminBar
{
	margin: 0 0.5em 0 0.2em;
	padding: 0.1em;	
}

#display-noaccess {
    margin: 0.3em;
    text-align: center;
    color: red;
    font-size: 1.5em;
}

.displayTitleWrapper > span
{
	margin: 0 0.5em 0;
	padding: 0.1em;	
	border-radius: 0.7em;
}

#tableSearch tr td {
    height: 2.1em;
}


#tableSearch
{
    width: 100% !Important;
}

#resultTableDiv
{
    margin:1em;
}


.searchStatFooter
{
	text-align: right;
}

.showCaveDetails
{
	margin: 1.5em 0 1.5em;
	
}


#miniMap{
    /*width:95%;*/
	height:250px;
}

.quickSearch
{
	float:right;
	transform: translateY(50%);
}

.quickSearch > .quickSearchBtn
{
	padding: 0.3em;
	margin: 0 0.5em 0 0.5em;
	border-radius: 0.5em;
	
}

#quickSearchInput
{
	width: 18em;
    border-radius: 0.5em;
    padding: 0.3em 0.5em;

}

div[class^="search-flexCol"] > div 
{
    margin: 0.4em;
}

.displayPhotos
{
	border: 0.1em solid black;
	padding: 0.3em;
	align-items: center;
}

.cavePhoto
{
    margin: 1em;
}

.displayCavePhotos
{
	max-width: 425px;
	max-height: 240px;
}

/*
.flexItem
{
	flex: 1 0 45%;
	margin: 0.2em;
}
*/

.editDisplayName-Title
{
	display: inline-block;
	width: 20em;
}

input[class^="editDisplayName"],
.edit-changelog-input-text
{
	display: inline-block;
	width: 25em;
    padding: 0.3em;

}

textarea[class^="editDisplayName-textArea"]
{
	display: inline-block;
	width: 40em;
	height: 25em;
    padding: 0.5em;
    border: solid grey 0.2em;

}
.editCoords
{
	margin:0.5em 0 0.5em 1.5em;
}

#addDelCoords
{
   margin: 0 0 0 5	;	
}

select[name="coordDisplayProj"]
{
	margin:0 0 0 1em;
}

.documentItem
{
	margin:0.1em 1em;
}

.documentList div:nth-child(odd)
{
	background-color:grey;
}

.documentList div:nth-child(even)
{
	background-color:silver;
}

.edit-sketchMini, .edit-CaveMini
{
	max-width: 90px;
	padding: 0 0 0.8em 0;
}

.edit-fileentry{
    margin:0.7em 0.7em 0.1em 0.7em;
}

.sketchItem
{
	margin: 1em;
}

div[class^="edit-MapItem"]
{
	margin: 0.7em 0.3em 0.7em 1em;
}

div[class^="edit-MapItem"]:hover
{
	background-color: grey;
}

.evenOdd:nth-child(even)
{
	background-color:silver;
}

	
.evenOdd:nth-child(odd)
{
	background-color:grey;
}

span[id^="edit-addItem"]
{
	display:block;
	margin: 0.5em;
	
}

span[id^="edit-addItem"] > i
{
	padding: 0.5em;
}

span[id^="edit-addItem"] > i:hover
{
	background-color: grey;
}

span[class="edit-file-delete"],
span[id^="edit-delCoordSet"],
.edit-add-changelog,
.edit-trash-changelog,
.addnewcave-btn,
.spacearound-s
{
	padding: 0.3em 1em 0.3em 1em;
	
}

span[class="edit-file-delete"]:hover,
span[id^="edit-delCoordSet"]:hover,
.edit-add-changelog:hover,
.edit-trash-changelog:hover,
.backgrndcolor-hover:hover
{
	background-color: grey;
}

i[id^="edit-rot"] 
{
	padding:0.5em;
}


i[id^="edit-rot"]:hover
{
	background-color: grey;
}

div[id^="edit-imgEl"] 
{
	margin:1em 0 0 0.5em;
	vertical-align: bottom;
}

.edit-flexItem
{
	flex: 1 0 45%;
	margin: 0.2em;
}

#edit-mapsList
{
	display: flex;
    align-items: flex-end;
}

.edit-addItem
{
	margin:0.5em 0 0.5em 1.5em;
}


.edit-changelogInputText
{
  width:25em;	

}
.editDisplayName-Title
{
	margin: 0.5em 0 0.2em 0;
}

.changeloginput
{
	margin:0.5em;
}

.edit-changelog-input-text
{
	width:25em;

}

.edit-changelog-input-cbx
{
	margin-left:1.5em;
}

.edit-add-changelog
{
	margin-left: 2em;
}

.edit-flexItem input:hover, 
.edit-flexItem textarea:hover {
    border: red solid;
}

.edit-flexItem input[type='checkbox']:hover {
    outline: 2px red solid;
}

/* Absolute Center Spinner */
.loadingSpiner {
  position: fixed;
  z-index: 999;
  height: 2em;
  width: 2em;
  overflow: visible;
  margin: auto;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  display:none;
}

/* Transparent Overlay */
.loadingSpiner:before {
  content: '';
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,0);
}

#newcave-newcavename
{
	width:27em;
	margin:1em;
	
}

.newcave-savebtn
{
	margin: 1.5em;	
}

#copycave
{
	width: 25em;
	
}

.copycave-src-cavename
{
	margin : 0.5em;
	
}
#copycave-input-new-name
{
	margin:0.5em;

}
 
#copyCaveBtn
{
	margin: 0 0 0 1em;
}
 
#copycave-input-new-name > input
{
	width: 25em;
	 
}
 
.siteconfig-row  .siteconfig-input-short
{
	width: 10em;
}
 
.siteconfig-row  .siteconfig-input-mid
{
	width: 30em;
}
 
.siteconfig-row  .siteconfig-input-long
{
	width: 75em;
}
 
.siteconfig-csstooltip {
    position: relative;
    display: inline-block;
    border-bottom: 0.1em dotted black;
    width: 20em;
}

.siteconfig-textarea{
    width: 35em;
    height: 10em;
    vertical-align: middle;
}

.siteconfig-csstooltip .siteconfig-csstooltiptxt
{
  visibility: hidden;
  width: 25em;;
  bottom: 1.5em;
  left: auto; 
  background-color: grey;
  color: #fff;
  text-align: center;
  border-radius: 0.5em;
  padding: 0.5em  0;
  font-size:0.8em;

  /* Position the tooltip */
  position: absolute;
  margin: 0 0 0 2em;
  z-index: 1;
}

.siteconfig-csstooltip:hover .siteconfig-csstooltiptxt
{
  visibility: visible;
}

.siteconfig-row
{
	margin : 0.75em 0.75em 2em 1.5em
	
}

#siteconfig-modeswitch
{
	margin: 0 2em 0 0;
	padding : 0.5em;
	float : right;
	border-radius: 0.5em;
	background-color: silver;
}

#siteconfig-eula-save, #siteconfig-EULA-wrapper
{
	margin: 0.5em;
}

#siteconfig-EULA-wrapper >  p
{
	background-color: aliceblue;
}

#usermgmt-userEditPage
{
	display:none;
}

#usermgmt-dialogFormUser > fieldset input[name="password"]
{
	width: 55%	
}

#usermgmt-dialogFormUser > fieldset input[id="changepwd"]
{
	width: 5%
}


#usermgmt-dialogFormUser > fieldset input[id="disabled"]
{
	width: 1em;
    display: block;
}

.usermgmt-showguid
{
    margin: 0.5em 0.5em 0.7em 1em;
}

#usermgmt-dialogFormUser > fieldset input,
#usermgmt-dialogFormUser > fieldset select,
#usermgmt-dialogFormUser > fieldset textarea,
#usermgmt-dialogFormAddUser > fieldset input,
#usermgmt-dialogFormGroup > fieldset input,
#usermgmt-dialogFormAddGroup > fieldset input,
#ressources-uploadform > input, #ressources-uploadform > textarea,
#fieldssettings-addNewField > input, #fieldssettings-addNewField > select  
{
    margin: 0.2em 0.7em 0.5em 0.7em;
	width: 95%;
	padding: 0.5em;
	display: inline-block;
	border: 1px solid #ccc;
	border-radius: 4px;
	box-sizing: border-box;
}


#usermgmt-container-addUser
{
	margin:0.5em;
}

#usermgmt-container-addGroup
{
	margin:0.5em;
}

.smallLeft
{
	/*top:0.5em;*/
	right:-4.5em;
}
.zzzzz
{
	border-radius:0.2em;
}

#usermgmt-addGroup
{
	height: 1em;
}

#newsmgmt-addnews,
#usermgmt-addUser,
#usermgmt-addGroup
{
	/*margin:0.3em 0 0.3em 0.5em;*/
	padding: 0.2em;
	border-radius:0.2em;
}

#newsmgmt-addnews:hover,
#usermgmt-addUser:hover,
#usermgmt-addGroup:hover,
.hoverGrey:hover
{
	background-color: grey;
}

.usermgmt-delete-container
{
	display:flex;
	align-items: center;
	justify-content: center;
}


.usermgmt-delete-container > span
{
	/*margin:0.3em 0 0.3em 0.5em;*/
	padding: 0.2em;
	border-radius:0.2em;
}

.usermgmt-delete-container > span:hover
{
	background-color: grey;
}

#usermgmt-container-import > form > fieldset > div
{
    margin: 0.7em;
}

.ressources-displayGroup-title
{
	margin: 1em 0 0 1em;
	
	
}

.ressources-displayGroup
{
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	margin: 0 0 0 1.5em;
	
}

.ressources-fileitem
{
	background-color:#e1e1e1;
	margin:0.3em;
	flex-basis: 20em;
}

.ressources-fileitem:hover
{
	background-color:grey;
}

div[id^="ressources-filelink"]
{
	margin: 0.5em;
	text-align: center;
}

.ressources-item
{
	margin:0.5em;
}

.ressources-filegroup
{
	margin:0.5em;
	max-width: 25em;
}

.ressources-deletefile:hover
{
	background-color:grey;
}

.ressources-deletefile
{
	padding:0.3em;
}

#ressources-uploadform
{
	display:none;
	max-width: 30em;
}

#ressources-savefile
{
	max-width:max-content;
}

#ressources-upload,
#ressources-genGpx-container,
#available-ressources
{
	margin: 0 0 1.5em 1.5em;
}

#stats-table-container
{
	width: 40%;
}

.display-gpxicon
{
	background-color: rgba(255, 255, 255, 0.8);
	font-weight: bold;
	color: black;
}


.display-gpx-dwnld:hover,
.display-pdf-dwnld:hover,
.display-files-dwnld:hover,
.display-send-msg:hover,
.display-set-favorite:hover,
#display-adminBar > a:hover
{
	cursor:pointer;
	background-color:grey;
}

.display-gpx-dwnld,
.display-pdf-dwnld,
.display-files-dwnld,
.display-set-favorite,
.display-send-msg,
#display-adminBar > a
{
	margin: 0 0.2em 0 0.2em;
	padding: 0 0.2em ;
}

#newsmgmt-form-title
{
	width: 95%;
	border: none;
	background:#f7f7f7;
	padding: 1em;
}

#newsmgmt-form-content
{
	width:90%;
	height: 20em;
}


.newsmgmt-fieldset-delundel
{
	width:40%;
}

.newsmgmt-container-addnews
{
	margin:0.5em;
}


.display-emailform-field > label
{
	width:auto;
	display:block;
	margin :0.5em 0 0.2em 0;

}
.display-emailform-field > input
{
	width:95%;
	padding-right : 1.5em;
}

.display-emailform-field > textarea
{
		height:12em;
		width:99%
}

#mail-usermail
{
	width: 96%;
}
#mail-subject
{
	width: 92%;
}

#display-email-inputwrapper:before,
#display-email-inputwrapper:after{
  position:absolute;
  right:1.5em;
  font-family: 'Font Awesome\ 5 Free';
  z-index:1;
  display:none;
}

#display-email-inputwrapper:before{
   content:'\f058';
   color: green;
   font-size:2em;
   font-size: 1.7em;
 }

#display-email-inputwrapper:after{
   content:'\f057';
   color: red;
   font-size: 1.7em;
}

.valid-email:before{
  display:inline !important;
}

.invalid-email:after{
  display:inline !important;
}

#contact-contactform
{
	width:65%;
	margin:auto;
}

#contact-sendmail
{
	margin: 0.5em auto 0.5em 50%;
}

#contact-fileserror
{
    margin: 0.5em;
    width: 50%;
    margin-left: auto;
    margin-right: auto;
    padding: 0.2em;
    
}

#contact-fileserror > div
{
    border: red solid 0.1em;
}

.invalidCaptcha
{
    border: red solid 0.1em;
}

#login-doLogin
{
    margin: 0.5em;
    font-size: 1em;
}

#fieldssettings_table{
    display: flex;
    flex-wrap: wrap;
    margin: 1em ;
    padding: 0;
    width: 75%;
}

.fieldssettings_tableCell{
    box-sizing: border-box;
    flex-grow: 1;
    width: 12%;  /* 7 col max */
    padding: 0.4em;
    overflow: hidden; /*Or flex might break */
    list-style: none;
    border: 1px solid white;
    background: darkgray;
}

.fieldssettings_tableCell > input[type=checkbox]{
    transform: scale(1.5);
    margin-left: 50%;
}

#fieldssettings-addNewField,
#fieldssettings-orderandshow
{
   max-width:25em;
   margin: 1em;
}

#fieldssettings-addNewField > input,
#fieldssettings-addNewField > select,
#fieldssettings-addNewField > label {
    margin: 0.5em;
}

#fieldssettings-addNewField > input,
#fieldssettings-addNewField > select, 
#fieldssettings-addNewField > p > button {
    margin-left: 1em;
    font-size:1em;
}

/*center button*/
#fieldssettings-addNewField > p{
    margin: 0.5em auto 2em auto; 
    width: 1em;
    font-size:1em;
}

/* disable vertical align*/
#fieldType{
    display:inline;
    margin-left: 1em;
}

#fieldType > input{
    margin-left: 1.5em;
}


#home-legalNotice {
    background-color: lightgrey;
    border-radius: 1em;
    padding: 0.5em;
}

#home-legalNotice > p {
    width: 75%;
    text-align: center;
    margin: auto;
    font-style: italic;
    font-weight: bold;
}

#resetpassword-username{
    margin: 0.5em;
    padding: 0.3em;
}

#resetpassword-wrapform{
    margin: auto;
    width: 50%;
}

#resetpassword-doreset{
    font-size:1em;
}

#myaccount_personal_data,
#chgtPasswd,
#themeChange,
#geo_api,
#datatablesMaxItems
{
    max-width: 45%;
    margin: 0.7em;
    font-size: 1em;
    padding: 0.2em;
}

#account_info
{
	padding : 0 0 0 1.5em;
}

#myaccount_table_fav_caves_wrapper
{
	max-width: 45%;
}

.myaccount-del-fav
{
	/*margin:0.3em 0 0.3em 0.5em;*/
	padding: 0.3em;
	border-radius:0.2em;
}

.myaccount-del-fav:hover
{
	background-color: grey;
}

#myaccount_personal_data > fieldset > input,
#chgtPasswd  > fieldset > input,
#chgtPasswd  > fieldset > p > input
{
    display: block;
    font-size: 1em;
    margin: 0.1em 0.5em 0.5em 0;
    width: 30em;
    padding: 0.2em;
}

#myaccount_personal_data > fieldset > p > input,
#chgtPasswd  > fieldset > p > input
{
    width:5em;
}

.ressources-input-right {
	display: inline-block;
	margin: 0.2em;
	background: darkgrey;
	border-radius: 1em;
	padding: 0.1em 0.4em;
	/* color: white; */
}

#ressources-ressource-rights > fieldset
{
    margin:0.5em;
}

.round-box-red{
	height: 2em;
	width: 2em;
	background-color: red;
	border-radius: 50%;
	display: inline-block;
}

.round-box-green{
	height: 2em;
	width: 2em;
	background-color: green;
	border-radius: 50%;
	display: inline-block;
}

div [id^="olconfigplugins-plg"] {
	padding: 0.3em;
	margin: 0.7em;
}

#usermgmt-dialogFormUser fieldset  input[type="checkbox"] {
	max-width: 30%;
}

#about_edit_content, #about_page_content{
	margin: 1em 1em 1em 2em;
	max-width: 75%;
}

#about_contenthtml{
	height: 500px;
}