/*   Skin Facebook  
  Designer: Nguyễn Đình Thiên  
  Site: my.opera.com/thiendt5/blog  
  Last Edit: 30-1-2011
  Các thắc mắc và yêu cầu thay đổi hãy liên hệ tác giả ^^ 
  Mọi quyền sử dụng vui lòng để lại tên người thiết kế. Xin cám ơn!   */


/* =====================BODY INPUT=========================== */

body input[type="submit"], body input[type="button"] {
	border: 1px solid #cccccc;
	font-weight: bold;
	color: #1c94c4;
	margin-right: .1em;
	text-decoration: none !important;
	cursor:default;
	text-align:center;
	zoom: 1;
	font-size:11px;
	padding: .4em 1em;
	background:#f9f9f9 url(http://files.myopera.com/thiendt5/Skin_Facebook/BodyInputButton.png) 0 0 repeat-x;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
	border-radius:4px;
	z-index:3;
	outline:none;
}
body input[type="submit"]:hover, body input[type="button"]:hover,
body input[type="submit"]:focus, body input[type="button"]:focus {
	border: 1px solid #fbcb09;
	background: #fdf9e1 url(http://files.myopera.com/thiendt5/Skin_Facebook/BodyInputButton.png) 0 100% repeat-x;
	font-weight: bold;
	color: #c77405;
	outline:none;
}
body input[type="text"], body input[type="password"], body textarea
{
	background:#f8f8f8;
	border:1px solid #ddd;
	padding:.5em;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
	border-radius:4px;
	-khtml-border-radius:4px;
}
body input[type="text"]:hover, body input[type="password"]:hover, body textarea:hover
{
	border:1px solid #fbcb09;
	background:#fdf5ce;
}
body input[type="text"]:focus, body input[type="password"]:focus, body textarea:focus
{
	border:1px solid #fbcb09;
	background:#f8f8f8;
}


/*=======================COMMON RULES===============================*/
/* FIX IMG WIDTH AND SCALE */

#mainwrap img {max-width:600px;width:no_expressions_allowed_(this.width > 600 ? "600px" : this.width);}
.comments img {max-width:505px !important;width:no_expressions_allowed_(this.width > 505 ? "505px" : this.width);}
.imgleft img {max-width:280px !important;width:no_expressions_allowed_(this.width > 280 ? "280px" : this.width) !important;}
.imgright img {max-width:280px !important;width:no_expressions_allowed_(this.width > 280 ? "280px" : this.width) !important;}

/* Canh giua cac anh va video trong bai post */
.content img {display: block;margin-left: auto;margin-right: auto;}
/* Khong canh giua cac bieu tuong, vi bieu tuong cung la img nen phai !important */
.smiley {display:inline !important}
/* Dat quyen uu tien cho nhung anh canh trai hoac canh phai */
.alignleft img {clear: left;float: left;margin: 4px 15px 8px 0 !important}
.alignright img {clear: right;float: right;margin: 4px 0 8px 15px !important}
.aligncenter img {display: block;margin-left: auto;margin-right: auto;}

hr {-moz-box-sizing: border-box;-moz-float-edge: margin-box;border: 1px inset;
    color: gray;display: block;height: 2px;margin: 0.5em auto;
}
.onecol #wrap4 {padding:0}
.onecol #menu,.onecol #top2 {display:none}
.col1, .col2 {width: 49%;}
.left, .col1 {float: left;}
.right, .col2 {float: right;}
.clear {clear: both;}
#wrap3 {width:1001px;margin:0 auto;line-height:1.55;}
#wrap4 {padding:250px 0 0 0;position:relative}
a {text-decoration:none;color: #3B5998;-moz-transition:color 0.3s ease-in;-webkit-transition: color 0.3s ease-in;-o-transition: color 0.3s ease-in;transition: color 0.3s ease-in;}
a:link, a:hover, a:visited, a:active {-moz-transition: all 0.3s ease-in-out;-webkit-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;}
a:hover {color: #ff1493;}
body{font-family:Arial,Tohama,sans-serif ;
font-size:13px;
background:#fff url(http://files.myopera.com/thiendt5/Skin_Facebook/BodyFacebook.jpg) top center no-repeat;
background-attachment: fixed;}
ul {list-style:none}
#content {margin:0;position:relative;text-align:left; 
font-family:Arial, Helvetica, sans-serif !important;font-size:13px; display:block;width:1001px;}
#mainwrap {width:620px;margin-right:200px;float:right;overflow:hidden;}
#sidewrap {width:179px !important;float:left;position:relative;overflow:visible;top:70px}

#albumpix {display:none}
#blogsearch {display:none}
#getopera {display:none}
#myphoto img {width:180px;height:135px}
#qp h2 {display:none}
#qp {position:absolute;top:-290px;width:180px;height:145px}

#menu {z-index:1;width:179px;float:left;position:absolute;top:173px}
#menu_blog a{background: url(http://files.myopera.com/thiendt5/Skin_Facebook/FacebookIcon1.png) left no-repeat;background-position: 0 -118px;}
#menu_albums a{background: url(http://files.myopera.com/thiendt5/Skin_Facebook/FacebookIcon1.png) left no-repeat;background-position: 0 -100px;}
#menu_archive a{background: url(http://files.myopera.com/thiendt5/Skin_Facebook/FacebookIcon1.png) left no-repeat;background-position: 0 -184px;}
#menu_friends a{background:url(http://files.myopera.com/thiendt5/Skin_Facebook/FacebookIcon2.png) left no-repeat;background-position: 0 -42px;}
#menu_about a{background: url(http://files.myopera.com/thiendt5/Skin_Facebook/FacebookIcon1.png) left no-repeat;background-position: 0 -33px;}
#menu_opera a{background:url(http://files.myopera.com/thiendt5/Skin_Facebook/FacebookIcon2.png) left no-repeat;background-position: 0 -61px;}
#menu_links a{background:url(http://files.myopera.com/thiendt5/Skin_Facebook/FacebookIcon2.png) left no-repeat;background-position: 0 -95px;}

#menu li a {
padding: 3px 8px 3px 28px;
position: relative;
width:143px;
line-height: 13px;
color: #333333;
display:block;
border-bottom: 1px solid #fff;
}
#menu li a#selected , #menu li a:active {
    background-color: #D8DFEA;    
    font-weight: bold;
   }
#top #menu li:hover, #menu li:hover {background-color: #D8DFEA;}
#menu ul {padding:0;}


#top2 {width:719px;margin: 0 20px;margin-bottom: 5px;padding: 2px 0 12px;position:absolute;top:22px;left:179px}
#top2 h1, #top2 p {margin:0}
/* Rất tiếc phải bỏ đi sau khi Opera loại chức năng status
#mystatus {margin:0;position:absolute;width:493px;height:70px;left:199px;top:160px;background:url(http://upanh.tv/images/25576211160781833137.png)}
#mystatus span {position:absolute;padding:35px 20px 15px 10px;width:473px}
#mystatus a {position:absolute;left:150px;top:5px}
#editstatus-inline-side {margin:0;position:absolute;width:493px;left:199px;top:170px;}
*/
#tagged-h2, #day {margin-bottom:50px}

#blogbymail {display:none}

#visitors h2 {display:none}
#visitors {position:absolute;top:-215px;left:192px;clear:both;width:500px;}
#visitors ul {padding:0; margin:0}
#visitors li {width:68px;float:left;padding:7px;text-align:center;overflow:hidden}
#visitors li:hover {border:1px solid #999;-moz-border-radius:4px;border-radius:4px;background-color:#aaa}
#visitors a, #visitors a:link, #visitors a:visited, #myfavs a, #myfavs a:link, #myfavs a:visited {height:71px}
#visitors a span {font-size:10px}

#side h2 {color: #3B5998;font-size:14px;height:16px;width:168px;margin: 8px 0 0 0;padding: 7px 6px 3px 5px;border-top: 1px solid #AAAAAA;}

#friendz img, #myfavs img {display:block;width:50px;height:40px;margin-right:10px;float:left}
#friendz span:hover, #myfavs span:hover {text-decoration:underline}
#friendz a span, #myfavs a span {padding-top:3px;max-height: 28px;max-width: 102px;display:block;overflow: hidden;font-weight:bold}
#friendz li, #myfavs li {margin-bottom:7px;height:40px}
#friendz ul, #myfavs ul {padding:0;margin: 7px 6px 15px;}
#friendz p, #myfavs p {margin:0}

#newcomments .userpic {border: thin solid CadetBlue;float: right;height: 30px;padding:3px;width: 40px;margin-top:5px}
#newcomments .username {color:#8a2be2 !important;}
#newcomments b {color:#8a2be2 !important;}
#newcomments p {margin:0;padding:0px;width:179px;}
#newcomments ul {margin:0;margin-top:8px;padding:0}
#newcomments li {padding:6px 0;margin-right:10px;border-bottom:1px inset #3B5998}
#newcomments .usertext {font: 12px Calibri,Arial,sans-serif;}

#pollquest {margin:0;text-align:center;}
#poll ul{padding:0;margin:0}
#pollresults span {float:right;margin-top:-20px}
.cdwn .dtstart{color:#ff8c00}
.cdwn .summary{color:#20b2aa}
#tagcloud ul {padding-left:10px;}
#tagcloud li {padding-right:15px;}
#tagcloud .size1 {font-size:11px}
#tagcloud .size5 {font-size:13px;}


#wrap0 {background:url(http://files.myopera.com/thiendt5/Skin_Facebook/Wrap0HeaderFacebook.png) top repeat-x}
#header {margin:0;height:42px;background:#3B5998;border:none;-moz-box-shadow:none;box-shadow:none;-webkit-box-shadow:none}

#logo {display:none !important}
#nav {position:absolute;left:-179px;top:0;z-index:3}
#user {position:absolute;top:0;right:0;height:42px;z-index:4}
#loginsignup {position:absolute;top:0;height:42px}
#loginsignup a {border:none !important}

#profile {margin-bottom:40px;padding:15px 15px 280px 15px;border:1px solid #bebebe;position:relative;background: url(http://files.myopera.com/thiendt5/New_Skin/bg_post.png);-moz-box-shadow:0 0 5px #000;-webkit-box-shadow:0 0 5px #000;box-shadow:0 0 5px #000;-moz-border-radius:4px;border-radius:4px}
#aboutwork img {max-width:580px;margin: 0 auto;display:block}
#personal #mystatus {background:none;border:none !important;position:static}
#personal #mystatus span {padding:0}
#personal img {float:right;padding:0 5px 0 0}
#personal ul {float:left;padding:0}
#ff ul {padding:0}
#personal #mystatus {background:none;border:none !important;position:static}
#personal #mystatus span {padding:0}
#favlinks .box {display:none}
#favlinks h2 {border:none !important;display:none}
#personal h2, #ff h2, #aboutwork h2, #aboutme h2, #whyopera h2, #grouplist h2 {color:#FF00FF;}


#shoutbox {position:absolute;top:-17px;right:-822px;width:200px}
#shoutbox h2 {display:none}
#shout {margin-left:10px;width:165px}
#submitshout {position:absolute;top:-27px;right:10px}
#shoutbox li {margin-right:10px;border-bottom:1px inset #3B5998}
#shoutbox ul {padding-left:10px;}
#shoutbox .userpic {border: thin solid Coral;float: right;width: 40px;height: 30px;padding:3px;border: thin solid CadetBlue;}
#shout-list li p {margin:5px;}
#shoutbox blockquote {color: #006400;cursor: text;font-size: 11px;font-weight:bold;margin: 0;padding-left: 2px;}

.sidelinx {position:relative;right:-802px;top:-670px;}
.sidelinx ul {padding-left:10px}
.sidelinx li p {margin:0}
#footer-promo, #header-promo {display:none;}
#footer #operatxtad {background:transparent;border:none;clear: both;display: block;font-size: 11px;padding: 5px 0;text-align: center;}

#main {padding-top:55px;margin-right:5px;margin-left:5px;}
.post {border:1px solid #bebebe;position:relative;background: url(http://files.myopera.com/thiendt5/New_Skin/bg_post.png);margin-bottom:80px;-moz-box-shadow:0 0 5px #000;-webkit-box-shadow:0 0 5px #000;box-shadow:0 0 5px #000;-moz-border-radius:4px;border-radius:4px}
.postdate {padding:0 12px;padding-top:10px;margin:0;height:16px;font-weight:bold}
.post .tags {padding:0 0 10px 12px;margin:0;height:24px;font-weight:bold}
.postdate:before {content: "Posted on: ";color:#aaa;}
.post .tags:before {content: "Tags: ";font-size:0.9em;color:#9C0;}
.post .title {height:30px;overflow:hidden;margin:0;position:absolute;top:-31px;background-image:url(http://files.myopera.com/thiendt5/Skin_Facebook/TitleBackground.png);-moz-box-shadow:3px -2px 3px #000;-webkit-box-shadow:3px -2px 3px #000;box-shadow:3px -2px 3px #000;-moz-border-radius-topleft:4px;-moz-border-radius-topright:4px;border-top-left-radius:4px;border-top-right-radius:4px}
.post .title a {color:#fff;padding:0 10px}
.post .title a:hover {color:#ffff00;padding:0 20px}
.post .postinfo {font-size:12px;font-weight:bold;text-align:center;}
.postinfo img {display:none}
.postinfo span {padding:8px 0 8px 35px;background:url(http://files.myopera.com/thiendt5/NewMenu/IconComment.png) left no-repeat}
/* Lam chu~ sticky post o goc ben phai cua entry */
.post .sticky {
background:transparent url(http://files.myopera.com/thiendt5/New_Skin/StickyPost.png) right no-repeat;
float:right;margin:0;margin-right:5px;font-size:0.85em;padding:8px 40px 8px 8px;height:26px;line-height:20px;}
.post .content{margin:0 10px 0 10px;overflow:hidden;cursor:text;}
.post pre {font: 12px Calibri,Arial,sans-serif;margin:20px 5px 10px 5px;padding:5px 5px;-moz-box-shadow:0 0 3px 1px #000;-webkit-box-shadow:0 0 3px 1px #000;box-shadow:0 0 3px 1px #000;display: inline-block;max-width: 570px;overflow: auto;}
.post pre:before {content: 'Code';border-radius: 5px 5px 0 0;-moz-border-radius: 5px 5px 0 0;-webkit-border-radius: 5px 5px 0 0;color: #fff;background-color: #222;margin: -24px 0px 0px -5px;padding: 2px 5px;position: absolute;}
#firstpost {padding-bottom:20px;}
#firstpost .title {color:#fff;padding:0 10px}
#share {margin-top:-60px;margin-left:auto;}
.postnav {height:2em;line-height:2em;margin:0;margin-bottom:40px;padding:5px;}
.postnav .prv {float:left;padding:0 5px;-moz-box-shadow:0 0 5px #000;box-shadow:0 0 5px #000;-webkit-box-shadow:0 0 5px #000;}
.postnav .nxt {float:right;text-align:right;padding:0 5px;-moz-box-shadow:0 0 5px #000;box-shadow:0 0 5px #000;-webkit-box-shadow:0 0 5px #000;}
.postnav a:hover {color:red}
.postnav .prv:hover, .postnav .nxt:hover {-moz-box-shadow:0 0 3px #000;box-shadow:0 0 3px #000;-webkit-box-shadow:0 0 3px #000}
.pagenav {margin: 20px 0 20px 10px;}
.pagenav a, .pagenav b {background-color:#fff;border:1px solid #bebebe;-moz-box-shadow:0 0 3px #000;-webkit-box-shadow:0 0 3px #000;box-shadow:0 0 3px #000;}
#main .pagenav a:hover {color: #ff1493;}
#main .pagenav b {color:#9400d3}
.pagenav a:link, .pagenav a:visited, .pagenav a:active, .pagenav b {color: #000000;font-weight: bold;padding: 2px 6px;}
.comments {cursor:text;background-color:#fff;border-radius: 4px;-moz-border-radius: 4px;border:1px solid #555;-moz-box-shadow:0 0 5px #000;-webkit-box-shadow:0 0 5px #000;box-shadow:0 0 5px #000;}
.comments h3 {width:100px;padding:15px 10px;color:#FF00FF;}
.comment1, .comment2, .ownercomment {margin: 15px 15px;border-bottom:1px solid #3B5998}
.comment-by {font-size:0.85em;margin:0;color:#FF00FF;}
.comments .text {margin:0 0 0px 72px;color:#0000FF;padding-bottom: 40px;}
.comments pre {font: 12px Calibri,Arial,sans-serif;margin:20px 5px 10px 5px;padding:5px 5px;-moz-box-shadow:0 0 3px 1px #000;-webkit-box-shadow:0 0 3px 1px #000;box-shadow:0 0 3px 1px #000;display: inline-block;max-width: 490px;overflow: auto;}
.comments pre:before {content: 'Code';border-radius: 5px 5px 0 0;-moz-border-radius: 5px 5px 0 0;-webkit-border-radius: 5px 5px 0 0;color: #fff;background-color: #222;margin: -24px 0px 0px -5px;padding: 2px 5px;position: absolute;}
.avatar {float: left;height: 67px;margin: 0 10px 0 0;}
.post embed, .post table, .comments embed {margin-top:10px;max-width:100%;display: block;margin-left: auto;margin-right: auto;}
.avatar a, .avatar span {display: block;padding: 5px;border: 1px solid #bebebe;}
#comment {width:570px;height:150px;margin:10px 0}
.editcomment {font-size:0.8em;margin:0;}
#newcomment h3 { content:"Vui lòng để lại comment. Cám ơn"}

#blogbuttons {position:absolute;top:33px;margin:0;display:inline}
#blogbuttons a {margin:0}
.post .buttons {position:relative;top:40px}
.post .buttons a {margin:10px;float:right}
#main .buttons {float:right;margin-top:-55px}
#action .buttons {margin:0 !important}


#albums li{float:left;width:268px;margin-right:5px;font-size:11px;overflow:hidden;}
.albuminfo{border:1px solid #ccc;background-color:#fff;padding:8px;-moz-border-radius:8px;border-radius:8px;height:200px}
.albumimage img{display:block;width:100%;height:100%}
#albums h3 {padding:0 10px;text-align:center}
#main #albums .buttons{clear:both;margin:auto;width:100%;}
#albums .albumname{font-weight:bold;font-size:13px}
.editimg{margin:6px 0}
.albuminfo:hover{cursor:pointer;text-decoration:none;border:1px solid #999;background-color:#eee}
#albumheader{margin:0 0 6px 0;line-height:1.1;color:#FF00FF;}
.albumdate {margin:0;font-weight:bold}
.albumtags {margin-top:0}
#album-mms {display:none}
#mypix li{float:left;width:256px;margin:5px;font-size:11px;overflow:hidden;border:1px solid #ccc;background-color:#fff;-moz-border-radius:8px;border-radius:8px;}
#mypix li:hover {cursor:pointer;border:1px solid #999;background-color:#eee}
#mypix .thumb{display:block;}
#mypix .thumb img{width:240px;height:180px;margin:8px}
#mypix p {margin-top:0;text-align:center;color:#3B5998;font-weight:bold}
#side #share {margin:0}
#imageproperties {overflow:auto}
#exif dt{color:blue;font-weight:bold}
#exif dd {margin:0}
#imgnav {text-align:center}

.friend-h2{margin-bottom:10px 0 8px 5px;width:80px;}
#myfriends li{float:left;width:180px;height:auto;margin-left:9px;margin-top:10px;font-size:11px;overflow:hidden;padding-bottom:10px;}
#myfriends .first div, #myfriends div{border:1px solid #ccc;-moz-border-radius:8px;border-radius:8px;background-color:#fff;}
#myfriends li a,#myfriends li a:visited{display:block}
#myfriends div:hover{cursor:pointer;border:1px solid #999;background-color:#eee}
#myfriends li .send-msg{padding:10px;text-align:center;margin:0}
#myfriends li a,#myfriends li a:visited{text-decoration:none}
#myfriends img{display:block;width:158px;height:119px;margin:11px 11px 8px 11px}
#myfriends .pagenav{border:none;padding:3px; float:right}
#myfriends .friendname {display:block;padding:0;text-align:center;}
#myfriends .friendstatus {font-size:10px;color:#0000FF;margin:0 10px;font-weight:bold;}

#calendar {width:240px;position:absolute;top:-300px;right:-802px}
#side caption {font-weight:bold;text-shadow:2px 2px 2px #000}
#calendar tfoot {font-weight:bold;text-shadow:0 0 2px #000}
#calendar thead {color:#ff1493;text-shadow:0 0 3px #000}
#calendar tbody td {-moz-box-shadow: 2px 2px 1px #555;box-shadow: 2px 2px 1px #555;-webkit-box-shadow: 2px 2px 1px #555;border:1px solid #bebebe;text-align:center}
#calendar tbody td:hover {-moz-box-shadow:1px 1px 1px #222;box-shadow:1px 1px 1px #222;-webkit-box-shadow:1px 1px 1px #222;cursor:pointer}
#calendar tbody .l {background-color:#ffffa9;}