body{
   padding-top:40px;
   margin-top:0;
   background-position: center 40px;

   }
/* for template Dapit Hapon 1.1 */
   body > #frame{margin-top: 0;}



.topbar{
   height:38px;
   background:#efedeb url(../topbarimgs/fl-bg.jpg) 80px center no-repeat;
   border-bottom:2px solid #b7b1a9;
   width:100%;
   z-index:9999;
   position:fixed;
   top:0; left:0;
   font-size:12px;
   line-height:40px;
   color:#666;
   font-family: "Hiragino Sans GB","Microsoft Yahei","Arial","Helvetica","sans-serif";
   }
   .topbar .t-nav a.btn-link{
	   border:1px solid #c9c3bc;
	   color:#a89e92;
	   border-radius:2px;
	   text-decoration:none;
	   display:inline;
     height:26px;
	   line-height:40px;
	   padding:6px 8px;
	   transition:background-color 300ms ease-out 0s;
   }
   .topbar .t-nav a.btn-link:hover{ background:#a89e92; color:#fff; border-color:#fff;}

   .fl{
   float:left;
   padding:0 0 0 10px;
   }
   ul.left-nav, ul.right-nav{line-height:40px;}
   .back-home, .brands, .more{ margin-right:15px;float: left;}
   .slogan{background:url(../topbarimgs/fr-bg.jpg) left center no-repeat; text-indent:-9999px; display:inline-block; width:140px;}
   .home-link{ color:#8c8884; text-decoration:none; text-shadow:1px 1px #FFF;}
   .home-link i{ color:#c9c3bc; transition:color 300ms ease-out 0s; }
   .home-link:hover i{ color:#8c8884;}
    .more-brands{  width:14px; text-indent: -9999px;  background:url(../topbarimgs/more-brands.jpg) 0 center no-repeat;}
    .more-link{ width:40px; text-align: left; }
    .more-admin{width:14px; text-indent: -9999px;  background:url(../topbarimgs/users-admin.jpg) 0 center no-repeat!important;}
/* .brands-icon{ font-size:14px; color:#999; position:relative; top:1px; text-shadow:0px 1px 0px #FFF;}
 .more-link::after{
     color: #444;
     content: '▾';
     cursor:pointer;
}*/



  /*right nav*/
  .fr{  position: relative; }
  .fr .t-nav{  }
  .topbar .t-nav ul.right-nav{float:right; padding:0 0 0 140px; background:url(../topbarimgs/fr-bg.jpg) left center no-repeat;}
  .welcom-msg, .user-msg, .user-admin, .logout-link, .login-link, .regs-link{ float: left; margin-right: 10px; height: 40px; line-height: 40px;}
  .welcome-user{ color:#333;}
  .user-msg{width: 14px;}
  .user-msg a{position:absolute; top:0; left:0; margin-top: 14px; float: left; line-height: initial;}
  .user-msg img{ float: left}


/* dropdown effect*/
	.topbar .t-nav > ul > li {
      display: inline-block
	}
	.topbar .t-nav > ul > li ul {
	  visibility: hidden;
	  position: absolute;
	  top: 105%;
	  left: 0;
	  transition: 0.2s 1s;
	  background:#fff;
	  border:1px solid #ccc;
	  box-shadow:0px 2px 10px rgba(0, 0, 0, 0.2);
	}
	.topbar .t-nav > ul > li.user-admin ul {left:-100px;}
	/*.topbar .t-nav > ul > li:hover ul {
	  visibility: visible;
	  transition-delay: 0s;
	}*/
	.topbar .t-nav ul {
	  list-style: none;
	  padding: 0;
	  margin: 0;
	}
	.topbar .t-nav li {
	  position: relative;
    padding: 0;
	}
	.topbar .t-nav a {
	  display: block;
	  color:#333;
	  text-decoration:none;
    border: 0;
    outline: 0;
    font-weight: normal;
	}

/* more drop down arrow */
.drop-down-arr{
  position:absolute;
  z-index:10;
  right:5px;
  top:20px;
  border-color:#555 transparent transparent;
  border-style:solid dashed dashed;
  border-width:4px 4px 0;
  font-size:0;
  height:0;
  width:0;
  line-height:0}

/*adding top arrow to dropdown panel */
 .drop-down:before {
  	  position: absolute;
  	  top: -7px;
  	  left: 9px;
  	  display: inline-block;
  	  border-right: 7px solid transparent;
  	  border-bottom: 7px solid #ccc;
  	  border-left: 7px solid transparent;
  	  border-bottom-color: rgba(0, 0, 0, 0.2);
  	  content: '';
  	}

  	.drop-down:after {
  	  position: absolute;
  	  top: -6px;
  	  left: 10px;
  	  display: inline-block;
  	  border-right: 6px solid transparent;
  	  border-bottom: 6px solid #ffffff;
  	  border-left: 6px solid transparent;
  	  content: '';
  	}

 	.drop-down li{display: block;}
	.drop-down li a{ padding:0 10px; height: 40px; line-height: 40px; text-decoration:none; color:#666; text-align: left;}
	.drop-down li a:hover{ background:#efefef; border-left:3px solid #ccc; color:#555;}
    .drop-down li a.b-g:hover{ border-color:#9C0;}
	  .drop-down li a.b-b:hover{ border-color:#39f;}
	  .drop-down li a.b-r:hover{ border-color:#f06;}
  	.drop-down li a.b-y:hover{ border-color:#fc0;}
  	.drop-down li a.b-o:hover{ border-color:#f90;}

    .more .drop-down{width:120px;}
  	.brands .drop-down{ width:240px;}
    .brands .drop-down li{ width:120px; float:left;}
    .brands .drop-down li.home{width:240px; text-align:center; font-size:14px; font-weight:bold;}
    .user-admin .drop-down{ width:120px;}
	  .user-admin .drop-down:before{ left:auto; right:9px;}
	  .user-admin .drop-down:after{left:auto; right:9px;}
    .user-admin-icon{ font-size:14px; color:#999; text-shadow:0px 1px 0px #FFF;}



    .clearfix:after {
     visibility: hidden;
     display: block;
     font-size: 0;
     content: " ";
     clear: both;
     height: 0;
     }
	.clearfix { display: inline-block; }
	/* start commented backslash hack \*/
	* html .clearfix { height: 1%; }
	.clearfix { display: block; }
	/* close commented backslash hack */
	* html .clearfix             { zoom: 1; } /* IE6 */
	*:first-child+html .clearfix { zoom: 1; } /* IE7 */


  @media only screen and (max-width: 800px) {
     .topbar .t-nav ul.right-nav{ padding: 0;background:none;}
  }
  @media only screen and (max-width: 600px){
    .welcom-msg{display: none!important;}
    .topbar{ background: #efedeb!important;min-width: 310px;}
  }
