/*
Theme Name: MotionGlass Studios
Theme URI: http://motionglass.com
Template: Divi
Author: Glimmernet Technologies
Author URI: http://www.glimmernet.com
Description: Custom theme for MotionGlass Studios
Version: 1.0.1495039604
Updated: 2017-05-17 12:46:44
*/

@import url('https://fonts.googleapis.com/css?family=Barlow:400,400i,700,700i&display=swap');

.et_pb_text h1{
	font-size: 52px;
}

.et_pb_text h2{
    font-size: 38px;
}

.et_pb_text h3{
    font-size: 30px;
}

.et_pb_text h4{
    font-size: 24px;
}

.et_pb_text h5{
    font-size: 18px;
}

.et_pb_text h6{
    font-size: 14px;
}

.title {
	/*font-family: 'Barlow', sans-serif;
	font-weight: 700;*/
}

@media only screen and (max-width: 700px){
	h1 {
		font-size: 40px !important;
	}
	h2 {
		font-size: 32px !important;
	}
	h3 {
		font-size: 26px !important;
	}
	h4 {
		font-size: 22px !important;
	}
	h5 {
		font-size: 18px !important;
	}
	h6 {
		font-size: 14px !important;
	}
	p {
		font-size: 16px !important;
	}
}

@media only screen and (max-width: 560px){
	h1 {
		font-size: 32px !important;
	}
	h2 {
		font-size: 26px !important;
	}
	h3 {
		font-size: 22px !important;
	}
	h4 {
		font-size: 18px !important;
	}
	h5 {
		font-size: 16px !important;
	}
	h6 {
		font-size: 14px !important;
	}
	p {
		font-size: 16px !important;
	}
}

/*===========
Custom style
============*/
.two-rows{
    padding-top: calc(30vh - 80px) !important;
    padding-bottom: calc(30vh - 80px) !important;
}
.one-row.first-box, .one-row.second-box{
    padding-top: calc(25vh - 40px);
    padding-bottom: calc(25vh - 40px);
}
.landing-page-collage-container h2{
    word-wrap: normal;
}
@media (min-width: 360px){
    .two-rows{
        padding-top: calc(35vh - 60px) !important;
        padding-bottom: calc(35vh - 60px) !important;
    }
}
@media (min-width: 480px){
    .two-rows{
        padding-top: calc(40vh - 60px) !important;
        padding-bottom: calc(40vh - 60px) !important;
    }
}
@media (min-width: 980px){
    .two-rows{
        padding-top: calc(45vh - 60px) !important;
        padding-bottom: calc(45vh - 60px) !important;
    }
}
@media (min-width: 981px){
    .landing-page-collage-container{
        height: calc(100vh - 60px);
    }
}
    
/**Marko**/
body.home header#main-header{
	background-color: transparent;
	box-shadow: none;
}
body.home .et_pb_fullwidth_section .et_pb_fullwidth_header{
	padding-bottom: 77px;
}

/* et-fixed-header is the state of the header once you scroll */
body.home header#main-header.et-fixed-header{
	background-color: rgba(26,26,26,0.92);
}

body.home #et-main-area{
	margin-top: -76px;
}

.three-boxes-section .et_pb_button_wrapper {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
#footer-widgets{
	padding-bottom: 5%;
}
@media only screen and (min-width: 981px){
	.et_header_style_left #et-top-navigation{
		padding: 18px 0 6px 0 !important;
	}
}
@media (max-width: 980px){
	#main-footer #footer-widgets .footer-widget{
		width: 100% !important;
		padding-bottom: 3% !important;
	}
	#main-footer #footer-widgets .footer-widget:first-child{
		border-bottom: 1px solid;
		margin-bottom: 5% !important;
	}
}

@media only screen and (max-width: 1090px){
	#logo{
		max-height: 25% !important;
	}
}
    
@media only screen and (min-width: 981px) {
	#logo {
		max-height: 42% !important;
	}
}

/* JUSTIN ADDITIONS --- 2023 Redesign */
.services-img-tag{ /* From https://css.glass */
background: rgba(255, 255, 255, 0.33);
border-radius: 16px;
box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
backdrop-filter: blur(8.1px);
-webkit-backdrop-filter: blur(8.1px);
-moz-backdrop-filter: blur(8.1px);
	display:inline-block;
}


/* TYLER ADDITIONS */


/* ---- OUR WORK ---- */

.work-container {
	position: relative;
	width: 100%;
	margin: 20px auto;
	background-color: #fff; /* color of the overlay */
	transition: .5s ease;
}

.work-img {
  	opacity: 1;
  	display: block;
  	width: 100%;
  	height: auto;
  	transition: .5s ease;
  	backface-visibility: hidden;
	/* box-shadow: 8px 8px 16px 4px rgba(00,00,00,0.85); */
	/* border: 3px solid #909090; */
	filter: saturate(80%) contrast(100%);
}

.work-middle {
	transition: .5s ease;
	opacity: 0;
	position: absolute;
	top: 70%;
	left: 50%;
	transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	text-align: center;
}

.work-container:hover {
	box-shadow: 8px 8px 16px 4px rgba(00,00,00,0.85);
}

.work-container:hover .work-img {
  	opacity: 0.3;
	filter: saturate(0%) contrast(200%);
}

.work-container:hover .work-middle {
  	opacity: 1;
}

.work-text {
	font-size: 20px; 
	font-weight: bold; 
	color: #fff; 
	border-radius: 60px;
	/* border: 3px solid #fff; */
	font-family: 'Karla',Helvetica,Arial,Lucida,sans-serif;
	background-color: #f7941e;
	padding: 24px 24px;
	min-width: 260px;
	box-shadow: 1px 1px 12px 4px rgba(00,00,00,0.3);
}

@media screen and (max-width: 1024px) {
	.work-middle {
		opacity: 1;
		top: 85%;
	}
	.work-code-module {
		width: 92% !important;
	}
	.work-text {
		min-width: 212px;
		padding: 10px 16px;
		border-radius: 60px;
		/* border: 2px solid #fff; */
		font-size: 16px;
		font-weight: bold;
	}
}

@media screen and (max-width: 980px) {
	.work-text {
		min-width: 260px;
		padding: 24px 24px;
		border-radius: 60px;
		/* border: 2px solid #fff; */
		font-size: 22px;
		font-weight: bold;
	}
}

@media screen and (max-width: 600px) {
	.work-middle {
		opacity: 1;
		top: 85%;
	}
	.work-code-module {
		width: 92% !important;
	}
	.work-text {
		min-width: 240px;
		padding: 12px 12px;
		border-radius: 60px;
		/* border: 2px solid #fff; */
		font-size: 18px;
		font-weight: bold;
	}
}

.portfolio-button {
	background-color: #F7941E;
	padding: 30px 80px; 
	font-size: 22px; 
	font-family: 'roboto condensed', sans-serif; 
	font-weight: bold; 
	letter-spacing: 1px;
	border-radius: 60px;
	color: #fff; 
	box-shadow: 6px 6px 16px 0 rgba(00,00,00,0.7);
	/* border-radius: 25px; */
}

.portfolio-button:hover {
	background-color: #DD7F1A;
}

/* ---- HOMEPAGE ---- */

/* Homepage Header Content */
.et_pb_fullwidth_header .et_pb_fullwidth_header_container.center .header-content {
	width: 100%;
	max-width: none;
}

/* -------------------- */


.icon-hover {
	width: 120px;
	margin-bottom: 40px;
	text-align: center;
	transition: all 0.1s ease;
	border-radius: 50%;
}

.icon-hover:hover {
	width: 140px;
	margin-bottom: 20px;
	box-shadow: 1px 5px 13px 3px rgba(00,00,00,0.85);
}

.icon-container {
	width: 200px; 
	text-align: center; 
	margin: 20px auto;
}

@media screen and (max-width: 700px) {
	.icon-container {
		width: 140px;
	}
	
	.icon-hover {
		width: 100px;
		margin-bottom: 20px;
	}
	
	.icon-hover:hover {
		width: 100px;
		margin-bottom: 20px;
	}
}

/* ---- ABOUT US ----- */

/* The arrows left and right that scroll through images in the gallery */
.et-pb-arrow-prev {
	background-color: rgba(255,255,255,0.5);
	border-radius: 50px;
}

.et-pb-arrow-next {
	background-color: rgba(255,255,255,0.5);
	border-radius: 50px;
}

/* Little dots at the bottom of the image gallery */
.et-pb-controllers {
	margin-bottom: -16px;
}

.et-pb-controllers a {
	width: 10px;
	height: 10px;
	background-color: rgba(255,255,255,0.8);
}

.et_pb_bg_layout_light .et-pb-controllers .et-pb-active-control {
	background-color: rgba(255,255,255,0.95);
}

/* Hides the caption under the gallery lightbox images */
.mfp-title {
	display: none;
}