/*
Theme Name: vervetheme
Author: Bryn Davies
Author URI: http://deftlydoesit.co.uk
Description: Theme Styles for Verve.
Version: 0.1
*/

/* h1,h2,h3,h4...ect */
@font-face {
  font-family: "TerfensBold";
  src: url("assets/fonts/terfens_bold_macroman/terfensbold-webfont.woff") format('woff');
}


@font-face {
  font-family: "RobotoLight";
  src: url("assets/fonts/Roboto/Roboto-Light.ttf") format('truetype');

}

@font-face {
  font-family: "RobotoRegular";
  src: url("assets/fonts/Roboto/Roboto-Regular.ttf") format('truetype');
  font-weight: normal;
}

@font-face {
  font-family: "RobotoMedItalic";
  src: url("assets/fonts/Roboto/Roboto-MediumItalic.ttf") format('truetype');
}

@font-face {
  font-family: "RobotoBold";
  src: url("assets/fonts/Roboto/Roboto-Bold.ttf") format('truetype');
  font-style: bold;
}

@font-face {
  font-family: "RobotoBoldItalic";
  src: url("assets/fonts/Roboto/Roboto-BoldItalic.ttf") format('truetype');
  font-style: bold;
}

/*
BG Grey = #F2F2F2
Text Grey = #707070
Text Dark / Footer BG = #21213D
Footer Text = #DCE3F0
Main Blue = #0000FF
Orange Accent= #FF7300

*/

body {
	margin:0;
	padding:0;
	background-color:#F2F2F2;
	color:#707070;
	font-family: "RobotoRegular";
	font-size:18px;
	line-height:30px;
}

h1,h2,h3,h4,h5 { color:#0000FF; margin-bottom:25px; font-family: "TerfensBold";}
h1 span,h2 span,h3 span,h4 span {color:#FF7300;}
h1 {font-size:5em;}
h2 {font-size:4em; line-height: 1.2em;}
h3 {font-size:3em;}
h4 {font-size:2em;line-height:1.2em;}
h5 {font-size:1.8em; line-height:1.2em;}


.row {width:100%; display:block;clear:left;position:relative;}
.col10 {width:10%; display:inline-block; float:left;}
.col20 {width:20%; display:inline-block; float:left;}
.col25 {width:25%; display:inline-block; float:left;}
.col30 {width:30%; display:inline-block; float:left;}
.col40 {width:40%; display:inline-block; float:left;}
.col45 {width:45%; display:inline-block; float:left;}
.col50 {width:50%; display:inline-block; float:left;}
.col55 {width:55%; display:inline-block; float:left;}
.col60 {width:60%; display:inline-block; float:left;}
.col70 {width:70%; display:inline-block; float:left;}
.col75 {width:75%; display:inline-block; float:left;}
.col80 {width:80%; display:inline-block; float:left;}
.col90 {width:90%; display:inline-block; float:left;}

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

.headercontent {position: fixed; width:100%; height:50px; top:25px;z-index: 100;}

#header {
	max-width:1280px;
	height:50px;
	background-color:#ffffff;
	background-color: rgba(255,255,255,.8);
	backdrop-filter: blur(3px);
	margin:0 auto;
	/*position: fixed;
	top:50px;
	left: 50%;
	transform: translate(-50%, 0);*/
	border-radius:25px;
}
.headerlogoholder {float:right;padding-top:14px;padding-right:25px;}
.headerlogoholder img {height:25px;}

.menuicon {float:left;padding-top:16px;padding-left:25px;}
.menuicon img {height:20px;}

.menuholder {display:none;background-color:#0000FF;width:100%; height:100vh; z-index: 101;position:fixed; top:0px; left:0px;}

.mainmenu {max-width:600px;margin:0 auto; background-color:transparent;margin-top:100px;text-align:center;}
.mainmenu .logo {width:250px; height:auto; margin-bottom:20px; padding-bottom:0px;}
.mainmenu ul {padding-left: 0px;}
.mainmenu ul li {display:block; text-align:center; color:#ffffff; font-size:45px;padding-top:20px;padding-bottom:20px; font-family: "RobotoLight";}
.mainmenu ul li a {color:#ffffff; text-decoration: none;}
.mainmenu ul li a:hover {font-family: "RobotoBold";}

.clearheader {margin-top:120px;}

.sectionbreak {
	max-width:1400px;
	height:50px;
	background-color:#ffffff;
	opacity:.9;
	backdrop-filter: blur(20px);
	margin:0 auto;
	position: relative;
	border-radius:25px;
	margin-bottom:30px;
	/*margin-left: 20px;
  margin-right: 20px;*/
}

video {max-width: 100%;height: auto;border-radius:20px;}

#hero {width:100%; height:auto; position: relative;}

section {width:100%; position:relative; height:auto;}

.content {max-width:1240px; padding: 20px; height:auto; margin:0 auto;display:block; overflow: hidden;}

.homeintro {position:relative;}
.homeintro p {max-width:900px; margin:0 auto; text-align:center;margin-bottom:20px; font-size:25px; line-height:32px;font-family: "RobotoLight";}
.homeintro h2 {text-align:center;margin-bottom:40px;margin-top: 30px;}
.homeintrovideowrap {max-width:1060px; height:auto;margin:0 auto;margin-top:120px;position:relative;z-index:5;}

.butbluegrad {padding-left:15px; padding-right:15px; padding-top:10px; padding-bottom:10px;color:#ffffff;background: rgb(33,33,61);
background: linear-gradient(180deg, rgba(33,33,61,1) 0%, rgba(0,0,255,1) 100%); border-radius:25px; font-size:17px; font-family: "RobotoBold"; text-decoration:none;}

.butgreygrad {padding-left:15px; padding-right:15px; padding-top:10px; padding-bottom:10px;color:#ffffff;background: rgb(33,33,61);
background: linear-gradient(180deg, rgba(33,33,61,1) 0%, rgba(106,106,125,1) 100%); border-radius:25px; font-size:17px; font-family: "RobotoBold"; text-decoration:none;}


.page-template-template-thankyou .headercontent {display:none;}
.page-template-template-thankyou .menuholder {display:none;}
.page-template-template-thankyou section {background-color:#0000FF;}
.page-template-template-thankyou body {background-color:#0000FF;}
.thankyoucontent {height:100vh; width:100%;}
.thankswrapper {
  width:800px;
  height:407px;
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  background-image:url('assets/thankyou-img.png');
  background-size:cover;
  background-repeat: no-repeat;
}

.thankswrapper .mobimg {display:none;}

.thankswrapper .thetext {color:#ffffff;bottom:20px; position:absolute; width:36%;left:160px;font-family: "RobotoLight";line-height: 26px;}
.thankswrapper .thetext span {font-family: "RobotoBold";}
.thankswrapper .butbluegrad {font-size:14px;}

/*.work1ticker-wrap {
  width: 100%;
  height: auto;
  margin: 0 auto;
  overflow: hidden;
  white-space: nowrap;
  position: relative;
  bottom: 0;
  height: auto;
  background-color: transparent;
	display:block;
}
.work1ticker {
  display: inline-block;
  margin-top: 5px;
  animation: marquee 20s linear infinite;
}
.work1item-collection-1 {
  position: relative;
  left: 0%;
  animation: swap 20s linear infinite;
}

.work1item-collection-1 img {width:100%;}

.work1item {
  display: inline-block;
  max-width:30%;
}*/



/*sdffdsfsdfsd*/

.ticker-wrap {
  width: 100%;
  height: 60px;
  margin: 0 auto;
  overflow: hidden;
  white-space: nowrap;
  position: relative;
  bottom: 0;
  height: 2.5rem;
  background-color: #0000FF;
	margin-top:50px;
	display:block;
}
.ticker {
  display: inline-block;
  margin-top: 5px;
  animation: marquee 20s linear infinite;
}
.item-collection-1 {
  position: relative;
  left: 0%;
  animation: swap 20s linear infinite;
}

.item {
  display: inline-block;
  padding: 0 0rem;
  font-size: 1.5rem;
  color: white;
	text-transform:uppercase;
	font-family: "RobotoMedItalic";
}

/* Transition */
@keyframes marquee {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  100% {
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
  }
}

@keyframes swap {
  0%, 50% {
    left: 0%;
  }
  50.01%,
  100% {
    left: 100%;
  }
}


#approach h1 {margin-bottom:0px; margin-top:0px; line-height: 1.2em;}
#approach .content {max-width:1240px; margin:0 auto;overflow: hidden;padding-bottom:60px;}
#approach h2 {    font-size: 2em; line-height: 1.2em; margin-top: 45px;}



#work h1 {margin-bottom:0px; margin-top:0px; line-height: 1.2em;}
#work .content {overflow:hidden; max-width:1240px;}

.workslider1 {text-align:center; color:#ffffff; padding-top:10px;padding-bottom:10px; margin-top:30px;width:100%;}

/*.blueline {height:1px; background-color:#0000ff; width:100%; display:block; position:absolute; bottom:87px;}*/
.carouselnav {height:25px; width:100%; text-align:center; background-image:url('assets/carouselline.gif'); background-size:100% 1px; background-repeat:no-repeat;background-position:0px 50%;}
.carouselnext {width:40px; text-align:center; height:25px; background-color:#F2F2F2;display: inline-block;cursor:pointer;margin-right: -3px;}
.carouselnext img {height:100%;width:auto;}
.carouselprev {width:40px; text-align:center; height:25px; background-color:#F2F2F2;display: inline-block;cursor:pointer;margin-left: -3px;}
.carouselprev img {height:100%;width:auto;}

.work1slide {width:25%;}
.work1slide img{width:100%;}

.workslider2 {text-align:center; color:#ffffff; padding-top:10px;padding-bottom:10px; width:100%;}
.work2slide {width:25%;}
.work2slide img {width:100%;}

.lozengeholder {
  display: block;
  overflow:hidden;
  padding-top:50px;
  text-align:center;
  max-width: 1240px;
  margin: 0 auto;
  padding-bottom: 20px;
  position:relative;
}

/*.lozengeholder {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  overflow:hidden;
  padding-top:50px;
  padding-bottom:50px;
  text-align:center;
  max-width: 1240px;
  margin: 0 auto;
}*/

.worklozenge {width:23.5%;margin:0.2%;}
.worklozenge img {width:100%;}


#workWrap {display:none; position:fixed; top:0px; left:0px; width:100%; height:100vh; background-color:rgba(33,33,61,.85); z-index: 200;align-items: center; justify-content: center;}
.projectwrap {max-width:1100px; background-color:#ffffff; height:529px; display:block; position:relative; border-top-right-radius:30px;border-bottom-right-radius:30px;border-top-left-radius:30px;border-bottom-left-radius:30px;padding-top:20px; padding-bottom:20px;background-image:url('assets/worklozengebgbl.png'); background-repeat: no-repeat; background-size:90% 100%;}
.sliderholder {height:500px;}
.worktitle {color:#0000FF;font-family: "RobotoBold"; font-size: 32px;line-height:36px; margin-top:0px;margin-bottom:10px;max-width: 520px;}
.workdetails h3 {font-size:17px; color:#0000FF;margin-bottom:0px;margin-top:10px;}
.workdetails p {margin-top:0px;font-size:15px; line-height:19px;}
.wslide {}
.awardsblock {position:absolute; top:10px; left:20px; width:auto; height:auto;z-index:5;text-align:center;display:none;}
.awardsblock img {width:130px;margin-bottom: -8px;}
.awardtag {display:inline;padding:3px 10px;text-transform: uppercase; width:100%; border-radius:20px;background-color:#0000ff; color:#ffffff; font-size:12px;text-align:center;}
.awardtag span {color:#FF7300; font-size:13px;}
.workslider .slick-slide img {height: auto !important;border-top-left-radius:30px;border-bottom-left-radius:30px;}
.wslide iframe {width:100%;}

.closework {position:absolute; right: 20px; top: 15px; width: 25px;cursor: pointer;z-index:10;}

.workdataholder {padding-bottom:20px;}

.workslider {width:100%; margin:0 auto;height:560px;float:left;margin-top:-20px;}
.workslider img {width:100%;}

.workslider .slick-slide {height: auto!important;}

@media only screen and (max-width: 1100px) {
  .projectwrap {width:95%; background-color:#ffffff; height:auto; display:block; position:relative; border-top-right-radius:30px;border-bottom-right-radius:30px;border-top-left-radius:30px;border-bottom-left-radius:30px;padding-top:0px; padding-bottom:20px;background-image:url('assets/worklozengebgbl.png'); background-repeat: no-repeat; background-size:90% 100%;}
.workslider .slick-slide img {height: auto !important;/*padding-top: 25%;*/}
.workslider {width:100%; margin:0 auto;height:auto;float:left;margin-top:0px;}
}

@media only screen and (max-width: 900px) {
.workslider .slick-slide img {height: auto !important;/*padding-top: 35%;*/}
}

@media only screen and (max-width: 790px) {
  .projectwrap {width:95%; background-color:#ffffff; height:95vh; display:block; position:relative; border-top-right-radius:30px;border-bottom-right-radius:30px;border-top-left-radius:30px;border-bottom-left-radius:30px;padding-top:0px; padding-bottom:20px;background-image:none;overflow-y:auto;}
  .sliderholder {height:auto; width:100%!important;background-color:#eee2f6;padding-bottom:0px;}
  .workdetails {height:auto; width:88%!important;padding-top:20px;}
  .workslider {height:auto!important;}
  .wslide {}
  .workslider .slick-slide {height: auto !important;}
.workslider .slick-slide img {height: auto !important;/*padding-top: 10%;*/}
.slick-dotted.slick-slider {margin-bottom: 0px!important; }
}

@media only screen and (max-width: 580px) {
.workslider .slick-slide img {height: auto !important;/*padding-top: 18%;*/}
}

@media only screen and (max-width: 490px) {
.workslider .slick-slide img {height: auto !important;/*padding-top: 25%;*/}
}

@media only screen and (max-width: 490px) {
.workslider .slick-slide img {height: auto !important;/*padding-top: 30%;*/}
}

@media only screen and (max-width: 445px) {
.workdetails .butbluegrad {font-size: 13px;}
}

@media only screen and (max-width: 400px) {
.workslider .slick-slide img {height: auto !important;/*padding-top: 40%;*/}
}

@media only screen and (max-width: 350px) {
    .workdetails .butbluegrad {font-size: 11px; }
}



.slick-dots {
  position: absolute;
  bottom: -45px;
  list-style: none;
  display: block;
  text-align: center;
  padding: 0;
  width: 100%;
}
.slick-dots li {
  position: relative;
  display: inline-block;
  height: 20px;
  width: 20px;
  margin: 0 0px!important;
  padding: 0;
  cursor: pointer;
}
.slick-dots li button {
  border: 0;
  background: #ffffff;
  display: block;
  height: 10px;
  width: 10px;
  outline: none;
  line-height: 0;
  font-size: 0;
  color: transparent;
  padding: 3px;
  cursor: pointer;
  border-radius:10px;
}
.slick-dots li button:hover,
.slick-dots li button:focus {
  outline: none;
}
.slick-dots li button:hover:before,
.slick-dots li button:focus:before {
  opacity: 1;
}
.slick-dots li button:before {
  position: absolute;
  top: 0;
  left: 0;
  content: "•";
  width: 20px;
  height: 20px;
  font-family: "slick";
  font-size: 6px;
  line-height: 5px;
  text-align: center;
  color: white;
  opacity: 1!important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.slick-dots li.slick-active button:before {
  color: black;
  opacity: 0.75;
}

.slick-prev {position: absolute;bottom: 12px;left: 51%;}
.slick-next {position: absolute;bottom: 12px;left: 48%;}


#clients .content {overflow:hidden; max-width:1240px;}
#clients h1 {
    margin-bottom: 0px;
    margin-top: 0px;
    line-height: 1.2em;
}

#clients h2 {margin-top:80px;font-size: 2em; line-height: 1.2em;}
#clients h4 {margin-top:80px;}

#clients .shortcol {width:40%;margin-left:5%;padding-top:30px;}
#clients .col50 img {max-width:500px;}
#clients .col50 video {max-width:500px;}
#clients .imgcol {float: right; margin-top: -95px;text-align:center;}


#clientlogoholder {text-align:center;}
#clientlogoholder img {height: 120px; margin-left: 30px; margin-right: 30px; }


#team {background-color:#0000FF;}
#team .content {background-color:#0000FF;padding-top:50px;padding-bottom:30px;max-width:1240px;position:relative}
#team p {color:#DCE3F0;}
#team .teamintro {text-align:center;max-width:1024; margin:0 auto;margin-bottom:30px;margin-top:30px;font-family: "RobotoLight"; color:#ffffff!important;position:relative; z-index: 3;}
#team .teamoutro {text-align:center;max-width:500px; margin:0 auto;margin-bottom:30px;margin-top:30px;font-family: "RobotoBold";color:#ffffff!important;position:relative; z-index: 3;}
#team h1 {max-width:900px;margin:0 auto;line-height: 1.1em;color:#ffffff; text-align:center;}
#team .peopleholder {
	background-image:url('assets/people-background.png'); background-repeat: no-repeat;
	overflow:hidden;
	padding-top:50px;
	padding-bottom:50px;
	text-align:center;
  max-width: 1240px;
  margin: 0 auto;
  z-index:2;
  position:relative;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.towerperson {width:15%;margin-left:0.7%; margin-right:0.7%;margin-bottom: 1%;}
.towerperson a {text-decoration:none;}
.towerperson img {width:100%; transition: all 0.5s ease;}

@media only screen and (min-width: 950px) {
.towerperson a:hover > img {opacity:0.3;}
.towerperson a:hover >.nameoverlay {display:block;}
}

.nameoverlay {display:none;/*background-color:rgba(0,0,0,0.5);*/position:absolute;top:0px;left:0px;width:100%; height:100%;padding-top:50%; font-size:34px; color:#ffffff; text-align:center;font-family: "TerfensBold";line-height:40px;z-index: 11;transition: all 0.1s ease;}

.towerDT {display:block;}
.towerMob {display:none;}

#leftMemberWrap {display:none; position:fixed; top:0px; left:0px; width:100%; height:100vh; background-color:rgba(33,33,61,.85);  z-index: 200;align-items: center; justify-content: center;}
.leftMember {margin-left:-150px;padding-left:100px;float:left; width:900px; background-color:#ffffff; height:auto; display:block; position:relative; border-top-right-radius:300px;border-bottom-right-radius:300px;border-top-left-radius:50px;border-bottom-left-radius:50px;padding-top:30px; padding-bottom:30px;}
.leftMember .dataholder{max-width:600px; height:auto; display:block; overflow:hidden; text-align:left;float:left;}
.leftMember .name {line-height:unset;font-size:3.4em;line-height: 1em;}
.leftMember .job {font-family: "RobotoBold"; font-size:30px;margin-top:0px;color:#21213D;}
.leftMember .about {max-width:600px; padding-bottom:30px;border-bottom: 5px dotted #0000FF;color:#21213D;}
.leftMember .quote {max-width:600px; font-style:italic;color:#21213D;}
.leftMember .faves {max-width:600px;padding-bottom:30px;display: block;overflow:hidden;}
.leftMember .faves span {color:#0000FF; text-transform:uppercase;font-family: "RobotoBold";}
.leftMember .faveleft {width: 40%;float: left; padding-right: 8%;}
.leftMember .faveright {width:40%; float:left;padding-right: 8%;}
.leftMember .memberimg {position:absolute;top: 50%; left: 95%; transform: translate(-50%, -50%); }
.leftMember .closepeople {position:absolute; left:93%; top:0px; width:100px;cursor: pointer;}

/*.leftMember .teamlinkedin {position:absolute; bottom:20%; right:23%;width:50px; height:50px;}*/
.leftMember .teamlinkedin {position:absolute; top:47%; right:21%;width:50px; height:50px;}

/*#rightMemberWrap {display:none; position:fixed; top:0px; left:0px; width:100%; height:100vh; background-color:rgba(33,33,61,.85); z-index: 200;align-items: center; justify-content: right;}
.rightMember {padding-right:150px;float:right; width:60%; background-color:#ffffff; height:auto; display:block; position:relative; border-top-left-radius:300px;border-bottom-left-radius:300px;padding-top:30px; padding-bottom:30px;}
.rightMember .dataholder{ max-width:600px; height:auto; display:block; overflow:hidden; text-align:left;float:right;}
.rightMember .name {line-height:unset;font-size:3.5em;}
.rightMember .job {font-family: "RobotoBold"; font-size:30px;margin-top:0px;color:#21213D;clear:both;}
.rightMember .about {max-width:600px;color:#21213D;padding-bottom:30px;border-bottom: 5px dotted #0000FF;clear:both;}
.rightMember .quote {max-width:600px;color:#21213D;font-style:italic;clear:both;}
.rightMember .faves {max-width:600px; display: block;overflow:hidden;clear:both;padding-bottom:30px;}
.rightMember .faves span {color:#0000FF; text-transform:uppercase;font-family: "RobotoBold";}
.rightMember .faveleft {width:49%; float:left;}
.rightMember .faveright {width:49%; float:left;}
.rightMember .memberimg {position:absolute;top: 50%; left: 5%; transform: translate(-50%, -50%); }
.rightMember .closepeople {position:absolute; left:-3%; top:0px;width:100px; cursor: pointer;}
*/

#awards {background-color:#ffffff;}
#awards  h1 {line-height: 1.1em;}

.awardsholder {text-align:right;padding-top:50px;padding-bottom:40px;}
.awardblock {width:330px; height:auto; display:inline-block; text-align:left;margin-bottom:20px;}
.awblock50 {width:49%; float:left; height:120px;}
.awblock50 img {width:87%; height:auto;}
.awentry {display:block;width:100%;padding-left:20px;color:#21213D;}
.awentry span {font-weight:700; color:#0000FF;}


.tagsdisplay {position: absolute;right: 0px;top: 100px;max-width: 700px; text-align: center;}
.tagsdisplay ul {list-style-type:none;}
.tagsdisplay ul li {display:inline-block;margin-left:3px; margin-right:3px;margin-bottom: 10px;}
.tagsdisplay ul li a {font-size:16px; padding:5px 15px; border-radius:20px; background-color:#ffffff;border:1px solid #707070; text-decoration:none;font-family: "RobotoLight";color:#21213D;}
.tagsdisplay ul li a:hover {font-size:16px; padding:5px 15px; border-radius:20px; background-color:#707070;border:1px solid #707070; text-decoration:none;font-family: "RobotoLight";color:#ffffff;}

.tagsdisplay .taglink {}

#news .content {overflow:hidden; max-width:1240px;}
#news h1 {
    margin-bottom: 0px;
    margin-top: 0px;
    line-height: 1em;
}

.page-template-template-newspage h1 {line-height: 0.9em;margin-top:0px;}

.newsgrid {display: flex;
    flex-wrap: wrap; grid-gap: 5%; margin-top:80px;margin-bottom:130px;}

/*.newsgrid {
  display: flex;
  justify-content: space-between;
  margin-top:80px;
  margin-bottom:50px;
}*/


.newsExcerpt {flex-basis: 45%;
  box-sizing: border-box;}

.newsthumbnail {width:150px; display: block;float:left;}
.newsthumbnail img {width:100%; border-radius: 10px;}
.newsdata {width:auto; display: block; float:right;vertical-align: top;width: calc(100% - 170px); padding-bottom:50px;}
.newsdata h5 {margin-top:0px;margin-bottom:0px; font-size:1.4em; line-height:1em;margin-top:10px;}
.newsdata h2 {margin-top:0px;margin-bottom:0px; font-size:1.4em; line-height:1em;margin-top:10px;}
.postdate {margin-top:0px; margin-bottom:0px;padding-left:10px;padding-top:0px;}
.postexcerpt p{padding-left:10px;}
.newsdata h5 a {text-decoration:none; color:#0000FF;}
.newsdata h2 a {text-decoration:none; color:#0000FF;}

.newsdata a {text-decoration:none; color:#0000FF;}

.postbutton {padding-top:15px;}

.newstitle {padding-top:80px;position: relative;}
.page-template-template-newspage .newstitle {padding-top:80px;position: relative;margin-top:0px;padding-bottom:30px;}
.page-template-template-newspage .clearheader {
    margin-top: 50px;
}

.blogcontent {}

#youmightlike .col45 {padding:2.5%;}


.teamimageanimation {width:90%;padding-top:15px;}
.linkedcirclesanimation {width:300px; position:absolute;right:10px;top:280px;z-index:-1;}
.anihalfcircle {position:absolute; left:55%; top:0px;width:250px;}
.newstitleanimation {position:absolute; left:250px;top:80px; width:220px;z-index: -1;}
.lowerteamanimation {position:absolute; right:20%;bottom:215px; width:250px; z-index:1;}

.newsposttitleanimation {}
.newspostvideoanimation {}
.newspostvideoanimation {}

/* Post builder style */
.buildertitle {max-width:1240px;margin:0 auto; display:block; overflow:hidden;}
.buildertitle h2 {max-width:800px;margin-top:0px;}
.buildercontent {max-width:1000px;margin:0 auto; display:block; overflow:hidden;padding-top: 30px;padding-bottom:30px;}
.buildercontent h4 {margin-top:10px; margin-bottom:30px;}


.single-post h1 {font-size: 3.5em; width: 70%; line-height: 1em;  margin-top:0px;}
.single-post h2 {font-size: 2.1em;}
.single-post h3 {font-size: 1.2em;}

.buildercontent img {border-radius:20px;}

.imageonly img {width:100%;}

.single-post li {margin-bottom:25px;}


.Bintroblock {display: flex; align-items: center;justify-content: center; padding-bottom:50px;}
.Bintroblock img {border-radius:10px;}

.Btextonly {padding-bottom:50px;}

.Btextvideo {padding-bottom:50px;}
.Btextvideo p {width:70%;}
  .videopost {}
.single-post .videopost {margin-top:10px; position: relative;
    overflow: hidden;
    width: 100%;
    padding-top: 56.25%; /* 16:9 Aspect Ratio (divide 9 by 16 = 0.5625) */}
.single-post .videopost iframe{position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;}

.Btextimage {padding-bottom:50px;}
.Btextimage img {margin-left:2.5%; border-radius:10px;}

.wp-block-image .aligncenter {
    margin-left: 0px;
    margin-right: 0px;
    width: 100%!important;
}

.Bquote {}
.postquotebg {background-color:#DCE3F0;}
.quoteholder {margin-top:75px;background-image:url('assets/openquote.png'); background-repeat: no-repeat; background-position:0px 0px; background-size:35px;padding-left: 40px;}
  .postquote {color:#21213D;background-image:url('assets/closequote.png'); background-repeat: no-repeat; background-position:100% 100%; background-size:35px; padding-right:40px;}
.citeholder {text-align:center;color:#21213D;font-family: "RobotoBoldItalic";margin-bottom:75px;}

.single-post .ticker-wrap {margin-top:0px;}


.single-post . {position:absolute; left:60%; top:0px; width:350px; height:auto;}

#getintouch .content {max-width:1240px; margin:0 auto;overflow: hidden;padding-bottom:60px; padding-top:50px;}
#getintouch h1{
	margin-bottom: 0px;
	margin-top: 0px;
	line-height: 1.2em;
}
#getintouch .shortcol {width:40%;margin-left:5%;padding-top:10px;}
#getintouch .triviacol {padding-top:100px;}

.contactformwrap {max-width:500px;}
.contactformwrap .acf-label {display:none;}
.contactformwrap .acf-fields>.acf-field { padding: 10px 5px;border-top-width:0px!important;}
.contactformwrap input[type=text] {border-radius:20px; border:1px solid #707070;padding:10px!important;}
.contactformwrap textarea {border-radius:20px; border:1px solid #707070;padding:10px!important;}
.contactformwrap input[type=submit] {float:right;margin-right:10px;padding-left:15px; padding-right:15px; padding-top:8px; padding-bottom:7px;color:#ffffff;background: rgb(33,33,61);
background: linear-gradient(180deg, rgba(33,33,61,1) 0%, rgba(106,106,125,1) 100%); border-radius:25px; font-size:17px; font-family: "RobotoBold"; text-decoration:none;border:0px;text-transform:uppercase;}
#getintouch .followwrap {text-align:center;}

.socialtitle {width:400px; display:inline-block;}
.socialtitle h2 {margin-top:25px;}
.socialicons {width:150px;margin-top:30px;display:inline-block;}
.socialicons img {width:56px;}

#footer {background-color:#21213D; color:#DCE3F0; height:140px; margin:0 auto;}
.footerlogo {float:left; padding-top: 28px;}
.footerlogo img {height:45px;}
.footertext {float:right;padding-top:27px;}
.footertext p {text-align:right; color:#DCE3F0;}
.footertext a {color:#DCE3F0; text-decoration:none;}

.copyrighttxt {margin-bottom:0px;margin-top:8px;}
.ftlinks {margin-top:0px;margin-bottom:8px;}

.documenttitle {max-width:1240px;margin:0 auto; display:block; overflow:hidden; padding-left:20px; padding-right:20px;margin-top:50px;}
.documentcontent {max-width:1000px;margin:0 auto; display:block; overflow:hidden; padding-left:20px; padding-right:20px; padding-top: 30px;}
.documentcontent h3 {font-size:1.8em;}

.cookiepanel {display:none;width:1140px;padding: 30px 50px 20px 50px;border-top-left-radius:30px; border-top-right-radius:30px;margin:0 auto; position:fixed; bottom:0px;background-color:#0000FF; color:#ffffff;left: 50%;
transform: translate(-50%, 0); z-index: 10;}
.cookietext h5 {color:#ffffff;text-align:left;margin-top:0px; margin-bottom:5px;font-size: 1.5em;}
.cookietext {width: calc(100% - 180px); float:left;font-size: 21px; line-height: 26px;}
.cookiebuttons {width:180px; float:right; padding-top: 45px;}
.cookiebutton {margin-bottom:10px;width:100%; text-align:center;}
.cookiebutton a {font-family: "RobotoBold";padding:6px 40px; background-color:#F2F2F2; color:#21213D; text-align:center;font-size:18px; text-decoration:none; border-radius:15px;}


/* resposive media queries */
@media only screen and (max-width: 1240px) {

  .buildertitle {max-width:1000px;margin:0 auto; display:block; overflow:hidden; padding-left:20px; padding-right:20px;}
  .buildercontent {max-width:1000px;margin:0 auto; display:block; overflow:hidden; padding-left:20px; padding-right:20px; padding-top: 30px;}
  .Btextimage img {width:100%!important; margin-left:0%;}

  .buildertitle h2 {
    max-width: 800px;
    margin-top: 0px;
    font-size:2.8em;
  }

  .buildercontent h3 {font-size:2.4em;line-height: 1.2em;}

  .cookiepanel {display:none;width:95%;padding:15px;border-top-left-radius:30px; border-top-right-radius:30px;margin:0 auto; position:fixed; bottom:0px;background-color:#0000FF; color:#ffffff;left: 50%;
  transform: translate(-50%, 0);}

}



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

  #leftMemberWrap {display:none; position:fixed; top:0px; left:0px; width:100%; height:100vh; background-color:rgba(33,33,61,.85);  z-index: 200;align-items: normal; justify-content: center;}

  .leftMember {margin:30px; margin-top: 60px;overflow-y: scroll;padding-left:20px;padding-right:20px; max-width:550px; background-color:#ffffff; height:auto; display:block; position:relative; border-top-right-radius:30px;border-bottom-right-radius:30px;border-top-left-radius:30px;border-bottom-left-radius:30px;padding-top:30px; padding-bottom:30px;}
  .leftMember .dataholder{width:100%; height:auto; display:block; overflow:hidden; text-align:left;float:left;position:relative;}
  .leftMember .name {line-height:unset;font-size:1.6em;line-height: 1em;margin-top: 25px; margin-bottom: 5px;}
  .leftMember .job {font-family: "RobotoBold"; font-size:22px;margin-top:0px;color:#21213D;}
  .leftMember .about {max-width:auto; padding-bottom:30px;border-bottom: 5px dotted #0000FF;color:#21213D;padding-top: 20px;}
  .leftMember .quote {max-width:auto; font-style:italic;color:#21213D;}
  .leftMember .faves {max-width:auto;padding-bottom:30px;display: block;overflow:hidden;}
  .leftMember .faves span {color:#0000FF; text-transform:uppercase;font-family: "RobotoBold";}
  .leftMember .faveleft {width:49%; float:left;}
  .leftMember .faveright {width:49%; float:left;}
.leftMember .memberimg {position:absolute; top: 65px; left:83%;/*transform: translate(-50%, -50%);*/ }
.leftMember .memberimg img {width:110px;}
  .leftMember .closepeople {position:absolute; left:20px; top:20px; width:25px;height:25px;cursor: pointer; z-index: 100;}
  .leftMember .closepeople img {width:100%;}

.leftMember .teamlinkedin {position:absolute; bottom:auto; right:auto;top:40px; right:25%; width:35px; height:35px;}

.tagsdisplay {
    position: absolute;
    right: 0px;
    top: 100px;
    max-width: auto;
    width:50%;
    text-align: center;
}

}


@media only screen and (max-width: 1040px) {
  .awardsholder {text-align:center;padding-top:50px;padding-bottom:40px;}
}

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

  #approach .col50 {width:100%; margin-top:10px!important;text-align:center;}
  #approach .col50 img {width:75%!important;margin:0 auto;}
  #approach .col50 p {text-align:left;}
  #approach .col50 h4 {text-align:left;}

  .teamimageanimation {
    width: 100%;
    padding-top: 15px;
}

}

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

  .tagsdisplay {
      position: absolute;
      right: 0px;
      top: 40px;
      max-width: auto;
      width:50%;
      text-align: center;
  }

  .mainmenu {
      max-width: 600px;
      margin: 0 auto;
      background-color: transparent;
      margin-top: 50px;
      text-align: center;
  }

  .mainmenu ul li {
    display: block;
    text-align: center;
    color: #ffffff;
    font-size: 33px;
    padding-top: 10px;
    padding-bottom: 10px;
    font-family: "RobotoLight";
}

.mainmenu .logo {
    width: 220px;
    height: auto;
    margin-bottom: 0px;
    padding-bottom: 0px;
}

  .newsgrid {display: grid; grid-template-columns:100%; grid-gap: 0%;margin-top:80px;margin-bottom:50px;}

  .towerperson {width:23%;margin-left:0.7%; margin-right:0.7%;margin-bottom: 1%;background-color:#0000FF;position:relative;}


  .towerDT {display:none;}
  .towerMob {display:block;}

  h1 {font-size:3em;}
  #approach h1 {font-size:5em!important;}

  #clients .col50 img {max-width:80%;}
  #clients .col50 video {max-width:80%;}
  #clients .imgcol {float: right; margin-top: -55px;text-align:center;}

  #getintouch .col50 {width:100%;}
  #getintouch .shortcol {padding-bottom:50px;}

  #getintouch .contactformwrap {
    max-width: 90%;
}

#youmightlike .col45 {padding:2.5%;width:100%;}

.worklozenge {width:48.5%;margin:0.2%;}

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

  .newstitleanimation {
      position: absolute;
      left: 140px;
      top: 60px;
      width: 150px;
      z-index: -1;
  }

.buildercontent .col50 {width:100%;}

.Bintroblock img {width:100%!important;}


#clientlogoholder img {height: 80px; margin-left: 20px; margin-right: 20px; }

}



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

.thankswrapper {
  width:100%;
  height:auto;
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  background-image:url('assets/thankyou-img.png');
  background-size:115% auto;
  background-position:top right;
  padding-bottom:50px;
}

.thankswrapper .mobimg {display:block;width:100%; height:auto;opacity: 0;}
.thankswrapper .thetext {color:#ffffff;bottom:20px;margin-top: 70px; position:relative; width:90%;padding-left: 5%; padding-right: 5%;left:0px;font-family: "RobotoLight";line-height: 26px;}
.thankswrapper .thetext span {font-family: "RobotoBold";}
.thankswrapper .butbluegrad {font-size:14px;}

}



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

  .Btextvideo p {
    width: 100%;
}

  .linkedcirclesanimation {width:300px; position:absolute;right:10px;top:280px;z-index:-1;display:none;}
  .anihalfcircle {position:absolute; left:55%; top:0px;width:250px;display:none;}
  /*.newstitleanimation {position:absolute; left:250px;top:80px; width:220px;z-index: -1;}*/
  .lowerteamanimation {position:absolute; right:20%;bottom:215px; width:250px; z-index:1;display:none;}

}

@media only screen and (max-width: 768px) {
  #footer {background-color:#21213D; color:#DCE3F0; height:auto; margin:0 auto;}
  .footerlogo {float:none; padding-top: 28px; width:100%; text-align:center;}
  .footertext {float:none;padding-top:27px; width:100%;}
  .footertext p {text-align:center; color:#DCE3F0;}
  .copyrighttxt {margin-bottom:0px;margin-top:23px;}
  .ftlinks {margin-top:0px;margin-bottom:8px;}

  #approach h1 {font-size:3em!important;}
  #approach .col50 img {width:95%!important;margin:0 auto;}

#clients .col50 {width:100%;}
#clients h4 {
    margin-top: 30px;
}

  #clients .shortcol {
    width: 100%;
    margin-left: 0%;
    padding-top: 30px;
}
#clients .imgcol {
    float: right;
    margin-top: 0px;
    text-align: center;
}

.item {
    display: inline-block;
    padding: 0 0rem;
    font-size: 1rem;
    color: white;
    text-transform: uppercase;
    font-family: "RobotoMedItalic";
}

.cookietext h5 {color:#ffffff;text-align:left;margin-top:0px; margin-bottom:5px;font-size: 1.2em;}
.cookietext {width: calc(100% - 0px); float:left;font-size: 16px; line-height: 20px;}
.cookiebuttons {width:300px; float:left; padding-top: 10px;}
.cookiebutton {margin-bottom:10px;width:100%; text-align:center;display:inline;}
.cookiebutton a {font-family: "RobotoBold";padding:6px 30px; background-color:#F2F2F2; color:#21213D; text-align:center;font-size:13px; text-decoration:none; border-radius:15px;}


}

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

  .socialicons {
    width: 100%;
    margin-top: 0px;
    display: inline-block;
    text-align:center!important;
  }

  .tagsdisplay {
      position: relative;
      right: 0px;
      top: 0px;
      max-width: auto;
      width:100%;
      text-align: center;
  }

  .tagsdisplay ul {padding-left:0px;}
  .tagsdisplay ul li {display:inline-block;margin-left:3px; margin-right:3px;margin-bottom: 2px;}
  .tagsdisplay ul li a {font-size:14px; padding:3px 10px; border-radius:20px; background-color:#ffffff;border:1px solid #707070; text-decoration:none;font-family: "RobotoLight";color:#21213D;}
  .tagsdisplay ul li a:hover {font-size:14px; padding:3px 10px; border-radius:20px; background-color:#707070;border:1px solid #707070; text-decoration:none;font-family: "RobotoLight";color:#ffffff;}


}

@media only screen and (max-width: 620px) {
  .towerperson {width:31%;margin-left:0.7%; margin-right:0.7%;margin-bottom: 1%;}
}

@media only screen and (max-width: 550px) {
  .leftMember .faveleft {width:100%!important;margin-bottom:20px;}
  .leftMember .faveright {width:100%!important;}

}

@media only screen and (max-width: 490px) {
  .leftMember .memberimg {
      position: relative;
      top: 20px;
      left: 0px;
      transform: none;
    }

  .leftMember .about {padding-top:0px;}

  .leftMember .teamlinkedin {position:absolute; bottom:auto; right:auto; top:60px; left:95px; width:35px; height:35px;}

  .newsthumbnail {width:100%; text-align:center;}
  .newsthumbnail img {width:100%; margin:0 auto;}
  .newsdata {width:auto; display: block; float:right;vertical-align: top;width: 100%; padding-bottom:50px;}

  .socialtitle {width:auto;}
  .socialtitle h2 {
    margin-top: 0px;
    font-size: 3em;
    width:auto;
    text-align: center;
}

}


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

.homeintro h2 {font-size: 2.8em;}
}

@media only screen and (max-width: 350px) {
.towerperson {width:48%;margin-left:0.7%; margin-right:0.7%;margin-bottom: 1%;}

}



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

}