/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v8.4.14,
* Autoprefixer: v10.4.7
* Browsers: last 4 version
*/

/*
Theme Name: BlankSlate
Theme URI: https://github.com/tidythemes/blankslate
Author: TidyThemes
Author URI: https://github.com/tidythemes
Description: Donations: https://calmestghost.com/donate. BlankSlate is the definitive WordPress boilerplate starter theme. We've carefully constructed the most clean and minimalist theme possible for designers and developers to use as a base to build websites for clients or to build completely custom themes from scratch. Clean, simple, unstyled, semi-minified, unformatted, and valid code, SEO-friendly, jQuery-enabled, no programmer comments, standardized and as white label as possible, and most importantly, the CSS is reset for cross-browser-compatability and no intrusive visual CSS styles have been added whatsoever. A perfect skeleton theme. For support and suggestions, go to: https://github.com/tidythemes/blankslate/issues. Thank you.
Tags: accessibility-ready, one-column, two-columns, custom-menu, featured-images, microformats, sticky-post, threaded-comments, translation-ready
Version: 2023
Requires at least: 5.2
Tested up to: 6.1
Requires PHP: 7.0
License: GNU General Public License v3 or Later
License URI: https://www.gnu.org/licenses/gpl.html
Text Domain: blankslate

BlankSlate WordPress Theme © 2011-2023 TidyThemes
BlankSlate is distributed under the terms of the GNU GPL
*/

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}html{scroll-behavior:smooth}body{line-height:1}a{-webkit-text-decoration-skip:ink;text-decoration-skip-ink:auto}a[href^="tel"]{color:inherit;text-decoration:none}button{outline:0}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}q{display:inline;font-style:italic}q:before{content:'"';font-style:normal}q:after{content:'"';font-style:normal}textarea,input[type="text"],input[type="button"],input[type="submit"],input[type="reset"],input[type="search"],input[type="password"]{-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:0}input[type="search"]{-webkit-appearance:textfield}table{border-collapse:collapse;border-spacing:0}th,td{padding:2px}big{font-size:120%}small,sup,sub{font-size:80%}sup{vertical-align:super}sub{vertical-align:sub}dd{margin-left:20px}kbd,tt{font-family:courier;font-size:12px}ins{text-decoration:underline}del,strike,s{text-decoration:line-through}dt{font-weight:bold}address,cite,var{font-style:italic}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}*{-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
.sticky{}.bypostauthor{}.wp-caption{}.wp-caption-text{}.gallery-caption{}.alignright{}.alignleft{}.aligncenter{}
.screen-reader-text{border:0;clip:rect(1px,1px,1px,1px);-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute!important;width:1px;word-wrap:normal!important;word-break:normal}
.screen-reader-text:focus{background-color:#f7f7f7;border-radius:3px;-webkit-box-shadow:0 0 2px 2px rgba(0,0,0,.6);box-shadow:0 0 2px 2px rgba(0,0,0,.6);clip:auto!important;-webkit-clip-path:none;clip-path:none;color:#007acc;display:block;font-size:14px;font-size:.875rem;font-weight:700;height:auto;right:5px;line-height:normal;padding:15px 23px 14px;text-decoration:none;top:5px;width:auto;z-index:100000}
.skip-link{left:-9999rem;top:2.5rem;z-index:999999999;text-decoration:underline}
.skip-link:focus{display:block;left:6px;top:7px;font-size:14px;font-weight:600;text-decoration:none;line-height:normal;padding:15px 23px 14px;z-index:100000;right:auto}
.visually-hidden:not(:focus):not(:active), .form-allowed-tags:not(:focus):not(:active){position:absolute !important;height:1px;width:1px;overflow:hidden;clip:rect(1px 1px 1px 1px);clip:rect(1px, 1px, 1px, 1px);white-space:nowrap}



@font-face { 
font-family: Montserrat; 
src: url(/wp-content/themes/blankslate/fonts/Montserrat-Medium.ttf); 
font-weight: normal;
font-display: swap;
}
@font-face { 
font-family: Montserrat-Bold; 
src: url(/wp-content/themes/blankslate/fonts/Montserrat-Bold.ttf); 
font-weight: normal;
 font-display: swap;}
@font-face { 
font-family: Quicksand;   font-display: swap;
src: url(/wp-content/themes/blankslate/fonts/Quicksand-VariableFont_wght.ttf); 
font-weight: normal; }
@font-face { 
font-family: Righteous;  font-display: swap; 
src: url(/wp-content/themes/blankslate/fonts/Righteous-Regular.ttf); 
font-weight: normal; }








/* Main Variables */
:root {
  --main-dark: black;
  --main-light: white;
}
/* Global Styles */
::-moz-selection {
	background: transparent;
  color: var(--main-light);
  text-shadow: none;
}
::selection {
	background: transparent;
  color: var(--main-light);
  text-shadow: none;
}
img::-moz-selection, svg::-moz-selection {
	background: transparent;
}
img::selection, svg::selection {
	background: transparent;
}
/* Link color inherits from parent font color  */
a {
	color: inherit;
}
			
body {
  color: #fff;
  letter-spacing: 0;
  background-color: #141414;
  font-family: s, sans-serif;
  font-size: 1vw;
  line-height: 1.6;
}

h1 {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 3.28em;
  font-weight: 700;
  line-height: 1.4;
}

h2 {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 2.5em;
  font-weight: 700;
  line-height: 1.4;
}

h3 {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 2.19em;
  font-weight: 700;
  line-height: 1.4;
}

h4 {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 1.88em;
  font-weight: 700;
  line-height: 1.4;
}

h5 {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 1.67em;
  font-weight: 700;
  line-height: 1.4;
}

h6 {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 1.46em;
  font-weight: 700;
  line-height: 1.4;
}

p {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 1rem;
  font-weight: 400;
}

a {
  font-size: 1em;
  text-decoration: none;
}

label {
  margin-bottom: .3em;
  font-size: 1.25em;
  font-weight: 700;
  display: block;
}

blockquote {
  border-left: .3em solid #e2e2e2;
  margin-bottom: 1em;
  padding: 1em 2em 1em 1.7em;
  font-size: 1.2em;
  line-height: 1.6;
}

.container {
  width: 100%;
  max-width: 100em;
  margin-left: auto;
  margin-right: auto;
  padding: 2.3em;
}

.container.is-hero {
  z-index: 2;
  min-height: 100vh;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
}

.container.is-images {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  padding-top: 0;
  padding-bottom: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.container.is-up-next {
  z-index: 2;
  height: 100vh;
  text-align: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
}

.container.is-home-hero {
  z-index: 900;
  min-height: 100vh;
  text-align: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
}

.style_item {
  border-bottom: .1em solid #bdbdbd;
  padding: 2em 0;
}

.html {
  width: 0;
  height: 0;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: 0%;
  overflow: hidden;
}

.global-styles {
  position: fixed;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: 0%;
}

.rich-text p {
  margin-top: 0;
  margin-bottom: 1.6em;
}

.rich-text h1 {
  margin-top: 0;
  margin-bottom: .2em;
  font-size: 3.28em;
}

.rich-text h2 {
  margin-top: 0;
  margin-bottom: .2em;
  font-size: 2.5em;
}

.rich-text h3 {
  margin-top: 0;
  margin-bottom: .3em;
  font-size: 2.19em;
}

.rich-text h4 {
  margin-top: 0;
  margin-bottom: .4em;
  font-size: 1.88em;
}

.rich-text h5 {
  margin-top: 0;
  margin-bottom: .6em;
  font-size: 1.67em;
}

.rich-text h6 {
  margin-top: 0;
  margin-bottom: .7em;
  font-size: 1.46em;
}

.section {
  position: relative;
}

.section.is-hero {
  position: relative;
  overflow: hidden;
}

.section.is-images {
  padding-top: 8.7em;
  padding-bottom: 8.7em;
}

.section.is-up-next {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.section.is-home-hero {
  overflow: hidden;
}

.page-wrapper {
  width: 100%;
  font-size: 1em;
  position: relative;
  overflow: hidden;
}

.h1 {
  font-size: 2.8em;
  font-weight: 400;
  line-height: 1.1;
}

.h2 {
  font-size: 2.5em;
  font-weight: 400;
  line-height: 1.2;
}

.h3 {
  font-size: 2.19em;
  font-weight: 400;
  line-height: 1.3;
}

.h4 {
  font-size: 1.88em;
  font-weight: 400;
  line-height: 1.3;
}

.h5 {
  font-size: 1.67em;
  font-weight: 400;
  line-height: 1.3;
}

.h6 {
  font-size: 1.46em;
  font-weight: 400;
}

.form_input {
  height: 3em;
  border: 1px solid rgba(0, 0, 0, .2);
  border-radius: 0;
  margin-bottom: 1em;
  padding: 0 .9em;
  font-size: 1.25em;
}

.display {
  font-size: 4.38em;
  font-weight: 400;
  line-height: 1.1;
}

.form_submit {
  font-size: 1.25em;
}

.hero_bg {
  z-index: 1;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.hero_content {
  width: 30em;
  max-width: 100%;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.hero_headline-wrap {
  width: 18em;
  max-width: 100%;
  padding-bottom: 3.8em;
}

.hero_description {
  color: rgba(255, 255, 255, .6);
  margin-top: 1em;
  margin-bottom: 2.7em;
}

.hero_top {
  padding-bottom: 3.9em;
}

.hero_info {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.hero_project-number {
  grid-column-gap: .5em;
  grid-row-gap: .5em;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.hero_project-number-line {
  width: .9rem;
  height: 2px;
  background-color: #fff;
}

.main-images_wrap {
  width: 51em;
  max-width: 100%;
}

.main-images_item {
  padding-top: 3em;
}

.project_column {
  width: 4rem;
  position: relative;
}

.main-images_photo {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.sub-images_item {
  padding-bottom: .3rem;
}

.sub-images_photo {
  width: 100%;
}

.project_column-wrap {
  width: 100%;
  height: 100%;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.image-spacer {
  width: 100%;
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  padding-top: 56%;
}

.project_move {
  width: 100%;
  height: 100%;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.project_frame {
  width: 120%;
  border: 2px solid rgba(255, 255, 255, .2);
  margin-top: -18%;
  padding-top: 75%;
}

.up-next_title {
  font-size: 3.8em;
  font-weight: 400;
}

.up-next_title-wrap {
  grid-column-gap: 2px;
  grid-row-gap: 2px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-bottom: 1.3em;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
}

.up-next_number {
  width: 1.5em;
  text-align: left;
  margin-right: -1.8em;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: auto;
  right: 0%;
}

.up-next_sub {
  font-size: 1.3rem;
}

.up-next_photo {
  width: 0;
  height: 57vh;
  min-width: 40vh;
  -o-object-fit: cover;
     object-fit: cover;
  position: relative;
}

.all-projects_list {
  width: 100%;
  height: 100vh;
  position: relative;
}

.all-projects_item {
  width: 100%;
  height: 100%;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: none;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.all-projects_item:first-child {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.up-next_link {
  display: none;
}

.sticky-wrap {
  height: 400vh;
  position: relative;
}

.up-next_img-wrap {
  position: absolute;
}

.replace-this {
  z-index: 1;
  position: relative;
}

.projects_wrap {
  display: none;
}

.bottom-trigger {
  width: 100%;
  height: 2px;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.project_column-contain {
  position: relative;
}

.project_column-padding {
  padding-top: 3em;
}

.sub-images_link {
  width: 100%;
  -webkit-transition: opacity .15s;
  -o-transition: opacity .15s;
  transition: opacity .15s;
}

.sub-images_link:hover {
  opacity: .3;
}

.up-next_button {
  width: 5em;
  height: 6em;
  border: 2px solid rgba(255, 255, 255, .3);
  border-radius: 100vw;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 2em;
  display: none;
}

.up-next_arrow {
  width: 2em;
  height: 2em;
}

.main-images_wrapper {
  padding-top: 56.5%;
  position: relative;
}

.loader {
  z-index: 800;
  width: 100%;
  height: 100vh;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: fixed;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
	background: #000;
}

.loader.is-alt {
  position: absolute;
}

.loader_column {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  padding-left: 7vh;
  padding-right: 7vh;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.loader_column.is-alt {
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

.loader_column-inner {
  height: 100%;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.loader_column-inner.is-tall {
  height: 1060vh;
}

.loader_img-wrap {
  width: 100vw;
  height: 100vh;
  position: relative;
  overflow: hidden;
}

.loader_img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.loader_flex {
    height: 961vh;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-transform: scale(.1);
        -ms-transform: scale(.1);
            transform: scale(.1);
    margin-left: 0;
    margin-top: 0;
	-webkit-transition:3s all;
	-o-transition:3s all;
	transition:3s all;
}

.hero_title {
  font-size: 6rem;
  line-height: 1;
}

.hero_button {
  color: #000;
  background-color: #fff;
  border-radius: 100vw;
  margin-top: 1.2rem;
  padding: .7em 1.4em;
  font-size: 1.1rem;
}

.spacer {
  height: 100vh;
}

@media screen and (max-width: 991px) {
  body {
    font-size: .619375em;
  }

  .container {
    padding-left: 6vw;
    padding-right: 6vw;
  }

  .container.is-images {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }

  .project_column {
    display: none;
  }

  .up-next_number {
    text-align: center;
    margin-bottom: 0;
    margin-right: 0;
    display: none;
    position: relative;
  }

  .sticky-wrap {
    height: auto;
    display: block;
  }

  .up-next_img-wrap {
    display: none;
  }

  .up-next_button {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}

@media screen and (max-width: 479px) {
  .hero_title {
    font-size: 19vw;
  }
}


@font-face {
  font-family: 's';
  src: url('../fonts/s.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}	
			.flexclass { height:570vh;  -webkit-transform: scale(.2);  -ms-transform: scale(.2);  transform: scale(.2); -webkit-transition:4.5s all; -o-transition:4.5s all; transition:4.5s all;}	
			.boom {
    -webkit-transform: translate3d(0px, 0px, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg, 0deg);
            transform: translate3d(0px, 0px, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg, 0deg);
    -webkit-transform-style: preserve-3d;
            transform-style: preserve-3d; -webkit-transition:3s all; -o-transition:3s all; transition:3s all;
}
			
			.centerloader { -webkit-transform:translate3d(0, 160%, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-ms-transform:translate3d(0, 160%, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);transform:translate3d(0, 160%, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0)}
			
			
			.uploader { -webkit-transform:translate3d(0, -160%, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-ms-transform:translate3d(0, -160%, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);transform:translate3d(0, -160%, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0)}			
	
Result Skip Results Iframe
EDIT ON

.absolutespin {
    width: 100%;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999999999999;
    background: #000;
    padding: 25%;
}


.spinner {
    width: 5.5rem;
    height: 5.5rem;
    border-top-color: #fff;
    border-left-color: #fff;
    -webkit-animation: spinner 2400ms linear infinite;
            animation: spinner 2400ms linear infinite;
    border-bottom-color: transparent;
    border-right-color: transparent;
    border-style: solid;
    border-width: 2px;
    border-radius: 50%;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    display: inline-block;
    vertical-align: middle;
    position: fixed;
    left: 50%;
}

/* Animation styles */
@-webkit-keyframes spinner {
  0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}
@keyframes spinner {
  0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}

.goaway { display:none;}

.menuista {
    width: 357px;
    float: right;
    margin: 19vh;
    font-family: Quicksand;
    font-size: 30px;
    -webkit-transition: 1s all;
    -o-transition: 1s all;
    transition: 1s all;
    border-left: 1px solid #ffffff78;
    height: 440px;
    padding-left: 30px;
    overflow: hidden;
}
			
.loadlayer {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 99999;
    width: 100%;
    height: 100%;
}	
			
#menu {
    display: block;
    -webkit-transition: 1.5s all;
    -o-transition: 1.5s all;
    transition: 1.5s all;
    padding-left: 20px;
}	
.fold  {
     margin-left: -200px; 
}
			
			
.nameit {
    font-family: Quicksand;
    font-size: 46px;
    -webkit-transition: 1s all;
    -o-transition: 1s all;
    transition: 1s all;
    position: absolute;
    left: 9%;
    bottom: 12%;
    height: 0;
    overflow: hidden;
    height: 59px;
}		
				.zero { height:0; }	
			
.toom {
    -webkit-transform: scale(9.4);
        -ms-transform: scale(9.4);
            transform: scale(9.4);
    opacity:0;
	-webkit-transition:4s all;
	-o-transition:4s all;
	transition:4s all;
 
}		
			
.lensi {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 99999;
    width: 100%;
    pointer-events: none;
    height: 100%;
}			
			
 img {
    max-width: 100%;
}
.abi, .abi2 {
    position: absolute;
    top: 0;
    left: 0;
}	
.abi, .abi2 {
    position: absolute;
    top: 0;
    left: 0;
}	
			.abi2 { opacity:0; -webkit-transition:1s all; -o-transition:1s all; transition:1s all;}		
		.showabi2 { opacity:1; }			
.darkone {
    background: #000000eb;
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 9;
    top: 0;
    left: 0;
    -webkit-transition: 2s all;
    -o-transition: 2s all;
    transition: 2s all;
}	
			
.keepdistance {
    height: 10%;
    width: 100%;
	-webkit-transition:1.5s all;
	-o-transition:1.5s all;
	transition:1.5s all;
}
			.keepzero {    height: 0;}			
.centerdiv {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}		
			
.zoomimg {
    z-index: 99999999999;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
	scale:0.6;
    display:none;
   
    pointer-events: none;
	-webkit-transition:3s all;
	-o-transition:3s all;
	transition:3s all; opacity:0;
}	
			
			.bzoom { pointer-events:all; opacity:1; scale:1; display:block;}		


.concentric-circle {
  border-radius: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: absolute;
}
.outer-housing {
    width: 30rem;
    height: 30rem;
    border: 2px solid rgb(9 9 9);
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(28,41,53,1)), color-stop(36%, rgba(38,43,48,1)), to(rgba(0,0,0,1)));
    background: -o-linear-gradient(top, rgba(28,41,53,1) 0%, rgba(38,43,48,1) 36%, rgba(0,0,0,1) 100%);
    background: linear-gradient(180deg, rgba(28,41,53,1) 0%, rgba(38,43,48,1) 36%, rgba(0,0,0,1) 100%);
	-webkit-transition:7s all;
	-o-transition:7s all;
	transition:7s all;
    scale: 0.22;  
	overflow: hidden;
	opacity:1;
	display:block;
}
	.beforezoom { opacity:0; display:none;	-webkit-transition:0.5s all;	-o-transition:0.5s all;	transition:0.5s all;}	
	.housezoom {  -webkit-animation-name: zin;  animation-name: zin;
  -webkit-animation-duration: 15s;
          animation-duration: 15s;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  -webkit-animation-iteration-count: 1;
          animation-iteration-count: 1; }
	
	@-webkit-keyframes zin {
  0%   {scale: 0.22;  }
		 10%   {scale: 1.22;  }
		 60%   {scale: 2;  }
		 80%   {scale: 3.6;  }
  100% {scale: 9; }
}
	
	@keyframes zin {
  0%   {scale: 0.22;  }
		 10%   {scale: 1.22;  }
		 60%   {scale: 2;  }
		 80%   {scale: 3.6;  }
  100% {scale: 9; }
}
	
	.housezoom .ribbing {
    border: 1px solid rgb(13 28 34); 
	width: calc(100% - 10px);
    height: calc(100% - 10px);}

.silver-ring {
  width: 95%;
  height: 95%;

}
.inner-housing {
    width: 97%;
    height: 97%;
    -webkit-box-shadow: 2px 1px rgb(38 107 107), 0 6px rgb(3 3 3) inset;
            box-shadow: 2px 1px rgb(38 107 107), 0 6px rgb(3 3 3) inset;
    background: rgb(28,41,53);
    background: -o-radial-gradient(circle, rgba(28,41,53,1) 0%, rgba(0,0,0,1) 69%);
    background: radial-gradient(circle, rgba(28,41,53,1) 0%, rgba(0,0,0,1) 69%);
}
.outer-lens {
    width: 80%;
    height: 80%;
    background: -webkit-gradient(linear, left bottom, left top, from(rgb(80 200 140 / 2%)), to(rgb(120 80 200 / 8%))), radial-gradient(circle at 10% 10%, rgb(95 95 95 / 0%) 0%, rgb(80 200 140 / 0%) 10%, transparent 40%), radial-gradient(circle at 0% 40%, rgb(204 204 204 / 0%) 0%, rgb(120 80 200 / 5%) 10%, transparent 30%), radial-gradient(circle at 90% 90%, rgba(40, 100, 200, 0.4) 0%, rgba(40, 100, 200, 0.2) 10%, transparent 20%);
    background: -o-linear-gradient(bottom, rgb(80 200 140 / 2%), rgb(120 80 200 / 8%)), -o-radial-gradient(10% 10%, circle, rgb(95 95 95 / 0%) 0%, rgb(80 200 140 / 0%) 10%, transparent 40%), -o-radial-gradient(0% 40%, circle, rgb(204 204 204 / 0%) 0%, rgb(120 80 200 / 5%) 10%, transparent 30%), -o-radial-gradient(90% 90%, circle, rgba(40, 100, 200, 0.4) 0%, rgba(40, 100, 200, 0.2) 10%, transparent 20%);
    background: linear-gradient(0deg, rgb(80 200 140 / 2%), rgb(120 80 200 / 8%)), radial-gradient(circle at 10% 10%, rgb(95 95 95 / 0%) 0%, rgb(80 200 140 / 0%) 10%, transparent 40%), radial-gradient(circle at 0% 40%, rgb(204 204 204 / 0%) 0%, rgb(120 80 200 / 5%) 10%, transparent 30%), radial-gradient(circle at 90% 90%, rgba(40, 100, 200, 0.4) 0%, rgba(40, 100, 200, 0.2) 10%, transparent 20%);
    z-index: 100;
	-webkit-transition:2s all;
	-o-transition:2s all;
	transition:2s all;
}

.outer-ribbing {
    width: 75%;
    height: 75%;
    background: rgb(38 107 107);
    -webkit-box-shadow: 0 337px 4px rgb(0 0 0 / 84%) inset;
            box-shadow: 0 337px 4px rgb(0 0 0 / 84%) inset;
    z-index: 1;
    background: rgb(28,41,53);
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(28,41,53,1)), color-stop(36%, rgba(0,0,0,1)), to(rgba(14,240,236,1)));
    background: -o-linear-gradient(top, rgba(28,41,53,1) 0%, rgba(0,0,0,1) 36%, rgba(14,240,236,1) 100%);
    background: linear-gradient(180deg, rgba(28,41,53,1) 0%, rgba(0,0,0,1) 36%, rgba(14,240,236,1) 100%);
}
.ribbing {
    border: 1px solid rgb(10, 10, 10);
    width: calc(100% - 8px);
    height: calc(100% - 8px);
    z-index: 1;
    background: -o-radial-gradient(circle, rgb(0 0 0) 0%, rgba(0,0,0,1) 100%);
    background: radial-gradient(circle, rgb(0 0 0) 0%, rgba(0,0,0,1) 100%);
    margin-top: calc(2% - 8px);
}
.ribbing2 {
    border: 2px solid rgb(10, 10, 10);
    width: calc(100% - 8px);
    height: calc(100% - 8px);
    z-index: 1;
    background: -o-radial-gradient(circle, rgb(0 0 0) 0%, rgba(0,0,0,1) 100%);
    background: radial-gradient(circle, rgb(0 0 0) 0%, rgba(0,0,0,1) 100%);
 
}
.aperture-housing {
    width: 100%;
    height: 100%;
}
.small-lens-outer {
    width: 21%;
    height: 21%;
    background: -webkit-gradient(linear, left bottom, left top, from(rgb(30, 30, 30)), to(rgb(0, 0, 0)));
    background: -o-linear-gradient(bottom, rgb(30, 30, 30), rgb(0, 0, 0));
    background: linear-gradient(0deg, rgb(30, 30, 30), rgb(0, 0, 0));
}

.small-lens-inner {
    background: rgb(0, 0, 0);
    width: 70%;
    height: 70%;
    background: conic-gradient(rgb(0 0 0 / 85%), rgba(0, 0, 0, 0), rgba(80, 180, 200, 0.6), rgb(0 0 0 / 60%), rgba(0, 0, 0, 0), rgb(0 0 0), rgba(0, 0, 0, 0), rgb(0 0 0 / 86%), rgba(200, 240, 100, 0.2), rgb(0 0 0), rgb(0 0 0)), -o-radial-gradient(10% 10%, circle, rgb(0 0 0 / 80%) 0%, rgb(20 20 20 / 60%) 20%, transparent 40%);
    background: conic-gradient(rgb(0 0 0 / 85%), rgba(0, 0, 0, 0), rgba(80, 180, 200, 0.6), rgb(0 0 0 / 60%), rgba(0, 0, 0, 0), rgb(0 0 0), rgba(0, 0, 0, 0), rgb(0 0 0 / 86%), rgba(200, 240, 100, 0.2), rgb(0 0 0), rgb(0 0 0)), radial-gradient(circle at 10% 10%, rgb(0 0 0 / 80%) 0%, rgb(20 20 20 / 60%) 20%, transparent 40%);
}

.tiny-lens-outer {
  width: 70%;
  height: 70%;
}

.tiny-lens-inner {
  width: 60%;
  height: 60%;
  border: 2px solid rgb(0, 0, 0, 0.6);
  -webkit-filter: blur(1px);
          filter: blur(1px)
}
.shine {
    position: absolute;
    background: -webkit-gradient(linear, left top, left bottom, from(rgb(0 0 0 / 0%)), to(rgb(0 0 0)));
    background: -o-linear-gradient(top, rgb(0 0 0 / 0%), rgb(0 0 0));
    background: linear-gradient(180deg, rgb(0 0 0 / 0%), rgb(0 0 0));
    width: 36rem;
    height: 32rem;
    top: -5.4rem;
    left: -4.2rem;
    -webkit-transform: rotate(183deg);
        -ms-transform: rotate(183deg);
            transform: rotate(183deg);
    opacity: 1;
}
.shadow {
  width: 16rem;
  height: 10rem;
  background: rgba(0, 0, 0, 0.7);
  position: absolute;
  bottom: -2rem;
  z-index: -1;
  border-radius: 100%;
  -webkit-filter: blur(40px);
          filter: blur(40px)
}
.shadowlens {
    width: 131%;
    height: 131%;
    -webkit-box-shadow: inset 32px 71px 49px 20px #000;
            box-shadow: inset 32px 71px 49px 20px #000;
    border-radius: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    position: absolute;
}				
.imgshiftcenter  {
    -webkit-transition-timing-function: cubic-bezier(0.230, 1, 0.320, 1);
         -o-transition-timing-function: cubic-bezier(0.230, 1, 0.320, 1);
            transition-timing-function: cubic-bezier(0.230, 1, 0.320, 1);
    -webkit-transform: translatey(3300px);
        -ms-transform: translatey(3300px);
            transform: translatey(3300px);
}
.imgshiftup  {
    -webkit-transition-timing-function: cubic-bezier(0.230, 1, 0.320, 1);
         -o-transition-timing-function: cubic-bezier(0.230, 1, 0.320, 1);
            transition-timing-function: cubic-bezier(0.230, 1, 0.320, 1);
    -webkit-transform: translatey(-3300px);
        -ms-transform: translatey(-3300px);
            transform: translatey(-3300px);
}	
	.loader_img-wrap {
    -webkit-transition:4s all;
    -o-transition:4s all;
    transition:4s all;
}
	.loader_column-inner { -webkit-transition:4s all; -o-transition:4s all; transition:4s all;} 



}




@media only screen and (max-width: 600px) {
.start, .lastloader{
    display: none;
}
	
	.loader_column-inner { -webkit-transition:14s all; -o-transition:14s all; transition:14s all;} 
.imgshiftcenter  {
    -webkit-transition-timing-function: cubic-bezier(10.230, 1, 10.320, 10);
         -o-transition-timing-function: cubic-bezier(10.230, 1, 10.320, 10);
            transition-timing-function: cubic-bezier(10.230, 1, 10.320, 10);
    -webkit-transform: translatey(900px);
        -ms-transform: translatey(900px);
            transform: translatey(900px);
}
.imgshiftup  {
    -webkit-transition-timing-function: cubic-bezier(10.230, 1, 10.320, 10);
         -o-transition-timing-function: cubic-bezier(10.230, 1, 10.320, 10);
            transition-timing-function: cubic-bezier(10.230, 1, 10.320, 10);
    -webkit-transform: translatey(-900px);
        -ms-transform: translatey(-900px);
            transform: translatey(-900px);
}		
.loader_column-inner {
    -webkit-transition: 4s all;
    -o-transition: 4s all;
    transition: 4s all;
}
}