/*
 Theme Name:     studiotwofold
 Theme URI:      wwww.studiotwofold.com.au
 Description:    Studio Twofold Creative Child Theme
 Author:         Jamie Walker
 Author URI:     wwww.studiotwofold.com.au
 Template:       Divi
 Version:        1.0.0
*/
 
 
/* =GLOBAL STYLES
------------------------------------------------------- */

/* Fix scroll bar on Edge and IE */
#page-container {
	overflow-x: hidden;
}


p {
	font-weight: 300;
}

input[type="text"]:focus {
  border-color: #fc4c02;
}

textarea:focus {
	  border-color: #fc4c02 !important;
}

.underlinelink h5 a:hover, .underlinelink a {
	text-decoration: underline;
}

/* Hide the Google Recapcha Badge */
.grecaptcha-badge { 
    visibility: hidden !important;
}

/* Colour of "Scroll to Top" Button */
.et_pb_scroll_top.et-pb-icon {
    background: #222222;
}

/* Two buttons Next to each other */
.btn-inline .et_pb_button_module_wrapper {
    display: inline-block;
    margin: 0 5px;
}
.btn-inline-center {
    text-align: center !important;
}

/* Gradient on text? */
.gradient-text h5 {
	color: #FC4C02;
	background: linear-gradient(to right, #E21C79 0%, #FC4C02 100%) !important;
	-webkit-background-clip: text !important;
	-webkit-text-fill-color: transparent !important;
}




/* Header Styles
------------------------------------------------------- */

.logo-colour {
  fill: #ffffff !important;
}

/* Remove Header Shadow */
header#main-header.et-fixed-header, #main-header{
	-webkit-box-shadow:none !important;
	-moz-box-shadow:none !important;
	box-shadow:none !important;
}

#menu-main-menu > li.menu-item > a:after {    
  background: none repeat scroll 0 0 transparent;
  bottom: 0;
  content: "";
  display: block;
  height: 1px;
  left: 50%;
  position: absolute;
  background: #000000;
  transition: width 0.3s ease 0s, left 0.3s ease 0s;
  width: 0;
}

#menu-main-menu > li.menu-item > a:hover:after { 
  width: 100%; 
  left: 0; 
}


/* =HOME PAGE
------------------------------------------------------- */




/* FOOTER STYLES
------------------------------------------------------- */

/* Email Optin to Horizontal */
@media (min-width: 980px){
#skinny.et_pb_newsletter .et_pb_newsletter_fields {
  flex-wrap: nowrap !important;
}
#skinny.et_pb_newsletter .et_pb_newsletter_fields>* {
  flex-basis: 31%;
}
}

#skinny .et_pb_newsletter_form {
  padding-left: 0px;
} 




/* BLOG POST SINGLE STYLES
------------------------------------------------------- */

/* Add spacing after paragraph in blog */
.et_pb_post_content p, .et_pb_post_content pre{
padding-bottom: 20px;
}
p:not(.has-background):last-of-type {
    padding-bottom: 20px !important;
}

/* Make bold text darker */
.et_pb_post_content strong {
	color: #222222 !important;
}

.et_pb_post_content a strong {
	color: #fc4c02 !important;
}



.et_pb_post_content li {
	margin-left: 30px !important;
	margin-bottom: 16px;
}


.et_pb_post_content h3 {
	margin-bottom: 20px;
}

/* Style embeded codepen */
.cp_embed_wrapper {
	margin: 20px 0 20px 0;
}

/* Style Blog Images */
.et_pb_post_conten figure, .wp-block-image {
	margin-bottom: 20px !important;
}

.is-style-default {
	margin-left: 0;
	margin-right: 0;
}
.is-style-default img {
	width: 100%;
	border-radius: 2px;
}
.is-style-default figcaption {
	font-size: 10px;
	font-weight: 300;
	color: #B1B1B1;
}


/* Style Pull Quote */
.wp-block-quote {
	margin-left: -100px;
}
.wp-block-quote cite {
	font-size: 14px;
}

figure figcaption {
	font-size: 10px;
	line-height: 1.4em;
	font-weight: 300;
	margin-top: -12px;
	color: #B1B1B1;
}





/* PROJECTS / PORTFOLIO STYLES
------------------------------------------------------- */
.project-tags a {
	display: block;
}





/* =ANIMATED ICONS
------------------------------------------------------- */


/* 1 pixel width */
.icon-color {
	fill:none;
	stroke: url(#icon-gradient);
	stroke-width:1;
	stroke-linecap:round;
	stroke-miterlimit:10;
}

.icon-color-pink {
	stroke: #e21c79;
}

.icon-color-orange {
	stroke: #fc4c02;
}


.icon-animation {
  stroke-dasharray: 130;
  stroke-dashoffset: 130;
  animation: line-animation 7s linear forwards;
  animation-fill-mode: forwards;
  animation-play-state: paused;
}

.playing {
  animation-play-state: running;
}

@keyframes line-animation {
  from {stroke-dashoffset: 130;}
  to {stroke-dashoffset: 0;}
}