/* Temp

*/

#wpadminbar {
  bottom: 0;
  top: auto !important;
  display: none!important;
  visibility: hidden;
}

/* End Temp

*/

@font-face {
    font-family: 'Titillium Web';
    src: url("../fonts/titilliumweb-light-webfont.eot");
    src: url("../fonts/titilliumweb-light-webfont.eot?#iefix") format("embedded-opentype"),url("../fonts/titilliumweb-light-webfont.woff") format("woff"),url("../fonts/titilliumweb-light-webfont.ttf") format("truetype"),url("../fonts/titilliumweb-light-webfont.svg#titillium_weblight") format("svg");
    font-weight: 300;
    font-style: normal
}

@font-face {
    font-family: 'Titillium Web';
    src: url("../fonts/titilliumweb-regular-webfont.eot");
    src: url("../fonts/titilliumweb-regular-webfont.eot?#iefix") format("embedded-opentype"),url("../fonts/titilliumweb-regular-webfont.woff") format("woff"),url("../fonts/titilliumweb-regular-webfont.ttf") format("truetype"),url("../fonts/titilliumweb-regular-webfont.svg#titillium_webregular") format("svg");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: 'Titillium Web';
    src: url("../fonts/titilliumweb-semibold-webfont.eot");
    src: url("../fonts/titilliumweb-semibold-webfont.eot?#iefix") format("embedded-opentype"),url("../fonts/titilliumweb-semibold-webfont.woff") format("woff"),url("../fonts/titilliumweb-semibold-webfont.ttf") format("truetype"),url("../fonts/titilliumweb-semibold-webfont.svg#titillium_websemibold") format("svg");
    font-weight: 600;
    font-style: normal
}

@font-face {
    font-family: 'Titillium Web';
    src: url("../fonts/titilliumweb-bold-webfont.eot");
    src: url("../fonts/titilliumweb-bold-webfont.eot?#iefix") format("embedded-opentype"),url("../fonts/titilliumweb-bold-webfont.woff") format("woff"),url("../fonts/titilliumweb-bold-webfont.ttf") format("truetype"),url("../fonts/titilliumweb-bold-webfont.svg#titillium_webbold") format("svg");
    font-weight: 700;
    font-style: normal
}

html {
    font-family: 'Titillium Web', sans-serif;
    font-size: 62.5%; /* REMs here on. 1rem 16px */
    text-rendering: optimizeLegibility;
    text-rendering: geometricPrecision;
    -moz-font-smoothing: antialiased;
    -webkit-font-smoothing: antialiased;
    -webkit-font-smoothing: subpixel-antialiased;
}

html.ready {
  opacity: 1 !important;
  transition: opacity linear .1s;
}

html, 
div,
ol,
ul,
h1,
h2,
h3,
h4,
p {
  padding: 0;
  -webkit-margin-before: 0;
  -webkit-margin-after: 0;  
}

ol, 
ul {
  list-style: none;
}

a {
  text-decoration: none;
  color: #475c76;
}

ul li {
    float: left;
}

table {
  display: table;
  border-collapse: collapse;
  border-spacing: 0;
  border-color: transparent;
}

textarea {
  resize: vertical; 
}

* :focus {
    outline: 2px dotted #555;
    box-shadow: none !important;
    transition: 0.1s linear;
}

.clearfix {
  width: 100;
  content: '';
  clear: both;
}

body {
  display: block;
  padding: 0;
  margin: 0;
  height: 100vh;
  background: #fff;
  background: linear-gradient(to top, #4b79a1, #283e51); 
  background: url('../images/v5-3.jpg') no-repeat center center fixed;
  background-size: cover;
  color: #475c76;
  overflow-y: hidden;  
}

body.home {
  /* overflow-y: scroll; */
}

.site-overlay {
  position: absolute;
  transition: all 0.2s linear;
  z-index: -1;
  opacity: 0;
}

header {
  width: 100%;
  background: #fff;  
  position: relative;
  z-index: 11;  
  box-shadow: 0 2px 1px rgba(0,0,0,0.15);  
}

header nav {
  width: 100%;
  height: 7.4rem;
}

header nav .nav-wrapper {
  width: 100%;
  position: relative;
}

body.shift-right header nav .nav-wrapper {
  height: 100vh;
  position: fixed;
  left: -25rem;
  overflow-y: scroll;
}

body.shift-right .site-overlay {
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.5);
  z-index: 10005;
  position: absolute;
  left: 3rem;
  top: 7.4rem;
  opacity: 1;
  height: 100vh;
}

header nav .logo {
  width: 81px;
  height: 52px;
  margin: 10px;
  float: left;
  background: url(../images/traveline-logo.svg) 0 0 no-repeat;
  background-size: 81px 52px;
  transition: all linear 0.2s;
}

header nav ul {
  float: left;
  margin: 0;
}

header nav ul li {
  text-transform: uppercase;
  font-size: 1.4rem;
  font-weight: 400;
  position: relative;
  transition: all 0.2s linear;
}

header nav ul li a {
  color: #263C57;
  background: #fff;
  transition: all 0.3s linear;
  padding: 1.15rem 2rem;
  height: 2.1rem;
  float: left;
  z-index: 1;
}

header nav ul li.sticky a,
header nav ul li.active a {
  color: #fff; 
  background: #263C57;
}

header nav ul li.sticky a:focus,
header nav ul li .sub-nav-panel ul li a:focus {
  outline-color: #FFF;
}

header nav ul li a::before {
  position: absolute;
  content: '';
  width: 100%;
  height: 0;
  left: 0;
  bottom: 0;
  background-color: #263C57;
  transition: all 0.2s linear;
}

header nav ul li a i {
  margin-left: 10px;
}

header nav ul li a:hover::before {
  height: 4px;
}

/*header nav ul li.active a::after {
  height: 41px;
}*/

header nav ul li a:focus {
  outline-offset: -2px;
  outline-color: #fff;
}

header nav ul li.active a:focus {
  outline-offset: 0;
}

header nav ul li div.sub-nav-panel {
  position: fixed;
  left: 0;
  right: 0;
  top: 7.4rem;
  opacity: 0;    
  visibility: hidden;
  transition: visibility 0.2s linear, opacity 0.2s linear;
  background-color: #263C57;
  z-index: -1;
}
  
header nav ul li div.sub-nav-panel.active {
  opacity: 0.95;
  visibility: visible;
  z-index: 12;
}

header nav ul li div.sub-nav-panel ul {
  width: 100%;
  color: #d0dff2;
  padding: 7.4rem 0;
  margin: 0;
}

header nav ul li div.sub-nav-panel ul li {
  text-transform: none;
  font-size: 1.7rem;
  width: calc(33% - 64px);
  color: #d0dff2;
  padding: 1.0rem 0;
  margin-left: 64px;
  float: left;
  border-bottom: 1px solid #899ab0;
  display: block;
  position: relative;
}

header nav ul li div.sub-nav-panel ul li i {
  position: absolute;
  right: 0;
  top: 1.4rem;
  transition: color 0.1s linear;
}

header nav ul li div.sub-nav-panel ul li a {
  display: inline-block;
  transition: color 0.1s linear;
  color: #d0dff2;   
  background: #263C57;    
  padding: 0;
  margin-right: 10px;
  float: none;
  z-index: 1;
}

header nav ul li div.sub-nav-panel ul li a:hover,
header nav ul li div.sub-nav-panel ul li a:active,
header nav ul li div.sub-nav-panel ul li a:hover + i,
header nav ul li div.sub-nav-panel ul li a:active + i {
  color: #fff;
  text-decoration: none;
}

header #navToggle {
  width: 0;
  height: 0;
  display: none;
}

header .switcher {
  position: absolute;
  right: 1rem;
  bottom: 0;
  margin-left: 3rem;
  padding: 1.1rem 0;
  transition: right 0.1s linear;
}

header .switcher a {
  font-size: 1.4rem;
  color: #263C57;
  font-family: 'Titillium Web', sans-serif;
  position: relative;
  /* padding-right: 2rem;   */
  cursor: pointer;
}

header .switcher a .fa-angle-right {
  font-size: 1.4rem;
}

header .switcher a .fa-mobile-alt {
  display: none;
  visibility: hidden;
}

header .switcher a::after {
  position: absolute;
  content: '';
  width: 100%;
  height: 0;
  left: 0;
  bottom: -1.1rem;
  background-color: #009e58;
  transition: all 0.1s linear;
}

header .switcher a:hover::after,
header .switcher a:active::after {
  height: 0.4rem;
  color: #009e58;
}

.cookies-bar {
  width: 100%;
  position: fixed;
  bottom: 0;
  height: 3.2rem;
  background: #354860;
  opacity: 0;
  z-index: -1;
}

.cookies-bar.visible {
  z-index: 10;
  opacity: 1;
}

.cookies-bar p {
  width: calc(100% - 84px);
  margin: 0 auto;
  font-size: 1.2rem;
  line-height: 3.2rem;
  color: #d0dff2;
  text-align: center;
  float: left;
}

.cookies-bar p a {
  color: #d0dff2;
  text-decoration: underline;
  transition: color 0.2s linear;
}

.cookies-bar p a:hover,
.cookies-bar p a:active {
  color: #fff;
}

.cookies-bar a.close-btn {
  width: 32px;
  height: 32px;
  float: right;
  color: #d0dff2;
  font-size: 2rem;
  position: absolute;
  top: calc(50% - 16px);
  right: 10px;
  transition: color 0.2s linear;  
}

.cookies-bar a.close-btn:hover,
.cookies-bar a.close-btn:active {
  color: #fff;
}

.cookies-bar a.close-btn i {
  margin: 6px;
  padding: 0;
}

.border {
  border: 2px solid red;
}

.mobile-ad {
  display: none !important;  
}

.front-page {
  position: relative;
  width: 100%;
  height: calc(100% - 7.4rem);
  overflow-y: auto;
  z-index: 1;
}

.front-page.results-ready {
  /* height: calc(100% - 7rem - 7.4rem); */
  background: #FFF;
}

.page {
  width: 100%;
  background: #FFF; /* Could do something funky here */
  position: relative;
}

/* .page::before {
  content: '';
  width: 100%;
  height: 2rem;
  box-shadow: 0px 20px 10px 5px rgba(255,255,255,1);
  position: absolute;
  top: -2rem;
  left: 0;
  right: 0;
} */

.page-content {
  width: 100%;
  margin: 7rem auto 0;
  height: calc(100vh - 7.4rem - 7rem);
  background: #FFF;
  overflow-y: auto;
  z-index: 1;
}

.page-content.fourohfour {
  padding-top: 1.6rem;
}

.page-content.fourohfour h1 {
  font-size: 10rem;
  font-weight: 600;
}

.page-content.fourohfour h2 {
  font-size: 3.6rem;
  margin: 0 auto 8rem;
  font-weight: 700;
}

.page-content.fourohfour h1,
.page-content.fourohfour h2,
.page-content.fourohfour p,
.page-content.fourohfour ul {
  text-align: center;
}

.page-content.fourohfour ul {
  width: 100%;
  max-width: 728px;
  margin: 0 auto;
}

.page-content.fourohfour ul li {
  float: none;
  font-size: 1.8rem;
  margin: 1.2rem 0;
  word-wrap: break-word;
  list-style-type: square;
  list-style-position: outside;
  margin-left: 3rem;
}

.page-content.fourohfour ul li a:link {
  text-decoration: underline;
}

.page-content.fourohfour ul li a:hover,
.page-content.fourohfour ul li a:focus {
  color: #d63030;
}

@media only screen and (min-width: 0px) and (max-width: 600px) {
  
  body {
    transition: transform linear 0.2s;
  }

  body.shift-right {
    transform: translate(25rem, 0);
    overflow: hidden;
    position: fixed;
    width: 100%;
  }

  body.shift-right header nav .nav-wrapper {
    min-height: 100vh;
    background: #354860;
    position: fixed;
    left: -25rem;
    overflow-y: auto;
    margin-left: 0;
    width: auto;
  }

  header {
    width: 100%;
    background: #475c76;
    color: #d0dff2;
    position: relative;
    z-index: 11;
    box-shadow: 0 2px 1px rgba(37, 15, 15, 0.15);
  }

  header #navToggle {
    display: block;
    width: 3.0rem;
    height: 3.0rem;
    position: absolute;
    top: 0;
    left: 0;
    padding: 0.7rem;
    cursor: pointer;
    transition: color 0.2s linear;
  }

  body.shift-right div#navToggle {
    position: fixed;
    left: 3rem;
  }

  div#navToggle:hover, 
  div#navToggle:active {
    color: #fff;
  }

  header #navToggle i {
    font-size: 3.0rem;
  }

  header nav {
      width: 100%;
      height: 4.4rem;
    }

  header nav .logo {
      width: 0;
      height: 0;
      display: none;
  }

  header nav .nav-wrapper {
      height: 100vh;
      position: fixed;
      top: 0;
      left:calc(-100vw - 89px);
  }

  header nav ul {
    width: 25rem;
    transition: all 0.2s linear;
    background: #354860;
    padding: 0 0 5rem 3rem;
    height: calc(100% - 5rem);
  }

  header nav ul li {
    text-transform: none;
    font-size: 1.8rem;
    font-weight: 700;
    position: relative;
    transition: all 0.2s linear;
    float: none;
    border-bottom: 0.1rem solid #c2ced880;
  }

  header nav ul li a {
    color: #d0dff2;
    background: transparent;
    transition: all 0.3s linear;
    padding: 1.1rem 2rem 1.1rem 0;
    display: block;
    z-index: 1;
    float: none;
  }

  header nav ul li a .fa-angle-down,
  header nav ul li a .fa-angle-right {
    display: none;
    visibility: hidden;
  }

  header nav ul li.sticky a, 
  header nav ul li.active a {
    background: transparent;
  }

  header nav ul li a:hover::before {
    height: 0;
  }

  header nav ul li a::after {
    position: absolute;
    content: '';
    width: 100%;
    height: 0;
    left: 0;
    bottom: 0;
    background-color: none;
  }

  header nav ul li div.sub-nav-panel {
    margin: 1rem 0 1rem 2rem;
    position: static;
    left: auto;
    top: auto;
    right: auto;
    opacity: 1;
    visibility: visible;
    transition: unset;
    z-index: 1;
    display: inline-block;
    width: calc(100% - 2rem);
  }

  header nav ul li div.sub-nav-panel ul {
    width: 100%;
    color: #d0dff2;
    padding: 0;
    margin: 0;
    position: static;
  }

  header nav ul li div.sub-nav-panel ul li {
    text-transform: none;
    font-size: 1.7rem;
    color: #d0dff2;
    padding: 0;
    border-bottom: 1px solid #21314680;
    display: block;
    font-weight: 400;
    float: none;
    margin-left: 0;
    width: 100%;
    background: transparent;
  }

  header nav ul li div.sub-nav-panel ul li:last-child {
    border: none;
  }

  header nav ul li div.sub-nav-panel ul li a {
    display: block;
    transition: color 0.1s linear;
    color: #d0dff2;
    padding: 1rem 0;
    height: auto;
    float: none;
    z-index: 1;
    background: transparent;
  }

  .textwidget {
    position: fixed;
    top: 4.4rem;
    left: 0;
  }

  header nav ul li div.sub-nav-panel ul li i {
    display: none;
  }

  header .switcher a {
    font-size: 1.4rem;
    color: #FFF;
  }

  header .switcher a:hover,
  header .switcher a:active {
    text-decoration: underline;
  }
  
  header .switcher a:hover::after, 
  header .switcher a:active::after {
    display: none;
  }

  header .switcher a .fa-mobile-alt {
    display: none;
    visibility: hidden;
  }

  .page-content {

  }

  .page-content.home {

  }

  .page-content.contact {
    margin: 1rem 0 0 0;
  }

  .cookies-bar {
    height: auto;
  }

  .cookies-bar p {
    width: calc(100% - 64px);
    line-height: 2rem;
    margin: 0.5rem 1rem;
  }

  .cookies-bar a.close-btn {
    right: 0.8rem;
  }

  body.shift-right .site-overlay {
    top: 4.4rem;
  }

}


@media only screen and (min-width: 601px) and (max-width: 799px) {

  header nav {
    height: 5.2rem;
  }

  header nav .logo {
    width: 41px;
    height: 26px;
    background-size: 41px 26px;
  }

  header nav ul#topNav {
    margin-top: 12px;
    height: 4rem;
    overflow-y: hidden;
  }

  header nav ul li {
    font-size: 1.2rem;
  }
  
  header nav ul li a {
    padding: 1.2rem 0.5rem;
  }

  header nav ul li div.sub-nav-panel {
    top: 5.2rem;
  }

  .cookies-bar {
    height: 4.8rem;
  }

  .cookies-bar p {
    line-height: 1.5rem;
    padding: 0.9rem 1rem;
    font-size: 1rem;
  }

  body.shift-right .site-overlay {
    top: 5.2rem;
  }

  .front-page {
    position: relative;
    width: 100%;
    height: calc(100% - 5.2rem);
    transition: height 0.2s linear, background 0.2s linear;
  }

  .front-page.results-ready {
    height: calc(100% - 5.2rem - 7.4rem);
  }

}

/* Standalone query for theme switch ONLY */
@media only screen and (min-width: 601px) and (max-width: 991px) {
  header .switcher a {
    font-size: 0;
    display: inline-block;
    padding: 0;
  }

  header .switcher a .fa-angle-right {
    display: none;
    visibility: hidden;    
  }

  header .switcher a .fa-mobile-alt {
    display: inline-block;
    visibility: visible;
    font-size: 2.4rem;
    bottom: -0.6rem;
    left: -2rem;
    position: absolute; 
  }

  header .switcher a:hover,
  header .switcher a:active {
    cursor: pointer;
  }

  header .switcher a::after {
    display: none;
  }
}

@media only screen and (min-width: 768px) {
   
  header nav .logo {
    margin-right: 4.8rem;
    transition: margin 0.1s linear;
  }

}

@media only screen and (min-width: 992px) {
  .page-content {
    width: calc(992px - 2rem);
  }
  
  header nav {
    width: 992px; /* 992px - logo + padding */
    margin: 0 auto;
  }

  header .switcher {
    right: 1rem;
    cursor: pointer;
  }
  
  header .switcher::after {
    display: block;
  }
}

.page-content h1 {
  font-size: 4.6rem;
  font-weight: 300;
  margin: 0 2rem 1.8rem 0;
  line-height: 1;
}
.page-content.contact h1 {
  font-size: 4.6rem;
  font-weight: 300;
  margin: 0 2rem 1.8rem 2rem;
  line-height: 1;
}

.page-content h2 {
  font-size: 2.3rem;
  font-weight: 600;
  line-height: 1;  
}

.page-content .left .page-left-widget h2 {
  margin-top: 1rem;
}

.page-content p {
  font-size: 1.8rem;
  margin: 1.2rem 0;
  text-align: left;
  word-wrap: break-word;
}

.page-content p a {
  color: #263C57;
  transition: all 0.1s linear;
}

.page-content p a:link {
  text-decoration: underline;
}

.page-content p a:hover, 
.page-content p a:focus {
  color: #d63030;
}

.page-content > div {
  margin-top: 3rem;
  margin-bottom: 6rem;
}

.page-content .page-ad {
    margin: 1rem 0;   
}

.page-content .left {
  width: 300px;
  float: left;
  margin-left: 1rem;
}

.page-content .right {
  width: calc(100% - 300px - 5rem);
  float: left;
  margin: 3rem 1rem 1rem 3rem;
}

.page-content.contact {
  padding-top: 3rem;
}

.page-content.contact p:first-child {
  margin-top: 0;
}

.page-content.contact .left {
  width: calc(50% - 2rem);
  margin-left: 2rem;
}

.page-content.contact .right {
  width: calc(50% - 6rem);
}

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

  header nav .nav-wrapper {
    width: calc(100% - 89px);
    margin-left: 89px;
  }

  .mx-ticker-box {
    left: 0;
  }

  .page-content {
    height: calc(100vh - 44px - 7rem);
    width: 100%;
  }

  .page-content .left {
    margin-left: 2rem;
    margin-right: 2rem;
    width: calc(100% - 4rem) !important;
    margin-bottom: 0;
  }

  .page-content .right,
  .page-content.contact .right {
    width: calc(100% - 4rem);
    margin: 1rem 2rem 0;
  }

  .page-content .left #page-left-widget > div {
    padding: 1rem 0 2rem 0;
    border-bottom: 0.2rem dotted;
  }

  .footer-ad {
    width: 300px;
    margin: 0 auto;
  }

  .page .page-ad,
  .page .page-ad + p,
  .footer-ad .ad-728x90,
  .footer-ad .ad-728x90 + p {
    display: none !important;
  }

  .footer-ad .ad-300x250 {
    width: 300px;
    outline: 1px dotted #5F5F5F;
    margin: 0 auto;
  }  
}

.page-content .left #page-left-widget {
  width: 100%;
  display: block;  
}

#page-left-widget ul.child-sidebar-menu {
  list-style: none;  
}

#page-left-widget ul.child-sidebar-menu li {
  font-size: 1.8rem;
  margin: 1.2rem 0 0;
  text-align: left;
  padding: 0;
  width: 100%;
  float: none;
}

#page-left-widget ul.child-sidebar-menu li a {
  color: #263C57;
  text-decoration: none;
  transition: all 0.1s linear;
}

#page-left-widget ul.child-sidebar-menu li a:hover,
#page-left-widget ul.child-sidebar-menu li a:active {
  text-decoration: underline;
}

#page-left-widget ul.child-sidebar-menu li.sticky a {
  font-weight: 700;
  color: #009e58;
}

.left .page-ad .ad-300x250 {
  width: 300px;
  outline: 1px dotted #5F5F5F;
  height: 250px;
}

.page-content .right ul {
  margin: 0.8rem 0;
  line-height: 1.6;
  list-style: square;
  list-style-position: inside;  
}

.page-content .right ul li {
  font-size: 1.8rem;
  margin-left: 1.2rem;
  padding-left: .4rem;
  width: calc(100% - 1.6rem);
  list-style-position: inside;
  float: none;
}

.page-content .right ul li .fa {
  margin: 0 0.8rem;
}


.footer-ad {
  margin-bottom: 0 !important;
  margin: 1rem auto;
  clear: both;
}

@media screen and (min-width: 728px) {
  .footer-ad .ad-728x90 {
    width: 100%;
    max-width: 728px;
    height: 90px;
    display: block;
    margin: 0 auto;
    outline: 1px dotted #5F5F5F;
  }

  .footer-ad .ad-300x250 {
   display: none;
  }
}

.page-ad p,
.footer-ad p,
.side-ad p {
  font-size: 1.2rem;
  font-weight: 300;
  text-transform: uppercase;
}

.footer-ad p {
  margin: 1rem auto;
  width: 100%;
  max-width: 728px;
}



/*
 * TNJP 
 */

 body.home div.visibility-warning {
  width: calc(100% - 2rem);
  height: calc(100% - 52px);
  background: rgba(255,255,255,0.9);
  position: absolute;
  visibility: hidden;
  top: 52px;
  left: 1rem;
  bottom: 0;
  right: 1rem;
  z-index: 12;
  transition: visibility 0.2s linear;
 }


 body.home div.visibility-warning h2 {
  margin: calc(10% - 1rem);
  text-align: center;
  font-size: 1.8rem;
 }

#jpFormContainer {
  position: relative;
  z-index: 10;
  transition: top .2s;
  width: 100%;
  margin: 0 auto;
  top: calc(50% - 473px / 2);
  transform: translateY(-50%);
}

@media screen and (max-height: 720px) {
  #jpFormContainer {
    top: 4rem;
    transition: top linear 0.1s;
  }
}

.front-page .page-ad {
  display: none;
}

.front-page .footer-ad {
  position: absolute;
  bottom: 2.4rem;
  width: 100%;
  color: #fff;
}

.front-page.results-ready .footer-ad {
  width: 100%;
  color: #fff;
  position: static;
  z-index: 1000;
}

 /* Move to TNJP? */
 #jpFormContainer .journey-form {
  left: calc(50% - 391px / 2) !important;
 }

 #jpResultsContainer {
  display: none;
  width: 100%;
  position: relative;
  z-index: 10;
  /* margin: 7rem auto 0; */
  margin: 0 auto;
  /* height: calc(100vh - 7.4rem - 7rem); */
  background: #FFF;
  overflow-y: auto;
 }

 /* #jpResultsContainer .footer-ad {
   margin: 1.6rem auto;
 } */
 #jpResultsContainer .side-ad.left {
  position: absolute;
  top: 2rem;
  left: calc(((100% - 728px) /2) - 170px);
  transition: all 0.1s linear;
 }

 .side-ad.left p,
 .side-ad.right p {
  margin: 0.5rem auto;
 }

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

  @media screen and (max-height: 720px) {
    .front-page .footer-ad {
      position: static;
      margin-top: 440px;
      width: 300px;
    }
  }

  @media screen and (min-height: 721px) {
    .front-page .footer-ad {
      position: absolute;
      width: 300px;
      bottom: 3rem;
      left: calc(50% - 150px);
    }
  }

 }

 @media screen and (min-width: 800px) and (max-height: 640px) {
  .front-page .footer-ad {
    display: none;
  }
 }

 @media screen and (min-width: 320px) and (max-width: 1076px) {
  #jpResultsContainer .side-ad.left {
    left: -100vw;
  }
 }

 .journey-form .journey-advanced ul > li {
   float: none;
 }

 .journey-response .search-pane .search-progress {
  border-radius: 24px;
  border: 4px solid;
 }


/* 
 * Base Colurs etc for reference
 * =============================
 * Dark Blue            #263C57
 * Mid Blue             #475c76
 *
 * Light Blue           #f6f6f6



 /* PLUGINS */

 /* Accordion Styles */

 .accordion-title {
  background-color: #f6f6f6;
  color: #475c76;
  padding: 0.8rem 4rem 0.8rem 1.8rem;
  font-size: 1.8rem;
  font-weight: 300;
  position: relative;
}

.accordion-title:hover {
  cursor: pointer;
  text-decoration: underline;
}

.accordion-title .fa-angle-down {
  position: absolute;
  right: 1.6rem;
  top: calc(50% - 0.9rem);
}

.accordion-title.open {
  background-color: #475c76;
  color: #fff;
}

.accordion-title.open .fa-angle-down {
  transform: scaleY(-1);
}

.accordion-content {
  margin: 2.5rem 1rem 2.5rem 2.5rem;
  font-size: 1.8rem;
}

.accordion-content img {
  max-width: 100%;
  height: auto;
}

.accordion-content ul {
  list-style-type: square;
  list-style-position: inside;
  display: block;
  line-height: 3rem;
}

.accordion-content ul li {
  width: 100%;
  float: none;
}

.accordion-content ul li a {
  color: #475c76;
}

.accordion-content ul li a:hover,
.accordion-content ul li a:active {
  text-decoration: underline;
}

@media screen and (min-width: 601px) and (max-width: 799px) {  

  .page-content.contact {
    margin: 3rem 0 0 0;
  }
  

  .page-content .left{
    width: calc(100% - 4rem);
    margin: 2rem 2rem 0 2rem;
  }

  .page-content.contact .left {
    width: calc(100% - 2rem);
    margin: 2rem 1rem 0 1rem;
  }

  .left .page-ad .ad-300x250,
  .left .page-ad p {
    margin: 0 auto;
  }   

 
}

 /* Sitemap Styles */
.wsp-container h2.wsp-posts-title,
.wsp-container ul.wsp-posts-list {
  display: none !important;
}

.wsp-container ul.wsp-pages-list {
  margin: 0.8rem 0;
  line-height: 1.6;
  list-style: square;
}

.wsp-container ul.wsp-pages-list li.page-item,
li.page_item {
  width: 100%;
  font-size: 1.8rem;
  margin-left: 1.2em;
  padding-left: .4rem;
}

.wsp-container ul.wsp-pages-list li.page-item a,
li.page_item a {
  color: inherit;
}

.wsp-container ul.wsp-pages-list li.page-item a:hover,
.wsp-container ul.wsp-pages-list li.page-item a:active,
li.page_item a:hover,
li.page_item a:active {
  text-decoration: underline;
}

.page-content .right ul.children {
  margin: 0;
}

.page-content .right ul.children li:last-child {
  margin-bottom: 0.8rem;
}

 /* Contact Form Styles */
table.nf-table-display {
  width: 100%;
  font-size: 1.8rem;

}

span#nf-form-title-2 {
  display: none;
}

.nf-debug-msg {

}

.nf-form-fields-required {
  font-size: 1.4rem;
  margin: 0 0 1rem 0;
}

.label-above .nf-field-label {
  font-size: 1.8rem;
  font-weight: 300;
}

.field-wrap .pikaday__container, 
.field-wrap .pikaday__display, 
.field-wrap>div input, 
.field-wrap select, 
.field-wrap textarea {
  width: 100%;
  max-width: 100%;
  padding: 0.6rem 1.2rem;
  border: 1px solid #d1d6dd;
  box-sizing: border-box;
  font-weight: 500;
  font-family: inherit;
  color: inherit;
  font-size: 1.8rem;
}

.field-wrap button, 
.field-wrap input[type=button], 
.field-wrap input[type=submit] {
  cursor: pointer;
  float: right;
  color: #fff;
  font-size: 1.8rem;
  padding: 0.7rem 3rem 0.9rem 3rem;
  border-radius: 2.4rem;
  border: 4px solid #d1d6dd;
  background: #009e58;
  transition: all linear 0.3s;
}

.field-wrap button:hover, 
.field-wrap input[type=button]:hover, 
.field-wrap input[type=submit]:hover {
  background: #00b866;
} 

.field-wrap button[value='Processing'],
.field-wrap input[type=botton][value='Processing'] {
  cursor: not-allowed;
  pointer-events: none;
  background: #7bbea0;
}

.nf-error .ninja-forms-field {
  border: 2px solid #f22525;
}

.nf-error-msg, .ninja-forms-req-symbol {
  color: #f22525;
}

.nf-response-msg {
  padding-top: 20rem;
  position: relative;
}

.nf-response-msg .fa-check-circle {
  color: #009e58;
  position: absolute;
  top: 5rem;
  left: calc(50% - 4rem);
  font-size: 10rem;
  animation: appear 1s ease-in-out;  
  animation-delay: -0.1s;
}

@keyframes appear {
  0% {
    transform: scale(0);
  }
  80% {
    transform: scale(1.4);
  } 
  100% {
    transform: scale(1.0);
  }
}

p.success-message {
  text-align: center;
}

/* News Ticker */

.mx-ticker.empty > * {
  display: none;
}

.nav-wrapper .fa-info-circle {
  position: absolute;
  color: #fff;
  font-size: 1.4rem !important;
  line-height: 2.8rem;
  left: 14.5rem;
  z-index: 1;
}

body.shift-right .fa-info-circle {
  display: none;
}

body.shift-right .textwidget,
body.shift-right .mx-ticker-border {
  left: 3rem;
}

.mx-ticker-border {
  width: 100%;
  height: 3rem;
  border: 0 !important;
}

.mx-ticker-border {
  position: relative;
  background-color: #c91c13; 
  border-color: #c91c13;
  box-shadow: 0 2px 1px rgba(0,0,0,0.15);  
}

.mx-ticker-label {
  position: relative;
  margin: 0 1.8rem 0 1rem !important;
}
.mx-ticker-label {
  color: #ffffff; 
  font-size: 1.4rem;
}

.mx-ticker-label,
.mx-ticker-box {
  font-size: 1.4rem !important;
  line-height: 2.8rem;
  height: 30px;
  text-indent: 1.4rem !important;
}

.mx-ticker-box {
  top: 0;
  border-right: 1rem solid transparent;
  overflow: hidden;
  position: absolute;
  right: 1rem;
  width: inherit;
  background-color: #c91c13;
}

.mx-ticker-box {
  border-right: 1rem solid transparent;
  overflow: hidden;
}

.mx-ticker-box a {
  color: #fff;  
}

.mx-ticker-spacer {
  display: inline-block;
  width: 5rem;
  margin: 0;
}

.mx-ticker-box a:hover,
.mx-ticker-box a:active {
  text-decoration: underline;
}

.mx-ticker-content {
  height: 3rem;
}

.mx-ticker-content {
  font-size: 1.4rem;
  white-space: nowrap;
	display: inline-block;
	position: relative;
  left: 0px;
}

.mx-ticker-content a {
  display: inline-block;
}

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

  .mx-ticker-border {
    position: fixed;
    top: 4.4rem;
    left: 0;
  }

  .mx-ticker-label,
  .mx-ticker-box {
    text-indent: 0 !important;
  }

  .mx-ticker-box {
    right: 1rem;
    left: 1rem;
    width: calc(100% - 2rem);
  }

}

@media only screen and (min-width: 601px) and (max-width: 799px) {
  
  .nav-wrapper .fa-info-circle {
    top: 5.2rem;
    z-index: 1;
    left: 0.6rem;
  }

  .mx-ticker-border {
    position: absolute;
    top: 52px;
    left: 0;
    /* width: calc(100% - 5.6rem); */
  }

  .mx-ticker-label {
    display: none;
  }

  .mx-ticker-box {
    width: calc(100% - 4rem);
    margin-left: 3rem;
    right: 0;
  }

}

@media only screen and (min-width: 800px) and (max-width: 991px) {
  .mx-ticker {
    height: 3rem;
  }

  .mx-ticker-border {
    width: calc(100% - 139px) !important;
    margin-left: 139px;
  }

  .mx-ticker-content {
    /* width: calc(100% - 139px);  */
  }
}

@media only screen and (min-width: 992px) {

  .mx-ticker {
    height: 3rem;
  }

  .mx-ticker-border {
    width: calc(100% - 139px) !important;
    margin-left: 139px;
  }

  .mx-ticker-content {
    /* width: calc(100% - 139px - 1rem);  */
  }
}


/* Simply Yearly Archive */

.sya_container h3 {
  font-size: 2.4rem;
  font-weight: 500;
}

.sya_container h3 a {
  color: #475c76;
}

.sya_container h3 a:hover,
.sya_container h3 a:active {
  text-decoration: underline;
}

.sya_container li {
  margin-left: 0;
  list-style: none;
  border-bottom: 1px dashed;
  padding: 1rem 0 1rem 0 !important;
}

.sya_container li:first-of-type {
  padding-top: 0;
}

.sya_container li:last-of-type {
  margin-bottom: 2rem;
}

.sya_postcontent a {
  display: block;
  font-size: 1.6rem;
  color: #475c76;
  transition: all linear 0.2s;
}

.sya_postcontent a:hover,
.sya_postcontent a:active {
  background: #475c76;
  color: #fff;
}

span.sya_date {
  display: block;
  position: relative;
  font-size: 1.4rem;
  text-indent: 2rem;
}

span.sya_date .fa-calendar-alt {
  position: absolute;
  top: 0.3rem;
  left: -2rem;
  margin: 0 !important;
}

span.sya_author {
  font-size: 1.2rem;
  display: block;
  text-align: right;
}

/* 
 * Better webkit scrollbar
 */

/* width */
::-webkit-scrollbar {
  width: 1.2rem !important;
  height: 1.2rem !important;
}

/* Track */
::-webkit-scrollbar-track {
  border-radius: 0.6rem;
  -webkit-box-shadow: inset 0 0 0.6rem rgba(0,0,0,0.3); 
  box-shadow: inset 0 0 0.6rem rgba(0,0,0,0.3); 
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: rgba(54,162,87,0.8); 
  border-radius: 0.6rem;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover,
::-webkit-scrollbar-thumb:active,
::-webkit-scrollbar-thumb:focus {
  background: rgba(54,162,87,1); 
}