/*                                     Global                                  */
*{
	margin: 0;
	padding: 0;
	border: 0;
 	background-size:cover;
 	-webkit-background-size:cover;
 	-o-background-size:cover;
 	-moz-background-size:cover;
 	background-attachment:fixed;
}

html{
	width: 100%;
	height: 100%;
}

body{
	height: 100%;
	width: 100%;
    background-image: url('/media/images/wallpapers/birdhouse.png');
	background-image: url('./media/images/wallpapers/IMG_0574.JPG');
	background-image: url('./media/images/wallpapers/IMG_0131.JPG');
	font-family: Arial;
}

.h3{
	font-size: 18pt;
	margin-bottom: 10px;
}
/*******************************************************************************/

/*                                       MISC                                  */
.right{
	float: right;
	clear: right;
}

.left{
	float: left;
	clear: left;
}
.icon{
 	width:90px;
 	height:90px;
 	border:none;
}

.icon2 {
	height: 90px;
	border: none;
	margin: none;
	margin-left: -40px !important;
	margin-right: -40px !important;
	padding: none;
}

.cert{
    width:200px;
    height:90px;
    border:none;
}

.stat {
	font-size: 33pt;
}

.stat-value {
	font-size: 34pt;
}

.disclaimer {
	font-size: 5pt !important;
}

body a {
	color: darkgreen;
	text-decoration: none;
}

#logo {
	font-size: 26pt;
}
/*******************************************************************************/

/*                                       DIVS                                  */
div{
	position: relative;
}

.left-list{
	width: 65%;
}

.right-list{
	width: 35%;
}

#wrapper{
	width: 50%;
	min-height: 100%;
	background-color: black;
	left: 25%;
	opacity: .65;
	border-radius: 2%;
	overflow: hidden;
}

#banner,#links,#main,#footer{
	width: 100%;
}

#banner-inner,#links-inner,#main-inner{
	width: 60%;
	margin-left: 20%;
}

#banner{
	padding-top: 40px;
	padding-bottom: 40px;
	font-family: Consolas;
}

#links{
	height: 30px;
	margin-bottom: 20px;
}

#links-inner {
	border-top: 1px solid white;
	border-bottom: 1px solid white;
}

#main{
	min-height: 100%;
	color: white;
	font-size: 12pt;
}

#footer{
	text-align: center;
	font-size: 8pt;
	padding-top: 20px;
	color: white;
	padding-bottom: 20px;
	background-image: url('./media/images/wallpapers/black.png');
}

.grid-container {
    width : 100%;
    min-height: 100%;
    height: auto;
    display: grid;
    grid-template-columns: 20% 80%;
    grid-template-rows: auto;
    grid-template-areas: "s1 s2";
    grid-gap: 0;
    border: 2px solid white;
    overflow: hidden;
}

.grid-container2 {
    width : 100%;
    height: 200% !important;
    display: grid-block;
    grid-template-columns: auto-fill auto-fill;
    grid-template-rows: 70% 30%;
    grid-template-areas: "s1 s2"
                         "s3";
    grid-gap: 0;
    border: 2px solid black;
    overflow: hidden;
}

.grid-left {
    grid-area: s1;
    height: 100%;
    /*width : 16.5%;*/
    display: grid-block;
}

.grid-left2 {
    grid-area: s1;
    width : 16.5%;
    border : 2px solid white;
    display: inline-block;
    max-height: 200%;
    overflow: hidden;
}

.grid-right {
    /*float: right;*/
    grid-area: s2;
    /*height: 200%;*/
    display: grid-block;
    /*width: 83.1%;*/
    border: 2px solid white !important;
}
/*******************************************************************************/

/*                                       FORM                                  */
#feedback-form input{
	width: 100%;
	margin-bottom: 5px;
	height: 30px;
}

#feedback-form textarea{
	width: 100%;
	height:500px;
	margin-bottom: 5px;
}

#signin-form .label{
 	padding-top: 7.5px;
 	padding-bottom: 7.5px;
 	width: 15%;
 	float: left;
 	display: inline;
 	border: 1px solid black;
}
#signin-form input{
 	width: 80%;
 	margin-bottom: 10px;
 	display: inline;
 	border: 1px solid black;
}
#signin-form input[type=text]{
 	height: 35px;
}
#signin-form input[type=password]{
 	height: 35px;
}
div form input[type=submit]{
 	cursor: pointer;
}
#signin-form input[type=submit]{
 	height: 40px;
 	width: 80%;
 	margin-bottom: 0;
}
/*******************************************************************************/

/*                                       TABL                                  */
.plain-table {
    width : 100% !important;
    border-collapse : collapse !important;
    border-collapse: collapse;
    border : 2px solid white !important;
}

#basic-table {
    width: 100% !important;
    border-collapse: collapse !important;
    border: 2px solid white !important;
    overflow-y:scroll;
}

#basic-table th {
    border : 2px solid white !important;
    text-align : left !important;
}

#basic-table td {
    height : 30px;
    border: 2px solid white;
}


.plain-table td{
    height : 30px;
    border: 2px solid white;
}

.plain-table th{
    border : 2px solid white !important;
    text-align : left !important;
}
#link-buttons{
	width: 100%;
	height: 50px;
	border-collapse: collapse;
}

#link-buttons th{
	text-align: center;
	color: white;
	cursor: pointer;
}

#link-buttons th:hover{
	background-color: darkolivegreen;
}

.selected-page{
	background-color: darkolivegreen;
}

#content-table{
 	width:100%;
 	border-collapse:collapse;
}

.stat-table {
	width: 100%;
    border-collapse: collapse;
	color: white;
}

.stat-table th {
	text-align: left;
}

.stat-table td {
	text-align: right;
}

.emotions-table {
	width: 100%;
    border-collapse: collapse;
    color: white;
	min-height: 200px;
}

.emotions-table tr {
}

.emotions-table td {
    text-align: center;
	border: 2px solid white;
	vertical-align: top;
	width: 20%;
}

.emotions-table td img {
	width: 150px;
	height: 150px;
}

#content-table th,#content-table td{
 	text-align:left;
 	vertical-align:top;
 	border:2px solid white;
}

#content-table td textarea{
 	background-color: transparent;
 	outline:none;
	width:100%;
	resize:none;
 	border:none;
 	color:white;
 	min-height:30px;
 	overflow:auto;
}

#content-table .desc-header{
 	width:70%;
}

#content-table .desc-cell{
 	width:70%; 
}

.options-table {
    cursor: pointer;
	width: 100%;
	border-collapse: collapse;
}

.options-table tr {
	color: white;
	border: 2px solid white;
	height: 30px;
}

.options-table tr:hover {
    background-color: darkolivegreen;
    color: white;
}
/*******************************************************************************/

/*                                       LINK                                  */
#blog-filters a{
 	color:white;
}

#blog-wrapper a{
 	color:white;
}


a{
	text-decoration: none;
}

#links a{
	color: white;
}

#banner h1{
	color: darkgreen;
}

#content-table td a{
	color: lightgreen;
}

#footer a{
	color: white;
}

/*******************************************************************************/

/*                                       LIST                                  */
ul{
	list-style-position: inside;
}
/*******************************************************************************/

/*                                       BLOG                                  */
#blog-wrapper{
 	width: 90%;
	float: left;
	clear: left;
 	color: white;
	min-height: 100%;
}


#blog-wrapper::after{
	content: "";
	clear: both;
	display: table;
}

#blog-post-wrapper{
 	border: green 1px solid;
 	margin-bottom: 20px;
 	border-radius: 10px;
 	padding-left: 10px;
 	padding-right: 10px;
 	width: 90%;
 	height: 250px;
}

#blog-post-title{
 	float: left;
	clear: left;
 	min-width: 75%;
}

#blog-post-date{
 	float: right;
	clear: right;
 	width: 20%;
 	font-size: 11px;
 	text-align: right;
}

#blog-post-post{
	width: 100%;
	float: left;
	clear: left;
 	border-top: 1px green solid;
}

#blog-post-post-large{
 	width: 100%;
 	border-top: 1px green solid;
}

#blog-post-post textarea{
 	resize: none;
 	overflow-y: hidden;
 	height: 180px;
	float: left;
	clear: left;
	width: 100%;
 	border: none;
 	font-family: Courier;
}

#blog-post-post-large textarea{
 	resize: none;
	width: 100%;
	height: 98%;
	clear: both;
 	border: none;
 	font-family: Courier;
	overflow-y: scroll;
}

#blog-filters{
	float: right;
	clear: right;
 	text-align:right;
}

/*******************************************************************************/
#poem-text{
	width: 100%;
	resize: none;
	height: 100%;
	background-color: transparent;
	text-align: center;
	color: white;
	font-size: 14pt;
}