*{ padding: 0; margin: 0; } 
body { 
    background: #F5F5F5 url(../img/background.png); 
    font-family: 'Roboto Condensed', sans-serif; 
    font-size: 0.98em; 
    padding: 0; 
    margin: 0; 
    }
a {
    color: #555; 
    text-decoration: none;
    }
a:hover {
    color: #555; 
    text-decoration: none;
    }
li {
    color: #036DA7; 
    list-style-type: none; 
    }
#wrap {
    margin: 0 auto; 
    max-width: 1000px; 
    background: #fff;
    clear: both;
    }

#header {
    height: 248px; 
    background: #005500 url(../img/header-bg.png) no-repeat; 
    margin: 0 0 20px 0;border-top: 1px solid #000000; 
    position: relative
    }
#header a {
    color: #fff; text-decoration: none;
    }
#header h1 {
    position: absolute; 
    top:115px; 
    left: 80px; 
    width: 250px; 
    padding: 0px;
    margin: 0px; 
	letter-spacing: 2px;
    font-size: 2.5em; 
    font-weight: lighter;  
    display:block; 
    text-align: left;}
#header h1 a, #header h1 a:active, #header h1 a:visited, #header h1 a:hover {
    text-decoration: none; 
    }
#header .current{
    font-weight: bold;
    }
#header .cl_red {
    color: #FF8040
    }
#header .cl_green {
    color:#00FF40
    } 
#header .cl_blue {
    color:#0080FF
    }  

#header #topmenu {
    width:28%;
    height:36px;
    padding: 0px; 
    margin-right: 0px; 
    margin-bottom:0px; 
    float: right;
    overflow: hidden;
    position: absolute; 
    bottom:0px; 
    right:0px;
    background: #FFC6AA;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=85)";       /* IE 8 */
    filter: alpha(opacity=85);  /* IE 5-7 */
    -moz-opacity: 0.85;          /* Netscape */
    -khtml-opacity: 0.85;        /* Safari 1.x */
    opacity: 0.85;               /* Good browsers */
    -webkit-border-top-left-radius: 8px;
    -moz-border-radius-topleft: 8px;
    border-top-left-radius: 8px;
 }


#header #topmenu ul {
    margin: 0px; 
    padding: 0px; 
    font-size: 0.95em;
    }
#header #topmenu li {
    display: inline;
    list-style: none;	
    margin: 0px; 
    padding: 0px;
    line-height: 36px;
    }
#topmenu li a, #topmenu li a:visited, #topmenu li a:active {
    display: block;	
    color: black;
	text-decoration: none;	
    float: left; 
    margin: 0px 5px 0px 20px;
    padding: 0px
    }
#header #topmenu li a:hover {
    text-decoration: none; 
    color: Red;
    }

#sidebar {
    width: 26.5%; 
    float: right; 
    background: #FFF; 
    color: #666;
    margin: 1.5%;
    overflow: hidden;
	display: block;
    }
#sidebar ul{
    padding: 0px 0px 0px 0px;
    }  
#sidebar .box { 
    margin-bottom: 10px; 
    padding: 10px 3px; 
    color: #666; 
    }
#sidebar h2 { 
    font-size: 1.15em; 
    font-weight: 100; 
    padding: 3px; 
    color: #555
    }
#sidebar a:hover {
    text-decoration-line: underline;
    text-decoration: underline;
    }
#sidebar .links li {
    border-bottom: 1px dotted #aaaaaa;
    margin: 0px; 
    padding: 18px 0px 0px 0px;
    font-style: italic;
    font-size:0.96em
    }
#sidebar .links li a, #sidebar .links li a:visited, #sidebar .links li a:active {
	display: block;
    margin: 0px 0px 0px 0px;
    text-decoration: none;
    color: #0000ff; 
    float: none
    }
#sidebar .links li a:hover {text-decoration: none;color: #000000;display: block}

.h2_menu:before{
    content: "Danh sách bài viết";
}


#content {
	width: 68.5%; 
	margin-left: 1.5%;
	text-align: justify; 
	color: #555; 
	overflow: hidden; 
	display: block;
	float: left;
}
#content #dv_chia_se{clear: both; height: 22px; margin: 5px 0px 20px 0px; padding: 0px}
#content #dv_chia_se .fb-like {margin: 1px 0px 1px 0px; padding:0px; width: 150px; float: left}
#content #main_content h2 {color: #555; font-size: 1.5em; font-weight: 200; text-align: center; 
            display: block; margin: 0px 0px 20px 0px; text-transform: uppercase;}
#content #main_content p {margin: 10px 0px 20px 0px; line-height: 20px; text-indent: 30px}
#content #main_content img {border: none; max-width:680px; margin: 10px auto; text-align:center; display: block;}
#content #main_content .cl_video {text-align: center;}
/** Hiển thị vùng comments **/

#div_binh_luan{width: 100%; padding: 0px;clear: both; margin: 0px; overflow: hidden;}
#div_binh_luan #div_comments {margin-top: 10px;padding:0px}
#div_binh_luan .cm_page{width:98%;margin:2px auto; padding:2px;}  

/** Hiển thị mỗi comments **/
#div_binh_luan .cm_page .cl_comm {border-top: 1px solid #CCC; padding: 5px 0px 5px 0px; margin:0px} 
#div_binh_luan .cm_page .cl_comm p {padding: 2px 0px 5px 0px; margin: 0px; line-height: 18px;line-height:20px; font-size: 0.98em;}
#div_binh_luan .cm_page .cl_comm .cl_time {font-size: 0.80em;color:#777}
#div_binh_luan .cm_page .cl_comm p:last-child{ font-style: italic; text-indent: 30px}

 /** Page nav **/
#div_page_nav {height:25px;text-align:center; margin:10px 0px 2px 0px; clear: both; padding-top: 0px; font-weight: bold; background-color:#f7f7f7}
.jPaginate{height:30px; position:relative;  color:#a5a5a5;  font-size:small;  width:100%; padding: 0px}
.jPaginate a{  line-height:15px;  height:18px; cursor:pointer;  padding:2px 5px;  margin:2px;  float:left;}
.jPag-control-back{	position:absolute;left:0px;}
.jPag-control-front{position:absolute;top:0px;}
.jPaginate span{  cursor:pointer;}
ul.jPag-pages{ float:left;  list-style-type:none;  margin:0px ;  padding:0px;}
ul.jPag-pages li{ display:inline; float:left;  padding:0px;  margin:0px;}
ul.jPag-pages li a{ float:left;  padding:2px 5px;}
span.jPag-current{  cursor:default;  font-weight:normal;  line-height:15px;  height:18px;  padding:2px 5px; margin:2px;  float:left;}
ul.jPag-pages li span.jPag-previous,
ul.jPag-pages li span.jPag-next,
span.jPag-sprevious,
span.jPag-snext,
ul.jPag-pages li span.jPag-previous-img,
ul.jPag-pages li span.jPag-next-img,
span.jPag-sprevious-img,
span.jPag-snext-img{  height:24px;   margin:3px;   float:left;  line-height:18px;}

ul.jPag-pages li span.jPag-previous,
ul.jPag-pages li span.jPag-previous-img{
    margin:2px 0px 2px 2px;  font-size:12px;  font-weight:bold;  width:10px;}
ul.jPag-pages li span.jPag-next,
ul.jPag-pages li span.jPag-next-img{
    margin:2px 2px 2px 0px;  font-size:12px;  font-weight:bold;  width:10px;}
span.jPag-sprevious,
span.jPag-sprevious-img{
    margin:2px 0px 2px 2px;  font-size:18px; width:15px; text-align:right;}
span.jPag-snext,
span.jPag-snext-img{margin:2px 2px 2px 0px;  font-size:18px; width:15px;  text-align:right;}
ul.jPag-pages li span.jPag-previous-img{background:transparent url(../images/previous.png) no-repeat center right;}
ul.jPag-pages li span.jPag-next-img{  background:transparent url(../img/next.png) no-repeat center left;}
span.jPag-sprevious-img{  background:transparent url(../img/sprevious.png) no-repeat center right;}
span.jPag-snext-img{  background:transparent url(../img/snext.png) no-repeat center left;}


/** Viết comments **/
#div_writer{width: 100%; padding: 0px; margin: 10px 0px 0px 0px;}
form {margin: 10px 0px 0px 0px; padding: 0px ;background-color: #f5f5f5; width: 100%;}
input {border:1px solid #d5d5d5;padding:4px;font-family: arial, helvetica, sans-serif;font-size: 14px;color: #1e1e1e;
        margin: 10px 0px 10px 0px;}
textarea {border: 1px solid #d5d5d5;padding: 4px;font-family: arial, helvetica, sans-serif;
	font-size: 14px;color: #1e1e1e; margin: 0px 10px 10px 0px; width: 95%;max-width: 96%;max-height:40px; min-height: 20px; min-width: 80%;}
 form p{margin-left: 10px;}
#id_formbutton {background: #e5e5e5; padding: 5px 15px 5px 15px; margin: 0px 0px 10px 10px}
#id_formbutton :hover {background: #d5d5d5;text-decoration:underline;}
#alert_red {margin-left:  20px;color: red}
#id_formbutton :disabled {cursor:not-allowed; background: #dddddd; color: gray;}

/* GOOGLE AD */
#google_ad {
	margin: 1.5% 1.5% 0 0;
	float: right;
	width:26.5%;
	display: block;
	max-height: 400px;
	padding: 0;
}

/*  FOOTER */
#footer {clear: both; background:white; text-align: center; padding: 10px; margin: 10px 0px; 
        color: #b2b2b2; border-top:2px solid #326363; font-size: 0.8em;}
#footer a, a:hover , a:visited {text-decoration: none;color: #b2b2b2}

     /** Style mobile  **/
@media screen and (max-width: 800px)
            {
    #google_ad {
		margin: 1.5% auto;
		width: 90%;
		max-width: 600px;
		max-height: 300px;
		float: none;
		clear: both;
	}						
    #wrap {
        width: 100%;
        }
    #content {
		width: 97%;
        margin:0 1.5% 1.5% 1.5%; 
        font-size: 1.08em;
		clear: both;
		
    }
    #content #main_content img {
        border: none; 
        max-width:80%; 
        margin: 10px auto; 
        text-align:center; 
        display: block;
        }
   #content #main_content h2 {
        font-size: 1.2em; 
        font-weight:bold
        }
   #header {
    height: 200px;
    margin: 0 0;
    }
    #header h1 { 
        font-size: 1.8em; 
        width:250px ; 
        top:100px; 
        left: 50px
        }
    #header #topmenu {
        width:270px;
        height:45px;
        }
    #header #topmenu ul { 
        font-size: 1em;
        }
    #header #topmenu li {
        line-height: 45px;
        }
    #sidebar {
        background: #E8E8E8; 
        color: #666;  
        overflow: hidden; 
        float: none; 
        padding: 0px 0px 0px 0;
        border-bottom: solid 1px gray;
        margin:0 0 20px 0;
        width: 100%
        } 
    .h2_menu:before{
        content: "MENU";
    }
    #sidebar ul li {
        position:relative; 
        list-style: none; 
        padding:0 20px
        }
    #sidebar ul li ul {
        display: none
        }
    #sidebar ul li:hover ul {
        display: block; 
        background:#C8C8C8
        }
    #sidebar ul li a:hover + .hidden, .hidden:hover {
        display: block; 
        background:#C8C8C8
        }
    #sidebar ul li a:hover ul {
        display: block;  
        background:#C8C8C8
        }
    #sidebar ul li ul li a:hover {
        display: block; 
        background:#C8C8C8
        }
    #sidebar .links li {
        font-size:1em
        }
}