/*
Theme Name: cocreatetheme
Author: Bryn Davies
Author URI: http://piggy.co.uk
Description: Theme Styles for Co Create
Version: 0.1
*/


/* Universal Styles */

@font-face {
  font-family: 'CanalLightRomain';
  src:  url('/wp-content/themes/cocreatetheme/assets/fonts/CanalLightRomain.otf') format('opentype');
}

@font-face {
  font-family: 'CanalDemiRomain';
  src:  url('/wp-content/themes/cocreatetheme/assets/fonts/CanalDemiRomain.otf') format('opentype');
}


/*
dark = 3b3d40
mid = cec4bd
light = fff7f4
*/

@charset "UTF-8";


body {margin:0; padding:0; background-color:#000000; color:#fff; font-family: "CanalLightRomain", Helvetica, Arial, "Lucida Grande", sans-serif;}
p {line-height:22px;font-size:18px;color:#fff;}
h2 {font-size:2em; font-family: 'CanalDemiRomain'; text-transform: uppercase;}
h3 {font-size:1.6em; font-family: 'CanalDemiRomain'; text-transform: uppercase;}
p strong {font-family: 'CanalDemiRomain';}

.headerwrap { width:100%; height:70px; overflow:hidden; top:0px; z-index:119; position:relative;text-align:center;position:fixed;top:0px;}
/*.page-template-template-buildbusiness .headerwrap {background-color:transparent;}
.page-template-template-lookforanartist .headerwrap {background-color:transparent;}*/


/*.logo {margin:0 auto;padding-top:10px;margin-left:128px;display:none;}
.page-template-template-cocreatehome .logo {display:block;}*/


.homelogodt {margin:0 auto;padding-top:10px;margin-left:128px;display:block;}
.moblogodt {margin:0 auto;padding-top:10px;margin-left:128px;display:none;}

.page-template-template-buildbusiness .moblogodt {margin:0 auto;padding-top:10px;margin-left:128px;display:none;}
.page-template-template-buildbusiness .homelogodt {margin:0 auto;padding-top:10px;margin-left:128px;display:none;}
.page-template-template-lookforanartist .homelogodt {margin:0 auto;padding-top:10px;margin-left:128px;display:none;}
.page-template-template-lookforanartist .moblogodt {margin:0 auto;padding-top:10px;margin-left:128px;display:none;}

.whitelogo {position:absolute; top:10px; left:20px;z-index:2000;}
.whitelogo img {width:250px;}
.blacklogo {position:absolute; top:10px; left:20px;z-index:2000;}
.blacklogo img {width:250px;}


section {width:100%;height:auto;clear:both;overflow: hidden;position:relative;}

.content { max-width:100%; height:auto;margin:0 auto;overflow:hidden;}

.col20 {width:20%;float:left;height:auto;overflow:hidden;}
.col40 {width:40%;float:left;height:auto;overflow:hidden;}
.col50 {width:50%;float:left;height:auto;overflow:hidden;}
.col100 {width:100%;float:left;height:auto;overflow:hidden;}

.firsthalf {padding-top:auto;}

.row {
  display: grid;
  grid-auto-flow: column;
  grid-template-columns: 1fr 1fr;
}

.halfcol {
  border: none;
  height:100vh;
  display: flex;
  justify-content: center;
  align-items: center;
  position:relative;
}

.hometext {position:fixed;bottom:0px; margin-left:0px;margin-right:0px;background-color:#f06600;width:100%;padding-top:20px; padding-bottom:20px;}
.hometext p {text-align:center; font-size:22px; line-height:28px; max-width:1000px;margin:0 auto;padding-left:20px;padding-right:20px;}

.conholder {max-width:500px;text-align:center;padding-left:20px; padding-right:20px;}

.formwrapper {width:100%;height:auto;margin-top:150px;}

.formwrapper .acf-field input[type=email] {font-family: "CanalLightRomain", Helvetica, Arial, "Lucida Grande", sans-serif; padding:15px 2px 10px 2px;}
.formwrapper .acf-label {display:none;}
.formwrapper .acf-fields > .acf-field {border:0px;}

.page-template-template-buildbusiness #message p {color:#000000;}
.page-template-template-lookforanartist #message p {color:#ffffff;}
.acf-notice {border-left:0px;}

.whiteform .acf-field input[type=email] {background-color:white;border:0px; border-bottom:1px solid #000; color:#000;}
.blackform .acf-field input[type=email] {background-color:black;border:0px; border-bottom:1px solid #fff; color:#fff;}

.whiteform .acf-button {padding:8px 55px; background-color:#000000; color:#ffffff;margin:0 auto; border-radius:20px;font-size:16px;text-decoration:none;border:0px;text-transform:uppercase;cursor:pointer;}
.blackform .acf-button {padding:8px 55px; background-color:#ffffff; color:#000000;margin:0 auto; border-radius:20px;font-size:16px;text-decoration:none;border:0px;text-transform:uppercase;cursor:pointer;}

.whitebutton {padding:10px 45px; background-color:#ffffff; color:#000000;margin:0 auto; border-radius:20px;font-size:18px;text-decoration:none;}
.blackbutton {padding:10px 45px; background-color:#000000; color:#ffffff;margin:0 auto; border-radius:20px;font-size:18px;text-decoration:none;}

.sliderdiv {height:100%; width:100%;position:absolute;top:0px; left:0px}
.slide1 {display:block;}
.slide2 {display:none;}

#mobslider {position:relative;}



.jarallax {
  position: relative;
  z-index: 0;
}
.jarallax > .jarallax-img {
  position: absolute;
  object-fit: cover;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}

/* slider styles */

.sliderpagingInfo {display:none;z-index:100;width:90px;background-color:#000000; color:#ffffff;text-align:center;height:auto;padding:5px;margin:0 auto;position:relative;margin-top:-28px;}
.slidernodata {text-align:center;}

#thequoteslider .sliderpagingInfo {z-index:100;width:90px;background-color:#000000; color:#ffffff;text-align:center;height:auto;padding:5px;margin:0 auto;position:relative;margin-top:-40px;}

.nextarrow {position:absolute; right:0%; top:0%; height:28px; width:25px;background-color:#000000; }
.prevarrow {position:absolute; left:0%; top:0%; height:28px; width:25px; background-color:#000000;}
.nextarrow img {width:10px; height:auto;padding-top:5px;}
.prevarrow img {width:10px; height:auto;padding-top:5px;}
.nextarrow:hover {background-color:background: rgb(255,147,3); background: linear-gradient(22deg, rgba(255,147,3,1) 0%, rgba(255,59,183,1) 100%); }
.prevarrow:hover {background-color:background: rgb(255,147,3); background: linear-gradient(22deg, rgba(255,147,3,1) 0%, rgba(255,59,183,1) 100%); }


.newPrevarrow {z-index:110;position:absolute; left:0%; top:0%; height:100%; width:25%; background: rgb(0,0,0);background: linear-gradient(90deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 100%); opacity:1;transition: 0.5s;}
.newNextarrow {z-index:110;position:absolute; right:0%; top:0%; height:100%; width:25% ;background: rgb(0,0,0);background: linear-gradient(90deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 100%); opacity:1;transition: 0.5s;}

.newPrevarrow:hover {background: rgb(0,0,0);background: linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%); opacity:1;transition: 0.5s;}
.newNextarrow:hover {background: rgb(0,0,0);background: linear-gradient(90deg, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%); opacity:1;transition: 0.5s;}


.newPrevarrow img {position: relative; top: 50%; transform: translateY(-50%);float:left;margin-left:15px;width:50px; height:auto;}
.newNextarrow img {position: relative; top: 50%; transform: translateY(-50%);float:right;margin-right:15px;width:50px; height:auto;}


.slidernav {width:100%;margin:0 auto;margin-top:3px;}
.slidernav .slick-slide {margin:5px;}
.slidernav .slick-slide img {}


.slidernav .slick-slide {
    height: auto;
  }



.slick-dots {
	display: flex;
	justify-content: center;
	margin: 0;
	padding: 1rem 0;
  margin-top:-50px;
  z-index: 10;
position: relative;
	list-style-type: none;
}

.slick-dots	li {
			margin: 0 0.25rem;
}

.slick-dots	li button {
			display: block;
			width: 0.9rem;
			height: 0.9rem;
			padding: 0;
			border: 2px solid white;
			border-radius: 100%;
			background-color: #bf9690;

			text-indent: -9999px;
}

.slick-dots	li.slick-active button {
		/*background-color: grey;*/
    background: rgb(255,147,3);
    background: linear-gradient(22deg, rgba(255,147,3,1) 0%, rgba(255,59,183,1) 100%);
}

#thequoteslider {position: relative;}


#footer {display:none;text-align:center; width:100%; height:auto; overflow:hidden;padding-top:50px;padding-bottom:15px; position:relative; z-index:2; font-size:15px;color:#ffffff;}
#footer a { text-decoration:none;}
#footer a:hover {text-decoration:underline;}


.dtonly {display:block;}
.mobonly {display:none;}

.mobslider {display:none;}
.dtslider {display:block;}


@media only screen and (max-width: 900px) {

  .mobslider {display:block;margin-top:70px; position:relative;}
  .dtslider {display:none;}

  /*.logo {margin:0 auto;padding-top:10px;margin-left:auto;display:none;}
  .logo img {width:250px; height:auto;}*/

  .homelogodt {margin:0 auto;padding-top:10px;margin-left:128px;display:none;}
  .moblogodt {margin:0 auto;padding-top:10px;margin-left:none;display:block;}
  .moblogodt img {width:250px;}

  .blacklogo { /*top:25px;*/margin-left: auto;
margin-right: auto;
left: 0;
right: 0;
text-align: center; background-color:#ffffff;
height:50px;}

.whitelogo {/*top:25px;*/ margin-left: auto;
margin-right: auto;
left: 0;
right: 0;
text-align: center;background-color:#000000;
height:50px;}

  .blacklogo img {width:250px;}
  .whitelogo img {width:250px;}

  /*.page-template-template-buildbusiness .logo {display:none!important;}
  .page-template-template-lookforanartist .logo {display:none!important;}*/

  .page-template-template-buildbusiness .headerwrap {background-color:#ffffff;}
  .page-template-template-lookforanartist .headerwrap {background-color:#000000;}
  .page-template-template-cocreatehome .headerwrap {background-color:#000000;}

  p {line-height:22px;font-size:18px;color:#fff;}
  h2 {font-size:2em; font-family: 'CanalDemiRomain'; text-transform: uppercase;}
  h3 {font-size:1.6em; font-family: 'CanalDemiRomain'; text-transform: uppercase;}

  .row {
    display: block;
    grid-auto-flow: column;
    grid-template-columns: 1fr;
  }

  .halfcol {
    border: none;
    height:auto;
    display: block;
    text-align:center;
    position:relative;
  }

  .firsthalf {padding-top:70px;}
  .conholder {max-width:500px;text-align:center;padding-left:20px; padding-right:20px;margin:0 auto;padding-top: 90px; padding-bottom: 90px;}
  /*.conholder:first-of-type {max-width:500px;text-align:center;padding-left:20px; padding-right:20px;margin:0 auto;padding-top: 100px; padding-bottom: 100px;}*/

  .hometext {position:relative ;bottom:0px; margin-left:0px;margin-right:0px;padding-top:20px;padding-bottom:20px;background-color:#f06600;}
  .hometext p {text-align:center;font-size:18px;width:90%;margin:0 auto;padding-left:20px;padding-right:20px;}

  .formwrapper {width:100%;height:auto;margin-top:50px;}

  #mobslider {position:relative; width:100%; height:auto;margin-top}
  .sliderdiv {height:100%; width:100%;position:absolute;top:0px; left:0px}
  #theslider {height:900px;}

  .dtonly {display:none!important;}
  .mobonly {display:block!important;}
}

@media only screen and (max-width: 700px) {
  #theslider {height:800px;}
}

@media only screen and (max-width: 500px) {
  #theslider {height:700px;}
}

@media only screen and (max-width: 400px) {

h2 {font-size:1.8em; font-family: 'CanalDemiRomain'; text-transform: uppercase;}
#theslider {height:600px;}

}

@media only screen and (max-width: 380px) {

}

@media only screen and (max-width: 350px) {

}