* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  -webkit-font-smoothing: antialiased;
  -webkit-touch-callout: none; }

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

::-webkit-scrollbar {
  display: none; }

::selection {
  background: #514840;
  color: #fff; }

html {
  height: 100%; }

body {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  font-size: 15px;
  font-size: 1.05vw;
  overflow: hidden; }

.btn_prev, .btn_next {
  fill: none;
  stroke: #f6f3eb;
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-miterlimit: 10; }

.blocklandscape {
  display: none; }

.loader {
  position: fixed;
  z-index: 9;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: #514840; }
  .loader > svg {
    position: absolute;
    top: 47.5%;
    left: 50%;
    width: 7vh;
    height: 7vh;
    margin: -3.5vh 0 0 -3.5vh;
    animation: blink ease 3s;
    animation-iteration-count: infinite; }

@keyframes blink {
  0% {
    opacity: 0.1; }
  40% {
    opacity: 1; }
  60% {
    opacity: 1; }
  100% {
    opacity: 0.1; } }

nav.leftwing {
  position: fixed;
  z-index: 1;
  top: 8%;
  left: 5%;
  bottom: 8%;
  font-family: 'Montserrat', sans-serif;
  font-weight: 600;
  text-transform: uppercase;
  font-size: 10.5px;
  line-height: 2em;
  letter-spacing: 0.3em;
  color: #c1c1c1;
  opacity: 1;
  transition: 0.2s; }
  nav.leftwing.hide {
    opacity: 0; }
  nav.leftwing h1.logo {
    width: 30px;
    width: 1.8vw;
    cursor: pointer; }
    nav.leftwing h1.logo svg {
      width: 100%;
      height: auto; }
      nav.leftwing h1.logo svg .emblem_shield {
        fill: url(#SVGID_1_); }
      nav.leftwing h1.logo svg .emblem_s {
        fill: url(#SVGID_2_); }
    nav.leftwing h1.logo span {
      display: none; }
  nav.leftwing ul.menu {
    list-style: none;
    margin: 65px 0 0 0;
    margin: 4.875vw 0 0 0;
    counter-reset: section; }
    nav.leftwing ul.menu .mobilehome {
      display: none; }
    nav.leftwing ul.menu li {
      cursor: pointer; }
      nav.leftwing ul.menu li:nth-child(2) {
        margin: 0 0 14px 0;
        margin: 0 0 0.9vw 0; }
      nav.leftwing ul.menu li:nth-child(3) {
        margin: 0 0 28px 0;
        margin: 0 0 1.8vw 0; }
      nav.leftwing ul.menu li:nth-child(4) {
        margin: 0 0 42px 0;
        margin: 0 0 2.7vw 0; }
      nav.leftwing ul.menu li:nth-child(5) {
        margin: 0 0 56px 0;
        margin: 0 0 3.6vw 0; }
      nav.leftwing ul.menu li:nth-child(6) {
        margin: 0 0 70px 0;
        margin: 0 0 4.5vw 0; }
      nav.leftwing ul.menu li:nth-child(7) {
        margin: 0 0 70px 0;
        margin: 0 0 5.4vw 0; }
      nav.leftwing ul.menu li:hover {
        color: #f6f3eb; }
      nav.leftwing ul.menu li svg {
        position: absolute;
        top: 0;
        opacity: 0;
        transition: 0.2s ease-out; }
      nav.leftwing ul.menu li.active svg {
        opacity: 1; }
      nav.leftwing ul.menu li div {
        position: relative;
        float: left;
        width: 30px;
        height: 30px;
        margin: -6px 10px 0 0;
        width: 1.8vw;
        height: 1.8vw;
        margin: -0.3vw 0.75vw 0 0; }
        nav.leftwing ul.menu li div .line {
          fill: none;
          stroke: #F6F3EB;
          stroke-width: 1.25;
          stroke-linecap: round;
          stroke-linejoin: round;
          stroke-miterlimit: 10; }
        nav.leftwing ul.menu li div .fill {
          fill: #F6F3EB; }
        nav.leftwing ul.menu li div:before {
          content: "";
          display: block;
          width: 4px;
          height: 4px;
          margin: 12px;
          width: 0.375vw;
          height: 0.375vw;
          margin: 0.7125vw;
          border-radius: 50%;
          border: 1px solid #c1c1c1;
          box-sizing: border-box;
          transition: 0.2s ease-out; }
      nav.leftwing ul.menu li.active {
        color: #f6f3eb; }
        nav.leftwing ul.menu li.active div:before {
          width: 100%;
          height: 100%;
          margin: 0;
          border-color: #f6f3eb; }
      nav.leftwing ul.menu li span {
        float: left;
        width: 15em; }
      nav.leftwing ul.menu li:after {
        content: "";
        display: block;
        clear: both; }

svg#audiocontrol {
  position: absolute;
  display: none;
  width: 1.25em;
  height: 1.25em;
  bottom: 8%;
  left: 5.5%;
  cursor: pointer;
  z-index: 2;
  opacity: 0.667;
  fill: #f6f3eb; }
  svg#audiocontrol.mute .sound {
    display: none; }

.rightwing {
  position: fixed;
  z-index: 2;
  width: 106px;
  width: 8.3vw;
  top: 8%;
  right: 4.5%;
  bottom: 6.4%;
  pointer-events: none; }
  .rightwing .slidecontrol {
    text-align: center; }
    .rightwing .slidecontrol a {
      display: inline-block;
      margin: -5px 4px;
      margin: -0.3vw 0.35vw;
      cursor: pointer; }
      .rightwing .slidecontrol a svg {
        width: 12px;
        width: 2.5vw;
        height: auto; }
      .rightwing .slidecontrol a span {
        display: none; }
  .rightwing ul.slidenavigation {
    position: absolute;
    display: block;
    width: 100%;
    top: 50%;
    margin-top: -4px;
    margin-top: -0.375vw;
    text-align: center;
    list-style: none; }
    .rightwing ul.slidenavigation li {
      width: 7px;
      height: 7px;
      margin: 0 7px;
      padding: 1px;
      width: 0.5vw;
      height: 0.5vw;
      margin: 0 0.55vw;
      padding: 0.075vw;
      display: inline-block;
      cursor: pointer; }
      .rightwing ul.slidenavigation li a {
        display: block;
        width: 100%;
        height: 100%;
        border-radius: 50%;
        border: 1px solid #c1c1c1; }
      .rightwing ul.slidenavigation li.active {
        padding: 0; }
      .rightwing ul.slidenavigation li.active a {
        background: #f6f3eb;
        border-color: #f6f3eb; }
  .rightwing .logo.footer {
    position: absolute;
    bottom: 0; }
    .rightwing .logo.footer .logo_safyooz {
      fill: #F6F3EB; }
    .rightwing .logo.footer span {
      display: none; }

.sectioncontainer {
  height: 100%;
  transform: translateY(0);
  position: relative;
  transition: 0.5s ease-out; }

section {
  position: absolute;
  z-index: -1;
  width: 100%;
  height: 100%;
  font-family: 'PT Serif', serif;
  color: #f6f3eb; }
  section .rightwing {
    position: absolute;
    pointer-events: auto; }
  section .container {
    position: relative;
    height: 100%; }
  section .row {
    position: absolute;
    top: 50%;
    width: 100%; }
  section .btn {
    display: inline-block;
    margin: 5em 0 0 0;
    padding: 1vw;
    border: 1px solid #f6f3eb;
    font-family: 'Montserrat', sans-serif;
    font-size: 0.55em;
    letter-spacing: 0.24em;
    font-weight: 600;
    text-transform: uppercase;
    position: relative;
    z-index: 0; }
  section .btn:before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 0;
    background: #f6f3eb;
    opacity: 0;
    z-index: -1;
    transition: 0.25s ease-out; }
  section .btn:hover {
    color: #333; }
  section .btn:hover:before {
    height: 100%;
    opacity: 1; }
  section h3 {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.1em;
    letter-spacing: 0.24em;
    font-weight: 400;
    text-transform: uppercase; }
  section h2 {
    font-size: 3.46em;
    letter-spacing: 0.04em;
    font-weight: 400;
    line-height: 1.15em;
    margin: 0.25em 0 0.5em; }
  section p {
    letter-spacing: 0.04em;
    line-height: 2em; }
  section hr {
    border: 0;
    border-top: 1px solid #f6f3eb;
    margin-top: 0.75em; }
  section .fullbg, section .halfbg, section .quarterbg, section .halfcolor, section .fullslider {
    position: absolute;
    z-index: -1;
    top: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: 50% 50%; }
  section .halfbg {
    width: 50%; }
  section .quarterbg {
    right: 0;
    width: 25%; }
  section .tmspan {
    display: inline-block;
    font-size: 0.3em;
    vertical-align: top; }
  section#header {
    top: 0;
    background: #1a1a1a;
    font-family: 'Montserrat', sans-serif;
    color: #f6f3eb; }
    section#header .slidetext {
      position: absolute;
      width: 100%;
      height: 100%;
      /*transform: translateY(10%);
			opacity: 0;
			transition: 0.75s;*/ }
      section#header .slidetext * {
        transition: 0.75s; }
      section#header .slidetext.active {
        /*transform: translateY(0);
				opacity: 1;*/ }
        section#header .slidetext.active .navigator, section#header .slidetext.active .sub, section#header .slidetext.active h2, section#header .slidetext.active .icon, section#header .slidetext.active .stx {
          transform: translateY(0);
          opacity: 1; }
    section#header .container {
      text-align: center; }
      section#header .container .vcenter {
        position: absolute;
        width: 100%;
        top: 50%;
        margin-top: -9.5em; }
      section#header .container .navigator {
        font-weight: 600;
        font-size: 0.64em;
        transform: translateY(75%);
        opacity: 0; }
        section#header .container .navigator .dash {
          display: inline-block;
          width: 20px;
          width: 1.5vw;
          height: 0;
          margin: 0 14px;
          margin: 0 1vw;
          vertical-align: middle;
          text-indent: -9999px;
          border-top: 1px solid #f6f3eb; }
      section#header .container .sub {
        margin: 1.25em 0 0.5em;
        font-weight: 200;
        font-size: 1em;
        letter-spacing: 0.24em;
        text-transform: uppercase;
        transform: translateY(75%);
        opacity: 0; }
      section#header .container h2 {
        font-family: 'PT Serif', serif;
        font-weight: 400;
        font-size: 3.2em;
        letter-spacing: 0.04em;
        margin: 0;
        transform: translateY(75%);
        opacity: 0; }
      section#header .container .icon {
        display: inline-block;
        width: 3.33vw;
        height: 3.33vw;
        margin: 1.5em 0 0;
        border-radius: 50%;
        transform: translateY(175%);
        opacity: 0; }
        section#header .container .icon svg {
          fill: #f6f3eb; }
      section#header .container .stx {
        position: absolute;
        width: 100%;
        bottom: 9%;
        transform: translateY(75%);
        opacity: 0; }
        section#header .container .stx .btn {
          margin: 0 0 2.75em 0; }
        section#header .container .stx:before {
          content: "";
          display: block;
          height: 17vh;
          margin: 0 0 2.5% 50%;
          border-left: 1px solid #fff; }
        section#header .container .stx .text {
          display: inline-block;
          width: 8vw;
          font-size: 0.5em;
          letter-spacing: 0.24em;
          line-height: 1.7em;
          text-transform: uppercase; }
          section#header .container .stx .text:before {
            content: "scroll down to explore"; }
        section#header .container .stx #ic {
          display: inline-block;
          height: 1.4vw;
          margin: 0.7vw 0.7vw 0.35vw; }
          section#header .container .stx #ic .line {
            fill: none;
            stroke: #F6F3EB;
            stroke-width: 2;
            stroke-linecap: round;
            stroke-linejoin: round;
            stroke-miterlimit: 10; }
          section#header .container .stx #ic .fill {
            fill: #F6F3EB; }
    section#header .fullbg {
      opacity: 0;
      transition: 0.75s; }
      section#header .fullbg.active {
        opacity: 1; }
  section#about {
    top: 100%;
    background: #a8a8a8; }
    section#about .row {
      margin-top: -14.5em;
      transform: translateY(10%);
      opacity: 0;
      transition: 0.75s; }
      section#about .row.active {
        transform: translateY(0);
        opacity: 1; }
    section#about .rowb {
      margin-top: -19em; }
    section#about h2 {
      margin: -0.175em 0 0;
      font-weight: 400;
      font-size: 2.25em;
      line-height: 1.35em;
      letter-spacing: 0.02em;
      color: #f6f3eb; }
    section#about p {
      font-size: 0.9em;
      font-style: normal;
      margin: 0 0 0.5em;
      line-height: 1.92em;
      letter-spacing: 0.02em;
      color: #514840; }
      section#about p.quote {
        line-height: 2.2em; }
      section#about p.white {
        color: #f6f3eb; }
    section#about .dots {
      position: static;
      width: 100%;
      padding: 0;
      margin-top: 1em; }
    section#about .halfbg {
      opacity: 0;
      transition: 0.75s; }
      section#about .halfbg.active {
        opacity: 1; }
      section#about .halfbg:before {
        content: "";
        display: block;
        width: 100%;
        height: 100%;
        background: linear-gradient(left, rgba(0, 0, 0, 0.25) 0%, rgba(0, 0, 0, 0) 50%); }
    section#about .halfcolor {
      width: 50%;
      right: 0;
      opacity: 0;
      transition: 0.75s; }
      section#about .halfcolor.active {
        opacity: 1; }
  section#resources, section#signatures {
    top: 200%; }
    section#resources .row, section#signatures .row {
      margin-top: -11em;
      transform: translateY(10%);
      opacity: 0;
      transition: 0.75s; }
      section#resources .row .tnc, section#signatures .row .tnc {
        margin: 5em 0 0;
        font-family: 'Montserrat', sans-serif;
        font-size: 0.5em;
        letter-spacing: 0.24em;
        font-style: normal;
        text-transform: uppercase; }
      section#resources .row.active, section#signatures .row.active {
        transform: translateY(0);
        opacity: 1; }
      section#resources .row .btn, section#signatures .row .btn {
        padding: 0;
        border: 0; }
        section#resources .row .btn svg, section#signatures .row .btn svg {
          width: 1em;
          margin: 0 0 0 0.5em;
          vertical-align: middle;
          transition: 0.25s; }
        section#resources .row .btn:before, section#signatures .row .btn:before {
          background: transparent; }
        section#resources .row .btn:hover, section#signatures .row .btn:hover {
          color: inherit; }
          section#resources .row .btn:hover svg, section#signatures .row .btn:hover svg {
            transform: translate(50%); }
    section#resources .fullbg, section#signatures .fullbg {
      opacity: 0;
      transition: 0.75s; }
      section#resources .fullbg.active, section#signatures .fullbg.active {
        opacity: 1; }
      section#resources .fullbg .block, section#signatures .fullbg .block {
        position: absolute;
        background-size: cover;
        background-position: 50% 50%;
        top: 4%;
        right: 2%;
        bottom: 4%;
        left: 50%; }
    section#resources ul.material li, section#signatures ul.material li {
      width: 50%;
      height: 13em;
      padding: 1.75em 0;
      float: left;
      list-style: none;
      text-align: center;
      font-family: Montserrat, sans-serif;
      text-transform: uppercase;
      font-size: 0.667em;
      font-weight: 600;
      letter-spacing: 0.1em; }
    section#resources ul.material li span, section#signatures ul.material li span {
      content: "";
      display: block;
      width: 7.5em;
      height: 7.5em;
      border-radius: 50%;
      margin: 0 auto 0.75em;
      background-size: cover;
      background-position: 50% 50%;
      border: 2px solid #f6f3eb;
      font-family: x; }
    section#resources ul.material, section#signatures ul.material {
      width: 90%;
      margin: 6em 0 0; }
  section#resources .row:nth-child(2) {
    margin-top: -10em; }
  section#resources .row:last-child {
    margin-top: -18em; }
    section#resources .row:last-child p {
      font-size: 0.9em;
      letter-spacing: 0.02em;
      margin-bottom: 0.75em; }
  section#signatures {
    top: 300%; }
    section#signatures .row {
      margin-top: -18em; }
    section#signatures p {
      margin-bottom: 0.75em;
      font-size: 0.9em;
      letter-spacing: 0.02em; }
    section#signatures span.smaller {
      display: block;
      font-size: 12px;
      margin-top: 8em; }
  section#productservices {
    top: 400%;
    background: #899ba0; }
    section#productservices .row {
      margin-top: -21.5em; }
      section#productservices .row .col-9 {
        position: relative;
        margin-top: -0.25em; }
        section#productservices .row .col-9 .prev, section#productservices .row .col-9 .next {
          position: absolute;
          width: 2em;
          height: calc(100% + 1px);
          margin: 0 0 0 -2em;
          border: 1px solid #fff;
          opacity: 0.45; }
          section#productservices .row .col-9 .prev:before, section#productservices .row .col-9 .next:before {
            content: "";
            display: block;
            position: absolute;
            top: 50%;
            left: 50%;
            margin: -0.4em -0.2em;
            border-top: 0.4em solid transparent;
            border-right: 0.4em solid #fff;
            border-bottom: 0.4em solid transparent;
            border-left: 0; }
          section#productservices .row .col-9 .prev:hover, section#productservices .row .col-9 .next:hover {
            opacity: 1;
            cursor: pointer; }
        section#productservices .row .col-9 .next {
          right: calc(0.75vw + 3px);
          margin: 0 -2em 0 0; }
          section#productservices .row .col-9 .next:before {
            border-right: 0;
            border-left: 0.4em solid #fff; }
      section#productservices .row ul {
        list-style: none;
        font-family: 'Montserrat', sans-serif;
        font-weight: 600;
        font-size: 0.6em;
        letter-spacing: 0.125em;
        text-transform: uppercase; }
        section#productservices .row ul li {
          float: left;
          width: 50%;
          height: 4em;
          padding: 1.5em 1.75em;
          margin: 0 0 -1px -1px;
          border: 1px solid #fff;
          cursor: pointer;
          opacity: 0.6;
          text-align: center;
          white-space: nowrap;
          overflow: hidden;
          text-overflow: ellipsis;
          /*&:after {
						content: "";
						display: block;
						margin: 1.5em 0 0;
						border-top: 1px solid transparent;
					}*/ }
          section#productservices .row ul li:hover {
            opacity: 1; }
          section#productservices .row ul li:hover:after {
            border-top: 1px solid rgba(255, 255, 255, 0.5); }
          section#productservices .row ul li.active {
            opacity: 1;
            background: rgba(255, 255, 255, 0.2); }
            section#productservices .row ul li.active:after {
              border-top: 1px solid rgba(255, 255, 255, 0.35); }
          section#productservices .row ul li.desktophide {
            display: none; }
        section#productservices .row ul b {
          margin: 0 0 0.2em;
          font-family: 'Montserrat', sans-serif;
          font-weight: 900;
          font-size: 1em;
          letter-spacing: 0.02em;
          height: 1.35em;
          white-space: nowrap;
          overflow: hidden;
          text-overflow: ellipsis; }
    section#productservices .fullslider {
      width: 80%;
      right: 0; }
      section#productservices .fullslider:before {
        content: "";
        display: block;
        width: 100%;
        height: 100%;
        background: linear-gradient(to bottom, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0) 100%); }
    section#productservices .rightwing ul {
      list-style: none; }
  section#bathwaresurfaces {
    top: 500%;
    background: #a8a8a8; }
    section#bathwaresurfaces .row {
      margin-top: -21.5em; }
      section#bathwaresurfaces .row h3 {
        margin: 0 0 1.5em;
        font-weight: 600;
        font-size: 0.9em; }
      section#bathwaresurfaces .row p {
        font-size: 0.9em; }
      section#bathwaresurfaces .row a.btn {
        margin: 0 2em 0 0; }
      section#bathwaresurfaces .row:last-child {
        top: unset;
        bottom: 12.5%; }
    section#bathwaresurfaces .fullslider {
      width: 80%;
      right: 0; }
  section#artistry {
    top: 600%;
    background: #514840; }
    section#artistry .row {
      margin-top: -21.5em; }
      section#artistry .row:last-child {
        padding: 0 0 0 25%;
        top: unset;
        bottom: 8%; }
      section#artistry .row p {
        font-size: 0.9em; }
      section#artistry .row .content {
        font-family: 'Montserrat', sans-serif;
        font-weight: 600;
        font-size: 0.667em;
        letter-spacing: 0.1em;
        font-style: normal;
        text-transform: uppercase; }
        section#artistry .row .content h2 {
          margin: 0.1em 0 0.1em;
          font-family: 'PT Serif', serif;
          font-weight: normal;
          font-size: 2.5em;
          text-transform: none; }
      section#artistry .row ul.controller {
        float: left;
        left: 25%;
        list-style: none;
        margin: 0.25vw 0.5vw 0 0.5vw;
        /*li.prev:before, li.next:before {
					content: "";
					display: block;
					margin: 0 0 -100%;
					width: 100%;
					height: 100%;
					border-radius: 50%;
					background: #000;
					opacity: 0.6;
					transition: 0.15s ease-out;
				}*/ }
        section#artistry .row ul.controller li {
          display: block;
          float: left;
          /*width: 60px;
					height: 60px;
					margin: 10px;
					width: 4vw;
					height: 4vw;*/
          padding: 1vw 2vw;
          margin: 0 0.75vw 0 0;
          /*font-family: 'Montserrat', sans-serif;
					font-size: 0.55em;
					font-weight: 600;
					letter-spacing: 0.24em;*/
          background-size: cover;
          background-position: 50% 50%;
          border: 1px solid #f6f3eb; }
        section#artistry .row ul.controller svg {
          position: absolute;
          z-index: 0;
          width: 20px;
          height: 20px;
          margin: 20px 0 0 20px;
          width: 1.4vw;
          height: 1.4vw;
          margin: 1.25vw 0 0 1.25vw; }
        section#artistry .row ul.controller .prev, section#artistry .row ul.controller .next {
          cursor: pointer; }
        section#artistry .row ul.controller li:hover:before {
          opacity: 1; }
        section#artistry .row ul.controller .next svg {
          margin-left: 1.4vw; }
        section#artistry .row ul.controller:after {
          content: "";
          display: block;
          clear: both; }
      section#artistry .row p.mobilecontent {
        display: none; }
    section#artistry .fullslider {
      width: 80%;
      right: 0; }
      section#artistry .fullslider:before {
        content: "";
        display: block;
        width: 100%;
        height: 100%;
        background: linear-gradient(to bottom, rgba(0, 0, 0, 0.3) 15%, rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, 0) 75%); }
  section#contact {
    top: 700%;
    line-height: 1.7em;
    background: #a8a8a8;
    color: #514840; }
    section#contact .vcenter {
      position: absolute;
      width: 100%;
      top: 50%;
      margin-top: -17.5em; }
    section#contact .addresses {
      font-size: 0.9em;
      letter-spacing: 0.04em;
      line-height: 1.7em; }
      section#contact .addresses span {
        font-size: 0.6em;
        margin: 0 0 -0.2em; }
    section#contact .row {
      position: static; }
    section#contact h2 {
      color: #f6f3eb;
      margin: 0.25em 0 0.5em; }
    section#contact hr {
      margin: 1.2em 0 1em; }
    section#contact .socmed {
      margin-top: 2.75em; }
      section#contact .socmed:hover a svg {
        fill-opacity: 0.5; }
      section#contact .socmed a:hover svg {
        fill-opacity: 1; }
      section#contact .socmed a {
        display: inline-block;
        width: 1.8vw;
        height: 1.8vw;
        margin: 0.75vw 0.9vw 0 0; }
        section#contact .socmed a svg {
          fill: #f6f3eb;
          transition: 0.1s ease-out; }
    section#contact .rowbtn {
      color: #f6f3eb; }
    section#contact .btn {
      width: 10vw;
      margin: 0;
      text-align: center;
      line-height: 1.5em; }
    section#contact span {
      display: block;
      font-family: 'Montserrat', sans-serif;
      font-weight: 600;
      font-size: 0.55em;
      letter-spacing: 0.24em;
      text-transform: uppercase;
      color: #f6f3eb; }
    section#contact .halfbg {
      width: 43.75%; }
    section#contact .col-8 {
      padding: 0; }
    section#contact .col-3 div:nth-child(2) {
      margin-top: 2.5em; }
  section.details {
    transition: 0.5s ease-out; }
    section.details .backto {
      position: absolute;
      display: block;
      margin: 0 0 0 0.75vw;
      top: 8%;
      font-family: 'Montserrat', sans-serif;
      font-weight: 600;
      text-transform: uppercase;
      font-size: 0.55em;
      line-height: 2em;
      letter-spacing: 0.3em;
      color: #f6f3eb;
      z-index: 1; }
      section.details .backto svg {
        width: 0.5vw;
        margin: 0 0.75em -0.35em 0;
        transition: 0.2s ease-out; }
      section.details .backto:hover svg {
        transform: translateX(-0.25vw); }
  section#bsdetail.details {
    top: 0;
    z-index: 1;
    background: #282320;
    transform: translateX(100%); }
    section#bsdetail.details .row {
      height: 30em;
      margin-top: -14em; }
    section#bsdetail.details h2 {
      font-size: 2em;
      color: #f6f3eb; }
    section#bsdetail.details span {
      display: block;
      margin: 2em 0 3.5em;
      font-family: 'Montserrat', sans-serif;
      font-weight: 200;
      text-transform: uppercase;
      font-size: 0.6em;
      line-height: 2.5em;
      letter-spacing: 0.24em;
      color: #c1c1c1; }
    section#bsdetail.details p {
      margin: 0 0 2.5em;
      font-size: 0.75em;
      letter-spacing: 0.04em;
      line-height: 2.2em; }
    section#bsdetail.details .category {
      height: 3em;
      padding: 0 1em;
      margin: -3em 0 0; }
      section#bsdetail.details .category li {
        list-style: none;
        float: left;
        width: 33.333%;
        margin: 0;
        padding: 0 0.5em;
        font-family: 'Montserrat';
        font-size: 0.667em;
        font-weight: 200;
        letter-spacing: 0.1em;
        text-transform: uppercase;
        text-align: center; }
        section#bsdetail.details .category li.active {
          font-weight: 600; }
          section#bsdetail.details .category li.active:after {
            content: "";
            display: block;
            margin: 0.75em 0 0;
            border-bottom: 1px solid #f6f3eb; }
    section#bsdetail.details .btn {
      position: absolute;
      margin: 0.75vw;
      bottom: 8%; }
    section#bsdetail.details .col-4 {
      margin: 6em 0 0; }
    section#bsdetail.details .col-5 {
      height: 100%; }
    section#bsdetail.details .col-5 .content {
      height: 100%;
      overflow-y: auto; }
      section#bsdetail.details .col-5 .content::-webkit-scrollbar {
        width: 0.3em;
        display: initial;
        opacity: 0.5; }
      section#bsdetail.details .col-5 .content::-webkit-scrollbar-track {
        background: #899ba0;
        border: 1px solid #282320;
        border-radius: 0.15em; }
      section#bsdetail.details .col-5 .content::-webkit-scrollbar-thumb {
        background-color: #282320;
        border-radius: 0.15em; }
    section#bsdetail.details .thumbnailcoll {
      padding: 0;
      margin: -0.5vw 0 0;
      list-style: none;
      float: left;
      padding: 0;
      list-style: none; }
      section#bsdetail.details .thumbnailcoll li {
        display: block;
        float: left;
        width: 33.333%;
        height: 13.5em;
        padding: 1vw 1vw 0;
        text-align: center;
        font-size: 0.75em;
        color: #282320; }
        section#bsdetail.details .thumbnailcoll li .thumb {
          width: 90%;
          margin: 0 0 0.75em;
          border-radius: 50%;
          background-size: cover;
          background-position: 50% 50%;
          cursor: pointer; }
          section#bsdetail.details .thumbnailcoll li .thumb:before {
            content: "";
            display: block;
            padding-top: 100%; }
      section#bsdetail.details .thumbnailcoll:after {
        content: "";
        display: block;
        clear: both; }
    section#bsdetail.details a.prev, section#bsdetail.details a.next {
      display: block;
      width: 0;
      height: 0;
      margin: 10px 0;
      margin: 0.5vw 0;
      border: 10px solid transparent;
      border: 0.5vw solid transparent;
      border-top: none;
      border-bottom: 15px solid #282320;
      border-bottom: 0.75vw solid #282320; }
    section#bsdetail.details a.next {
      border-bottom: none;
      border-top: 15px solid #282320;
      border-top: 0.75vw solid #282320; }
    section#bsdetail.details .collcontroller {
      float: left;
      width: 10%;
      padding: 20px 0 0 20px;
      padding: 1vw 0 0 1vw;
      margin: -2.5em 0 0; }
      section#bsdetail.details .collcontroller ul:before {
        content: "";
        display: block;
        position: absolute;
        height: 25em;
        margin: 0 0 0 10px;
        margin: 0 0 0 0.5vw;
        border-left: 1px solid #fff; }
      section#bsdetail.details .collcontroller li {
        width: 10px;
        height: 10px;
        margin: 45px 5px;
        width: 0.5vw;
        height: 0.5vw;
        margin: 2.25vw 0.25vw;
        border-radius: 50%;
        border: 1px solid #fff;
        background: #a8a8a8;
        position: relative; }
        section#bsdetail.details .collcontroller li.active {
          background: #fff; }
      section#bsdetail.details .collcontroller li:first-child {
        margin-top: 25px;
        margin-top: 1.25vw; }
    section#bsdetail.details .halfcolor {
      width: 56.25%;
      right: 0; }
    section#bsdetail.details.active {
      transform: none; }
  section#bspopup, section#conpop {
    display: none;
    top: 0;
    z-index: 1;
    background: rgba(0, 0, 0, 0.5);
    color: #514840;
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    text-transform: uppercase; }
    section#bspopup .container > .row, section#conpop .container > .row {
      margin-top: -20.5em; }
    section#bspopup .pop, section#conpop .pop {
      top: 50%;
      left: 50%;
      width: 62.5%;
      margin: -20.5em 0 0 -31.25%;
      position: relative;
      transform: scale(0.9);
      transition: 0.05s ease-in-out;
      background: #514840; }
      section#bspopup .pop.active, section#conpop .pop.active {
        transform: scale(1); }
      section#bspopup .pop a.closebtn, section#bspopup .pop a.prev, section#bspopup .pop a.next, section#conpop .pop a.closebtn, section#conpop .pop a.prev, section#conpop .pop a.next {
        position: absolute;
        width: 12px;
        width: 0.9vw;
        height: auto; }
      section#bspopup .pop a.closebtn, section#conpop .pop a.closebtn {
        width: 21px;
        width: 1.5vw;
        top: 3.5%;
        right: 3.5%; }
      section#bspopup .pop a.prev, section#conpop .pop a.prev {
        top: 45%;
        left: 5%; }
      section#bspopup .pop a.next, section#conpop .pop a.next {
        top: 45%;
        right: 5%; }
      section#bspopup .pop img, section#conpop .pop img {
        display: block;
        width: 100%;
        height: 35vw;
        padding-left: 100%;
        background-size: cover;
        background-position: 50% 50%; }
      section#bspopup .pop > .row, section#conpop .pop > .row {
        position: static;
        padding: 30px;
        padding: 1.5vw 1.5vw 1.8vw;
        background: #fff; }
      section#bspopup .pop h2, section#conpop .pop h2 {
        margin: 0.1em 0 0.2em;
        font-size: 1.5em;
        font-family: 'PT Serif', serif;
        text-transform: none; }
      section#bspopup .pop p, section#conpop .pop p {
        margin: -0.25em 0 0;
        font-size: 0.7em;
        font-weight: 600;
        font-style: normal;
        letter-spacing: 0.1em;
        opacity: 0.5; }
      section#bspopup .pop .col-5 span.description, section#conpop .pop .col-5 span.description {
        margin: 0;
        font-size: 0.5em;
        font-weight: 600; }
      section#bspopup .pop .col-7, section#conpop .pop .col-7 {
        margin: -0.5em 0 -0.667em; }
      section#bspopup .pop span, section#conpop .pop span {
        width: 20%;
        height: 5em;
        padding: 0;
        margin: 0 0.75em;
        font-weight: 200;
        font-size: 0.6em;
        letter-spacing: 0.1em; }
      section#bspopup .pop ul, section#conpop .pop ul {
        list-style: none;
        padding: 0; }
      section#bspopup .pop li, section#conpop .pop li {
        float: left;
        width: 12.5%;
        padding: 1.2em 0 0;
        font-size: 0.5em;
        text-align: center;
        letter-spacing: 0.04em; }
        section#bspopup .pop li .thumb, section#conpop .pop li .thumb {
          width: 30px;
          height: 30px;
          width: 2.5vw;
          height: 2.5vw;
          margin: 0 auto 0.75em;
          border-radius: 50%;
          background-size: cover;
          background-position: 50% 50%; }
  section#conpop .pop {
    background: #F6F3EB;
    padding: 4em 2em 3em;
    margin-top: -25em;
    font-size: 0.667em;
    letter-spacing: 0.2em; }
    section#conpop .pop a.closebtn {
      top: 4%;
      right: 2.5%; }
    section#conpop .pop h2 {
      padding: 0 0.9em;
      font-size: 3.46em;
      letter-spacing: 0.04em; }
    section#conpop .pop > .row {
      background: transparent; }
      section#conpop .pop > .row .row {
        position: static;
        margin: 0 -0.75vw; }
    section#conpop .pop .captcha {
      margin: 1em 0 2em; }
      section#conpop .pop .captcha img {
        width: 300px;
        height: 80px;
        padding: 0; }
    section#conpop .pop .popmsg {
      margin: 0 0 2em;
      font-family: 'PT Serif', sans-serif;
      font-size: 1.25em;
      font-weight: 400;
      font-style: italic;
      text-transform: none;
      letter-spacing: normal;
      color: #a8a8a8; }
    section#conpop .pop input[type="submit"] {
      padding: 1em 5em;
      background: #514840;
      border: 0;
      font-size: 1em;
      letter-spacing: 0.24em;
      color: #fff;
      text-transform: uppercase; }
  section#conpop input[type="text"], section#conpop input[type="email"], section#conpop textarea {
    width: 100%;
    padding: 1em;
    margin: 0 0 1em;
    background: transparent;
    border: 1px solid rgba(81, 72, 64, 0.5);
    font-size: 1em; }
  section#conpop textarea {
    height: 10em; }
  section#conpop .col-8 .col-4 {
    padding-top: 1em; }
  section .dots {
    position: absolute;
    left: 31.25%;
    bottom: 10%;
    width: 37.5%;
    padding: 0 0.75vw; }
    section .dots svg {
      width: 100%;
      fill: #f6f3eb; }
  section .container {
    width: 75%;
    margin: 0 auto; }
  section .row:after {
    content: "";
    display: block;
    clear: both; }
  section .col {
    float: left;
    padding: 0 0.75vw; }
  section .col-1 {
    width: 8.33333%; }
  section .col-2 {
    width: 16.66667%; }
  section .col-3 {
    width: 25%; }
  section .col-4 {
    width: 33.33333%; }
  section .col-5 {
    width: 41.66667%; }
  section .col-6 {
    width: 50%; }
  section .col-7 {
    width: 58.33333%; }
  section .col-8 {
    width: 66.66667%; }
  section .col-9 {
    width: 75%; }
  section .col-10 {
    width: 83.33333%; }
  section .col-11 {
    width: 91.66667%; }
  section .col-12 {
    width: 100%; }
  section .off-1 {
    margin-left: 8.33333%; }
  section .off-2 {
    margin-left: 16.66667%; }
  section .off-3 {
    margin-left: 25%; }
  section .off-4 {
    margin-left: 33.33333%; }
  section .off-5 {
    margin-left: 41.66667%; }
  section .off-6 {
    margin-left: 50%; }
  section .off-7 {
    margin-left: 58.33333%; }
  section .off-8 {
    margin-left: 66.66667%; }
  section .off-9 {
    margin-left: 75%; }
  section .off-10 {
    margin-left: 83.33333%; }
  section .off-11 {
    margin-left: 91.66667%; }
  section .off-12 {
    margin-left: 100%; }
