/*

WONDER
253c8c
Author: Jason/Plate

*/

/* Reset
-------------------------------------------------- */
*, *:before, *:after {
  margin: 0;
  padding: 0;
  border: 0;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}
article, aside, details, figcaption, figure,
footer, header, hgroup, main, nav, section, summary {
  display: block;
}


/* Pix
-------------------------------------------------- */
img {
  display: block;
  max-width: 100%;
  outline:none;
}


/* Links
-------------------------------------------------- */
a {
  color: inherit;
  text-decoration: none;
  /*transition: color .3s, background .3s, border .3s;*/
}
a:hover {
  /*color: red;*/
}


/* Misc
-------------------------------------------------- */
.cf:after {
	content: "";
	display: table;
	clear: both;
}
.no-gutter {
	margin:0; padding:0;
}
.table {
	display: table;
	height:100%;
	margin-bottom:0;
	background:none !important;
	}
.table .tr {
	display: table-cell;background:none !important;
	vertical-align: middle;
	}
.preload {
	position:absolute;
	z-index:99;
	left:50%;
	top:50%;
	background:url(../images/282.GIF) no-repeat;
	width:40px;
	height:40px;
	margin-left:-20px;
	margin-top:-20px;
	display:none;
}

strong, b {
	font-weight:600;
}
p {
	margin-bottom:1.7em;
}
.fluid {
	width:100%;
	height:auto;
}


/* Bootstrap override
-------------------------------------------------- */
.container {
	
}
@media (min-width: 1200px) {
    .container{
        /*max-width: 1200px;*/
    }
}

/* Site
-------------------------------------------------- */
html {
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
	overflow-y:visible;
	height:100%;
	
}
body {
	margin: 0; padding: 0;
	font-size: 0.8em;
	font-weight:400;
	letter-spacing:0.5px;
	font-family: 'Open Sans', sans-serif;
	line-height: 1.55em;
	color: #333;
	background:#fff;
}
#fullpage {
	display:none;
}
.preloader {
	width:32px; 
	height:32px;
	background:url(../images/timer.gif) no-repeat;
	position:fixed;
	top:50%; left:50%;
	margin-top:-16px;
	margin-left:-16px;
	display:none;
}
.nothome {
	/*display:none;*/
	border:1px solid red;
}
/*#projects, #about, #news, #contact {
	display:none;
}*/
.background {
	display:none;
	position:absolute;
	width:100%;
	height:500vh;
	top:0;
	z-index:-1;
	background:url(../images/bg2.jpg) repeat;
	overflow:hidden;
}
.background-each {
	width:100%;
	height:100vh;
	position:relative;

}
.graffiti-holder {
	position:absolute;
	width:100%;
	height:500vh;
	top:0;
	z-index:-1;
}
.graffiti {
	position:absolute;
	top:250vh;
	mix-blend-mode: multiply;
}
.graffiti2 {
	position:absolute;
	top:-10%;
	right:0%;
	margin-left:-600px;
	z-index:999;
	mix-blend-mode: multiply;
}
.graffiti3 {
	position:absolute;
	top:50%;
	left:50%;
	margin-left:-600px;
	margin-top:-250px;
	z-index:999;
	mix-blend-mode: multiply;
}
.graffiti5 {
	position:absolute;
	top:0;
	left:50%;
	margin-left:-100px;
	margin-top:-220px;
	z-index:999;
	mix-blend-mode: multiply;
}
#bg-our-work {
	background:url(../images/bg-contact.png) repeat-x top center;
}
#bg-about {
	background:url(../images/bg-about.png) repeat-x top center;
}
#bg-contact {
	background:url(../images/bg-full.jpg) repeat-x top center;
}
#bg-news {
	background:url(../images/bg-news.png) repeat-x bottom center;
}

#contact {
	background:url(../images/contact-bg.jpg) no-repeat center center;
}



/* Masthead
-------------------------------------------------- */



/* Misc
-------------------------------------------------- */

.curtain {
	position:fixed;
	width:100%;
	height:100%;
	background:#fff;
	top:100vh;
	opacity:1;
	z-index:9999;
	display:none;
}
.mask {
	position:fixed;
	width:100%;
	height:100%;
	background-color:#000;
	z-index:9999;
}

/* Navigation
-------------------------------------------------- */
#m-bar {
	display:none;
}
.menu-fixed {
	text-transform:uppercase;
	font-family:'Raleway', sans-serif;
	font-weight:700;
	line-height:225%;
	z-index:99;
	position:fixed;
	left:25px;
	top:25px;
	font-size:1.15em;
}
.menu-fixed-each {
	color:#fff;
	padding:4px 10px;
	background:#111;
	cursor:pointer;
	-webkit-transition: background-color .3s;
	-moz-transition: background-color .3s;
	-o-transition: background-color .3s;
	transition: background-color .3s;
	opacity:0;
}
.menu-fixed .active {
	color:#fff;
	background:#f30;
}
#menu-cats {
	display:none;
}
.menu-cats-each {
	color:#111;
	padding:4px 0px;
	margin:0em;
	background:#fff;
	cursor:pointer;
}
.menu-cats-active{
	color:#F30;
}

.menu{
	text-transform:uppercase;
	font-family:'Lato', sans-serif;
	font-weight:400;
	line-height:180%;
	z-index:999;
	position:fixed;
	right:0;
	top:0;
	height:100%;
	color:#fff;
	background:url(../images/bg-dark-m.png) repeat;
	transition: transform .3s;
    -moz-transition: transform .3s;
	-o-transition:transform .3s;
    -webkit-transition: transform .3s;	
	padding:65px 20px 0 20px;	
	transform: translateX(100%);
	
}
.menu-each {
	border-top:1px solid #35353c;
	padding:5px 0;font-size:1.15em;
}
.menu-drop {
	display:none;
	cursor:pointer;
}
.menu-drop-each {
	border-top:1px dotted #12121b;
	padding:3px 0;
}
.menu-each-holder .menu-each:last-of-type {
	border-bottom:1px solid #35353c;
}
.menu-each-holder .menu-each:first-of-type {
	border-top:1px solid #35353c;
}

.menu-each a {
	padding-right:60px;
}

.menu-each a{
	color:#935c20;
	transition: color .3s;
    -moz-transition: color .3s;
	-o-transition:color .3s;
    -webkit-transition: color .3s;	
}
.menu-each a:hover{
	color:inherit;
	text-decoration:none;
	opacity:1;
}
.menu-active a{
	opacity:1;
	color:#12121b;
}

.slideOut {
	transform: translateX(0%);
}
#holder {
	transition: transform .4s;
    -moz-transition: transform .4s;
	-o-transition:transform .4s;
    -webkit-transition: transform .4s;
}
.holderSlide {
	transform: translateX(-10%);
}
.arr-menu {
	width:50px;
	padding-right:20px;
	padding-bottom:20px;
	margin-top:20px;
	position:absolute;
	right:0;
	top:0;
	cursor:pointer;
}
.logo-menu {
	width:150px;
}


.menu-holder {
	background:white;
	padding:12px 30px;
	position: fixed;
	top:0; width:100%;

	z-index:10001;
}
.nav-up {
    transform: translateY(-100%);
}
.nav-down {
    transform: translateY(0);
}
.menu-holder .logo {
	height:50px;
}
.menu-holder .logo-each {
	float:left;
	height:100%;
	margin-right:15px;
}
.menu-holder .logo-fox {
	width:80px;
}
.menu-holder .logo-tw {
	width:110px;
}
.menu-holder .logo a{
	color:#111;
}
.menu-links {
	text-align:right;
	top:0;
	right:0px;
	position:absolute;
	height:100%;
}
.menu-gap {
	visibility:hidden;
	cursor:default;float:right;
}
.menu-links {
	color: #999;
	cursor:default;
	padding-top:5px;
}
.add-share {
	cursor:pointer;
}
.add-share-holder {
	color:#fff;
}
.at-share-btn-elements {
	top:2px;
	position:relative;
}
/*.at-icon-wrapper  {
	line-height: 24px; height: 24px; width:24px;
}
.at-icon-wrapper .at-icon {
	height: 24px; width:24px;
}*/
.menu-links .table, .menu-links .tr {
	border:0px solid green;
}
.menu-link-each {
	color: #999;
	cursor:default;
	float:right;
	position:relative;
}
.menu-link-each:hover, .add-share:hover {
	text-decoration: none;
	color: #1E5A74;
}
.menu-link-each a:hover {
	text-decoration: none;
	color: #1E5A74;
}
.menu .active {
	color: #f60;
	text-decoration:none;	
}
.menu .active a {
	color: #f60;
	text-decoration:none;
}

.menu-holder-fixed {
	padding:0px 0px;
	width:100%;
    position: fixed;
	top:0;
	background:#fff;
    z-index: 98;
	padding:30px 0px;
	display:none;
}
.menu-holder-fixed .logo {
	width:110px;
	opacity:0;
}



.menu li {
	list-style: none;
}
.menu > li {
	position: relative;
}
.menu > li > a {
	padding: .2em 0;
	font-weight: 600;
}
.menu ul {
	padding:0;
	margin:0;
}
.deets {
	font-size:0.9em;
	-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
	display:inline;
color:#099;
border:2px solid #9fc;
padding:8px 15px;

	
}
.deets .fa {

	font-size:3em;
	line-height:0;
}
.deets:hover {
	cursor:pointer;
	opacity:0.7;
	color:#0C9;
}

/** Mobile menu **/
.menu-mobile {
	display:none;
	width:100%;
	position:fixed;
	z-index:99;
	top:0;
}
.menu-mobile-bar {
	background:none;
	width:100%;
	color:#fff;
	padding:10px 15px;
	position:relative;
	z-index:3;
	display:none;
}

.patty {
	position:fixed;
	z-index:998;
	right:0px;
	top:0px;
}
.patty .navicon {
	font-size:0.9em;	
}
.patty {
	cursor:pointer;
	padding:20px 20px;
}

.menu-mobile-bar a {
	color:#fff;
}
.menu-holder-m {
	position:absolute; top:0;
	text-align:center;
	background:#173344;
	width:100%;
	padding-top:20px;
	padding-bottom:35px;
	margin-top:0px;
	display:none;
	font-size:0.9em;
}

.menu-holder-m .menu-links {
	text-align:center;
	position:relative;
	font-size:1.2em;
}
.menu-holder-m .menu-link-each {
	width:100%;
	padding-top:5px;
	padding-bottom:5px;
	border-top:1px dotted #1E5A74;
}
.menu-holder-m .active {
	
}
.menu-holder-m .active a {
	text-decoration:none;
	color:#fff;
}
.menu-holder-m .menu-link-each {
	color: #5890a8;
}

.menu-holder-m .add-share {
	color: #5890a8;
	margin-top:5.5em;
	padding-top:5.5em;
}
.menu-journeys {
	overflow:visible;
}
.menu-journeys .no:hover {
	color:inherit;

}
.menu-journeys a.active {
	color:#f60;
}
.menu-journeys a.active:hover {
	color:#f60;
}
.menu-journeys a:hover {
	color:#ccc;
	}
.submenu {
	display:none;
	position:absolute;
	text-align:left;
	left:0;
	color:#a3a3a3;
	background:#222;
	margin-top:0px;
	margin-left:-1em;
	padding:1em;
	border-top:10px solid white;
	padding-top:0;
	padding-bottom:0.6em;
	width:160px;
	line-height:135%;
	overflow:hidden;
}
.submenu .sub-each {
	border-top:1px dotted #666;
	padding:7px 0;
}
.submenu a.active, .submenu a.active:hover {
	color:#fd6f10;
	cursor:default;
}


/* Headings
-------------------------------------------------- */

h1 {
	font-size:1.5em;
	line-height:110%;
}
h2 {
	font-size:0.5em;line-height:1.1em;
	font-style:italic;
}
h3 {
  font-size: 1.3em;
  font-style:italic;
  line-height: 1.4em;
  font-weight: 400;
  margin-bottom: 1.05em;
}
h4 {
  font-size: 1.125em;
  font-weight: 600;
  line-height: 1.5em;
  margin-bottom: .5em;
  color: red;
}
h1 a, h2 a, h3 a, h4 a {
  color: inherit;
  border: 0 !important;
}
/*.caption {
	font-style:italic;
	margin-top:8px;
}*/
.link, .link a  {
	color: #928660;
}
.link:hover {
	color: #000;
	text-decoration: none;
	cursor:default;
}
.link a:hover  {
	color: #000;
	text-decoration: none;
}


/* General
-------------------------------------------------- */

.section-ttl {
	text-transform:uppercase;
	margin-bottom:18px;
	display:inline-block;
	border-bottom:1px dotted #F93;
}
.section-header {
	text-transform:uppercase;
	font-family:'Lato', sans-serif;
	font-weight:300;
	font-size:2.9em;
	line-height:120%;
	margin-bottom:40px;
}
.section-txt {
	margin-bottom:80px;
}
.alt-col {
	color:#e8d5af;
}
.pad {
	padding:0 8px;
}
.btn {
	color:#111;
	background:#cf9250;
	font-size:0.9em;
}
.btn:hover {
	color:#cf9250;
	cursor:pointer;
}
.btn-show-list {
	padding:3px 0px;
	margin-top:12px;
	cursor:pointer;
	font-size:0.9em;
	border-top:1px dotted #836341;
}
.btn-show-list:hover {
	
	padding-left:15px;
}
.btn-show-list a:hover {
	text-decoration:none;
	color:#e8d5af;
}
.backtotop {
}
.backtotop:hover {
	color:#e8d5af;
	cursor:pointer;
}

/* Home
-------------------------------------------------- */
.home-visual {
	position:absolute;
	width:100%; border:1px solid red;
	top:0;
	text-align:center;
	z-index:-1;
}
#home {
	background:url(../images/new-home-visual.png) no-repeat center top;
}
.home-visual img {
	margin:auto;
}
.home-logo {
	max-width: 950px;
	width:90%;
	margin:auto;
	margin-top:20px;
		opacity:0;
	-webkit-transition: all 1200ms ease-out;
    -moz-transition: all 1200ms ease-out;
    -o-transition: all 1200ms ease-out;
    transition: all 1200ms ease-out;
}

.home-logo .bywj {
	float:right;
	padding-right:5px;
	opacity:0;
}

.home-bulb {
	position:absolute;
	z-index:99;
	width:100%;
	top:25%;
	margin-top:20px;
	text-align:center;
	
}

.home-bulb .img {
	position:absolute; 
	width:160px;
	margin-top:0px;
	transform: translate(-50%, 0%);
	top:0px; left:50%;
    /*-webkit-transition: all 1200ms ease-out;
    -moz-transition: all 1200ms ease-out;
    -o-transition: all 1200ms ease-out;
    transition: all 1200ms ease-out;*/
}
#home .home-bulb {
	top:0px;
	text-align:center;
}

#home .home-bulb .img {
	position:absolute; 
	transform: translate(-50%, 0);
	top:0px; left:50%;
}

.mask .bulb-1 {
	opacity:0;
}
.mask .bulb-2 {
	opacity:1;
}
.loader {
	position:absolute;
	bottom:0;
	z-index:99;
	width:60px;
	margin-left:-30px;
	top:175px;
	left:50%;
	display:none;
}
@media (max-width: 576px) {
/*.home-bulb img {
	width:28%;
	margin-top:40px;
}*/
}
/* Opera and prob css3 final iteration */
@keyframes blink {
    0% {
        opacity:0.5;
    }
    33% {
        opacity:0;
    }
    66% {
        opacity:0.5;
    }
    100% {
        opacity:0;
    }
} 
.blink-image {
    -moz-animation: blink normal 0.25s  ease; /* Firefox */
    -webkit-animation: blink normal 0.25s  ease; /* Webkit */
    -ms-animation: blink normal 0.25s  ease; /* IE */
    animation: blink normal 0.25s  ease; /* Opera and prob css3 final iteration */
}

/* Projects
-------------------------------------------------- */
 .hero-holder {
	width:90%; /** Width of hero **/
	margin:auto;
	background:url(../images/page-texture.jpg) repeat;
	padding:12px;
	padding-bottom:30px;
	z-index:0;position:relative;
}
 .hero {
	width:100%;
	position:relative;
	border:5px solid #c78b39;
}	
 .maximage {
	width:100%; height:100%;
	position:absolute !important;
}
.dummy {
	border:7px solid #fcf9f4;
}

.proj-title {
	font-size:0.8em;
	line-height:145%;
	padding-top:0px;
	position:absolute;
	text-transform:uppercase;
	bottom:9px;
	z-index:100;
}
.torn-bottom-right {
	position:absolute;
	z-index:99;
	right:-5px;
	bottom:-4px;
	margin-bottom:-1px;
	margin-right:-1px;
}
.proj-circle {
	-webkit-clip-path: circle(50% at 50% 50%);
	clip-path: circle(50% at 50% 50%);
}
.thumb-cat {
	position:relative;
	margin:15px;
	background: #F66;
	color:#FFF;
}
 .thumb-cat .overlay {
	opacity:1;
	background:none;
}
.proj-num {
	opacity:0;
}
 .thumb {
	color:#FFF;
	position:relative;
	margin:15px;
	background: none;
}

 .slick-proj {
	width:90%;
	margin:auto;
}

.overlay {
	position:absolute;
	z-index:999;
	opacity:0;
	width:100%;
	height:100%;
	text-align:center;
	text-transform:uppercase;
	background:url(../images/bg-dark-2.png) repeat;
	transition: opacity .3s;
    -moz-transition: opacity .3s;
	-o-transition:opacity .3s;
    -webkit-transition: opacity .3s;	
	padding:15px;
	line-height:180%;
}

.headline {
	font-family: 'Raleway', sans-serif;
	font-weight:700;
	line-height:130%;
	cursor:default;	cursor:pointer;
	font-size:1.1em;
}
.launch {
	opacity:0.8;
}
.launch .liner {
	border-bottom:2px dotted #069;
	width:50%;
	height:8px;
	
}
.thumb .overlay {
	opacity:0;
	/*margin-left:500px;*/
}
.thumb:hover > .overlay {
	opacity:1;
	/*margin-left:0px;*/
}

.thumb-ttl {
	color:#e8d5af;
	margin:0px 8px;
	margin-bottom:30px;
}
 .badge-projects {
	position:absolute;
	z-index:99;
	width:120px;
	right:-30px;
	top:50%;
	margin-top:-60px;
}
.badge-projects2 {
	position:absolute;
	z-index:99;
	width:220px;
	right:-50px;
	top:50%;
	margin-top:100px;
	opacity:0;
}
.badge-projects:hover, .badge-projects2:hover {
	cursor:pointer;
}
/* {
	background:url(../images/bg-contact.png) repeat-x top center;
}
#contact {
	background:url(../images/bg-full.jpg) repeat-x top center;
}
#news {
	background:url(../images/bg-news.png) repeat-x bottom center;
}*/


/* Single project
-------------------------------------------------- */
#curr-proj {
	line-height:165%;
}
#curr-proj .title {
	font-family: 'Raleway', sans-serif;
	font-weight:900;
	color:#333;
	font-size:3em;
	padding:0px 0px;
	margin-top:10px;
	line-height:140%;
	text-transform:uppercase;
}
#curr-proj .txt {
	color:#555;
	padding-top:10px;
	
}
.txt-info {
	color:#333;
	font-weight:bold;
	text-transform:uppercase;
	padding-right:30px;
}
.capt {
	margin-top:10px;
	margin-bottom:20px;
	color:#555;
}
.curr-proj-close {
	position:fixed;
	width:110px;
	right:0;
	top:0;
	padding:30px 30px;
	display:none;
	cursor:pointer;
}
.thumbnum {
	font-weight:400;
	color:#000;
	font-size:1.3em;

}
.num-holder {
	margin-top:10px;
}
.arr-num {
	color:#FFF;
	font-size:1.75em;
	display:none;
}
.arr-num:hover {
	color:#000;
	cursor:pointer;
}
.news-num {
	width:100%;
	border:0px solid red;
	text-align:right;
	margin-top:-10px;
}
.news-num .arr-num:hover {
	color:#fff;
	cursor:pointer;
}

/* About
-------------------------------------------------- */
/*#about {
	background:url(../images/bg-about.png) repeat-x top center;
}*/

.about-page {
	border:0px solid blue;
	padding:20px;
	padding-bottom:0;
	background:url(../images/page-border.png) repeat;
}
.about-page-text {
	border:0px solid red;
	background:url(../images/page-texture.jpg) repeat;
}
.badge-what-we-do {
	position:absolute;
	z-index:99;
	width:36%;
	right:4%;
	margin-top:-5%;
}
.badge-good-vibes {
	position:absolute;
	z-index:99;
	margin-top:-5%;
	right:5%;
	width:80%;
}
.badge-mario {
	position:absolute;
	z-index:99;
	width:37%;
	right:2%;
	top:40%;
}
.badge-bottom-poster {
	width:100%;
	text-align:right;
}
.badge-bottom-poster img {
	text-align:right;

}


/* Arr
-------------------------------------------------- */
.arr {
	width:70px;
	position:absolute;
	top:50%;
	  /* vertically center */
	-webkit-transform: translateY(-50%);
			transform: translateY(-50%);
			z-index:99;
}
.arr:hover {
	cursor:pointer;
}
/*.arr-left {
	left:-32px;
}
.arr-right {
	right:-30px;
}*/
.arr-disable {
	opacity:0.3;
}




/* Thumbnails
-------------------------------------------------- */

.thumbnails {
	width:100%;
	padding:0 10px;
}
.thumb-holder {
	position:relative;
	border:0px solid red;
	height:100%;	
}
.thumb-img {
	overflow:hidden;
	position:absolute;
	top:0px; left:0px;
	width:100%;
	height:auto;
}
.thumb-img img:hover {
	opacity:0.7;
}
.thumbnails .fluid {
	visibility:hidden;
}
.thumb-holder .txt-holder {
	padding-right:1em;
}
.thumb-holder .text {
	padding:0;
}
.thumb-holder .ttl {
	font-size:1em;
	line-height:1.25em;
	margin:15px 0 6px 0;
}
.thumb-holder a{
	color: #999;
}
.first {
	padding-right:1em;
}
.grid-item {
	margin:0;
	padding:0 1em;
	margin-bottom:2.5em;
}
.grid-item img {
	width:100%;
	height:auto;
	padding:0px;
}

/* fluid 5 columns */
.grid-sizer,
.grid-item {  }
/* 2 columns */
.grid-item--width2 { width: 40%; }


#contact .text a {
	text-decoration:underline;
	color:inherit;
}

/* Share
-------------------------------------------------- */

.visual-news-1 {
	position:absolute;
	width:100%; height:100%; top:0; z-index:-1;
	background:url(../images/visual-news-1.png) no-repeat center center;
}

/* Share
-------------------------------------------------- */

.share .fa {
	font-size:1.1em;
	color:#fff;
	background-color:#999;
	width:24px; height:24px;
	border-radius: 24px;
	text-align:center;
	-moz-border-radius: 24px;
	-webkit-border-radius: 24px;
	margin-right:5px;
	margin-top:5px;
}
.share .fa:hover {
	background:#ccc;
}
.share .fa-twitter {
	padding:5px;
}
.share .fa-facebook {
	padding:5px;
	padding-left:4px;
}
.share .fa-google-plus  {
	font-size:1.0em;
	padding:6px;
	padding-left:4px;
	margin-left:-1px;

}

/* Footer
-------------------------------------------------- */
.footer {
	position:fixed;
	z-index:999;
	bottom: 0px; 
	left:0px;
	color:#fff;
	padding:50px 0;
	text-align:center;
	width:100%;
	
}
.footer a {
	text-decoration:none;
}
.footer a:hover {
	color:inherit;
	text-decoration:underline;
}
.copyright {
	display:inline;
	font-size:0.85em;
	text-transform:uppercase;
	padding:5px 20px;
	background:black;
}
.copyright a {
    text-decoration:none;
   
}
.txt-past a {
	border-bottom:1px dotted #cf9250;
	padding-bottom:px;
}
.txt-back {
	text-transform:uppercase;
	
}
.txt-back a {
	
}
.txt-back a:hover, .txt-past a:hover {
	color:#e8d5af;
	text-decoration:none;
}


/* Slick UI
-------------------------------------------------- */
.caption-holder {
	position:absolute;
	padding-top:10px;
	width:100%;
	font-size:0.9em;
	left:15px;
	padding-right:30px;
	text-align:center;
	
}
.gall-num  {
}
.caption {
	text-transform:uppercase;	
}


/* Video
-------------------------------------------------- */

.videoWrapper {
position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden;width:100%; max-width: 100%;
}
.videoWrapper iframe, .videoWrapperobject, .videoWrapper embed {
 position: absolute; top: 0; left: 0; width: 100%; height: 100%; 
}

/* FX
-------------------------------------------------- */

.circle {
  animation: 1s circle;
  opacity:1;
}

@keyframes circle {
  from {
    -webkit-clip-path: circle(200px);
    clip-path: circle(200px);
	
  }
  to {
    -webkit-clip-path: circle(200px);
    clip-path: circle(200px);
  }
}

/* New
-------------------------------------------------- */
.section {
	border:0px dotted green;
	padding:0;
}

.assets-holder {
	border:0px solid blue;
	position:absolute; top:50%;
	padding:0; height:1px;
	width:100%;
}
.assets-holder-top {
	border:0px solid red;
	position:absolute; top:0;
	padding:0; height:1px;
	width:100%;
}
.ico-holder {
	position:fixed;
	right:0; top:0;
	z-index:99;
	padding:25px;
	text-align:right;
}
.ico {
	width:28px;
	margin-left:10px;
}

#home .home-wonder {
	z-index:99;
	position:relative;
	width:750px;
	margin:auto;
	margin-top:-70px;
}
#home .home-circle {
	z-index:90;
	width:360px;
	margin-top:-220px;
	margin-left:0px;
}
#home .home-woman {
	z-index:90;
	width:440px;
	margin-left:680px;
	margin-top:-380px;
}
#home .home-by-wj {
	z-index:90;
	text-transform:uppercase;
	font-weight:600;
	color:#FF6;
	font-size:1.1em;
	margin-left:600px;
	margin-top:100px;
}
#home .home-shape-yellow {
	z-index:90;
	width:340px;
	margin-left:320px;
	margin-top:-250px;
}
#home .home-shape-black {
	z-index:90;
	width:180px;
	margin-left:920px;
	margin-top:120px;
}

 .home-shape-black {
	z-index:90;
	width:180px;
	margin-left:0px;
	margin-top:-200px;
}

 .home-circle-yellow {
	z-index:999;
	width:260px;
	margin-top:-130px;
	margin-left:550px;
}
 .art-bee{
	z-index:90;
	width:340px;
	margin-top:-410px;
	margin-left:200px;
}

.bg-line-home {
	width:45%;
	position:absolute;
	top:0px;
	left:0;
}
 .bg-line {
	width:100%;
	position:absolute;
	top:-300px;
	left:0;
}

.proj-text {
	font-size:0.925em;
	line-height:145%;
	margin-top:8em;

}

.foo {
background:#B6DAD6;
-webkit-transition:background 1s;
-moz-transition:background 1s;
-o-transition:background 1s;
transition:background 1s
}


.new-home-visual {
	position:absolute;
	top:0;
	width:100%;
	height:350px;
	text-align:center;
	overflow:hidden;
	background: url(../images/new-home-visual.png) center top no-repeat;
}
.new-home-visual img {
	margin:auto;
}
.new-home-bulb { 
	width:160px;
	margin:auto;
	margin-top:30px;
}


/* Landscape phones and down */
@media (max-width: 576px) {
	.logo-main {
		width:100%;
		max-width:850px;
		margin:auto;
		margin-top:-5%;
	}
	.new-home-bulb {
	width:100px;
	margin:auto;
	margin-top:30px;
}
.copyright {
	display:inline;
	font-size:0.8em;
	text-transform:uppercase;
	padding:0px 0px;
	background:black;
}	
}

/* News
-------------------------------------------------- */
.slick-news {
	padding:50px;
}
.thumb-news {
	padding:0px;
}
.thumb-news .overlay {
	position:absolute;
	z-index:999;
	opacity:1;
	width:100%;
	height:100%;
	text-align:left;
	text-transform:uppercase;
	background: none;
	transition:none;
	padding:30px;
	border:0px solid red;
	padding-right:45px;color:#036;
	
}
.thumb-news .headline {
	cursor:default;
	font-size:1.25em;
}
.thumb-news .dates {
	letter-spacing:0;
}
.thumb-news a {
	text-decoration:none;
	color:#036;
	border-bottom:1px solid #036;
}
.thumb-news a:hover {
	opacity:0.5;
}
.news-cat-each {
	opacity:0.5;
	cursor:pointer;
	padding-bottom:1px;
}
.news-cat-each:hover {
	opacity:1;
}
.thumb-news .active {
	opacity:1;
	cursor:default;
}
.news-cat-all {
	padding-top:5px;
}
.news-num {
	color:#036;
	width:100%;
	border:0px solid red;
	text-align:right;
	margin-top:-10px;
}
.news-num .arr-num {
	color:#f60;
	font-size:1.8em;
	display:none;
}
.news-num .arr-num:hover {
	color:#036;
	opacity:0.5;
	cursor:pointer;
}


/* Contact
-------------------------------------------------- */
.contact-box {
	width:280px; height:350px;
	position:absolute;
	line-height:140%;
	padding:40px 20px 10px 20px;
	top:50%; margin-top:-180px;
	left:50%; margin-left: -115px;
	color:#000;
}
.contact-box .fa {
	font-size:1.6em;
}
.contact-box span {
	background:#FF9;
}
.ctrl-holder-all {
	width:100%;
	position:fixed;
	background:#000;
	z-index:999;
	font-size:1.1em;
	padding:10px 0px;
	bottom:0px;
	transition: transform .3s;
    -moz-transition: transform .3s;
	-o-transition:transform .3s;
    -webkit-transition: transform .3s;
	display:none;
}
.ctrl-up {
    transform: translateY(0);
}
.ctrl-down {
    transform: translateY(100%);
}
.ctrl-holder {
	text-align:left;
	line-height:150%;
	margin:auto;
	display:none;
}
#filter-for-news {
	display:block;
}
.ctrl {
	background:#000;
	color:#fff;
	padding:5px 10px 0px 10px;
}
.ctrl-news {
	position:absolute;
	right:0px;
	top:0px;
}
.ctrl-holder .arr-num {
	color:#F96;
	font-size:1.6em;
}
.ctrl-holder .thumbnum {
	color:#fff;
	font-size:1.05em;
}
.ctrl-pop {
	position:absolute;
	left:15px;
	bottom:2.5em;
	z-index:99;
	padding:1em 15px;
	display:none;
	background:#000;
	color:#FFF;
}
.ctrl-pop .filter-each {
	text-transform:uppercase;
	padding:2px 0;
}
.ctrl-pop .filter-active {
	color:#F90;
}
.filter-btn {
	background:#000;
	color:#fff;
	padding:0px 15px;
}