@font-face {font-family: 'cs_chatthaiuiregular';src: url('font/cschatthaiui-webfont.eot');src: url('font/cschatthaiui-webfont.eot?#iefix') format('embedded-opentype'),     url('font/cschatthaiui-webfont.woff2') format('woff2'),     url('font/cschatthaiui-webfont.woff') format('woff'),     url('font/cschatthaiui-webfont.ttf') format('truetype'),     url('font/cschatthaiui-webfont.svg#cs_chatthaiuiregular') format('svg');font-weight: normal;font-style: normal;}

body{ font-family:'cs_chatthaiuiregular',Tahoma, Geneva, sans-serif;
background:#fafafa;}
.row{margin-left:0;}


.req{color:#F00;}

/* header */
header{background:#fff;}

/* nav bar */
.navbar .container{max-width: 1170px;}
.navbar-inverse .navbar-inner{background:#2a8fd4;border: 0;border-radius: 0;}
.navbar-inverse .nav > li > a{ font-size:16px;color:#fff;font-family:'Prompt',Tahoma, Geneva, sans-serif;
transition:all .2s linear;-moz-transition:all .2s linear;-webkit-transition:all .2s linear;-o-transition:all .2s linear;-ms-transition:all .2s linear;}
.navbar-inverse .nav > li > a:hover{ background:#1e6e9b;}
.navbar-inverse .divider-vertical {
    border-right-color: #e6e6e6;
    border-left-color: #e6e6e6;
}
.navbar-inverse .nav li.dropdown > .dropdown-toggle .caret {
    border-top-color: #fff;
    border-bottom-color: #fff;
}
.pull-right .dropdown-menu{left:0!important;max-width: 200px;}

/* content */
.warp .container{ background:#fff; padding:15px; min-height:400px;
margin:50px auto;
-webkit-box-shadow: 0px 0px 50px 10px rgba(0, 0, 0, 0.05);
-moz-box-shadow: 0px 0px 50px 10px rgba(0, 0, 0, 0.05);
box-shadow: 0px 0px 50px 10px rgba(0, 0, 0, 0.05);}
.content-album{margin-bottom:25px; font-size:16px; line-height: 32px;}

/* login */
.warp .container.login{background:url(../img/bg-login.jpg) #fff no-repeat top left; min-height:450px; background-size:auto 100%;}


legend{font-family:'Prompt',Tahoma, Geneva, sans-serif; background:#c4d7ed; padding:0; width:auto; font-size:18px; width:100%; position:relative; text-indent:15px;}


/* login */
.login h1{font-family:'Prompt',Tahoma, Geneva, sans-serif;padding:0 15px; font-weight:normal;font-size:25px;}

/* list photo */
.thumbnails{margin: auto;}
.thumbnails > li{margin:1%;}
.thumbnails > div{width:100%; position:relative; overflow:hidden;}

/* list photo */
.home .thumbnails > li{width:19%;margin:0.5%;}
.home .thumbnails > li img{width:100%;}
.entry-title{font-family:'Prompt',Tahoma, Geneva, sans-serif; color:#006; font-size:30px; font-weight:normal; padding:15px; margin:0; border-bottom:1px solid #e5e5e5;}
.nav-meta{padding:15px; margin-bottom:25px; width:100%; position:relative;}

/* list album */
.home .album.thumbnails > li{width:24%;margin:0.5% 0.33%; display:inline-block; float:none; vertical-align:top;}
.home .album.thumbnails > li img{width:100%;}
.home .album.thumbnails > li a:hover{text-decoration:none;}
.gallerytitle{font-family:'Prompt',Tahoma, Geneva, sans-serif; color:#006; font-size:18px; line-height:25px; padding:10px 5px;}
.home .album.thumbnails > li a:hover .gallerytitle{color:#00F;}
.home .album.thumbnails .pic-meta{color:#a1a1a1; padding:0 5px;}
.row-download{margin:25px 0;}
.row-search{text-align:center; background:#c5d7ed; padding:5px 15px 5px; margin-bottom:25px;}
.row-search h2{font-family:'Prompt',Tahoma, Geneva, sans-serif; color:#424242;font-size:20px; font-weight:normal;}
.row-search .btn{margin-top:-10px;}
.pagination > ul{margin-top:5px; margin-left:5px;}
.home .thumbnails .actionButtons{position: absolute;margin-top: -35px;margin-left: 15px;border: 0;}
.home .thumbnails .imageSelection.label{background-color: #000;}
.home .thumbnails .imageSelection.label-warning{background-color:#f89406;}
.home .nav-download{ width:100%; padding:0; margin:0; list-style:none; min-height:50px; display:block; overflow:hidden;}
.home .nav-download > li {float: none;width: auto; margin-right:15px; margin-bottom:10px;float: left;}
.home .nav-download > li > a{border:0;}


/* comment */
.row-first-cm{padding:15px 15px 5px; margin-bottom:20px; font-size:18px; border-bottom:3px solid #f4f4f4;}
.row-first-cm i{font-size:22px;}
.row-first-cm i.fa-comment-o{margin-left:50px;}
.textarea-cooment{width:98%; background:#fafafa; border:0;}
.list-comment{}
.item-cm{border-bottom:1px solid #e9e9e9; padding:15px 15px 0;
transition:all .2s linear;-moz-transition:all .2s linear;-webkit-transition:all .2s linear;-o-transition:all .2s linear;-ms-transition:all .2s linear;}
.item-cm:hover{background:#fffcde;}
.item-cm p{font-family:'Prompt',Tahoma, Geneva, sans-serif; font-size:14px;}
.cm-text{color:#9b9b9b; margin-left:25px;}
.row-comment-pic .textarea-cooment{width:90%;}
.row-comment-pic .item-cm p{font-size:13px;}
.row-comment-pic .row-first-cm{font-size:14px;}
.btn-like::before {content: "\f08a";display: inline-block;
font: normal normal normal 14px/1 FontAwesome;font-size: 14px;font-size: inherit;text-rendering: auto;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; font-size:23px; color: #333;}
.btn-unlike::before {content: "\f004";display: inline-block;
font: normal normal normal 14px/1 FontAwesome;font-size: 14px;font-size: inherit;text-rendering: auto;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; font-size:23px; color:#F00;}
.del-comment{float:right; color: #CCC;}
.del-comment:hover{color: #06C;}

/* view photo */
.photo-title{font-family:'Prompt',Tahoma, Geneva, sans-serif; color:#555; font-size:21px; font-weight:normal; padding:15px 0; margin:0 0 10px; border-bottom:1px solid #e5e5e5;line-height: 30px;}
.nav-meta{color:#90949c;}
.pic-meta{color:#cacaca;}
.desc_pic {padding:20px 0;color:#898989; font-size:15px; line-height:24px;}

#cboxPrevious{ width:59px!important; height:62px!important;background:url(../img/prev_larg.png)!important;bottom: 45%!important; opacity:0.6!important;}
#cboxNext{ width:59px!important; height:62px!important; background:url(../img/next_larg.png)!important;bottom: 45%!important;left:60%!important;opacity:0.6!important;}
#cboxNext:hover,#cboxPrevious:hover{background-position:inherit!important;opacity:1!important;}
#cboxCurrent{left:0px!important;}

/* footer */
footer{background:url(../img/bg-footer.jpg) #fff no-repeat top center; background-size:100% auto;padding:25px 0 15px; border-top:3px solid #2791cb;}
footer h2,footer h3{font-family:'Prompt',Tahoma, Geneva, sans-serif; font-weight:normal; padding:0; margin:0; color:#fff;}
footer h2{font-size:30px;}
footer h3{font-size:20px;}

@media all and (max-width:1200px){
	.seed-social{ width:100%; text-align:center;}

}
@media all and (max-width:992px){
	.home .album.thumbnails > li{width:32%;}
	.row-pic-show .span8,.row-pic-show .span4{width:100%!important; margin-left:0; margin-right:0;}
	.row-pic-show .span4{padding:0 15px;}
	#cboxNext{ left:inherit!important; right:0%!important;}
	#cboxPrevious,#cboxNext{bottom:inherit!important; top:50%!important;}
	.navbar-inverse .nav-collapse .nav > li > a, .navbar-inverse .nav-collapse .dropdown-menu a {color: #fff;}
	.row-login{width:100%;}
	.warp .container.login{min-height:inherit; background-size:100% auto; padding-top:40%; background-color:#6daeec; color:#fff;}
	footer{background-size:auto 100%;}
}
@media all and (max-width:767px){
	body{padding:0;}
	.home .thumbnails > li{width:24%;float: left;}
	footer .container{padding-left:15px; padding-right:15px; text-align:center;}
	.seed-social a{padding:0!important;}
	.seed-social .facebook a{padding-top:4px!important;}
	.entry-title{font-size:24px; line-height:30px;}
	.warp .container{margin:0;}
	.row-search h2{font-size:16px; line-height:24px;}
	.row-search .btn{margin:0;}
	.gallerytitle{font-size:16px;line-height: 23px;}
}
@media all and (max-width:615px){
	.home .thumbnails > li{width:32%;float: left;}
	.home .album.thumbnails > li{width:48.5%;}
	#cboxNext{width: 39px!important;height: 41px!important;background: url(../img/next_medium.png)!important;}
	#cboxPrevious{width: 39px!important;height: 41px!important;background: url(../img/prev_medium.png)!important;}
	footer h2{font-size:25px;}
	footer h3{font-size:16px; margin-top:-15px;}
	footer{padding: 15px 0 5px;}
}
@media all and (max-width:480px){
	header img{max-width:85%;}
	.home .thumbnails > li{width:49%;float: left;}
	.home .album.thumbnails > li{width:99%; margin-bottom:2%;}
	.login .form-horizontal .controls input[type="text"], 
	.login .form-horizontal .controls input[type="password"]{width:90%;}
	#cboxPrevious,#cboxNext{top:18%!important;}

}
@media all and (max-width:420px){
}
@media all and (max-width:380px){
}