@import url('navigation.css');
@import url('effects.css');
@import url('facybox.css');

body
{
background: #e3e3e3 url('../icons/background.png') repeat;
font-family: 'Open Sans', sans-serif;
color: #444444;
font-size: 12px;
margin: 0 auto;
}

a
{
color:#007ba4;
text-decoration:none;
}
a:hover
{
text-decoration:underline;
}

a.powered
{
background: none;
overflow: hidden;
color: #444444;
font-size: 12px;
font-weight: normal;
text-decoration: none;
}
a.powered:active
{
color: #2b2b2b;
text-decoration: none;
}
a.powered:hover
{
color: #2b2b2b;
text-decoration: none;
}

a.follow
{
text-decoration: none;
}
a.follow:active
{
text-decoration: none;
}
a.follow:hover
{
text-decoration: none;
}

a.remove
{
text-decoration: none;
}
a.remove:active
{
text-decoration: none;
}
a.remove:hover
{
text-decoration: none;
}

a.navi
{
color: #ffffff;
font-size: 11px;
text-decoration: none;
text-shadow: 0px 1px 0px #000000;
}
a.navi:active
{
color: #ffffff;
text-decoration: none;
}
a.navi:hover
{
color: #ffffff;
text-decoration: none;
}

a.view_comments
{
color: #696969;
font-size: 11px;
text-decoration: none;
}
a.view_comments:active
{
color: #333333;
text-decoration: none;
}
a.view_comments:hover
{
color: #333333;
text-decoration: none;
}

h1
{
font-family: 'Arimo', sans-serif;
font-size: 16px;
}

.copyright
{
color: #444444;
font-size: 12px;
margin-top: 30px;
}

#container
{
background-color:#ffffff;
margin:0 auto;
width:750px;
border:solid 1px #ebebeb;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
-webkit-box-shadow: 0 10px 6px -6px #777;
-moz-box-shadow: 0 10px 6px -6px #777;
box-shadow: 0 10px 6px -6px #777;
}

#nav_bar
{
background: #313131;
background: -webkit-gradient(linear, left top, left bottom, from(#4d4d4d), to(#313131));
background: -webkit-linear-gradient(top, #4d4d4d, #313131);
background: -moz-linear-gradient(top, #4d4d4d, #313131);
background: -ms-linear-gradient(top, #4d4d4d, #313131);
background: -o-linear-gradient(top, #4d4d4d, #313131);
background: linear-gradient(top, #4d4d4d, #313131);
padding:8px;
color:#ffffff;
font-size:12px;
font-weight:bold;
overflow:auto;
-moz-border-radius-topleft: 3px;
webkit-border-top-left-radius: 3px;
border-top-left-radius: 3px;
-moz-border-radius-topright: 3px;
webkit-border-top-right-radius: 3px;
border-top-right-radius: 3px;
-webkit-box-shadow: 0 10px 6px -6px #fff;
-moz-box-shadow: 0 10px 6px -6px #fff;
box-shadow: 0 10px 6px -6px #fff;
}

#nav_bar a
{
color:#ffffff;
}

.error_msg
{
font-size:12px;
background-color:#ffebeb;
color:#E85151;
padding:5px;
font-weight:bold;
width:210px;
border:solid 1px #E89090;
}

.success_msg
{
font-size:12px;
background-color:#d3ffd3;
color:#268026;
padding:5px;
font-weight:bold;
width:210px;
border:solid 1px #97dc97;
}

#wall_container
{
text-align:left;
width:100%;
background-color:#ffffff;
}

#stat_container
{
text-align:left;
width:700px;
background-color:#ffffff;
padding:10px;
}

.imgpreview
{
max-width:130px;
max-height:125px;
margin-bottom:10px;
margin-right:10px;
-webkit-box-shadow: 0 10px 6px -6px #777;
-moz-box-shadow: 0 10px 6px -6px #777;
box-shadow: 0 10px 6px -6px #777;
}
.preview
{
border:solid 1px #333;
max-width:150px;
max-height:125px;
margin-bottom:10px;
margin-left:10px;
}
.webcam_preview
{
width:103px;
margin:0px 3px 3px 0px;
}
#webcam{  float:left; width:320px;height:240px;border:solid 1px #333;margin-right:5px }
#webcam_preview {float:left; width:230px;height:240px; }
#webcam_status,#webcam_takesnap
{
width:100%;clear:both;padding-top:5px
}
#content
{
margin-top:10px;

}
#updateboxarea
{
padding:10px;
}
#update
{
border:solid 1px #bdc7d8;
height:20px;
width:98%;
font-size:13px;
font-family:Arial, Helvetica, sans-serif;
padding:5px;
overflow: auto;
resize: none;
}
#button_bar
{
display:none;
}
.comment
{
border:solid 1px #BDC7D8;
font-family:Arial, Helvetica, sans-serif;
overflow: auto;
resize: none;
}

.arrow-e {
border-style: dashed;
border-color: transparent;
border-width: 0.70em;
display: -moz-inline-box;
display: inline-block;
font-size: 8px;
height: 0;
line-height: 0;
position: relative;
vertical-align: middle;
width: 0;
}

.arrow-e {
border-left-width: 1em;
border-left-style: solid;
border-left-color: #999;
}

#imageupload
{
overflow:auto; padding:10px;width:560px; font-size:11px;display:none;
}
#webcam_container
{
overflow:auto; padding:10px;width:560px; font-size:11px;display:none;
}

.border
{
border-left:solid 1px #BDC7D8;border-right:solid 1px #BDC7D8;border-bottom:solid 1px #BDC7D8; 
}

.stbody
{
padding:10px;
border-bottom:solid 1px #dedede;
overflow:auto;
background-color: #ffffff;
}
.stimg
{
float:left;
height:50px;
width:50px;
border:solid 1px #ebebeb;
padding:2px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
}
.sttext
{
margin-left:70px;
min-height:50px;
word-wrap:break-word;
overflow:hidden;
padding:5px;
display:block;
font-size:12px;
width:490px;
}
.sttext b
{
color:#006699;
}

.sttime
{
font-size:11px;
color:#999;
font-family:Arial, Helvetica, sans-serif;
margin-top:5px;
}
.stdelete 
{
font-weight:bold;
float:right;
cursor:pointer;
background:url(../icons/trashdull.png);
display: none;
height:20px;
width:20px;
}
.stbody:hover .stdelete{
display : block;
}
.stdelete:hover
{
background:url(../icons/trash.png);
}
#stexpandbox
{
margin-top:10px;
}
#stexpandbox img
{
border:solid 1px #dedede;
padding:3px;
}
.comment_ui, .commentupdate,
.stcommentbody
{
border-bottom:solid 2px #fff;
background-color:#F3EEF7;
padding:5px;
width:400px;
overflow:auto;
}
.stcommentimg
{
float:left;
height:35px;
width:35px;
border:solid 1px #dedede;
padding:2px;
}
.stcommenttext 
{
margin-left: 45px;
min-height: 40px;
word-wrap: break-word;
overflow: hidden;
padding: 3px;
display: block;
font-size: 11px;
width: 340px;
}
.stcommenttext b
{
color:#006699;
}

.stcommenttime
{
font-size:11px;
color:#999;
font-family:Arial, Helvetica, sans-serif;
margin-top:5px;
}
.stcommentdelete 
{
font-weight:bold;
float:right;
cursor:pointer;
display:none;
background:url(../icons/trashdull.png);
height:20px;
width:20px; 
}
.stcommenttext:hover .stcommentdelete
{
display:block
}
.stcommentdelete:hover
{
background:url(../icons/trash.png);
}

.update
{
background-color:#F3EEF7;
width:400px;
padding:5px;
}
.comment
{
width:330px;
height:35px;
font-size:11px;
}
.small_face
{
width:35px;height:35px
}
.big_face
{
width:50px;
height:50px
-webkit-box-shadow: 0 10px 6px -6px #858585;
-moz-box-shadow: 0 10px 6px -6px #858585;
box-shadow: 0 10px 6px -6px #858585;
}
#flashmessage
{
height:15px;
margin-top:10px;
font-size:11px;
color:#333;
}
.morebox
{
font-weight:bold;
color:#575757;
text-align:center;
background-color:#f3eef7; 
margin-top:8px;
margin-left:1%;
margin-bottom:8px;
padding:6px 0px 6px 0px;
display:block;
font-size:13px;
width:98%;
border:1px solid #eae5ed;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
}
.morebox a{text-decoration:none; display:block}
.morebox a:hover{ text-decoration:none;color:#333333; }
.button
{
background: #ffffff;
background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#efefef));
background: -webkit-linear-gradient(top, #ffffff, #efefef);
background: -moz-linear-gradient(top, #ffffff, #efefef);
background: -ms-linear-gradient(top, #ffffff, #efefef);
background: -o-linear-gradient(top, #ffffff, #efefef);
background: linear-gradient(top, #ffffff, #efefef);
font-size: 11px;
color: #444444;
font-weight: normal;
text-decoration: none;
padding: 2px 7px;
border: 1px solid #cecece;
border-bottom: 1px solid #acacac;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
text-shadow: 0px 1px 0px #ffffff;
}
.button:active
{
color: #444444;
font-weight: normal;
text-decoration: none;
}
.button:hover
{
background: #f1f1f1;
background: -webkit-gradient(linear, left top, left bottom, from(#f1f1f1), to(#f2f2f2));
background: -webkit-linear-gradient(top, #f1f1f1, #f2f2f2);
background: -moz-linear-gradient(top, #f1f1f1, #f2f2f2);
background: -ms-linear-gradient(top, #f1f1f1, #f2f2f2);
background: -o-linear-gradient(top, #f1f1f1, #f2f2f2);
background: linear-gradient(top, #f1f1f1, #f2f2f2);
font-size: 11px;
color: #444444;
font-weight: normal;
text-decoration: none;
}
#addphoto
{
font-weight:bold;
}
#camera_error
{
text-align:center;
margin-top:80px;
}

.info
{
font-size:11px;
color:#888888;
padding-top:15px;
padding-bottom:15px;
}

.login_text
{
color:#474747;
font-size:11px;
}

.pos
{
position:relative;
top:2px;
z-index: 1;
}
.poslike
{
position:relative;
top:4px;
z-index: 1;
}
.imgpos
{
position:relative;
top:5px;
margin-left:3px;
margin-right:5px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
z-index: 1;
}
.img_logout
{
position:relative;
top:-2px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
z-index: 1;
}

.like_bar
{
border-bottom:solid 2px #fff;
background-color:#F3EEF7;
padding:3px;
width:404px;
overflow:auto;
font-size:11px;
}

.texteffect
{
text-shadow: 1px 1px 1px #afafaf;
}

.index_container
{
background:#ffffff url('../icons/header.jpg') repeat;
margin:0px auto;
width:750px;
text-align:center;
margin-top:65px;
border:solid 1px #ebebeb;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
-webkit-box-shadow: 0 10px 6px -6px #777;
-moz-box-shadow: 0 10px 6px -6px #777;
box-shadow: 0 10px 6px -6px #777;
}

.index_container h5
{
margin:5px 0;
color:#999;
text-shadow:1px 1px 0 #fff;
font-size:25px;
font-family:Arial Narrow, Arial, sans-serif;
margin-top: 20px;
}
.index_container h6
{
font-style:italic;
font-weight:normal;
font-size:16px;
text-shadow:1px 1px 0 #fff;
color:#888;
margin:0;
}

#header
{
max-width:640px;
-moz-border-radius: 10px;-webkit-border-radius: 10px;border-radius: 10px;
}

#form_holder
{
text-align:left;
padding:20px 0px 40px 40px;
}

#footer
{
font-size:12px;
color:#555555;
padding:5px;
}

.form_login
{
float:left;
}

.form_signup
{
margin-left:375px;
}

.footer
{
text-size:9px;
color:#aaaaaa;
padding:10px;
}

.input
{
width:250px;
height:20px;
padding:5px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
border:solid 1px #C9C9C9;
margin-bottom:5px;
}

.signin_btn
{
cursor:pointer;
padding:5px;
margin-top:5px;
color:#ffffff;
font-weight:bold;
background-color: #3b5998;
background-repeat: repeat-x;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
-moz-border-radius: 3px;-webkit-border-radius: 3px;border-radius: 3px;
}

.signup_btn
{
cursor:pointer;
padding:5px;
margin-top:5px;
color:#ffffff;
font-weight:bold;
background-color: seagreen;
background-repeat: repeat-x;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
-moz-border-radius: 3px;-webkit-border-radius: 3px;border-radius: 3px;
}

#pages
{
clear:both;
list-style-type:none;
overflow:hidden;
margin-top:10px;
padding:0;
}

#pages li    
{
float:left;
}

#pages li a
{
font-weight:bold;
margin:0 10px;
padding:5px 10px;
border:1px solid #bbb;
display:inline-block;
}

#pages li a:hover
{
text-decoration:none;
color:#333;
}

.userlist
{
padding:10px;
border-bottom:solid 1px #aaaaaa;
overflow:auto;
width:700px;
}
.userlist_img
{
float:left;
}
.userlist_body
{
margin-left:60px;
}

.follow_btn
{
cursor:pointer;
padding:5px;
color:#ffffff;
font-weight:bold;
text-decoration:none;
background-color:#ea7500;
-moz-border-radius: 3px;-webkit-border-radius: 3px;border-radius: 3px;
}
.follow_btn:hover
{
text-decoration:none;
}

.following_btn
{
cursor:pointer;
padding:5px;
color:#ffffff;
font-weight:bold;
text-decoration:none;
background-color:#009200;
-moz-border-radius: 3px;-webkit-border-radius: 3px;border-radius: 3px;
}
.following_btn:hover
{
text-decoration:none;
}

.foll_re_top
{
margin-top:12px;
}
.cam_top
{
margin-top:8px;
}

#hint_msg
{
padding:10px;
margin-left:12px;
border:solid 1px #aaaaaa;
-moz-border-radius: 5px;-webkit-border-radius: 5px;border-radius: 5px;
opacity: 0.8; filter: alpha(opacity=60); background-repeat: no-repeat;
background-color: black; color: white;
}

#hint_msg a
{
color:orange;
text-decoration:none;
font-weight:bold;
}

#hint_msg a:hover
{
text-decoration:underline;
}

#info_box
{
padding:60px 50px 0px 10px;
border-bottom:solid 1px #dedede;
width:690px;
background-color:#fcfcfc;
margin-top:200px;
}

#profile_img
{
background-color: #FFFFFF;
border: 1px solid #DEDEDE;
margin-left: 10px;
margin-top: -100px;
position: absolute;
width: 86px;
height: 86px;
float:left;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
-webkit-box-shadow: 0 10px 6px -6px #777;
-moz-box-shadow: 0 10px 6px -6px #777;
box-shadow: 0 10px 6px -6px #777;
}
#timeline_img
{
background-color: #FFFFFF;
border: 1px solid #DEDEDE;
position: absolute;
width: 86px;
height: 86px;
float:left;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
-webkit-box-shadow: 0 10px 6px -6px #777;
-moz-box-shadow: 0 10px 6px -6px #777;
box-shadow: 0 10px 6px -6px #777;
}

.avatar_img
{
padding:3px;
}
#cover_container
{
overflow: auto;
width: 750px;
}

#info-box
{
margin-left:115px;
margin-top: -50px;
position: absolute;
}

#info-name
{
float:left;
overflow:hidden;
word-wrap: break-word;
width:150px;
margin-top:10px;
}

#info-content
{
margin-left:255px;
width:360px;
}

#info-photos
{
background-color:#f9f9f9;
text-align:center;
font-size:11px;
padding:5px;
margin-left:100px;
border:solid 1px #eeeeee;
width:80px;
-moz-border-radius: 3px;-webkit-border-radius: 3px;border-radius: 3px;
}

#info-friends
{
background-color:#f9f9f9;
text-align:center;
font-size:11px;
padding:5px;
margin-left:200px;
margin-top:-44px;
border:solid 1px #eeeeee;
width:80px;
-moz-border-radius: 3px;-webkit-border-radius: 3px;border-radius: 3px;
}

#info-timeline
{
background-color:#f9f9f9;
text-align:center;
font-size:11px;
padding:5px;
float:left;
width:80px;
border:solid 1px #eeeeee;
-moz-border-radius: 3px;-webkit-border-radius: 3px;border-radius: 3px;
}

#photo-album
{
background: #f9f9f9;
width: 600px;
margin: 0 auto;
border-bottom:solid 1px #c9c9c9;
border-left:solid 1px #c9c9c9;
border-right:solid 1px #c9c9c9;
-moz-border-radius-bottomleft: 5px;
webkit-border-bottom-left-radius: 5px;
border-bottom-left-radius: 5px;
-moz-border-radius-bottomright: 5px;
webkit-border-bottom-right-radius: 5px;
border-bottom-right-radius: 5px;
}

#photo-album div
{ 
display: inline-block; 
width:30%; 
margin: 0.5em 0; 
padding:0; 
}

#photo-album div p
{ 
text-align: center; 
margin:0; 
padding:0; 
}

.album_pic
{
background-color: #dedede;
max-width:100px;
padding:4px;
border:solid 1px #cecece;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
-webkit-box-shadow: 0 10px 6px -6px #777;
-moz-box-shadow: 0 10px 6px -6px #777;
box-shadow: 0 10px 6px -6px #777;
}

#album_infobar
{
padding:5px;
border:solid 1px #aaaaaa;
overflow:auto;
}
#aib_left
{
float:left;
}
#aib_right
{
margin-left:70px;
font-size:12px;
}

.stat_box
{
background: #2fa9f6 url('../icons/info.png') no-repeat 14px 14px;
color: #fefefe;
font-size: 13px;
font-weight: normal;
padding: 19px 60px;
}