@charset "utf-8";

/* Mobile Size */
@media (max-width: 767px) {
	body {
		padding-top: 37px;
	}

	#search,
	#web_nav,
	#left_zone #share_juppers,
	#left_zone .ad,
	#left_zone #left_banner,
	#left_zone #recent_activity {
		display: none;
	}

	#mobile_left_banner {
		display: block;
	}

	.adslot_1 {
		display: none;
	}

	.adslot_2 {
		display: inline-block;
	}

	#content {
		/*padding-left: 15px;
		padding-right: 15px;*/
	}

	#uploadbtn {
		text-align: center;
	}

	#mobile_nav {
		display: block;
		position: fixed;
		top: 0;
		width: 100%;
		z-index: 9;
	}

	#logo {
		text-align: center;
	}

	.click_to_edit {
		display: none;
	}

	.uploadbtnOuter > div,
	.uploadbtnOuter div img {
		margin: 0 auto !important;
		text-align: center;
	}

	/* Menu */
	.menu {
		margin: 0;
		padding: 0 15px;
	}
	/* END Menu */

	/* Mobile Menu */
	#mobile_nav .mobile_icon span {
		font-size: 24px;
		color: #272727;
		margin-top: 10px;
	}

	#mobile_nav .dropdown-content {
	    min-width: 180px;
	    left: -14px;
	    /*box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);*/
	    z-index: 9;
	}

	#mobile_nav .mobile_icon span.blue,
	#mobile_nav .dropdown-content .blue {
		color: #5cc2dd;
	}

	#mobile_nav .dropdown-content .blue:hover {
		color: white;
	}

	#mobile_nav .mobile_icon:first-child {
		margin-right: 10px;
	}

	#mobile_nav .dropbtn {
	    padding: 0;
	    padding-bottom: 8px;
	}

	#mobile_nav .dropdown:hover .dropbtn {
	    background-color: #eaeaea;
	    color: #272727;
	}

	#mobile_nav .dropdown-content a {
	    color: black;
	    padding: 6px 16px;
	    text-decoration: none;
	    display: block;
	    text-align: left;
	}

	#mobile_nav .dropdown-content .sub_menu {
		padding-left: 32px;
	}
	/* END Mobile Menu */

	/* Categories */
	#left_zone {
		margin-bottom: 15px;
	}

	#categories h1 {
		cursor: pointer;
	}

	#categories h1 span {
		display: block;
	}

	#left_banner {
		padding-top: 15px;
	}

	/* Search Bar */
	#search {
		height: 40px;
		position: relative;
	}

	#search_bar {
		width: 320px;
		height: 40px;
		margin-top: 0;
		position: absolute;
		top: -2px;
		left: 0;
	}

	#search_bar input {
		vertical-align: bottom;
		width: 240px;
		height: 40px;
		border: 8px solid #eaeaea;
		border-left: 16px solid #eaeaea;
		font-size: 16px;
		padding: 5px;
		padding-left: 15px;
		color: #989898;
		outline: none;
	}

	#search_bar a.btn_search {
		font-size: 24px;
		color: #272727;
		padding-top: 7px;
		padding-left: 7px;
		width: 40px;
		height: 40px;
		display: inline-block;
		background-color: #eaeaea;
	}

	/* Paging */
	#content #paging {
		margin-left: 0;
		margin-bottom: 10px;
	}

	#content #paging ul li {
		display: block;
		width: 100%;
		background: #eaeaea;
	}

	#content #paging ul.my_profile li {
		width: 100%;
	}

	#content #paging ul li a {
		font-size: 20px;
		color: #272727;
		width: 100%;
		height: 40px;
		line-height: 40px;
		text-align: left;
		padding-left: 15px;
		text-transform: uppercase;
		text-decoration: none;
		display: inline-block;
	}

	#content #paging ul li a:hover {
		opacity: 0.7;
	}

	#content #paging ul li a.selected {
		color: white;
		background: #5cc2dd;
	}

	.mobile_title {
		font-size: 16px;
		color: #272727;
		padding-top: 10px;
		text-transform: uppercase;
		height: 50px;
		line-height: 50px;
	}

	/* Noti */
	#mobile_nav .btn_notif {
	    position: relative;
	}

	#mobile_nav .btn_notif span {
	    width: 20px;
	    height: 16px;
	    display: none;
	    position: absolute;
	    top: 7px;
	    right: 15px;
	    background-color: #5cc2dd;
	    border-radius: 4px;
	    color: #fff;
	    text-align: center;
	    font-size: 13px;
	    line-height: 20px;
	}

	#mobile_nav .dropbtn {
	    position: relative;
	}

	#mobile_nav .dropbtn span.noti_text {
		display: none;
	    width: 20px;
	    height: 16px;
	    position: absolute;
	    top: 0;
	    left: 15px;
	    background-color: #5cc2dd;
	    border-radius: 4px;
	    color: #fff;
	    text-align: center;
	    font-size: 13px;
	    line-height: 20px;
	}

	#recent_feedback {
		display:none;
	}
}

@media (min-width: 768px) {
	#recent_feedback {
		display:block;
	}
}

@media (min-width: 413px) and (max-width: 991px) {
	.item.col-xs-12 {
		width: 49.5%;
	}
}

@media (min-width: 768px) and (max-width: 991px) {
	#content #paging ul.my_profile li a {
		font-size: 12.5px;
	}
}

@media (max-width: 320px) {
	.forms .btn,
	.forms .btn_facebook_sign {
		width: 100%;
	}

	#facebook_pane .facebook_text {
		font-size: 16px;
	}
}

/* PAD Size 768px width */
@media (max-width: 991px) {
	.menu li a, .menu .dropbtn {
	    display: inline-block;
	    color: #272727;
	    font-weight: 700;
	    text-align: center;
	    padding: 14px 10px;
	    text-decoration: none;
	}

	#content #paging ul li a {
		font-size: 14px;
	}

	.feedback_zone .no_feedback { 
		margin-bottom: 0px;
	}
}

/* PAD Size 1024px width */
@media (min-width: 992px) and (max-width: 1199px) {
	#share_juppers a {
		font-size: 16px;
	}
}