/*
Theme Name: HumbleShop
Theme URI: http://humbleshop.pagodabox.com/
Author: Humblespace
Author URI: http://themeforest.net/user/humblespace
Description: Minimalist, clean, and simple responsive ecommerce HTML template.
Version: 1.0
License: GNU General Public License
License URI: license.txt
*/

/* ------------------------- */
/* CUSTOM STYLING START HERE */
/* ------------------------- */

/* =========== */
/* Font Colors */
/* =========== */

body {color:#333}
a {color:black}
button.theme, .share a, .share a:hover, .horizontal-nav li a:hover, a.btn.theme {color:white}
footer {color: #777}
footer a {color: #bbb}
a:hover, footer a:hover, footer a.active, aside a, em.on, .theme, .page h5, a.theme , .product .sidebar h5 {color: #E55137}

/* ================= */
/* Background colors */
/* ================= */

body {background: #fff}
.container, .horizontal-nav ul, h6.subhead strong {background: #FFF}
.feat .nav-pills > .active > a, .feat .nav-pills > .active > a:hover, .product .nav-pills > .active > a, .product .nav-pills > .active > a:hover, button.theme, .share a, .flex-control-paging li a.flex-active, .horizontal-nav li a:hover, a.btn.theme {background: url(../img/backg_menu02.png)}
.sidebar .tags span, .comments article:hover {background: #f2f2f2}
header.about {background: url(../img/banner_about_us.jpg) no-repeat scroll 0 0 rgba(0, 0, 0, 0);}
header.prime {background:url(../img/banner_visi.jpg) no-repeat}
footer, footer .container {background:#111}

/* ============= */
/* Border colors */
/* ============= */

.promo img {border: 1px solid #ddd}
.horizontal-nav ul li, .blog article, .line, hr, .product .sidebar li {/*border-top: 1px solid #ddd;*/}
.page .contactform {border-left: 1px solid #ddd}
/*.product .tab-content.sideline {border-left: 1px solid #ddd}*/
header.prime, .horizontal-nav ul li, .gmap  {/*border-bottom: 1px solid #ddd*/}
footer .doubleline {border-top:1px solid #333; border-bottom: 1px solid #333; }
.horizontal-nav ul li a {border-top: 1px solid rgba(255,255,255, 0.25); border-left: 1px solid rgba(255,255,255, 0.25)}


/* ------------------------ */
/* CUSTOM STYLING STOP HERE */
/* ------------------------ */

/*  ========== */
/* Font family */
/*  ========== */

.wf-active {font-family: 'Helvetica Nueue', Arial ,serif; font-size: 13px;}
.wf-active .logo {font-family: 'Helvetica', 'Aria', serif;}
.horizontal-nav ul li a, .single .cross-wrapper header, footer .foot strong {text-transform: uppercase; color:#FFF}
#tweet .tweet_time a, .share a {font-size: .85em}
strong, .single .cross-wrapper header {font-weight: 700}
button.theme {text-shadow: none}

/* ========== */
/* Core style */
/* ========== */

a, a:hover {text-decoration: none;}
.btn {border-radius: 0}
input, textarea, button {font-size: 1em !important}
form label, form .btn {font-size: 1em} form legend {font-size:1.2em}
.js .selectnav {display: none}
.wrap {padding:0 20px}
.tright {text-align: right} .tleft {text-align: left} .tcenter {text-align: center}
h6.subhead {margin-bottom: -10px;}
h6.subhead strong {padding: 0 10px; cursor: pointer}
hr {border-bottom: none}
.page .tab-pane.active, .post .tab-pane.active {padding: 10px}
.gmap { width: 100%; max-width: 940px; min-height: 300px; background: #ccc; text-align: center; }
.gmap img { vertical-align: top; max-width: 100%; }
.btn.theme {text-shadow:none}
img.alignleft {padding-right: 10px}
img.alignright {padding-left: 10px}

/* ========= */
/* Structure */
/* ========= */

.head.container {z-index: 9266}
.welcome.container {background: #111; color:#999; font-size: .9em}
.welcome a {color:white}
.welcome .greet, .welcome .cart {width: 46%; padding: 1%; position: relative}
.welcome .cartbubble {position: absolute; width:160px; right:1px; top:40px; text-align: left; z-index: 1; -webkit-backface-visibility: hidden; display: none}
.welcome .cartbubble hr {margin:10px 0; border-top:1px solid #999; border-bottom: 1px solid black}

.standard header {text-align: center; padding:20px 0}
.call-to-action {margin-top: 20px}

.top {padding-top: 20px; padding-bottom: 20px}
.top .logo a {font-size:4em; line-height:1em} 
.top .logo.image img {max-width:250px}
.top .cart {text-align: right;}
.top .cart .form {position: relative; margin-top:10px}
.top .cart .form button {position: absolute; top:8px; right:0; border:none; background: none}
.top .top-search { /*margin-right:20px;*/ margin-bottom:0; margin-top:5px; border-radius:0; width: 75px; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; transition: all .5s ease; }
.top .top-search:focus {width: 150px; padding-right: 18px}

.selectnav { display: block; width:90%; margin:0 auto 10px}
.nav {margin-bottom:0}
.nav-pills > li > a {border-radius: 0}
.horizontal-nav ul { text-align: center; display: none }
.horizontal-nav ul li { float:left; border-left: 2px #999; position: relative !important; background: repeat-x url(../img/backg_menu.png)}
.horizontal-nav ul li a { display: block; padding: 10px 0}
.horizontal-nav ul ul{ display: none; position: absolute; top:40px; left:0; z-index: 9266; width: 100%}
.horizontal-nav ul ul li {width: 100%; border:none; font-size: .85em}
.horizontal-nav ul li:first-child a { border-left: 2px #999; }
.horizontal-nav li a:hover { -webkit-transition: background-color 1000ms linear; -moz-transition: background-color 1000ms linear; -o-transition: background-color 1000ms linear; -ms-transition: background-color 1000ms linear; transition: background-color 1000ms linear; }

.home-panel {text-align: center; margin:30px 0px}

.promo, .feat {text-align: center}
.promo article {max-width: 320px; line-height: 0}
.promo img:hover {opacity: .5}

.banner {position:relative}
.arrow {position:absolute; bottom:3%; font-size: 2em; padding-left:10px}
.arrow a {cursor: pointer; color:white}
.arrow a i {display: block}
.arrow .pull-left, .arrow .pull-right {width:25px}

.login form {padding:20px}
.login .form-horizontal .control-label {width:100px}
.login .form-horizontal .controls {margin-left: 120px}
address {margin-bottom: .5em}
address .clabel {width:5%; padding-right: 5%}
address .cdata {width:90%}

/* ================ */
/* Featured section */
/* ================ */

.feat .headline, .feat .tab-content {padding: 30px 0}
.feat article {position:relative; font-size: 1em}
.feat .tab-content .wrap {margin-bottom:30px}
.feat #myTab {padding:20px 0; margin-top: -35px}
.feat #myTab button {text-transform: uppercase}
.feat .btn-group > .btn {font-size:11px !important; text-shadow: none; -webkit-font-smoothing: antialiased; border-radius: 0;}
.feat .line {margin-top:30px}
.feat .view {margin: 20px}
.feat .brands {padding:30px 0}
.feat .tab-brand {padding: 0 20px 30px}
.feat .tab-brand img {opacity: .6} .feat .tab-brand img:hover {opacity: 1}

/* ============ */
/* Hover effect */
/* ============ */

.view { max-width: 320px; overflow: hidden; position: relative; text-align: center; cursor: default; background: #fff; }
.view .mask,
.view .content { height: 100%; position: absolute; overflow: hidden; top: 0; left: 0; }
.view img { display: block; position: relative; }
.view h2 { text-transform: uppercase; color: #fff; text-align: center; position: relative; font-size: 1em; line-height: 1em; padding:20px 0 0 0; background: rgba(0, 0, 0, 0.8); margin: 20px 0 0 0; }
.view p { font-family: Georgia, serif; font-style: italic; font-size: 12px; line-height: 1em; position: relative; color: black; padding: 20px 20px 10px; text-align: center; }
.view a.info { display: inline-block; text-decoration: none; padding: 3px 8px; background: #000; font-size: .7em; color: #fff; text-transform: uppercase; -webkit-box-shadow: 0 0 1px #000; -moz-box-shadow: 0 0 1px #000; box-shadow: 0 0 1px #000; }
.view a.info: hover { -webkit-box-shadow: 0 0 5px #000; -moz-box-shadow: 0 0 5px #000; box-shadow: 0 0 5px #000; }
.view-thumb img { -webkit-transform: scaleY(1); -moz-transform: scaleY(1); -o-transform: scaleY(1); -ms-transform: scaleY(1); transform: scaleY(1); -webkit-transition: all 0.7s ease-in-out; -moz-transition: all 0.7s ease-in-out; -o-transition: all 0.7s ease-in-out; -ms-transition: all 0.7s ease-in-out; transition: all 0.7s ease-in-out; }
.view-thumb .mask { background-color: rgba(255, 231, 179, 0.3); -webkit-transition: all 0.5s linear; -moz-transition: all 0.5s linear; -o-transition: all 0.5s linear; -ms-transition: all 0.5s linear; transition: all 0.5s linear; -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); opacity: 0; }
.view-thumb h2 { border-bottom: 1px solid rgba(0, 0, 0, 0.3); background: transparent; margin: 20px 20px 0px; padding-bottom: 10px; -webkit-transform: scale(); -moz-transform: scale(); -o-transform: scale(); -ms-transform: scale(); transform: scale(); color: #333; -webkit-transition: all 0.5s linear; -moz-transition: all 0.5s linear; -o-transition: all 0.5s linear; -ms-transition: all 0.5s linear; transition: all 0.5s linear; -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); opacity: 0; }
.view-thumb p { color: #333; -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); opacity: 0; -webkit-transform: scale(); -moz-transform: scale(); -o-transform: scale(); -ms-transform: scale(); transform: scale(); -webkit-transition: all 0.5s linear; -moz-transition: all 0.5s linear; -o-transition: all 0.5s linear; -ms-transition: all 0.5s linear; transition: all 0.5s linear; }
.view-thumb a.info { -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); opacity: 0; -webkit-transform: scale(); -moz-transform: scale(); -o-transform: scale(); -ms-transform: scale(); transform: scale(); -webkit-transition: all 0.5s linear; -moz-transition: all 0.5s linear; -o-transition: all 0.5s linear; -ms-transition: all 0.5s linear; transition: all 0.5s linear; }
.view-thumb:hover img { -webkit-transform: scale(10); -moz-transform: scale(10); -o-transform: scale(10); -ms-transform: scale(10); transform: scale(10); -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); opacity: 0; }
.view-thumb:hover .mask { -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); opacity: 1; }
.view-thumb:hover h2,
.view-thumb:hover p,
.view-thumb:hover a.info { -webkit-transform: scale(1); -moz-transform: scale(1); -o-transform: scale(1); -ms-transform: scale(1); transform: scale(1); -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); opacity: 1; }

/* ============== */
/* Header section */
/* ============== */
header.prime {padding: 30px 0; text-align: center; margin-bottom: 30px}
header.prime a {color: black}

header.about {padding: 30px 0; text-align: center; margin-bottom: 0; height:100px}
header.about a {color: black}

/* ================ */
/* Products section */
/* ================ */
.product .product-pad {margin-top:30px}
.product {text-align: center}
.product p {
	line-height: 30px;
	text-align: center;
	margin: 0px 20px 0px 20px !important;
	border-left:1px solid #CCC;
	border-bottom:1px solid #CCC;
	border-right:1px solid #CCC;	
	}
.product p:hover {
	background-color:#CCC
	}
.product .nav {padding:20px 0 0}
.product article {position:relative; overflow: hidden; text-align: center}
.product article a {color: #818282 !important; text-transform: uppercase}
.product article a:hover {text-decoration: none}
.product .tab-content {padding:50px 0 30px}
.product .tab-content.sideline {margin: 0 0 30px; padding:0}
.product .tab-content.sideline article {width: 33%; float:left}
.product .tab-content .wrap {margin-bottom:30px}
.product .overlay {padding-top:15px}
.product .query {display: none}
.product .query li {float: none; display: inline-block; zoom:1}
.product #myTab {padding-bottom: 20px}
.product .view {margin: 20px 20px 0px 20px}
.product .sidebar {padding-left: 10px;border-right: 2px solid #DDDDDD;}
.product .sidebar li:first-child {border-top: none}
.product .sidebar li li {/*padding-left: 10px;*/ font-size: 1 em}
.product .sidebar, .product .sidebar article {text-align: left}
.product .sidebar section {margin-bottom: 50px}
.product .sidebar section article {margin-bottom: 10px}
.product .sidebar .thumb {width:30%; float: left; padding-right: 5%}
.product .sidebar .info {width: 65%; float:left; font-size: .9em; padding-top: 5px}
.product .sidebar img {float:left; padding-right: 10px}

/* ================ */
/* Banner Border */
/* ================ */
.banner-border {border-bottom: 2px solid #DDDDDD; padding-bottom:15px}

/* ================ */
/* Products Sub section */
/* ================ */
.product-sub .product-pad {margin-top:30px}
.product-sub {text-align: center}
.product-sub article p {
	line-height: 30px;
	text-align: center;
	margin: 0px 10px 0px 10px !important;
	box-shadow: 5px 5px 5px #DDDDDD;	
	}
.product-sub article p:hover {
	background-color:#666;
	color: #FFF;
	}
.product-sub .nav {padding:20px 0 0}
.product-sub article {position:relative; overflow: hidden; text-align: center}
.product-sub article a {color: #818282; text-transform: uppercase}
.product-sub article a:hover {text-decoration: none; color: #FFF !important;background-color:#666;}
.product-sub .tab-content {padding:50px 0 30px}
.product-sub .tab-content.sideline {margin: 0 0 30px; padding:0}
.product-sub .tab-content.sideline article {width: 25%; float:left}
.product-sub .tab-content .wrap {margin-bottom:30px}
.product-sub .overlay {padding-top:15px}
.product-sub .query {display: none}
.product-sub .query li {float: none; display: inline-block; zoom:1}
.product-sub #myTab {padding-bottom: 20px}
.product-sub .view {margin: 0px 10px 20px 10px; box-shadow: 5px 5px 5px #DDDDDD;}
.product-sub .sidebar {padding-left: 10px;border-right: 2px solid #DDDDDD;}
.product-sub .sidebar li:first-child {border-top: none}
.product-sub .sidebar li li {/*padding-left: 10px;*/ font-size: 1 em}
.product-sub .sidebar, .product-sub .sidebar article {text-align: left}
.product-sub .sidebar section {margin-bottom: 50px}
.product-sub .sidebar section article {margin-bottom: 10px}
.product-sub .sidebar .thumb {width:30%; float: left; padding-right: 5%}
.product-sub .sidebar .info {width: 65%; float:left; font-size: .9em; padding-top: 5px}
.product-sub .sidebar img {float:left; padding-right: 10px; height:20px; width:20px}

/* ================ */
/* Products Series section */
/* ================ */
.product-series .product-pad {margin-top:30px}
.product-series {text-align: center}
.product-series article p {
	line-height: 30px;
	text-align: center;
	margin: 0px 10px 0px 10px !important;
	border-right: 2px solid #DDDDDD;
	border-bottom: 2px solid #DDDDDD;
}
.product-series .nav {padding:20px 0 0}
.product-series article {position:relative; overflow: hidden; text-align: center}
.product-series article a {color: #818282}
.product-series article a:hover {text-decoration: none; color: #000 !important;}
.product-series .tab-content {padding:50px 0 30px}
.product-series .tab-content.sideline {margin: 0 0 30px; padding:0}
.product-series .tab-content.sideline article {width: 25%; float:left; padding-bottom:10px}
.product-series .tab-content .wrap {margin-bottom:30px}
.product-series .overlay {padding-top:15px}
.product-series .query {display: none}
.product-series .query li {float: none; display: inline-block; zoom:1}
.product-series #myTab {padding-bottom: 20px}
.product-series .view {margin: 0px 10px}
.product-series .sidebar {padding-left: 10px;border-right: 2px solid #DDDDDD;}
.product-series .sidebar li:first-child {border-top: none}
.product-series .sidebar li li {/*padding-left: 10px;*/ font-size: 1 em}
.product-series .sidebar, .product-series .sidebar article {text-align: left}
.product-series .sidebar section {margin-bottom: 50px}
.product-series .sidebar section article {margin-bottom: 10px}
.product-series .sidebar .thumb {width:30%; float: left; padding-right: 5%}
.product-series .sidebar .info {width: 65%; float:left; font-size: .9em; padding-top: 5px}
.product-series .sidebar img {float:left; padding-right: 10px; height:20px; width:20px}

/* ================ */
/* Products View section */
/* ================ */
.product-view .product-pad {margin-top:30px}
.product-view article p {
	line-height: 30px;
	text-align: center;
	margin: 0px 10px 0px 10px !important;
}
.product-view .nav {padding:20px 0 0}
.product-view article {position:relative; overflow: hidden; text-align: center;}
.product-view article a {color: #818282}
.product-view article a:hover {text-decoration: none; color: #000 !important;}
.product-view .function {position:relative; overflow: hidden; text-align: center;}
.product-view .function a {color: #818282}
.product-view .function a:hover {text-decoration: none; color: #000 !important;}
.product-view .tab-content {padding:50px 0 30px}
.product-view .tab-content.sideline {margin: 15px 0 5px; padding:0 0 0 15px}
.product-view .tab-content.sideline article {width: 20%; float:left}
.product-view .tab-content.sideline .function {width: 33%; float:left}
.product-view .tab-content .wrap {margin-bottom:30px}
.product-view .overlay {padding-top:15px}
.product-view .query {display: none}
.product-view .query li {float: none; display: inline-block; zoom:1}
.product-view #myTab {padding-bottom: 20px}
.product-view article .view {margin: 0px 5px 0px 10px; border:1px solid #DDDDDD}
.product-view .function .view {margin: 0px 5px 0px 10px}
.product-view .sidebar {padding-left: 10px;border-right: 2px solid #DDDDDD;}
.product-view .sidebar li:first-child {border-top: none}
.product-view .sidebar li li {/*padding-left: 10px;*/ font-size: 1 em}
.product-view .sidebar, .product-view .sidebar article {text-align: left}
.product-view .sidebar section {margin-bottom: 50px}
.product-view .sidebar section article {margin-bottom: 10px}
.product-view .sidebar .thumb {width:30%; float: left; padding-right: 5%}
.product-view .sidebar .info {width: 65%; float:left; font-size: .9em; padding-top: 5px}
.product-view .sidebar img {float:left; padding-right: 10px}

.cube1 {width:780px; float:left}
.cube1-function {width:748px; float:left; border:1px solid #DDDDDD; margin:0px 20px 20px 25px;}
.cube1-5 {width:480px; padding: 0px 5px; float:left}
.cube2 {width:380px; padding: 0px 5px; float:left}
.cube2-5 {width:440px; padding: 0px 5px; float:left}
.cube3 {width:240px; padding: 0px 5px; float:left}

.cube-function {border:1px solid #DDDDDD}
.function-icon ul {margin: 10px 0px}
.function-icon ul li {
	padding-bottom: 10px; 
	float:left; 
	list-style:none;
	padding: 8px 0px;
	width:110px
}
.function-icon ul li img {float:left; width:30px;}
.function-icon ul li p {float:left; padding:5px 5px; margin:0; font-size:11px}
/* ====================== */
/* Single product section */
/* ====================== */

.single {padding-bottom:50px}
.single .wrapper {padding:10px 20px}
.single .screen a {display: none}
.single .cross-wrapper {padding: 0 20px; text-align: center}
.single .cross-wrapper header {padding:10px 0 25px}
.single .flex-control-nav {bottom:-30px !important}
.single #flexcarousel-product {margin-top: 10px}
.single #flexcarousel-product li {padding: 2px; cursor: pointer}
.single form {margin-bottom: 0}
.single .price {padding:10px 0}
.single .decider {font-size: 1.6em; text-align: right;}
.single .decider a {display: inline-block}
.single .view {margin: 10px auto}
.single .qty {position: relative; width:55px;margin-right: 20px}
.single .qty input {width: 20px; text-align: center}
.single .qty .total {position: absolute; right:0; top:-5px}
.single .qty .total a {display: block;}

/* ============ */
/* Page section */
/* ============ */

.page {padding-bottom: 30px}
.page .contactform {margin-top: 20px}
.page .contactform textarea {width:95%}

/* ============ */
/* Blog section */
/* ============ */
.blog .banner {margin-bottom: 30px;}
.blog header i {padding-left:10px}
.blog .one-blog {padding-bottom: 30px}
.blog .first-blog {padding-bottom: 30px; border-bottom: 1px solid #CCC}
.blog .list-blog {padding: 30px 0; border-bottom: 1px solid #CCC}
.blog h4 {margin-top:0}
.blog .last-blog {padding: 30px 0; border-bottom: 0 none !important}
.blog a h4 {font-size: 16px; text-transform: uppercase} 
.blog small.date, .blog small.comments {font-style: italic}
.blog small.date { padding:5px 5px 5px 0}
.blog small.comments {padding:5px; }
.blog .post article {padding-top:20px}
.blog .post article:first-child {padding-top: 0}
.share {text-align: center}
.share a {padding:5px}

/* =============== */
/* Sidebar section */
/* =============== */

.sidebar aside {margin-bottom:20px; padding-right:20px}
.sidebar aside .title {text-transform: uppercase; font-weight: 700}
.sidebar ul {margin:0}
.sidebar ul {list-style: none}
.sidebar .tags span {float:left; padding:5px 8px; margin:0 5px 5px 0}

/* =============== */
/* Home Info */
/* =============== */

.home-info {float:left; width:100%; margin-top:30px}
.home-info ul {margin: 0 !important; padding:0 !important}
.home-info ul li {
	float:left; 
	list-style:none; 
	padding-right:15px; 
	padding-left: 10px; 
	border-right: 2px solid #FCC;
	padding-bottom: 30px;
	background: center bottom no-repeat url(../img/line_kecil.png);
}
.home-info ul li:hover {
	float:left; 
	list-style:none; 
	padding-right:15px; 
	padding-left: 10px; 
	border-right: 2px solid #FCC;
	padding-bottom: 30px;
	background: center bottom no-repeat url(../img/line_besar.png);
}
.home-info ul li.first-list {float:left; list-style:none}
.home-info ul li.second-list {float:left; list-style:none}
.home-info ul li.last-list {float:left; list-style:none; border-right: 0}
.box4 {width:280px}
.home-info ul li .thumb  {float:left; border: none}
.home-info ul li .thumb img  {border: none}
.home-info ul li .description {padding-left: 120px;}
.home-info ul li .description h4 {text-align:left; text-transform:uppercase}
.home-info ul li .description .cut-desc {font: 12px; text-align:left}

/* =============== */
/* Comment section */
/* =============== */

.comments {padding:10px 20px}
.comments .avatar {width:10%; border-radius: 50%}
.comments .text {width:85%}
.comments article {border:none; padding:10px}
.comment-form {padding:20px}

/* ============ */
/* Cart section */
/* ============ */

.cart .wrap-table {margin: 20px}
.cart table .cart-img {width:15%; padding: 5px 0; margin-right:3%}
.cart table .item {width:80%; font-size: 1.3em; padding-top: 40px}
.cart table .item a {display: inline-block;}
.cart table tbody td {padding-top:40px;}
.cart table tbody td:first-child {padding-top:0px;}
.cart-pay .cart-checkout {text-align: right}

/* ============== */
/* Footer section */
/* ============== */

footer {padding:30px 0; margin-top: 30px}
footer .foot strong {padding-bottom: 10px; display: block}
footer .foot ul, footer .social ul {margin: 0; padding: 0}
footer .foot ul li {list-style: none}
footer .social ul li {list-style: none; float:left; padding-left:10px}
footer .social li a {display: inline-block;}
footer .social .pull-left, footer .social .pull-right {width:50%} 
footer .social .pull-right ul {float: right}
footer .social .pull-right ul li a img {border-radius: 50% 50% 50% 50%; -webkit-transition: all 0.3s ease-in-out 0s; -moz-transition: all 0.3s ease-in-out 0s; -o-transition: all 0.3s ease-in-out 0s;transition: all 0.3s ease-in-out 0s; }
footer .social .pull-right ul li a img:hover {border-radius: 50% 0% 50% 0%; -webkit-transition: all 0.3s ease-in-out 0s; -moz-transition: all 0.3s ease-in-out 0s; -o-transition: all 0.3s ease-in-out 0s;transition: all 0.3s ease-in-out 0s}
footer input, footer .add-on {border-radius: 0 !important}
footer .doubleline {padding: 20px 0 10px; margin: 30px 0}
footer .currency {text-align: right} footer .currency a {padding-left: 5px}

.carousel {margin-bottom: 0}
.carousel-control {top:90%; border: none; background: none}
.carousel-control.right {left: 60px}

/* ======== */
/* Fancybox */
/* ======== */

.fancybox-wrap, .fancybox-skin, .fancybox-outer, .fancybox-inner, .fancybox-image, .fancybox-wrap iframe, .fancybox-wrap object, .fancybox-nav, .fancybox-nav span, .fancybox-tmp { padding: 0; margin: 0; border: 0; outline: none; vertical-align: top; }
.fancybox-wrap { position: absolute; top: 0; left: 0; z-index: 8020; }
.fancybox-skin { position: relative; background: #f9f9f9; color: #444; text-shadow: none; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; }
.fancybox-opened { z-index: 8030 }
.fancybox-opened .fancybox-skin { -webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); }
.fancybox-outer, .fancybox-inner { position: relative }
.fancybox-inner { overflow: hidden }
.fancybox-type-iframe .fancybox-inner { -webkit-overflow-scrolling: touch }
.fancybox-error { color: #444; font: 14px/20px "Helvetica Neue",Helvetica,Arial,sans-serif; margin: 0; padding: 15px; white-space: nowrap; }
.fancybox-image, .fancybox-iframe { display: block; width: 100%; height: 100%; }
.fancybox-image { max-width: 100%; max-height: 100%; }
#fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span { background-image: url('../img/fancybox_sprite.png') }
#fancybox-loading { position: fixed; top: 50%; left: 50%; margin-top: -22px; margin-left: -22px; background-position: 0 -108px; opacity: 0.8; cursor: pointer; z-index: 8060; }
#fancybox-loading div { width: 44px; height: 44px; background: url('../img/fancybox_loading.gif') center center no-repeat; }
.fancybox-close { position: absolute; top: -18px; right: -18px; width: 36px; height: 36px; cursor: pointer; z-index: 8040; }
.fancybox-nav { position: absolute; top: 0; width: 40%; height: 100%; cursor: pointer; text-decoration: none; background: transparent url('../img/blank.gif'); /* helps IE */ -webkit-tap-highlight-color: rgba(0,0,0,0); z-index: 8040; }
.fancybox-prev { left: 0 }
.fancybox-next { right: 0 }
.fancybox-nav span { position: absolute; top: 50%; width: 36px; height: 34px; margin-top: -18px; cursor: pointer; z-index: 8040; visibility: hidden; }
.fancybox-prev span { left: 10px; background-position: 0 -36px; }
.fancybox-next span { right: 10px; background-position: 0 -72px; }
.fancybox-nav:hover span { visibility: visible }
.fancybox-tmp { position: absolute; top: -9999px; left: -9999px; visibility: hidden; }

/* Overlay helper */
.fancybox-lock { overflow: hidden }
.fancybox-overlay { position: absolute; top: 0; left: 0; overflow: hidden; display: none; z-index: 8010; background: url('../img/fancybox_overlay.png'); }
.fancybox-overlay-fixed { position: fixed; bottom: 0; right: 0; }
.fancybox-lock .fancybox-overlay { overflow: auto; overflow-y: scroll; }

/* Title helper */
.fancybox-title { visibility: hidden; position: relative; text-shadow: none; z-index: 8050; }
.fancybox-opened .fancybox-title { visibility: visible }
.fancybox-title-float-wrap { position: absolute; bottom: 0; right: 50%; margin-bottom: -35px; z-index: 8050; text-align: center; }
.fancybox-title-float-wrap .child { display: inline-block; margin-right: -100%; padding: 2px 20px; background: transparent; /* Fallback for web browsers that doesn't support RGBa */ background: rgba(0, 0, 0, 0.8); -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; text-shadow: 0 1px 2px #222; color: #FFF; font-weight: bold; line-height: 24px; white-space: nowrap; }
.fancybox-title-outside-wrap { position: relative; margin-top: 10px; color: #fff; }
.fancybox-title-inside-wrap { padding-top: 10px }
.fancybox-title-over-wrap { position: absolute; bottom: 0; left: 0; color: #fff; padding: 10px; background: #000; background: rgba(0, 0, 0, .8); }

/* ================== */
/* Flexslider styling */
/* ================== */

.flex-container a:active,
.flexslider a:active,
.flex-container a:focus,
.flexslider a:focus  {outline: none;}
.flexslider-home a:focus  {outline: none;}
.slides,
.flex-control-nav,
.flex-direction-nav {margin: 0; padding: 0; list-style: none;} 

/* FlexSlider Necessary Styles
*********************************/ 
.flexslider {margin: 0; padding: 0; padding-bottom: 16px; border: 1px solid #DDDDDD}
.flexslider .slides > li {display: none; -webkit-backface-visibility: hidden; position: relative}
.flexslider .slides img {width: 100%; display: block;}
.flex-pauseplay span {text-transform: capitalize;}

/* FlexSlider Home Necessary Styles
*********************************/ 
.flexslider-home {margin: 0; padding: 0; padding-bottom: 16px;
	background: center bottom  no-repeat url(../img/list_image_home.jpg);}
.flexslider-home .slides > li {display: none; -webkit-backface-visibility: hidden; position: relative}
.flexslider-home .slides img {width: 100%; display: block;}

/* Clearfix for the .slides element */
.slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;} 
html[xmlns] .slides {display: block;} 
* html .slides {height: 1%;}

/* No JavaScript Fallback */
/* If you are not using another script, such as Modernizr, make sure you
 * include js that eliminates this class on page load */
.no-js .slides > li:first-child {display: block;}


/* FlexSlider Default Theme
*********************************/
.flexslider {margin-bottom:35px; position: relative; zoom: 1;}
.flexslider-home {margin: 0; position: relative; zoom: 1;}
.flex-viewport {max-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; transition: all 1s ease;}
.loading .flex-viewport {max-height: 300px;}
.flexslider .slides {zoom: 1;}

.carousel li {margin-right: 5px}
.carousel-option #flexcarousel img {cursor: pointer; border:2px solid white; width: 184px}
.carousel-option.home {padding-bottom: 30px}


/* Direction Nav */
.flex-direction-nav a {width: 30px; height: 30px; margin: -20px 0 0; display: block; background: url(../img/bg_direction_nav.png) no-repeat 0 0; position: absolute; top: 50%; cursor: pointer; text-indent: -9999px; opacity: 0; -webkit-transition: all .3s ease;}
.flex-direction-nav .flex-next {background-position: 100% 0; right: -36px; }
.flex-direction-nav .flex-prev {left: -36px;}
.flexslider:hover .flex-next {opacity: 0.8; right: 5px;}
.flexslider:hover .flex-prev {opacity: 0.8; left: 5px;}
.flexslider:hover .flex-next:hover, .flexslider:hover .flex-prev:hover {opacity: 1;}
.flexslider-home:hover .flex-next {opacity: 0.8; right: 5px;}
.flexslider-home:hover .flex-prev {opacity: 0.8; left: 5px;}
.flexslider-home:hover .flex-next:hover, .flexslider:hover .flex-prev:hover {opacity: 1;}
.flex-direction-nav .disabled {opacity: .3!important; filter:alpha(opacity=30); cursor: default;}
.flex-caption {width: 300px; padding: 2%; position: absolute; right: 5%; top: 25%; background: rgba(0, 0, 0, 0.6); color: white; text-align: left; text-shadow: rgba(0, 0, 0, 0.298039) 0px -1px 0px; font-size: 14px; line-height: 18px;}

/* Control Nav */
.flex-control-nav {width: 100%; position: absolute; bottom: -30px; text-align: center;}
.flex-control-nav li {margin: 0 6px; display: inline-block; zoom: 1; *display: inline;}
.flex-control-paging li a {width: 8px; height: 8px; display: block; background: #666; background: rgba(0,0,0,0.5); cursor: pointer; text-indent: -9999px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; border-radius: 20px; box-shadow: inset 0 0 3px rgba(0,0,0,0.3);}
.flex-control-paging li a:hover { background: #333; background: rgba(0,0,0,0.7); }
.flex-control-paging li a.flex-active { cursor: default; }

.flex-control-thumbs {margin: 5px 0 0; position: static; overflow: hidden;}
.flex-control-thumbs li {width: 25%; float: left; margin: 0;}
.flex-control-thumbs img {width: 100%; display: block; opacity: .7; cursor: pointer;}
.flex-control-thumbs img:hover {opacity: 1;}
.flex-control-thumbs .active {opacity: 1; cursor: default;}

/* =========== */
/* Bubble Cart */
/* =========== */
.arrow-box {position: relative; background: #111111; border: 1px solid #555555; padding: 5px; font-size: .85em; text-transform: uppercase }
.arrow-box:after, .arrow-box:before { bottom: 100%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; }
.arrow-box:after { border-color: rgba(17, 17, 17, 0); border-bottom-color: #111; border-width: 10px; left: 50%; margin-left: -10px; }
.arrow-box:before { border-color: rgba(85, 85, 85, 0); border-bottom-color: #555555; border-width: 11px; left: 50%; margin-left: -11px;}

/* ============== */
/* Payment method */
/* ============== */
.payment { background: url(../img/payment.png) no-repeat; float: left; padding-right: 5px; opacity: .5}
.payment:hover {opacity: 1}
.twocheckout { width: 38px; height: 24px; background-position: -49px -140px; }
.amex { width: 38px; height: 24px; background-position: -0px -140px; }
.cirrus { width: 38px; height: 24px; background-position: -147px -105px; }
.delta { width: 38px; height: 24px; background-position: -147px -70px; }
.direct-debit { width: 38px; height: 24px; background-position: -147px -35px; }
.discover { width: 38px; height: 24px; background-position: -148px -0px; }
.ebay { width: 38px; height: 24px; background-position: -98px -105px; }
.google { width: 38px; height: 24px; background-position: -49px -105px; }
.maestro { width: 39px; height: 24px; background-position: -0px -0px; }
.mastercard { width: 38px; height: 24px; background-position: -0px -105px; }
.moneybookers { width: 38px; height: 24px; background-position: -98px -70px; }
.paypal { width: 38px; height: 24px; background-position: -49px -70px; }
.sagepay { width: 38px; height: 24px; background-position: -0px -70px; }
.solo { width: 38px; height: 24px; background-position: -98px -35px; }
.switch { width: 38px; height: 24px; background-position: -49px -35px; }
.visaelectron { width: 38px; height: 24px; background-position: -0px -35px; }
.visa { width: 38px; height: 24px; background-position: -99px -0px; }
.westernunion { width: 38px; height: 24px; background-position: -50px -0px; }

/* Pre Style */

.pre-style { background: white; width: 130px; font-size: .9em; padding: 10px; position: fixed; top: 5%; left: -150px; }
input.miniColors { margin-right: 4px; margin-bottom: 0; border-radius: 0; height: auto; padding: 0 5px; font-size: 12px; }
.pre-style ul, .pre-style li {list-style: none}
.minicolors {
	position: relative;
	display: inline-block;
	z-index: 1;
}

.minicolors-focus {
	z-index: 2;
}

.minicolors.minicolors-theme-default .minicolors-input {
    margin: 0px;
	margin-right: 3px;
	border: solid 1px #CCC;
	font: 14px sans-serif;
	width: 65px;
	height: 16px;
	border-radius: 0;
	box-shadow: inset 0 2px 4px rgba(0, 0, 0, .04);
	padding: 2px;
	margin-right: -1px;
}

.minicolors-theme-default.minicolors .minicolors-input {
	vertical-align: middle;
	outline: none;
}

.minicolors-theme-default.minicolors-swatch-left .minicolors-input {
    margin-left: -1px;
    margin-right: auto;
}

.minicolors-theme-default.minicolors-focus .minicolors-input,
.minicolors-theme-default.minicolors-focus .minicolors-swatch {
	border-color: #999;
}

.minicolors-hidden {
	position: absolute;
	left: -9999em;
}

.minicolors-swatch {
	position: relative;
	width: 20px;
	height: 20px;
	background: url(http://raw.github.com/claviska/jquery-miniColors/master/jquery.minicolors.png) -80px 0;
	border: solid 1px #CCC;
	display: inline-block;
	vertical-align: middle;
}

.minicolors-swatch SPAN {
	position: absolute;
	width: 100%;
	height: 100%;
	background: none;
	box-shadow: inset 0 9px 0 rgba(255, 255, 255, .1);
	display: inline-block;
}

/* Panel */
.minicolors-panel {
	position: absolute;
	top: 26px;
	left: 0;
	width: 173px;
	height: 152px;
	background: white;
	border: solid 1px #CCC;
	box-shadow: 0 0 20px rgba(0, 0, 0, .2);
	display: none;
}

.minicolors-position-top .minicolors-panel {
	top: -156px;
}

.minicolors-position-left .minicolors-panel {
	left: -83px;
}

.minicolors-position-left.minicolors-with-opacity .minicolors-panel {
	left: -104px;
}

.minicolors-with-opacity .minicolors-panel {
	width: 194px;
}

.minicolors .minicolors-grid {
	position: absolute;
	top: 1px;
	left: 1px;
	width: 150px;
	height: 150px;
	background: url(http://raw.github.com/claviska/jquery-miniColors/master/jquery.minicolors.png) -120px 0;
	cursor: crosshair;
}

.minicolors .minicolors-grid-inner {
	position: absolute;
	top: 0;
	left: 0;
	width: 150px;
	height: 150px;
	background: none;
}

.minicolors-slider-saturation .minicolors-grid {
	background-position: -420px 0;
}

.minicolors-slider-saturation .minicolors-grid-inner {
	background: url(http://raw.github.com/claviska/jquery-miniColors/master/jquery.minicolors.png) -270px 0;
}

.minicolors-slider-brightness .minicolors-grid {
	background-position: -570px 0;
}

.minicolors-slider-brightness .minicolors-grid-inner {
	background: black;
}

.minicolors-slider-wheel .minicolors-grid {
	background-position: -720px 0;
}

.minicolors-slider,
.minicolors-opacity-slider {
	position: absolute;
	top: 1px;
	left: 152px;
	width: 20px;
	height: 150px;
	background: white url(http://raw.github.com/claviska/jquery-miniColors/master/jquery.minicolors.png) 0 0;
	cursor: crosshair;
}

.minicolors-slider-saturation .minicolors-slider {
	background-position: -60px 0;
}

.minicolors-slider-brightness .minicolors-slider {
	background-position: -20px 0;
}

.minicolors-slider-wheel .minicolors-slider {
	background-position: -20px 0;
}

.minicolors-opacity-slider {
	left: 173px;
	background-position: -40px 0;
	display: none;
}

.minicolors-with-opacity .minicolors-opacity-slider {
	display: block;
}

/* Pickers */
.minicolors-grid .minicolors-picker {
	position: absolute;
	top: 70px;
	left: 70px;
	width: 10px;
	height: 10px;
	border: solid 1px black;
	border-radius: 10px;
	margin-top: -6px;
	margin-left: -6px;
	background: none;
}

.minicolors-grid .minicolors-picker SPAN {
	position: absolute;
	top: 0;
	left: 0;
	width: 6px;
	height: 6px;
	border-radius: 6px;
	border: solid 2px white;
}

.minicolors-picker {
	position: absolute;
	top: 0;
	left: 0;
	width: 18px;
	height: 2px;
	background: white;
	border: solid 1px black;
	margin-top: -2px;
}

/* Inline controls */
.minicolors-inline .minicolors-input,
.minicolors-inline .minicolors-swatch {
	display: none;
}

.minicolors-inline .minicolors-panel {
	position: relative;
	top: auto;
	left: auto;
	display: inline-block;
}


/*
 * Bootstrap Theme (theme: 'bootstrap')
 *
 */
 
/* Input styles */
.minicolors-theme-bootstrap .minicolors-input {
	padding: 4px 6px;
	padding-left: 30px;
	background-color: white;
	border: 1px solid #CCC;
	border-radius: 3px;
	color: #555;
	font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
	font-size: 14px;
	height: 19px;
	margin: 0px;
	box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}

/* When the input has focus */
.minicolors-theme-bootstrap.minicolors-focus .minicolors-input {
	border-color: #6fb8f1;
	box-shadow: 0 0 10px #6fb8f1;
	outline: none;
}

/* Swatch styles */
.minicolors-theme-bootstrap .minicolors-swatch {
	position: absolute;
	left: 4px;
	top: 4px;
	z-index: 2;
}

/* Handle swatch position (left = default / right) */
.minicolors-theme-bootstrap.minicolors-swatch-position-right .minicolors-input {
	padding-left: 6px;
	padding-right: 30px;
}

.minicolors-theme-bootstrap.minicolors-swatch-position-right .minicolors-swatch {
	left: auto;
	right: 4px;
}

/* Panel styles */
.minicolors-theme-bootstrap .minicolors-panel {
	top: 28px;
	z-index: 3;
}

/* Handle panel positions (top / left) */
.minicolors-theme-bootstrap.minicolors-position-top .minicolors-panel {
	top: -154px;
}

.minicolors-theme-bootstrap.minicolors-position-left .minicolors-panel {
	left: -63px;
}

/* Don't forget to adjust the left position in case the opacity slider is visible! */
.minicolors-theme-bootstrap.minicolors-position-left.minicolors-with-opacity .minicolors-panel {
	left: -84px;
}
.bg-picker { margin: 0; padding: 0; }
.bg-picker a { width: 24px; height: 24px; display: block; float: left; border: 1px solid black; margin: 3px; }
.setting { background: #eb5b5e; color: black; font-size: 1em; right: -35px; top: 0; padding: 5px 10px; position: absolute; cursor: pointer}
select.demoselect {width: 100%; border-radius: 0; background: white; font-size: .95em; height:25px; border-radius: 0}
.demobox {background: #ccc; text-align: center; margin-bottom: 10px}
.demoicon ul li {list-style: none}

/* ================= */
/* Responsive styles */
/* ================= */

/*@media (max-width: 767px) { 
	.top div[class*='span'] {text-align: center !important; width:100% !important}
	.top .cart .wrap {padding:15px 0}
	.top .cart form button {top:2px; right:20px}
	.top .top-search, .top .top-search:focus {width: 90%; margin: 0 auto; border-radius: 0; -webkit-appearance: none;}
	.top form {margin-bottom: 0px; margin-top:20px; text-align: center}
	.promo article {margin:15px auto !important}
	.feat .view, .product .view, .single .view {margin:10px auto}
	.product .sidebar .info {width: 100%}
	.product .tab-content.sideline article {width: 100%}
	.home-panel {padding:10px}
	#flexslider-product {margin-bottom: 30px}
	.sidebar aside {padding:0 20px}
	.cart-pay, .cart-pay .cart-checkout {text-align: center !important}
	footer {margin: 0 -20px; padding: 20px}
	footer .foot article {margin-bottom: 15px}
	footer .foot div[class*="span"] {margin-bottom: 20px}
}
@media (max-width: 480px) {
	.top .logo a {padding-left: 0}
	.top .top-search, .top .top-search:focus {width: 85%}
	.call-to-action, .call-to-action .cta {text-align: center; float:none !important}
	.single {padding: 30px 0}
	.single .cross-wrapper .span3 {padding: 10px 0}
	.single .decider, .single .decidernote {text-align: center}
	footer .currency {text-align: left}
	.login .form-horizontal .controls {margin-left: 0px}
	#nav { display: none !important}
	.js .selectnav { display: block; font-size:0.9em}
	.flex-caption {display: none}
}*/