/* ==========================================================================
   STYLES SPECIFIC TO THE OMBUDSMAN'S PAGES
========================================================================== */
body {
  color: #454545;
  font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 400;
  line-height: 1.45;
  letter-spacing: -0.35px;
  font-size: 1.6rem;
}
#page-content-x p {
  margin: 0 0 0.8rem;
  line-height: 1.6;
}
/* HEADERS */
h1, #page-content-x h2, #page-content-x h3, #page-content-x h4, #page-content-x h5, #page-content-x h6 {
  font-family: "Roboto Condensed", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
  font-weight: 700;
  letter-spacing: -1px;
}
h2 {
  font-size: 3.2rem;
  color: #000000;
  letter-spacing: -0.77px;
  line-height: 1;
  padding-top: 70px;
  margin-top: -70px;
  margin-bottom: 20px;
}
h3 {
  font-size: 2.7rem;
  letter-spacing: -0.77px;
  line-height: 1.05;
  margin-top: 1.6rem;
  margin-bottom: 1rem;
  color: #454545;
  padding-bottom: 0;
  padding-top: 1rem;
}
h3::after {
  content: '';
  display: block;
  margin-left: 1px;
  margin-top: 1.75rem;
  border-top: #009CA8 /*66a2c7*/ solid 2px;
  width: 15%;
}
h4 {
  font-size: 2.2rem;
  color: #222222;
  letter-spacing: -0.5px;
  line-height: 1.05;
  padding-top: 1rem;
  margin-bottom: 1.4rem;
}
h4::before {
  content: "\F141";
  font-size: 1.8rem;
  font-family: "FontAwesome";
  margin-left: 1.4rem;
  margin-top: 1.6rem;
  margin-right: 1rem;
  color: #E45471;
}
h5 {
  font-size: 1.9rem;
  color: #222222;
  letter-spacing: 0.1px;
  line-height: 1.05;
  margin-top: 0.6rem;
  margin-bottom: 0.75rem;
  font-weight: 500;
  margin-left: 30px;
}
/* LISTS */
#page-content-x ul {
  list-style: none;
}
#page-content-x ul, #page-content-x ol, #page-content-x dl {
  margin-top: 0;
  margin-bottom: 0.8rem;
}
#page-content-x ul li, #page-content-x dt, #page-content-x dd {
  list-style-image: none;
  list-style-type: none;
  margin-left: 0;
  margin: 0 0 0.8rem;
  line-height: 1.6;
}
#page-content-x ul li::before {
  font-size: 0.6rem;
  font-family: "FontAwesome" !important;
  content: "\f111";
  float: left;
  margin-left: -1.2rem;
  margin-right: 0;
  padding-top: 0.75rem;
  color: #F7941D /* pink? #E45471*/ ;
}
#page-content-x dt::before {
  content: url("/en/ombudsman/assets/img/icons/arrows.png");
  margin-right: 1rem;
}
#page-content-x dd {
  margin-left: 2.45rem;
}
/* LINKS */
#page-content-x a:link, #page-content-x a:visited {
  color: #000000;
  text-decoration: none !important;
  border-bottom: dotted 0.1rem #333333;
}
#page-content-x a:hover, #page-content-x a:focus {
  color: #23527c;
  text-decoration: none !important;
  border-bottom: solid 0.1rem #23527c;
}
#page-content-x h3 a, #page-content-x h4 a {
  border-bottom: none !important;
}
.main-title a { /*Applied to headers to remove the underline*/
  text-decoration: none !important;
}
/* GENERIC CLASSES */
.clear {
  clear: both;
}
.right {
  float: right;
  padding-left: 20px;
}
.left {
  float: left !important;
  padding-right: 20px;
}
.section {
  margin-top: 40px;
}
/* PHOTO & PHOTO CAPTIONS */
figure {
  margin-bottom: 15px;
  margin-left: 15px;
  background-color: #f2f2f2;
  /*background-color: rgba(0, 156, 168, 0.1); teal*/
  /*background-color: rgba(102, 162, 199, 0.1); light blue*/
  border-bottom-right-radius: 25px;
  border-bottom-left-radius: 25px;
}
figure.roundcorners {
  border-radius: 25px;
}
figure.no-borders {
  border: none !important;
}
figure.no-deco {
  background: none !important;
  border: none !important;
}
figcaption {
  padding: 1rem;
  color: #454545;
  font-size: 1.17rem;
  letter-spacing: 0.04rem;
  line-height: 1.364rem;
}
.page-feature-image {
  float: right;
  width: 50%;
  margin-left: 2rem;
  border: 1.5px solid #f2f2f2;
}
.page-feature-image-left {
  float: left;
  width: 50%;
  margin-right: 2rem;
  margin-left: 0;
}
.photo-title {
  font-family: "Roboto Condensed", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 800;
  color: #454545;
  text-transform: uppercase;
  margin-right: 0.4rem;
  float: left;
  width: 9%;
  letter-spacing: 0.02rem;
}
.photo-title::before {
  content: '';
  margin-left: 0.1rem;
  margin-bottom: 1rem;
  padding-left: 0.4rem;
  border-left: #999999 solid 3px;
}
.photo-caption {
  padding-bottom: 1rem;
  padding-left: 1rem;
  width: 70%;
  float: left;
}
.photo-credit {
  padding-bottom: 1rem;
  padding-left: 1rem;
  width: 18%;
  float: right;
}
.photo-credit::before {
  content: "\f1f9";
  font-size: 1rem;
  font-family: "FontAwesome";
  margin-left: 0;
  margin-top: 1.4rem;
  margin-right: 0.4rem;
  color: #999999;
}
/* AREAS WITH BACKGROUND COLOR */
.tip-pink { /* gradient */
  border-radius: 15px 30px;
  background-image: linear-gradient(rgba(228, 84, 113, 0.25), rgba(228, 84, 113, 0.05));
  padding-left: 20px;
  padding-right: 20px;
  padding-top: 12px;
  padding-bottom: 12px;
  box-shadow: 2px 4px #E45471;
}
.unoms-blue90 {
  /*background-color: #66a2c7;*/
  background-color: rgba(102, 162, 199, 0.10);
}
.unoms-teal90 {
  /*background-color: #009ca8;*/
  background-color: rgba(0, 156, 168, 0.1);
}
.unoms-pink90 {
  /*background-color: #E45471;*/
  background-color: rgba(228, 84, 113, 0.1);
}
.unoms-lime90 {
  /*background-color: #a5c83a;*/
  background-color: rgba(165, 200, 58, 0.10);
}
.unoms-orange90 {
  /*background-color: #f7941d;*/
  background-color: rgba(247, 148, 29, 0.1);
}
.unoms-purple90 {
  /*background-color: #775c7f;*/
  background-color: rgba(119, 92, 127, 0.10);
}
.unoms-blue90, .unoms-teal90, .unoms-pink90, .unoms-lime90, .unoms-orange90, .unoms-purple90 {
  border-radius: 30px;
}
#page-content-x .moreinfo {
  clear: both;
  width: 25%;
  margin: 2rem auto;
  padding: 0.6rem 1.2rem;
  border: solid 1px #009ca8;
  border-radius: 30px;
  font-size: 1.4rem;
  text-align: center;
}
#page-content-x .moreinfo p::before {
  content: "\f101";
  font-size: 2rem;
  font-family: "FontAwesome";
  margin-left: 0;
  margin-top: 1.5rem;
  margin-right: 1rem;
  color: #009ca8;
}
/* BANNER & SITE HEADER */
.site-header /*applied to h1*/ {
  font-size: 1.6em;
  line-height: 0.9em;
  float: left;
  letter-spacing: 0.05em;
}
span.site-title /*applied to h1*/ {
  font-weight: 600;
}
.mainword /* For the word OMBUDSMAN in the header */ {
  font-size: 140%;
  font-weight: bolder;
	  line-height: 0.9em;
  letter-spacing: 0.15em !important;
		font-stretch:180%;
}
.lastline /* For the last line of the site header */ {
  font-size: 95%;
  font-stretch: semi-condensed;
	  letter-spacing: 0.03em !important;

}
/* TABLES */
table {
  width: 80%;
  margin: 15px auto;
  border: 1px #4d4d4d solid;
}
th {
  background-color: #4d4d4d;
  color: #f2f2f2;
  text-align: center;
}
/* RIGHT HAND-SIDE COLUMN WITH BG COLOR */
.highlights { /* Colorful box on the right-hand side of the main page*/
  border-radius: 15px 50px;
  background: rgba(0, 156, 168, 0.15);
  padding: 2rem;
}
img.smsquare /*Images inside the .highlights on the main page*/ {
  width: 25%;
  float: right;
  padding: 4px;
}
/* ROLLOVER EFFECT OVER IMAGES AND TITLES/TEXT */
.main-section { /*Used to create a rollover effect over images*/
  position: relative;
}
.main-section-image {
  opacity: 1;
  display: block;
  width: 100%;
  height: auto;
  transition: .5s ease;
  backface-visibility: hidden;
  border: 1.5px solid #f2f2f2;
}
.main-section:hover .main-section-image { /*Used to create a rollover effect over images*/
  opacity: 0.3;
}
.main-section:hover /*.view-more*/ { /*Used to create a rollover effect over images*/
  opacity: 1;
}
/* QUOTES */
blockquote {
  margin: 0;
  max-width: 90%;
  min-height: 75px;
  margin-left: auto;
  margin-right: auto;
  border-left: none !important;
}
blockquote p {
  padding-left: 75px;
  padding-right: 75px;
  font-size: 1.6rem;
  line-height: 2.6rem;
}
blockquote p::before, blockquote p::after {
  font-size: 3rem;
  font-family: "FontAwesome" !important;
  margin-left: 1.4rem;
  margin-right: 1.4rem;
  color: #F7941D;
}
blockquote p::before {
  content: "\f10d";
}
blockquote p::after {
  content: "\f10e";
}
p.attribution {
  font-style: italic;
  text-align: right !important;
  background-image: none !important;
}
blockquote p.attribution::before, blockquote p.attribution::after {
  content: ""
}
/* Dos & Donts for the Ombudsman and Mediation pages */
#page-content-x ul.dos, #page-content-x ul.donts {
  margin-left: 0;
  padding-left: 0;
}
#page-content-x ul.dos li, #page-content-x ul.donts li {
  clear: left;
}
#page-content-x ul.dos li::before, #page-content-x ul.donts li::before {
  font-size: 2rem;
  padding-top: 0;
  margin-top: -0.3rem;
}
#page-content-x ul.dos li::before {
  content: "\f00c";
  color: #A5C83A;
}
#page-content-x ul.donts li::before {
  content: "\f00d";
  color: #F7941D;
  padding-top: 0;
}
/* ADDITIONS TO THE MENU */
.sub-sub-nav ul {
  display: inline-block;
  vertical-align: top;
  margin: 0 1em;
  padding: 0;
}
.sub-sub-nav li {
  display: block;
  list-style-type: none;
  margin: 0;
  padding: 0;
  margin: 3px 0px;
  font-size: 95%;
}
.sub-sub-nav li a {
  color: #fff;
  text-decoration: none;
  /*padding: 3px;*/
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
.sub-sub-nav li a:hover, .sub-sub-nav li a:focus {
  text-decoration: underline;
  /*margin-left: 5px;
  margin-right: -5px;*/
  color: #fff;
}
@media (min-width: 768px) {}
@media (max-width: 660px) {
  .site-header-sm {
    width: 130% !important;
    font-size: 1em !important;
    margin-top: 0px !important;
  }
}
@media (min-width: 769px) {
  .sub-nav {
    position: absolute;
  }
  .nav-menu {
    display: block;
  }
  button.menu-link {
    display: none;
  }
}
@media (max-width: 768px) {
  .sub-nav {
    position: inherit;
  }
  .nav-menu {
    display: none;
  }
  .menu-active {
    display: block;
  }
  #page-content img {
    float: left;
  }
  .un-social-media {
    z-index: 1;
  }
  .sm-padding {
    margin: auto;
    width: 86%;
    padding-left: 0%;
  }
}