/* CSS Document */

body{
	overflow: hidden;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 14px;
	color: white;
}

#container{
	position: absolute; left: 10%; top: 0%; width: 80%; height: 100%; 
	background: url('../img/texture.png') repeat;
	overflow-y: scroll;
	overflow-x: hidden;
	z-index: 1;
}

#next_func_container{
	position: absolute;	z-index: 8; right: 0; width: 10%; top: 70%; height: 500px; vertical-align: top;
}

#next_func{
	height: 50px; width: 50px;
}

#prev_func_container{
	position: absolute;	z-index: 8; left: 0; width: 10%; top: 70%; height: 500px; vertical-align: top;
}

#prev_func{
	height: 50px; width: 50px;
}

#header{
	height: 60%;
	opacity: 0.95;
	background: rgba(48,48,48,1);
	border-bottom: 2px solid black;
	color: white;
}

#caption1{
	position: absolute; left: 5%; top: 5%; right: 5%; min-height: 150px;
	padding: 20px;
	color: white;
	border: 1px solid black; /* border-radius: 15px; */
	background: rgba(48,48,48,0.5);
}

#caption1 h1{
	font-family: Georgia;
	font-weight: normal;
	font-size: 20px;
	color: #ffffcc;
}

#caption2{
	position: absolute; left: 0%; top: 50%; width: 100%; height: 5%;
	border-top: 1px solid black; border-bottom: 1px solid black;
	background: rgba(48,48,48,0.5);
	display: none;
}

#footer{
	position: absolute; left: 11%; bottom: 1%; width: 78%;
	opacity: 0.9;
	color: white;
	z-index: 2;
}

#left{
	background: #232323 url('../img/left.jpg') no-repeat center top; background-size: cover;
	position: absolute; left: 0; top: 0; width: 10%; height: 100%;
	border-right: 1px solid black;
	box-sizing:border-box;
}

#logo{
	position: absolute; left: 5%; top: 5%; width: 90%;
	cursor: pointer;
}

#right{
	background: #232323 url('../img/right.jpg') no-repeat center top; background-size: cover;
	position: absolute; right: 0; top: 0; width: 10%; height: 100%;
	border-left: 1px solid black;
	box-sizing:border-box;
}

#content{
	min-height: 200%;
}

a:link {color: #FFF; /*text-decoration: none;*/}
a:visited {color: #fcfcfc; /*text-decoration: none;*/}
a:hover {color: #CCC; /*text-decoration: none;*/}
a:active {color: #FFF; /*text-decoration: none;*/}
a:focus{outline:0; /*removes the dotted border*/}
h2:hover {color: #CCC;}

input{
	width: 35px;
}

select{
	width: 80px;
}

h1{
	display: inline-block;
	text-align: left;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 1.5em;
	color: #e6e6e6;
}

h2{
	text-align: left;
	font-size: 1.2em;	
}

#login{
	position: fixed; left: 0; top: 0; width: 100%; height: 100%;
	background-color: black;
	opacity: 0.9;
	z-index: 5;
}

#login_container{
	background: lightgrey; 
	color: black; 
	border: 1px solid white; 
	border-radius: 15px; 
	padding: 50px; 
	position: absolute; 
	top: 50%; left: 50%; width: 300px; height: 150px; margin-left: -150px; margin-top: -75px; font-size: 16px;
}

#form_edit_account input{
	width: 300px;
}

#fac{
	display:none;
	height: 25px;
	float: right;
}

.post{
	margin-left: 15%; margin-right: 15%; margin-bottom: 2%; border: 1px solid black; 
/* 	border-radius: 10px; */
	padding-left: 30px; padding-right: 30px; 
	font-size: 1em;
	background: rgba(48,48,48,0.5);
	color: #e6e6e6; text-align: justify;
	display: none;
}

.close-icon
{
  display:block;
  box-sizing:border-box;
  cursor:pointer;
  width:20px;
  height:20px;
  border-width:3px;
  border-style: solid;
  border-color:lightgrey;
  border-radius:100%;
  background: -webkit-linear-gradient(-45deg, transparent 0%, transparent 46%, grey 46%,  grey 56%,transparent 56%, transparent 100%), -webkit-linear-gradient(45deg, transparent 0%, transparent 46%, grey 46%,  grey 56%,transparent 56%, transparent 100%);
  background-color:lightgrey;
  box-shadow:0px 0px 5px 2px rgba(0,0,0,0.5);
  transition: all 0.3s ease;
}

.bubble{
	display: block;
	margin-left: 10%; margin-right: 10%; margin-bottom: 2%; border: 1px solid black; 
/* 	border-radius: 10px; */
	padding-left: 30px; padding-right: 30px; padding-bottom: 10px;
	font-size: 1em;
	background: rgba(48,48,48,0.5);
	color: #e6e6e6; text-align: justify;
}

.link{
	height: 50px; width: 50%; background: black; border: 1px solid black; /* border-radius: 5px; */ opacity: 0.6; text-align:center;
}

#help{
	background-color: white;
}

.bubblelink{
	display: block;
	margin-left: 15%; margin-right: 15%; margin-bottom: 2%; border: 1px solid black; 
/* 	border-radius: 10px; */
	padding-left: 30px; padding-right: 30px; 
	background: rgba(48,48,48,0.5);
	color: #e6e6e6; text-align: justify;
}

li{
	text-align: left;
}

.bubblelink:hover{
    opacity: 0.8;
}

.software_slides{
	width: 100%;
	overflow-x: hidden;
	white-space: nowrap;
}

.preview{
	opacity: 0.7;
	max-width:7rem; 
	max-height: 7rem;
/* 	-webkit-border-radius:5px; -moz-border-radius:5px; -ms-border-radius:5px; -o-border-radius:5px; border-radius:5px; */
	margin-left: 10px; margin-bottom: 10px; margin-top: 10px;
	border: 1px solid black;
}

.preview:hover{
	opacity: 0.9;
}

.clear {
    clear:both;
    line-height:0;
}

.ui-tooltip
{
    font-size:0.9em;
    max-width: 400px;
}

#form_edit_db{
	overflow: auto;
}

#form_edit_db .jqte{
	margin: 0;
	min-height: 100px;
	width: 302px;
	border-radius: 0px;
	border: 1px solid grey;
}