/* =============================================================================
   Subject: Funnybeny
   Author: jehun@benife.com
   Update: 2013-11-16
   ========================================================================== */
  
/*@import url("common.css");*/
@import url("notosanskr.css");
@import url("material-icons.css");

body,h1,h2,h3,h4,h5,h6 {
   font-family: Noto Sans KR, sans-serif;
}
/* =============================================================================
   Helper Styles
   ========================================================================== */
.pull-left{
  float: left;
}
.pull-right{
  float: right;
}
.hide{
  display: none;
}
.show{
  display: block;
}
.invisible {
  visibility: hidden;
}
.hide-text {
  font: 0/0 a;
  color: transparent;
  text-shadow: none;
  background-color: transparent;
  border: 0;
}
.relative {
  position: relative;
}
.clearfix {
  *zoom: 1;
}
.clearfix:before,
.clearfix:after {
  display: table;
  line-height: 0;
  content: "";
}
.clearfix:after {
  clear: both;
}
.hide-text {
  font: 0/0 a;
  color: transparent;
  text-shadow: none;
  background-color: transparent;
  border: 0;
}
.clear{
  float:none;
  clear:both;
  margin:0;
  padding:0;
}
.center{
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}
.text-left{
  text-align: left;
}
.text-right{
  text-align: right;
}
.text-center{
  text-align: center;
}
.width-100{
  width: 100px;
}
.h30{
  height: 30px;
}
.muted {
  color: #999999;
}
a.disabled {
	color: #999999;
	cursor:default;
}
.help-desc{
  margin-left: 5px;
  color: #888888;
}
.container{
	position: relative;
  z-index: 1003;
}
.rounded-container{
  padding: 5px 20px 20px 20px;
  border:1px solid #e0e0e0;
  background: #FFFFFF;
  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;       
  -webkit-box-shadow: 0px 0px 9px rgba(0, 0, 0, 0.1);
     -moz-box-shadow: 0px 0px 9px rgba(0, 0, 0, 0.1);
          box-shadow: 0px 0px 9px rgba(0, 0, 0, 0.1);         
}
.divider-horizon{
  width: 100%;
  margin: 20px 0 20px 0;
  border-bottom: 1px solid #EEEEEE;
}
.divider-vertical{
  margin-top: -10px;
  width:1px;
  height:160px;
  background: #CCCCCC; /* Old browsers */
  /* IE9 SVG, needs conditional override of 'filter' to 'none' */
  background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjIwJSIgc3RvcC1jb2xvcj0iI2NjY2NjYyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjgwJSIgc3RvcC1jb2xvcj0iI2NjY2NjYyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZmZmZmYiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
  background: -moz-linear-gradient(top,  #ffffff 0%, #cccccc 20%, #cccccc 80%, #ffffff 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(20%,#cccccc), color-stop(80%,#cccccc), color-stop(100%,#ffffff)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top,  #ffffff 0%,#cccccc 20%,#cccccc 80%,#ffffff 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  #ffffff 0%,#cccccc 20%,#cccccc 80%,#ffffff 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  #ffffff 0%,#cccccc 20%,#cccccc 80%,#ffffff 100%); /* IE10+ */
  background: linear-gradient(to bottom,  #ffffff 0%,#cccccc 20%,#cccccc 80%,#ffffff 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-8 */
}

div.message-no-data h4{
  padding: 80px 0;
}

.none-underline:hover {
	text-decoration: none;
}
.text-blogandme {
	color:#5AC8E4 !important; 
}
/* Modal */
.modal .close{
  display: block;
  width: 24px;
  height: 24px;
  line-height: 24px;
  margin-top: 8px;
  padding:0;
  font-size: 35px;
  font-weight: 100;
  vertical-align: middle; 
}
.modal-body{
  padding: 10px 20px 10px 20px
}
div.message{ 
  font-size: 13px;
}
.message-error,
.error{
  font-weight: bold;
  color: #b94a48;
}
.message-valid,
.valid{
  color: #468847;
}
.color-like{
  color: #5ac8e4;
  border-color: #5ac8e4;
}
.color-like-d{
  color: #5ac8e4;
  border-color: #5ac8e4;
}

.username{
  color: #222222;
}

.char-limit-wrapper{
  margin-top: -10px;
}

.well-large{
  padding: 0 24px 15px 24px;
}

.rep-points{
  display:inline-block;
  cursor: default;
  margin: -2px 0 0 0;
  padding: 1px 4px 1px 4px;
  font-family: "Arial";
  font-size: 13px;
  height: 14px;
  line-height: 15px;
  vertical-align: middle;
  color: #ffffff;
  /*background: #5ac8e4;
   text-shadow: 0 1px 2px #707070;*/
  background: #bababa;
  /*text-shadow: 0 1px 1px rgba(0,0,0,0.15);*/
  -webkit-border-radius:3px;
     -moz-border-radius:3px;
          border-radius:3px;
}

.list > li,
.list-item{
  display: block;
  margin: 0 0 10px 0;
  padding: 10px;
  min-height: 20px;
  border: 1px solid #ffffff;
  -webkit-border-radius:5px;
     -moz-border-radius:5px;
          border-radius:5px;
}
.list > li:hover,
.list-item:hover{
  border: 1px solid #e2e2e2;
  /*background-color: #f0f0f0;*/
  cursor: pointer;
}
.list > li:hover .user-pic img,
.list > li:hover .user-pic-small img,
.list > li:hover .user-pic-large img,
.list > li:hover .user-pic-xlarge img,
.list > li.active .user-pic img,
.list > li.active .user-pic-small img,
.list > li.active .user-pic-large img,
.list > li.active .user-pic-xlarge img,
.list-item:hover .user-pic img,
.list-item:hover .user-pic-small img,
.list-item:hover .user-pic-large img,
.list-item:hover .user-pic-xlarge img,
.list-item:hover .blog-profile-pic img{
  z-index: 0;
}
.list > li:active,
.list > li.active{
  border: 1px solid #d2d2d2;
  background: #dcdcdc;
}
.list-thumb, 
.list-column{
  display: table-cell;
  vertical-align: top;
}
.list-content{
  display: table-cell;
  vertical-align: top;
  padding: 2px 0 0 15px;
  font-size: 14px;
  overflow: hidden;
  word-break: break-all;
}
.list-content .contents{
  display: inline-block;
  color: #444444;
}
.list-content .username{
  color: #222222;
}
.list-content .post-title{
  font-weight: normal;
  color: #101010;
}
.list-content .date{
  font-size: 12px;
  color: #808080;
}
/* =============================================================================
   App download banner
   ========================================================================== */
#bannerUpsellContainer{ 
	background-color:#5ac8e4; 
	color:#ffffff;
	border-radius:5px;
	margin:5px;
	padding:20px 0 15px;
	text-align:center;
}
#bannerUpsellContainer .title{ font-size:16px;font-weight:bold; } 
#bannerUpsellContainer .subtitle{ font-size:13px;margin:5px 0 10px; }
#bannerUpsellContainer .open-in-app{ -webkit-box-shadow:none;box-shadow:none; }
#bannerUpsellContainer .banner-upsell-close { position:absolute; top:10px; right:10px; }
#bannerUpsellContainer .banner-upsell-close button { font-size:25px; }

/* =============================================================================
   Top navigation
   ========================================================================== */
.category li{
  display:block;
  font-size: 14px;
  margin: 3px 0 2px 0;
}
.category a {
  color: #101010;
}
.category a > .desc{
  margin-top: -2px;
  font-size: 12px;
  color: #777777;
}
.feed-header{
  display: block;
  min-height: 10px;
  min-width: 200px;
}
.feed-header .wrapper{
  margin: 25px auto;
}
.feed-header h1,
.feed-header h2,
.feed-header h3,
.feed-header h4{
  display: block;
  margin: 20px 0 20px 0;
  text-align: center;
  min-height: 40px;
  line-height: 40px;
  font-weight: 600;
  font-family: "Nanum Gothic", "Malgun Gothic", "AppleGothic", "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: #606060;
  text-shadow: 0 2px 4px rgba(0,0,0,0);
  text-transform:none ;
}

/* =============================================================================
   Top navigation 
   ========================================================================== */
.navbar{
  margin-bottom: 0;
}

/* =============================================================================
   Side navigation 
   ========================================================================== */
button.sidebar-control{
  position:absolute;
  left: 240px;
}
.sidebar-nav{
  position:absolute;
  left: 0px;
  top: 0px;
  bottom: 0px;
}
.sidebar-nav.visible-desktop{
  display: block; /* default show nav panel */
  z-index: 1; /* default show nav panel */
}
.sidebar-nav .sidebar-nav-inner{
  position: relative;
  height:100%;
  width: 18em;  
  top: 0px;
  bottom: 0px;
  background-color: #1E222A;
  background-color: rgb(30,34,42);
  -webkit-box-shadow: inset -4px 0 4px rgba(0,0,0,.15);
     -moz-box-shadow: inset -4px 0 4px rgba(0,0,0,.15);
          box-shadow: inset -4px 0 4px rgba(0,0,0,.15);
}
.sidebar-nav .top{
  padding: 12px 14px 15px 14px;
  background-color: rgb(42, 45, 55);
  background-color: #2A2D37;
  border-bottom: 1px solid rgba(0,0,0,0.5);
  border-bottom: 1px solid #111111 \9;
}
.sidebar-nav div.brand-section{
  display: block;
  height: 45px;
}
.sidebar-nav .site-name{
  top: 0;
  left: 0;
}
.sidebar-nav .site-name > span.logo{
  top: -6px !important;
  left: -2px !important;  
}
.sidebar-nav .beta{
  position: absolute;
  top: 10px;
  left: 120%;
}
.sidebar-nav .navbar-search{
  display: block;
  height: 30px;
  width: 95%;
}
/*.nav .navbar-search .search-query,*/
.sidebar-nav .navbar-search .search-query {
  background-color: rgb(30,34,42);
}
.sidebar-nav .user-section{
  display:block;
  height: 32px;
  line-height: 32px;
  margin-top: 13px;
}
.sidebar-nav .user-section a{
  color: #f0f0f0;
  text-decoration: none;
}
.sidebar-nav .user-section ul.dropdown-menu a{
  color: #333333;
}
.sidebar-nav .user-section a:hover{
  color: #5ac8e4;
}
.sidebar-nav .user-section ul.name{
  margin-left: 6px;
  margin-top: 3px;
}
.sidebar-nav .user-section ul.name > li{
  list-style: none;
  display: block;
  line-height: 18px;
}
.sidebar-nav .user-section .fullname{
  max-width: 120px;
}
.sidebar-nav li.user-section .user-actions{
  margin-right: 15px;
  margin-top: -28px;
  z-index: 1;
}
.sidebar-nav li.user-section a:hover{
  background-color: rgb(30,34,42);
}
.sidebar-nav .badge{
  color: #cccccc;
  font-weight: normal;
  background-color: #474954;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
     -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
          box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;
}
.sidebar-nav .badge.active{
  color: #ffffff;
  background: #00C7E2;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#00C7E2), to(#009CB1));
  background-image: -webkit-linear-gradient(top, #00C7E2, #009CB1);
  background-image: -ms-linear-gradient(top, #00C7E2, #009CB1);
  background-image: -moz-linear-gradient(top, #00C7E2, #009CB1);
  background-image: -ms-linear-gradient(top, #00C7E2, #009CB1);
  background-image: -o-linear-gradient(top, #00C7E2, #009CB1);
  background-image: linear-gradient(top, #00C7E2, #009CB1);
  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
     -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
          box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1); 
}
.sidebar-nav .nav-list{
  padding-right: 0;
  padding-left: 0;
}
.sidebar-nav .nav-list > li{
  margin-top: 0;
  line-height: 22px;
  font-size: 12px;
  border-bottom: 1px solid #181818 \9;
  border-bottom: 1px solid rgba(255,255,255,0.04);
  -webkit-box-shadow: inset 0 -1px 0 rgba(0,0,0,0.15);
     -moz-box-shadow: inset 0 -1px 0 rgba(0,0,0,0.15);
          box-shadow: inset 0 -1px 0 rgba(0,0,0,0.15);
}
.sidebar-nav .nav-list > li.last-child{
  border-bottom: none;
}
.sidebar-nav .nav-list > li a:hover {
  color: #ffffff;
  background-color: rgb(44,48,60);
}
.sidebar-nav .nav-list > li > a,
.sidebar-nav .nav-list .nav-header {
  margin-right: 0;
  margin-left: 0;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.8);
}
.sidebar-nav .nav-list > li > a {
  color: #bbbbbb;
  padding: 3px 30px 3px 15px;
}
.sidebar-nav .nav-list > .active > a,
.sidebar-nav .nav-list > .active > a:hover {
  color: #ffffff;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#00C7E2), to(#009CB1));
  background-image: -webkit-linear-gradient(top, #00C7E2, #009CB1);
  background-image: -ms-linear-gradient(top, #00C7E2, #009CB1);
  background-image: -moz-linear-gradient(top, #00C7E2, #009CB1);
  background-image: -ms-linear-gradient(top, #00C7E2, #009CB1);
  background-image: -o-linear-gradient(top, #00C7E2, #009CB1);
  background-image: linear-gradient(top, #00C7E2, #009CB1);
}

.sidebar-nav .nav-list > li > a > span.blog-name {
	width:152px;
	height: 22px;	
	display:inline-block;
	overflow:hidden;
	white-space:nowrap;
	text-overflow:ellipsis;
}
.sidebar-nav .nav-list [class^="icon-"],
.sidebar-nav .nav-list [class*=" icon-"] {
  margin-right: 2px;
}
.sidebar-nav li.nav-header {
  padding: 0 15px 0 15px;
  color: #888888;
  font-weight: normal;
  font-size: 0.9em;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.05);
  background: rgb(42, 45, 55);
  border-bottom: 1px solid #191919;
}
/* cause page loader renderer */
.ui-mobile [data-role=page], .ui-mobile [data-role=dialog], .ui-page{
  position: relative;
}
/* cause slimScroll */
.ui-panel-animate.ui-panel-content-wrap{
  -webkit-backface-visibility: visible;
  -webkit-transform: none;
}
.ui-content, .ui-page, .ui-panel-content-wrap{
  overflow: hidden;
}
/* mobile panel sidebar */
.ui-panel {
  width: 22em;
}
.ui-panel-position-left {
  left: -22em;
  background-color: rgb(30,34,42);
  background-color: #1E222A;
}
/* positioning: content wrap, fixed toolbars and dismiss */
/* panel left open */
.ui-panel-content-fixed-toolbar-position-left.ui-panel-content-fixed-toolbar-open,
.ui-panel-content-wrap-position-left.ui-panel-content-wrap-open,
.ui-panel-dismiss-position-left.ui-panel-dismiss-open {
  left: 22em;
  right: -22em;
}
/* animated: panel left open (for reveal and push) */
.ui-panel-animate.ui-panel-content-fixed-toolbar-position-left.ui-panel-content-fixed-toolbar-open.ui-panel-content-fixed-toolbar-display-reveal,
.ui-panel-animate.ui-panel-content-fixed-toolbar-position-left.ui-panel-content-fixed-toolbar-open.ui-panel-content-fixed-toolbar-display-push,
.ui-panel-animate.ui-panel-content-wrap-position-left.ui-panel-content-wrap-open.ui-panel-content-wrap-display-reveal,
.ui-panel-animate.ui-panel-content-wrap-position-left.ui-panel-content-wrap-open.ui-panel-content-wrap-display-push {
  -webkit-transform: translate3d(22em,0,0);
  -moz-transform: translate3d(22em,0,0);
  transform: translate3d(22em,0,0);
}

.ui-header,
.ui-panel-content-wrap{
  background-color: rgb(243, 243, 241);
  /*background: url('../images/bg.png');*/
}
.mobile-panel .sidebar-nav .sidebar-nav-inner{
  position: relative;
  width: 22em;
}
.mobile-panel .sidebar-nav .nav-list > li{
  line-height: 32px;
  font-size: 1.1em;
  border-bottom: none;
  -webkit-box-shadow: none;
          box-shadow: none;
}
.mobile-panel .sidebar-nav .nav-list > li > a:hover {
  background: none;
}
.mobile-panel .sidebar-nav .nav-list > li > a,
.mobile-panel .sidebar-nav .nav-list .nav-header {
  border-bottom: 1px solid rgb(30,34,42);
}
.mobile-panel .sidebar-nav li.nav-header{
  height: 20px;
  line-height: 20px;
  font-size: 0.85em;  
}
.mobile-panel .sidebar-nav .user-section{
  display:block;
  height: 52px;

}
.mobile-panel .sidebar-nav li.user-section > a{
  height: 46px;
}
.mobile-panel .sidebar-nav .user-section .user-actions{
  margin-right: 15px;
  margin-top: -35px;
  z-index: 1;
}
.mobile-panel .profile-pic-mini{
  margin-top: 7px;
}
.mobile-panel .sidebar-nav .btn-settings{
  position: absolute; 
  display: block;
  margin-top: -15px;
  right: 0; 
  width: 45px;
  height: 45px;
  line-height: 45px;
  text-align: center;
}
.mobile-panel .name{
  margin-left: 8px;
  margin-top: 6px;
}
.mobile-panel.fullname,
.mobile-panel .username{
  position: relative;
  width: 160px;
  font-size: 0.9em;
  line-height: 16px;
}
.mobile-panel .fullname{
  display: block;
  color: #dddddd;
}
.mobile-panel .username{
  color: #acacac;
  font-size: 0.85em;
}
.mobile-panel .sidebar-nav ul.typeahead{
  max-width: 19.5em;
}
.mobile-panel .sidebar-nav ul.typeahead > li > a{
  overflow: hidden;
  text-overflow: ellipsis;
}

.sidebar.span3{
  width: 210px; 
}
.sidenav{
  min-width: 200px;
  background-color: #ffffff;
  margin-bottom: 20px;
  -webkit-border-radius: 6px;
     -moz-border-radius: 6px;
          border-radius: 6px;

  -webkit-box-shadow: 0px 0px 9px rgba(0, 0, 0, 0.1);
     -moz-box-shadow: 0px 0px 9px rgba(0, 0, 0, 0.1);
          box-shadow: 0px 0px 9px rgba(0, 0, 0, 0.1);
  width: 252px \9 /* Override the previous IE8-9 */
}

.sidenav-container{
  background-color: #ffffff;
  border-left: 1px solid #eeeeee;
  padding: 0 10px 20px 10px;
  margin-left: 0;
  min-height: 500px;
  /*
  -webkit-border-top-right-radius: 7px;
          border-top-right-radius: 7px;
  -moz-border-radius-topright: 7px;
  -webkit-border-bottom-right-radius: 7px;
          border-bottom-right-radius: 7px;
  -moz-border-radius-bottomright: 7px;
  */
  -webkit-border-radius: 6px;
     -moz-border-radius: 6px;
          border-radius: 6px;
  
  -webkit-box-shadow: 0px 0px 9px rgba(0, 0, 0, 0.1);
     -moz-box-shadow: 0px 0px 9px rgba(0, 0, 0, 0.1);
          box-shadow: 0px 0px 9px rgba(0, 0, 0, 0.1);
}

/* map */
.sidenav-container div.benife-location{
  width:100%;
}

.sidebar-nav button.panel-close {
	opacity: 0.9;
	margin:12px 14px;
}

/* =============================================================================
   Header 
   ========================================================================== */
.header,
.header.small,
.menu-header{
  display: block;
  padding: 10px 0 8px 15px;
  margin-bottom: 20px;
  font-size: 20px;
  font-weight: bold;
  line-height: 40px;
  color: #444444;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
  text-transform: uppercase;
  border-bottom: 1px solid #eee;
}
.menu-header .account-button{
	float: right;
	margin-top: 6px;
}
.header.small{
  padding-left: 15px;
  font-size: 18px;
  line-height: 30px;
}
.header2, 
.menu-header2{
  display: inline-block;
  padding: 0 0 0 15px;
  font-size: 16px;
  font-weight: bold;
  line-height: 20px;
  color: #444444;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
  text-transform: uppercase;
}
.header2 a{
  color: #444444;
}
.header2 a:hover{
  color: #5ac8e4;
  text-decoration: none;
}
.header3, 
.menu-header3{
  display: inline-block;
  padding: 0;
  font-size: 15px;
  font-weight: bold;
  line-height: 20px;
  color: #444444;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
  text-transform: uppercase;
}

.form-submit{
  margin: 20px auto 5px auto;
  text-align: center;
}
.form-actions{
  margin: 20px auto 5px auto;
  padding: 19px 20px 20px 0;
  border-top: 1px solid #ededed;
  background: #ffffff;
}
.modal .form-actions{
  margin: 10px auto 0 auto;
  padding: 10px 0 0 0;
  border-top: 0;
  background: #ffffff;
  text-align: center;
}

/* =============================================================================
   main application add
   ========================================================================== */
#applicationInfo {
position:fixed;
bottom:0;
min-width:300px;
padding-bottom:0;
background:none; border:none; box-shadow:none;
margin-top:25px;

top: 20px;
right: 20px;
left: 20px;
margin: 0;
width: auto;
}
#applicationInfo .preview { }
#applicationInfo .preview img { width:80%; }
#applicationInfo .application-info-title { padding:0 20px; }

/* =============================================================================
   Share & Embed 
   ========================================================================== */
a.share{
  display: block;
}

#shareModal .share-services{
  margin-top: 10px;
  margin-bottom: 20px;
}
#shareModal .share-services > ul > li{
  float: left;
  margin-left: 9px;
}
#shareModal .share-services > ul > li:first-child,
#shareModal .share-services > ul > li.first-child{
  float: left;
  margin-left: 0;
}
#shareModal .nav-tabs > li > a{
  padding-top: 0;
  padding-bottom: 0;
}
#embedContainer{
  padding: 0 2px 0 0; /* show border */
}
#embedContainer #postDetail{
  max-width: 500px;
  max-height: 900px;
}
#embedContainer #postDetail .site-name-wrapper{
  display: block;
  width: 100%;
  margin-top: -15px;
  margin-right: -15px;
}

#embedContainer #postDetail .site-name {
  display: block;
  height: 24px;
  background: url('../images/logo-black-w128.png') no-repeat center right; /*non svg*/
  background: rgba(0,0,0,0) url('../images/logo-black.svg') no-repeat center right;
  background-size: auto 42px;
}

#embedContainer #postDetail{
  margin:0 auto; 
  padding:0;
  box-shadow: none;
  border: 1px solid #dfdfdf;
}
#embedContainer #postDetail .picture .post-pic{
  min-height: 100px;
  line-height: 100px;
  margin: 0;
}

#embedContainer .title-wrapper{
  margin: 0 !important;
}

#embedContainer #postDetail h5.title{
  margin: 0; 
  font-size: 0.95em;
  max-width: 300px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#embedContainer #postDetail .detail-info{
  margin: 0;
}


/* =============================================================================
   Profile info and picture 
   ========================================================================== */
.blog-pic,
.blog-profile-pic div.profile-pic-border,  
.user-pic,
.user-pic-large,
.user-pic-xlarge,
.user-pic-small{
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  -webkit-box-shadow: inset 0px 0px 7px rgba(0, 0, 0, 0.3);
     -moz-box-shadow: inset 0px 0px 7px rgba(0, 0, 0, 0.3);
          box-shadow: inset 0px 0px 7px rgba(0, 0, 0, 0.3);
}
.blog-pic img,
.blog-profile-pic img,
.user-pic img,
.user-pic-large img,
.user-pic-xlarge img,
.user-pic-small img{
  z-index: -1;
  position: relative;
}
.user-pic,
.user-pic img{
  width: 32px;
  height: 32px;
}
.user-pic-xlarge,
.user-pic-xlarge img{
  width: 54px;
  height: 54px;
}
.user-pic-large,
.user-pic-large img{
  width: 40px;
  height: 40px;
}
.user-pic-small,
.user-pic-small img{
  width: 24px;
  height: 24px;
}

.profile-pic,
.profile-pic-large,
.profile-pic-small,
.profile-pic-mini,
.profile-pic-nano,
.list-profile-pic{
  display: inline-block;
  margin: 0;
  padding: 0;
  border: 0;
  vertical-align: middle;
}
.profile-pic-large,
.profile-pic-large img
{
  width: 88px;
  max-height: 88px;
  line-height: 88px;  
}
.profile-pic,
.profile-pic img
{
  width: 54px;
  max-height: 54px;
  line-height: 52px;  
}
.profile-pic-nano,
.profile-pic-nano img
{
  width: 22px;
  max-height: 22px;
  line-height: 22px;  
}
.profile-pic-mini,
.profile-pic-mini img
{
  width: 32px;
  max-height: 32px;
  line-height: 30px;  
}
.profile-pic-small,
.profile-pic-small img
{
  height: 40px;
  max-width: 40px;
}
.list-profile-pic,
.list-profile-pic img
{
  float: left;
  height: 40px;
  max-width: 40px;
}
.list-profile-pic a{
  display: inline-block;
  width: 40px;
  max-height: 40px;
  line-height: 38px;
}
.username,
.fullname{
  display: block;
  max-width: 300px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: clip;
}

/* =============================================================================
   File Button 
   ========================================================================== */
input[readonly="readonly"]{
  background: #FFFFFF;  
}
.file-div{ 
  position: relative;  
  height: 31px;
  overflow: hidden; 
  cursor: default;
} 
.file-button{ 
  position: absolute;
  top: 0px;
}
.file-hidden{ 
  position: absolute;
  width: 1px !important;
  left:0;
  right: 0;  
  top: 0;  
  filter: alpha(opacity=0);  
  -ms-filter: "alpha(opacity=0)";
  -khtml-opacity: 0;  
  -moz-opacity: 0; 
  -o-opacity: 0; 
  opacity: 0;
  cursor: default;
  left: -150px \9; /* IE8 9*/
 
}

/* =============================================================================
   Header
   ========================================================================== */
/* Logo  */
#defaultHeader .site-name, 
#defaultHeader .site-name a, 
#defaultHeader .site-name span, 
#defaultHeader .site-name-mobile span {
  display: block;
  position: relative;
  z-index: 10;
  width: 180px;
  height: 43px;
  text-indent: -9999px;
}
#defaultHeader .site-name {
  margin: 0 10px 0px 10px;
  padding: 0;
  border: none;
  font-style: normal;
  line-height: 32px;
  text-align: center;
}
#defaultHeader .site-name a {
  position: absolute;
  overflow: hidden;
  outline: none;
  cursor: pointer;
}
#defaultHeader .site-name span,
#defaultHeader .site-name-mobile span {
  position: absolute;
  z-index: 10;
  top: -1px;
  left: 0;
  background: url('../images/logo-blue-normal.png') no-repeat 6px 8px; /*non svg*/
  background: rgba(0,0,0,0) url('../images/logo-blue-normal.svg') no-repeat left top;
  background-size: auto 45px;
}
#defaultHeader .site-name-mobile span {
  top: 6px;
  left: 50%;
  margin-left: -72px;
  background-size: auto 40px;
}
#defaultHeader .beta,
#defaultHeader .beta-mobile{
  margin: 5px 5px 0 -55px;
  left: 210px;
  padding: 0 3px 0 3px;
  font-family: "Century gothic", "Helvetica Neue", Helvetica;
  font-size: 11px;
  height: 14px;
  line-height: 14px;
  color: #5ac8e4;
  background: transparent;
  -webkit-border-radius:2px;
     -moz-border-radius:2px;
          border-radius:2px;
}
#defaultHeader .beta-mobile{
  position: absolute;
  top: 3px;
  left: 50%;
  margin-left: 47px;
}
#defaultHeader .categories{
  padding-bottom: 0;
}
#defaultHeader .categories > div{
  width: 340px;
}
#defaultHeader .categories li > a{
  padding: 6px 20px;
}
#defaultHeader .categories strong{
  color: #000000;
}
#defaultHeader .categories .service-info{
  padding: 5px 22px 0 0;
  height: 23px;
  background: #f0f0f0;
  text-align: right;
  -webkit-border-radius: 0 0 4px 4px;
     -moz-border-radius: 0 0 4px 4px;
          border-radius: 0 0 4px 4px;
}
#defaultHeader .categories .service-info a{
  font-size: 0.9em;
  font-weight:bold;
}
#defaultHeader .navbar .navbar-inner{
  background: #ffffff;
  min-height: 45px;
  padding-top: 4px;
  -webkit-box-shadow: 0px 0px 9px rgba(0, 0, 0, 0.1);
     -moz-box-shadow: 0px 0px 9px rgba(0, 0, 0, 0.1);
          box-shadow: 0px 0px 9px rgba(0, 0, 0, 0.1);  
}
#defaultHeader .navbar .navbar-inner > div{
  max-width: 1000px;
  margin: 0 auto;
}
#defaultHeader .navbar .nav li{
  margin-left: 3px;
  margin-right: 3px;
}
#defaultHeader .navbar .nav button.usermenu{
  max-width: 180px;
  background: transparent;
  color: #bbb;
  text-shadow: none;
  outline: none;
}
#defaultHeader .navbar .nav button.usermenu:hover{
  color: #FFFFFF;
  background: #5ac8e4;
}
#defaultHeader .navbar .nav button.usermenu:hover i.icon-nav-bar-gray{
  background: url("../images/icon/bar-nav.png");
  background: rgba(0,0,0,0) url("../images/icon/bar-nav.svg");
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 20px 20px;
}
#defaultHeader .navbar .nav button.usermenu:hover i.icon-nav-list-gray{
  background: url("../images/icon/list-nav.png");
  background: rgba(0,0,0,0) url("../images/icon/list-nav.svg");
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 20px 20px;
}
#defaultHeader .navbar .nav .usermenu > .profile-pic-nano{
  margin-top: 0px;
  margin-left: -6px;
  margin-right: 10px;
}
#defaultHeader .navbar .nav .usermenu > .profile-pic-nano img{
  margin-bottom:1px;
}
#defaultHeader .username, .fullname{
  max-width: 200px;
}
#defaultHeader .fullname{
  margin-top:1.5px;
}
#defaultHeader .navbar-search input{
  margin-top: -3px;
  height: 21px;
}
#defaultHeader .navbar-search input.search-desktop {
	width:100%;
}
#defaultHeader .visible-phone i.icon-nav-bar-gray:hover {
  margin-top: 0;
  width:20px;
  height:20px;
  background: url("../images/icon/bar-nav-black.png");  
  background: rgba(0,0,0,0) url("../images/icon/bar-nav-black.svg");  
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 20px 20px;
}

/* Top nav post count */
#defaultHeader div.blog-activity-count {
	text-align:center;
	position:absolute;
	top:3px;
	right:2px;			
	width:16px;
	height:16px;
	line-height: 16px;				
	padding:2px;
	margin-right: -8px;
	font-size:0.9em;
	color:#ffffff;
	box-shadow: 0 0 0px 2px #FFFFFF;	
	background-color:#d9534f;		
	-webkit-border-radius: 15px;
	   -moz-border-radius: 15px;
	        border-radius: 15px;
}

#defaultHeader div.navbar-inner ul.typeahead.dropdown-menu {
	max-width: 450px;
}

#defaultHeader div.navbar-inner ul.typeahead.dropdown-menu li a {
	display;block;
	overflow:hidden;
	white-space:nowrap;
	text-overflow:ellipsis;
}

/* Top nav notification count */
.navbar .nav > li.notification-wrap > a{
  padding: 0;
}
#notification{
  width: 30px;
  height: 42px;
}
#notification .notification-count {
  position: relative;
  display:inline-block;
  padding: 7px;
  top: 5px;
  min-width: 16px;
  height: 16px;
  line-height: 15px;  
  text-align: center;
  font-weight: normal;
  font-size:15px;
  color: #333333;
  background: #ffffff;
  border: 1px solid #c5c5c5;
  -webkit-border-radius:4px;
     -moz-border-radius:4px;
          border-radius:4px;
}
#notification .notification-count.active{
  color: #ffffff;
  border: 1px solid #5ac8e4;
  background: #5ac8e4;
}
#notification .notification-count:hover {
  text-decoration: none;
  border: 1px solid #5ac8e4;
  color: #5ac8e4;
}
#notification .notification-count.zero {
  border: 2px solid #707683;
  color: #c5c5c5 !important;
  background: #ffffff !important;
  background-image: none !important;
}
#notification .notification-count.zero:hover {
  text-decoration: none;
}

div.alert-section{
  position: absolute; 
  left: 50%;
  min-width: 860px;
}
div.alert-section .alert{
  position: relative; 
  top: 51px;
  left: -50%;
  max-width: 900px;
}

/* =============================================================================
   Main Body
   ========================================================================== */
#mainContainer,
#blogContainer,
#settingsContainer,
#mypageContainer,
#inviteContainer{
  max-width: 1000px;
  margin: 50px auto;
}
.post-container{
	min-height: 650px;
}
.post-container, .item-container{
  margin: 0 auto;
}

#blogContainer .post-container,
#mypageContainer .post-container,
#mainContainer .post-container{
  margin: 10px auto;
}

div.post-content > .picture > .post-pic .picture-type-video{
	position:absolute;
	width:90px;
	height:90px;
	top:50%;
	left:50%;
	margin-left:-45px;
	margin-top:-45px;
	background: url('../images/play-icon.png') no-repeat center center; /*non svg*/
}

/* activity loading icon */
.blog-activity-loader{
  position: fixed;
  width: 46px; 
  height: 46px;
  text-align: center;
  left: 50%; 
  top: 50%;
  margin-left: -43px; 
  margin-top: -93px;
  z-index: 9999999;
  background-color: #FFFFFF;
  background-color: rgba(255, 255, 255, 0.98);  
  background-image: url(../images/loader.gif);
  background-size: 26px 26px;
  background-position: center;
  background-repeat: no-repeat;
  -webkit-border-radius: 34px;
     -moz-border-radius: 34px;
          border-radius: 34px;
}

/* loading icon */
.ui-icon-loading {
  background: url(../images/loader.gif);
  background-size: 26px 26px;
  background-position: center;
  background-repeat: no-repeat;
}


/* loading screen */
.ui-loading .ui-loader { display: block; }
.ui-loader { display: none; z-index: 9999999; position: fixed; top: 50%; left: 50%; border:0; }
.ui-loader-default { background: none; opacity: 0.9; width: 46px; height: 46px; margin-left: -23px; margin-top: -23px; }
.ui-loader-verbose { width: 200px; opacity: 0.9; box-shadow: 0 1px 1px -1px #fff; height: auto; margin-left: -110px; margin-top: -43px; padding: 10px; }
.ui-loader .ui-icon { background-color: rgba(255,255,255, 0.88); display: block; margin: 0; width: 44px; height: 44px; padding: 1px; -webkit-border-radius: 36px; -moz-border-radius: 36px; border-radius: 36px; }
.ui-loader-verbose .ui-icon { margin: 0 auto 10px; opacity: .9; }
.ui-loader-fakefix { position: absolute; }

.loader,
.loader-bottom,
.loader-complete,
#loadmoreLoader,
#infscr-loading{
  position: fixed;
  width: 46px; 
  height: 46px;
  text-align: center;
  left: 50%; 
  top: 50%;
  margin-left: -23px; 
  margin-top: -93px;
  z-index: 9999999;  
  background-color: #FFFFFF;
  background-color: rgba(255, 255, 255, 0.98);
  background-image: url(../images/loader.gif);
  background-size: 26px 26px;
  background-position: center;
  background-repeat: no-repeat;
  -webkit-border-radius: 34px;
     -moz-border-radius: 34px;
          border-radius: 34px;
}
.loader-complete{
  background-image: url(../images/icon/check-mark-big.png);
  background-size: 26px 26px;
  background-position: center;
  background-repeat: no-repeat;
}
.main-recom-container .loader {
	position:absolute;
	margin-top:-13px;
}
/* Infinite Scroll */
#infscr-loading {
  top: auto;
  bottom: 10px;
  left: 50%;
  margin-left: -23px; 
  padding-top: 10px;
  height: 36px;
  width: 46px;
  color: #444444;
  font-size: 13px;
  line-height: 13px;
  background: #FFFFFF;
  background: rgba(255, 255, 255, 0.98);
}
#loadmoreLoader {
  top: auto;
  bottom: 0px;
  left: 50%;
  margin-left: -23px; 
  padding-top: 10px;
  margin-bottom:10px;
  height: 36px;
  width: 46px;
  color: #444444;
  font-size: 13px;
  line-height: 13px;
  overflow:hidden;
}
#loadmoreLoader > .nomore {
	background-color:#fff;
}
#itemLoader > p{
  z-index: 1001;
}
#searchLoader > p{
  top: 40%;
  background:none;
}

.ellipsis{
  position: relative;
  /* IE9 SVG, needs conditional override of 'filter' to 'none' */
  background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjcwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwLjciLz4KICA8L2xpbmVhckdyYWRpZW50PgogIDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZ3JhZC11Y2dnLWdlbmVyYXRlZCkiIC8+Cjwvc3ZnPg==);
  background: -moz-linear-gradient(top,  rgba(255,255,255,0) 0%, rgba(255,255,255,0.7) 70%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0)), color-stop(70%,rgba(255,255,255,0.7))); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(255,255,255,0.7) 70%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(255,255,255,0.7) 70%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(255,255,255,0.7) 70%); /* IE10+ */
  background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(255,255,255,0.7) 70%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#b3ffffff',GradientType=0 ); /* IE6-8 */
 
  -webkit-transition: all 1.0s ease-in-out;
     -moz-transition: all 1.0s ease-in-out;
       -o-transition: all 1.0s ease-in-out;
          transition: all 1.0s ease-in-out;       
}

.ellipsis-gray{
  position: relative;
  /* IE9 SVG, needs conditional override of 'filter' to 'none' */
  background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjcwJSIgc3RvcC1jb2xvcj0iI2YwZjBmMCIgc3RvcC1vcGFjaXR5PSIwLjciLz4KICA8L2xpbmVhckdyYWRpZW50PgogIDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZ3JhZC11Y2dnLWdlbmVyYXRlZCkiIC8+Cjwvc3ZnPg==);
  background: -moz-linear-gradient(top,  rgba(255,255,255,0) 0%, rgba(240,240,240,0.7) 70%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0)), color-stop(70%,rgba(240,240,240,0.7))); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(240,240,240,0.7) 70%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(240,240,240,0.7) 70%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(240,240,240,0.7) 70%); /* IE10+ */
  background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(240,240,240,0.7) 70%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#b3f0f0f0',GradientType=0 ); /* IE6-8 */
 
  -webkit-transition: all 1.0s ease-in-out;
     -moz-transition: all 1.0s ease-in-out;
       -o-transition: all 1.0s ease-in-out;
          transition: all 1.0s ease-in-out;
}

.badge-section{
  position: absolute;
  width: 200px;
  height: 30px;
  text-align: left;
  margin-top: -20px;
  margin-left: 16px;
}

.post,
.notice{
  position: relative;
  float: left;
  cursor: pointer;
  margin: 10px 0 11px 8px;
  background: #FFFFFF;
  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;       
  -webkit-box-shadow: 0px 0px 9px rgba(0, 0, 0, 0.1);
     -moz-box-shadow: 0px 0px 9px rgba(0, 0, 0, 0.1);
          box-shadow: 0px 0px 9px rgba(0, 0, 0, 0.1);
  /*z-index: 0;*/
}

.notice.xlarge{
  width: 870px;
  padding: 0px;
  background-color: rgb(236,238,241); /*rgb(111,195,238); */
  color: #ffffff;
  float:none;
  margin:20px auto 0 auto;
  z-index: 1005;
}
.information > .category-title.visible-phone{
  width: 240px;
  max-height: 200px;
  padding: 20px;
  background-color: rgb(90,200,228); /*rgb(111,195,238); */
  color: #ffffff;
}
.category-title  span.category-title-image{
	position:absolute; 
	top:12px; 
	right:10px;
 	width: 100px;
 	height: 100px;
 	opacity: 0.65;
}

.category-title span.category-title-image.subscriptions-title {
	top:0px; 
	right:11px;
 	width: 120px;
 	height: 150px;
}
.notice h1{
  line-height: 55px;
}
.information-container .ads-container .ads
.notice a{
  color: #FFFFFF;
}
.information-container {
	position:relative;
  -webkit-border-radius: 4px 4px 0 0;
     -moz-border-radius: 4px 4px 0 0;
          border-radius: 4px 4px 0 0;
}
.information-container .information div.signup-title,
.information-container .information div.category-title{
	width:315px;
	height:200px;
	padding:0 15px;
	position:relative;
	overflow:hidden;
	background-color:#ADB8C7;
}
.information-container .information div.signup-title .btn-outline-trans {
  color: #fff;
  border:1px solid #fff;
}
.information-container .information div.signup-title .btn-outline-trans:hover {
  background-color: #ADB8C7;
}
.information-container .information div.signup-title .signup-title-inner {
  margin-top: 15px;
  padding: 10px 20px;
  width: 190px;
  display: inline-block;
}
.information-container .information div.signup-title .signup-title-inner p {
  font-size: 22px;
  margin: 10px 0px;
  line-height: 1.2em;
}
.information-container .information div.signup-title .signup-img {
  position: absolute;
  right: 0;
  bottom: -20px;
}
.information-container .information div.ads-container {
  width:495px;
  height:200px;
  padding:0 15px;
  position:relative;
  overflow:hidden;
}
.information-container .information div.ads-container .ads-container-inner {
  display: inline-block;
  width: 198px;
  float: left;
  padding: 10px 40px 10px 10px;
  text-align: right;
}
.information-container .information div.certified{
	height:100px;
}
.information-container .information div.category-title.certified{
	height:60px;
	padding:20px 15px;
}
.information-container .information {
  -webkit-border-radius: 0px 0px 4px 4px;
     -moz-border-radius: 0px 0px 4px 4px;
          border-radius: 0px 0px 4px 4px;
}
.information-container .information div.ads-container {
	color:#474553;
  -webkit-border-radius: 0px 0px 4px 0px;
     -moz-border-radius: 0px 0px 4px 0px;
          border-radius: 0px 0px 4px 0px;		
}
.information-container .information .app-promote-first-text {
  margin-top: 15px;
  margin-bottom: 0px;
  font-size: 28px;
  text-align: left;
}
.information-container .information .app-promote-second-text {
  margin-bottom: 20px;
  font-size: 40px;
  line-height: 1.5em;
  font-weight: bold;
  text-align: left;
}
.information-container .information .app-promote-img {
  margin-top: 15px;
}
.information-container .information h1 {
	margin-top:15px; 
}
.information-container .ads-container.certified .app-promote-img {
    height: 100px;
    right: 10px;
    position: absolute;
}
.information-container .information div.ads-container.certified .ads-container-inner {
  width: 320px;
  padding:10px 0px 0px 0px;
  text-align: left;
}
.information-container .information div.ads-container.certified .ads-container-inner p {
  margin: 10px 0px;
  font-size: 24px;
  text-align: left;
}
.information-container .visible-phone  {
	padding: 15px;
	background-color:#fff;
}
.information-container .visible-phone h1 {
	font-size:38px;
	margin:0;
	color:#333;
}
.ads-container .category-title {
	position:relative;
}
.ads-container .ads-text {
	color:#5ac8e4;
	margin:0;
	width:50%;
	padding:20px 20px;
	width: 395px;
	position:relative;
	background-color:#fff;
}
.ads-container .ads{
  position:absolute;
  top:38px; 
  right:25px;  
  width:95px; 
  height:80px;
  background: url('../images/promote-app-blue.png') no-repeat center center;
}
.ads-container > .ads-title {
	margin:0;
}
.ads-container.certified > h3.ads-title {
	font-size:23px;
	line-height:36px;
	font-weight:bold;
	margin-bottom:2px;
}
.ads-container > a img.app-download {
	width:220px;
	margin-top:11px;
}
.ads-container.certified > a img.app-download {
	width:145px;
	margin-top:0;
}
.information-container .ads-container.certified .ads{
	width:170px;
	height:150px; 
	top: -14px;
	right:0;
  background: url('../images/promote-app-blue.png') no-repeat center center;
  background-size: 70%;
}
.information-container .ads-container .ads{
	width:170px;
	height:150px; 
	top: 71px;
}
.ads-container.hidden-phone .ads-text{
	margin:0;
	margin-left:3%;
	width:47%;
}
.attention-category ul {
  height: 55px;
}
.attention-category ul.nav-pills li > a {
	color:#333333;
	font-weight:bold;
  padding: 19px 12px;
  margin: 0;
}
.attention-category ul.nav-pills li > a:hover {
  background-color: transparent;
  border-bottom:3px solid #f3f3f1;
  border-radius:0;
}
.attention-category ul.nav-pills li.active > a  {
	background-color: transparent;
	border-bottom:3px solid #5ac8e4;
	color:#5ac8e4;
	border-radius:0;
}
.attention-category {
	z-index:1003;
	position:relative;
	background-color:#ffffff; 
	margin-bottom:0; 
	padding:0px 20px;
  -webkit-border-radius: 4px 4px 0 0;
     -moz-border-radius: 4px 4px 0 0;
          border-radius: 4px 4px 0 0;	
}
.attention-category div.more-button {
	position:absolute;
	top:14px;
	right:10px;
}

.item.mini,
.item.small{
  border-top:1px solid #dfdfdf;
  border-left:1px solid #D1CFD0;
  border-right:1px solid #D1CFD0;
  border-bottom:1px solid #C2BEBF;
  -webkit-box-shadow: 0px 3px 6px rgba(189, 185, 187, 0.50);
     -moz-box-shadow: 0px 3px 6px rgba(189, 185, 187, 0.50);
          box-shadow: 0px 3px 6px rgba(189, 185, 187, 0.50);
}
.item.mini{
  width: 52px;
  height: 52px;
  border-top: 1px solid #F0F0F0;
  margin: 0;
}
.item.small{
  width: 106px;
  height: 106px;
  border-top:1px solid #F0F0F0;
  margin: 4px 3px 12px 4px;
}
.post.normal{
  width: 280px;
}
.notice.normal{
  width: 240px;
}
.post.large,
.notice.large { 
  width: 403px; 
  height: 483px;
}
.post:hover{
  cursor: pointer;
  /*opacity: 0.88 !important;*/
}
.post:hover .post-pic img{
  opacity: 0.85 !important;
}
.post:hover .title{
  color: #49bfdd;
  -webkit-transition: all 0.2s ease-in-out;
     -moz-transition: all 0.2s ease-in-out;
       -o-transition: all 0.2s ease-in-out;
          transition: all 0.2s ease-in-out;
}
/*
.item:hover{
  cursor: pointer;
  opacity: 0.85 !important;
}
.item:hover .user img{
  opacity: 1;
}
*/
.post:hover h3 {
  text-shadow: 0 0 10px #ffffff, 0 0 10px #ffffff;
}
.post:hover h2 {
  color: #ffffff;
}
.post ul{
  margin:0;
  padding:0;
}
.post .user-pic{
  margin: 6px 8px 5px 5px;
}
.post .post-content{
  min-height: 57px;
}
.post .menu.underline {
  margin: 0px 15px;
  border-top: 1px solid #eee;
}
.post .post-content.underline {
  margin-bottom: 10px;
}
.post .post-content .post-head {
	max-height:76px;
	overflow:hidden;
}
.post .post-content .post-head > ul > li {
	max-height:43px;
	position:relative;
}
.post .post-content .author-info{
  display: inline-block;
  margin-top: 10px;
  margin-bottom: 0px;
  z-index: 0;
}
.post .post-content .author-info .blog-name{
  display: block;
  max-width: 206px;
  white-space: nowrap;
  text-overflow: clip;
  overflow: hidden;
  color: #000 !important;
  font-size: 22px;
  line-height: 1.2em;
}
.post .post-content .author-info .blog-name a{
	font-size:11px;
  display: block;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.post .post-content .username,
.post .post-content .website-host{
  color:#666666;
}
.item.mini .post-pic{
  width: 46px;
  height: 46px;
  line-height: 46px;
  vertical-align: middle;
  margin: 1px auto 1px auto;
  text-align: center;
}
.item.mini .post-pic img{
  max-width: 46px;
  max-height: 46px;
}
.item.small .post-pic{
  width: 98px;
  height: 98px;
  line-height: 98px;
  vertical-align: middle;
  margin: 3px auto 3px auto;
  text-align: center;
}
.item.small .post-pic img{
  max-width: 98px;
  max-height: 98px;
}
.post.normal .post-pic{
  position: relative;
  display: block;
  vertical-align: middle;
  width: 280px;
  height: auto;
  min-height: 50px;
  max-height: 310px;
  text-align: center;
  overflow: hidden;
}
.post.normal .post-pic img{
  position: relative;
  display: block;
  width: 280px;
  height: auto;
  border: none;
  margin: 0 auto;
  -webkit-border-radius: 4px 4px 0 0;
     -moz-border-radius: 4px 4px 0 0;
          border-radius: 4px 4px 0 0;
}
.post.normal .post-pic img.none-img {
	width: auto;
  max-width: 280px;
}

.post.normal .post-pic-thumb{
	margin-top:10px;
	margin-left: 3px;
  vertical-align: middle;
  width: 40px;
  height:40px;
}

.post.normal .post-pic-thumb > a {
  display:block;
  width: 40px;
  height:40px;  
} 

.post.large .post-pic{ 
  position: relative;
  display: block;
  vertical-align: middle;
  width: 385px;
  height: auto;
  min-height: 50px;
  max-height: 400px;
  text-align: center;
  overflow: hidden;
  -webkit-border-radius: 4px 4px 0 0;
     -moz-border-radius: 4px 4px 0 0;
          border-radius: 4px 4px 0 0; 
}
.post.large .post-pic img{
  max-width: 385px;
  max-height: 385px;
}
.picture .post-pic a {
	display: block;
}
.post .badge-section{
  margin-top: -40px;
  margin-left: 10px;
}
.post.link{
  float: none;
  display:inline;
  margin: 0;
  padding:0;
  border:none;
  background: transparent;
  -webkit-box-shadow: none;
     -moz-box-shadow: none;
          box-shadow: none;  
}
.post div.post-info{
  position: relative;
  display:block;
  padding: 0 15px;
  color: #555555;
  z-index: 0;
}
.post div.post-info > ul.post-desc-container {
	clear:left;
	margin-top:7px;
}
.post .post-info li{
  margin: -5px 0 0px 0;

}
_::-moz-svg-foreign-content, :root .post .post-info li { margin-top:2px; }

.post li.public{
/*
	position:relative;
  max-height:76px;
  overflow:hidden;
*/  
}
.fade-ellipsis {
  content: "";
  text-align: right;
  position: absolute;
  bottom: -1px;
  right: 0;
  width: 20%;
  height: 23px;
  background: linear-gradient(to right, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.99) 90%);
  background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.99) 90%); /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(right, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.99) 90%); /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(left, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.99) 90%); /* For Firefox 3.6 to 15 */
  background: -ms-linear-gradient(left, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.99) 90%); /* IE10+ */
}
.post a.post-title{
	position: relative;
  margin-top: 2px;
  margin-bottom: 6px;
  max-height: 40px;
  overflow: hidden;
  font-size: 14px;
  text-align: left;
  color: #000000 ; /*DA4F49*/
  text-decoration: none;
  word-wrap: break-word;
  /*
  white-space: nowrap;
  overflow: hidden;
  text-overflow:ellipsis;
*/
}


.post a.post-title span {
	max-height:43px;
	overflow:hidden;
}
.post a.post-title:hover{
  color: #49bfdd;
}
.post p.post-desc,
.post p.post-desc > a {
	font-size:12px;
  max-height: 40px;
  color: #8c8c8c;
  overflow: hidden;
  margin-top: 12px;
  margin-bottom: 0px;
  white-space: normal;
  word-wrap:break-word;
  text-align:justify;
}
.post p.post-desc > a:hover{
	text-decoration:none;
}

.post a.post-desc-anchor:hover{
	text-decoration:none;
	display:block;
}
.post .post-info .ellipsis{
  margin-top: -12px;
  width: 100%;
  height: 12px;
}
.post.large .title{
  height: 21px;
  line-height: 21px;
  font-size: 1.1em;
}
.post .username a{
  color: #888;
}
.post .username a:hover{
  color: #222;
}
.post .item-count{
  padding-top: 2px;
}
.post .count{
  display: inline-block;
  text-align: left;
  font-size: 1.2em;
  color: #444444;
}
.post div.item-bottom{
  position: relative;
  z-index: 0;
  display:block;
  background-color: #f0f0f0;  
  -webkit-border-radius: 0 0 4px 4px;
     -moz-border-radius: 0 0 4px 4px;
          border-radius: 0 0 4px 4px; 
}
.post .item-bottom ul li{
  display: block;
}
.post .item-bottom .comment-count{
  border-top: 1px solid #d7d7d7;
  padding: 8px 10px 2px 10px;
}
.post .item-bottom .help-desc{
  margin: 0;
}
.post .item-bottom .comment{
  padding: 0 5px 5px 5px;
}
.post .item-bottom .content{
  display:inline-block;
  margin: 2px 0 0 5px;
  width: 80%;
  min-height: 20px;
}
.post .item-bottom .content > p{
  margin: 0;
  max-height: 40px;
  overflow: hidden;
  white-space: normal;
  word-break: break-all;
}
.post .item-bottom .ellipsis-gray{
  margin-top: -14px;
  width: 100%;
  height: 12px;
}
.post .menu{
  margin-top: -2px;
}
.post .menu > ul > li{
  float: left;
  margin: 0;
  padding: 10px;
  text-align: center;
  color: #333;
}
.post .menu > ul > li.datetime{
  position: absolute; 
  right: 7px;
}
.post .menu button{
  border: none;
  background: transparent;
}
.post div.edit-pane{
  position: absolute;
  width: inherit;
  margin: 5px auto;
  z-index: 1;
}

.post div.edit-pane li{
  margin-bottom: 5px;
}

/* Feed - Find item */
div.notice.find-item{
  z-index: 0;
  min-height: 200px; /* important */
}

div.notice.find-item .icon-badge-req,
div.notice.find-item .icon-badge-reqme {
	margin-top: -8px;
	opacity: 1;
  filter: alpha(opacity=100);	
}
div.notice.find-item ul.list > li{
  -webkit-border-radius: 0px;
     -moz-border-radius: 0px;
          border-radius: 0px;  
}  
div.notice.find-item .list > li a{
  color: #333333;
}
div.notice.find-item .list > li a:hover{
  text-decoration: none;
  color: #006e7d;
}
div.notice.find-item .header.small{
}
div.notice.find-item .sub-header{
  font-size: 1.25em;
  padding: 0 10px 0 10px;
  margin: 0 0 5px 0;
}
div.notice.find-item .number{
  font-size: 1.5em;
}
div.notice.find-item .list > li{
  margin: 0;
  padding: 5px 10px 5px 10px;
}
div.notice.find-item .list-content{
  max-width: 210px;
  font-size: 12px;
}
div.notice.find-item .list-content .find-content{
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
div.notice.find-item .user-pic{
  margin-top: 5px;
}
div.notice.find-item .divider-horizon{
  margin: 5px 0 20px 0;
}
div.notice.find-item .desc{
  word-break: break-all;
  overflow: hidden;
  /*white-space: nowrap;
  text-overflow: ellipsis;*/  
}

.main-container  {
	position:relative;
	width:870px;
	margin:0 auto;
}
.main-recom-container {
	margin-top:9px;
	width:280px;
}
.main-recom-container.affix{
	top: 50px; /* Set the top position of pinned element */
	z-index: 1003;
}
.main-recom-container .recom {
	position:relative;
} 
.main-recom-container .post .post-content .post-head {
	max-height:none;
}

.main-recom-container .post {
	cursor:default;
	margin-left:0;
}
.main-recom-container .post:hover .title {
	
}
.main-post-container  {
	position:relative;
	width:590px;
}

.recom.post:hover .title{
  color: #333333;
  -webkit-transition: all 0.2s ease-in-out;
     -moz-transition: all 0.2s ease-in-out;
       -o-transition: all 0.2s ease-in-out;
          transition: all 0.2s ease-in-out;
}

.main-post-container > .container >  .post {
	margin-left:15px;
} 

.main-recom-container .recom-desc {
	width:196px;
	margin-right:5px;
	position:relative;
}
.main-recom-container .post .post-content .paging {
	margin: 11px 0 0px 0;
}
.main-recom-container .post .post-content .author-info {
	margin: 12px 0 12px 0;
}
.main-recom-container .post .post-content .paging > a:hover {
	text-decoration: none;
}
.main-recom-container a.post-recom-title {
	position:relative;
	font-size:12px;
	display:block;
	margin:0;
	line-height:20px;
	max-height:38px;
	overflow:hidden;
	color:#000000;
} 
.main-recom-container a.post-recom-title .fade-ellipsis {
	height:18px;
	bottom:1px;
}
.main-recom-container .recom-blog-name {
	margin-top:3px;
	font-size:11px;
	line-height:15px;
}
.main-recom-container .recom-blog-name a {
	display:block;
	overflow: hidden;
	white-space: nowrap;
	text-overflow:ellipsis; 
}
.main-recom-container .recom {
	z-index: 1003;
	min-height:130px;
}
.main-recom-container .recom-thumb {
	width:48px;	
	height:38px;
	text-align:center;
}
.main-recom-container .recom-thumb > img{
	overflow:hidden;
	max-width:none;
}

.main-recom-container .recom-thumb > img.heightCrop {
	width: 48px;
}
.main-recom-container .recom-thumb > img.widthCrop {
	height: 38px;
}
.main-recom-container li.recom-blog-list { margin:0 0 13px 0; } 
.main-recom-container li.recom-blog-list a.blog-recom-title {
	position:relative;
	font-size:12px;
	display:block;
	margin:0;
	line-height:16px;
	max-height:32px;
	color:#000000;
	overflow: hidden;
	white-space:nowrap;
	text-overflow:ellipsis;
	margin-right:7px;
} 
.main-recom-container li.recom-blog-list .recom-btn button.btn { width:100%; height:32px; }
.main-recom-container li.recom-blog-list .pull-left { width:70%; }
.main-recom-container li.recom-blog-list .pull-right { width:30%; }
#recomPostContainer > li { margin-bottom:13px; max-height:none; max-height:55px; overflow:hidden; }
/* =============================================================================
   Post Detail
   ========================================================================== */
/* Post Details */
#originalPost {
  position: absolute;
  left: 0px;    
  top: 50px;
	right: 0px;
	bottom: 0px;
	overflow: hidden;
}

#originalPost iframe {
  width:100%;
  height:100%;
}

.post-modal,
#postDetail{
  z-index: 1010;
  margin: 50px auto 50px auto;
  max-width: 602px;
  background: #FFFFFF;
  font-size: 13px;
  overflow: hidden !important;
  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;
  -webkit-box-shadow: 0px 3px 6px rgb(40, 48, 80);
     -moz-box-shadow: 0px 3px 6px rgb(40, 48, 80);
          box-shadow: 0px 3px 6px rgb(40, 48, 80);
  -webkit-box-shadow: 0px 3px 6px rgba(30, 38, 55, 0.95);
     -moz-box-shadow: 0px 3px 6px rgba(30, 38, 55, 0.95);
          box-shadow: 0px 3px 6px rgba(30, 38, 55, 0.95);        
/*  -webkit-box-shadow: 0px 3px 4px rgba(189, 185, 187, 0.50);
     -moz-box-shadow: 0px 3px 4px rgba(189, 185, 187, 0.50);
          box-shadow: 0px 3px 4px rgba(189, 185, 187, 0.50);*/            
}

#postDetail .modal-close{
  position: fixed;
  margin: 15px 0 20px 598px;
  background: #ffffff;
  height: 42px;
  width: 42px;
  color: #505050;
  line-height: 45px;
  vertical-align: normal;
  text-align: center;
  font-family: "Arial";
  font-size: 40px;
  font-weight:normal;
  border: none;
  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;
  opacity:0.6;
  filter:alpha(opacity=60);     
}
#postDetail .modal-close:hover{
  color: #FFFFFF;
  background: #5ac8e4;
  text-shadow: none;
  -webkit-transition: all 0.12s ease-in-out;
     -moz-transition: all 0.12s ease-in-out;
       -o-transition: all 0.12s ease-in-out;
          transition: all 0.12s ease-in-out;
  opacity:0.95;
  filter:alpha(opacity=95);          
}

#postDetail .author-info{
  display: block;
  padding: 16px 16px 0 16px;
  background: #ffffff;
  height: 42px;
  /*
  border: 1px solid #f4f4f4;
  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;
  -webkit-box-shadow: 0px 1px 8px rgba(189, 185, 187, 0.40);
     -moz-box-shadow: 0px 1px 8px rgba(189, 185, 187, 0.40);
          box-shadow: 0px 1px 8px rgba(189, 185, 187, 0.40);
  */          
}
#postDetail .author-info:hover .fullname{
  color: #5ac8e4;
  -webkit-transition: all 0.15s ease-in-out;
     -moz-transition: all 0.15s ease-in-out;
       -o-transition: all 0.15s ease-in-out;
          transition: all 0.15s ease-in-out;
}
#postDetail .author-info:hover .username{
  color: #222222;
  -webkit-transition: all 0.15s ease-in-out;
     -moz-transition: all 0.15s ease-in-out;
       -o-transition: all 0.15s ease-in-out;
          transition: all 0.15s ease-in-out;  
}
#postDetail .author-info ul{
  margin:0;
}
#postDetail .author-info li{
  height: 40px;
  line-height: 40px;
}
#postDetail .author-info .profile-pic{
  position: relative;
  width: 40px;
  max-height: 40px;
  line-height: 40px;  
}
#postDetail .author-info .name-wrapper{
  max-width: 220px;
  height: inherit;
  overflow: hidden;
  white-space: nowrap; 
  margin: 0 15px 0 10px;
}
#postDetail .author-info .fullname{
  line-height: 24px;
  font-size: 1.35em;
  color: #333333;
}
#postDetail .author-info div.username-wrapper{
  height: 20px;
  line-height: 20px;
}
#postDetail .author-info .username{
  font-size: 1.2em;
  color: #888888;
}
#postDetail .picture .post-pic{
  margin: 20px 0 18px 0;
  min-height: 320px;
  line-height: 320px;
}
#postDetail .picture .post-pic img{
  margin: 0 auto;
}
#postDetail .ad{
  position:absolute; 
  margin: 0 0 0 620px; 
  width: 200px; 
  min-height: 400px; 
  background: #FAF2CC;
  -webkit-border-radius: 6px;
     -moz-border-radius: 6px;
          border-radius: 6px;
}
#postDetail .inner{
  padding: 15px;
}
#postDetail .detail-info{
  display:block;
  margin: 5px 0 10px 0;
  max-height: 60px;
}
#postDetail .compare{
  display:block;
  margin: 5px 0 5px 0;
  text-align: left;
}
#postDetail .compare a{
  color: #444444;
}
#postDetail .website-host-cover{
  display:block;
  text-align: right;
  margin-top: -18px;
  padding: 0 15px 0 15px;
  color: #666666;
}
#postDetail div.post-title-wrapper{
  display: table;
  max-width: 480px;
  margin: 5px 0 10px 0;
  text-align: left;
}
#postDetail span.post-title{
  display: table-cell;
  vertical-align: middle;
  font-size: 1.2em;
  color: #333333;
  word-break: break-all;
}
#postDetail .view-count,
#postDetail .like-count{
  text-align: left;
  font-family: "Arial";
  font-weight: normal;
  font-size: 25px;
  color: #444444;
  margin-bottom:0;
}
.like-count.digits {
	vertical-align:middle;
}
#postDetail span.text{
  text-align: right;
  font-size: 11px;
  color: #666666;
}
#postDetail .like-users{
  margin: 10px 0 0 0; 
}
#postDetail .like-users ul{
  margin-left: 10px;
}
#postDetail .like-users li{
  float: left;
  margin: 0 0 6px 6px;
}

/* =============================================================================
   Login Container
   ========================================================================== */
#loginBody{
  overflow: auto;
  margin: 0 auto;
  background-color:#FFFFFF;
  /*background: #3C414E;*/
}
#loginBody, #loginBody a{
  color: #333333;   
}
#loginBody a:hover{
  color: #5ac8e4;   
}
#loginContainer{
  /*width: 610px; height: 240px;*/
  max-width: 290px;
  margin: 8% auto 55px auto;
}
#loginContainer input{
  width: 95%;
  font-size:13px;
}
#loginContainer button.submit{
  width: 45%;
}
#loginContainer .logo-container{
  max-width: 400px;   
}
#loginContainer .logo-big{
  display: block;
  text-align: center;
  cursor: pointer; 
  width: 100%;
  height: 100px;
  margin: 0 auto 0 auto;
  background: url('../images/logo-blue-large.png') no-repeat center center; /*non svg*/
  background: rgba(0,0,0,0) url('../images/logo-blue-large.svg') no-repeat center -5px;
  background-size: 99% auto;
}
#loginContainer .slogan-big{
  margin: -5px auto 60px auto;
  font-size: 1.4em;
  font-weight: normal;
  color: #333333;
  text-align: center;
  font-family: "Nanum Gothic", "Malgun Gothic", "AppleGothic", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
#loginContainer .slogan-top{
  display: inline-block;
  color: #cccccc;
  font-size: 15px;
  font-weight: 600;
  height: 38px;
  line-height: 38px;
}
#loginContainer label.valid,
#loginContainer label.error{
  display: inline;
  padding:0;
}
#loginContainer div.divider-vertical{
  margin-top: -10px;
  width:1px;
  height:260px;
  background: #657089; /* Old browsers */
  /* IE9 SVG, needs conditional override of 'filter' to 'none' */
  background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzNhM2Y0YyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUxJSIgc3RvcC1jb2xvcj0iIzVlNjY3YSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMzYTNmNGMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
  background: -moz-linear-gradient(top,  #3a3f4c 0%, #657089 51%, #3a3f4c 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#3a3f4c), color-stop(51%,#657089), color-stop(100%,#3a3f4c)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top,  #3a3f4c 0%,#657089 51%,#3a3f4c 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  #3a3f4c 0%,#657089 51%,#3a3f4c 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  #3a3f4c 0%,#657089 51%,#3a3f4c 100%); /* IE10+ */
  background: linear-gradient(to bottom,  #3a3f4c 0%,#657089 51%,#3a3f4c 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#657089', endColorstr='#657089',GradientType=0 ); /* IE6-8 */
}

#loginContainer a.login-email {
	display:block;
	margin-bottom:10px;
}

/* =============================================================================
   Register, Signup
   ========================================================================== */
#registerContainer{
  margin: 90px auto;
  max-width: 660px;
  min-width: 200px;
  min-height: 200px;
}
#registerContainer .inner{
  padding: 0 10px 0 10px;
}
#registerContainer .profile-pic{
  background: url("../images/profile-pic.png") center center no-repeat;
  border: 1px solid #d5d5d5;
}
#registerContainer .policy-privacy{
  margin:0;
  height: 150px;
  overflow-x: hidden;
  overflow-y: auto; 
  color: #696969;
  background: #FFFFFF;
  border:1px solid #CCCCCC;
  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px; 
}
#registerContainer .policy-privacy p{
  margin: 0;
}
#registerContainer .policy-modal .modal-body{
  margin: 0 0 0 10px;
  border: none;
  max-width: 508px;
  height: 300px;
  overflow-y: auto;
}
#registerContainer #policyModal .policy-privacy{
  max-width: 700px;
}

/* =============================================================================
   Addtional information - interest
   ========================================================================== */
.interest ul{
  margin: 30px auto;
}
.interest li{
  float: left;
  margin: 20px 10px 30px 10px;
  padding: 10px;
  width: 120px;
  height: 120px;
  cursor: pointer;
}
.interest li .name{
  margin: 0 0 4px 5px;
  font-size: 1.1em;
  color: #555;
}
.interest li .pic{
  width: 120px;
  height: 120px;
  line-height: 120px;
  overflow: hidden; 
  border: 1px solid #EEEEEE;
  -webkit-border-radius: 7px;
     -moz-border-radius: 7px;
          border-radius: 7px; 
}
.interest .pic div{
  width:120px;
  height:120px;
  z-index:0;
}
.interest .pic div.fashion{
  background: url("../images/category/fashion.png") center center no-repeat;
}
.interest .pic div.beauty{
  background: url("../images/category/beauty.png") center center no-repeat;
}
.interest .pic div.health{
  background: url("../images/category/health.png") center center no-repeat;
}
.interest .pic div.film-music-books{
  background: url("../images/category/film-perform-books.jpg") center center no-repeat;
}
.interest .pic div.entertainment{
  background: url("../images/category/entertainment.png") center center no-repeat;
}
.interest .pic div.pets{
  background: url("../images/category/pets.png") center center no-repeat;
}
.interest .pic div.photography{
  background: url("../images/category/photography.png") center center no-repeat;
}
.interest .pic div.travel{
  background: url("../images/category/travel.png") center center no-repeat;
}
.interest .pic div.arts{
  background: url("../images/category/arts.png") center center no-repeat;
}
.interest .pic div.toons{
  background: url("../images/category/toons.png") center center no-repeat;
}
.interest .pic div.sports{
  background: url("../images/category/sports.png") center center no-repeat;
}
.interest .pic div.it{
  background: url("../images/category/it.png") center center no-repeat;
}
.interest .pic div.games{
  background: url("../images/category/games.jpg") center center no-repeat;
}
.interest .pic div.foods{
  background: url("../images/category/foods.png") center center no-repeat;
}
.interest .pic div.business{
  background: url("../images/category/business.png") center center no-repeat;
}
.interest .pic div.design{
  background: url("../images/category/design.png") center center no-repeat;
}
.interest .pic div.vehicles{
  background: url("../images/category/vehicles.png") center center no-repeat;
}
.interest .pic div.home{
  background: url("../images/category/home.png") center center no-repeat;
}
.interest .pic div.wedding{
  background: url("../images/category/wedding.png") center center no-repeat;
}
.interest .pic div.kids{
  background: url("../images/category/kids.png") center center no-repeat;
}
.interest li:hover .name{
  color: #5ac8e4;
}
.interest li:active .name{
  color: #5ac8e4;
}
.interest li:active .pic{
  border: 2px solid #5ac8e4;
}
.interest li .active{
  z-index: 10;
  border: 2px solid #5ac8e4;
  background: url("../images/icon/check-mark.png") center center no-repeat;
  background-size: 24px 24px;
}
.interest li .normal{
  z-index: 1;
  border: 1px solid #EEEEEE;
  /*opacity: 100;
  filter: alpha(opacity=100);*/
}
.interest li .name-active{
  color: #5ac8e4;
}

/* =============================================================================
   Settings
   ========================================================================== */
.user.rounded-container{
  padding-top: 20px;
  padding-bottom: 5px;
  margin-bottom: 20px;
  background-color: #ffffff;
}
.blog-info,
.user-info{
  margin-bottom: 10px;
  min-height: 20px;
}
.blog-info.name,
.user-info.name{
  margin-left: 20px;
  max-width: 720px;
}

.blog-info .blog-name{
	line-height: 22px;
}

.blog-info .blog-name,
.user-info .fullname{
  font-weight: bold;
  word-break: break-all;
  font-size: 1.4em;
  color:#222222;
}
.user-info .fullname span.profile-edit {
	padding:5px;
}
.user-info .fullname span.profile-edit i {
	margin-top:4px;
}
.user-info .username{
  font-size: 1.2em;
  color:#555555;
}
.visible-desktop .blog-info.desc,
.visible-desktop .user-info.aboutme{
  margin-top: 12px;
}
.nav.nav-pills{
  margin-bottom: 0;
}
.nav.nav-pills .digits{
  color: #377e90;
}

.nav.nav-pills .active .digits {
  color: #ffffff;	
}
.nav.nav-tabs li span.digits {
	color:#377e90;
	text-shadow:none;	
}
.nav.nav-tabs li.active span.digits {
	color:#404040;
}
#settingsContainer .container{
  margin: 30px auto 50px auto;
  max-width: 733px;
  width: 733px \9; /* Override the previous IE8-9 */
  min-height: 250px;
  font-size: 13px;
}
#settingsContainer .user-info.aboutme{
  margin-top: 10px;
}
#settingsContainer .nav.nav-pills {
  padding: 0 5px 10px 5px;
}
#settingsContainer .control-group{
  padding: 0 15px 0 15px;
}
#settingsContainer .list-content{
  font-size: 13px;
}
#settingsContainer p.normal{
  margin-left:0;
}
#settingsContainer p{
  margin-top: 2px;
}
#settingsContainer .alert{
  margin: -22px 0 20px 0;
  text-align: center;
}
#settingsContainer .message-error{
  clear:both;
  margin: 5px 0 5px 90px;
}
#settingsContainer .message-error li{
  margin-top: 5px;
}

/* =============================================================================
   Blog Page
   ========================================================================== */
#blogContainer .container{
  margin: 30px auto 50px auto;
  max-width: 885px;
  width: 885px \9; /* Override the previous IE8-9 */
  min-height: 250px;
  font-size: 13px;
}
#blogContainer .container.full{
  margin: 30px auto 50px auto;
  max-width: 925px;
  width: 925px \9; /* Override the previous IE8-9 */
  min-height: 250px;
  font-size: 13px;
}
#blogContainer .container.small{
  margin: 30px auto 50px auto;
  max-width: 750px;
  width: 750px \9; /* Override the previous IE8-9 */
  min-height: 250px;
  font-size: 13px;
}
#blogContainer .list-item.full{
  max-width: 100%;
}
#blogContainer .list-item{

}
#blogContainer .list-content{
  width: 100%;
}
#blogContainer .fullname,
#blogContainer .username{
	max-width: 350px;
}
#blogContainer .blog.rounded-container{
	position:relative;
  padding-top: 20px;
  padding-bottom: 15px;
  margin:0 auto 20px auto;
  background-color: #ffffff;
  max-width: 830px;
}
div.blog .subscribe-btn-wrap {
	position: absolute;
	top: 11px;
	right: 11px;
}

/* Blog list */
div.blog.inner ul > li{
  position: relative;
  z-index: 0;
}
div.blog.inner .list-item{
  min-height: 40px;
  margin-bottom: 25px;
}
div.blog.inner .blog-info{
  margin: 0 0 0 17px;
  padding-bottom: 0;
  max-width: 60%;
}
div.blog.inner .blog-info div > a {
	display:block;
}


div.blog.inner .list-item:hover .blog-info a{
	text-decoration: none;	
}
div.blog.inner .list-item:hover .blog-profile-pic div.profile-pic-border {
	box-shadow:none;
}

div.blog.inner .list-item:hover .blog-info .blog-name,
div.blog.inner .list-item:hover .blog-info .username{
  color:#49bfdd;
  -webkit-transition: all 0.15s ease-in-out;
     -moz-transition: all 0.15s ease-in-out;
       -o-transition: all 0.15s ease-in-out;
          transition: all 0.15s ease-in-out;  
}

div.blog.inner .blog-info .blog-name{
	display:block;
	overflow:hidden;
	white-space:nowrap;
	text-overflow:ellipsis;
  font-size: 1.4em;
  margin-bottom: 1px;
  margin-top:3px;
}
div.blog.inner .blog-info .username{
  font-size: 1.1em;
  margin-bottom:10px;
}
div.blog.inner .blog-info .desc{
  margin-top: 7px;
  font-size: 12px;
  color: #666666;
  text-align: justify;
  word-break: break-all;
}
/* Blog activity */
.blog-info .activity{
  display: block;
  margin-top: 10px;
}
.blog-info .activity li{
  float:left;
  min-width: 30px;
  margin-left: 15px;
}
.blog-info .activity li.first-child{
  margin-left: 0px;
}
.blog-info .activity .count{
  font-family: "Arial";
  font-size: 1.4em;
}
.blog-info .activity span.text{
  display:block;
  margin-top: 1px;
  text-align: left;
}
.blog-info .activity a{
  text-decoration: none;
  cursor: pointer;
}
.blog-info .activity .datetime{
  position: absolute;
  margin-top: 20px;
  right: 10px;
}
.blog-info .blog-profile-pic {
	z-index:1;
	overflow:hidden;
}
.thumbnails > ul > li{
  float: left;
  margin-left: 10px;
}
.thumbnails > ul > li.first-child{
  margin-left: 0px;
}
.thumbnails > ul > li .blog-pic{
  position:relative;
  display: inline-block;
  margin-top: 15px;
  width: 113px;
  height: 113px;
  line-height: 113px;
  vertical-align: middle;
  text-align: center; 
  overflow: hidden;
}

.thumbnails .blog-pic img{
  /*position:absolute;*/
  width: auto;
  height: 113px;
  max-width: none;
  text-align: center;
  vertical-align: middle;
}
.blog .blog-profile-pic{
  position:relative;
  display: inline-block;
  width: 54px;
  max-height: 54px;
  line-height: 52px;  
  margin-bottom:10px;  
  vertical-align: middle;
  text-align: center; 
}

.blog .blog-profile-pic img{
  width: 54px;
  max-width: none;
  text-align: center;
  vertical-align: middle;
}

.blog a.profile-pic-link{
	line-height: 51px;
}

.blog .blog-profile-pic .profile-pic-border {
  max-height: 54px;
	overflow: hidden;	
}

.blog .blog-profile-pic .profile-pic-border img {
	display:block;
}

.blog .blog-profile-pic-large{
  position:relative;
  display: inline-block;
  width: 88px;
  max-height: 88px;
  line-height: 86px;  
  margin-bottom:10px;
  vertical-align: middle;
  text-align: center; 
  overflow: hidden;	
}

.blog .blog-profile-pic-large img{
  width: 88px;
  max-width: none;
  text-align: center;
  vertical-align: middle;
}

.blog-profile-pic-mini{
  position:relative;
  display: inline-block;
  margin-bottom:1px;
  width: 22px;
  max-height: 22px;
  line-height:22px;
  vertical-align: top;
  text-align: center; 
  overflow: hidden;	
}
.blog-profile-pic-mini img{
  /*position:absolute;*/
  width: 22px;
  text-align: center;
  vertical-align: middle;
}

/* Chart */
.morris-hover{position:absolute;z-index:1000;}
.morris-hover.morris-default-style{border-radius:10px;padding:6px;color:#666;background:rgba(255, 255, 255, 0.8);border:solid 2px rgba(230, 230, 230, 0.8);font-family:sans-serif;font-size:12px;text-align:center;}
.morris-hover.morris-default-style .morris-hover-row-label{font-weight:bold;margin:0.25em 0;}
.morris-hover.morris-default-style .morris-hover-point{white-space:nowrap;margin:0.1em 0;}

.chart {
  width: 100%;
  height: 200px;   
}

.chart .loader{
  position: relative;
}  

div.post-remove-container { 
	position:absolute; bottom:7px; right:50%; margin-right:-25px;
	opacity: 0.9;
}

/* =============================================================================
   My Page
   ========================================================================== */
#mypageContainer .container{
  margin: 30px auto 50px auto;
  max-width: 885px;
  width: 885px \9; /* Override the previous IE8-9 */
  min-height: 250px;
  font-size: 13px;
}
#mypageContainer div.rounded-container{
	position:relative;
  max-width: 830px;
  margin:0 auto 20px auto;
}
#mypageContainer .sidenav-container{
  width: 632px;
  min-height: 610px;
}
#mypageContainer .list-item{
  max-width: 850px;
  margin:0 auto;
}
#mypageContainer .list-content{
  width: 100%;
}
#mypageContainer .visible-phone .user{
  min-height: 120px;
  max-height: 320px;
  padding: 20px;
}
#mypageContainer .visible-phone .user li{
  margin: 0 0 10px 0;
}
#mypageContainer .user-info.name .fullname{
  line-height: 20px;
}
#mypageContainer .user-info.name .username{
  line-height: 20px;
}
#mypageContainer .visible-phone .user-info.aboutme{
  min-height: 0;
  max-height: 140px;
  overflow:hidden;
  word-break: break-all;
}

#mypageContainer .my-items{
  margin: 0 0 0 0;
}
#mypageContainer .summary{
  height: 20px;
  margin: 0 0 15px 0;
}
#mypageContainer .summary li{
  float: left;
  display: block;
  list-style: none; 
  margin: 0 20px 0 0;
  line-height: 20px;
}
#mypageContainer .inner{
  margin: 0 auto;  
}

#mypageContainer .icon-badge-req,
#mypageContainer .icon-badge-reqme {
  margin: 6px 0 0 6px;
	opacity: 1;
  filter: alpha(opacity=100);  
}

#mypageContainer .nav.nav-pills {
  width: 680px;
  padding: 10px 5px 10px 5px;
  z-index: 999;
}

/* My review lists */
#mypageContainer .my-reviews{
}
#mypageContainer .my-reviews ul{
  margin:0;
}
#mypageContainer .my-reviews .list-content{
  max-width: 460px;
  min-width: 50px;
}
#mypageContainer .my-reviews .post-title{
  font-size: 14px;
  font-weight: normal;
  color: #101010;
}
#mypageContainer .follow-btn-wrap {
	position: absolute;
	top: 11px;
	right: 11px;
}

#mypageContainer .user .my-blog-list {
	width:200px; 
	position:absolute; 
	top:50px; 
	right:20px; 
}
#mypageContainer .user .my-blog-list ul > li {
	margin:1px 0; 
	padding:1px 0;
}
#mypageContainer .user .my-blog-list ul > li > a{
	display:block; 
	text-align:left; 
	overflow:hidden; 
	white-space:nowrap; 
	text-overflow:ellipsis;
}
#mypageContainer .user .my-blog-list-title {
	width:200px; 
	border-bottom:1px dashed #dcdcdc; 
	padding-bottom:5px; 
	font-size:14px; 
}

/* Favorites */
.favorites{
}

/* Subscriber */
.subscriber ul{
	margin-bottom:0;
}
.subscriber ul > li,
.subscriber{
  position: relative;
  z-index: 0;
}
.subscriber.rounded-container{
	margin: 0 auto;
	max-width: 830px;
  padding: 20px;
}
.subscriber .list-item{
  min-height: 40px;
  margin:10px 0px;
}
.subscriber .user-info{
  margin: 0 0 0 17px;
  padding-bottom: 0;
  max-width: 60%;
}
.subscriber .realname{
  font-size: 16px;
  color: #000000;
}
.subscriber .username{
  font-size: 16px;
  color: #555555;
  margin-top:1px;
}
.subscriber .fullname{
	margin-top:1px;
}
.subscriber .aboutme{
  font-size: 12px;
  color: #666666;
  text-align: justify;
  word-break: break-all;
  margin-top:5px;
}
.subscriber .user-info div a { display:block; }
/* Favorite */

/* Added */

/* Notifications */
.notifications{
  position: relative;
  z-index: 0;
}
.notifications ul{
  margin:0;
}
.notifications div.item.mini{
  display:table-cell;
  margin-left: 20px;
}

/* =============================================================================
   Invite
   ========================================================================== */
#inviteContainer .container{
  margin: 90px auto 50px auto;
  max-width: 693px;
  width: 693px \9; /* Override the previous IE8-9 */
  min-height: 250px;
  font-size: 13px;
}
#inviteContainer div.index{
  padding: 50px 0 50px 0;
}
#inviteContainer .invite.inner{
  padding: 10px;
}
#inviteContainer .unregistered-friends,
#inviteContainer .registered-friends{
  width: 270px;
  margin: 0 auto;

}
#inviteContainer .registered-friends{

}
#inviteContainer .header2{
  display:inline-block;
  padding-left:0;
  margin-bottom: 35px;
}
#inviteContainer li{
  line-height: 30px;
  margin-bottom: 15px;
}
#inviteContainer .list-profile-pic{
  position: relative;
  height: 34px;
  width: 34px;
  overflow:hidden;
}
#inviteContainer .username{
  display: block;
  margin-left: 10px;
  width: 160px;
  height: 34px;
  line-height: 34px;
  overflow:hidden;
}
#inviteContainer .registered-friends .username{
  width: 150px;
}
#inviteContainer button.follow, 
#inviteContainer button.following, 
#inviteContainer button.unfollow{
  width: 75px;
}

/* =============================================================================
   Find Blog
   ========================================================================== */
#blogContainer .row-fluid .span9{
  width: 751px;
  margin-left: 15px;
}  
#blogContainer .row-fluid .span3{
  width: 159px
}
.find-blog-category{
  padding: 10px 0 10px 0;
  margin-bottom: 15px;
}

.row-fluid .find-blog-list {
	float:right;
}

.find-blog-category .nav-list > li > a{
	color:#333333;
}  
.find-blog-category .nav-list > li.active > a{
	color:#FFFFFF;
}  

.find-blog .item-container{
  position: relative;
  z-index: 0;
}
.find-blog .form-search{
  margin: 10px 0 15px 15px;
}
.find-blog .user-pic-large{
  margin-top: 5px;
  margin-left: 15px;
}
.find-blog .contents{
  max-width: 380px;
}
.find-blog .contents div.detail{
  display: block;
  padding: 10px 0 0 0;
}
.find-blog .contents div.find-items{
  margin-top: 10px;
}
.find-blog .list-actions{
  margin-top: 8px;
}
.find-blog .find-info div.detail > p.normal{
  margin: 0;
  word-break: break-all;
}
.find-blog div.find-item-actions{
  margin-top: 10px;
}
.find-blog .find-item-container{
  margin: 5px;
}
.find-blog .label{
  margin-top: 5px;
  width: 30px;
  padding: 13px 6px 12px 6px;
}
.find-blog .label > span{
  position: absolute;
  margin: 0 0 0 0;
  font-weight: normal;
  font-size: 28px;
}

/* =============================================================================
   Find item Modal
   ========================================================================== */
#findItemModal .message{
  margin: 5px 0 10px 0;
}

#findItemForm div.finder-list .message{
  margin: 0;
}
  
#findItemForm div.finder-pane input.search-query{
  width: 100%;
  margin-bottom: 8px;
}

#findItemForm div.typeahead .username{
  font-size: 1.2em;
}

#findItemForm .typeahead.dropdown-menu li > a{
  padding-top: 6px;
  height: 25px;
  vertical-align: middle;
}

#findItemForm div.finder-list{
  border: 1px solid #cdcdcd;
  height: 150px;
  overflow-y: auto;
  -webkit-border-radius: 5px;
     -moz-border-radius: 5px;
          border-radius: 5px;
}

#findItemForm div.finder-list ul.list > li{
  margin: 0;
  padding: 5px 10px 0 10px;
  min-height: 31px;  
  -webkit-border-radius: 0px;
     -moz-border-radius: 0px;
          border-radius: 0px;  
}

#findItemForm div.finder-list div.loader > p{
  top: 42%;
}
#findItemForm .message.message-finder{
  line-height: 130px;
}
#findItemForm div.finder-list div.list-content{
  width: 160px;
  padding: 2px 0 0 10px;
  font-size: 12px;
  vertical-align: middle;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
#findItemForm div.finder-list div.list-column{
  vertical-align: middle;  
}
#findItemForm div.finder-list div.list-column .reputation{
  display: inline-block;
  margin: 0 10px 0 0;
  font-size: 15px;
  color: #00A6BC;
}
  
/* =============================================================================
   About
   ========================================================================== */
#aboutContainer .container{
  margin: 90px auto 50px auto;
  max-width: 908px;
  width: 908px \9; /* Override the previous IE8-9 */
  min-height: 250px;
  font-size: 13px;
}
#aboutContainer .sidenav-container{
  width: 673px;
  min-height: 510px;
  padding: 20px;
}
#aboutContainer p{
  color: #666666;
}
#aboutContainer .inner{
  padding: 0 20px 0 20px;
}
#aboutContainer .section{
  margin: 30px 0 10px 0;
}
#aboutContainer .site-name {
  display: block;
  height: 46px;
  background: url('../images/logo-black-w256.png') no-repeat center center; /*non svg*/
  background: rgba(0,0,0,0) url('../images/logo-black.svg') no-repeat center center;
  background-size: auto 80px;
}

#aboutContainer .company-name {
  display: block;
  height: 46px;
  background: url('../images/logo-blue-large.png') no-repeat center center; /*non svg*/
  background: rgba(0,0,0,0) url('../images/logo-blue-large.svg') no-repeat center center;
  background-size: auto 50px;
}
.policy-privacy .section a{
  color:#333333;
}
#feedbackModal{
  font-size: 13px;
}
#feedbackModal .loader p,
#feedbackModal .loader-complete p{
  top: 29%;
}
#registerModal{
  padding: 20px 0 20px 0;
  max-height:550px;
}
#registerModal .close{
  margin-top: -10px;
  margin-right: 10px;
}
#registerModal .modal-body{
  margin: 0;
  font-size: 14px;
  border: none;
}
#registerModal p{
  color: #666666;
}


/* =============================================================================
   Help
   ========================================================================== */
#helpContainer .container{
  margin: 90px auto 50px auto;
  max-width: 908px;
  width: 908px \9; /* Override the previous IE8-9 */
  min-height: 250px;
  font-size: 13px;
}
#helpContainer .sidenav-container{
  width: 673px;
  min-height: 510px;
  padding: 20px;
}
#helpContainer p{
  color: #666666;
}
#helpContainer .inner{
  padding: 0 20px 0 20px;
}
#helpContainer .section{
  margin: 30px 0 10px 0;
}
#helpContainer .site-name {
  display: block;
  height: 46px;
  background: url('../images/logo-black-w256.png') no-repeat center center; /*non svg*/
  background: rgba(0,0,0,0) url('../images/logo-black.svg') no-repeat center center;
  background-size: auto 80px;
}

#helpContainer .company-name {
  display: block;
  height: 46px;
  background: url('../images/logo-blue-large.png') no-repeat center center; /*non svg*/
  background: rgba(0,0,0,0) url('../images/logo-blue-large.svg') no-repeat center center;
  background-size: auto 50px;
}

#helpContainer .accordion-group {
	border: none;
	border-bottom: 1px solid #e5e5e5;
	border-radius: 0;
}

#helpContainer .accordion-heading .accordion-toggle {
	padding: 13px 15px;
	margin: 5px 0;
}


/* =============================================================================
   Footer
   ========================================================================== */
#defaultFooter{
  text-align:center;
  font-size: 11px;
  margin-top: 18px;
  padding: 0 10px 0 10px;
}
#defaultFooter a{
  margin-right: 4px;
  text-decoration:none;
  color:#acacac;
  text-align:center;
  white-space: nowrap;
}
#defaultFooter a:hover{
  color: #dcdcdc;
}
#defaultFooter span.copyright {
  display: inline-block;
  margin-right: 8px;
  height: 20px;
  line-height: 20px;
  color: #999999;
  opacity: 0.8;
  filter: alpha(opacity=80);  
  -ms-filter: "alpha(opacity=80)";
  -khtml-opacity: 0.8;  
  -moz-opacity: 0.8; 
  -o-opacity: 0.8; 
}
#loginFooter{
  display:table;
  margin: 20px auto;
}
#loginFooter a{
  color: #333;
  text-decoration: none;
}
#loginFooter p.copyright {
  margin-top: 5px;
  color: #BBBBBB;
}
#loginFooter ul{
  display:table-row;
}
#loginFooter li {
  float: left;
  margin-left: 7px;
  list-style: none;
}
#loginFooter li.first-child {
  margin-left: 0;
}
#loginFooter .badge{
  vertical-align: middle;
  padding: 6px 6px 4px 6px;
  background:rgb(110,115,125); /*IE8*/
  background:rgba(255,255,255,0.3);
  text-shadow: none;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
}
#loginFooter .badge:hover {
  background:rgb(90,98,110);
  background:rgba(255,255,255,0.15);
}


/* =============================================================================
   Message
   ========================================================================== */
#messageContainer{
  margin: 160px auto;
  font-size: 20px;
  font-weight: 600;
  text-align: center;
  color: #333333;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}
#messageContainer > h1{
  font-size: 3em;
  margin-bottom: 30px;
}

/* =============================================================================
   Validation
   ========================================================================== */
.valid{
  color: #468847;
}
label.valid {
  display: inline-block;
  color: #468847;
  /*background: url(assets/img/valid.png) center center no-repeat;
  width: 21px;
  height: 21px;   
  text-indent: -9999px;*/
}
label.error {
  display: inline-block;
  text-align: left;
  font-weight: bold;
  color: #b94a48;
  padding: 0 8px 0 5px;
  margin-top: 1px;
  font-size: 12px;
}
#addBlogModal label.error,
#editBlogModal label.error{
  display: inline;
  padding: 0;
}

/* Desktop right panel
------------------------- */
#blogPanel {
	position:fixed;
	z-index:1031;
	height:100%;
  background-color: #1E222A;
  background-color: rgb(30,34,42);
}
#blogPanel .ui-panel.ui-panel-open {
  position:fixed;
}
#blogPanel .ui-panel-inner {
  position: absolute;
  top: 1px;
  left: 0;
  right: 0;
  bottom: 0px;
}

/* =============================================================================
	메인 블로그 인기트렌트 layout 
   ========================================================================== */
.notice.blog-trend-keyword {
	background-color:#ffffff;
}
.notice.blog-trend-keyword h4{
	color:#5ac8e4;
	float:left;	
	margin:48px 30px 0 3px;
}
.notice.blog-trend-keyword ul.first-child {
	margin-right:20px;
}
.notice.blog-trend-keyword ul {
	width: 165px; 
	float: left;
	margin-bottom:0;
}
.notice.blog-trend-keyword ul li {
	margin:3px;
}
.notice.blog-trend-keyword ul li a{
	color:#5ac8e4;
	display:block;
	overflow:hidden;
	white-space:nowrap;
	text-overflow:ellipsis;
}
/*  블로그 인기트렌드 end  */

/* =============================================================================
   Slimscroll
   ========================================================================== */
.slimScrollDiv {
	width: 100% !important;
}

/* =============================================================================
   Responsive
   ========================================================================== */
  
/* Desktop large
------------------------- */
@media (min-width: 1200px) {
  .sidenav {
    width: 210px;
  }
  .sidenav > li > a {
    width: 230px \9; /* Override the previous IE8-9 hack */
  }
	.blog-info .blog-name {
		max-width: 550px;
	}	
	.notice.visible-desktop.category-title-container {
		opacity: 0; 
		margin-top:0; 
		border-radius:0 0 4px 4px;
	}
	#mypageContainer .user-info.name{
	  max-width: 480px;
	}		
	#bannerUpsellContainer {
	    position: relative;
	    top: 50px;
	}
}

/* Desktop medium
------------------------- */
@media (min-width: 978px) and (max-width: 1200px) {
  .sidenav {
    /*width: 210px;*/
  }
  .sidenav > li > a {
    width: 230px \9; /* Override the previous IE8-9 hack */
  }
  .sidebar.span3{
    width: 220px;
    padding-left: 10px; 
  }
  .sidenav-container{
    width: 649px !important; 
  }
	.blog-info .blog-name {
		max-width: 550px;
	}
	.notice.visible-desktop.category-title-container {
		opacity: 0; 
		margin-top:0; 
		border-radius:0 0 4px 4px;
	}
	#mypageContainer .user-info.name{
	  max-width: 480px;
	}		
	#bannerUpsellContainer {
	    position: relative;
	    top: 50px;
	}
}

/* Desktop small
------------------------- */
@media (max-width: 979px) { 
	#mainContainer,
	#blogContainer,
	#settingsContainer,
	#mypageContainer,
	#inviteContainer{
	  margin: 0px auto 50px auto;
	}
  /* nav component */
  #notification .notification-count{
    margin-top: 2px;
  }
  .navbar-inner{
    display: block;
  }
  #desktopPanel div.sidebar-nav {
    display: none;
  }
	#defaultHeader div.blog-activity-count {
		top:2px;
		right:5px;
	}   
  .sidebar {
    top: 0;
    /*width: 218px;*/
    margin-top: 30px;
    margin-right: 0;
  }
  .sidebar.span3{
    width: 210px; 
  }
  .sidenav-container{
    padding: 0 0 10px 0;
    width: 490px !important; 
  }
	.notice.xlarge {
		width: 575px;
	}  
  .modal-header{
    padding: 2px 15px;
  }
  .modal-body{
    padding: 5px 10px;
  }
  div.alert-section{
    position: relative; 
    left: 0;
    min-width: 0;
  }
  div.alert-section .alert{
    top: 1px;
    left: 0;
  }
	.blog .blog-info.clearfix {
		padding:20px;
	}
	.blog-info.name,
	.user-info.name{
	  max-width: 575px;
	}
	.blog-info .blog-name {
		max-width: 70%;
	}
	div.message-no-data h4 {
		padding: 40px 0;
		line-height: 40px;
	}
	
	/* ads */
	.visible-desktop.notice span.category-title-image.subscriptions-title {
		top:32px; 
	}
	.visible-desktop.notice span.category-title-image{
		top:32px; 
	}
	.information-container .information div.category-title {
		width: 535px;
	  -webkit-border-radius: 4px;
	     -moz-border-radius: 4px;
	          border-radius: 4px;		
	}
	
	.information-container .information div.signup-title,
	.information-container .information div.category-title,
	.information-container .information div.ads-container {
		float:none;
		width:auto;
		width:calc(100% - 30px);
		width: -webkit-calc(100% - 30px);
    width: -moz-calc(100% - 30px);
		position:relative;
		overflow:hidden;
	}
	.information-container .information div.ads-container.certified {
		background-color:#FFFFFF;
		color:#5AC8E4;
		border-radius:0px 0px 4px 4px;
	}
	.information-container .information h1 {
		font-size:39px;
	}	
	.ads-container.certified > h3.ads-title {
		margin-top:4px;
	}
	.main-recom-container { display:none; }
	.main-container { width:auto; }
	.main-post-container { width:auto; float:none; }
	.main-post-container > .container > .post { margin: 10px 0 11px 8px; }
	.information-container .information .signup-title img {
	  margin: 15px 0px 10px 0px;
    height: 45px;
	}
	.information-container .information .signup-title p {
	  font-size: 2em;
    line-height: 1.2em;
	}
	.information-container .information div.ads-container {
	  background-color: transparent !important;
	  color: #474553 !important;
	}
	.information-container .information div.ads-container .ads-container-inner {
    padding: 0;
    width: 100%;
    text-align:center;
	}
	.information-container .information div.ads-container .ads-container-inner p {
	  margin-bottom: 0px;
	  text-align:center;
	}
}

/* Tablet to desktop
------------------------- */
@media (min-width: 768px) and (max-width: 979px) {
  /* Remove any padding from the body */
  body {

  }
  .navbar-fixed-top{
    position: fixed;
  }
  /* Adjust sidenav width */
  .sidebar{
    margin-top: 0;
  }
  .sidenav {
    margin-top: 0;
  }
  .sidebar-nav:before{
    width:0;
  }
  #infscr-loading{
    margin-left: -35px;
  }
	#blogContainer .row-fluid .span9 {
		width: 74%;
	}
}

/* Tablet
------------------------- */
@media (max-width: 767px) {
  body {
    /* change padding right, left 20px to 10px*/
    padding-right: 10px; 
    padding-left: 10px;
  }
  /* change margin right, left -20px to -10px*/
  .navbar-fixed-top,
  .navbar-fixed-bottom,
  .navbar-static-top {
    margin-right: -10px;
    margin-left: -10px;
  }
  .navbar-inner{
    display: block;
  }
  .sidebar-nav.desktop {
    display: none;
  }
  .sidebar-nav:before{
    width:0;
  }
  /* Adjust sidenav width */
  .sidenav{
    position: relative;
  }
  .sidebar.span3{
    width: 100%;  
  }
  .sidenav-container{
    width: 100% !important; 
  }
  #infscr-loading{
    margin-left: -15px;
  }
  .input-prepend input, .input-append input, .input-prepend input[class*="span"], .input-append input[class*="span"]{
    width:60px;
  }
  #settingsContainer .control-group{
    padding: 0;
  }
  /* find blog */
  #blogContainer .row-fluid .span9{
    width: 100%;
    margin-left: 0;
  }  
  #blogContainer .row-fluid .span3{
    width: 100%;
  }  
	#blogTutorialModal {
		width: auto !important;
		margin-left:0 !important;
	}
	#defaultHeader .navbar-fixed-top{
		margin-left: 0;
		margin-right: 0;
	}
	.ui-mobile [data-role=page], .ui-mobile [data-role=dialog], .ui-page{
	  position: absolute;
	}
	.find-blog-category-wrap {
		position:relative;;
	}
	/*  767px 이하부터 loader 가 짤리는 현상 방지 */
	.ui-panel-animate.ui-panel-content-wrap {
		-webkit-transform: 	translate3d(0,0,0);
	}
	.blog-info .blog-name {
		max-width: 100%;
	}
  .notice.normal {  
		padding: 10px 15px 15px 15px;
		width:250px;
  }
	.information-container .information h1 {
		margin-bottom:10px;
	}
	.ads-container > a img.app-download {
		margin-top: 0;
		margin-bottom: 3px;
	}	  
	.information-container .information > div.signup-title {
		width: auto;
	}  
	.notice.xlarge {
		width: 280px;
	}
	.information-container .information div.category-title.certified {
		text-align:left;
	}	
	.information-container {
		text-align:center;
	}	
	.information-container .information div.category-title {
		width: 240px;
	}
	.information-container .information div.ads-container {
		background-color:#5AC8E4;
		color:#ffffff;
		padding-bottom: 15px;
		
	}	
	.information-container .information div.ads-container.certified {
		background-color:#FFFFFF;
		color:#5AC8E4;
		border-radius:4px 4px 0px 0px;
	}		
	.information-container .information div.ads-container .ads{
		display:none;
	}		
	.ads-container > a img.app-download {
		width:160px;
	}
	/* about Container */
	#aboutContainer .container{
		margin: 0px auto 50px auto;
	}
	
}

/* Mobile
------------------------- */
@media (max-width: 480px) {
  .ui-content{
    padding: 10px;
  }
  /* Adjust sidenav width */
  .sidenav{
    position: relative;
  }
  .sidebar.span3{
    width: 100%;  
  }
   /* post */
  .notice.normal,
  .post.normal{
    float: none;
    width: auto;
    min-width: 260px;
    max-width: 330px;
    margin-left: auto;
    margin-right: auto;
  }
  .notice.normal {
		letter-spacing: -2px;
		padding: 10px 20px 20px 20px;
  	min-width: 255px;
  }
  .main-post-container > .container > .post { margin: 10px 0 11px 0px; }
  .post.normal .post-pic{
    width: 295px;
  }
  .post.normal .post-pic img{
    width: 295px;
  }
  #infscr-loading{
    margin-left: -32px;
  }
  /* post detail */
  #postDetail{
    width: 100%;
    max-width: 360px;
    margin-left: 0;
    margin-right: 0;
  }
  #postDetail .author-info{
    padding: 12px 10px 20px 10px;
  }
  #postDetail .picture .post-pic{
    margin: 0 0 20px 0;
    min-height: 0;
    line-height: 0;
  }
  #postDetail .inner{
    padding: 10px;
  }
  #postDetail div.post-title-wrapper{
    max-width: 250px;
    margin: 0 0 10px 0;
  }
  
  #mypageContainer .mobile-center{
  	width: 230px;
  	margin: 0 auto;
  }
  .well-large{
    padding: 0 10px 15px 10px;
  }
  .user-info.name{
    margin-left: 10px;
  }
  .user-info .fullname{
    font-size: 1.1em;
  }
  /* sign */  
  #registerContainer .interest ul{
    width: 240px;
  }
  #registerContainer .interest li{
    margin: 10px 5px 20px 0;
    width: 95px;
    height: 95px;
  }
  #registerContainer .interest li .pic,
  #registerContainer .interest .pic div{
    width: 95px;
    height: 95px;
  }
  #mypageContainer .user-pic-xlarge,
  #mypageContainer .user-pic-xlarge > img{
    width: 40px;
    height: 40px;
  }
  #mypageContainer .inner{
  }
  .subscriber .realname{
    margin-left: -10px;
    font-size: 12px;
    font-weight: normal;
    overflow: hidden;
  }
  div.blog.inner .blog-info {
  	max-width:42%;
  }
	.notice.xlarge {
		width: 295px;
	}
	.information-container .information div.category-title {
		width: 265px;
	}
	.information-container .information h1 {
		font-size: 25px;
	}
	.information-container .information div.ads-container {
		height: 140px;
	}
	.information-container .information div.ads-container.certified {
		height: auto;
	}
}
/* webkit 사용시 safari에서만 적용*/
/* width 979 이하에서 loader 이미지 짤림 방지를 위해 삽입만 코드로 인하여 
 safari에서 loader가 없어지는 현상때문에 사용 */
@media screen and (-webkit-min-device-pixel-ratio:0) { 
	/* Safari only override loeader bug */
	::i-block-chrome,.ui-panel-animate.ui-panel-content-wrap {
		-webkit-transform: none;
	}
}