/*
Theme Name:     Roland Lee
Theme URI: 	    http://www.rolandlee.com
Template:       jupiter
Version:        4.0.8
*/

/******************************************
      SITEWIDE NAVIGATION / HEADER
******************************************/

/**************
 Align logo to far left
**************/

#mk-theme-container .header-logo a {
    margin-left: 0px !important;
    float: left;
	}

/***** MOBILE: Add left padding to Logo *****/
@media handheld, only screen and (max-width: 1180px) {

	#mk-theme-container .header-logo a {
    margin-left: 20px !important;
    float: left;
	}

}

/*******************
Main Navigation > Force hover on main menu items to desired grey background color
*******************/

	.menu-hover-style-4 .main-navigation-ul > li.menu-item:hover > a.menu-item-link {
  	background-color: #555668 !important;
  	color: #FFFFFF !important;
	}

/**************
Get rid of one pixel border bottom on header (size to header height + 1)
**************/
	
	.mk-header-inner {
  	height:91px;
	}

/**************
 Align page title to far left with extra padding on top
**************/

	#mk-page-introduce {
    padding-left: 0px;
	}

	#mk-page-introduce h1.page-title {
    margin-left: 0px;
	}
	
	#mk-page-introduce .page-title {
    margin: 0px;
margin-top:90px;
    padding-left: 0px;
	line-height: 1.1em;
    color: #333333;
	}
	
	#mk-page-introduce .mk-grid {
	margin-top: 15px;
	}

	.theme-content div:first-child>div>h2.mk-fancy-title {
    padding-top:0px !important;
	}

/**************
 Treat Strong P Headings like headings
**************/
	.mk-text-block p>strong:first-child {
	display:block;
	clear:both;
    margin-bottom:5px !important;
	}
.mk-text-block p>strong:first-child + br {
	display:none;
	}


/***** MOBILE: Fix title & breadcrumbs left margin (override theme) *****/
@media handheld, only screen and (max-width: 1180px) {

	#mk-page-introduce {
	padding-left: 20px;
	}

}

/***** MOBILE: Fix title left margin (override theme) *****/
@media handheld, only screen and (max-width: 1139px) {

	#mk-page-introduce h1.page-title {
  	margin-left: 0px !important;
	font-size: 28px;
	margin-bottom:0px;
	}

}

@media handheld, only screen and (max-width: 767px) {

	.mk-fancy-title {
    text-align: left !important;
	}

}

/***** MOBILE: Fix title left margin (override theme) *****/
@media handheld, only screen and (max-width: 400px) {

	#mk-page-introduce h1.page-title {
	margin-bottom:5px;
	}

}

/**************
 Align breadcrumbs to far left under title with extra padding on bottom
**************/

	#mk-breadcrumbs {
  	padding: 0px;
  	margin-bottom: 0px;
  	float:left;
  	width:100%;

	}
	#mk-breadcrumbs .mk-breadcrumbs-inner{
  	display: inline-block;
  	margin: 0px;
  	line-height: 1.5em;
  	padding: 0px;
  	font-size: 10px;
  	font-weight: bold;
  	letter-spacing: 1px;
  	text-transform: uppercase;
  	-ms-word-wrap: break-word;
  	word-wrap: break-word;
  	width:100%;
	text-align:left;
	float:left;
	}

/***** MOBILE: Remove bottom margin from Breadcrumbs on small screens*****/
@media handheld, only screen and (max-width: 700px) {

	#mk-page-introduce #mk-breadcrumbs {
  	margin-top: -15px !important;
	margin-bottom: 10px !important;
	}

	#mk-breadcrumbs .mk-breadcrumbs-inner{
	float:left;
	}

}

/******************
Set consistent margin around all page wrappers
*******************/

	#theme-page .theme-page-wrapper {
  	margin-top: 0px;
	}

	#theme-page .theme-page-wrapper .theme-content {
  	padding: 0px !important;
  	margin: 0px !important;
	padding-top: 10px !important;
	}

/***** MOBILE: Remove bottom margin from Breadcrumbs on small screens*****/
@media handheld, only screen and (max-width: 1180px) {

	#theme-page .theme-page-wrapper {
  	padding: 0px 20px !important;
	}

}

/**************
 Add Spacing between Main and Right Column Using Width (instead of 70/30 its 70/28) vs Padding (set to 0)
**************/
	
	.theme-page-wrapper #mk-sidebar.mk-builtin {
    width: 30%;
	}

	#theme-page .theme-page-wrapper.right-layout .sidebar-wrapper {
	padding: 0px !important;
    padding-left: 30px !important;
	}

	.mk-onsale {
  	background-color: #da4c26;
	}

	body.login div#login, body.mobile div#login {
	padding: 30px !important;
	}

/**************
 Fancify Current Page Indicator on Side Column Sub Navigation
**************/

	.widget-sub-navigation ul li.current_page_item a, .widget_nav_menu ul li.current_page_item a, .widget_product_categories ul li.current_page_item a, .woocommerce-MyAccount-navigation ul li.current_page_item a {
	border-left: 10px solid #f97352;
	}

/******************************************
      HOME PAGE
******************************************/

@media handheld, only screen and (max-width: 720px) {

	body.home #theme-page div.column_container	h1.rl-home-heading span, body.home #theme-page div.column_container	h1.rl-home-heading {
	font-size:4vmax !important;
	line-height: 1em !important;
	}

	body.home #theme-page div.column_container {
	width:100% !important;
	padding:20px !important;
	}
}

@media handheld, only screen and (max-width: 768px) {

	body.home #theme-page div.column_container	h1.rl-home-heading span, body.home #theme-page div.column_container	h1.rl-home-heading {
	font-size:4vmax !important;
	line-height: 1em !important;
	}
	
	body.home #theme-page div.column_container {
	width:100% !important;
	padding:20px !important;
	}
}

/******************************************
      BLOG MAIN PAGE
******************************************/

/**************
 Remove Border & Shadow from around default flexslider Posts Carousel Widget
**************/

	body.page .wpb_wrapper .flexslider { 
  	margin: 5px !important;
  	margin-top: 0px !important;
  	border: 0px!important;
  	-webkit-box-shadow: none !important;
  	-moz-box-shadow: none !important;
  	-o-box-shadow: none !important;
  	box-shadow: none !important;
	}

/**************
 Formatting around flexslider caption
**************/

	body.page .wpb_posts_slider .flex-caption {
  	background-color: #f6f6f6 !important;
  	padding: 30px !important;
	}

/**************
 Formatting around Each Blog Loop Item
**************/

body.page .mk-blog-grid-item .blog-grid-holder {
  	margin: 5px !important;
  	background-color: #fdfdfd !important;
	}

/***** MOBILE: Shrink H2 on small screens*****/
@media handheld, only screen and (max-width: 700px) {
	
	body.page .wpb_wrapper .flexslider H2 {
  	font-size: 22px !important;
	}
	
	.mk-blog-grid-item .blog-grid-footer {
    position: relative;
    padding: 15px 20px;
    border-top: 1px solid #e3e3e3;
	}

}

/******************************************
      BLOG ARCHIVE PAGES
******************************************/

/**************
 Force Featured Image Full Width
**************/

	.mk-blog-single .featured-image img {
  	width:100%;
  	}
	
	.mk-blog-single .featured-image {
  	margin-bottom: 30px;
	}

/**************
 Extra breadcrumbs leading because of multi-line titles
**************/

	.single-post #mk-breadcrumbs .mk-breadcrumbs-inner{
  	line-height: 2em;
  	margin-bottom:5px;
	}

/**************
 Group byline with Article, not Image
**************/

	.mk-blog-single .blog-single-meta {
    margin-bottom: 0px;
	}

/**************
 Fancy Dropcap for Start of Article
**************/
	
	.mk-blog-single .mk-single-content > p:not(.quote):first-child:first-letter {
  	display: block;
    float: left;
    margin: 5px 8px 0 0;
	padding:15px;
    font-weight: 700;
    font-size: 38px;
    color: #fff;
    width: 36px;
    height: 36px;
    line-height: 36px;
    background-color: #f97352 !important;
	}

/***** MOBILE: Tighten up spacing on small screens*****/
@media handheld, only screen and (max-width: 700px) {

	body.single #mk-page-introduce H1.page-title {
  	font-size: 22px !important;
	margin-bottom: 20px;
	font-weight:600;
	}

	.single-post #mk-breadcrumbs .mk-breadcrumbs-inner{
  	line-height: 1.2em;
  	padding-bottom:20px;
	}

	.mk-blog-single .featured-image {
  	margin-bottom: 10px;
	}

}

/******************************************
      BLOG TAG & CAT PAGES
******************************************/

/**************
 Less margin between posts
**************/

	.mk-blog-modern-item .mk-blog-meta-wrapper {
    white-space: nowrap;
	line-height: 1;
	padding-bottom: 2px;
	}

	.mk-blog-modern-item {
    margin-bottom: 20px !important;
	}

/***** MOBILE: Hide extra meta on small screens*****/
@media handheld, only screen and (max-width: 700px) {

	.mk-blog-modern-item .mk-button-container {
	text-align:left;
	}

	body.tag .blog-modern-social-section, body.category .blog-modern-social-section {
  	display:none !important;
	}

	.mk-blog-modern-item .mk-blog-meta {
    margin: 0 20px 20px 0px;
	}

	.mk-blog-modern-item {
    margin-bottom: 0px;
	}
}

/******************************************
      SITE SEARCH RESULTS PAGE
******************************************/

/**************
 Less margin between form and results
**************/

	.mk-search-loop .widget_search {
    text-align: center;
    padding-bottom: 0px;
    margin-bottom: 0px;
	margin-top:10px;
	}
	.mk-search-loop .widget_search p{
    display:none;
	}

/******************************************
      TECHNIQUES PAGE
******************************************/

	.vc_custom_heading H4, .vc_custom_heading a.vc_gitem-link {
	font-size: 18px !important;
	font-weight: bold !important;
	line-height: 1.1em !important;
	min-height: 40px;
	}
	
	.wpb_gallery>.wpb_wrapper>h2.wpb_posts_slider_heading {
    display:none;
	}

	.sidebar-wrapper h3.widget-title {
    font-size: 18px !important;
	font-weight: 600 !important;
	margin-bottom:15px !important;
	color: #666666;
	text-transform:uppercase;
	}

	body.page .wpb_wrapper .flexslider {
    border: 1px solid #eeeeee !important;
    border-radius: 1px !important;
	}

/***** MOBILE: Hide extra meta on small screens*****/
@media handheld, only screen and (max-width: 1024px) {

	#theme-page .theme-page-wrapper.right-layout aside#mk-sidebar.mk-builtin>div.sidebar-wrapper {
    padding-left:0PX !important;
	}

	.sidebar-wrapper h3.widget-title {
    font-size: 20px;
	font-weight: 600;
	margin-bottom:20px;
	margin-top:30px;
	}

	.wpb_posts_slider {
	margin-top: 10px;
	}
}

/******************************************
      WORKSHOPS PAGE
******************************************/

/**************
 Less margin between form and results
**************/


/******************************************
      PRODUCT LIST PAGE
******************************************/

/**************
Product Loop > Remove extra padding added to top of loop container
**************/

	.mk-product-loop.compact-layout .products {
	padding: 0 !important;
	}

/**************
Product Loop > Add extra bottom margin to each loop item
**************/

	#theme-page div.mk-shop-item-detail .product-title {
	margin-bottom:15px;
	}

/*************
Shop Header > Hide Woocommerce "All Products" Text
**************/

	.archive #theme-page .mk-shop-header h4 {
 	display:none !important;
	}

/*************
Shop Header > Align Sorting Pull Down to Right Side of Main Column
**************/

	.archive.tax-product_cat #theme-page .theme-content .mk-shop-header, .archive.tax-product_tag #theme-page .theme-content .mk-shop-header{
 	position:relative;
	top: 0px !important;
	right: 0px !important;
	}

/*************
Shop Header > Move the rest of page up unless the sorting menu was not present
**************/

	.archive.tax-product_cat #theme-page .theme-content > div.mk-product-loop + div.mk-product-loop, .archive.tax-product_tag #theme-page .theme-content div.mk-product-loop + div.mk-product-loop {
 	position:relative;
	top: -60px !important;
	}
	.archive.tax-product_cat #theme-page .theme-content > div:first-child.mk-shop-header, .archive.tax-product_tag .archive.tax-product_cat #theme-page .theme-content > 	div.mk-shop-header + div.mk-product-loop {
 	position:relative;
	top: -60px !important;
	}

/***** MOBILE: Hide Sorting Options on Small Screens and adjust other content to not leave a gap *****/
@media handheld, only screen and (max-width: 44.375em) {

	.archive #theme-page .mk-shop-header form {
 	display:none;
	}

	.archive.tax-product_cat .theme-content, .archive.tax-product_tag .theme-content {
 	position:relative;
	top: 0px !important;
	}

	.archive.tax-product_cat #theme-page .theme-content > div.mk-product-loop + div.mk-product-loop, .archive.tax-product_tag #theme-page .theme-content div.mk-product-	loop + div.mk-product-loop {
 	position:relative;
	top: 0px !important;
	}

}
/******************************************
      EVENTS
******************************************/

h2.tribe-events-page-title, #tribe-geo-results h2.tribe-events-page-title {
    font-size: 22px;
	font-family:Open Sans;
    font-weight: 600;
	text-align: left;
}
.tribe-events-list-widget h4 {
    font-size: 22px;
    margin-bottom: 0px;
	line-height: 1.1em;
}

.tribe-events-list-widget ol li {
    list-style: none;
    margin-bottom: 20px;
}

.tribe-events-list-widget ol {
    margin-bottom: 1em;
    margin-left: 0;
    list-style-position: outside;
    list-style-type: decimal;
}
#tribe-events-pg-template {
    margin: 0 auto;
    max-width: 1140px;
}
.tribe-events-back {
    display:none;
}
.single-tribe_events .tribe-events-single-event-title {
    display:none;
}
.tribe-events-schedule {
    display:none;
}
.events-list.tribe-bar-is-disabled #tribe-events-content-wrapper {
    max-width: 1140px;
    margin: 0 auto;
}
.events-list .tribe-events-loop, .tribe-events-day .tribe-events-loop, .single-tribe_venue .tribe-events-loop, .single-tribe_organizer .tribe-events-loop {
    max-width: 1140px;
    margin: 0 auto;
}
.tribe-events-list-separator-month {
   display:none;
}
.tribe-events-list .tribe-events-event-image + div.tribe-events-content {
    width: 100% !important;
}
.tribe-events-list .tribe-events-event-cost {
    float: left;
    margin: 0 10px 5px 0px;
}
.tribe-events-list .tribe-events-event-cost span {
    border-radius: 3px;
}
.tribe-bar-disabled {
 display:none;
}
.tribe-events-list .type-tribe_events {
    border-bottom: 1px solid #eeeeee;
    border-top: 1px solid #eeeeee;
    padding: 1.75em 0;
    position: relative;
}
/******************************************
      SINGLE PRODUCT DETAILS PAGE
******************************************/

/**************
Single Product Page > Make Price Text Smaller
**************/

	.product-template-default #theme-page .summary p.price span.woocommerce-Price-amount.amount {
  	float: left;
  	display: inline-block !important;
  	color: #AAAAAA;
  	font-weight: bold;
  	font-size: 20px !important;
	}

/**************
Single Product Page > Format out of stock label to grey
**************/

	.product-template-default #theme-page .summary .out-of-stock {
  	background-color: #f97352 !important;
	position: absolute !important;
  	top: 65px!important;    
	left: -105px !important;
	right: initial !important;
	}
    
/**************
Single Product Page > Change Size of Product name
**************/

	div.summary.entry-summary > h1 {
    margin: 0px !important;
	padding-top:65px !important;
	display:block !important;
    font-size: 30px !important;
	line-height: 1em !important;
    color: #333333 !important;
	}

	body.single.single-product #mk-page-introduce {
    padding: 0px !important;
	}

	body.single.single-product #mk-page-introduce .mk-grid {
    margin-top: 0px !important;
	}

	body.single.single-product #mk-page-introduce h1.page-title {
    display: none !important;
	}

	body.single.single-product #mk-page-introduce #mk-breadcrumbs {
    display: none !important;
	}

	div.summary.entry-summary > div.woocommerce-product-details__short-description > p {
    font-style: oblique;
	line-height: 1.1em !important;
	padding-top: .5em;
    color: #333333;
	margin-bottom: 20px;
	}

	.mk-product.style-default .mk-product-image {
    width: 60%;
	margin-top:20px;
	}

	.mk-product.style-default .mk-product-details {
    width: 37.5%;
	}

/**************
Single Product Page > Responsive
**************/

@media handheld, only screen and (max-width: 860px) {

	body.single.single-product #mk-page-introduce.intro-left {
    display: none;
	}

	body.single.single-product .mk-product h1.page-title {
    padding-top:20px;
    font-size: 26px;
	line-height: 1em;
	}

	body.single.single-product #theme-page .mk-product {
    padding: 0px 0px !important;
	}

	body.single.single-product #theme-page .theme-page-wrapper.full-layout {
    padding: 0px 0px !important;
  	}

	body.single.single-product .mk-product .mk-product-details {
    padding: 0px 30px !important;
  	}

	body.single.single-product .mk-product .mk-product-image {
    padding: 0px 0px !important;
	margin-top:0px;
  	}

	body.single.single-product .woocommerce-product-details__short-description {
    font-style: oblique;
	line-height: 1.1em !important;
	padding-top: .5em;
    color: #333333;
	}

	body.single.single-product .mk-product-loop p.stock.out-of-stock {
    position:absolute;
	top: -60px;
	}

	body.single.single-product  p.stock.out-of-stock {
	position: absolute !important;
  	top: -40px!important;    
	left: 0px !important;
	}

	body.single.single-product .mk-product-image {
    margin-bottom: 0px !important;
	}

}

@media handheld, only screen and (max-width: 520px) {

	body.single.single-product .mk-product p.stock.out-of-stock {
    position:absolute;
	top: -60px;
	}

}

/******************************************
      SITEWIDE NAVIGATION / FOOTER
******************************************/

/*********************************
  Make the notepad in the footer fit tightly,
  resize, disappear, or flip depending on screen width
**********************************/

	#mk-footer, #mk-footer .footer-wrapper {
    padding:0px !important;
	}

	#mk-footer .mk-padding-wrapper {
    padding:30px;
	}

@media (min-width: 1048px) {

    #mk-footer .mk-padding-wrapper {
    background-image: url('/wp-content/uploads/2015/01/Roland-Lee-Sketchbook-Only_m-e1425621086635.png');
    background-repeat: no-repeat;
    background-position: left bottom;
    background-size: auto 100%;
    }

}

@media (max-width: 1048px) {

    #mk-footer .mk-padding-wrapper > .mk-col-1-3 {
    display:none;
    }

   .mk-col-2-3 {
    width:100%;
    }
}

@media (max-width: 767px) {

    #mk-footer .footer-wrapper .mk-padding-wrapper {
    background-image: url('/wp-content/uploads/2015/01/Roland-Lee-Sketchbook-Only_m-e1425621086635.png');
    background-repeat: no-repeat;
    background-size: auto auto;
	-moz-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    filter: FlipH;
    -ms-filter: "FlipH";
    }    
    
	#mk-footer [class=mk-col-2-3] {
    -moz-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    filter: FlipH;
    -ms-filter: "FlipH";
    }
    
	#mk-footer .footer-wrapper .mk-padding-wrapper {
    background-position: left bottom;
    } 

}

@media (max-width: 520px) {

    #mk-footer .footer-wrapper .mk-padding-wrapper {
    background-image: none;
	}
}