@font-face { font-family: kilde-sans; src: url('fonts/kilde-sans/KildeSans-Regular.ttf'); } 
@font-face { font-family: kilde-sans-bold; src: url('fonts/kilde-sans/KildeSans-Bold.ttf'); } 
@font-face { font-family: kilde-sans-light; src: url('fonts/kilde-sans/KildeSans-Light.ttf'); } 
@font-face { font-family: kilde-sans-semibold; src: url('fonts/kilde-sans/KildeSans-Semibold.ttf'); }
@font-face { font-family: kilde-sans-black; src: url('fonts/kilde-sans/KildeSans-Black.ttf'); }


html, body {
	margin: 0;
	padding: 0;
	background-color: #8CAAAC;
	height: 100%;
	width: 100%;
    -webkit-box-sizing:border-box;
    -o-box-sizing:border-box;
    -ms-box-sizing:border-box;
    box-sizing:border-box;
}
.container {
    width: 100%;
    vertical-align: text-top;
    margin:2px;
}
.overlord {
	width: 100%;
	margin: 0;
	padding: 0;
	min-height: 100%;
	height: 100%;
}

.container4 {
	clear:left;
    float:left;
    width:100%;
	background-color:#F2F2F9;
    overflow:hidden;
    height: auto;
}
.container3 {
	clear:left;
    float:left;
    width:100%;
	border-right: 3px solid #C3C4CB;
	
	background-color:#FFFFFF;
	position:relative;
    right:10%;
}
.container2 {
	clear:left;
    float:left;
    width:100%;
	border-right: 3px solid #C3C4CB;
	background-color:#FFFFFF;
    position:relative;
    right:35%;
}
.container1 {
	clear:left;
    float:left;
    width:100%;
	border-right: 3px solid #C3C4CB;
	background-color:#F2F2F9;
    position:relative;
    right:45%;
}
.leftnavbar {
	float:left;
	width: 10%;
	color:#000000;
	font-family:kilde-sans-bold; font-size:15pt;
    padding-top: 10px;
    padding-bottom: 10px;
	position: relative;
	overflow:hidden;
	left: 90%;
	}

.leftnavbarcontent
{
	padding-left: 5px;
	padding-right: 5px;
}
	
.leftcenterpiece {

	float:left;
	font-family:kilde-sans-bold; font-size:16pt;
	width: 45%;
	padding-top: 10px;
    padding-bottom: 10px;
	position: relative;
	overflow:hidden;
	left: 90%;
}

.leftcenterpiececontent
{
	padding-left: 8px;
	padding-right: 8px;
	text-align:left;
	position:relative;
}

.rightcenterpiece {

	float:left;
	width: 35%;
	font-family:kilde-sans-bold; font-size:16pt;
	vertical-align: top;
	position: relative;
	overflow:hidden;
	left: 90%;
	margin-bottom: 10px;
}

.rightcenterpiececontent
{
	padding-left: 8px;
	padding-right: 5px;
}
	
	
.rightnavbar {
	float:left;
	width: 10%;
	color:#000000;
    padding-top: 10px;
    padding-bottom: 10px;
	vertical-align: top;
	position: relative;
	overflow:hidden;
	left: 90%;

}

.rightnavbarcontent
{
	padding-left: 8px;
	padding-right: 5px;
}

.top {
	background-color:#8CAAAC;
	color:#665830;
	font-family:kilde-sans; font-size:16pt;
	text-align:center;
	float:left;
	padding-left: 8px;
	width: 9.5%;

}
.profile_names_block
{
	background-color:#8CAACC;
	display:block;
	float:left;
}
.profile_name
{
	background-color:#8CCCAC;
	float:left;
	font-family:kilde-sans;
	font-size: 16pt;

	font-weight:bold;
	margin:2px;
	padding:2px;
}

.menu {
	color:#000000;
	
}
.menubutton {
	background-color:#F2F2F9;
	-webkit-border-radius:7px;
	border-radius:3px;
	display:inline-block;
	cursor:pointer;
	color:#000000;
	font-family:kilde-sans;
	font-size:18px;
	padding:2px 6px;
	text-decoration:none;
	border: none;
	margin-bottom:2px;
	width:100%;
}
.menubutton:hover {
	background-color:#2d7a82;
}
.menubutton:active {
	position:relative;
	top:1px;
}
.loginContainer {
    margin: 0;
    width: 100%;
	background-color:#9DB8BA;
	height:100%;
}

.loginLayout {
	border: solid 0px #a1a1a1;
	padding: 5px;
	margin-left: 5px;
	
}

.loginLayout label {
	float: left;
	width: 100px;
	margin-bottom: 5px;
	margin-top: 5px;

	color: #000000;

}

.loginLayout input, .loginLayout select, .loginLayout textarea {
	float: left;
	width: 100px;
	margin-bottom: 10px;
	border: none;
}
.registerLayout {
	border: solid 0px #a1a1a1;
	padding: 10px;
	margin-left: 10px;
	}

.registerLayout label {
	float: left;
	width: 200px;
	margin-bottom: 5px;
	margin-top: 5px;
	color: #000000;
}

.registerLayout input, .registerLayout select, .registerLayout textarea {
	float: left;
	width: 200px;
	margin-bottom: 10px;
	border: none;
}
.clear {
	content: "";
	display: block;
	height: 0;
	clear: both;
}

.footer {
    background-color: #393939;
    height: 15px;
    width: 100%;
    position: fixed;
    bottom: 0;
    left: 0;
	margin:0;
	font-family:kilde-sans; font-size:10pt;
	text-align: center;
	color: #909090;
}

.info {
	margin-left: 10px;
	margin-right: 10px;
	height: 100%;
	text-align:center;
	font-family:kilde-sans; font-size:11pt;
}

.posts
{
     display:inline-block;
     margin:2%;
     padding:2%;
}
.postingbox
{
	background-color:#C4CFE6;
	text-align:center;
	font-family:kilde-sans;
	margin-top:5px;
	margin-bottom:5px;

	font-size: 14px;
	padding: 2%;
	font-weight: bold;
	width:96%;
}
.post_images
{
	display:block;
	height:auto;
	width:100%;
}

.findfriendbox
{
	display:inline-block;
	margin: 3px;
	font-family:kilde-sans;
}
.findfriends
{
	font-family: kilde-sans-bold; font-size:11pt;
	text-align:center;
}

.addfriendbutton, .findfriendbutton
{
	background-color:#3ca3c9;
	-webkit-border-radius:7px;
	border-radius:7px;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:kilde-sans;
	font-size:12px;
	padding:2px 6px;
	text-decoration:none;
	border: none;
}



.friendslist {
	color:#9DB8BA;
	
}
.friendnamebutton {

	-webkit-border-radius:7px;
	border-radius:7px;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:kilde-sans;
	font-size:16px;
	padding:2px 6px;
	text-decoration:none;
	border: none;
	margin-bottom:2px;
	width:100%;
}
.friendnamebutton:hover {
	background-color:#2d7a82;
}
.friendnamebutton:active {
	position:relative;
	top:1px;
}

.messagesbox
{
    display:inline-block;
	background-color:#DDFFDD;
	float:left;
	text-align:center;
	display:inline-block;
	margin:10px;
	border:1px solid #BBEECC;
	border-bottom-width:2px;
	border-right-width:2px;
	font-size: 14px;
	width:90%;
	border-radius: 10px;
	padding: 5px;
	font-weight: bold;
}

.messagebutton {
	background-color:#3ca3c9;
	-webkit-border-radius:7px;
	border-radius:7px;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:kilde-sans;
	font-size:15px;
	padding:6px 17px;
	text-decoration:none;
	border: none;
}
.messagebutton:hover {
	background-color:#2d7a82;
}
.messagebutton:active {
	position:relative;
	top:1px;
}

.profile_text
{
	font-family:kilde-sans;
	font-size:18px;
	margin: 7px;
	font-weight: normal;
}
span
{
  display: inline-block;
  vertical-align: middle;
  line-height: normal;  
}

.conversation
{
	font-family:kilde-sans;
}
.message_from_me
{
	background-color:#CCEECC;
	font-family:kilde-sans;
	font-size:16px;
	margin:5px;
    font-weight: normal;
    text-align:right;
    float: right;
    border-radius: 3px;
    width:90%;
}
.message_to_me
{
	background-color:#BBDDEE;
	font-family:kilde-sans;
	font-size:16px;
	margin:5px;
    font-weight: normal;
    text-align:left;
    float: left;
    border-radius: 3px;
    width:90%;
}
.postbutton {
	background-color:#3ca3c9;
	-webkit-border-radius:7px;
	border-radius:7px;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:kilde-sans;
	font-size:15px;
	padding:6px 17px;
	text-decoration:none;
	border: none;
}
.postbutton:hover {
	background-color:#2d7a82;
}
.postbutton:active {
	position:relative;
	top:1px;
}

.comment
{
	background-color:#C4CFE6;
	font-family:kilde-sans;
	font-size:12px;
	margin:10px;
    font-weight: normal;
}
.commentbutton {
	background-color:#3ca3c9;
	-webkit-border-radius:7px;
	border-radius:7px;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:kilde-sans;
	font-size:12px;
	padding:2px 6px;
	text-decoration:none;
	border: none;
}
.commentbutton:hover {
	background-color:#2d7a82;
}
.commentbutton:active {
	position:relative;
	top:1px;
}


.commentlabel {
	font-family:kilde-sans; font-size:10pt; font-style:normal;
}
.commenttextbox
{
	border: none;
}

.loginbar {
	float:left;
	width: 10%;
	color:#000000;
	font-family:kilde-sans-bold; font-size:12pt;
    padding-top: 10px;
    padding-bottom: 10px;
	position: relative;
	overflow:hidden;
	left: 90%;
	}

.loginbarcontent
{
	padding-left: 5px;
	padding-right: 5px;
	box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

.loginform
{
	padding-right: 5px;
	padding-left: 5px;
}

.loginbutton {
	background-color:#3ca3c9;
	-webkit-border-radius:3px;
	border-radius:3px;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:kilde-sans;
	font-size:15px;
	padding:6px 10px;
	text-decoration:none;
	border: none;
}
.loginbutton:hover {
	background-color:#2d7a82;
}
.loginbutton:active {
	position:relative;
	top:1px;
}

.registerpiece {

	width: 30%;
	font-family:kilde-sans-bold; font-size:12pt;
	vertical-align: top;
	position: relative;
	overflow:hidden;
	left: 90%;
}

.registerpiececontent
{
	padding: 8px;
}

.thumb
{
	display:block;
	max-height:100px;
	max-width:100px;
	height:auto;
	width:auto;
}