/*
  Theme Name: Bespoke
  Description: 1.0
  Author: Addedlovely
*/

/* ==========================================================================
  Fonts
   ========================================================================== */
@font-face {
  font-family: 'hatc';
  src: url('../../../wp-content/themes/bespoke/fonts/hatc.eot');
  src: url('fonts/hatc.eot#iefix') format('embedded-opentype'),
       url('../../../wp-content/themes/bespoke/fonts/hatc.woff') format('woff'),
       url('../../../wp-content/themes/bespoke/fonts/hatc.ttf') format('truetype'),
       url('../../../wp-content/themes/bespoke/fonts/hatc.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}

/* Default Fontello */
[class^="icon-"]:before, [class*=" icon-"]:before {font-family: "hatc"; font-style: normal; font-weight: normal; speak: none; display: inline-block; text-decoration: inherit; text-align: center; font-variant: normal; text-transform: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

.icon-readmore:before { content: '\e800'; } /* '' */
.icon-phone:before { content: '\e801'; } /* '' */
.icon-email:before { content: '\e802'; } /* '' */
.icon-down:before { content: '\e803'; } /* '' */
.icon-download:before { content: '\e804'; } /* '' */
.icon-right:before { content: '\e805'; } /* '' */
.icon-link:before { content: '\e806'; } /* '' */
.icon-twitter:before { content: '\f099'; } /* '' */

/* ==========================================================================
  Helpers
   ========================================================================== */
.clear:after {content: ""; visibility: hidden; display: block; height: 0; clear: both;}
.v-center {position: absolute; top:50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%);}
.center {display:block; margin-left: auto; margin-right:auto;}
.cover {-webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; background-position: center center; background-repeat: no-repeat; }
.lazy {display: none;}
.browsehappy {position: fixed; bottom: 0; left: 0; right: 0; text-align: center; background: #000; color: #fff;}

.fluid-video {position: relative;}
.fluid-video iframe {position: absolute; top:0; left:0; bottom: 0; right:0; height: 100%; width: 100%;}
.fluid-video:before {padding-top: 56.25%; content: ''; display: block;}

.hotspot {position: absolute; top:0; bottom: 0; left: 0; right: 0; cursor: pointer;}

/* ==========================================================================
  General
   ========================================================================== */
* {margin: 0; padding: 0;}
html {-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; -webkit-font-smoothing: antialiased; box-sizing: border-box;}
*, *:before, *:after  {box-sizing: inherit;}

body {background: #ffffff; color: #000;}
img {border: 0; display: block; outline: none; -ms-interpolation-mode: bicubic; max-width: 100%; height: auto;}
iframe {border: 0;}

/* ==========================================================================
  Structure
   ========================================================================== */
.container, .container-narrow, .container-medium { width: 100%; margin: auto; padding: 0 40px;  max-width: 1360px; position: relative;}
.container-narrow {max-width: 880px; margin-bottom: 80px;}
.container-medium {max-width: 1040px; margin-bottom: 80px;}

.grid {margin: 0 -6px 74px -6px;}
.col {background: #FFF; float: left; width: 32%; border: 6px solid #F9F9F9; position: relative;}
.col h2 {text-transform: none;}
.col .underline:after {width: 40px;}
.col p {margin-bottom: 12px;}
.col:hover .read-more:after {visibility: visible;}

.card {margin-bottom: 8px; background: #FFF; padding: 55px 80px 55px 190px; position: relative; text-align: left;}
.card h2 {margin-bottom: 16px;}
.card:after, .card:before {content:''; background-repeat: no-repeat; pointer-events: none; background-position: center center; position: absolute; top:0; bottom: 0;  margin: auto;}
.card:after {  content: '\e804'; font-size:40px; font-family: 'hatc'; width: 40px; height: 40px; background-color: #0099d1; border-radius: 50%; color: #FFF; right: 80px;  text-align: center; line-height: 40px; }
.card:before { top:0; bottom:0; left: 80px; width: 72px; height: 100px; background-image: url('../../../wp-content/themes/bespoke/images/icon-document.png'); background-size: auto 100%;  }

.card:hover {background: #0099d1; color: #FFF;}
.card:hover:after {background-color: #FFF; box-shadow: 1px 2px 6px 0px rgba(0, 0, 0, 0.34); color:#0099d1;  }
.card:hover:before { background-image: url('../../../wp-content/themes/bespoke/images/icon-document-hover.png');}
.card:hover h3 {color: #afdff1;}
.card:hover .resource-type {color: #afdff1; border-color: #afdff1;}

.layout {padding: 80px 0; background: #F9F9F9;}
.layout .container-narrow, .layout .container-medium {margin-bottom: 0;}


/* ==========================================================================
  Typography
   ========================================================================== */
body { font-family: 'Source Sans Pro', sans-serif; font-size: 16px; color: #482b42; background: #FFF;}

h1, h2, h3, h4 {font-weight: normal;}

a {text-decoration: none; outline: none; color: inherit;}
cite, address {font-style: normal;}

.serif {font-family: 'Crimson Text', serif; }
.bold {font-weight: 600;}

.wysiwyg { line-height: 2; }
.wysiwyg h1 {margin: 0 auto 44px auto; text-align: center; }
.wysiwyg h2 {font-weight: 600; text-transform: uppercase; font-size: 16px; margin-bottom: 26px; margin-top: 36px;}
.wysiwyg a, .footer-text a { font-weight: 600; text-decoration: underline; }
.wysiwyg > p:first-of-type {font-family: 'Crimson Text', serif; font-size: 30px; line-height: 1.4; }
.wysiwyg ul, .wysiwyg ol {margin-bottom: 20px; line-height: 1.6;}
.wysiwyg blockquote {margin-bottom: 20px; border-left: 2px solid #d9d5d8; font-style: italic; padding-left: 32px;}
.wysiwyg li {list-style-position: inside; margin-bottom: 10px;}
.wysiwyg li ul, .wysiwyg li ol {margin-left: 20px; margin-top: 10px;}
.wysiwyg .button {text-decoration: none;}
p {     margin-bottom: 20px; line-height: 1.6;}



.f-0 {font-size: 0;}
.f-12 {font-size: 12px;}
.f-16 {font-size: 16px;}
.f-18 {font-size: 18px;}
.f-20 {font-size: 20px;}
.f-24 {font-size: 24px;}
.f-64 {font-size: 64px;}

.accent {color: #0099d1;}
.light {color: #b3abb1;}
.italic {font-style: italic;}
.read-more {font-size: 12px; font-weight: bold; text-transform: uppercase; display: block; position: relative; line-height: 12px;}
.read-more:after {width: 24px; height: 12px; position: absolute; right: 0; top:0; color: #D9D5D8; content: '\e800'; font-family: 'hatc'; font-size: 24px; visibility: hidden;}

.underline {font-weight: bold; text-transform: uppercase; padding-bottom: 20px; margin-bottom: 20px; position: relative; line-height: 1; font-weight: 600; font-size: 24px; text-align: left;}
.underline:after {content: ''; width: 160px; height: 2px; background: #B3ABB1; position: absolute; left: 0; bottom: 0; }

.center {text-align: center; padding-top: 40px;}

/* ==========================================================================
  Forms
   ========================================================================== */
button, input, optgroup, select, textarea {color: inherit; font: inherit; outline: none; border: none; font-size: 16px;}
input[type=text], input[type=submit], input[type=email], input[type=password] {-webkit-appearance: none; border-radius:0;}
input, select {height: 48px;}
button {background: transparent;}
button, input[type="button"], input[type="submit"] {cursor: pointer;}
textarea {resize: none; overflow: auto; -webkit-appearance: none;}
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {-webkit-appearance: none; line-height: normal;}

input, button, .button {height: 41px;}
button.moove-gdpr-tab-nav, button.mgbutton {height: auto;}
input, textarea { text-indent: 18px; background: #f8f8f8; border:1px solid #dcdcdc; border-radius: 2px; margin-bottom: 8px; width: 100%;}
label {line-height: 44px; font-weight: 600; text-indent: 8px; display: block;}
textarea {height: 100px; text-indent: 0; padding: 18px;}

form {clear: both; overflow: auto;}
form fieldset {width: 50%; float: left; border: 0;}
form fieldset:nth-child(even) {padding-right: 20px;}
form fieldset:nth-child(odd) {padding-left: 20px;}

::-webkit-input-placeholder {color: #919191;}
:-moz-placeholder {color: #919191;}
::-moz-placeholder {color: #919191;}
:-ms-input-placeholder {color: #919191;}

.button {color: #FFF; font-weight: bold; background: #262626; padding: 0 36px; width: auto; text-indent: 0; border: 0; text-transform: uppercase; font-weight: 600; }
.button.alt {background: #482b42; height: 42px; line-height: 42px; border-radius: 21px; padding: 0 40px; width: auto; margin: auto; display: inline-block; text-transform: uppercase; color: #FFF; }
.button.alt:hover { background: #189ACE; }

/* Gravity Forms */
.wysiwyg .gform_body li {list-style: none; margin-bottom: 0;}
.wysiwyg .gform_body ul {margin-bottom: 0;}

/* MailChimp */
.mc4wp-form-44  { border-top:1px solid #D9D5D8; padding-top: 25px;}
.mc4wp-form-44 .button, .mc4wp-form-44 span {margin-top: 44px;}
.mc4wp-form-44 span {text-align: right; float: right; line-height: 41px; font-size: 14px;}
.mc4wp-form-success .mc4wp-form-fields {display: none;}
.mc4wp-error {clear: both; color: #D93A73;}

/* ==========================================================================
  Header
   ========================================================================== */
.header { height: 192px; position: relative;}
.header .container {height: 100%;}
.logo {display: inline-block; margin: 40px 0;}


.menu {position: absolute; bottom: 0; left: 0; right: 0; line-height: 80px; padding: 0 40px; text-transform: uppercase; font-weight: 600;}
.menu li {list-style: none; display: inline-block; position: relative;}
.menu a {padding: 0 20px; display: inline-block;}
.menu > ul > li:first-of-type a {padding-left: 0;}
.menu li.has-submenu:after {content: '\e803';  font-size: 5px; line-height: 5px; width: 7px; height: 5px; position: absolute; bottom: 10px; left: 0; right: 0; margin: auto; font-family: 'hatc';}
.menu li:hover .submenu {display: block;}
.menu .active >  a {color: #009BD0;}

.submenu {display: none;  position: absolute; top: 80px; left: 50%; transform: translateX(-50%);  background: #FFF;  padding: 0;  text-align: center; white-space: nowrap; z-index: 2; line-height: 50px; min-width: 150px;}
.submenu li {display: block;}
.submenu a:hover {background: #f8f8f8; color: #009BD0;}
.menu .submenu a {padding: 0 16px; display: block;}

.search {position: absolute; top:52px; right: 40px; max-width: 342px; width: 100%; height: 48px;}
.search input {width: 100%; height: 48px; background: #eceaeb; border: 0; height: 48px; margin-bottom: 0; text-indent: 48px;}
.search button {width: 48px; height: 48px; position: absolute; top:0; left: 0; background: transparent; }
.search svg {width: 30px; height: 30px; margin: auto; position: absolute; top:0; bottom: 0; left: 0; right: 0;}

.toggle-menu, .close-menu {display: none;}

/* ==========================================================================
  Content
   ========================================================================== */

/* Page Header */
.page-header { min-height: 120px; background: #482b42; margin-bottom: 80px;}
.page-header .container {height: 100%; min-height: 120px; overflow: hidden;}
.page-header h1 { line-height: 80px; color: #FFF; font-family: 'Crimson Text', serif;  display: inline-block; /* position: absolute; */ margin-left: 144px; font-size: 64px; max-width: 80%; margin-top: 40px;}
.page-header h1 span {-webkit-box-decoration-break: clone;  box-decoration-break: clone;  background: #150711; padding: 0 18px;}
.page-header h3 {color: #FFF; padding: 0 160px; text-transform: uppercase; margin-top: 40px; margin-bottom: -10px;}
.page-header.has-image h1 {bottom: 40px; position: absolute; left: -40px; margin: 0;}
.page-header.has-image img {margin-top: 32px; margin-bottom: -40px;}
.page-header.has-image .container {overflow: visible;}
.page-header.has-image .slideshow {padding-top: 32px; margin-bottom: -40px;}
.page-header.has-image .slideshow img {margin: 0;}
.page-header.has-image .breadcrumb {padding-left: 0;}

/* Page : Header : Next */
.page-next {position: absolute; right: 40px; color: #A496A1; line-height: 78px; top: 0; text-transform: uppercase; font-weight: 600;}

/* Page Header : Breadcrumb */
.breadcrumb { text-transform: uppercase; line-height: 78px;  padding-left: 160px; font-weight: 600; margin-bottom: -40px;}
.breadcrumb, .breadcrumb a {color: #b3abb1;}
.breadcrumb span {color: #FFF;}
.breadcrumb a:after {content: '/'; width: 24px; text-align: center; display: inline-block; vertical-align: top;}

/* Page : Sideline */
.sideline {position: absolute; top:-90px; padding-right: 180px; margin-right: 30px; line-height: 40px; right: 100%; white-space: nowrap; text-align: right; -webkit-transform: rotate(-90deg) translateY(-40px); transform: rotate(-90deg) translateY(-40px); -webkit-transform-origin: top right; transform-origin: top right; text-transform: uppercase; color: #b3abb1; font-weight: 600;}

/* Page Link */
.layout-page-links {background: #f9f9f9; padding: 80px 40px;}
.layout-page-links a {max-width: 800px; width: 100%; background: #482b42; color: #FFF; line-height:104px; padding: 0 80px; display: block; margin: auto; position: relative; margin-bottom: 20px;}
.layout-page-links a:after {content: '\e805'; font-family: 'hatc'; font-size: 40px; color: #FFF; line-height: 40px; width: 40px; height: 40px; position: absolute; top:0; bottom: 0; right: 80px; background: #150711; border-radius: 50%; display: block; margin: auto;}


/* ==========================================================================
  Home
   ========================================================================== */
.page-home .col {width: 25%;}
.page-home .layout-topics {padding-bottom: 70px;}
.page-home .layout-resources {padding-top: 0; text-align: center;}
.page-home .layout-resources .container-medium {margin-bottom: 0;}
.page-home .layout-resources .button {margin-top: 40px;}

/* Slideshow */
.slick-arrow {width: 40px; height: 40px; background: #FFF; text-align: center; position: absolute; bottom: 0; font-size: 0; z-index: 1; background-size:7px 15px; background-position: center center; background-repeat: no-repeat;}
.slick-next {right: 40px; background-image:url('../../../wp-content/themes/bespoke/images/icon-right.svg'); }
.slick-prev {right: 80px; background-image:url('../../../wp-content/themes/bespoke/images/icon-left.svg'); }
.slick-slide {position: relative; outline: none; }

/* Latest Publications */
.layout-latest-publications .resource-type {display: none;}

/* Twitter Feed  /  Newsletter */
.layout-twitter-newsletter {background: #492D42; color: #FFF; padding: 80px 0;}
.layout-twitter-newsletter .underline:after {background: #5B4255;}
.layout-twitter-newsletter .container-medium {margin-bottom: 0;}

/* Twitter Feed */
.twitter-feed {padding-right: 40px;}
.twitter-feed, .newsletter-feed {width: 50%; float: left;}
.twitter-account {text-transform: uppercase; color: #4cb9e0; display: inline-block; padding-right: 40px; position: relative; font-weight: bold;}
.twitter-account:before {position: absolute; right: 0; top:0; bottom: 0; margin: auto; font-size: 24px;}
.tweet {text-transform: uppercase; font-weight: 600; }
.tweet span {font-size: 14px; color: #b3abb1; display: block; margin-top: 16px; }
.tweet span:after {margin-bottom: 20px;  margin-top: 22px;  width: 30px; height: 1px; background: #5B4255; content: ''; display: block;}
.tweet a {color: #4cb9e0;}

/* Newsletter */
.newsletter-feed .card {padding: 0 0 0 100px; background: transparent; color: #FFF;}
.newsletter-feed .card:hover {background: transparent; }
.newsletter-feed .card:before {left: 0; top: 0;}
.newsletter-feed .card:after {top: 62px; left: 16px; right: auto; bottom: auto;}
.newsletter-feed .card {min-height: 80px;}
.newsletter-feed strong {display: block;}
.newsletter-feed .button { background: #2F1A29; color: #FFF; border:0; line-height: 32px; height: 32px; border-radius: 16px; margin-top: 20px; }
.newsletter-feed .button:hover { background: #2F1A29; }

/* ==========================================================================
  Who We Are
   ========================================================================== */
.person {margin-left: 180px; position: relative; padding: 58px 0 62px 0; border-bottom: 1px solid #D9D9D9;}
.person img {position: absolute; top:65px; left: -180px; border-radius: 50%; }
.person h3 {margin-bottom: 20px; font-style: italic;}
.person a {padding-right: 26px; white-space: nowrap; margin-bottom: 10px; display: inline-block;}
.person:last-of-type {border-bottom: 0;}
.person a:before {font-size: 26px; vertical-align: middle; margin-right: 10px; color: #D9D9D9;}

/* ==========================================================================
  Events
   ========================================================================== */
.event {margin-bottom: 12px; background: #FFF; position: relative;}
.event-text {padding: 32px 180px 32px 80px; position: relative; }
.event-text:after { width: 40px; height: 40px; background-color: #0099d1; border-radius: 50%; color: #FFF; right: 80px; content: '\e805'; font-family: 'hatc'; font-size: 40px; position: absolute; top:0; bottom: 0; right: 80px; margin: auto; }
.event h2 {margin-bottom: 16px; line-height: 1.33333333333333;}
.event h2 span {font-weight: normal;}
.event p {margin-bottom: 0;}
.event img {width: 100%; height: auto;}

/* ==========================================================================
  Single
   ========================================================================== */
.meta {padding-top: 40px; border-top:1px solid #f2f2f2;}
.meta label, .meta a {vertical-align: top; line-height: 32px;}
.meta label {color: #333333; font-weight: 600; width: 130px; display: inline-block;}
.meta > div {margin-bottom: 24px;}
.meta a {display: inline-block; background: #F9F9F9; border: 1px solid #DDDDDD; border-radius: 3px; overflow: hidden; padding: 0 18px 0 20px; text-decoration: none; font-weight: normal; color: #333333; position: relative; margin-right: 16px; margin-bottom: 8px;}
.meta a:before { content: ''; position: absolute; top:0; bottom: 0; left: 0; width: 5px; }
.meta div a:last-of-type {margin-right: 0;}
.topic-tags a { border-left: 5px solid #0099d1; }
.project-tags a { border-left: 5px solid #482b42; }

/* ==========================================================================
  Projects
   ========================================================================== */
.project {margin-bottom: 12px; padding: 32px 40px 32px 340px; background: #FFF; position: relative; min-height: 201px;}
.project h2 {margin-bottom: 16px; line-height: 1.33333333333333;}
.project h2 span {font-weight: normal;}
.project p {margin-bottom: 0;}
.project-image {position: absolute; top:0; left: 0; bottom: 0; width: 300px;}


/* ==========================================================================
  Topic : Single
   ========================================================================== */
.tabs .tab {display: none;}
.tabs .tab.active {display: block;}

.tab-links {line-height: 64px; text-align: center; text-transform: uppercase; font-weight: 600; margin-bottom: 40px;}
.tab-links a {width: 33.333%; float: left; position: relative;}
.tab-links-four a {width: 25%;}
.tab-links .active {background: #482b42; color: #FFF;}
.tab-links .active:after {display: none;}
.tab-links a:after {content: ''; top:0; bottom: 0; position: absolute; width: 1px; background: #D9D5D8; right: 0; display: block; height: 32px; margin: auto;}
.tab-links a:last-of-type:after {display: none;}


/* ==========================================================================
  Resources
   ========================================================================== */
.layout-resources {padding: 28px 0 80px 0; }

.resources-filter {margin: 26px 0 40px 0; position: relative;}

.resources-search {line-height: 70px; margin-bottom: 40px; position: relative; top: auto; right: auto; height: 71px; max-width: none;}
.resources-search input, .resources-search button { height:70px; background: transparent;}
.resources-search input {text-indent: 70px; border-bottom: 1px solid #d9d5d8;}
.resources-search button  {width: 70px;}
.resources-search svg {width: 40px; height: 40px;}



.filter {width: 20%; float: left;}
.filter label {text-indent: 24px; text-transform: uppercase; font-weight: 600; position: relative; line-height: 64px;}
.filter label:before, .filter label:after {content: ''; top:0; bottom: 0; position: absolute;}
.filter label:before {right: 16px; width: 17px; height: 7px; content: '\e803'; font-size: 7px; margin: auto; font-family: 'hatc'; line-height: 7px; text-align: left; text-indent: 0;}
.filter label:after {width: 1px; background: #D9D5D8; right: -1px; display: block; height: 32px; margin: auto;}
.filter:last-of-type label:after {display: none;}
.filter:hover, .filter.open  {background: #FFF; box-shadow: 0px 2px 18px 0px rgba(0, 0, 0, 0.11); }
.filter:hover label:before, .filter.open label:before {-webkit-transform:rotate(-180deg); transform:rotate(-180deg); }
.filter:hover label:after, .filter.open label:after {width: auto; bottom: 0; left: 0; right: 0; background: #FFF; z-index: 2; top:auto; height: 12px;}
.filter:hover label {background: #FFF;}
.filter:last-of-type:hover label:after {display: block;}

.filter:hover .dropdown, .filter.open .dropdown { visibility: visible; opacity: 1; box-shadow: 0px 2px 18px 0px rgba(0, 0, 0, 0.11); }

.filter-label {text-transform: uppercase; line-height: 64px; position: relative;}
.filter-label:hover {background: transparent; box-shadow: none;}
.filter-label:after {width: 1px; background: #D9D5D8; right: -1px; display: block; height: 32px; margin: auto; position: absolute; content: ''; top:0; bottom: 0;}

.dropdown {position: absolute; top:64px; left: 0; right: 0; padding: 0 16px; background: #FFF; z-index: 1; visibility: hidden; opacity: 0;}
.dropdown a {display: block; line-height: 50px; border-bottom: 1px solid #D9D5D8;}
.dropdown a:last-of-type {border-bottom: 0;}
.dropdown a:hover, .dropdown a.active {color: #189ACE;}

.dropdown-tags {text-align: center;}
.dropdown-tags a {display: inline-block; border-bottom: 0; padding-right: 16px; margin-right: 16px; position: relative; }
.dropdown-tags a:after {content: ''; height: 14px; width: 1px; right: -1px; top:0; bottom: 0; margin: auto; background: #D9D5D8; position: absolute; }

.resource {padding-right: 150px; clear: both; overflow: auto;}
.resource h3 {float: left; max-width: 75%;}
.resource.link:after {content: '\e806'; font-size: 26px;}
.resource-type {line-height: 22px; padding: 0 10px; border: 1px solid #b3abb1; border-radius: 13px; font-size: 12px; display: inline-block;  margin-right: 10px; color: #b3abb1; float: left; margin-left: 10px}

.mobile-filter {display: none;}

/* ==========================================================================
  Topics
   ========================================================================== */
.layout-topics .grid {margin-bottom: 0;}

.topic {padding: 0 30px 25px 30px; }
.topic-image {margin: 0 -30px 22px -30px;}
.topic-image img {width: 100%;}

/* ==========================================================================
  Partners
   ========================================================================== */
.layout-networks {background: #f9f9f9; padding: 80px 0;}
.layout-networks .container-medium {margin-bottom: 0;}

.partner {padding: 8px 30px 25px 30px; }
.partner-image {padding-top: 70.547945205479%; height: 0; margin: 0 -22px 22px -22px; position: relative; background-image: url('../../../wp-content/themes/bespoke/images/partner-placeholder.png'); background-size: 100% auto; background-position: bottom left;}
.partner-image img {position: absolute; top:0; bottom: 0; left:0; right: 0; padding: 50px; height: auto; width: auto; margin: auto;}

.practitioner-network h2 {margin-bottom: 12px;}

/* ==========================================================================
  Contact
   ========================================================================== */
.contact-map {padding-top: 31.25%; height: 0; margin: -90px 0 80px 0;}
.contact-image {width: 33.333%; float: left;}
.contact-image img {margin-bottom: 16px; width: 100%; height: auto;}
.contact-image .button {display: block; text-decoration: none; text-align: center; text-indent: 0;}
.contact-text {width: 66.6666%; float: left; padding-left: 40px;}

.layout-contacts {text-align: center; }
.contact {width: 25%; line-height: 2; display: inline-block; vertical-align: top; text-align: left;}
.contact a {display: block;}
.contact h3 {line-height: 1.2;}

/* ==========================================================================
  Newsletter
   ========================================================================== */
.page-newsletter-archive .page-header {margin-bottom: 0px;}

.newsletter:before {background-image: url('../../../wp-content/themes/bespoke/images/icon-newsletter.png');}
.newsletter:hover:before {background-image: url('../../../wp-content/themes/bespoke/images/icon-newsletter-hover.png');}

.pagination {text-align: center; margin-top: 40px; margin-bottom: 28px; color: #8C8C8C;}
.pagination a, .pagination span {width: 37px; height: 37px; line-height: 35px; margin: 0 2px; border: 1px solid #D9D9D9; display: inline-block; border-radius: 2px; }
.pagination ul {display: inline-block;}
.pagination li { list-style-type: none; display: inline-block; }
.pagination .current, .pagination a:hover {background: #492D42; color: #FFF; border-color: #492D42; }
.pagination .prev {margin-right: 62px;}
.pagination .next {margin-left: 62px;}

/* Single */
.newsletter-section {padding: 80px 0 40px 0; border-bottom: 1px solid #D9D9D9; }
.newsletter-section > p:first-of-type {margin-bottom: 32px; font-family: 'Source Sans Pro', sans-serif; font-size: 16px;}

/* Contents */
.newsletter-contents li {margin-bottom: 0;}

/* ==========================================================================
  Search
   ========================================================================== */
.layout-search {margin-top: -90px;}

/* ==========================================================================
  Footer
   ========================================================================== */
.footer { text-align: center; }
.footer-menu a {padding: 0 20px; display: inline-block; line-height: 90px;}
.footer-text { max-width: 1060px; padding: 0 20px; width: 100%; line-height: 1.8; color: #999999; margin: auto;}
.edinburgh-university {margin: 32px auto; display: inline-block;}

/* ==========================================================================
  404
   ========================================================================== */
.page-404 {text-align: center;}
.page-404 .button {margin-left: auto; margin-right: auto;}

/* ==========================================================================
  Media Queries
   ========================================================================== */
@media only screen and (max-width : 1400px) {
  /* Tuck in Page Header Title */
  .page-header.has-image h1  {left: 0;}
}

@media only screen and (max-width : 1050px) {
  /* Tuck in the menu */
  .menu a {padding: 0 12px;}
}



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

  /* Structure */
  body {font-size: 14px;}
  .container, .container-narrow, .container-medium {padding: 0 25px;}
  .container-medium {padding: 0 16px; margin-bottom: 40px;}
  .container-narrow {margin-bottom: 40px; }
  .layout {padding: 32px 0;}
  .col {width: 50%;}

  /* Typograhpy */
  .wysiwyg p:first-of-type {font-size: 18px;}
  .wysiwyg blockquote {padding-left: 16px;}
  .wysiwyg blockquote p:first-of-type {font-size: 14px;}
  p {margin-bottom: 12px;}
  .underline {font-size: 16px; padding-bottom: 16px; margin-bottom: 16px;}
  .underline:after {width: 80px;}
  .f-24 {font-size: 16px;}
  .f-18 {font-size: 14px;}
  .wysiwyg li {margin-bottom: 12px;}
  .wysiwyg ul {margin-bottom: 12px;}
  .wysiwyg h2 { margin-bottom: 12px;  margin-top: 26px;}
  .button.alt {padding: 0 20px;}

  /* Header */
  .header {height: 80px;}
  .logo {width: 227px; margin: 20px 0;}
  .logo img {width: 100%;}
  .search {display: none;}
  .toggle-menu {width: 40px; height: 40px; position: absolute; top:20px; right: 20px; bottom: 20px; display: inline-block; }
  .toggle-menu:before, .toggle-menu:after {content: ''; position: absolute; width: 24px; left: 8px; display: block; top:0; bottom: 0; margin: auto;}
  .toggle-menu:before {height: 13px; border-top:1px solid #482b42; border-bottom: 1px solid #482b42; }
  .toggle-menu:after {height: 1px;  background: #482b42;}
  .close-menu {width: 60px; height: 60px; position: absolute; top:0; right: 0; background-image:url('../../../wp-content/themes/bespoke/images/icon-close.svg'); background-size:15px 15px; background-position: center center; background-repeat: no-repeat; display: block; }

  /* Menu */
  .menu {position: fixed; top: 0; left: auto; bottom: 0; background: #482b42; color: #FFF; max-width: 240px; width: 100%; text-align: center; line-height: 40px; -webkit-transform: translateX(100%); transform: translateX(100%); padding: 50px 0; z-index: 2; -webkit-transition: all 0.5s cubic-bezier(.77,0,.175,1); transition: all 0.5s cubic-bezier(.77,0,.175,1);}
  .menu li, .menu a {display: block; padding: 0;}
  .menu li.has-submenu:after {display: none;}
  .menu:after { content: ''; width: 40px; height: 40px; bottom: 40px; left: 0; right: 0; margin: auto; background-image: url('../../../wp-content/themes/bespoke/images/logo-marque.svg'); background-repeat: no-repeat; position: absolute; display: block;}
  .submenu {    display: block; background: transparent; -webkit-transform: none;  transform: none; position: static; font-family: 'Crimson Text', serif; text-transform: none; line-height: 30px; font-weight: normal; margin-bottom: 10px; }
  .submenu a:hover {background: transparent;}
  .menu-about-us .submenu {display: none !important;}
  .show-menu .menu {-webkit-transform: translateX(0%); transform: translateX(0%);}


  /* Page Header */
  .page-header {margin-bottom: 30px;}
  .page-header, .page-header .container {min-height: 46px;}
  .page-header.has-image {margin-bottom: 55px;}
  .page-header.has-image .slideshow {padding-top: 16px;}
  .page-header.has-image h1 {left: 0; bottom: 25px;}
  .page-header.has-image img {margin-top: 16px; margin-bottom: -25px;}
  .page-header h1 {font-size: 24px; margin: 16px auto auto -25px; line-height: 31px; max-width: 80%;}
  .page-header h1 span {padding-left: 25px; padding-right: 25px;}
  .page-header h3 {display: none;}
  .page-header.has-image .slideshow {margin-bottom: -25px;}

  /* Breadcrumb */
  .breadcrumb {line-height: 40px; padding: 0; margin-bottom: -16px; font-size: 12px;}
  .page-next {display: none;}

  /* Home */
  .page-home .col {width: 50%;}
  .page-home .layout-resources .button {margin-top: 12px;}
  .layout-twitter-newsletter {padding: 40px 0;}
  .newsletter-feed .card { padding-left: 80px; min-height: 70px; }
  .newsletter-feed .card:after {left: 12px;}

  /* Topics */
  .topic-image {margin: 0 -16px 20px -16px;}
  .topic {padding: 0 16px 32px 16px;}

  /* Resources */
  .layout-resources {padding-bottom: 40px;}
  .card {padding: 16px 16px 32px 16px;}
  .card:before {top:16px; left: 16px; width: 56px; height: 78px; bottom: auto;}
  .card:after {width: 32px; height: 32px; top:78px; left:28px; right: auto; bottom: auto; font-size: 32px; }
  .resource {padding-top: 120px;}
  .resource h3 {width: auto; float: none;}
  .resource-type {position: absolute; top:16px; right: 16px; font-size: 12px; /* line-height: 26px; border-radius: 13px; */ margin-left: 10px; margin-right: 0;}

  /* Newsletter */
  .newsletter {padding-top: 120px;}

  /* Newsletter Single */
  .newsletter-contents li {margin-bottom: 0;}
  .newsletter-section > p:first-of-type {font-size: 14px;}

  /* Page Links */
  .layout-page-links {padding: 16px;}
  .layout-page-links a {line-height: 56px; padding: 0 24px; }
  .layout-page-links a:after {width: 32px; height: 32px; font-size: 32px; right: 16px; line-height: 32px;}

  /* Who We Are */
  .person {margin-left: 0; padding: 32px 0;}
  .person img {position: static; float: left; margin-right: 16px; margin-bottom: 16px; width: 80px; }
  .person p {clear: both;}
  .person a {display: block; padding-right: 0;}

  /* Partner */
  .layout-networks .grid {margin: 0;}
  .partner {width: 100%; margin: 0 0 16px 0;}

  /* Resources */
  .layout-resources h3 {margin-top: 32px;}
  .layout-resources h3:first-of-type {margin-top: 0;}
  .resources-filter {background: #FFF; position: fixed; top:0; bottom: 0; left: 0; max-width: 320px; overflow: scroll; -webkit-overflow-scrolling: touch; -webkit-transform: translateX(-100%); transform: translateX(-100%); z-index: 3; -webkit-transition: all 0.5s cubic-bezier(.77,0,.175,1); transition: all 0.5s cubic-bezier(.77,0,.175,1); margin: 0;}
  .filter {width: 100%; border-bottom: 1px solid #D9D5D8; position: relative;     overflow: hidden;}
  .filter label {text-indent: 16px;}
  .filter label:after {visibility: hidden;}
  .filter label:before {right: 16px;}
  .filter:hover label:after {visibility: visible;}
  .filter:hover .dropdown, .filter.open .dropdown, .filter:hover, .filter.open {box-shadow: none;}
  .filter.open .dropdown, .filter:hover .dropdown  {height: auto;}
  .filter-label {text-indent: 16px; background: #482C42; color: #FFF; border-bottom: 0; }
  .dropdown {padding: 0 16px; position: static; height: 0; box-shadow: none;}
  .dropdown a { padding: 14px 0; line-height: normal;}
  .dropdown a:last-of-type { border-bottom:0; }
  .dropdown-tags {text-align: left;}
  .dropdown-tags a {margin: 0; padding: 0 20px 20px 0; }
  .dropdown-tags a:after {display: none; }
  .resources-search {display: block; margin-bottom: 20px;}
  .button.toggle-filter {margin-bottom: 20px; margin-left: auto; margin-right: auto;}
  .mobile-filter {text-align: center; display: block;}
  .show-filter .resources-filter {-webkit-transform: translateX(0); transform: translateX(0); }
  .mask-filter {opacity: 0; visibility: hidden; position: fixed; top:0; bottom: 0; left: 0; right: 0; background-color: #000; background-color:rgba(0,0,0,0.5); cursor: pointer;  -webkit-transition: all 0.5s cubic-bezier(.77,0,.175,1); transition: all 0.5s cubic-bezier(.77,0,.175,1); z-index: 2; }
  .show-filter .mask-filter {opacity: 1; visibility: visible;}

  /* Events */
  .layout-events {padding-top: 16px;}
  .layout-events .container-narrow {padding: 0 16px;}
  .event-text {padding: 27px 16px 51px 16px;}
  .event-text:after {bottom: 16px; right: 16px; top:auto; width: 32px; height: 32px; font-size: 32px;}

  /* Projects */
  .layout-projects {padding-top: 16px;}
  .layout-events .container-narrow {padding: 0 16px;}
  .project {padding: 0;}
  .project-text {padding: 27px 16px 31px 16px;}
  .project-image {position: static; width: 100%; padding-top: 66.666666666667%; }

  /* Single */
  .sideline {display: none;}
  .meta {padding-top: 8px; margin-top: 17px; margin-bottom: -8px;}
  .meta label {display: block; width: 100%; text-indent: 0; line-height: 42px;}
  .meta > div {margin-bottom: 0;}

  /* Tabs */
  .tab-links {overflow: auto; white-space: nowrap; line-height: 44px; margin-bottom: 20px;}
  .tab-links a {width: 33.333%;}
  .tab-links a span {display: none;}

  /* Contact */
  .contact-map {margin-top: -30px; margin-bottom: 40px; padding-top: 50%;}
  .contact {width: 100%; float: none; margin-bottom: 16px;}
  .contact a { margin-top: -4px;}
  .contact-image {display: none;}
  .contact-text {width: 100%; float: none; padding: 0;}

  /* Footer */
  .footer-menu {display: none;}
  .footer-text {padding: 32px 32px 0 32px;}
  .edinburgh-university {width: 161px; height: auto; margin-top: 12px;}
}

@media only screen and (min-width : 667px) and (max-width : 910px) {
  /* Make Projects two columns */
  .layout-projects {clear: both; overflow: auto;}
  .project {width: 50%; float: left;}
  .project:nth-child(odd) {border-right: 8px solid #F9F9F9; clear: left;}
  .project:nth-child(even) {border-left: 8px solid #F9F9F9; }


  /* Make Parnters two columns */
  .layout-partners {clear: both; overflow: auto;}
  .partner {width: 50%; float: left; margin-bottom: 8px;}
  .partner:nth-child(odd) {border-right: 8px solid #F9F9F9; clear: left;}
  .partner:nth-child(even) {border-left: 8px solid #F9F9F9; }

  /* Make Contact two Columns */
  .contact {width: 50%; float:left;}
  .contact:nth-child(odd) { clear: left;}

}

@media only screen and (max-width : 667px)  {
  /* Newsletter */
  form fieldset {width: 100%;}
  form fieldset:nth-child(odd), form fieldset:nth-child(even) {padding: 0;}


  /* Homepage */
  .twitter-feed, .newsletter-feed {width: auto; float: none;}
  .twitter-feed {margin-bottom: 80px;}

  /* Tuck In Pagination */
  .pagination .prev {margin-right: 2px;}
  .pagination .next {margin-left: 2px;}

}

@media only screen and (max-height : 600px)  {
  /* Hide the logo on the small menu */
  .menu:after {display: none;}

}

@media only print {
  .header {height: auto; }
  .logo {width: 200px;}
  .container, .container-narrow, .container-medium {max-width: none; padding: 0;}
  .menu, .search, .slideshow, .pagination, .page-next {display: none;}
  .page-header {border-bottom: 1px solid #150710; margin-bottom: 40px;}
  .page-header, .page-header h1 {background: transparent; color: #150710;}
  .page-header h1  {margin: 0; line-height: normal;}
  .page-header h1 span {background: transparent; padding: 0;}
  .page-header h3 {padding:0; margin: 0; color: #150710;}
  .breadcrumb {margin: 0; padding: 0; line-height: normal;}
  p { margin-bottom: 18px;}
  .footer-menu {display: none;}

  .newsletter-section {padding: 40px 0;}
  .resource {padding: 40px; }
  .card:before, .card:after {display: none;}
}

/* ==========================================================================
  Cross Browser
   ========================================================================== */
.browserupgrade {padding: 10px; position: fixed; bottom: 0; left:0; right:0; font-size: 13px; text-align: center; color: #000; background-color: #FFF;}
.browserupgrade a {color: #000; text-decoration: underline;}

/* ==========================================================================
  Slick Slider
   ========================================================================== */
.slick-slider{position:relative;display:block;-moz-box-sizing:border-box;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-khtml-user-select:none;-ms-touch-action:pan-y;touch-action:pan-y;-webkit-tap-highlight-color:transparent}.slick-list{position:relative;display:block;overflow:hidden;margin:0;padding:0}.slick-list:focus{outline:none}.slick-list.dragging{cursor:pointer;cursor:hand}.slick-slider .slick-track,.slick-slider .slick-list{-webkit-transform:translate3d(0, 0, 0);-moz-transform:translate3d(0, 0, 0);-ms-transform:translate3d(0, 0, 0);-o-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}.slick-track{position:relative;top:0;left:0;display:block}.slick-track:before,.slick-track:after{display:table;content:''}.slick-track:after{clear:both}.slick-loading .slick-track{visibility:hidden}.slick-slide{display:none;float:left;height:100%;min-height:1px}[dir='rtl'] .slick-slide{float:right}.slick-slide img{display:block}.slick-slide.slick-loading img{display:none}.slick-slide.dragging img{pointer-events:none}.slick-initialized .slick-slide{display:block}.slick-loading .slick-slide{visibility:hidden}.slick-vertical .slick-slide{display:block;height:auto;border:1px solid transparent}.slick-arrow.slick-hidden{display:none}

/* ==========================================================================
  Slick Slider
   ========================================================================== */
table {
  line-height: 1.6;
  border-spacing: 1px;
}
table tr {
  vertical-align: top;
}
table tr td {
  padding: 3px 5px;
  border-bottom: 1px dotted #482b4242;
}
table tr:last-child td {
  border-bottom: none;
}