@charset "utf-8";
body,ul,select,optgroup,td,th {margin: 0; padding: 0; font-family: Arial; font-size: 12px}
a {color: #3367b3; font/-weight: 700; text-decoration: none; transition: all 1s ease }
a:hover {color: #ca1f25;}
.top {height: 100px; width: 1024px; background: #eee url(../images/top-bgr1.jpg)}
.page {mbackg/round: #f00; width: 1024px; text-align: left; font-family: Arial, Helvetica, sans-serif; font-size: 1.1em}
.lo/go {max-width:150px!important}
.logo-l {float: left; margin: 0px 0 0 2% }
.logo-r {float: right; hei/ght: 60px; margin: -20px 150px 0px 10px}
.logo-r1 {float: right; height: 60px; margin: 40px 0 0px 0px}
.lang {float: right; margin: 5px 0 0 0}
.iso {float: right; margin: -55px 50px 0 0px; width: 55px}
.cam {position: relative; float: left; width: 480px; height: 270px; margin: 20px 0 20px 0; overflow: hidden}
.cam-slogan {position: absolute; wi/dth: 100%; top: 140px; left: -50%;
    -webkit-animation-name: caption; /* Safari 4.0 - 8.0 */
    -webkit-animation-duration: 2s; /* Safari 4.0 - 8.0 */
    animation-name: caption;
    animation-duration: 2s;
	animation-delay: 15s;	
	-webkit-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
}
.cam-slogan span {text-transform: uppercase; padding: 0px 10px; mar/gin: 10px 0; line-/height: 30px; font-weight: 700; font-size: 20px; color: #fff; background: rgba(0,0,0,0.3); }
@-webkit-keyframes caption {
    0%   {left: -50%;}
    100% {left: 0;}
}
@keyframes caption {
    0%   {left: -50%;}
    100% {left: 0;}
}
.top-news {float: left; width: 252px; height: 268px; margin: 20px 0 20px 20px; border: 1px solid #3399fe}
.top-news-title {text-align: center; font-weight: 700; color: #fff; line-height: 20px; background: #3399fe}
.top-news marquee {wid/th: 100%; height: 228px; pad/ding: 20px; margin: 10px; bor/der: 1px solid #3399fe}
.top-news marquee a {display: block; margin: 10px 0; text-align: justify;}
.top-tb {fl/oat: left; width: 250px; hei/ght: 230px; padding: 0 0 10px 0; margin: 10px 0 20px 0px; background: #eee; bor/der: 1px solid #f69408; over/flow: scroll}
.top-tb-title {text-align: center; font-weight: 700; color: #fff; line-height: 20px; wi/dth: 100%; background: #d96e26}
.top-tb-lk {disp/lay: block; text-align: justify; margin: 10px;}
.top-tb-lk span {font-size: 10px; color: #666; font-/style: italic}
.banners {margin: 20px 0 20px 0;}
.banners div {margin-bottom: 12px}
.menu-top {position: relative; z-index: 9999; backgrou/nd: #19c589; text-align: left; width: 1024px; height: 30px; pad/ding: 0 0 0 0}
.home-icon {height: 15px; margin: 0px 0 -3px 10px}
.main {background: #fff; padding: 10px}
.main-l {position: relative; z-index: 999; float: left; width: 754px}

.main-l-title {display/: block; wid/th: 367px; height: 23px; background: #eee; margin: 0px 0 10px}
.main-l-title div {float: left; padding: 0 20px; line-height: 20px; color: #ca1f25; font-weight: 700; border-top: 2px solid #ca1f25}
.main-l p {margin: 0 0 10px 0; font-size: 10pt; text-/align: justify}
.main-l i {font-size: 10pt; }
.main-l img {mar/gin: 0 20px 10px 0; max-width: 754px; height: inherit!important}
.main-r {position: relative; z-index: 99; float: right; width: 250px}
.home-title {font-family: "Times New Roman", Times, serif; font-size: 20px; line-height: 75px; }

.opt {display: none; position: absolute; top: 425px; left: calc(50% + 200px);}

#home2, #home3, #home4 {display: none}

.home-news2 {float: left; width: 367px; margin: 0 0 10px 0; text-align: justify}
.home-news2-list-item {fl/oat: left; wi/dth: 142px; margin: 5px 0 }
.home-news2-list-item img {display: none; float: left; width: 100px; margin: 0 10px 10px 0; disp/lay: none;}
.home-news2-list-item:first-child img {display: block; float: left; width: 130px; height: 90px!important; margin: 0 10px 10px 0; disp/lay: none;}
.home-news2-list-item-intro {display: none; margin: 10px 0 0px 0}
.home-news2-list-item:first-child .home-news2-list-item-intro {display: block; margin: 10px 0 0px 0}
.home-news2-list-item a {font-weight: normal; margin: 0px 0 0px 0}
.home-news2-list-item:first-child a {font-weight: 700; margin: 0px 0 0px 0}

.home-news3-list-item {fl/oat: left; wi/dth: 142px; margin: 5px 0; padding-top: 5px; border-bottom: 1px solid #ddd }
.home-news3-list-item:last-child {border-bottom: 0 }
.home-news3-list-item img {display: block; float: left; width: 100px; height: 70px!important; margin: 0 10px 10px 0; disp/lay: none;}
.home-news3-list-item-intro {display: none; margin: 10px 0 0px 0}
.home-news3-list-item a {font-weight: normal; margin: 0px 0 0px 0}


.home-news4 {text-align: justify; margin: 0 0 20px 0}
.home-news4-list-item {clear: both; fl/oat: left; wi/dth: 142px; margin: 5px 0; padding: 10px 0 0px 0; border-bottom: 1px solid #ddd }
.home-news4-list-item:last-child {border-bottom: 0 }
.home-news4-list-item img {display: block; float: left; width: 130px; height: 90px!important; margin: 0 10px 20px 0; disp/lay: none;}
.home-news4-list-item-intro {dis/play: none; margin: 10px 0 0px 0}
.home-news4-list-item a {font-weight: 700; margin: 0px 0 0px 0}




.home-news {float: left; width: 367px; margin: 0; text-align: justify}
.home-news:nth-child(2) {margin: 0 0 0 10px;}
.home-news-list-item:first-child {float: left; width: 215px; min-height: 340px; margin: 0 0 20px 0}
.home-news-list-item:first-child img {display: block; width: 215px; height: auto; max-height: 150px!important}
.home-news-list-item:first-child .home-news-list-item-intro{display: block; margin: 10px 0 0 0}
.home-news-list-item {float: left; width: 142px; margin: 0 0 0 10px }
.home-news-list-item:nth-child(2) img {display: block; width: 142px; height: auto; max-height: 100px!important; margin: 0}
.home-news-list-item img {display: none;}
.home-news-list-item-intro {display: none;}
.home-news-list-item a:nth-child(2) {display: block; font-weight: normal; margin: 10px 0 0px 0}
.home-news-list-item:first-child a {font-weight: 700}
.home-news-list-item:last-child {margin: 0 0 20px 10px}

.home-news-list-item-db {margin: 5px 0; }
.home-news-list-item-db img {float: left; width: 30px; margin: 0px 10px 5px 10px; dis/play: none;}
.home-news-title {display/: block; width: 367px; height: 23px; background: #eee; margin: 0 0 10px}
.home-news-title div {float: left; padding: 0 20px; line-height: 20px; color: #ca1f25; font-weight: 700; border-top: 2px solid #ca1f25}

.home-news-detai-title {float: left; width: 120px; margin: 0 0 10px 0; 
	color: #fff; font-weight: 700; text-align: left; padding: 0 10px}
.home-news-detai-item {margin: 0 0 10px 0}
.home-news-detai-ct {float: left; font-w/eight: 700}
.home-news-detai-ct:before {content: 'Chủ trì đề tài:'}
.home-news-detai-tg {float: right}
.home-db {margin: 10px 0 0 0;}
.home-db li {
	margin: 0 0 0 10px;
	padding: 5px 10px 5px 30px;
	list-style: none;
	background-image: url("../images/logo.png");
	background-repeat: no-repeat;
	background-position: left center;
	background-size: 20px;
}
.toc { float: left; width: 33%; hei/ght: 130px; marg/in-bottom: 20px}
.toc-banners {display: none; margin: 20px 0}
.toc1 {text-align: justify; fl/oat: left; width: 250px; he/ight: 176px; margin: 20px 0 0px 0px; padding: 0 0 10px 0; background: #eee; bor/der: 1px solid #f69408; over/flow: scroll}
.toc1-title {text-/transform: uppercase; text-align: center; font-weight: 700; color: #fff; line-height: 20px; wi/dth: 100%; background: #3367b3}
.toc1 a img {float: left; width: 125px}
.toc1 a:last-child img {float: left; width: 100%}
.toc-info {wi/dth: 150px; margin: 20px 0}
.toc-info a {display: block; margin: 0 0 5px 0; bor/der: 1px solid #e4e4e4; height: 50px; text-align: center}
.toc-info img {flo/at: none; height: 50px; width: auto}
.toc2 {padding: 10px}

table.cellLink td {width: 25px; background:#eee; border: 1px solid #eee; color: #000; text-align: center; text-decoration: none; font-size: 11px; font-weight: regular;}
table.cellLink td a {display:block; padding:5px; background:#fff; co/lor: #ffffff; font-size: 11px; font-weight: regular;}
tabl/e.cellLink td a:hover {width: 25px; background:#767676; color: #ffffff; font-size: 11px; font-weight: regular;}

.list-item261,.list-item262 {float: left; width: calc(50% - 10px); cle/ar: both; ba/ckground:; margin: 20px 0}
.list-item262 {margin-left: 20px}
.list-item {clear: both; margin: 20px 0; text-align: justify}
.list-detail-content p, .content {text-align: justify}
.intro {text-align: left; margin: 20px 0; }
.list-item-img img {float: left; width: 100px; margin: 0 20px 30px 0;}
.list-item-title {font-weight: 700; margin: 0 0px 5px 0;}
.list-item-title span {font-weight: normal; m/argin: 0 0px 5px 0;}
.list-detail-title {font-weight: 700; margin: 10px 0px 0px 0;}
.list-detail-title div {font-weight: normal; margin: 10px 0px 0px 0;}
.list-detail-photo {display: none; margin: 20px}
.list-detail-content img {margin: 0 20px 10px 0; max-width: 754px}
.list-detail-content td img,.content td img {z-index: 9999; margin: 0 20px 10px 0; max-width: 365px; transition: 1s}
.list-detail-content td img:hover,.content td img:hover,.list-detail-content img:hover {width: auto; height: auto; float: none; max-width: 754px}
.list-detail-content table p {margin: 0; text-/align: left; }
.list-detail-content td {padd/ing: 5px 0; max-w/idth: 330px; backgro/und: #ccc}
.list-detail-intro {margin: 10px 0; color: #399507; font-/style: italic}
.list-detail-other {margin: 30px 0 0 0; color: #399507; font-weight: 700; font-/style: italic; border-bottom: 1px solid #ddd}
.content table td p, .content table th p {padding: 0; margin: 0;}
.vien, .y, .vb, .tv {border-collapse: collapse; border-spacing: 0px; border: 1px solid #ddd; width: 100%!important}
.y tr:first-child,.vien tr:first-child,.vien th, .y th, .vb tr:first-child, .tv tr:first-child  {background: #eee; bor/der: 1px solid #ddd}
.vien td, .vien th,.y td, .y th, .vb td, .vb th, .tv td, .tv th {padding: 2px 5px; margin: 0; border-bottom: 1px solid #ddd; border-right: 1px solid #ddd}
.vi/en tr:first-child td, .vien td:first-child, .y td:first-child, .vb td:first-child, .tv td:first-child  {white-/space: nowrap; text-align: center!important}
.vien td:last-child,.y td:last-child, .vb td:last-child, .tv td:last-child {border-right: none}
.vien p,.y p, .vb p, .tv p {text-align:left; margin: 0}
.vb tr:first-child, .tv tr:first-child {font-weight: 700; }

.footer {padding: 20px 0; height: 150px; background: #eee; margin: 20px 0 0 0}
.add {float: left}
.add p {margin: 10px 0}
.add div {margin: 10px 0 0 0 }
.count {float: right}
.count div {di/splay: none; float: right; margin: 50px 0 0 0}
.counter {padding: 10px; background: #dfdfdf; border-radius: 10px}
.counter td {font-size: 10px; font-weight: 700; padding: 0 10px; background: #dfdfdf;}
.counter td:first-child {padding: 0 0px;}
.counter tr:nth-child(2) { border-bottom: 1px solid #fff}
.counter td:nth-child(3) {text-align: right}
table.cont td:first-child {white-space: nowrap;}
table.cont select {height: 25px;}
table.cont input {width: 200px; height: 25px; }
table.cont textarea {margin: 5px 0 10px 0; width: 350px; height: 200px; border: 1px solid #ddd; color: #666}
table.cont input,table.cont select{margin: 5px; border: 1px solid #ddd; color: #666}
table.cont .btn1,table.cont .btn2 {margin: 0px; width: 100px; line-height: 25px; border: none; background: #eee}
table.cont .btn1:hover,table.cont .btn2:hover {background: #cc4c2f; color: #fff}
.lk {margin: 20px 0; padding-/bottom: 10px; background: #eee; }
.lk select {
background: #eee;
color: #333;
border: none;
margin: 0 0 10px 0; padding: 10px; 
width: 250px; height: auto; 
font-weight: 700;
}
.lk select optgroup, .lk select option {text-align: left; backgro/und: #f00;  font-weight: regular}
.lk select option:first-child {font-weight: 700}
.logo-b {text-align: center; display: none}
.logo-b img {wi/dth: auto; hei/ght: 70px; max-height: 70px; max/-width: 55px; margin: 20px 0 10px 0}

.thuvien li {list-style: none; float: left; line-h/eight: 20px; margin: 10px 10px 5px 0; white/-space: nowrap}
.thuvien li a {display: block; color: #666; background: #eee; padding: 5px 10px}
.thuvien li a:hover {background: #ddd; color: #000}
.thuvien form {float: right; mar/gin: 10px 0; text-align: center}
.luutru {width: 30%;}
.afd {float: left; display: block; co/lor: #666; background: #eee; padding: 5px 10px; margin: 5px}
.afd:hover {background: #666; color: #fff}
.yt {width: 100%; height: 424px}
.youtube {
 position:relative;
 padding-bottom:56.25%;
 padding-top:30px;
 height:0;
 overflow:hidden;
 }

.youtube iframe, .youtube object, .youtube embed {
 position:absolute;
 top:0;
 left:0;
 width:100%;
 height:100%;
 }
iframe {max-width: 754px;}

@media screen and (max-width : 760px){
* {font-size: 16px!important}
iframe {width: 100%; height: 30%}
.top {height: 50px; width: 100%; background: #fff;}
.top-tb,.toc1,.lk {text-align: left; width: 94%; height: auto; margin: 10px 3% 20px 3%; background: #eee;}
 {margin: 20px 0 0 0;}
.banners div {margin-bottom: 10px}
.toc-banners, .banners{ width: 222px; margin: auto }
.banners{ width: 250px; margin: 30px auto 0 auto }
.top-tb {padding: 0 0 5px 0; margin-top: 20px}
.top-tb-title {margin: 0 0 5px 0}

.logo-l {float: left; width: 95%; margin: 0px 0 0 5px }
.logo-r {float: right; width: 35%; hei/ght: 60px; margin: -3px 110px 0 0}
.logout {position: absolute; he/ight: 60px; top: 25px; right: 50px;}
.iso {float: right; width: 10%; margin: 0px;}
.cam {displ/ay: none; float: none; width: 100%; height: auto; margin: -50px 0 20px 0}
.cam-slogan {position: absolute; wi/dth: 100%; top: 85px}
.menu-top {width: auto; height: 30px; margin: 50px 0 0 0}
.lang {position: absolute; text-align: right; top: 50px; right: 10px;  }
.lang img {width: 80%; margin: 0}
.top-news {display: none;}
.page {width: auto; font-size: 13px}


.main {background: #fff}
.main-l {float: none; width: 100%; padding: 0px}
.main-l-title {height: auto; background: #fff; margin: 20px 0 10px}
.main-l-title div {float: none; padding: 5px 10px; line-height: normal; color: #ca1f25; font-weight: 700; border-top: 0px solid #ca1f25}
.main-l img {float: none; max-width: 100%;}
.main-r {disp/lay: none; float: none; width: 100%;}
.content {padding: 0 3%}
.content img {margin: auto; max-width: 100%}

.content table,.list-detail table,.vb,.tv {width: 100%!important; border: 0; float: none; margin: auto}
.content table thead, .list-detail table thead,.vb thead,.tv thead {border: none;clip: rect(0 0 0 0);height: 1px;margin: -1px;overflow: hidden;padding: 0;position: absolute;width: 1px;}
.content table tr, .list-detail table tr,.vb tr,.tv tr {border/-bottom: 3px solid #ddd;display: block;margin-/bottom: .625em; margin: 20px 0;}
.content table td, .list-detail table td,.vb td,.tv td {border: 0px solid #f00;display: block;font-size: 13px;width: auto!important; height: auto;margin: 0}
.content table td {text-align: center; }
.content table img, .vb img,.tv img {margin: 20px auto 10px auto!important}
.content table p,.list-detail table p,.vb p,.tv p {text-/align: left; margin: 0; padding: 0}
.content table td:last-child, .list-detail table td:last-child,.vb td:last-child,.tv td:last-child {border-bottom: 0;}
.vien td:first-child, .y td:first-child,.tv tr:first-child {display: none}
.vien td:nth-child(2), .y td:nth-child(2),.tv td:nth-child(2) {font-weight: 700}
.vb td::before, .tv td::before {content: attr(data-label)':\00a0';float: left;font-weight: normal;text-/transform: uppercase;}
.vanban,.thuvien,.ct  {width: 94%; margin: 0 3%}
.vb tr:first-child, .vb td:first-child {display: none}
.vb td:nth-child(2) {font-weight: 700}

.list-item,.list-detail,.list-item261,.list-item262 {clear: both; width: 94%; margin: 20px 3%; border-bottom: 1px solid #ddd; padding: 0 0 10px 0}
.list-item-img {float: left; width: auto; margin: 0 10px 0px 0;}
.list-item-img img {float: none; width: 100px; margin: 3px 0 0 0; border-radius: 5px}
.list-item-title {font-weight: normal; margin: 0 0px 5px 0;}
.list-item-title a {color: #000;}
.list-item-intro {display: none}
.cellLink {margin: 20px 0}
.list-detail-photo {display: none; margin: 20px}
.list-detail-content img,.list-detail-content td img,.content td img {max-width: 99%!important; margin: 10px 0 0 0!important}
.list-detail-content td img:hover,.content td img:hover,.list-detail-content img:hover {width: auto; height: auto; float: none; max-width: 100%}

	.home-news {float: none!important; width: 94%; margin: 20px 3%!important; }
	.home-news-list-item {clear: both; float: none!important; width: auto!important; margin: 0!important; padding: 10px 0!important; backg/round:#eee; border-top: 1px solid #ddd }
	.home-news-list-item:first-child { border-top: 0; min-height: auto; }
	.home-news-list-item img {display: block; margin: 5px 0 10px 0!important; width: 100%!important; height: 100%!important; border-radius: 5px}
	.home-news-list-item:first-child img {height: 100%!important; margin: 5px 0 10px 0!important;}
	.home-news-list-item:nth-child(2) img {height: 100%!important;}
	.home-news-list-item-intro {display: none!important; margin: 5px 0 0 0}
	.home-news-list-item a:first-child {float: left!important; width: 100px; height: 65px; margin: 0px 0 10px 0!important;; m/argin: 0!important; padding: 0!important;}
	.home-news-list-item a:nth-child(2) {float: right!important; width: calc(100% - 110px); font-weight: normal!important; margin: 0!important; padding: 0!important;color: #000}
	.home-news-title {display/: block; width: auto; height: 23px; background: #eee; margin: 0 0 10px}


.add {float: none; padding: 0 10px}
.count {clear: both; float: none; padding: 10px 0; margin: 10px 0}
.counter {width: auto; margin: auto;}
.counter td {font-size: 12px!important}
.count div {float: right; margin: 10px 0 0 0;}
.cont-l {back/ground: #ccc; float: none; width: auto}
.cont-r {back/ground: #eee; float: none; width: auto; margin: 0 }
	table.cont td {display: block; padding: 0!important}
table.cont select {height: 25px;}
	table.cont input {width: 100%!important; height: 30px; margin: 0 0 10px 0!important}
	table.cont textarea {margin:0; width: 100%; height: 200px; border: 1px solid #ddd; color: #666}
	table.cont input,table.cont select{margin: 0px; border: 1px solid #ddd; color: #666}
	table.cont .btn1,table.cont .btn2 {margin: 10px 0!important; width: 100px!important; line-height: normal; padding: 5px; border: none; background: #eee}
table.cont .btn1:hover,table.cont .btn2:hover {background: #cc4c2f; color: #fff}
.logob img {wi/dth: auto; hei/ght: 70px; max-height: 50px; max-width: 55px; margin: 20px 0 10px 0}
.footer {padding: 10px; height: auto; background: #eee; margin: 20px 0 0 0}
.opt {display: none}
.luutru {width: 100%;}
.home--icon {text-align: center; heig/ht: 15px; mar/gin: 0}
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
.p/age {width: 98%!important; padding: 0!important; margin: auto 1%!important}
.mai/n-l {float: left; width: 724px}
.ma/in-r {float: right; width: 220px}
.t/oc {width: 30%}
}