/**
 * If using a CSS pre-processor, tell it to overwrite this file. If not, place
 * your custom CSS modifications here.
 */

@import url('https://fonts.googleapis.com/css?family=Patua+One&display=swap');

body {
margin-top: 0;
background-color: #b6e4ed;
font-family: 'Patua One';
font-size: 18px;
color: #e54128;
line-height: 1.6;
}
h2 {
text-transform: lowercase;
}
a:hover, a:focus {
color: #23527c;
text-decoration: none;
}
p {
margin: 2em 0;
}
@media only screen and (min-width: 1200px) {
  body {
  font-size: 20px;
  }
}
.navbar {
margin: 0 auto;
}
.navbar .logo {
padding: 0;
margin: 0;
}
.navbar-wrapper {
background-color: #e54128;
}
.navbar-default {
background-color: #e54128;
border-color: #e7e7e7;
border: none;
border-radius: inherit;
}
.navbar-default .navbar-nav > li > a {
color: #b6e4ed;
text-transform: lowercase;
}
.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus {
color: #b6e4ed;
background-color: #f59230;
}
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {
color: #b6e4ed;
background-color: #f59230;
}
.navbar-header {
text-align: center;
}
.navbar-toggle {
float: inherit;
margin-left: auto;
margin-right: auto;
border: none;
}
.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
background-color: inherit;
}
.navbar-default .navbar-toggle .icon-bar {
width: 26px;
height: 3px;
background-color: #b6e4ed;
}
.navbar-nav {
text-align: center;
}
@media only screen and (min-width: 768px) {
  .nav.navbar-nav {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  float: inherit;
  }
}

.social-media-sharing {
text-align: center;
margin: 0.7em 0;
}
.social-media-sharing ul {
margin: 0;
}

.main-container .region-content {
background-color: #ffffff;
text-align: center;
}

h1.page-header {
text-transform: lowercase;
border: none;
padding-top: 3em;
}

.view-daily-pic-front,
.view-daily-pic {
margin-top: 3em;
}
.view-daily-pic .views-row {
margin-bottom: 3em;
}
.view-daily-pic .pager {
position: relative;
z-index: 100;
margin: 20px 20px 3em 20px;
}
@media only screen and (min-width: 768px) {
  .view-daily-pic .pager {
  margin: 20px;
  }
}
.views-field-field-daily-pic {
position: relative;
}
.views-field-field-daily-pic .h2-wrapper {
position: absolute;
top: -61px;
left: 0;
right: 0;
}
.views-field-field-daily-pic h2 {
text-transform: lowercase;
color: #ffffff;
background-color: #e54128;
border: 5px solid #ffffff;
border-radius: 30px;
display: inline-block;
padding: 0.5em 1em;
font-size: 18px;
}

@media only screen and (min-width: 600px) {
  .views-field-field-daily-pic h2 {
  padding: 0.5em 6em;
  }
}
@media only screen and (min-width: 768px) {
  .views-field-field-daily-pic .h2-wrapper {
  top: -47px;
  }
  .views-field-field-daily-pic h2 {
  padding: 0.5em 6em;
  font-size: 22px;
  }
}
.vlog-front {
background: url(../images/background.jpg) center top no-repeat;
}

.view-vlog-front {
margin: 5em 0;
}

.sign-off p {
margin: 3em 0 10em 0;
}
.sign-off {
background: url(../images/sign-off.jpg) center bottom no-repeat;
background-position: right 50% bottom 50px;
}

.footer {
font-size: 0.8em;
text-transform: lowercase;
border: none;
margin-top: 0;
}
.footer .nav > li > a:hover, .footer .nav > li > a:focus {
text-decoration: underline;
background-color: inherit;
}


.path-frontpage .field--name-field-opening-text {
background: url(../images/sign-off.jpg) center bottom no-repeat;
background-position: right 50% bottom 50px;
padding-bottom: 10em;
}

.paragraph--type--featurex3 {
padding: 3em 6em;
}
.paragraph--type--feature .field--name-field-icon {
display: inline-block;
}

.view-story {
padding: 0 2em;
}
@media only screen and (min-width: 768px) {
  .view-story {
  padding: 0 5em;
  }
}
@media only screen and (min-width: 1200px) {
  .view-story {
  padding: 0 8em;
  }
}
.views-field-field-story {
color: #737373;
}

.sign-off::before {
content: "";
padding: 2em;
background: url(../images/background.jpg) center -200px no-repeat;
width: 100%;
margin-top: 6em;
}
.path-frontpage .sign-off::before {
display: none;
}

.view-story .views-row {
background: url(../images/sign-off.jpg) center bottom no-repeat;
background-position: right 50% bottom 0;
padding-bottom: 7em;
}

/* admin menu */
.menu--full-admin-menu li span {
width: 100%;
}