/**
 * EMODE CSS overrides
 */

@import url('https://fonts.googleapis.com/css?family=Patua+One&display=swap');
@import url('https://fonts.googleapis.com/css?family=PT+Sans:400,400i,700,700i|Patua+One&display=swap');


body {
 font-family: 'PT Sans', sans-serif;
 font-weight: 400;
 font-size: 12px;
 line-height: 1.2;
 color: #000;
 margin: 0;
 padding: 0;
}
@media screen and (min-width: 768px) {
 body {
  font-size: 14px;
 }
}
@media screen and (min-width: 1080px) {
 body {
  font-size: 15px;
 }
}
@media screen and (min-width: 1366px) {
 body {
  font-size: 16px;
 }
}


/* Transitions */
a,
button,
img,
::before,
::after {
 transition:color 0.3s ease,background-color 0.3s ease,border-color 0.3s ease,opacity 0.3s ease;
 -webkit-transition:color 0.3s ease,background-color 0.3s ease,border-color 0.3s ease,opacity 0.3s ease;
}


/* Headings */
h1, h2, h3, h4 {
 font-family: 'Patua One', sans-serif;
}
h1,
.page-header {
 font-size: 3.75em;
 border: none;
 margin: 0 0 0.8333em 0;
 padding: 0;
}
h2 {
 font-size: 2.625em;
 margin: 1em 0 0.5em;
}
.field--name-body > h2:first-child,
.section h2:first-child {
 margin-top: 0;
}
h3 {
 font-size: 1.5em;
 margin: 0.9em 0;
}
h4 {
 font-size: 1.1875em;
 margin: 1.2em 0;
}

/* Paragraphs */
p {
 margin-bottom: 1.2em;
}
article p {
 font-size: 1.125em;
}

/* Bold */
strong {
 font-family: 'Patua One', sans-serif;
 font-weight: normal;
}

/* Links */
a {
 font-family: 'Patua One', sans-serif;
 color: #00abc0;
 text-decoration: none;
}
a:hover,
a:focus,
a:active {
 color: #00cbcb;
 text-decoration: none;
}
a:hover img,
a:focus img,
a:active img {
 opacity: 0.6667;
}
a:not([href]) {
 font-family: inherit;
 color: inherit;
}
/* External links */
span.ext {
 background: none;
 padding: 0;
}
span.ext::before {
 font-family: "FontAwesome";
 content: '\f08e';
 font-size: 0.75em;
 padding-left: 0.25em;
}
/* Mailto links */
span.mailto {
 display: none;
}

/* Images */
img {
 max-width: 100%;
 height: auto;
}
img.align-right,
img.img-right,
img.align-left,
img.img-left {
 display: block;
 float: none;
 margin: 1em auto;
 }
@media screen and (min-width: 1024px) {
img.align-right,
img.img-right,
img.align-left,
img.img-left {
 max-width: calc(5 / 12 * 100%);
}
 img.align-right,
 img.img-right {
  float: right;
  margin: 1em 0 1em 2em;
 }
 img.align-left,
 img.img-left {
  float: left;
  margin: 1em 2em 1em 0;
 }
}

/* Larger text */
.larger {
 font-size: 120%;
}

/* Strikethrough */
s {
 background: #FF0;
}

/* Horizontal Rule (used as clearer) */
hr {
 border: none;
 clear: both;
}

/* Lists */
.region-content ul:not(.pagination):not(.contextual-links) {
 font-size: 1.5em;
 text-align: left;
 margin: 1em auto 1.5em;
 padding-left: 0;
}
.region-content ul:not(.pagination):not(.contextual-links) li {
 list-style: none;
 list-style-image: none;
 text-indent: -1.5em;
 padding-left: 1.5em;
 margin-bottom: 1em;
}
.region-content ul:not(.pagination):not(.contextual-links) li::before {
 content: url(/sites/default/files/images/template/bullet.png);
 float: left;
 width: 1.5em;
 height: 1em;
 margin-top: 0.1em;
}
.region-content ul:not(.pagination):not(.contextual-links) ul {
 font-size: 1em;
}
ol {
 text-align: left;
 margin: 1em auto 2em;
}
ol.headed-list {
 counter-reset: counter;
 padding-left: 0;
}
ol.headed-list li {
 list-style: none;
 counter-increment: counter;
 padding-left: 2.25em;
 overflow: hidden; /* clear floats */
}
ol.headed-list li h2,
ol.headed-list li h3 {
 font-size: 2.25em;
 text-indent: -1em;
 margin-bottom: 0.333em;
}
ol.headed-list li h2::before,
ol.headed-list li h3::before {
 content: counter(counter) ". ";
 float: left;
 width: 1em;
}

/* Tables */
table {
 margin: 1em 0 1.75em;
}
th,
thead th,
tbody th {
 font-family: 'Patua One', sans-serif;
 font-size: 1.125em;
 font-weight: normal;
 color: #000;
 border-bottom: 1px solid #000;
 text-align: left;
 vertical-align: top;
 padding: 0.444em;
}
tr {
 border-bottom: 1px solid #e1e1e1;
}
td {
 vertical-align: top;
 padding: 0.5em;
}
th h2, th h3, td h2, td h3 {
 margin-top: 0;
}
td img {
 display: block;
}

/* Difficulty levels (text) */
span.Easy,
h2.Easy,
.difficulty .Easy strong {
 font-family: 'Patua One', sans-serif;
 color: #fbbf2c;
 color: #7aa200;
 color: #ca8700;
 color: #ca8700;
}
span.Moderate,
h2.Moderate,
.difficulty .Moderate strong {
 font-family: 'Patua One', sans-serif;
 color: #ff8e00;
 color: #bc8d00;
 color: #f56b00;
 color: #ef7000;
 color: #ec6c00;
}
span.Difficult,
h2.Difficult,
.difficulty .Difficult strong {
 font-family: 'Patua One', sans-serif;
 color: #e55000;
 color: #fb6400;
 color: #ff4000;
 color: #f23d00;
}
span.Extreme,
h2.Extreme,
.difficulty .Extreme strong {
 font-family: 'Patua One', sans-serif;
 color: #f0272f;
 color: #cc0000;
 color: #ff0027;
 color: #ec0027;
}

/* Forms */
.form-group {
 margin-bottom: 2em;
}
.form-inline .form-group {
 display: inline;
}
label {
 margin-bottom: 0.25em;
 font-weight: 500;
 font-family: 'Patua One', sans-serif;
 font-size: 1.5em;
}
.form-required::after { /* asterisk */
 background-size: 0.25em;
 height: 0.25em;
 width: 0.25em;
 margin-left: 0.1em;
}
.btn,
.form-control {
 font-size: 1.125em;
 line-height: 1;
 color: #000;
 background: #f2f2f2;
 border: none;
 border-radius: 0.333em;
 box-shadow: none;
 width: auto;
 height: auto;
 padding: 0.6667em;
}
.form-control {
 width: 100%;
 max-width: 33.333em;
 margin-left: auto;
 margin-right: auto;
}
@media screen and (min-width: 768px) {
 .form-control {
  margin-left: 0;
 }
}
.btn {
 font-family: 'Patua One', sans-serif;
 font-size: 1.25em;
 color: #fff;
 background: #000;
 text-decoration: none;
 padding: 0.6667em 1em;
}
.btn:hover,
.btn:focus,
.btn.focus {
 color: #fff;
 background: #00abc0;
}
.form-control:focus {
 border: none;
 box-shadow: none;
}

/* Pagination */
.pagination > li > a, 
.pagination > li > span {
 color: #fff;
 background-color: #000;
 border: 1px solid #000;
 padding: 0.375em 0.75em;
}
.pagination > li > a:hover,
.pagination > li > span:hover,
.pagination > li > a:focus,
.pagination > li > span:focus,
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
 color: #fff;
 background-color: #00abc0;
 border-color: #00abc0;
}


/* 
 * Containers & Grids 
 */
#navbar,
.region-footer,
.main-container .row,
.main-container .section {
 padding-left: 3%;
 padding-right: 3%;
}
.main-container .section {
 overflow: hidden; /* clear floats */
}
#navbar,
.region-footer,
.main-container .row,
.main-container .row .region-header,
.main-container .row > section,
.main-container .row > aside,
.main-container .section:not(.full-width) {
 max-width: calc(1500px + 3%);
 margin: auto;
}
@media screen and (min-width: 1280px) {
 #navbar,
 .region-footer,
 .main-container .row .region-header,
 .main-container .row > section,
 .main-container .row > aside,
 .main-container .section:not(.full-width) {
  max-width: calc(1500px + 6%);
  padding-left: 3%;
  padding-right: 3%;
 }
 .main-container .row {
  max-width: calc(1500px + 12%);
  padding-left: 6%;
  padding-right: 6%;
 }
 .main-container .section:not(.full-width) {
  padding-left: 9%;
  padding-right: 9%;
 }
}
.container-fluid,
.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, 
.col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, 
.col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, 
.col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, 
.col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, 
.col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, 
.col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, 
.col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, 
.col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, 
.col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, 
.col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, 
.col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
 float: none;
 width: auto;
 padding: 0;
}
@media screen and (min-width: 1024px) {
.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, 
.col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, 
.col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, 
.col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, 
.col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, 
.col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, 
.col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, 
.col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, 
.col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, 
.col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, 
.col-xs-11, .col-sm-11, .col-md-11, .col-lg-11 {
  float: left;
 }
 .col-sm-1 {width: calc(1 / 12 * 100%); max-width: calc(1 / 12 * 1500px);}
 .col-sm-2 {width: calc(2 / 12 * 100%); max-width: calc(2 / 12 * 1500px);}
 .col-sm-3 {width: calc(3 / 12 * 100%); max-width: calc(3 / 12 * 1500px);}
 .col-sm-4 {width: calc(4 / 12 * 100%); max-width: calc(4 / 12 * 1500px);}
 .col-sm-5 {width: calc(5 / 12 * 100%); max-width: calc(5 / 12 * 1500px);}
 .col-sm-6 {width: calc(6 / 12 * 100%); max-width: calc(6 / 12 * 1500px);}
 .col-sm-7 {width: calc(7 / 12 * 100%); max-width: calc(7 / 12 * 1500px);}
 .col-sm-8 {width: calc(8 / 12 * 100%); max-width: calc(8 / 12 * 1500px);}
 .col-sm-9 {width: calc(9 / 12 * 100%); max-width: calc(9 / 12 * 1500px);}
 .col-sm-10 {width: calc(10 / 12 * 100%); max-width: calc(10 / 12 * 1500px);}
 .col-sm-11 {width: calc(11 / 12 * 100%); max-width: calc(11 / 12 * 1500px);}
}
.section.full-width .col-sm-1,
.section.full-width .col-sm-2,
.section.full-width .col-sm-3,
.section.full-width .col-sm-4,
.section.full-width .col-sm-5,
.section.full-width .col-sm-6,
.section.full-width .col-sm-7,
.section.full-width .col-sm-8,
.section.full-width .col-sm-9,
.section.full-width .col-sm-10,
.section.full-width .col-sm-11,
.section.full-width .col-sm-12 {
 text-align: center;
 float: none;
 margin: 0 auto;
}


/* 
 * Header
 */
#navbar {
 background: #fff;
 border: none;
 padding-top: 1.5em;
}
.navbar-header {
 float: none;
}

/* Logo */
.navbar .logo {
 max-width: 13.375em;
 margin: 0 0 0 -0.625em;
 position: relative;
 z-index: 497;
}

/* Main menu */
.nav-main {
 font-family: 'Patua One', sans-serif;
 float: right;
 width: auto;
}
@media screen and (min-width: 768px) {
 .nav-main {
  margin-right: -1em;
 }
}
@media screen and (min-width: 1280px) {
 .nav-main {
  margin-top: 2.6875em;
 }
}
.nav-main a,
.nav-main a.menuparent:hover,
.nav-main a.menuparent:focus,
.nav-main a.menuparent:active,
.nav-main .sfHover > a.menuparent {
 color:#000;
 text-decoration: none;
}
.nav-main a:hover,
.nav-main a:focus,
.nav-main a:active,
.nav-main a.is-active,
.nav-main .active-trail > a.sf-depth-1.menuparent {
 color: #999 !important;
 text-decoration: none;
}
.nav-main ul.menu > li > a {
 font-size: 1.5em;
 padding: 0.5em 0.6em;
}
@media screen and (min-width: 1500px) {
 .nav-main ul.menu > li > a {
  padding: 0.5em 0.8333em;
 }
}
/* Main menu level 2+ */
.nav-main ul.menu:not(.sf-accordion) ul {
 background: rgba(255,255,255,0.85);
 box-shadow: 0px 6px 5px 0px rgba(0,0,0,0.1);
 padding: 0.5em 0 0.75em;
}
.nav-main ul.menu ul a {
 font-size: 1.125em;
 padding: 0.25em 1.111em;
}
/* Accordion menu */
.nav-main ul.sf-accordion, 
.nav-main ul.sf-accordion ul, 
.nav-main ul.sf-accordion li {
 float: none;
}
.nav-main .sf-accordion-toggle {
 position: absolute;
 right: calc(3% - 0.6em);
 top: 1.8em;
 z-index: 1000;
}
.nav-main .sf-accordion-toggle a {
 font-size: 1.5em;
 padding: 0.5em 0.6em;
}
.nav-main .sf-accordion-toggle a.sf-expanded {
 color: #fff;
}
.nav-main ul.sf-menu.sf-accordion.sf-expanded {
 background: rgba(0,0,0,0.9);
 position: absolute !important;
 right: 0;
 top: 0 !important;
 width: 25em;
 height: 100vh;
 padding: 4.8em 1em 0; /* pad top to accommodate toggle */
}
.nav-main ul.sf-menu.sf-accordion.sf-expanded a,
.nav-main ul.sf-menu.sf-accordion.sf-expanded a.menuparent:hover,
.nav-main ul.sf-menu.sf-accordion.sf-expanded a.menuparent:focus,
.nav-main ul.sf-menu.sf-accordion.sf-expanded a.menuparent:active,
.nav-main ul.sf-menu.sf-accordion.sf-expanded .sfHover > a.menuparent {
 color:#fff;
}
/* Accordion menu level 2+ */
.nav-main ul.sf-menu.sf-accordion li.sf-expanded > ul {
 padding: 0 1em 1em;
}

/* Header swash */
.header-swash {
 width: calc(100% + 6.6667%);
 margin-left: -1.6667%;
}



/* 
 * Main content
 */
.main-container {
 min-height: 45em;
 padding-top: 4em;
 padding-bottom: 1em;
}
.region-header,
.region-content {
 text-align: center;
}
.region-content {
  padding-bottom: 3em;
}
@media screen and (min-width: 768px) {
 .region-header,
 .region-content {
  text-align: left;
 }
}


/* 
 * Footer
 */
.footer {
 background: none;
 border: none;
 margin: 0;
 padding: 0 0 2.5em;
}
/* 'Also in this section' menu */
.nav-secondary {
 background: url(/sites/default/files/images/template/nav-secondary-bg.png) no-repeat center top;
 background-size: 187.5em;
 text-align: center;
 padding: 4em 0;
 margin: 0 0 4em 0;
 display: none; /* hide on mobiles */
}
@media screen and (min-width: 768px) {
 .nav-secondary {
  display: block;
 }
}
.page-title-pet-score-calculator.page-animal-category .nav-secondary,
.page-title-pet-score-calculator.page-step-2 .nav-secondary, 
.page-question .nav-secondary { /* hide on EMODE calculator pages with buttons */
 display: none;
}
.nav-secondary h2.block-title {
 font-size: 2.25em;
 margin-top: 0;
}
.nav-secondary ul.menu {
 display: inline-block;
 margin: 0 3%;
}
.nav-secondary ul.menu ul {
 font-size: 1.25em;
 background: #000;
 border-radius: 0.5em;
 display: flex;
 flex-wrap: wrap;
 justify-content: center;
 margin: 0 auto;
 padding: 0.75em 1.75em;
 position: static;
}
#block-main-3 ul.menu li a {
 display: none;
}
#block-main-3 ul.menu li li a {
 display: block;
}
.nav-secondary ul.menu li a {
 color: #fff;
 text-decoration: none;
 padding: 0.75em;
}
.nav-secondary ul.menu li a:hover,
.nav-secondary ul.menu li a:focus,
.nav-secondary ul.menu li a:active,
.nav-secondary ul.menu li a.is-active {
 color: #999;
}
/* Footer menu, copyright & image credit */
.nav-footer {
 float: left;
 margin-left: -0.625em;
}
.menu--footer > li {
 display: inline-block;
}
.menu--footer > li > a {
 font-family: 'Patua One', sans-serif;
 color: #000;
 text-decoration: none;
 float: left;
 padding: 0.5em 0.625em;
}
.menu--footer > li > a:hover,
.menu--footer > li > a:focus,
.menu--footer > li > a:active,
.menu--footer > li > a.is-active {
 color: #999;
 background: none;
}
.footer .copyright,
.footer .image-credit {
 float: right;
 clear: right;
}
.footer .copyright {
 margin-bottom: 0.25em;
}
.footer .image-credit a {
 color: #999;
}
.footer .image-credit a:hover,
.footer .image-credit a:focus,
.footer .image-credit a:active {
 color: #aaa;
}


/* 
 * Home page
 */
@media screen and (max-width: 1023px){
 .path-frontpage .region-header,
 .path-frontpage .region-content {
  text-align: center;
 }
}
.path-frontpage h1.page-header {
 display: none;
}
.path-frontpage .region-content p {
 font-size: 1.125em;
}
.path-frontpage .main-container .btn {
 font-size: 2em;
 background-image: url(/sites/default/files/images/template/button-arrow.png);
 background-repeat: no-repeat;
 background-position: 95% center;
 margin-bottom: 1em;
 padding: 0.5556em 2.2222em 0.5556em 0.5556em;
}
.path-frontpage .callout.medium {
 margin: 5em auto 0;
 text-align: left;
}
.path-frontpage .callout.medium img {
 width: 13.312em;
 position: absolute;
 top: -3.5em;
 right: 1em;
}
/* Sidebar 'quotes' */
.quote.home1 .quote-text {
 border: 20px solid #fff;
 float: right;
 width: 21.25em;
 padding-left: 2.5em;
 padding-right: 2.5em;
}
.quote.home1 p {
 color: #995929;
}
.quote.home1 img {
 width: 16.9375em;
}
.quote.home2 {
 margin: 0 auto;
 top: -4em;
}
.quote.home2 .quote-text {
 border: 1.25em solid #fff;
 float: left;
 width: 22.8125em;
 padding: 3em 2em 4.5em;
 position:relative;
}
.quote.home2 .quote-text::after { /* addresses Edge/IE border radius bug */
 content: '';
 width: 23.0625em;
 height: 23.0625em;
 border: 1.25em solid #fff;
 border-radius: 50%;
 position: absolute;
 top: -1.375em;
 left: -1.375em;
}
.quote.home2 h3 {
 color: #e8792e;
}
.quote.home2 img {
 width: 19.0625em;
}
@media screen and (min-width: 1024px) {
 .path-frontpage .main-container {
  background: url(/sites/default/files/images/template/home-bg.png) no-repeat center top;
  background-size: 187.5em;
 }
 .path-frontpage .region-content {
  padding-left: 18%;
  padding-right: 3%;
 }
 .path-frontpage h1 {
 margin-bottom: 0.333em;
}
 .path-frontpage h1 .tab {
  margin-left: 10%;
 }
 .path-frontpage h1 .tab2 {
  margin-left: 17.75%;
 }
 .path-frontpage .main-container .btn {
  margin: 1.111em 0 1.333em 18%;
 }
 .quote.home1 {
  float: right;
 }
 .quote.home2 {
  float: left;
 }
}
@media screen and (min-width: 1200px) {
 .path-frontpage .region-content {
  padding-left: 25%;
  padding-right: 5%;
 }
 .path-frontpage h1 .tab {
  margin-left: 14%;
 }
 .path-frontpage h1 .tab2 {
  margin-left: 24.5%;
 }
 .path-frontpage .main-container .btn {
  margin-left: 25%;
 }
}
@media screen and (min-width: 1280px) {
 .path-frontpage .region-content {
  padding-left: 20%;
  padding-right: 3%;
 }
}
@media screen and (min-width: 1400px) {
 .path-frontpage .region-content {
  padding-left: 25%;
  padding-right: 0%;
 }
}
@media screen and (min-width: 1500px) {
 .path-frontpage .region-content {
  padding-left: 30%;
 }
}
@media screen and (min-width: 1600px) {
 .path-frontpage .region-content {
  padding-left: 35%;
 }
}


/*
 * 'What is EMODE' section
 */
/* 'What is EMODE' page */
.page-title-what-is-emode .main-container .row,
.page-title-what-is-emode .main-container .row > section {
 max-width: 100%;
 padding: 0;
}
.page-title-what-is-emode .main-container .row .region-header {
 padding-left: 3%;
 padding-right: 3%;
}
@media screen and (min-width: 1280px) {
 .page-title-what-is-emode .main-container .row .region-header {
  padding-left: 9%;
  padding-right: 9%;
 }
}
.page-title-what-is-emode h2 {
 font-size: 3em;
 margin-bottom: 0.45em;
}
.page-title-what-is-emode .section.full-width {
 background: #f2f2f2 url(/sites/default/files/images/template/difficulties-bg.png) no-repeat center top;
 min-height: 31.375em;
 margin: 2em 0;
 padding-top: 5em;
 padding-bottom: 5em;
}
.page-title-what-is-emode .section.full-width h2, 
.page-title-what-is-emode .section.full-width h3 {
 margin: 0;
}
.page-title-what-is-emode .difficulties {
 font-size: 75%;
 display: flex;
 justify-content: space-around;
 margin: 2.75em 0;
 position: relative;
}
@media screen and (min-width: 640px) {
 .page-title-what-is-emode .difficulties {
  font-size: 100%;
 }
}
.page-title-what-is-emode .difficulties:before {
 border-top: 1px dashed #000;
 content: ' ';
 width: 90%;
 position: absolute;
 top: 50%;
}
.page-title-what-is-emode .difficulties .difficulty {
 background: #f2f2f2;
 padding: 0 1em;
 position: relative;
}
.page-title-what-is-emode .difficulties .difficulty h3 {
 font-size: 2.25em;
}
.page-title-what-is-emode .quote.bottom {
 margin-top: 5em;
 padding-bottom: 12.75em;
}
.page-title-what-is-emode .quote .quote-text {
 width: 25em;
 padding: 3.25em 3.75em 5em;
}
.page-title-what-is-emode .quote .quote-text h3 {
 color: #eadf0c;
}
.page-title-what-is-emode .quote img {
 width: 15.0555em;
}


/*
 * 'Get your pet score' section (common styles)
 */
 
/* Image credits */
.region-content .image-credit {
 color: #aaa;
}
.region-content .image-credit a {
 color: #999;
 text-decoration: none;
}
.region-content .image-credit::before { 
 font-family: "FontAwesome";
 content: '\f030';
 padding-right: 0.1em;
}
.region-content .image-credit-prefix { 
 position: absolute;
 width: 1px;
 height: 1px;
 padding: 0;
 margin: -1px;
 overflow: hidden;
 clip: rect(0,0,0,0);
 border: 0;
}
.region-content .image-credit-value:hover {
 color: #aaa;
}


/* 
 * 'Get your pet score' (search) pages
 */
.page-title-get-your-pet-score .region-header,
.page-title-get-your-pet-score .region-content {
 text-align: center;
}
@media screen and (min-width: 1024px) {
 .page-title-get-your-pet-score .main-container {
  background: url(/sites/default/files/images/template/get-your-pet-score-bg.png) no-repeat center top;
  background-size: 137.5em;
 }
}
.page-title-get-your-pet-score .row {
 max-width: 56.25em;
 padding-left: 3%;
 padding-right: 3%;
}
.page-title-get-your-pet-score .view-calculator-score .view-header,
.page-title-get-your-pet-score .view-calculator-score .view-empty {
 font-size: 1.5em;
 max-width: 25em;
 margin: 0 auto 1.2em;
}
/* Search form */
.page-title-get-your-pet-score #views-exposed-form-calculator-score-page-1 {
 background: #f2f2f2;
 border-radius: 0.5em;
 max-width: 30em;
 margin: 0 auto;
}
.page-title-get-your-pet-score .view-calculator-score label {
 display: none;
}
.page-title-get-your-pet-score .view-calculator-score input {
 font-family: 'Patua One', sans-serif;
 font-size: 1.875em;
 float: left;
 width: 85%;
}
.page-title-get-your-pet-score button#edit-submit-calculator-score {
 position: relative;
 margin: 0.5em 0.5em 0.5em -0.5em;
 width: 15%;
}
.page-title-get-your-pet-score button#edit-submit-calculator-score:after {
 content: url(/sites/default/files/images/template/search-button.png);
 background: #f2f2f2;
 width: 100%;
 height: 100%;
 position: absolute;
 top: 0;
 left: 0;
}
/* Search results - results */
.page-title-get-your-pet-score .view-calculator-score .view-content {
 display: flex;
 flex-wrap: wrap;
 justify-content: space-around;
}
.page-title-get-your-pet-score .view-calculator-score .views-row {
 max-width: 14em;
 padding: 0 0.5em 1.125em;
}
.page-title-get-your-pet-score .view-calculator-score img {
 object-fit: cover;
 border-radius: 50%;
 width: 12.5em;
 height: 12.5em;
 margin: auto;
}
.page-title-get-your-pet-score .view-calculator-score .common-name {
 font-size: 1.75em;
 line-height: 1;
 margin-top: 0.25em;
 margin-bottom: 0.125em;
}
.page-title-get-your-pet-score .view-calculator-score .latin-name {
 font-family: 'Patua One', sans-serif;
 margin-bottom: 0.25em;
}
.page-title-get-your-pet-score .view-calculator-score .image-credit { 
 font-size: 0.875em;
}
.page-title-get-your-pet-score .view-calculator-score .image-credit::before { 
 font-size: 0.857em;
}


/*
 * Pet Score calculator pages
 */
/* Calculator section defaults */
.page-title-pet-score-calculator:not(.page-question) .region-header,
.page-title-pet-score-calculator:not(.page-question) .region-content {
 text-align: center;
}
.page-title-pet-score-calculator .main-container .row,
.page-title-pet-score-calculator .main-container .row > section {
 max-width: 100%;
 padding: 0;
}
/* Calculator next/back buttons */
.page-title-pet-score-calculator .main-container #edit-actions {
 font-family: 'Patua One', sans-serif;
 text-align: center;
 background: url(/sites/default/files/images/template/EMODE-calculator-buttons-bg.png) no-repeat center center;
 background-size: 187.5em;
 min-height: 20em;
 padding-top: 5em;
 margin: 2em 0;
}
.page-title-pet-score-calculator .main-container #edit-actions .btn {
 display: block;
 margin: 0 auto;
}
.page-title-pet-score-calculator .main-container .webform-button--next,
.page-title-pet-score-calculator .main-container .webform-button--submit {
 font-size: 2.25em;
 padding: 0.5556em 2.2222em 0.5556em 0.5556em;
 background-image: url(/sites/default/files/images/template/button-arrow.png);
 background-repeat: no-repeat;
 background-position: 95% center;
}
.page-title-pet-score-calculator .main-container .webform-button--previous {
 font-size: 1.125em;
 color: #00abc0;
 background: none;
 padding: 0;
 position: relative; top: 6.5em; /* position below next button */
}
.page-title-pet-score-calculator .main-container .webform-button--previous:hover {
 color: #00cbcb;
}
/* 'Step 1' and 'Step 2' */
.page-title-pet-score-calculator #edit-markup h2,
.page-title-pet-score-calculator #edit-step-2-intro h2 {
 font-size: 3.75em;
 color: #fff;
 background: #000;
 border-radius: 50%;
 max-width: 4.5em;
 margin: 0 auto 0.5em;
 padding: 0.5em 0.825em;
}
/* Step 1 pages 1 & 2 */
.page-title-pet-score-calculator.page-start .row,
.page-title-pet-score-calculator.page-animal-category #edit-animal-category {
 max-width: 64em;
 margin-left: auto;
 margin-right: auto;
 padding: 0 3%
}
.page-title-pet-score-calculator.page-start .main-container,
.page-title-pet-score-calculator.page-animal-category .main-container {
 background: url(/sites/default/files/images/template/EMODE-calculator-step-1-bg.png) no-repeat center top;
 background-size: 187.5em;
}
.page-title-pet-score-calculator.page-start #edit-step-1-intro p,
.page-title-pet-score-calculator.page-start #edit-markup p {
 font-size: 1.5em;
}
/* Step 1 page 1 */
.page-title-pet-score-calculator.page-start .main-container h1.page-header {
 display: block; /* override for editors */
}
.page-title-pet-score-calculator.page-start #edit-step-1-intro {
 margin-bottom: 1.875em;
}
.page-title-pet-score-calculator.page-start legend {
 border: none;
 margin: 0;
}
.page-title-pet-score-calculator.page-start #edit-category {
 font-family: unset;
 font-size: unset;
 display: flex;
 margin-left: 0;
}
.page-title-pet-score-calculator.page-start #edit-category .form-item-category {
 float: none;
 margin: 0;
 position: relative;
}
.page-title-pet-score-calculator.page-start #edit-category {
 justify-content: space-around;
}
.page-title-pet-score-calculator.page-start #edit-category .webform-options-display-buttons-wrapper {
 flex: auto;
 width: 17.1875em;
 margin: 0 auto;
}
.page-title-pet-score-calculator.page-start #edit-category label {
 font-family: 'PT Sans', sans-serif;
 font-size: inherit;
 color: inherit;
 background: none;
 border: none;
 vertical-align: top;
 padding: 10em 0 0;
}
.page-title-pet-score-calculator.page-start #edit-category label .webform-options-display-buttons-title {
 font-family: 'Patua One', sans-serif;
 font-size: 2em;
}
.page-title-pet-score-calculator.page-start #edit-category label .webform-options-display-buttons-description {
 font-size: 1.125em;
}
.page-title-pet-score-calculator.page-start #edit-category img {
 position: absolute;
 top: 0;
 left: 50%;
 -webkit-transform: translateX(-50%);
 transform: translateX(-50%);
 z-index: -1;
 max-width: 21.222em;
}
/* Step 1 page 2 */
.page-title-pet-score-calculator.page-animal-category #edit-graph-intro,
.page-title-pet-score-calculator.page-animal-category #edit-animal-category p {
 font-size: 1.5em;
 margin: 0 2em 1em;
}
#difficulty-graph {
 font-size: 1.5em;
 text-align: center;
 width: 100%;
 margin: 1em auto 2em;
}
#difficulty-graph th {
 width: 25%;
 border-right: 1px solid #fff;
 color: #000;
}
#difficulty-graph th, 
#difficulty-graph td {
 text-align: center;
 border-bottom: 1px solid #fff;
 padding: 0.4em 0;
}
#difficulty-graph tr {
 border: none;
}
#difficulty-graph td:not(.category) {
 width: 2.5%;
}
#difficulty-graph td.category {
 background: #ccc;
 border-right: 1px solid #fff;
}
#difficulty-graph th.Easy {
 background: #ffbf00;
}
#difficulty-graph th.Moderate {
 background: #ff8b00;
}
#difficulty-graph th.Difficult {
 background: #ff5500;
}
#difficulty-graph th.Extreme {
 background: #ff0015;
}
#edit-invertebrates-graph #difficulty-graph td.invertebrates,
#edit-fishes-graph #difficulty-graph td.fishes { /* Easy to Extreme */
 font-family: 'Patua One', sans-serif;
 color: #000;
 background: #ffbf00; /* Old browsers */
 background: -moz-linear-gradient(left,  #ffbf00 0%, #ff8b00 28%, #ff5500 56%, #ff0015 85%); /* FF3.6-15 */
 background: -webkit-linear-gradient(left,  #ffbf00 0%,#ff8b00 28%,#ff5500 56%,#ff0015 85%); /* Chrome10-25,Safari5.1-6 */
 background: linear-gradient(to right,  #ffbf00 0%,#ff8b00 28%,#ff5500 56%,#ff0015 85%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffbf00', endColorstr='#ff0015',GradientType=1 ); /* IE6-9 */
}
#edit-semi-domesticated-animals-graph #difficulty-graph td.semi-domesticated-animals { /* Easy to Extreme */
 font-family: 'Patua One', sans-serif;
 color: #000;
 background: #ffbf00; /* Old browsers */
 background: -moz-linear-gradient(left,  #ffbf00 0%, #ff8b00 17%, #ff5500 50%, #ff0015 83%); /* FF3.6-15 */
 background: -webkit-linear-gradient(left,  #ffbf00 0%,#ff8b00 17%,#ff5500 50%,#ff0015 83%); /* Chrome10-25,Safari5.1-6 */
 background: linear-gradient(to right,  #ffbf00 0%,#ff8b00 17%,#ff5500 50%,#ff0015 83%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffbf00', endColorstr='#ff0015',GradientType=1 ); /* IE6-9 */
}
#edit-amphibians-graph #difficulty-graph td.amphibians,
#edit-reptiles-graph #difficulty-graph td.reptiles,
#edit-birds-graph #difficulty-graph td.birds,
#edit-unusual-mammals-graph #difficulty-graph td.unusual-mammals { /* Moderate to Extreme */
 font-family: 'Patua One', sans-serif;
 color: #000;
 background: #ff8b00; /* Old browsers */
 background: -moz-linear-gradient(left,  #ff8b00 0%, #ff5500 29%, #ff5500 29%, #ff0015 76%); /* FF3.6-15 */
 background: -webkit-linear-gradient(left,  #ff8b00 0%,#ff5500 29%,#ff5500 29%,#ff0015 76%); /* Chrome10-25,Safari5.1-6 */
 background: linear-gradient(to right,  #ff8b00 0%,#ff5500 29%,#ff5500 29%,#ff0015 76%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff8b00', endColorstr='#ff0015',GradientType=1 ); /* IE6-9 */
}
#edit-primates-graph #difficulty-graph td.primates { /* Difficult to Extreme */
 font-family: 'Patua One', sans-serif;
 color: #000;
 background: #ff5500; /* Old browsers */
 background: -moz-linear-gradient(left,  #ff5500 25%, #ff0015 75%); /* FF3.6-15 */
 background: -webkit-linear-gradient(left,  #ff5500 25%,#ff0015 75%); /* Chrome10-25,Safari5.1-6 */
 background: linear-gradient(to right,  #ff5500 25%,#ff0015 75%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff5500', endColorstr='#ff0015',GradientType=1 ); /* IE6-9 */
}
#edit-dogs-and-cats-graph #difficulty-graph td.dogs-and-cats { /* Easy to Difficult */
 font-family: 'Patua One', sans-serif;
 color: #000;
 background: #ffbf00; /* Old browsers */
 background: -moz-linear-gradient(left,  #ffbf00 0%, #ff8b00 33%, #ff5500 67%, #ff5500 67%); /* FF3.6-15 */
 background: -webkit-linear-gradient(left,  #ffbf00 0%,#ff8b00 33%,#ff5500 67%,#ff5500 67%); /* Chrome10-25,Safari5.1-6 */
 background: linear-gradient(to right,  #ffbf00 0%,#ff8b00 33%,#ff5500 67%,#ff5500 67%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffbf00', endColorstr='#ff5500',GradientType=1 ); /* IE6-9 */
}
.page-title-pet-score-calculator.page-animal-category #edit-animal-category .difficulty-level {
 font-family: 'Patua One', sans-serif;
 margin-bottom: 0.5em;
}
.page-title-pet-score-calculator.page-animal-category #edit-animal-category .difficulty-level span {
 font-size: 2em;
 padding: 0 0.1em;
 display: block;
}
@media screen and (min-width: 440px) {
 .page-title-pet-score-calculator.page-animal-category #edit-animal-category .difficulty-level span {
  display: inline;
 }
}
.page-title-pet-score-calculator.page-animal-category #edit-animal-category .more-details {
 font-size: 1.125em;
 margin-bottom: 2em;
}
.page-title-pet-score-calculator.page-animal-category #edit-health-warning {
 text-align: left;
 background: #f2f2f2 url(/sites/default/files/images/template/warning.png) no-repeat 1.5em 1.75em;
 background-size: 5em;
 border-radius: 1em;
 padding: 1.75em 2em 2em 8em;
 margin: 2em 0;
}
.page-title-pet-score-calculator.page-animal-category #edit-health-warning h2 {
 font-size: 1.5em;
 margin: 0 0 0.25em 0;
}
.page-title-pet-score-calculator.page-animal-category #edit-health-warning p {
 font-size: 1.125em;
 font-style: italic;
 margin: 0;
}
@media screen and (min-width: 768px) {
 .page-title-pet-score-calculator.page-animal-category #edit-health-warning {
  background-position: 2em 1.75em;
  background-size: 8.4375em;
  padding-left: 12.5em;
 }
}


/* Step 2 */
@media screen and (min-width: 1024px) {
 .page-title-pet-score-calculator.page-step-2 .main-container {
  background: url(/sites/default/files/images/template/EMODE-calculator-step-2-bg.png) no-repeat center top;
  background-size: 187.5em; 
 }
}
.page-title-pet-score-calculator.page-step-2 #edit-step-2 {
 max-width: 46.5em;
 margin-left: auto;
 margin-right: auto;
 padding: 0 3%;
}
.page-title-pet-score-calculator.page-step-2 .main-container p {
 text-align: left;
}
.page-title-pet-score-calculator.page-step-2 .main-container p.intro {
 font-size: 1.5em;
 text-align: center;
 max-width: 21em;
 margin: 0 auto 2em;
}
.page-title-pet-score-calculator.page-step-2 .main-container ul {
 font-size: 1.5em;
 max-width: 15.417em;
 margin: 1.5em auto;
}
/* Step 2 questions */
.page-question .main-container {
 text-align: left;
}
.page-question .main-container h1.page-header { /* Hide 'EMODE Calculator' heading */
 display: none;
}
#edit-sensitivity,
#edit-lifespan,
#edit-diet,
#edit-habitat,
#edit-threat-physical,
#edit-threat-health {
 max-width: 1500px;
 background-size: 40.625em;
 background-repeat: no-repeat;
 background-position: center bottom;
 min-height: 43em;
 margin: auto;
 padding-left: 6%;
 padding-right: 6%;
 padding-bottom: 43em;
}
#edit-sensitivity {
 background-image: url(/sites/default/files/images/calculator-questions/sensitivity.png);
 padding-bottom: 43em;
}
#edit-lifespan {
 background-image: url(/sites/default/files/images/calculator-questions/lifespan.png);
 padding-bottom: 38em;
}
#edit-diet {
 background-image: url(/sites/default/files/images/calculator-questions/diet.png);
 padding-bottom: 38em;
}
#edit-habitat {
 background-image: url(/sites/default/files/images/calculator-questions/habitat.png);
 padding-bottom: 36em;
}
#edit-threat-physical {
 background-image: url(/sites/default/files/images/calculator-questions/threat-physical.png);
 padding-bottom: 37em;
}
#edit-threat-health {
 background-image: url(/sites/default/files/images/calculator-questions/threat-health.png);
 padding-bottom: 22.5em;
}
#edit-threat-health #edit-markup-01 {
 color: #ec0027;
 font-size: 1.5em;
}
@media screen and (min-width: 1024px) {
 #edit-sensitivity,
 #edit-diet,
 #edit-threat-physical {
  padding-right: 47em;
  padding-bottom: 0;
  background-position: 94% top;
 }
 #edit-lifespan,
 #edit-habitat,
 #edit-threat-health {
  padding-left: 47em;
  padding-bottom: 0;
  background-position: 6% top; 
 }
}
.page-question legend { /* question number/heading */
 font-family: 'Patua One', sans-serif;
 font-size: 3.75em;
 color: #000;
 border: none;
}
.page-question legend .form-required:after { /* hide asterisk */
 display: none;
}
.page-question fieldset .fieldset-wrapper .field-prefix .description {
 font-size: 1.5em;
}
.page-question fieldset .fieldset-wrapper .js-webform-radios { /* radio buttons */
 display: inline-block;
}
@media screen and (min-width: 768px) {
 .page-question fieldset .fieldset-wrapper .js-webform-radios {
  margin-left: 12%;
 }
}
.page-question fieldset .fieldset-wrapper .js-webform-radios .form-type-radio {
 float: left;
 margin: 2.25em 2.25em 2.25em 0;
}
.page-question fieldset .fieldset-wrapper .js-webform-radios .form-type-radio label {
 font-family: 'Patua One', sans-serif; 
 font-size: 2.25em;
 padding-left: 1.25em;
}
.page-question fieldset .fieldset-wrapper .js-webform-radios .form-type-radio input {
 left: 0.3em;
 top: 0.4em;
 margin: 0;
}
.page-question fieldset .fieldset-wrapper .js-webform-radios .form-type-radio span { /* custom radio button */
 content: ' ';
 background: #fff;
 border: 0.1388em #ccc solid;
 border-radius: 50%;
 width: 1em;
 height: 1em;
 position: absolute;
 top: 0.1em;
 left: 0;
 z-index: 2;
}
.page-question fieldset .fieldset-wrapper .js-webform-radios .form-type-radio input:checked ~ span {
 background-color: #00abc0;
 border-color: #00abc0;
}
.page-question .form-type-webform-markup { /* question 'info' */
 font-size: 1.125em;
}


/*
 * 'Your Pet Score' (results) pages
 */
@media screen and (max-width: 1023px) {
 .page-title-your-pet-score .region-header,
 .page-title-your-pet-score .region-content {
  text-align: center;
 }
}
.page-title-your-pet-score .main-container .row,
.page-title-your-pet-score .main-container .row > section {
 max-width: 100%;
 padding: 0;
}
.page-title-your-pet-score .main-container .row .region-header {
 text-align: center; 
}
.page-title-your-pet-score .region-header h1 {
 margin-bottom: 0.5em;
}
.page-title-your-pet-score h2 {
 font-size: 3em;
}
.page-title-your-pet-score .results-header,
.page-title-your-pet-score .results-footer {
 max-width: 1500px;
 margin: auto;
 display: table;
}
.page-title-your-pet-score .animal-details,
.page-title-your-pet-score .difficulty,
.page-title-your-pet-score .whats-next,
.page-title-your-pet-score .quote {
  padding-left: 3%;
  padding-right: 3%;
}
@media screen and (min-width: 1024px) {
 .page-title-your-pet-score .main-container .row .region-header {
  text-align: left;
  padding: 0;
 }
 .page-title-your-pet-score .region-header h1 {
  padding: 0 9% 0 45%;
 }
 .page-title-your-pet-score .animal-details,
 .page-title-your-pet-score .difficulty,
 .page-title-your-pet-score .whats-next,
 .page-title-your-pet-score .quote {
  float: left;
 }
 .page-title-your-pet-score .animal-details,
 .page-title-your-pet-score .quote {
  width: 45%;
  padding-left: 6%;
  padding-right: 6%;
 }
 .page-title-your-pet-score .difficulty,
 .page-title-your-pet-score .whats-next {
  width: 55%;
 }
 .page-title-your-pet-score .difficulty {
  padding-left: 0;
  padding-right: 6%;
 }
 .page-title-your-pet-score .whats-next {
  padding-left: 6%;
  padding-right: 0;
 }
}
.page-title-your-pet-score .results-footer {
 padding-top: 2em;
 padding-bottom: 2em;
}

/* Animal/Category Details section */
.page-title-your-pet-score .animal-details {
 text-align: center;
 background-size: 40.625em !important;
 padding-top: 2.8125em;
 padding-bottom: 2.8125em;
}
@media screen and (min-width: 1024px) {
.page-title-your-pet-score .animal-details {
 margin-top: -7em;
}
}
.page-title-your-pet-score .Easy .animal-details {
 background: url(/sites/default/files/images/levels/animal-img-bg-easy.png) no-repeat center top;
}
.page-title-your-pet-score .Easy-to-Moderate .animal-details {
 background: url(/sites/default/files/images/levels/animal-img-bg-easy-moderate.png) no-repeat center top;
}
.page-title-your-pet-score .Moderate .animal-details {
 background: url(/sites/default/files/images/levels/animal-img-bg-moderate.png) no-repeat center top;
}
.page-title-your-pet-score .Moderate-to-Difficult .animal-details {
 background: url(/sites/default/files/images/levels/animal-img-bg-moderate-difficult.png) no-repeat center top;
}
.page-title-your-pet-score .Difficult .animal-details {
 background: url(/sites/default/files/images/levels/animal-img-bg-difficult.png) no-repeat center top;
}
.page-title-your-pet-score .Difficult-to-Extreme .animal-details {
 background: url(/sites/default/files/images/levels/animal-img-bg-difficult-extreme.png) no-repeat center top;
}
.page-title-your-pet-score .Extreme .animal-details {
 background: url(/sites/default/files/images/levels/animal-img-bg-extreme.png) no-repeat center top;
}
.page-title-your-pet-score .animal-details img {
 width: 29.375em;
 object-fit: cover;
 border-radius: 50%;
 margin: auto;
}
.page-title-your-pet-score .animal-details .common-name {
 font-family: 'Patua One', sans-serif;
 font-size: 3em;
 margin-bottom: 0.125em;
}
.page-title-your-pet-score .animal-details .latin-name {
 font-family: 'Patua One', sans-serif;
 font-size: 1.5em;
 margin-bottom: 0.5em;
}
.page-title-your-pet-score .animal-details .image-credit { 
 font-size: 1.125em;
}

/* Difficulty Level section */
.page-title-your-pet-score .difficulty .intro {
 font-family: 'Patua One', sans-serif;
 font-size: 1.5em; 
}
.page-title-your-pet-score .difficulty h2.level {
 font-size: 2.25em;
 margin: 0.25em 0;
}
.page-title-your-pet-score .difficulty h2.level span {
 font-size: 1.333em;
 padding: 0 0.05em;
}
.page-title-your-pet-score .difficulty .description h3 {
 font-size: 2em;
 margin: 1.25em 0 0.25em;
}
.page-title-your-pet-score .difficulty .description h4 {
 font-size: 1.5em;
 margin: 0.5625em 0;
 font-family: inherit;
}
.page-title-your-pet-score .difficulty p {
 font-size: 1.125em;
 margin: 0 0 0.75em 0;
}
.page-title-your-pet-score .difficulty .public-health-heading {
 margin: 1.6667em 0 0.25em;
}
.page-title-your-pet-score .difficulty .public-health-body {
 margin-bottom: 0.25em;
}

/* Calculations section */
.page-title-your-pet-score .result-calculations {
 background: url(/sites/default/files/images/template/calculations-bg.png) no-repeat center top;
 background-size: 210em;
 padding: 5.5em 0;
}
.page-title-your-pet-score .calculations {
 text-align: center;
 max-width: 55.625em;
 margin: auto;
 padding: 0 3%;
}
.page-title-your-pet-score .calculations h2 {
 margin: 0;
}
.page-title-your-pet-score .calculations .category {
 font-family: 'Patua One', sans-serif;
 font-size: 1.25em;
 margin: 1em 0;
}
.page-title-your-pet-score .calculations h3 {
 margin: 0.2em 0;
}
.page-title-your-pet-score .calculations .questions {
 display: flex;
 flex-wrap: wrap;
}
.page-title-your-pet-score .calculations .questions a {
 width: 33.333%;
 margin-bottom: 1.5em;
 padding: 0 1.6667%;
}
.page-title-your-pet-score .calculations .question .title,
.page-title-your-pet-score .calculations .question .answer {
 font-family: 'Patua One', sans-serif;
 font-size: 1.125em;
}
.page-title-your-pet-score .calculations .question .answer {
 color: #000;
 max-width: 10em;
 margin: 0 auto;
}
.page-title-your-pet-score .calculations .question .summary {
 font-family: 'PT Sans', sans-serif;
 font-weight: normal;
 color: #000;
 margin-bottom: 0.375em;
}
.page-title-your-pet-score .calculations .total {
 font-family: 'Patua One', sans-serif;
 font-size: 2.25em;
 margin-bottom: 1.25em;
}
.page-title-your-pet-score .calculations .total .alternative-score {
 font-size: 0.6667em;
 display: block;
}
.page-title-your-pet-score .calculations #difficulty-graph {
 font-size: 1em;
 margin-bottom: 0.5em;
 max-width: 800px;
}
.page-title-your-pet-score .calculations #difficulty-graph td {
  padding: 0.525em 0;
}
.page-title-your-pet-score .calculations #difficulty-graph td:last-child {
 border-right: 1px solid #fff;
}
.page-title-your-pet-score .calculations #difficulty-graph td div {
 font-family: 'Patua One', sans-serif;
 border: none;
 display: flex;
 flex-wrap: nowrap;
 justify-content: center;
}
.page-title-your-pet-score .calculations #difficulty-graph td span {
 display: none; /* hide numbers (except first and last) */
}
.page-title-your-pet-score .calculations #difficulty-graph td span:first-child,
.page-title-your-pet-score .calculations #difficulty-graph td span:last-child {
 display: inline; /* show first and last numbers */
}
.page-title-your-pet-score .calculations #difficulty-graph td span:first-child:after {
 content: '. . .';
 white-space: nowrap;
 padding: 0 0.5em; 
}
.page-title-your-pet-score .calculations #difficulty-graph td.Easy {
 background: #ffbf00; /* Old browsers */
 background: -moz-linear-gradient(left, #ffbf00 0%, #FFA500 100%); /* FF3.6-15 */
 background: -webkit-linear-gradient(left, #ffbf00 0%, #FFA500 100%); /* Chrome10-25,Safari5.1-6 */
 background: linear-gradient(to right, #ffbf00 0%, #FFA500 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffbf00', endColorstr='#FFA500',GradientType=1 ); /* IE6-9 */
}
.page-title-your-pet-score .calculations #difficulty-graph td.Moderate {
 background: #ff8b00; /* Old browsers */
 background: -moz-linear-gradient(left, #FFA500 0%, #ff7000 100%); /* FF3.6-15 */
 background: -webkit-linear-gradient(left, #FFA500 0%, #ff7000 100%); /* Chrome10-25,Safari5.1-6 */
 background: linear-gradient(to right, #FFA500 0%, #ff7000 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFA500', endColorstr='#ff7000',GradientType=1 ); /* IE6-9 */
}
.page-title-your-pet-score .calculations #difficulty-graph td.Difficult {
 background: #ff5500; /* Old browsers */
 background: -moz-linear-gradient(left, #ff7000 0%, #FF2B0A 100%); /* FF3.6-15 */
 background: -webkit-linear-gradient(left, #ff7000 0%, #FF2B0A 100%); /* Chrome10-25,Safari5.1-6 */
 background: linear-gradient(to right, #ff7000 0%, #FF2B0A 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff7000', endColorstr='#FF2B0A',GradientType=1 ); /* IE6-9 */
}
.page-title-your-pet-score .calculations #difficulty-graph td.Extreme {
 background: #ff0015; /* Old browsers */
 background: -moz-linear-gradient(left, #FF2B0A 0%, #ff0015 100%); /* FF3.6-15 */
 background: -webkit-linear-gradient(left, #FF2B0A 0%, #ff0015 100%); /* Chrome10-25,Safari5.1-6 */
 background: linear-gradient(to right, #FF2B0A 0%, #ff0015 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FF2B0A', endColorstr='#ff0015',GradientType=1 ); /* IE6-9 */
}
@media screen and (min-width: 768px) {
  .page-title-your-pet-score .calculations #difficulty-graph td div {
    justify-content: space-around;
  }
  .page-title-your-pet-score .calculations #difficulty-graph td:last-child div {
    justify-content: left;
  }
  .page-title-your-pet-score .calculations #difficulty-graph td span {
    display: inline;
    width: 1.25em;
  }
  .page-title-your-pet-score .calculations #difficulty-graph td span:first-child:after {
    display: none; /* hide elipsis */
  }
  .page-title-your-pet-score .calculations #difficulty-graph td:last-child span:last-child {
    width: 1.75em;
  }
}

/* What's Next section */
.page-title-your-pet-score .whats-next h2 {
 margin-top: 0;
}
@media screen and (min-width: 1024px) {
 .page-title-your-pet-score .whats-next h2 {
  margin-right: 1.5em;
 }
}
.page-title-your-pet-score .whats-next p {
 font-size: 1.125em;
}
.page-title-your-pet-score .whats-next li {
 margin-right: 3em;
}

/* Quote section */
.page-title-your-pet-score .quote {
 margin-top: 6em;
}


/*
 * 'Resources' & 'News' overviews
 */
.page-title-resources .region-header,
.page-title-resources .region-content,
.page-title-news .region-header,
.page-title-news .region-content {
 text-align: center !important;
}
.page-title-news .main-container {
 background: url(/sites/default/files/images/template/EMODE-calculator-step-1-bg.png) no-repeat center top;
 background-size: 187.5em;
}
.page-title-resources .view-menu-children .view-content,
.page-title-news .view-frontpage .view-content {
 display: flex;
 flex-wrap: wrap;
 justify-content: center;
}
.page-title-resources .view-menu-children .views-row,
.page-title-news .view-frontpage .views-row {
 position: relative;
 width: 18.75em;
 padding-top: 18.75em;
 margin: 0 5% 3em;
}
.page-title-resources .view-menu-children .views-field-field-image img,
.page-title-news .view-frontpage .views-field-field-image img {
 object-fit: cover;
 border-radius: 50%;
 width: 18.75em;
 height: 18.75em;
 margin: auto;
 position: absolute;
 top: 0;
}
.page-title-resources .view-menu-children .views-field-title h2,
.page-title-news .view-frontpage .views-field-title a {
 font-size: 2.25em;
 text-decoration: none;
 display: block;
 margin: 0.5em 0 0.25em;
}
.page-title-resources .view-menu-children .views-field-body *,
.page-title-news .view-frontpage .views-field-body * {
 margin-bottom: 0.5em;
 padding: 0; /* centre lists */
}
.page-title-resources .view-menu-children .views-field-view-node a,
.page-title-news .view-frontpage .views-field-view-node a {
 font-size: 1.125em;
 text-decoration: none;
}


/*
 * 'FAQ' page
 */
.page-title-faq .region-content h2 {
 font-size: 2em;
}


/*
 * 'News' section
 */
.page-title-news .views-field-field-date,
.article time {
 font-style: italic;
 display: block;
 margin-bottom: 0.5em;
}
.article time {
 margin-bottom: 1.2em;
}


/* 
 * 'Contact us' page
 */
.page-title-contact-us .region-content .field--name-field-webform {
 margin-top: 2em;
}
.page-title-contact-us #edit-actions-submit {
 float: none !important;
 margin-bottom: 2em;
}
@media screen and (min-width: 768px) {
 .page-title-contact-us #edit-actions-submit {
  float: left !important;
 }
}


/*
 * Privacy policy page
 */
.page-title-privacy-policy .region-content ul {
 font-size: 1.125em;
}
.page-title-privacy-policy .region-content ul li {
 list-style: inside;
 margin-bottom: 0.5em;
}
.page-title-privacy-policy .region-content ul li::before {
 content: '';
}


/*
 * Sitemap
 */
.sitemap-box-menu h2 { /* hide 'Main' heading */
 display: none;
}
.region-content ul.sitemap-menu li {
 margin: 0.5em 0;
}
 

/* 
 * Case examples 
 */
.case-examples .views-field-field-image img {
 object-fit: cover;
 border-radius: 50%;
 width: 18.75em;
 height: 18.75em;
 margin: 0 auto 1em;
}
/* Main content list / slideshow */
.region-content .case-examples {
 margin: 1.5em 0;
}
.region-content .case-examples .views-row {
 margin: 3em 0;
}
.region-content .case-examples .views-field-field-attribution {
 font-family: 'Patua One', sans-serif;
 font-size: 2.25em;
 line-height: 1.1;
 margin: -0.25em 0 0.25em;
}
.region-content .case-examples .views-field-body {
 font-size: 1.125em;
}
@media screen and (min-width: 640px) {
 .region-content .case-examples .views-row {
  text-align: left;
  display: table;
  width: 100%;
 }
 .region-content .case-examples .views-field-field-image {
  float: left;
  margin-right: 2em;
 }
}
@media screen and (min-width: 1024px) {
 .region-content .case-examples .views-row {
  margin: 1.5em 0;
 }
 .region-content .case-examples .views-field-field-attribution {
  margin-top: 1em;
 }
}
/* Sidebar slideshow (unused) */
aside .case-examples {
 text-align: center;
}
aside .case-examples h2.block-title {
 margin: 0 0 0.25em;
}
aside .case-examples .views-field-field-attribution {
 font-family: 'Patua One', sans-serif;
 font-size: 1.5em;
 line-height: 1.1;
 margin-bottom: 0.25em;
}


/* 
 * Quotes
 */
.quote {
 width: 25em;
 margin: 0 auto;
 position: relative;
}
.quote .views-row,
.quote .quote-text {
 line-height: 1;
 color: #fff;
 background: #000;
 border-radius: 50%;
 text-align: center;
 width: 18.75em;
 padding: 4em 2em 3.5em;
}

/* Quotes view */
.quote .views_slideshow_cycle_teaser_section {
 margin: auto;
}
.quote .views-row {
 font-family: 'Patua One', sans-serif;
 font-size: 1.3125em;
 border: none;
 width: 17.143em;
}
.quote .views-field-field-attribution {
 color: #b3b3b3;
 margin-top: 0.5em;
}

.quote .quote-text h3 {
 margin: 0 0 0.5em 0;
}
.quote .quote-text p {
 font-size: 1.125em;
 margin-bottom: 0.5em;
}
.quote .quote-text strong  {
 font-family: inherit;
 font-weight: bold;
}
.quote img {
 position: absolute;
 z-index: 2;
}

.quote.light .quote-text {
 color: #000;
 background: #f2f2f2;
}
.quote.top {padding-top: 6.25em;}
.quote.bottom {padding-bottom: 8em;}
.quote.top img {top: 0;}
.quote.left img {left: 0;}
.quote.bottom img {bottom: 0;}
.quote.right img {right: 0;}


/* 
 * Callout boxes
 */
.callout {
 font-size: 100%;
 text-align: center;
 background: #f2f2f2;
 border-radius: 1em;
 padding: 2em 2em 1.25em;
 margin: 2em auto;
 position: relative;
}
.callout h3,
.callout p {
 margin-bottom: 0.75em
}
.callout h3:first-child {
 margin-top: 0;
}
.callout p {
 font-style: italic;
}
.callout strong {
 font-style: normal;
}
aside .callout,
.callout.small {
 max-width: 25em;
}
.callout.medium {
 max-width: 40em;
}
.callout.large {
 text-align: left;
}
@media screen and (min-width: 560px) {
 .callout.large {
  margin-left: 2em;
  margin-right: 2em;
 }
}
aside .callout:first-child {
 margin-top: 0;
}
aside .callout p {
 font-size: 1.125em;
}


/* 
 * Cookie banner
 */
div#sliding-popup, 
div#sliding-popup .eu-cookie-withdraw-banner, 
.eu-cookie-withdraw-tab {
 background: #000;
 opacity: 0.9;
}
.eu-cookie-compliance-message {
 margin-top: 0.75em;
}
.eu-cookie-compliance-message p {
 font-size: unset;
 font-weight: unset;
}
.eu-cookie-compliance-message a,
.eu-cookie-compliance-more-button {
 font-family: 'PT Sans', sans-serif;
 color: unset;
 text-decoration: underline;
}
.eu-cookie-compliance-message a:hover,
.eu-cookie-compliance-more-button:hover {
 text-decoration: none;
}
.eu-cookie-withdraw-tab {
 left: auto;
 border: none;
 right: 0;
}
.eu-cookie-compliance-secondary-button,
.disagree-button.eu-cookie-compliance-more-button, 
.eu-cookie-compliance-agree-button, 
.eu-cookie-compliance-default-button,
.eu-cookie-compliance-hide-button, 
.eu-cookie-compliance-more-button-thank-you, 
.eu-cookie-withdraw-button, 
.eu-cookie-compliance-save-preferences-button {
font-family: 'Patua One', sans-serif;
font-weight: normal;
color: #000;
text-decoration: none;
text-shadow: none;
vertical-align: middle;
background-color: #fff;
background-image: none;
border: none;
border-radius: 6px;
-moz-box-shadow: none;
-webkit-box-shadow: none;
box-shadow: none;
width: auto;
margin-right: 5px;
margin-top: 1em;
padding: 4px 8px;
overflow: visible;
}
.eu-cookie-compliance-secondary-button:hover,
.disagree-button.eu-cookie-compliance-more-button:hover, 
.eu-cookie-compliance-agree-button:hover, 
.eu-cookie-compliance-default-button:hover, 
.eu-cookie-compliance-hide-button:hover, 
.eu-cookie-compliance-more-button-thank-you:hover, 
.eu-cookie-withdraw-button:hover {
 color: #fff;
 background: #00abc0;
}
.eu-cookie-compliance-default-button { /* 'Decline' button */
color: #fff;
background: none;
margin-right: 0;
}
.eu-cookie-compliance-default-button:hover { /* 'Decline' button */
color: #00cbcb;
background: none;
}
.eu-cookie-compliance-message h1, 
.eu-cookie-compliance-message h2, 
.eu-cookie-compliance-message h3, 
.eu-cookie-compliance-message p {
 line-height: inherit;
}


/* 
 * Editors (logged in users)
 */
 
/* Pet Score calculator (animal entry) */
.user-logged-in.page-title-pet-score-calculator.page-start .main-container .row .region-header {
 text-align: center;
}
.user-logged-in.page-title-pet-score-calculator.page-start #edit-category {
 margin-bottom: 2em;
}
.user-logged-in.page-title-pet-score-calculator.page-start #edit-category input {
 width: auto;
 height: auto;
 clip: auto;
 top: 100%;
 left: 50%;
 margin-top: 0.5em;
}
.user-logged-in.page-title-pet-score-calculator.page-start #edit-category .webform-options-display-buttons-wrapper {
 margin-bottom: 2em;
}
.user-logged-in.page-title-pet-score-calculator.page-start #edit-health-warning---wrapper legend {
 font-size: 2em;
 margin-top: 1em;
}
.user-logged-in.page-title-pet-score-calculator.page-start #edit-health-warning- {
 margin: 0;
}
.user-logged-in.page-title-pet-score-calculator.page-start #edit-health-warning- .form-type-radio {
 margin-top: 1em;
 margin-bottom: 0;
}
.user-logged-in.page-title-pet-score-calculator.page-start #edit-health-warning- label {
 font-size: 1.5em;
}

/* Editing tabs */
.nav-tabs {
 margin-bottom: 2em;
}

/* Quick edit */
.modal {
 padding-top: 1em;
 z-index: 1050 !important;
}
.modal-body {
 overflow: visible !important;
}

#editor-link-dialog-form,
#linkit-editor-dialog-form {
 background: #fff;
 border-radius: 6px;
 max-width: 600px;
 margin: 0 auto;
 padding: 1em;
}
#editor-link-dialog-form button,
#linkit-editor-dialog-form button { 
/* show hidden Save button when link editor doesn't appear in modal dialog */
 width: auto !important;
 height: auto !important;
 padding: 0.333em 1em !important;
 margin: 0;
}
.modal-body #editor-link-dialog-form button,
.modal-body #linkit-editor-dialog-form button {
/* rehide duplicate Save button when link editor appears in modal dialog */
 width: 0 !important;
 height: 0 !important;
 padding: 0 !important;
 margin: 1em 0;
}

#editor-image-dialog-form .form-inline .radio label {
 margin-right: 0.25em;
}
#editor-image-dialog-form .form-inline .radio input[type="radio"] {
 margin-right: 0.25em;
 top: -0.15em;
}

.quickedit-editable,
.quickedit-field,
.callout .cke_widget_wrapper,
.quote .cke_widget_wrapper {
 position: static !important; /* maintain positioning of abs pos images when editing */
}