/*
 *  Document   : main.css
 *  Author     : JK
 *  Description: The main stylesheet of the template
 */
 
 /*
=================================================================
(#m01mls) MAIN LAYOUT
=================================================================
*/

.is-sticky .a-cart-nav {
	margin-left: 0px;
}
.sticky-wrapper{
	/* height: 46px !important; */
}  

.pc-menu-area { display: none; height: 300px; overflow: hidden; background: url(../images/iot_style/banner.png) 50% 50% no-repeat;}
.pc-menu-area.height_240 { height: 240px; background: url(../images/iot_style/banner_240.png) 50% 50% no-repeat;}
.pc-menu-area.height_205 { height: 205px; background: url(../images/iot_style/banner_205.jpg) 50% 50% no-repeat;}
.pc-menu-area.height_195 { height: 195px; background: url(../images/iot_style/banner_195.jpg) 50% 50% no-repeat;}
.pc-menu-area .container { position: relative; width: 970px; } 

.pc-menu-area .pc-menu-search-area { position: absolute; z-index: 15; top: 65px; left: 15px; width: 300px;  }
.pc-menu-area.height_240 .pc-menu-search-area { top: 38px; }
.pc-menu-area.height_205 .pc-menu-search-area { top: 20px; }
.pc-menu-area.height_195 .pc-menu-search-area { top: 16px; }
.pc-menu-area .pc-menu-search-area a:hover { text-decoration: none; }
.pc-menu-area .pc-menu-search-area h1 { background: none; color: #fff; font-size: 34px; font-weight: bold; text-shadow: 2px 2px 5px #000; margin: 0px ; }
.pc-menu-area .pc-menu-search-area .input-group { margin-bottom: 15px; }
.pc-menu-area .pc-menu-search-area .input-group input { border: 1px solid #fff; background: rgba(255,255,255,0.3); color: #fff; }
.pc-menu-area .pc-menu-search-area .input-group input::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #e6e5e5;
}
.pc-menu-area .pc-menu-search-area .input-group input::-moz-placeholder { /* Firefox 19+ */
  color: #e6e5e5;
}
.pc-menu-area .pc-menu-search-area .input-group input:-ms-input-placeholder { /* IE 10+ */
  color: #e6e5e5;
}
.pc-menu-area .pc-menu-search-area .input-group input:-moz-placeholder { /* Firefox 18- */
  color: #e6e5e5;
}
.pc-menu-area .pc-menu-search-area .input-group button { border: 1px solid #fff; background: rgba(255,124,62,0.6); color: #fff; }
.pc-menu-area .pc-menu-search-area .input-group button i { color: #fff; }

.pc-menu-area .pc-menu-search-area .input-group button.dropdown-toggle { border-right: none; }
.pc-menu-area .pc-menu-search-area .input-group button.dropdown-toggle:after { 
	display: inline-block;
    width: 0;
    height: 0;
    margin-left: .3em;
    vertical-align: middle;
    content: "";
    border-top: .3em solid;
    border-right: .3em solid transparent;
    border-left: .3em solid transparent; 
}

.pc-menu-area .pc-menu-search-area .input-group .dropdown-menu a { display: block; text-decoration: none; padding: 3px 15px; color: #373a3c; }
.pc-menu-area .pc-menu-search-area .input-group .dropdown-menu a:hover { background: #f5f5f5; }

.pc-menu-area .pc-menu-search-area p { text-align: center; color: #fff; font-size: 16px; }

.pc-menu-area .map-img { position: relative; z-index: 10;     margin-top: 5px;}

.pc-menu-area .iconbg { position: absolute; display: inline-block; z-index: 1; width: 149px; height: 126px; background: url(../images/iot_style/button_off.png) no-repeat; text-align: center; }
.pc-menu-area .iconbg.hover,.pc-menu-area .iconbg.selected { background: url(../images/iot_style/button_on.png) no-repeat; }
.pc-menu-area .iconbg.icon1 { top: -11px; left: 320px; }
.pc-menu-area .iconbg.icon2 { top: 56px; left: 435px; }
.pc-menu-area .iconbg.icon3 { bottom: -15px; left: 435px; }
.pc-menu-area .iconbg.icon4 { top: -11px; left: 550px; }
.pc-menu-area .iconbg.icon5 { top: 123px; left: 550px; }
.pc-menu-area .iconbg.icon6 { top: 56px; left: 665px; }
.pc-menu-area .iconbg.icon7 { top: 123px; left: 782px; }

.pc-menu-area.height_240 .iconbg.icon1 { top: 56px; left: 435px; }
.pc-menu-area.height_240 .iconbg.icon2 { top: 123px; left: 550px; }
.pc-menu-area.height_240 .iconbg.icon3 { top: -11px; left: 320px; }
.pc-menu-area.height_240 .iconbg.icon4 { top: -11px; left: 550px; }
.pc-menu-area.height_240 .iconbg.icon5 { top: 56px; left: 665px; }
.pc-menu-area.height_240 .iconbg.icon6 { top: -11px; left: 782px; }
.pc-menu-area.height_240 .iconbg.icon7 { top: 123px; left: 782px; }
.pc-menu-area.height_240 .iconbg.icon8 { top: 123px; left: 320px; }

.pc-menu-area.height_195 .iconbg.icon1 { top: 2px; left: 796px; }
.pc-menu-area.height_195 .iconbg.icon2 { top: 67px; left: 680px; }
.pc-menu-area.height_195 .iconbg.icon3 { top: 1px; left: 565px; }
.pc-menu-area.height_195 .iconbg.icon4 { top: 68px; left: 449px; }
.pc-menu-area.height_195 .iconbg.icon8 { top: 1px; left: 334px; }

.pc-menu-area.height_205 .iconbg.icon1 { top: 7px; left: 796px; }
.pc-menu-area.height_205 .iconbg.icon2 { top: 72px; left: 680px; }
.pc-menu-area.height_205 .iconbg.icon3 { top: 6px; left: 565px; }
.pc-menu-area.height_205 .iconbg.icon4 { top: 73px; left: 449px; }
.pc-menu-area.height_205 .iconbg.icon8 { top: 6px; left: 334px; }

.pc-menu-area .iconbg img { padding-top: 25px; }
.pc-menu-area .iconbg h3 { margin: 0px; font-size: 16px; font-weight: bold; color: #fff; }

@media screen and (min-width: 992px) {
	.pc-menu-area {
		display: block;
	}
}

/*
=================================================================
(#m02hds) HEADER
=================================================================
*/

header.no-border { border: none; }
/*sidebar iot*/
#sidebar-alt.iot-sidebar .lang{height:46px;     padding: 8px 10px;}
/*-- sticky header --*/
.iot-style .header-menu { -webkit-box-shadow:0 0 2px 0 rgba(0,0,0,0.15); box-shadow:0 0 2px 0 rgba(0,0,0,0.15);background:#ffffff; height:46px;  color:#4c4c4c}
.iot-style .a-cart-nav li>a {color: #fff;}
.iot-style .header-menu {text-align:left; background:#00395e; }
#sidebar-mask{
	display: none;
	background: rgba(30%,30%,30%,0.5);
	position: fixed;
	z-index: 1200;
	width: 100%;
	height: 100%;
}
.sticky-wrapper.is-sticky .iot-style .a-cart-nav>ul>li{border-left: none;}
.iot-style .a-cart-nav>ul>li {padding:3px 20px 3px 0px; margin-top: 4px; position: relative;}	
.iot-style .a-cart-nav>ul>li + li{ padding-left: 20px; border-left:none; }
.iot-style .a-cart-nav>ul>li + li:after{
	content: '';
	display: block;
	position: absolute;
	top: 4px;
	left: 0;
	height: 30px;
	width: 1px;
	background: #265776;

}
.iot-style .a-cart-nav>ul>li.left-border {position: relative; border-left: none; }
.iot-style .a-cart-nav>ul>li.left-border:after{
	content: '';
	position: absolute;
	width: 1px;
	height: 22px;
	left: 0;
	top:8px;
	background: #FFF;
}
.iot-style .is-sticky .a-cart-nav>ul>li {
	border-left: none;
}
.iot-style .a-cart-nav li .dropdown-menu {margin-top: 0px; margin-left:-21px;border-top: 3px solid #3aadd5;  background:#00395e; padding: 0;}
.iot-style .a-cart-nav li .dropdown-menu li{color:#7acce3;  padding: 0;}
.iot-style .a-cart-nav li .dropdown-menu a{color: #2a7aaf; background: rgba(255, 255, 255, 0.9); display: block;border-bottom: 1px solid rgba(255, 255, 255, 0.8); padding:3px 10px; }
.iot-style .a-cart-nav { position: relative; }
.menu-option.iot-menu{
	min-height
}
.menu-option.iot-menu .sidebar{
	background: transparent;
}
.menu-option.iot-menu .sidebar .select2-choice:hover{
	background: transparent;
}
.iot-style .a-cart-nav .menu-option.iot-menu  { float: right; color: #FFF;
    background: #00395e; padding: 0; margin-top: 7px;}
.menu-option.iot-menu  .select2-choice{min-height: auto;height: 30px;line-height: 27px; color: #FFF;background: transparent; border-color: #FFF; font-size: 13px;}
.menu-option.iot-menu  .select2-choice .select2-arrow{background: transparent; line-height: 26px; padding-left: 2px;}
.menu-option.iot-menu  .select2-choice b[role="presentation"]{display: none;}
.iot-style .search-box {top:-100px;display:none;}
.iot-style .a-cart-nav .user-photo{width: 30px; height: 30px; border-radius: 50%;    margin-right: 5px;    margin-top: -3px;}
.iot-style .a-cart-nav .user-name,.iot-style .a-cart-nav .user-name:hover,.iot-style .a-cart-nav .log{font-size: 1.15em; color: #fff; text-decoration: none;}
/*--  mini menu box --*/
.iot-mini-menu-box:after{
	content: '';
	display: block;
	clear: both;
}
.iot-mini-menu-box .iot-active-func-nav{float: right;}
.iot-mini-menu-box .iot-active-func-nav i{color: #7acce3;}
.iot-active-func-nav>li {
    float: right;
    line-height: 42px;
    width: 55px;
    padding: 2px;
    text-align: center;
}
.iot-active-func-nav>li.search-area{
	padding-right: 18px;
}
.iot-active-func-nav>li.search-area form {
	margin-bottom: 0px;
}
@media screen and (min-width: 992px) {
	.iot-mini-menu-box{display: none;}
}


/*--fqd-function-menu--*/

.mini-function-menu{
	position: fixed;
	left: 50%;
	margin-left: 485px;
	z-index: 110;
}
.mini-function-menu.top{
	top: 60%;
}
.mini-function-menu.bottom{
	bottom: 50px;
}
.mini-function-menu .button-box {
	position: relative;
	display: block;
	width: 40px;
	height:40px;
	text-align: center;
	border: 1px solid #000;
	padding: 20px 5px 5px 5px;
	line-height: 1em;
	margin:0;	
	font-size: 11px;
	cursor: pointer;

}
.mini-function-menu .button-box+.button-box{
 	margin-top:5px;
}
.mini-function-menu .button-box.reply {
	background: url(../images/iot_style/answer_icon_2x.png) 50% 5px #fff no-repeat;
	background-size: 16px 13px;
	color: #000;
}
.mini-function-menu .button-box.top {
	background: url(../images/iot_style/top_icon_2x.png) 50% 5px #000 no-repeat;
	background-size: 16px 13px;
	color: #fff;
}

.mini-function-menu .dmtop{
	position: static;
}
@media screen and (min-width: 992px) and (max-width: 1100px){
	.mini-function-menu{
		margin-left: 430px;
	}
}
/* 
=================================================================
(#m03mcs) MAIN CONTENT
=================================================================
*/
.path-area.text-right{
	padding-left: 20px;
	text-align: left;
	background: url(../images/iot_style/past_icon_2x.png) 1px 50% no-repeat;
	background-size: 14px 12px;
}
.main-content-area.no-margin { margin-top: 0px; }

/*-- iot list title --*/
.iot-list-area { margin-top: 30px; }
.list-title-area { position: relative; border-bottom: 3px solid #DDDDDD; margin-bottom: 20px;}
.list-title-area.my-area{margin-bottom: 0px;}
.list-title-area.no-margin-bottom { margin-bottom: 0px; } 
.list-title-area.banner{ margin-bottom: 15px }
.list-title-area h4 { font-size: 21px; color: #2B7AAF; margin: 0px; }
.list-title-area .list-tag { position: absolute; top: 0px; font-size: 15px; line-height: 35px; color: #747474; width: 60px; text-align: center; text-decoration: none; display: inline-block; }
.list-title-area .list-tag.tag1 { right: 90px; }
.list-title-area .list-tag.tag2 { right: 15px; }
.list-title-area .list-tag.tag3 { right: 165px; }
.list-title-area .list-tag.tag4 { right: 240px; }
.list-title-area .list-tag:hover,.list-tag.selected { border-bottom: 3px solid #0075C1; }
.list-title-area .list-tag:hover:after,.list-tag.selected:after {
	display: block;
    content: '';
    border-width: 4px 4px 4px 4px;
    border-style: solid;
    border-color: transparent transparent #0075C1 transparent;
    position: absolute;
    left: 50%;
    margin-left: -2px;
    bottom: 0px;
}
.user_edit_btn{
   	vertical-align: top;
    display: inline-block;
    border: 2px solid #7AC2F0;
    padding: 12px;
    border-radius: 5px;
	background: url(../images/iot_style/user/pen_icon@2x.png) 50% 50% no-repeat;
    background-size: 20px;
}
}
@media screen and (min-width: 992px) {
	.iot-list-area { margin-top: 0px; }
}

@media (max-width: 948px){

.hidden-xs.top-img{
   padding-bottom: 10px;
}
}

@media (max-width: 912px){

.hidden-xs.top-img{
   padding-bottom: 15px;
}
}

@media (max-width: 872px){

	.hidden-xs.top-img{
   padding-bottom: 25px;
}
}

@media (max-width: 872px){

	.hidden-xs.top-img{
   padding-bottom: 35px;
}
}

@media (max-width: 790px){

	.hidden-xs.top-img{
   padding-bottom: 51px;
}
}


/*--iot list select page*/


/* hot status */
.hot-status {
	display: inline-block;
	width: 34px;
	height: 22px;
}
.hot-status.level0 { background: url(../images/iot_style/hot/hot0.png); background-size: 34px 22px; }
.hot-status.level1 { background: url(../images/iot_style/hot/hot1.png); background-size: 34px 22px; }
.hot-status.level2 { background: url(../images/iot_style/hot/hot2.png); background-size: 34px 22px; }
.hot-status.level3 { background: url(../images/iot_style/hot/hot3.png); background-size: 34px 22px; }
.hot-status.level4 { background: url(../images/iot_style/hot/hot4.png); background-size: 34px 22px; }
.hot-status.level5 { background: url(../images/iot_style/hot/hot5.png); background-size: 34px 22px; }





.iot-search-condition-area { border: 1px solid #7AC2F0; background: #fff; padding: 5px 15px; margin-bottom: 15px; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; color: #428CCA;}

.iot-menu-tag-area { color: #425E99; margin-bottom: 15px;}
.iot-menu-tag-area:after { content: ''; display: block; clear: both; }
.iot-menu-tag-area label,.iot-menu-tag-area a { display: block; }
.iot-menu-tag-area a { color: #5D5D62; }
.iot-menu-tag-area a:hover,.iot-menu-tag-area span.selected { color: #428CCA; text-decoration: none; }
.iot-menu-tag-area .tag-more-area { clear: both; text-align: center; padding-top: 15px; }
.iot-menu-tag-area .tag-more-area:after { content: ''; display: block; clear: both; }
.iot-menu-tag-area .tag-more-area a { position: relative; min-width: initial; color: #727272; text-decoration: none; float: right; } 
.iot-menu-tag-area .tag-more-area a:after {
	display: block;
    content: '';
    border-width: 8px 8px 8px 8px;
    border-style: solid;
    border-color: #727272 transparent transparent transparent;
    position: absolute;
    left: -12px;
    bottom: -4px;
}
.iot-menu-tag-area .tag-more-area a.up:after {
	border-color: transparent transparent #727272 transparent;
	bottom: initial;
	top: 0px;
}

.iot-menu-tag-area #MoreList { display: none; }

@media screen and (min-width: 768px) {
	.iot-menu-tag-area label,.iot-menu-tag-area a,.iot-menu-tag-area span {
		float: left;
		min-width: 50%;
		padding: 0px 10px;
	}
}


/* iot rating modal */

.bootbox .border {
	width: 100%;
	height: 2px;
	position: relative;
}
.bootbox .border:before {
	content: '';
	display: block;
	width: 100%;
	height: 1px;
	border-top: 1px dashed #ddd;
	position: absolute;
	top: 0;
	left: 0;
}

.rating-area .rating-row .rating-box {display:inline-block;min-width: 90px;}
.rating-area .rating-row .rating-box:after {content: '';display: block;clear: both;}
.rating-area .rating-title {
	line-height: 1.5;
}

.rating-area .rating { 
  border: none;
  float: left;
  transform: translateY(9px);
}
.rating-area .padding-bottom {
	padding-bottom: 10px;
}
.rating-area .rating > input { display: none; } 
.rating-area .rating > label:before { 
  cursor: pointer;
  margin: 0 5px;
  font-size: 1.25em;
  font-family: FontAwesome;
  display: inline-block;
  content: "\f005";
}

.rating-area .rating > .half:before { 
  content: "\f089";
  position: absolute;
}

.rating-area .rating > label { 
  color: #ddd; 
  float: right; 
  margin-bottom: 0px;
}

/***** CSS Magic to Highlight Stars on Hover *****/

.rating-area .rating > input:checked ~ label, /* show gold star when clicked */
.rating-area .rating:not(:checked) > label:hover, /* hover current star */
.rating-area .rating:not(:checked) > label:hover ~ label { color: #FFD700;  } /* hover previous stars in list */

.rating-area .rating > input:checked + label:hover, /* hover current star when changing rating */
.rating-area .rating > input:checked ~ label:hover,
.rating-area .rating > label:hover ~ input:checked ~ label, /* lighten current selection */
.rating-area .rating > input:checked ~ label:hover ~ label { color: #FFED85;  } 

/* iot social link */
.jiathis_style_32x32 {
	padding-top: 15px;
}
.jiathis_style_32x32 * {
	box-sizing: initial;
}
.jiathis_style_32x32 a {
	display: inline-block;
}
.jiathis_style_32x32 a+a {
	margin-left: 10px;
}
.jiathis_style_32x32 .jiathis_txt.jtico {
	display: inline-block !important;
	float: none; 
	margin-bottom: 15px;
}
.jiathis_style_32x32 .jiathis_counter_style {
	margin-bottom: 15px;
}
.jiathis_style_32x32:after {
	content: '';
	display: block;
	clear: both;
}
.jiathis_style * {
	box-sizing: initial;
}
.thx-area {margin-top: 15px;}
.thx-area span {display: block;}

.social-title {padding: 15px 15px 0;}



/*-- iot user faq list area --*/
.faq-content-area { position: relative; margin-bottom: 30px; }
@media screen and (min-width: 768px) {
	.faq-list-sorting-area{margin-top: 17px;}
	.faq-content-area { display: table; width: 100%; }
	.faq-content-area .faq-menu-area { display: table-cell; width: 215px; }
	.faq-content-area .faq-list-area { display: table-cell; padding-left: 35px; vertical-align: top; }
}
@media screen and (min-width: 992px) {
	.faq-content-area .faq-menu-area { display: table-cell; width: 320px; }
}






/*-- iot profile --*/


.profile-area-1{position: relative;}
.profile-area-1{margin-top: 10px;}
.profile-area-2 .user-info{padding:14px 14px 14px 14px; border:1px solid #DDDDDD; text-align: center;}
.profile-area-2 .user-info .user-photo-area{vertical-align: middle; }
.profile-area-2 .user-info img{border-radius: 8px; margin-bottom: 15px; max-width: 100%; max-height: 170px;}
.profile-area-2 .user-info .medal-area{margin-bottom: 15px; margin-left: -5px; margin-right: -5px;}
.profile-area-2 .user-info .medal-area .medal{ text-align: center;font-family: Arial; color: #333; font-size: 14px; display: inline-block;line-height: 18px; height: 15px; width: 56px;}
.profile-area-2 .user-info .medal-area .medal.gold{background-color: #FFC600;}
.profile-area-2 .user-info .medal-area .medal.silver{background-color:#D4D4D4;}
.profile-area-2 .user-info .medal-area .medal.copper{background-color: #D8A45A;}
.profile-area-2 .user-info .fans-area{font-size: 14px; color: #555555; border-bottom: 1px dashed #DDDDDD; padding-bottom: 14px; margin-bottom: 15px;}
.profile-area-2 .user-info .fans-area .fans-num{margin-top:-3px; font-family: Arial; font-weight: bold; font-size: 17px; color: #3c9ddc;}
.profile-area-2 .user-info .tech-area h5{font-size: 14px; color: #555555; font-weight: normal; }
.profile-area-2 .user-info .tech-area .tag{color:#E6792E; font-size: 10px display: inline-block; padding-right: 5px; }

.profile-area-1 .title-area .title{margin:0; font-size: 14px; color: #3598d7;}
.profile-area-1 .title-area .user-id{margin:0; font-size: 25px; color:#4c4c4c;}
.profile-area-1 .follow-status{position: absolute; right: 0;     top: 10px;}
.profile-area-1 .follow-status div{   margin-left: 10px; margin-right:0px; ;display: inline-block; position: relative; font-size:14px;color:#FFF;  border-radius: 4px; width: 43px ; height: 43px; border: 2px solid #3c9ddc; padding:15px; }
.profile-area-1 .follow-status .followed{background: url(../images/iot_style/user/forum_item5@2x.png) no-repeat; background-size: 30px; background-position: 5px 5px;}
.profile-area-1 .follow-status .unfollowed{ border:none; }
.profile-area-1 .follow-status .on-follow{background: url(../images/iot_style/user/forum_item6@2x.png) no-repeat; background-size: 30px; background-position: 5px 5px;}
.profile-area-1 .follow-status .not-on-follow{background-color: #3c9ddc; }
.profile-area-1 .follow-status .not-on-follow:after{content: '追隨';display: block; position:absolute; background: url(../images/iot_style/user/follow_icon@2x.png) no-repeat;    background-position: 11px 3px; width: 43px; height: 43px; left: -1px; top: -1px; padding:19px 0 0 6px;     background-size: 18px; }
.profile-area-1 .follow-status .not-on-follow:hover{    cursor: pointer;  }
.profile-area-1 .follow-status .not-on-follow:active{ opacity: .8;}

.profile-area-3 .intro{line-height: 24px; margin-top: 10px; font-size: 14px; color: #4c4c4c;}


@media screen and (min-width: 983px) {
	.profile-area-1{width: 710px ; float: right;}
	.profile-area-2{width: 205px ; float: left;}
	.profile-area-3{width: 710px ; float: right;}
	.profile-area-4{width: 710px ; float: right;}
	.profile-area-1 .user-info .fans-area{text-align: initial;}
	.profile-area-1 .user-info .fans-area .fans-num{float: right;}
	.profile-area-2 .user-info .fans-area,.profile-area-2 .user-info .tech-area{text-align: initial;}
	.profile-area-2 .user-info .fans-area .fans-num{float: right;}
}
@media screen and (min-width: 530px) and (max-width: 982px){

	.profile-area-1{width: 100%;}
	.profile-area-2{width: 100%;}
	.profile-area-3{width: 100%}
	.profile-area-2{position: relative;}
	.profile-area-2 .user-photo-area{width: 170px; height: 170px; float: left;}
	.profile-area-2 .user-data-area{padding-left: 220px;}
	.profile-area-2 .user-info {    min-height: 200px; text-align: initial !important;}
	.profile-area-2 .user-info .medal-area{padding-top: 20px;}

}





/*
=================================================================
(#m05hes) HELPERS
=================================================================
*/


.margin-bottom { margin-bottom: 10px; }

.header-fixed-top #sidebar-alt { z-index: 10; }
#toggle-btn{
	cursor: pointer;
}
/*
================================================================
Mobile Search Bar by WPG Klaus
================================================================

*/
.container-2{
 position: relative;
 bottom: 12px;
}
.container-2 input#search{
    width: 30px;
    height: 30px;
    position: relative;
    top: 8px;
    left: 3px;
    line-height: normal;
    border: none;
    font-size: 10pt;
    float: right;
    
    padding-left: 35px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    -webkit-transition: width .55s ease;
    -moz-transition: width .55s ease;
    -ms-transition: width .55s ease;
    -o-transition: width .55s ease;
    transition: width .55s ease;
    

}

.container-2 input#search::-webkit-input-placeholder {
   color: #65737e;
}
 
.container-2 input#search:-moz-placeholder { / Firefox 18- /
   color: #65737e;  
}
 
.container-2 input#search::-moz-placeholder {  / Firefox 19+ /
   color: #65737e;  
}
 
.container-2 input#search:-ms-input-placeholder {  
   color: #65737e;  
}

.container-2 .icon{
    position: absolute;
    z-index: 1;
    color: #4f5b66;
}

.container-2 input#search:focus, .container-2 input#search:active{
  outline:none;
  width: 200px;
  background: #f3f3f3;
}

.container-2 .icon{
    position: absolute;
    z-index: 1;
    color: #4f5b66;
    right: 8px;
}

.container-2 input#search:focus, .container-2 input#search:active{
  outline:none;
  width: 200px;
  background: #f3f3f3;
}