/*
	HTML5 Reset :: style.css
	----------------------------------------------------------
	We have learned much from/been inspired by/taken code where offered from:

	Eric Meyer					:: http://meyerweb.com
	HTML5 Doctor				:: http://html5doctor.com
	and the HTML5 Boilerplate	:: http://html5boilerplate.com

-------------------------------------------------------------------------------*/
/* Let's default this puppy out
-------------------------------------------------------------------------------*/
html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, menu, nav, section, time, mark, audio, video, details, summary {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent; }

/* consider resetting the default cursor: https://gist.github.com/murtaugh/5247154 */
article, aside, figure, footer, header, nav, section, details, summary {
  display: block; }

/* Responsive images and other embedded objects
   Note: keeping IMG here will cause problems if you're using foreground images as sprites.
   If this default setting for images is causing issues, you might want to replace it with a .responsive class instead. */
img,
object,
embed {
  max-width: 100%; }

/* force a vertical scrollbar to prevent a jumpy page */
html {
  overflow-y: scroll; }

/* we use a lot of ULs that aren't bulleted.
	don't forget to restore the bullets within content. */
ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: '';
  content: none; }

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent; }

del {
  text-decoration: line-through; }

abbr[title], dfn[title] {
  border-bottom: 1px dotted #000;
  cursor: help; }

/* tables still need cellspacing="0" in the markup */
table {
  border-collapse: collapse;
  border-spacing: 0; }

th {
  font-weight: bold;
  vertical-align: bottom; }

td {
  font-weight: normal;
  vertical-align: top; }

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0; }

input, select {
  vertical-align: middle; }

pre {
  white-space: pre;
  /* CSS2 */
  white-space: pre-wrap;
  /* CSS 2.1 */
  white-space: pre-line;
  /* CSS 3 (and 2.1 as well, actually) */
  word-wrap: break-word;
  /* IE */ }

input[type="radio"] {
  vertical-align: text-bottom; }

input[type="checkbox"] {
  vertical-align: bottom; }

.ie7 input[type="checkbox"] {
  vertical-align: baseline; }

select, input, textarea {
  font: 99% sans-serif; }

table {
  font-size: inherit;
  font: 100%; }

small {
  font-size: 85%; }

strong {
  font-weight: bold; }

td, td img {
  vertical-align: top; }

/* Make sure sup and sub don't screw with your line-heights
	gist.github.com/413930 */
sub, sup {
  font-size: 75%;
  line-height: 0;
  position: relative; }

sup {
  top: -0.5em; }

sub {
  bottom: -0.25em; }

/* standardize any monospaced elements */
pre, code, kbd, samp {
  font-family: monospace, sans-serif; }

/* hand cursor on clickable elements */
.clickable,
label,
input[type=button],
input[type=submit],
input[type=file],
button {
  cursor: pointer; }

/* Webkit browsers add a 2px margin outside the chrome of form elements */
button, input, select, textarea {
  margin: 0; }

/* make buttons play nice in IE */
button,
input[type=button] {
  width: auto;
  overflow: visible; }

/* scale images in IE7 more attractively */
.ie7 img {
  -ms-interpolation-mode: bicubic; }

* {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

/* Custom text-selection colors (remove any text shadows: http://twitter.com/miketaylr/status/12228805301) */
::-moz-selection {
  background: #000;
  color: #fff;
  text-shadow: none; }

::selection {
  background: #000;
  color: #fff;
  text-shadow: none; }

/*	j.mp/webkit-tap-highlight-color */
a:link {
  -webkit-tap-highlight-color: rbga(0, 0, 0, 0); }

ins {
  background-color: #000;
  color: #000;
  text-decoration: none; }

mark {
  background-color: #000;
  color: #000;
  font-style: italic;
  font-weight: bold; }

/* Mozilla dosen't style place holders by default */
input:-moz-placeholder {
  color: #a9a9a9; }

textarea:-moz-placeholder {
  color: #a9a9a9; }

img {
  display: block; }

.cf:before, .cf:after {
  content: " ";
  display: table; }

.cf:after {
  clear: both; }

body {
  background: white;
  color: black;
  font-size: 16px;
  line-height: 26px;
  font-family: "Open Sans", sans-serif;
  font-weight: 100; }

a {
  text-decoration: none;
  color: inherit; }

p a {
  color: #ba4b50; }
  p a:hover {
    border-bottom: 1px solid; }
p + p {
  margin-top: 1em; }

.strong,
strong,
b {
  font-weight: 600; }

em,
i {
  font-style: italic; }

.underline {
  border-bottom: 1px solid; }

h1 {
  font-family: "Roboto Slab", serif;
  font-size: 42px;
  font-weight: 700;
  line-height: 1.35em;
  margin-bottom: .5em; }

h2 {
  font-family: "Roboto Slab", serif;
  font-size: 33px;
  font-weight: 300;
  line-height: 1.35em;
  margin: 1em 0 .5em; }
  .intro h2 {
    margin: -20px 0 0;
    position: relative; }

h4 {
  color: #ba4b50;
  font-weight: 600; }

a.blocked {
  display: block;
  height: 100%;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease; }
  a.blocked.redoverlay {
    background: rgba(186, 75, 80, 0.5);
    left: 0;
    position: absolute;
    top: 100%;
    width: 100%; }
  li:hover a.blocked {
    top: 0; }

.regular ul li {
  margin: 1em 0 1em 20px;
  position: relative; }
  @media only screen and (min-width: 680px) {
    .regular ul li {
      margin-left: 30px; } }
  .regular ul li:before {
    background: #ba4b50;
    content: '';
    display: block;
    height: 8px;
    left: -16px;
    position: absolute;
    top: 8px;
    width: 8px;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg); }
    @media only screen and (min-width: 680px) {
      .regular ul li:before {
        left: -22px; } }
.gform_body ul li {
  margin-left: 0; }
  .gform_body ul li:before {
    display: none; }

ol li {
  margin: 1em 0 1em 24px;
  position: relative; }
  @media only screen and (min-width: 680px) {
    ol li {
      margin-left: 30px; } }
  ol li > ol {
    list-style-type: upper-alpha; }
    ol li > ol li > ol {
      list-style-type: lower-roman; }

.center {
  text-align: center; }

.alignleft {
  float: left;
  margin-right: 10px;
  max-width: 240px;
  width: 50%; }
  @media only screen and (min-width: 680px) {
    .alignleft {
      margin-right: 20px; } }

.centered {
  text-align: center; }

a.button {
  background: #ba4b50;
  border: 1px solid #ba4b50;
  color: white;
  display: inline-block;
  font-style: italic;
  padding: 4px 16px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -webkit-transition: all 0.15s ease;
  -moz-transition: all 0.15s ease;
  -ms-transition: all 0.15s ease;
  -o-transition: all 0.15s ease;
  transition: all 0.15s ease; }
  a.button:hover {
    background: white;
    color: #ba4b50; }

.bannerhead {
  background-position: center;
  background-size: cover;
  margin: 20px 0 30px;
  min-height: 200px;
  width: 100%; }
  @media only screen and (min-width: 680px) {
    .bannerhead {
      height: 260px; } }
  @media only screen and (min-width: 1024px) {
    .bannerhead {
      height: 320px; } }
  @media only screen and (min-width: 1100px) {
    .bannerhead {
      height: 340px; } }
  @media only screen and (min-width: 1100px) {
    .bannerhead {
      height: 380px; } }

.inner-wrap {
  margin: 0 auto;
  position: relative;
  width: 90%; }
  @media only screen and (min-width: 680px) {
    .inner-wrap {
      width: 660px; } }
  @media only screen and (min-width: 1024px) {
    .inner-wrap {
      width: 760px; } }
  @media only screen and (min-width: 1100px) {
    header .inner-wrap, footer .inner-wrap {
      width: 900px; } }

.intro {
  margin-bottom: 40px; }

.threeby li {
  cursor: pointer;
  float: left;
  margin-bottom: 18px;
  margin-right: 6%;
  overflow: hidden;
  position: relative;
  width: 47%; }
  .threeby li:nth-of-type(2n) {
    margin-right: 0; }
  @media only screen and (min-width: 414px) {
    .threeby li {
      margin-bottom: 30px;
      margin-right: 5%;
      width: 30%; }
      .threeby li:nth-of-type(2n) {
        margin-right: 5%; }
      .threeby li:nth-of-type(3n) {
        margin-right: 0; } }

.overlay {
  bottom: -50%;
  color: white;
  display: block;
  font-size: .8em;
  left: 10px;
  line-height: 1.4em;
  position: absolute;
  -webkit-transition: all 0.6s ease;
  -moz-transition: all 0.6s ease;
  -ms-transition: all 0.6s ease;
  -o-transition: all 0.6s ease;
  transition: all 0.6s ease; }
  @media only screen and (min-width: 680px) {
    .overlay {
      font-size: 1em; } }
  li:hover .overlay {
    bottom: 10px; }

.name {
  font-family: "Roboto Slab", serif;
  font-weight: 400; }

.title {
  font-style: italic;
  font-weight: 300; }

.twoby li {
  display: inline-block;
  margin: 1em 0 2em;
  vertical-align: middle; }
  @media only screen and (min-width: 680px) {
    .twoby li {
      width: 47%; } }
  .twoby li:nth-of-type(2n) {
    margin-left: 5%; }
    @media only screen and (min-width: 680px) {
      .twoby li:nth-of-type(2n) {
        width: 40%; } }

header {
  padding-bottom: 20px; }

.logo {
  background: url("../img/logo-naga.png") center center no-repeat;
  background-size: contain;
  height: 100px;
  text-indent: -9999px;
  width: 100px; }
  @media only screen and (min-width: 680px) {
    .logo {
      height: 120px;
      width: 120px; } }
  @media only screen and (min-width: 1024px) {
    .logo {
      height: 140px;
      width: 140px; } }

.nav-trigger {
  height: 36px;
  position: absolute;
  right: 10px;
  top: 30px;
  width: 36px;
  z-index: 499; }
  .nav-trigger:before, .nav-trigger:after {
    border-top: 3px solid black;
    content: '';
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease; }
    @media only screen and (min-width: 1024px) {
      .nav-trigger:before, .nav-trigger:after {
        display: none; } }
    .home .nav-trigger:before, .home .nav-trigger:after {
      border-color: white; }
  .nav-trigger:after {
    border-bottom: 3px solid black;
    height: 7px;
    top: 10px; }
  .nav-trigger.active:before, .nav-trigger.active:after {
    border-color: white;
    left: 3px;
    top: 10px;
    -webkit-transform: rotate(225deg);
    -ms-transform: rotate(225deg);
    transform: rotate(225deg); }
  .nav-trigger.active:after {
    left: 0;
    top: 1px;
    -webkit-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
    transform: rotate(135deg);
    border-bottom-color: transparent; }

.main-nav {
  background: rgba(0, 0, 0, 0.85);
  height: 100%;
  left: 100%;
  overflow-y: scroll;
  -webkit-overflow-scrolling: touch;
  padding: 140px 20px 20px;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 99;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease; }
  .main-nav.active {
    left: 0; }
  @media only screen and (min-width: 1024px) {
    .main-nav {
      background: none;
      display: block;
      float: right;
      height: auto;
      left: auto;
      margin-top: 40px;
      padding: 0;
      position: relative;
      text-align: right;
      top: auto;
      width: 80%; } }
  .main-nav li {
    color: white;
    display: block;
    font-family: "Roboto Slab", serif;
    font-size: 1.1em;
    font-weight: 600;
    margin-bottom: 20px;
    padding: 4px 12px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease; }
    @media only screen and (min-width: 1024px) {
      .main-nav li {
        color: black;
        display: inline-block;
        margin-bottom: 0; } }
    .main-nav li.current-menu-item, .main-nav li:hover {
      background: #ba4b50;
      color: white; }
    .home .main-nav li {
      color: white; }

footer {
  background: #353535;
  color: white;
  font-size: .9em;
  margin-top: 50px;
  padding: 2em 0; }
  @media only screen and (min-width: 1100px) and (min-height: 680px) {
    footer {
      font-size: 1em;
      margin-top: 80px; } }
  @media only screen and (min-width: 680px) and (min-height: 780px) {
    .home footer {
      bottom: 0;
      position: absolute;
      width: 100%; } }

.address {
  text-align: center; }
  @media only screen and (min-width: 680px) {
    .address {
      float: left;
      text-align: left;
      width: 40%; } }

.footer-nav {
  font-family: "Roboto Slab", serif;
  font-weight: 400;
  margin: 40px 0;
  text-align: center; }
  @media only screen and (min-width: 680px) {
    .footer-nav {
      float: left;
      margin: 0 0 20px;
      text-align: right;
      width: 60%; } }
  @media only screen and (min-width: 1024px) {
    .footer-nav {
      width: 45%; } }
  .footer-nav li {
    display: inline-block;
    width: 40%; }
    @media only screen and (min-width: 500px) {
      .footer-nav li {
        width: 20%; } }
    @media only screen and (min-width: 680px) {
      .footer-nav li {
        margin: 0 1.25em 0 0;
        width: auto; } }

.socials {
  text-align: center; }
  @media only screen and (min-width: 680px) {
    .socials {
      float: left;
      text-align: right;
      width: 60%; } }
  @media only screen and (min-width: 1024px) {
    .socials {
      position: relative;
      margin-top: -2px;
      width: 15%; } }

.social {
  display: inline-block;
  height: 30px;
  width: 30px; }
  @media only screen and (min-width: 680px) {
    .social {
      margin-left: 5px; } }
  .social.facebook {
    background: url("../img/icon-facebook-white.svg") center center;
    background-size: contain; }
  .social.twitter {
    background: url("../img/icon-twitter-white.svg") center center;
    background-size: contain; }
  .social.youtube {
    background: url("../img/icon-youtube-white.svg") center center;
    background-size: contain; }

.index-links {
  margin: 1em 0 2em; }
  .index-links li {
    color: #ba4b50;
    margin: 0 0 0 20px;
    position: relative;
    text-decoration: underline; }
    @media only screen and (min-width: 680px) {
      .index-links li {
        margin-left: 30px; } }
    .index-links li:before {
      background: #ba4b50;
      content: '';
      display: block;
      height: 8px;
      left: -16px;
      position: absolute;
      top: 8px;
      width: 8px;
      -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
      transform: rotate(45deg); }
      @media only screen and (min-width: 680px) {
        .index-links li:before {
          left: -22px; } }

.segment {
  margin-top: 50px; }

.pseudo-table:first-of-type {
  margin-top: 2em; }
.pseudo-table:last-of-type {
  margin-bottom: 2em; }
.pseudo-table span {
  display: block;
  margin: 0 0 0 1em; }
  @media only screen and (min-width: 680px) {
    .pseudo-table span {
      display: inline-block;
      width: 30%; } }
  .pseudo-table span:first-of-type {
    font-weight: 600;
    margin-left: 0; }
    @media only screen and (min-width: 680px) {
      .pseudo-table span:first-of-type {
        font-weight: inherit;
        margin-left: 1em; } }

.twocolumn .block {
  margin-bottom: 2em; }
  @media only screen and (min-width: 680px) {
    .twocolumn .block {
      float: left;
      margin-right: 2%;
      width: 48%; } }

.logo img {
  margin: 3em auto 0; }

.single-to-triple {
  margin: 1em 0;
  text-align: center; }
  .single-to-triple > div {
    display: none; }
    .single-to-triple > div:nth-of-type(1) {
      display: inline-block; }
    @media only screen and (min-width: 375px) {
      .single-to-triple > div {
        margin: 0 1%;
        width: 47%; }
        .single-to-triple > div:nth-of-type(2) {
          display: inline-block; } }
    @media only screen and (min-width: 680px) {
      .single-to-triple > div {
        margin: 0 1%;
        width: 30%; }
        .single-to-triple > div:nth-of-type(3) {
          display: inline-block; } }

.regular {
  overflow: auto; }

input[type=text],
input[type=email],
textarea {
  background: #dddddd;
  border: 1px solid #dddddd;
  margin: 6px 0;
  outline: none;
  padding: 8px 12px;
  width: 100%; }
  @media only screen and (min-width: 680px) {
    input[type=text],
    input[type=email],
    textarea {
      width: 60%; } }
  input[type=text]:focus,
  input[type=email]:focus,
  textarea:focus {
    border-color: #707070; }

@media only screen and (min-width: 680px) {
  textarea {
    width: 80%; } }

input[type=submit] {
  background: #ba4b50;
  border: 1px solid #ba4b50;
  color: white;
  font-size: .9em;
  padding: 8px 32px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -webkit-transition: all 0.15s ease;
  -moz-transition: all 0.15s ease;
  -ms-transition: all 0.15s ease;
  -o-transition: all 0.15s ease;
  transition: all 0.15s ease; }
  input[type=submit]:hover {
    background: black; }

.fullbg {
  text-align: center; }

.fullimage {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: -1;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover; }

.fullintro {
  color: white;
  font-size: .9em;
  margin: 0 auto;
  padding-top: 60px; }
  @media only screen and (min-width: 680px) and (min-height: 780px) {
    .fullintro {
      bottom: 0;
      color: white;
      font-size: .9em;
      left: 0;
      height: 176px;
      margin: auto;
      padding-top: 0;
      position: absolute;
      right: 0;
      top: 0; } }

.bigtitle {
  font-family: "Roboto Slab", serif;
  font-size: 1.2em;
  font-weight: 400;
  letter-spacing: .04em;
  line-height: 1.25em;
  text-transform: uppercase; }
  @media only screen and (min-width: 414px) {
    .bigtitle {
      font-size: 1.6em; } }
  @media only screen and (min-width: 680px) {
    .bigtitle {
      font-size: 2.4em; } }
  @media only screen and (min-width: 1024px) {
    .bigtitle {
      font-size: 2.8em; } }
  @media only screen and (min-width: 1100px) {
    .bigtitle {
      font-size: 3em; } }

.smallintro {
  margin: 10px auto;
  width: 90%; }
  @media only screen and (min-width: 414px) {
    .smallintro {
      margin: 20px auto; } }
  @media only screen and (min-width: 680px) {
    .smallintro {
      width: 560px; } }
  @media only screen and (min-width: 768px) {
    .smallintro {
      font-size: 1.2em;
      margin: 30px auto 40px; } }

.bigbutton {
  background: #ba4b50;
  color: white;
  padding: 6px 18px 8px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease; }
  .bigbutton:hover {
    background: black;
    border: none; }

.menu {
  margin-bottom: 2em;
  text-align: center; }
  .menu li {
    border: 1px solid #707070;
    color: #707070;
    display: inline-block;
    font-size: .8em;
    margin: 0 4px;
    padding: 0 6px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease; }
    @media only screen and (min-width: 680px) {
      .menu li {
        padding: 2px 8px; } }
    @media only screen and (min-width: 768px) {
      .menu li {
        font-size: 1em; } }
    .menu li.current-menu-item, .menu li:hover {
      background: #d69598;
      border-color: #ba4b50;
      color: white; }
