/*
Theme Name: Prater Raines
Theme URI: https://www.praterraines.co.uk
Author: Prater Raines Ltd
Description: Theme developed for Prater Raines Corporate Website
Version: 1.0.0
License: All Rights Reserved
Tags: responsive-layout
Text Domain: praterraines
*/

/** Core Styles **/

body {
  background: #fff;
  padding: 0;
  margin: 0;
  font-size: 1em;
  font-family: 'Raleway', sans-serif;
}
article,
aside,
details,
div,
figcaption,
figure,
footer,
header,
main,
menu,
nav,
section,
summary {
  display: block;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
}
audio,
canvas,
progress,
video {
  display: inline-block;
  vertical-align: baseline;
}
audio:not([controls]) {
  display: none;
  height: 0;
}
[hidden],
template {
  display: none;
}
abbr[title] {
  border-bottom: 1px dotted;
}
b,
strong {
  font-weight: 700;
}
small {
  font-size: 80%;
}
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sup {
  top: -0.5em;
}
sub {
  bottom: -0.25em;
}
img {
  border: 0;
  max-width: 100% !important;
  height: auto;
}
svg:not(:root) {
  overflow: hidden;
}
figure {
  margin: 0;
}
hr {
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}
code,
kbd,
pre,
samp {
  font-size: 1em;
}
button,
input,
optgroup,
select,
textarea {
  color: inherit;
  font: inherit;
  margin: 0;
}
select {
  text-transform: none;
}
button {
  overflow: visible;
}
button,
input,
select,
textarea {
  max-width: 100%;
}
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  cursor: pointer;
}
button[disabled],
html input[disabled] {
  cursor: default;
  opacity: .5;
}
button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}
input[type="checkbox"],
input[type="radio"] {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  margin-right: 0.4375em;
  padding: 0;
}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto;
}
input[type="search"] {
  -webkit-appearance: textfield;
}
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}
fieldset {
  border: 1px solid #d1d1d1;
  margin: 0 0 1.75em;
  padding: 0.875em;
}
fieldset > :last-child {
  margin-bottom: 0;
}
legend {
  border: 0;
  padding: 0;
}
textarea {
  overflow: auto;
  vertical-align: top;
}
optgroup {
  font-weight: bold;
}

body .syntaxhighlighter a, body .syntaxhighlighter div,
body .syntaxhighlighter code, body .syntaxhighlighter table,
body .syntaxhighlighter table td, body .syntaxhighlighter table tr,
body .syntaxhighlighter table tbody, body .syntaxhighlighter table thead,
body .syntaxhighlighter table caption, body .syntaxhighlighter textarea {
  line-height: 1.2em !important;
}

/** Alignments **/

.alignleft {
  float: left;
  margin: 0.75em 1.5em 1.5em 0;
}
.alignright {
  float: right;
  margin: 0.75em 0 1.5em 1.5em;
}
.aligncenter {
  clear: both;
  display: block;
  margin: 0 auto 1.5em;
}
blockquote.alignleft {
  margin: 0.75em 1.5em 1.5em 0;
}
blockquote.alignright {
  margin: 0.75em 0 1.5em 1.5em;
}
blockquote.aligncenter {
  margin-bottom: 1.5em;
}

/** Clearings **/

.clear:before,
.clear:after,
blockquote:before,
blockquote:after,
.entry-content:before,
.entry-content:after,
.entry-summary:before,
.entry-summary:after,
.comment-content:before,
.comment-content:after,
.site-content:before,
.site-content:after,
.site-main > article:before,
.site-main > article:after,
.primary-menu:before,
.primary-menu:after,
.social-links-menu:before,
.social-links-menu:after,
.textwidget:before,
.textwidget:after,
.content-bottom-widgets:before,
.content-bottom-widgets:after {
  content: "";
  display: table;
}
.clear:after,
.entry-content:after,
.entry-summary:after,
.comment-content:after,
.site-content:after,
.site-main > article:after,
.primary-menu:after,
.social-links-menu:after,
.textwidget:after,
.content-bottom-widgets:after {
  clear: both;
}

/** Headings **/

h1, h2, h3, h4, h5, h6 {
  margin: 0;
  color: #0b4499;
}
h1 {
  font-size: 2.75em;
  color: #fff;
  border-radius: 0;
  text-transform: uppercase;
  padding: 0.1em 20px;
  margin-bottom: 0.33em;
}
.main-title {
  background: #777777;
}
.category-description {
    background: rgba(119, 119, 119, 0.5);
}
.organisations-and-campaigners {
  background: #287c28;
}
.category-description.organisations-and-campaigners {
    background: rgba(40, 124, 40, 0.5);
}
.businesses {
  background: #0b4499;
}
.category-description.businesses {
    background: rgba(11, 68, 153, 0.5);
}
.political-parties, .lib-dems {
  background: #ff8f11;
}
.category-description.political-parties, .category-description.lib-dems {
    background: rgba(255, 143, 17, 0.5);
}
h2, .tagline {
  font-size: 2em;
  padding: 0.4em 20px;
}
.archive-title {
  margin-bottom: 0.33em;
}
.archive-title, .home-title {
  font-size: 2.75em;
  padding: 0;
}
.home-title a {
  font-size: 1.2em;
}
.archive-title a, .home-title a {
  color: #fff;
  text-transform: uppercase;
  padding: 0.1em 20px;
  display: block;
}
h3 {
  font-size: 1.75em;
  padding: 0.5em 20px;
}
h4 {
  font-size: 1.5em;
  padding: 0.57em 20px;
}
h5, .home-title {
  font-size: 1.25em;
  padding: 0.66em 20px;
}
.home-title {
  margin-bottom: 0;
}
h6 {
  font-size: 1.1em;
  padding: 0.8em 20px;
}
.tagline {
  text-align: center;
  clear: both;
  padding: 0.5em 0 0;
  text-transform: unset;
  color: #0b4499;
}

/** Paragraphs and Lists **/

section p, section li, section dl, .terms div, blockquote, th, td {
  margin: 0;
  padding: 0.5em 20px;
  line-height: 1.6em;
}
table p {
  padding: 0;
}
blockquote {
    border-left: 5px solid #ff8f11;
    padding: 0;
    background: #f3f3f3
}
.date-and-author {
    text-align: right;
    float: right;
    margin: 0.4em 1em;
    color: #fff;
    font-weight: bold;
    font-size: 1.2em;
}

/** Links **/

a {
  text-decoration: none;
  font-weight: bold;
  color: #0b4499;
}

/** Tables **/

table {
  padding: 1em;
}

td, th, caption {
  padding: 1em;
}
tr {
  background: rgba(255,143,17,0.2);
}
tr.odd {
  background: rgba(11,68,153,0.2);
}
thead tr.odd {
  background: rgba(40,124,40,0.2);
}

/** Site Header **/

#page-header {
  background: #fff;
  z-index: 10;
}
#header-inner {
  margin: auto;
  width: 1200px;
}
.site-title, .site-logo {
  display: block;
  width: 300px;
  float: left;
  z-index: 100;
}
.site-logo object {
    width: 100%;
}

/** Social Menu **/

.social-menu {
  list-style-type: none;
  float: right;
  padding-right: 1em;
  margin: 1.5em 0;
}
#social-menu {
  z-index: 100;
}
.social-menu li {
  float: left;
  margin-right: 1em;
}
.social-menu li a {
  display: block;
  width: 30px;
  height: 30px;
  -webkit-border-radius: 15px;  
  -moz-border-radius: 15px;
  border-radius: 15px;
  background: #0b4499;
  overflow: hidden;
  color: transparent;
}
.social-menu .facebook a {
  background: #0b4499 url('/wp-content/themes/praterraines/images/facebook-button.png') 10% 50% / 80% auto no-repeat;
  -webkit-transition: background 1s;
  -moz-transition: background 1s;
  transition: background 1s;
}
.social-menu .twitter a {
  background: #0b4499 url('/wp-content/themes/praterraines/images/twitter-button.png') 50% 50% / 80% auto no-repeat;
  -webkit-transition: background 1s;
  -moz-transition: background 1s;
  transition: background 1s;
}
.social-menu .facebook:hover a {
  background: #ff8f11 url('/wp-content/themes/praterraines/images/facebook-button.png') 10% 50% / 80% auto no-repeat;
  -webkit-transition: background 1s;
  -moz-transition: background 1s;
  transition: background 1s;
}
.social-menu .twitter:hover a {
  background: #ff8f11 url('/wp-content/themes/praterraines/images/twitter-button.png') 50% 50% / 80% auto no-repeat;
  -webkit-transition: background 1s;
  -moz-transition: background 1s;
  transition: background 1s;
}
/** Main Menu **/

#main-menu {
  float: left;
  width: 900px;
  margin: 0.5em 0 0 0;
}

#main-menu .main-menu, #main-menu .main-menu .menu-item .sub-menu {
  list-style-type: none;
  padding: 0;
  margin: 0;
  float: right;
}
#main-menu .main-menu .menu-item {
  float: left;
  padding: 0;
  margin: 0;
  position: relative;
  background: #fff;
  -webkit-transition: background 1s;
  -moz-transition: background 1s;
  transition: background 1s;
}
#main-menu .main-menu .menu-item a {
  padding: 1.5em 2em;
  display: block;
  color: #0b4499;
  -webkit-transition: color 1s;
  -moz-transition: color 1s;
  transition: color 1s;
}
#main-menu .main-menu .menu-item:hover {
  background: #ff8f11;
  -webkit-transition: background 1s;
  -moz-transition: background 1s;
  transition: background 1s;
}
#main-menu .main-menu .menu-item:hover a {
  color: #fff;
  -webkit-transition: color 1s;
  -moz-transition: color 1s;
  transition: color 1s;
}
#main-menu .main-menu .menu-item .sub-menu {
  position: absolute;
  left: -9999em;
  z-index: 100;
  width: 15em;
}
#main-menu .main-menu .menu-item:hover .sub-menu {
  position: absolute;
  left: 0;
}
#main-menu .main-menu .menu-item .sub-menu .menu-item {
  float: none;
  background: transparent;
  -webkit-transition: background 1s;
  -moz-transition: background 1s;
  transition: background 1s;
}
#main-menu .main-menu .menu-item:hover .sub-menu .menu-item {
  background: #ff8f11;
  -webkit-transition: background 1s;
  -moz-transition: background 1s;
  transition: background 1s;  
}
#main-menu .main-menu .menu-item .sub-menu .menu-item a {
  color: transparent;
  -webkit-transition: color 1s;
  -moz-transition: color 1s;
  transition: color 1s;
}
#main-menu .main-menu .menu-item:hover .sub-menu .menu-item a {
  color: #fff;
  -webkit-transition: color 1s;
  -moz-transition: color 1s;
  transition: color 1s;
}
#main-menu .main-menu .menu-item:hover .sub-menu .menu-item:hover {
  background: #f18102;
  -webkit-transition: background 1s;
  -moz-transition: background 1s;
  transition: background 1s;
}
#mobile {
  display: none;
  z-index: 1;
}
/** Banner **/

#banner {
  padding: 2em 0;
  background: #f3f3f3;
}
#calls-to-action {
  width: 1200px;
  margin: 0 auto;
}
#calls-to-action div, #calls-to-action div a, #calls-to-action div a span {
  display: block;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
#calls-to-action div {
  width: 30%;
  float: left;
  background: #fff;
  -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.4);
  -moz-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.4);
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.4);
}
#calls-left, #calls-middle {
  margin:  0 5% 0 0;
}
#calls-right {
  margin:  0;
}
#calls-to-action div a { 
  padding: 4em 1.25em;
  text-align: center;
  text-shadow: 0px 0px 1px #000;
  font-size: 1.3em;
}
#calls-to-action div a:hover {
  text-shadow: none;
}
#calls-left a {
  color: #fff;
  background: rgba(11, 68, 153, 0.5);
  -webkit-transition: background 0.5s;
  -moz-transition: background 0.5s;
  transition: background 0.5s;
}
#calls-left a:hover {
  background: #0b4499;
  -webkit-transition: background 0.5s;
  -moz-transition: background 0.5s;
  transition: background 0.5s;
}
#calls-middle a {
  color: #fff;
  background: rgba(40, 124, 40, 0.5);
  -webkit-transition: background 0.5s;
  -moz-transition: background 0.5s;
  transition: background 0.5s;
}
#calls-middle a:hover {
  background: #287c28;
  -webkit-transition: background 0.5s;
  -moz-transition: background 0.5s;
  transition: background 0.5s;
}
#calls-right a {
  color: #fff;
  background: rgba(255, 143, 17, 0.5);
  -webkit-transition: background 0.5s;
  -moz-transition: background 0.5s;
  transition: background 0.5s;
}
#calls-right a:hover {
  background: #ff8f11;
  -webkit-transition: background 0.5s;
  -moz-transition: background 0.5s;
  transition: background 0.5s;
}

/** Page Content **/

#page-content {
  clear: both;
  width: 1200px;
  margin: auto;
}
.terms div::before, .terms h2::before {
  color: #287c28;
  content: attr(id);
  display: inline-block;
  font-size: 0.8em;
  width: 50px;
}
section {
  margin-bottom: 1em;
}
.archive-thumbnail {
  float: right;
  width: 30%;
  height: auto;
  margin-bottom: 0.6em;
  margin-left: 2em;
}
.single-thumbnail {
  float: right;
  width: 50%;
  height: auto;
  margin-bottom: 0.6em;
  margin-left: 2em;
}
.home-item {
  width: 50%;
  padding: 2em 1em 0;
  float: left;
}
.home-item.odd {
    clear: both;
}
.home-thumbnail {
  margin: 0;
  padding: 0;
  float: none;
}
/** Pagination **/

.pagination {
  background: #ff8f11;
  padding: 0.5em 0;
}
.pagination h2 {
  font-size: 1em;
  color: #fff;
}
.pagination .page-numbers {
  padding: 0.2em 20px;
  color: #fff;
}
.pagination .screen-reader-text {
  display: none;
}

/** Footer **/
footer {
  background: #0b4499;
  color: #fff;
  margin-top: 4em;
}

#footer-menu, .address, .copyright {
  padding: 2em 20px 0;
  width: 1200px;
  margin: 0 auto;
} 
#footer-menu #menu-footer {
  list-style-type: none;
  padding: 0;
}
footer a {
  color: #fff;
}
.copyright {
  padding: 2em 20px;
}

/** Media Queries **/

@media all and (max-width: 1200px) {
  #header-inner, #calls-to-action, #page-content, #footer-menu, .address, .copyright {
    width: 1080px;
  }
  #main-menu {
    width: 780px;
  }
  #calls-to-action div {
    width: 47.5%;
    margin-bottom: 1em;
  }
  #calls-middle {
    margin-right: 0;
  }
  #calls-to-action #calls-right {
    float: none;
    margin: 1em auto 0;
    clear: both;
  }
  .archive-thumbnail {
    width: 35%;
  }
  #banner {
    padding: 2em 0 1em;
  }
  .tagline {
    padding: 0;
  }
}

@media all and (max-width: 1080px) {
  #header-inner, #calls-to-action, #page-content, #footer-menu, .address, .copyright {
    width: 960px;
  }
  .archive-thumbnail {
    width: 40%;
  }
  #mobile {
    display: block;
  }
  #main-menu {
    display: none;
  }
  .social-menu {
    padding: 0;
  }
  table, thead, tr, th, tbody, td {
    display: block;
    text-align: left;
  }
}

@media all and (max-width: 960px) {
  #header-inner, #calls-to-action, #page-content, #footer-menu, .address, .copyright {
    width: 760px;
  }
  .archive-thumbnail {
    width: 50%;
  }
}

@media all and (max-width: 760px) {
  h1, .archive-title, .home-title {
    font-size: 1.5em;
  }
  h2, .tagline {
    font-size: 1.35em;
  }
  h3 {
    font-size: 1.2em;
  }
  h4 {
    font-size: 1.15em;
  }
  h5, .home-title {
    font-size: 1.1em;
  }
  h6 {
    font-size: 1.05em;
  }
    .date-and-author {
        margin: 0.25em 1em;
        font-size: 0.75em;
    }
  
  #header-inner, #calls-to-action, #page-content, #footer-menu, .address, .copyright {
    width: 95%;
  }
  #calls-to-action div, .home-item {
    width: 90%;
    margin: 1em auto;
    clear: both;
    float: none;
  }
  .tagline {
    padding: 0 0 1em;
  }
  footer {
    font-size: 0.8em;
  }
  .single-thumbnail {
    width: 100%;
    float: none;
    margin: 1em auto;
  }
  #banner {
    padding: 0.5em 0;
  }
}

@media all and (max-width: 480px) {
  #calls-to-action div a {
    padding: 3em 1em;
  }
  .archive-thumbnail {
    width: 400px;
    float: none;
    margin: 1em auto;
  }
  .site-title, .site-logo {
    float: none;
    width: 100%;
  }
}

@media all and (max-width: 440px) {
  .archive-thumbnail {
    width: 100%;
  }
}

@media all and (max-width: 320px) {
  #calls-to-action div a {
    padding: 2em 1em;
  }
}
