/* 
	Databases main pages style
	Author: Bozhidar Zakhariev Iliev
	© Bozho ©
	Table of Contents:
		layout
		typography
*/


/* layout
----------------------------------------------- */
*{
	margin: 0px;
	padding: 0px;
	margin-left: 0px;
	margin-right: 0px;
	}

body{
	background: #1A1A1A;
	color: #000;
	background-color: #D6D6D6;/*	word-wrap: break-word; */	/* IE */
	font-size: 15px;
	margin-left: auto;
	margin-right: auto;
	padding: 0 6px 0 6px;
/*	border: 10px red solid; */ /* for tests */
}
/* ###  Global CSS change variables and modifications  ### - BEGINNING */
body {
	max-width: 1300px; /* restrict body width on large displays */
	margin-left: auto; margin-right: auto; /* center body */
/*	border: 10px red solid; */ /* for testing */
}

/* ###  Global CSS change variables and modifications  ### - END */

/*   P0AGE FORMATING   */
.DELIMITER--------FORMATING {
}

.TableDataBorder {
	border-top-style: solid;
	border-right-style: dotted;
	border-bottom-style: solid;
	border-left-style: dotted;
	border-top-width: thin;
	border-right-width: thin;
	border-bottom-width: 2px;
	border-left-width: 1px;
}
#left-pannel-holder{
	position: fixed;
	top: 48px;
	left: 0px;
	visibility: visible;
	display: block;
	height: 93%; /* for browsers not supporting the calc90 function */
	height: calc(100% - 6px); /* when the slide bar to appear */
	overflow: visible;
}
@media(min-width: 1300px){ /*the BODY WIDTH width */
	#left-pannel-holder{
		left: 0px; /* for browsers not supporting the calc() function */
		left: calc(50% - 1300px / 2); /* subtract HALF of the BODY WIDTH width */
	}
}
@media(width: 1300px){
	#left-pannel-holde{
		left: 0px;
	}
}
@media(max-width: 1300px){
	#left-pannel-holder{
		left: 0px;
	}
}
#left-pannel-Slider{
	visibility: visible;
	display: block;
	width: 216px;
	height: 93%; /* for browsers not supporting the calc90 function */
	height: calc(100% - 46px); /* subtract the heith of the site top navigation ribbon */
	overflow: auto;
	position: absolute;
}

#sidebar{
	position:static;
	top: 56px;
	left:6px;
	width: 195px;
	border-top-width: 2px;
	border-right-width: 3px;
	border-bottom-width: 2px;
	border-left-width: 3px;
	border-top-style: dotted;
	border-right-style: groove;
	border-bottom-style: dotted;
	border-left-style: groove;
	border-top-color: #FFC66F;
	border-right-color: #FFC66F;
	border-bottom-color: #FFC66F;
	border-left-color: #FFC66F;
	background-color: #AAFDF9;
	overflow: auto;
	color: #000;
	z-index: 1;
	background-color: #ACBD48;
	margin-bottom: 10px; /*when the slider to appear */
	border-top-left-radius: 33px;
	border-top-right-radius: 33px;
	border-bottom-left-radius: 12px;
	border-bottom-right-radius: 12px;
}
* html div#sidebar  { top: 38px; left:20px;	width: 250px; position:absolute; }

#content{
	text-align: left;
	min-width: 420px;
	margin-top: 0px;
	margin-right: 3px;
	margin-bottom: 18px;
	margin-left: 216px;
	padding-left: 7px;
	padding-right: 7px;
	border-top-style: ridge;
	border-top-width: 10px;
	border-top-color: #6600CC;
	border-bottom-style: groove;
	border-bottom-width: 10px;
	border-bottom-color: #6600CC;
	border-right-style: groove;
	border-right-width: 10px;
	border-right-color: #A851FF;
	border-left-width: 10px;
	border-left-style: ridge;
	border-left-color: #A851FF;
	overflow: visible;
	position: relative;
	z-index: 5;
	border-radius:64px 64px 0px 0px;
}


/* typography
----------------------------------------------- */

.Content_Section_Title {
	color: black;
	font-size: 150%;
	font-weight: bold;
	text-align: center;
	width:90%;
	margin: 0 auto 4px auto;
	background-color: #FBEB93;
	border-left: black solid 4px;
	border-right: black solid 4px;
	border-bottom: red solid 4px;
	border-radius: 50%;
}

p {
	line-height: 1.5em;
	margin-bottom: 0em;
	font-size: 0.9em;
}

ol, ul{ margin: 0.5em 0 1.2em 2em; }	
ol, ul, dl { line-height: 1.5em; }
ol li{ margin-bottom: 0.2em; }
li{
	font-size: 0.9em;
	font-weight: bold;
}
li strong {
	color: #530000;
	font-size: 106%;
	font-weight: bold;
}


h1, h2, h3{ font-family: "Trebuchet MS",Verdana,Sans-Serif;}

h1 {
	font-size: 1.5em;
	color: #00F;
	line-height: 150%;
}

h2 {
	letter-spacing: 0.4pt;
	color: #000;
	font-weight: bold;
	}
h3 {
	font-size: 15px;
	color: #143D78;
	text-transform: uppercase;
	text-decoration: underline;
	}

pre{
	margin: 10px;
	padding: 8px;
	border-left: 1px solid #222;
	overflow: auto;
	font-size: 15px;
	font-family: Arial, Helvetica, sans-serif;
	max-width: 900px;
	background-color: #DCDC98;
	border-radius: 24px;
	}
.pre-table-replacement{
	margin: 10px;
	padding: 8px;
	border-left: 1px solid #222;
	overflow: auto;
	font-size: 15px;
	font-family: Arial, Helvetica, sans-serif;
	max-width: 900px;
	background-color: #DCDC98;
	text-align: left;
	border-radius: 24px;
	}

fieldset{
	background-color: #DCDC98;
	padding: 7px;
	overflow: auto;
	position: static;
	border-radius: 25px;
}

/* sidebar
----------------------------------------------- */
#sidebar a{
	color: #0000CC;
	}
#sidebar p a:hover{ border-bottom: 1px dotted #fff; }	

#sidebar h1 a{ font-weight: bold; }
#sidebar h1 a:hover{ color: inherit; }

#nav{
	list-style: none;
	width: 15em;
	left: 12px;
	top: 2px;
	margin-top: 0.5em;
	margin-right: 0;
	margin-bottom: 0.8em;
	margin-left: 7px;
}
#nav li{ padding: 0; margin: 0; }
#nav a{
	display: block;
	height: 2em;
	padding: 0.3em 0.2em 0.2em 0.8em;
	color: #eee;
	background-color: #310ACD;
	border-top-width: 0.5px;
	border-right-width: 0.5px;
	border-bottom-width: 0.5px;
	border-left-width: 0.5px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #FFBF80;
	border-right-color: #FCFEA5;
	border-bottom-color: #FF0000;
	border-left-color: #FCFEA5;
	}

#nav a:hover{
	color: #1a1a1a;
	background-color: #D0EB6A;
	}	

#nav a:active{
	color: #0F0;
	background-color: #000;
	}	
	
	
.nav-input {
	list-style: none;
	width: 180px;
	left: 12px;
	top: 2px;
	margin-top: 0px;
	margin-right: 0;
	margin-bottom: 2px;
	margin-left: 7px;
	text-align: left;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: bold;
	color: #310ACD;
	background-color: #FFF;
	text-decoration: underline;
	font-style: normal;
	border-top-width: 0.5px;
	border-right-width: 0.5px;
	border-bottom-width: 0.5px;
	border-left-width: 0.5px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #FFBF80;
	border-right-color: #FCFEA5;
	border-bottom-color: #FF0000;
	border-left-color: #FCFEA5;
	display: block;
	height: 18px;
	padding-bottom: 2px;
	border-radius: 12px 48px 48px 12px / 12px 12px 12px 12px;
}
.nav-input:hover {
	background-color: #310ACD;
	color: #FFF;
	cursor: pointer;
}
.nav-input:active {
	background-color: #000;
	color: #0F0;
}
.nav-input-current {
	list-style: none;
	width: 180px;
	left: 12px;
	top: 2px;
	margin-top: 0px;
	margin-right: 0;
	margin-bottom: 2px;
	margin-left: 7px;
	text-align: left;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: bold;
	color: #000;
	background-color: #FFFF28;
	text-decoration: underline;
	font-style: normal;
	border-top-width: 0.5px;
	border-right-width: 0.5px;
	border-bottom-width: 0.5px;
	border-left-width: 0.5px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #FFBF80;
	border-right-color: #FCFEA5;
	border-bottom-color: #FF0000;
	border-left-color: #FCFEA5;
	display: block;
	height: 18px;
	padding-bottom: 2px;
	border-radius: 12px 48px 48px 12px / 12px 12px 12px 12px;
}
.nav-input-current:hover {
	background-color: #310ACD;
	color: #FFF;
	cursor: pointer;
}
.nav-input-submenu {
	list-style: none;
	width: 180px;
	left: 12px;
	top: 2px;
	margin-top: 0px;
	margin-right: 0;
	margin-bottom: 2px;
	margin-left: 7px;
	text-align: left;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: bold;
	color: #310ACD;
	text-decoration: underline;
	font-style: normal;
	border-top-width: 0.5px;
	border-right-width: 0.5px;
	border-bottom-width: 0.5px;
	border-left-width: 0.5px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #FFBF80;
	border-right-color: #FCFEA5;
	border-bottom-color: #FF0000;
	border-left-color: #FCFEA5;
	display: block;
	height: 18px;
	padding-bottom: 2px;
	background-color: #E2D9B1;
	border-radius: 12px 48px 48px 12px / 12px 12px 12px 12px;
}
.nav-input-submenu:hover {
	color: #FFF;
	background-color: #310ACD;
}

input{
	}
input:hover{
	background-color: #FF9;
	}
input:focus{
	background-color: #E3FFFF;
	}
input-button:hover{
	background-color: #FF6;
	}	

select:focus{
	background-color: #E3FFFF;
	}

textarea{
	resize:both;
	overflow:auto;
}
textarea:focus{
	color: #000;
	background-color: #E3FFFF;
	}
/*textarea:hover{
	color: #000;
	background-color: #C8FFFF;
	padding: 0px;
	margin: -1px;
	}*/

.button-select-from-table {
	color: #000;
	font-weight: bold;
	background-color: #FFF;
	border: 2px solid #006;
	border-radius: 6px;
	padding: 0 4px;
	margin-bottom: 6px;
}
.button-select-from-table:hover {
	color: #FFF;
	background-color: #000;
	border: dotted 2px #33FF00;
	border-radius: 12px;
}
	
/* content
----------------------------------------------- */
#content ul{ margin-left: 4px;}
#content ul li{
	list-style: none;
	padding: 0 0 0 12px;
	}

/* misc
----------------------------------------------- */

.section{ border-top: 1px solid #3d3d33;  padding: 1.5em 0; }

.HiddenEverything {
	position:absolute;
	left:-10000px;
	top:auto;
	width:1px;
	height:1px;
	overflow:hidden;
	}	
.input-img-Button-Flags {
	width: 24px;
	height: 24px;
	border: 0;
	}	
.input-img-Button-Flags:hover {
	border: 0;
	background-color: #F0F;
	}	
.input-img-Button-Flags:active {
	border: 0;
	background-color: #000;
	}
.caption{ font-size: 0.9em; padding-top: 0.2em ;	}



/* clearing
----------------------------------------------- */

/*   P0AGE MISC   */
.DELIMITER--------MISC {}

.EVEntsData {
	background:white;
}
.EVEntsData:hover {
	background-color:#FF9;
	cursor: help;
}
#PauseScroller-style{
	width: 400px;
	height: 28px;
	border: 1px solid red;
	border-radius:12px;
	margin: 3px;
	background-color: #F1FFC4;
	color: #7D0000;
	font-size: 12px;
	font-style: italic;
	font-weight: bold;
	font-family: "Comic Sans MS", cursive;
	padding-left: 7px;
	padding-right: 7px;
	padding-top: 3px;
	padding-bottom: 12px;
	display: block;
	position: fixed;
	top: 0px;
	right: 0px;
}
.MoreInfo{
	color: black;
	font-size: 15px;
	font-weight: bold;
}