:root {
    --yellow: #edb81b;
		--yellowlight: #edcd1b;
    --gray: #7a7a7a;
		--darkgray : #1a1a1a
}
  body {font-family:"Source Serif Pro", sans-serif; margin:0; color:#000; font-size:0px; overflow-x:hidden; background:#000}
	* {box-sizing:border-box}
	input, select, textarea, button { -webkit-appearance:none; border:none}
	a {text-decoration: none;}
	.ltr {direction:ltr}
	.rtl {direction:rtl}
	.fixed {position: fixed;}
	.motion-ease{-webkit-transition:all 0.2s ease;-moz-transition:all 0.2s ease;-o-transition:all 0.2s ease}
	.black {color:#000}
  .bg-black {background-color:#000}
	.white {color:#FFF}
  .bg-white {background-color:#FFF}
  .yellow {color: var(--yellow)}
  .bg-yellow {background-color: var(--yellow)}
  .gray {color: var(--gray)}
  .bg-gray {background-color: var(--gray)}
	.darkgray {color: var(--darkgray)}
	.bg-darkgray {background-color: var(--darkgray)}
  .center {text-align:center}
  .left {text-align:left}
  .right {text-align:right}
	.title {font-size:42px}
	.subtitle {font-size:28px}
	.text {font-size:16px; line-height:26px}
	.center {text-align:center}
	.left {text-align:left}
	.right {text-align:right}
	.shadow {text-shadow:0px 0px 5px rgba(0,0,0,0.3)}
	.caps {text-transform:uppercase}
	.wrapper {width:100%; max-width:1420px; margin:0 auto}
	.padding-section {padding:100px 0px}
	.small-wrapper {width:100%; max-width:850px; margin:0 auto}
	.btn {margin:10px 0px; padding:10px 60px; cursor:pointer; font-family:"Source Serif Pro"; font-weight:bold}
	.btn-yellow {color:#000; background-color:var(--yellow)}
	.btn-yellow:hover {color:#000; background-color:var(--yellowlight)}
  .hr-yellow {border:1px solid var(--yellow); transform:scale(1,0.5)}

	.menuOff {transform:translateX(-200vw)}
	.menuOn {transform:translateX(0vw)}

	.separator {width:100%; display:table; table-layout:fixed; height:50px}
	.separator .line {width:100%; display:table-cell; vertical-align:middle}
	.separator .icon {width:70px; display:table-cell; vertical-align:middle}

	.header-fixed-top {transform:translate(0,-170%)}
	.motion-ease2 {-webkit-transition: all 0.2s linear;-moz-transition: all 0.2s linear;-o-transition: all 0.2s linear}

	.separator .line div {height:1px}

  #header {width:100%; padding:0 2%}
	#header .wrapper {display:table; width:100%; table-layout:fixed}
	#header .logo {height:120px; display:table-cell; vertical-align:middle; width:300px}
  #header .tabs {height:120px; display:table-cell; vertical-align:middle}
  #header .tab {display:inline-block; /*padding:0px 3%;*/ cursor: pointer;}
	#header .tab a {padding:2px 20px; color: var(--gray); text-decoration:none}
  #header .tab img {opacity:0}
  #header .tab:hover a {color: var(--yellow)}
  #header .tab:hover img {opacity:1}
  #header .social {display:inline-block}
	#header .social .fb-icon {width:40px; vertical-align:-20px; margin:5px; opacity:0.8}
	#header .social .twitter-icon {width:30px; vertical-align:-12px; margin:5px; opacity:0.8}
	#header .social .fb-icon:hover {opacity:1}
	#header .social .twitter-icon:hover {opacity:1}
	#header .burger {display:none}

	#header-fixed {width:100%; padding:0 2%; z-index: 1000;}
	#header-fixed .wrapper {display:table; width:100%; table-layout:fixed}
	#header-fixed .logo {height:120px; display:table-cell; vertical-align:middle; width:300px}
  #header-fixed .tabs {height:120px; display:table-cell; vertical-align:middle}
  #header-fixed .tab {display:inline-block; padding:0px 3%; cursor: pointer;}
	#header-fixed .tab a {padding:2px 20px; color: var(--gray); text-decoration:none}
  #header-fixed .tab img {opacity:0}
  #header-fixed .tab:hover a {color: var(--yellow)}
  #header-fixed .tab:hover img {opacity:1}
  #header-fixed .social {display:inline-block}
	#header-fixed .social .fb-icon {width:40px; vertical-align:-20px; margin:5px; opacity:0.8}
	#header-fixed .social .twitter-icon {width:30px; vertical-align:-12px; margin:5px; opacity:0.8}
	#header-fixed .social .fb-icon:hover {opacity:1}
	#header-fixed .social .twitter-icon:hover {opacity:1}
	#header-fixed .burger {display:none}

  #mobile-menu {position:fixed; top:0; left:0; right:0; bottom:0; height:100vh; width:100vw; z-index:10001; background:#000; padding:20px}
	#mobile-menu .tab {display:inline-block; padding:15px 3%}
	#mobile-menu .tab a {padding:2px 20px; color: var(--gray); text-decoration:none}
  #mobile-menu .tab img {opacity:0; padding:5px 0px}
  #mobile-menu .tab:hover a {color: var(--yellow)}
  #mobile-menu .tab:hover img {opacity:1}
	#mobile-menu .fb-icon {width:40px; vertical-align:-20px; margin:35px 5px; opacity:0.8}
	#mobile-menu .twitter-icon {width:30px; vertical-align:-12px; margin:35px 5px; opacity:0.8}
	#mobile-menu .fb-icon:hover {opacity:1}
	#mobile-menu .twitter-icon:hover {opacity:1}

	#hero {background-repeat:no-repeat; background-position:center 5%; background-color:#000; background-size:cover; width:100%; display:table; position:relative}
	#hero .container {display:table-cell; background-color:rgba(0,0,0,0.6); height:35vw; width:100%; vertical-align:middle; padding:50px 0px}
	#hero .wrapper .left-side{width:40%; vertical-align:middle; display:inline-block; padding:0px 2%}
	#hero .wrapper .right-side {width:60%; display:inline-block; vertical-align:middle}
	#hero .wrapper .right-side .img-wrapper {width:30%; height:30vw; min-height:500px; display:inline-block; margin:0 1.5%; position:relative; overflow:hidden; border:1px solid var(--yellow)}
	#hero .wrapper .right-side .img-wrapper img {object-fit:cover; width:100%; height:30vw; min-height:500px}

	.split-alternate-wrapper .container {width:100%; display:table; overflow:hidden}
	.split-alternate-wrapper .container .content-cell {display:table-cell; width:50%; vertical-align:middle; padding:50px 5%; position:relative; z-index:1}
	.split-alternate-wrapper .bg-black .content-cell {box-shadow:0px 0px 200px 150px #000}
	.split-alternate-wrapper .bg-darkgray .content-cell {box-shadow:0px 0px 200px 150px var(--darkgray)}
	.split-alternate-wrapper .container .content-cell .address {display:inline-block}
	.split-alternate-wrapper .container .content-cell .address-pin {display:inline-block; padding:10px 20px 0px 0px}
	.split-alternate-wrapper .container .img-cell {display:table-cell; width:50%; min-height:650px; height:30vw; vertical-align:middle; position:relative}
	.split-alternate-wrapper .container .img-cell img {width:100%;height:100%; object-fit:cover}

  #about {background:#1a1a1a; width:100%; height:60vw; position:relative; overflow:hidden}
  #about .bg-icon {position:absolute; z-index:1; width:100%; height:55vw}
	#about .container {position:absolute; z-index:2; width:100%}
	#about .wrapper {padding-top:100px}
	#about .couch {position:relative; z-index:3; width:100%; height:55vw; padding-top:250px}

  .small-wrapper .news-wrapper {min-width:100%}
	.small-wrapper .news-wrapper .content .img-content {max-height:55vw; height:500px}
	.news-wrapper {width:33.33%; display:inline-block; padding:20px 20px; margin:0px 0px}
	.news-wrapper .content {width:100%}
  .news-wrapper .content .img-content {width:100%; height:15vw; position:relative}
	.news-wrapper .content .img-content img {height:100%; width:100%; object-fit:cover}

	#contact {background:url(img/bg-icon.png) no-repeat 80% center #1a1a1a; background-size:60%; width:100%; padding:50px 0px}
	#contact .wrapper {display:table}
	#contact .wrapper .cell {display:table-cell; vertical-align:bottom; width:50%; padding:15px}
	#contact .fb-icon {width:40px; vertical-align:-20px; margin:5px 20px 5px -10px; opacity:0.8}
	#contact .twitter-icon {width:30px; vertical-align:-12px; margin:5px 20px 5px -10px; opacity:0.8}
	#contact .fb-icon:hover {opacity:1}
	#contact .twitter-icon:hover {opacity:1}
	#contact .map {filter: grayscale(100%); border:1px solid var(--yellow); width:90%; height:20vw; margin:10px 0px}

	input, textarea {font-family:"Source Serif Pro", sans-serif; font-size:18px}
  input, select, textarea, button { -webkit-appearance:none; border:none}
	input.btn {margin:10px 1%}
	.short-input {border: 1px solid var(--yellow); box-sizing:border-box; width:48%; margin:5px 1%; display:inline-block; padding:10px; background:transparent; color:#fff}
	.textarea {border: 1px solid var(--yellow); box-sizing:border-box; width:98%; margin:5px 1%; padding:10px; background:transparent; color:#fff; resize:none; height:150px}
	.wpcf7-not-valid-tip{display: none;}
	.wpcf7 form.invalid .wpcf7-response-output {font-size: 14px; color: var(--yellow); display: inline-block; border: none;}

@media (max-width:1200px) {
	.small-wrapper {margin:0 auto; width:95%}
  /*
	#header .logo {height:100px; width:250px}
	#header .tabs {height:100px}
	#header .tab {padding:0px 1%}
	#header .burger {display:none}

	#header-fixed .logo {height:100px; width:250px}
	#header-fixed .tabs {height:100px}
	#header-fixed .tab {padding:0px 1%}
	#header-fixed .burger {display:none} */

  #header {width:100%; padding:0 2%}
	#header .wrapper {display:table; width:100%; table-layout:fixed}
	#header .logo {height:80px; width:250px}
	#header .tabs {height:80px}
	#header .tab {display:none}
	#header .social {display:none}
	#header .burger {display:inline-block; width:35px; cursor:pointer}
	#header .burger .bar {width:35px; height:1px; margin:4px 0px; display:inline-block}

	#header-fixed {width:100%; padding:0 2%}
	#header-fixed .wrapper {display:table; width:100%; table-layout:fixed}
	#header-fixed .logo {height:80px; width:250px}
	#header-fixed .tabs {height:80px}
	#header-fixed .tab {display:none}
	#header-fixed .social {display:none}
	#header-fixed .burger {display:inline-block; width:35px; cursor:pointer}
	#header-fixed .burger .bar {width:35px; height:1px; margin:4px 0px; display:inline-block}

	#about .bg-icon {height:65vw}
	#about .wrapper {padding-top:50px}
	#about .couch {height:75vw; padding-top:200px}
}

@media (max-width:970px) {
  /*
	#header {width:100%; padding:0 2%}
	#header .wrapper {display:table; width:100%; table-layout:fixed}
	#header .logo {height:80px; width:250px}
	#header .tabs {height:80px}
	#header .tab {display:none}
	#header .social {display:none}
	#header .burger {display:inline-block; width:35px; cursor:pointer}
	#header .burger .bar {width:35px; height:1px; margin:4px 0px; display:inline-block}

	#header-fixed {width:100%; padding:0 2%}
	#header-fixed .wrapper {display:table; width:100%; table-layout:fixed}
	#header-fixed .logo {height:80px; width:250px}
	#header-fixed .tabs {height:80px}
	#header-fixed .tab {display:none}
	#header-fixed .social {display:none}
	#header-fixed .burger {display:inline-block; width:35px; cursor:pointer}
	#header-fixed .burger .bar {width:35px; height:1px; margin:4px 0px; display:inline-block}
  */
	#hero .wrapper .left-side{width:90%; display:block; padding:0px; margin:0 auto}
	#hero .wrapper .right-side {width:95%; display:block; margin:0 auto}
	#hero .wrapper .right-side .img-wrapper {height:55vw; min-height:auto}
	#hero .wrapper .right-side .img-wrapper img {height:55vw; min-height:auto}

	.split-alternate-wrapper .container .content-cell {display:block; width:100%; padding:5px 5% 40px;}
	.split-alternate-wrapper .container .img-cell {display:block; width:100%; min-height:450px; height:60vw}

  .news-wrapper {width:50%}
	#news .news-wrapper:nth-child(2) {display:none}
	.news-wrapper .content .img-content {height:30vw}
	#about {height:85vw}

	#contact .wrapper {display:table}
	#contact .wrapper .cell {display:block; width:100%; padding:15px}
	#contact .map {filter: grayscale(100%); border:1px solid var(--yellow); width:100%; height:50vw; margin:10px 0px}
}

@media (max-width:780px) {
	#about .bg-icon {height:80vw}
	#about .wrapper {padding-top:50px}
	#about .couch {height:105vw; padding-top:220px}
}

@media (max-width:730px) {
  #about {height:100vw}
	.news-wrapper {width:95%; margin:0px auto; display:block; padding:60px 0px}
	#news .news-wrapper:nth-child(2) {display:block}
	.news-wrapper .content .img-content {height:55vw}
}

@media (max-width:650px) {
  .title {font-size:32px}
	.short-input {width:98%}
}
@media (max-width:500px){
  #about {height:165vw}
	.split-alternate-wrapper .container .img-cell {display:block; width:100%; min-height:250px; height:30vw}
	.btn {margin:10px 0px; padding:10px 30px; cursor:pointer; font-family:"Source Serif Pro"; font-weight:bold}
}
