/*
Theme Name: Creative Knots
Theme URI: https://www.creativeknots.co/
Description: This is a Divi child theme for Creative Knots!
Author: Andrew O'Dea
Author URI: https://www.creativeknots.co/
Author Email: hello@creativeknots.co
Template: Divi
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

/***** GENERAL *****/

/* align items vertical */
.align-vertical {
	display: flex !important;
    align-items: center !important;
}

/* fluid typography - contact style */
.contact-fluid-typography {
	font-weight: bold;
}

/* fluid typography - button style */

/* desktop */
@media only screen and (min-width: 981px) {
.button-fluid-typography {
	font-size: clamp(1.1rem, 0.791rem + 0.5vw, 2rem) !important;
}
}

/* tablet */
@media screen and (min-width: 768px) 
    and (max-device-width: 980px) {
.button-fluid-typography {
	font-size: clamp(1.1rem, 0.791rem + 0.5vw, 2rem) !important;
}
}

/* mobile */
@media only screen and (max-width: 767px) {
.button-fluid-typography {
	font-size: clamp(1rem, 1rem + 0.21vw, 1.1rem) !important;
}
}


/***** TALL UNDERLINE *****/

/* tall underline grey */
.tall-underline-grey {
    text-decoration: none;
    box-shadow: inset 0 -.5em 0 #454342;
	position: relative;
}

/* tall underline black */
.tall-underline-black {
    text-decoration: none;
    box-shadow: inset 0 -.5em 0 #000000;
    position: relative;
}

/* tall underline white */
.tall-underline-white {
    text-decoration: none;
    box-shadow: inset 0 -.5em 0 #ffffff;
    position: relative;
}

/* tall underline sand */
.tall-underline-sand {
    text-decoration: none;
    box-shadow: inset 0 -.5em 0 #fff4d6;
    position: relative;
}

/* tall underline navy */
.tall-underline-navy {
    text-decoration: none;
    box-shadow: inset 0 -.5em 0 #003947;
    position: relative;
}

/* tall underline teal */
.tall-underline-teal {
    text-decoration: none;
    box-shadow: inset 0 -.38em 0 #00e2b9;
    position: relative;
}

/* tall underline purple */
.tall-underline-purple {
    text-decoration: none;
    box-shadow: inset 0 -.5em 0 #fbd65e;
    position: relative;
}

/***** HEADER *****/

/* header menu padding  */
nav > ul.et-menu > li > a {
	padding-block: 2.6vh !important;
}

/* header menu hover  */
.et_pb_menu li a:before {
  content: '';
  position: absolute;
  width: 100%;
  height: 2.5px;
  background-color: #00e2b9;
  bottom: 0;
  left: 0;
  transform-origin: right;
  transform: scaleX(0);
  transition: transform .3s ease-in-out;
}

.et_pb_menu li a:hover:before {
  transform-origin: left;
  transform: scaleX(1);
}

/*set the transition for the spacing shrinking action*/
.shrink-header .et_pb_row {
     padding: 0px 0;
	-webkit-transition: all .5s ease;
	-moz-transition: all .5s ease;
	-o-transition: all .5s ease;
	transition: all .5s ease;
}

/*set the background color and shrink padding of the fixed header when scrolling*/
.shrink-fixed-header .et_pb_row {
	padding: 0px 0;
	-webkit-transition: all .5s ease;
	-moz-transition: all .5s ease;
	-o-transition: all .5s ease;
	transition: all .5s ease;
}

/*set the transition for the logo shrinking action*/
.shrink-header .et_pb_menu__logo img {
	-webkit-transition: all .5s ease;
	-moz-transition: all .5s ease;
	-o-transition: all .5s ease;
	transition: all .5s ease;
}

/*change the logo size when the header shrinks*/
.shrink-fixed-header .et_pb_menu__logo img {
	max-width: 80%;
	-webkit-transition: all .5s ease;
	-moz-transition: all .5s ease;
	-o-transition: all .5s ease;
	transition: all .5s ease;
}

/*set the transition for the font size shrinking action*/
.shrink-header .et_pb_menu ul li a {
	-webkit-transition: all .5s ease;
	-moz-transition: all .5s ease;
	-o-transition: all .5s ease;
	transition: all .5s ease;
}

/*change the menu font size when the header shrinks*/
.shrink-fixed-header .et_pb_menu ul li a {
	font-size: clamp(0.7rem, 0.073rem + 1.02vw, 1.3rem) !important;
	-webkit-transition: all .5s ease;
	-moz-transition: all .5s ease;
	-o-transition: all .5s ease;
	transition: all .5s ease;
}

/***** FOOTER *****/

/* update font manually */
.footer-font {
	display: flex !important;
    float: left !important;
	align-items: center !important;
    color: #ffffff !important;
    margin: 0 10px 0 0 !important;
	padding: 0 0 0 0 !important;
	font-family: "Overpass Mono" !important;
}

.footer-banner-font {
	font-family: "Overpass Mono" !important;
	padding-bottom: 0 !important;
}

/* footer icon size tablet & desktop */
.footer-icon {
    font-size: clamp(1rem, -0.045rem + 1.7vw, 2rem) !important;
    float: left !important;
    margin: 0 15px 0 0 !important;
}

/* footer white items styling */
.footer-globe {
	display: flex !important;
    float: left !important;
	align-items: center !important;
    color: #ffffff !important;
    margin: 0 10px 0 0 !important;
	padding: 0 0 0 0 !important;
}

/* footer globe & icon align center mobile - grey */
@media all and (max-width: 768px){
    .footer-align-center .et_pb_code_inner {
        display: flex !important;
        align-items: center !important;
    }
    .footer-align-center .et_pb_code_inner .footer-align-center-fix {
        padding-bottom: 0 !important;
    }
}

/* footer icon align center mobile social and email icons */
@media only screen and (max-width: 768px) {
.footer-align-center {
	display: flex !important;
	justify-content: center !important;
}
}

/* footer icon align right mobile social and email icons */
@media only screen and (max-width: 768px) {
.footer-align-right {
	display: flex !important;
	justify-content: right !important;
}
}

/* footer icon mobile */
@media only screen and (max-width: 768px) {
.footer-icon-mobile {
	font-size: clamp(1.5rem, 1.5rem + 1.04vw, 2rem) !important;
}
}

/* footer globe mobile -- remove colour after default font colour selected */
@media only screen and (max-width: 768px) {
.footer-globe-mobile-navy {
	font-size: clamp(1rem, 1rem + 1.04vw, 1.5rem) !important;
    float: left !important;
	align-self: center !important;
	margin-right: 7px !important;
	color: #003947 !important;
}
}

/***** HYPERLINKS & ICONS *****/

/* hyperlink purple hover teal */
.hyperlink-purple {
	color: #7d00db !important;
}

.hyperlink-purple:hover {
	color: #3eff8c !important;
}

/* hyperlink white hover teal */
.hyperlink-white {
    color: #ffffff !important;
}

.hyperlink-white:hover {
    color: #f6ebcf !important;
}

/* hyperlink black hover purple */
.hyperlink-black {
    color: #000000 !important;
}

.hyperlink-black:hover {
    color: #7d00db !important;
}

/* hyperlink teal hover sand */
.hyperlink-teal {
    color: #00e2b9 !important;
}

.hyperlink-teal:hover {
    color: #f6ebcf !important;
}

/***** DIVI FIXES *****/

/* parallax background image repeat */
.parallax-bg-image-repeat .et_parallax_bg {
	opacity: .1;
	background-size: inherit;
	background-position: top center;
}

/* divider pixel line fix */
.et_pb_bottom_inside_divider {
	bottom: -1px !important;
}

.et_pb_top_inside_divider {
	top: -1px !important;
}