/*
 Theme Name:     OSXplain Divi Child v1.8
 Theme URI:      https://www.elegantthemes.com/gallery/divi/
 Description:    Customizations to Divi © OSXplain
 Author:         Thomas Endfellner
 Author URI:     https://osxplain.de
 Template:       Divi
 Version:        1.8
 Date:           2019-10-05
*/
 
 
/* =Theme customization starts here
------------------------------------------------------- */

/****************************************************************************************************/
/* CSS Columns */ 

.ox-columns-2 .et_pb_text_inner,
.ox-columns-2 .et_pb_toggle_content,
.ox-columns-2 .et_pb_tab_content  {
     columns: 15em 2;
     column-gap: 4em;
}
.ox-columns-3 .et_pb_text_inner,
.ox-columns-3 .et_pb_toggle_content,
.ox-columns-3 .et_pb_tab_content  {
     columns: 11em 3;
     column-gap: 4em;
}
.ox-columns-4 .et_pb_text_inner,
.ox-columns-4 .et_pb_toggle_content,
.ox-columns-4 .et_pb_tab_content  {
     columns: 8em 4;
     column-gap: 4em;
}
.ox-column-rule-light, .ox-column-rule {
	column-rule: 1px solid #ccc;
}
.ox-column-rule-dark {
	column-rule: 1px solid #333;
}

/****************************************************************************************************/
/* Image Zoom on Hover */

.ox-image-zoom .et_pb_image_wrap {      
	overflow: hidden;
	-webkit-mask-image: -webkit-radial-gradient(white, black); /* Safari fix for losing round corners during transition */

}
.ox-image-zoom img {
	transition: all 0.3s; 
}
.ox-image-zoom img:hover {
	transform: scale(1.2);
}

/****************************************************************************************************/
/* Image Swap on Hover */

.ox-image-swap {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    transition: all 1s ease-in-out;
}
.ox-image-swap:hover {
    opacity: 1;
}

/****************************************************************************************************/
/* Button Icon Rotate on Hover */

.ox-rotate-button-icon:after {
	transform: rotate(-90deg);
}
.ox-rotate-button-icon:hover:after {
	transform: rotate(0deg);
}

/****************************************************************************************************/
/* Blurb Icon Rotate on Hover */

.ox-rotate-blurb-icon .et-pb-icon {
	transition: 0.3s ease-out;
	transform: rotateZ(-90deg);
}
.ox-rotate-blurb-icon .et_pb_blurb_content:hover .et-pb-icon {
	transform: rotateZ(0deg);
}

/****************************************************************************************************/
/* Button Text to Icon on Hover */

body #page-container .et_pb_button.ox-button-text-to-icon:after {
	width: 1em;
	margin-left: 0;
	border-left: 1px solid #ddd;
	left: calc(100% - 1em);
	transition: all 0.3s !important;
}
body #page-container .et_pb_button.ox-button-text-to-icon:hover:after {
	border-left: 1px solid transparent;
	color: #fff;
	margin-left: 0px;
	left: 0;
	width: 100%;
	text-align: center;
	transform: scale(1.5);
}

/****************************************************************************************************/
/* Button Icon to Text on Hover */

body #page-container .et_pb_button.ox-button-icon-to-text:after {
	width: 1em;
	transition: all .3s !important;
	margin-left: 0;
	border-left: 1px solid transparent;
	left: calc(50% - 0.5em);
	transform: scale(1.3);
}
 
body #page-container .et_pb_button.ox-button-icon-to-text:hover:after {
	border-left: 1px solid #dddddd;
	left: calc(100% - 1em);
	transform: scale(1);
}

/****************************************************************************************************/
/* Fancy Links */

a.ox-fancylink {
    background: linear-gradient(to bottom, #333 0%, #333 100%);
    background-position: 0 100%;
    background-repeat: repeat-x;
    background-size: 1px 1px;
    color: #333;
    text-decoration: none;
    transition: background-size 0.3s;
}
a.ox-fancylink:hover {
    background-size: 1px 50px;
    border-radius: 2px;
}
.et_pb_bg_layout_light a.ox-fancylink0:before { background: linear-gradient(to bottom, #333 0%, #333 100%); }
.et_pb_bg_layout_dark a.ox-fancylink0:before { background: linear-gradient(to bottom, #ccc 0%, #ccc 100%); }

.ox-fancylink-light { background: linear-gradient(to bottom, #333 0%, #333 100%); } /* fallback for modules without a light or dark assignment */
.ox-fancylink-dark { background: linear-gradient(to bottom, #ccc 0%, #ccc 100%); }

/****************************************************************************************************/
/* Ken Burns */

.kb-zoomout .et_pb_slide .et_parallax_bg {
	animation: zoomout 14s infinite;
}
.kb-zoomin .et_pb_slide .et_parallax_bg {
	animation: zoomin 14s infinite;
}
.kb-zoomin-right .et_pb_slide .et_parallax_bg {
	animation: zoomin-right 14s infinite;
}
.kb-zoomout-right .et_pb_slide .et_parallax_bg {
	animation: zoomout-right 14s infinite;
}
.kb-zoomout .et_parallax_bg {
	animation: zoomout 34s infinite;
}
.kb-zoomin .et_parallax_bg {
	animation: zoomin 34s infinite;
}
.kb-zoomin-right .et_parallax_bg {
	animation: zoomin-right 14s infinite;
}
.kb-zoomout-right .et_parallax_bg {
	animation: zoomout-right 14s infinite;
}
@keyframes zoomout {
	0% {
		transform: scale3d(1.3, 1.3, 1.3) translate3d(0px, 0px, 0px);
		animation-timing-function: linear;
	}
	50% {
		transform: scale3d(1.1, 1.1, 1.1) translate3d(0px, 0px, 0px);
	}

	100% {
		transform: scale3d(1.3, 1.3, 1.3) translate3d(0px, 0px, 0px);
	}
}
@keyframes zoomin {
	0% {
		transform: scale3d(1.1, 1.1, 1.1) translate3d(0px, 0px, 0px);
		animation-timing-function: linear;
	}
	50% {
		transform: scale3d(1.3, 1.3, 1.3) translate3d(0px, 0px, 0px);
	}
	100% {
		transform: scale3d(1.1, 1.1, 1.1) translate3d(0px, 0px, 0px);
	}
}
@keyframes zoomout-right {
	0% {
		transform: scale3d(1.3, 1.3, 1.3) translate3d(-150px, -20px, 0px);
		animation-timing-function: linear;
	}
	50% {
		transform: scale3d(1.1, 1.1, 1.1) translate3d(0px, 0px, 0px);
	}
	100% {
		transform: scale3d(1.3, 1.3, 1.3) translate3d(-150px, -20px, 0px);
	}
}
@keyframes zoomin-right {
	0% {
		transform: scale3d(1.1, 1.1, 1.1) translate3d(0px, 0px, 0px);
		animation-timing-function: linear;
	}
	500% {
		transform: scale3d(1.3, 1.3, 1.3) translate3d(-150px, -20px, 0px);
	}
	100% {
		transform: scale3d(1.1, 1.1, 1.1) translate3d(0px, 0px, 0px);
	}
}
.no-parallax .et_pb_parallax_css {
	background-attachment: inherit;
	background-position: center center;
}
.no-parallax .et_pb_slides .et_parallax_bg.et_pb_parallax_css {
	background-attachment: inherit;
	background-position: center center;
}

/****************************************************************************************************/
/* Sliding Blurb */


.ox-sliding-blurb {
	position: relative;
	overflow: hidden;
	padding: 70px 30px; 
	height: 100%; 
}

.ox-sliding-blurb .et_pb_blurb_content {
	max-width: none;
}
 
.ox-sliding-blurb .et_pb_blurb_description {
	position: absolute;
	top: 0;
	left: 120%;
	display: block;
	width: 100%;
	height: 100%;
	font-size: 16px;
	line-height: 1.25;
	padding: 5px;
	-webkit-transition: left .3s ease;
	-moz-transition: left .3s ease;
	transition: left .3s ease;
	cursor: default;
}

.ox-sliding-blurb h4.et_pb_module_header,
.ox-sliding-blurb .et_pb_main_blurb_image {
	position: relative;
	left: 0;
	-webkit-transition: left .3s ease;
	-moz-transition: left .3s ease;
	transition: left .3s ease;
} 

.ox-sliding-blurb:hover h4.et_pb_module_header,
.ox-sliding-blurb:hover .et_pb_main_blurb_image {
	left: -120%;
}

.ox-sliding-blurb:hover .et_pb_blurb_description {
	left: 0;
}

.ox-sliding-blurb h4.et_pb_module_header {
	font-weight: 900;
	font-size: 22px;
	line-height: 1.2;
	margin-bottom: 0;
	padding-bottom: 0;
}

.ox-sliding-blurb .et_pb_blurb_description {
	font-size: 16px;
	line-height: 1.5;
}

.ox-sliding-blurb .et_pb_blurb_description h5 {
	font-weight: bold;
	text-transform: uppercase;
	font-size: 19px;
	line-height: 1.2;
	margin-bottom: 15px;
	padding-bottom: 0;
}

@media (min-width: 981px) {
	.ox-sliding-blurb {
		border-bottom: 1px solid;
		border-right: 1px solid;
	}
	.et_pb_column:last-child .ox-sliding-blurb {
		border-right: none;
	}
	.ox-sliding-blurb:last-child {
		border-bottom: none;
	}
	.ox-sliding-blurb.et_pb_bg_layout_dark  {
		border-color: rgba(255,255,255,0.1)
	}
	.ox-sliding-blurb.et_pb_bg_layout_light  {
		border-color: rgba(0,0,0,0.1)
	}
}

@media (max-width: 980px) {
	.ox-sliding-blurb {
		border-bottom: 1px solid; 
	}  
	.et_pb_column:last-child .ox-sliding-blurb:last-child {
		border-bottom: none;
	}
	.ox-sliding-blurb.et_pb_bg_layout_dark  {
		border-color: rgba(255,255,255,0.1)
	}
	.ox-sliding-blurb.et_pb_bg_layout_light  {
		border-color: rgba(0,0,0,0.1)
	}
}
