mycss.css

.loginform, .regform
{
position:relative;
top:30%;
left:15%;
width : 60%;
}

.black-bg {
	box-shadow: 2px 2px 5px black;
}
.header, .footer {
    height: 80px;
    padding: 0 15px;
}

.header {
    position: fixed;
    left: 0;
    right: 0;
    z-index: 1002;
}
.top-menu-logout
{
z-index : 1003;
float:right;
width : 50%;
}
.left-pane
{
 display:block;
 position:absolute;
 background: #5C85FF;
 height : 100%;
 width : 20%;
 box-shadow: 0px 3px 5px #888800;
 background-image: url('background-imager//Elegant_Background-8.jpg');
 top:150px;
 float:left;
}
.profilepic
{
position:relative;
top:100px;
width:80%;
left:10%;
}
#inboxbody
{
background-color : #9BC2B8;
}
.left-pane-content
{
position:relative;
float:top;
display:block;
height:60%;
width:80%;
left:10%;
top:20%;
}
.mydiv
{
top:100px;
}
.myid
{
top:50%;
}
.searchbox
{
float:left;
margin: 10px;
border:2px solid;
border-radius:10px;
height:40%;
width:40%;
box-shadow: 10px 10px 5px #888888;
background-color:white;
}
.searchimg
{
position:relative;
left:10%;
margin-top:2%;
}
.searchbox input
{
position:relative;
left:5%;
margin-right:5%;
margin-top:5%;
}
.searchbox form
{
border-top: 1px solid #000000;
}
.content
{
position:absolute;
left:30%;
top:30%;
float:right;
margin-left:20px;
margin-top:1%;
width: 60%;
}

.profile-image
{
display:block;
position:absolute;
top:20%;
left:1%;
height:300px;
width:300px;
margin-right:10px;
float:left;
}
.profile-headers
{
font-size:50px;
font-weight:2px;
color: blue;
font-family:"Arial"
}
.profile-text
{
display:block;
position:absolute;
top:20%;
float:left;
margin-left:10px;
width:50%;
height:100%;
left:30%;
}
.logout
{
position:relative;
float : right;
}
.top-menu-form
{
position:relative;
float : right;
top:10px;
}
.searchresult
{
position:absoulte;
margin-left:20px;
margin-right:20px;
top:200px;
}
.friendlist
{
position:relative;
top:10%;
left:10%;
}
.messagecontent
{
display:block;
float:left;
background-color:#E6E6E6;
height:300px;
position:fixed;
top:160px;
width:60%;
left:30%;
}
.messageentry
{
display : block;
float:left;
height:20%;
position:fixed;
top:420px;
width:70%;
left:30%;
}
.msgbtn
{
display:block;
top:70%;
float:left;
float:bottom;	
margin:10px;
}
.topnavbar
{
position: fixed;
left: 0;
top:0px;
right: 0;
z-index: 1002;
background-color:#0000;
height : 80%px;

z-index:100;
}
.secondnavbar
{
position:fixed;
left: 0;
right:0;
top:0;
z-index:95;
background-color:#5e0707;
height:80px;

background-image: url('background-imager//1282860.jpg');

}
.thirdnavbar
{
left:0;
right:0px;
top:0;
z-index:93;
height:380px;
position:absolute;
box-shadow:0px 2px 10px #888888;
background-image: url('background-imager//1282860.jpg');
}
.pincontent
{
position:absolute;
top:350px;
background-color:grey;
min-height : 100%;
background-image: url('background-imager//bg image.jpg');
width:100%;
}
.profile-pic
{
position:absolute;
top:100px;
width:20%;
left:40%;
right:60%;
z-index:97;
}

.prof-img
{
width:180px;
max-height:180px;	
}
.profile-pic-text
{
margin-top:10px;
}
.appearing-name-photo
{
position:absolute;
top:90px;
left:5%;
}
#wrapper {
	width: 90%;
	max-width: 1100px;
	min-width: 800px;
	margin: 50px auto;
}

.pin {
	background: #FEFEFE;
	border: 1px solid #0000;
	box-shadow: 0 1px 2px rgba(34, 25, 25, 0.4);
	margin: 0 2px 15px;
	padding: 1em;
	background: -webkit-linear-gradient(45deg, #FFF, #F9F9F9);
	opacity: 1;
	-webkit-column-break-inside: avoid;
	-moz-column-break-inside: avoid;
	column-break-inside: avoid;
	-webkit-transition: all .1s ease;
	-moz-transition: all .1s ease;
	-o-transition: all .1s ease;
	transition: all .1s ease;
	width:350px;
	
}
	
	
.pin img {
	width: 100%;
	border-bottom: 1px solid #ccc;
	padding-bottom: 5px;
	margin-bottom: 2px;
}

.pin p {
	font: 15px/18px Century Gothic, sans-serif;
	font-weight:bold;
	color: #333;
	margin: 0;
}


.arrowupbutton
{
position:fixed;
top:90%;
right:3%;
}
.upper-tabs
{
position:absolute;
top:320px;
width:40%;
left:30%;
}
.upper-tabs button
{
width:100px;
}
#captiontext
{
width : 50%;	
}
.board {
display:inline-block;
	background: #FEFEFE;
	border: 2px solid #FAFAFA;
	box-shadow: 0 1px 2px rgba(34, 25, 25, 0.4);
	margin: 0 2px 15px;
	padding: 1em;
	background: -webkit-linear-gradient(45deg, #FFF, #F9F9F9);
	opacity: 1;
	-webkit-column-break-inside: avoid;
	-moz-column-break-inside: avoid;
	column-break-inside: avoid;
	-webkit-transition: all .1s ease;
	-moz-transition: all .1s ease;
	-o-transition: all .1s ease;
	transition: all .1s ease;
	width:350px;
}
	
	
.board img {
	width: 100%;
	height:200px;
	border-bottom: 1px solid #ccc;
	padding-bottom: 15px;
	margin-bottom: 5px;
}

.board p {
	font: 12px/18px Century Gothic, sans-serif;
	color: #333;
	margin: 0;
}
.addcontent
{
position:absolute;
top:60px;

}
.addpinform
{
position:absolute;
top:100px;
width:700px;
left:400px;
border:2px solid #FFA319;
background-color:#CAD4D4;
padding:2em;
box-shadow: 0 2px 5px rgba(34, 25, 25, 0.4);
border-radius:20px;
}
#firstboard
{
height:250px;
}
.boardpincontent
{
position:absolute;
top:200px;
width:80%;
left:10%;
}
.back
{
top:10px;	
}
.editprofile
{
position:absolute;
top:90px;
right:5%;
}
.profile-content
{
position:absolute;
top:170px;
width:90%;
}
.profile-image
{
position:relative;
top:10%;
left:2%; 	
width:607px;
height:607px;
}
.profile-image img
{
position:relative;
width:553px;
height:553px;
}
.pin-image img
{
position:relative;
width:553px;
}
.pin-image
{
position:relative;
top:10%;
left:2%; 	
width:607px;
height:607px;
}
.board-image img
{
position:relative;
width:553px;
}
.board-image
{
position:relative;
top:10%;
left:2%; 	
width:607px;
height:607px;
}
.edit-profile-submit
{
position:fixed;
top:180px;
width:50%;
left:50%;
}
#edit-prof-submit
{
display:inline-block;
top:1%;
}
#privacypolicy
{
position:fixed;
top:200px;
width:50%;
left:25%;
background-color:#fff;
padding:10px;
}