.listMedia{ float:left; width:100%; }
 .innerListMedia{ padding:10px}
 .mediaItem{ float:left; width: 100%; margin-bottom:10px}
 .mediaItem h2{ font-size:1.1em; font-weight:bold; margin:10px 0 ; margin-top:0;}
 .mediaLeft{ float:left; width:30%;}
 .mediaLeft img{ max-width:100%;}
 .mediaBody{ float:left; width:69%; margin-left:1%}
 .shortView{ text-align:justify; width: 98%; float:left; margin:5px 0;}
 .dateTime { font-size:0.85em; color:#bbb}
 .mediaItem h2 a{ text-decoration:none; color:#333}
 
 @media (min-width:768px) {
 /*first item*/
 .listMedia{ }
     .listMedia .mediaItem:first-child{ width: 45%; float:left}
      .listMedia .mediaItem:first-child .mediaLeft{ width:100%; height:200px; overflow:hidden;}
      .listMedia .mediaItem:first-child .mediaLeft .photo img{ width:100%}
      .listMedia .mediaItem:first-child .mediaBody{ width:100%; /*margin-top:-65px;*/ margin-left:0;}
      .listMedia .mediaItem:first-child .mediaBody h2{ font-size:1.3em}
      .listMedia .mediaItem:first-child .detailView{ display:none}
	  
	 .listMedia .mediaItem:nth-child(2){ width: 45%; float:RIGHT}
	  .listMedia .mediaItem:nth-child(2) .mediaLeft{ width:100%; height:200px; overflow:hidden;}
      .listMedia .mediaItem:nth-child(2) .mediaLeft .photo img{ width:100%}
      .listMedia .mediaItem:nth-child(2) .mediaBody{ width:100%; /*margin-top:-65px;*/ margin-left:0;}
      .listMedia .mediaItem:nth-child(2) .mediaBody h2{ font-size:1.3em}
      .listMedia .mediaItem:nth-child(2) .detailView{ display:none}
  
      /*second, third item*/
     /* .listMedia .mediaItem:nth-child(2),
      .listMedia .mediaItem:nth-child(3)
      {
          width:55%; float:left; margin-left:4%
		}*/
       
  }
 
 /*Detail news*/

.detailNews{ width:100%; float:left}
.innerDetailNews img{ max-width:85%;}
.detailNews h1{ font-size:1.2em; margin:5px 0px;}
.function{ width:100%; float:left; border-bottom:solid 1px #ccc; border-top:solid 1px #ccc; padding:5px 0;}
.shareBox{ float:left; margin-left:5px;}
.toolbarBox{ float:right; margin-right:5px;}
.toolbarBox a{margin-right:10px;}
.toolbarBox .glyphicon{ margin-right:5px}
.otherNews{ width:100%; float:left; margin-top:5px;}
.otherNews h3{ font-size:1.1em; border-bottom:solid 1px #ccc; padding-bottom:3px; margin-bottom:5px}
.otherNews ul {  list-style-image:url(../images/li_f.png); margin:0; padding:0; margin-left:15px}
.otherNews ul li a{ text-decoration:none}
.otherNews ul li{}

ul {
display: block;
list-style-type: disc;
-webkit-margin-before: 0em;
-webkit-margin-after: 0em;
-webkit-margin-start: 0px;
-webkit-margin-end: 0px;
-webkit-padding-start: 0px;
}

/*media sidebar */

.mediaS, .itemMediaS{ width:100%; float:left}
.itemMediaS{ border-bottom: solid 1px #ddd}
.innerItemMediaS{ padding:5px; overflow:hidden}
.photoMediaS{ width:50%; float:left}

.photoMediaS img{ padding:3px; border:solid 1px #ccc}
.desMediaS{ width:45%; float:right}
.desMediaS h2{ font-size:12px;}

/*	<div class="mediaS">
	<div class="itemMediaS">
	<div class="innerItemMediaS">
	<div class="photoMediaS"><a><img src="data/hinh1.png" /></a></div>
	<div class="desMediaS"><h2><a>news</a></h2></div>
	</div>
	</div>
	</div>
*/