/*
 Theme Name:     Crystal Ball
 Theme URI:      https://www.elegantthemes.com/gallery/divi/
 Description:    Divi Child Theme built for Cairns Crystal Ball Bookstore by Precedence
 Author:         Abraham Brookes
 Author URI:     https://www.precedence.com.au
 Template:       Divi
 Version:        1.0.0
*/

/* breakpoints a'la https://www.elegantthemes.com/blog/divi-resources/how-to-identify-divis-responsive-breakpoints-and-fine-tune-your-designs-with-media-queries
I changed these to min-width because max-width implies a non-mobile-first design
@media all and (min-width: 1405px) {
@media all and (min-width: 980px) {
@media all and (min-width: 768px) {
@media all and (min-width: 480px) {
*/



/**********************************************************************
Homepage slider
**********************************************************************/
.owl-item {
    color: #fff;
}
.owl-item .sa_hover_container {
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    min-height: unset !important;
    height: 80vh;
    padding: 6vw !important;
}
.owl-item.active .sa_hover_container span {
    opacity: 1;
    top: 0;
}

.owl-item .sa_hover_container span {
    position: relative;
    top: 60px;
    opacity: 0;
    transition: all 1s ease-out;
    z-index: 1;
    text-align: right;
    max-width: 620px;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.4);
    display: flex;
    flex-direction: column;
}
.owl-item .sa_hover_container h1 {
    color: #fff;
    font-size: 55px;
    font-weight: bold;
}
.owl-item .sa_hover_container:after {
    content: '';
    display: block;
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 54%, rgba(0,0,0,0.65) 70%, rgba(0,0,0,0.65) 99%);
    background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 54%,rgba(0,0,0,0.65) 70%,rgba(0,0,0,0.65) 99%);
    background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 54%,rgba(0,0,0,0.65) 70%,rgba(0,0,0,0.65) 99%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=0 );
}

/**********************************************************************
Typography
**********************************************************************/
h1, h2, h3, h4, h5, h6 {
	font-family: Baskerville !important;
}

/**********************************************************************
Colour scheme
**********************************************************************/
.woocommerce .woocommerce-error, .woocommerce .woocommerce-info, .woocommerce .woocommerce-message {
    background: #463554;
}
/* sorry for this horrific selector! */
#et_search_icon:hover, #top-menu li.current-menu-ancestor>a, #top-menu li.current-menu-item>a, .bottom-nav li.current-menu-item>a, .comment-reply-link, .entry-summary p.price ins, .et-social-icon a:hover, .et_password_protected_form .et_submit_button, .footer-widget h4, .form-submit .et_pb_button, .mobile_menu_bar:after, .mobile_menu_bar:before, .nav-single a, .posted_in a, .woocommerce #content div.product p.price, .woocommerce #content div.product span.price, .woocommerce #content input.button, .woocommerce #content input.button.alt, .woocommerce #content input.button.alt:hover, .woocommerce #content input.button:hover, .woocommerce #respond input#submit, .woocommerce #respond input#submit.alt, .woocommerce #respond input#submit.alt:hover, .woocommerce #respond input#submit:hover, .woocommerce-page #content div.product p.price, .woocommerce-page #content div.product span.price, .woocommerce-page #content input.button, .woocommerce-page #content input.button.alt, .woocommerce-page #content input.button.alt:hover, .woocommerce-page #respond input#submit, .woocommerce-page #respond input#submit.alt, .woocommerce-page #respond input#submit.alt:hover, .woocommerce-page #respond input#submit:hover, .woocommerce-page .star-rating span:before, .woocommerce-page a.button, .woocommerce-page a.button.alt, .woocommerce-page a.button.alt:hover, .woocommerce-page a.button:hover, .woocommerce-page button.button, .woocommerce-page button.button.alt, .woocommerce-page button.button.alt.disabled, .woocommerce-page button.button.alt.disabled:hover, .woocommerce-page button.button.alt:hover, .woocommerce-page button.button:hover, .woocommerce-page div.product p.price, .woocommerce-page div.product span.price, .woocommerce-page input.button, .woocommerce-page input.button.alt, .woocommerce-page input.button.alt:hover, .woocommerce-page input.button:hover, .woocommerce .star-rating span:before, .woocommerce a.button, .woocommerce a.button.alt, .woocommerce a.button.alt:hover, .woocommerce a.button:hover, .woocommerce button.button, .woocommerce button.button.alt, .woocommerce button.button.alt.disabled, .woocommerce button.button.alt.disabled:hover, .woocommerce button.button.alt:hover, .woocommerce div.product p.price, .woocommerce div.product span.price, .woocommerce input.button, .woocommerce input.button.alt, .woocommerce input.button.alt:hover, .woocommerce input.button:hover, .wp-pagenavi a:hover, .wp-pagenavi span.current, .et_overlay:before, .et_pb_bg_layout_light.et_pb_module.et_pb_button, .et_pb_bg_layout_light .et_pb_more_button, .et_pb_bg_layout_light .et_pb_newsletter_button, .et_pb_bg_layout_light .et_pb_promo_button, .et_pb_contact_submit, .et_pb_filterable_portfolio .et_pb_portfolio_filters li a.active, .et_pb_filterable_portfolio .et_pb_portofolio_pagination ul li a.active, .et_pb_gallery .et_pb_gallery_pagination ul li a.active, .et_pb_member_social_links a:hover, .et_pb_pricing_table_button, .et_pb_pricing li a, .et_pb_sum {
    color: #EDAC44;
}
.product .et_pb_shop_0.et_pb_shop .woocommerce ul.products li.product .price, .product .et_pb_shop_0.et_pb_shop .woocommerce ul.products li.product .price .amount {
    color: #463554 !important;
}
 
.home-carousel {
	min-height: 80vh;
	margin-bottom: -1px; /* hides a white line underneath the hero area */
}

.home-carousel .et_pb_slide:after {
	content: '';
	display: block;
	height: 100%;
	width: 100%;
	
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
	right: 0;

	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,000000+99&0+54,0.65+70 */
	background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(0,0,0,0) 54%, rgba(0,0,0,0.65) 70%, rgba(0,0,0,0.65) 99%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 54%,rgba(0,0,0,0.65) 70%,rgba(0,0,0,0.65) 99%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 54%,rgba(0,0,0,0.65) 70%,rgba(0,0,0,0.65) 99%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=0 ); /* IE6-9 */

}

 
.home-carousel .et_pb_container.clearfix{
	min-height: 80vh;
}

.home-carousel .et_pb_slider_container_inner {
	position: relative;
	min-height: 80vh;
}

.home-carousel .et_pb_slide_description {
	padding-bottom: 0px;
	position: absolute;
	bottom: 0px;
	right: 0px;
	margin-bottom: 80px;
	max-width: 750px;
}

/**********************************************************************
Utility classes
**********************************************************************/
.absolute-fill {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
	right: 0;
}