/*
Theme Name:   Theme Name: Futureart
Theme URI:    wp-content/themes/futureart/
Description:  Futureart Theme
Author:       Gutesha
Author URI:   http://webtnt.com
Template:     responsive
Version:      1.0.0
Text Domain:  futureart
*/

body {font-family: 'Raleway', sans-serif;}
#header {position:fixed;width:100%;top:0;z-index: 2;padding: 20px 45px 0px 45px;box-sizing:border-box;}
.header-in {float:left;width:100%;border-bottom:1px solid rgba(221, 220, 220, 0.8);padding-bottom:20px;}
.home .header-in {border-bottom:1px solid rgba(255,255,255,0.8);}
.admin-bar #header {top:32px;}
#logo {float:left !important;}

.nav_but {position: fixed;right: 35px;top: 15px;height: 50px;width: 50px;cursor: pointer;z-index: 99999;}
.admin-bar .nav_but {top:47px;}
.nav_but span {display: inline-block;position: absolute;left: 50%;top: 50%;bottom: auto;right: auto;width: 25px;height: 3px;background-color: #333333;
-webkit-transform: translateX(-50%) translateY(-50%);
-moz-transform: translateX(-50%) translateY(-50%);
-ms-transform: translateX(-50%) translateY(-50%);
-o-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
-webkit-transition: background-color 0.3s;
-moz-transition: background-color 0.3s;
transition: background-color 0.3s;}
.nav_but span::before, .nav_but span:after {content: '';width: 100%;height: 100%;position: absolute;background-color: #333333;right: 0;
-webkit-transition: -webkit-transform .3s, top .3s, background-color 0s;
-moz-transition: -moz-transform .3s, top .3s, background-color 0s;
transition: transform .3s, top .3s, background-color 0s;}
.nav_but span::before {top: -8px;}
.nav_but span::after {top: 8px;}
.active .nav_but span {background-color: rgba(255, 255, 255, 0);}
.active .nav_but span::before, .active .nav_but span::after {background-color: #333333;}
.active .nav_but span::before {top: 0;
-webkit-transform: rotate(135deg);
-moz-transform: rotate(135deg);
-ms-transform: rotate(135deg);
-o-transform: rotate(135deg);
transform: rotate(135deg);}
.active .nav_but span::after {top: 0;
-webkit-transform: rotate(225deg);
-moz-transform: rotate(225deg);
-ms-transform: rotate(225deg);
-o-transform: rotate(225deg);
transform: rotate(225deg);}

.top-menu {margin: 10px 50px 10px 0;position: absolute;right: 45px;top: -100px;
-webkit-transition: all 0.5s linear;
-moz-transition:  all 0.5s linear;
-o-transition:  all 0.5s linear;
-ms-transition:  all 0.5s linear;
transition: all 0.5s linear;}
.menu-active .top-menu {right: 45px;top:20px;}
.home .nav_but span {background-color:#ffffff;}
.home .nav_but span::before, .home .nav_but span:after {background-color:#ffffff;}
.home .active .nav_but span::before, .home  .active .nav_but span::after {background-color:#ffffff;}
.home .active .nav_but span {background-color: rgba(255, 255, 255, 0);}
.top-menu li a {font-size:13px;font-weight:700;color:#333333;text-transform:uppercase;border:none;padding:0 20px;}
.home .top-menu li a {color:#ffffff;}

.butt, a.butt {width:100%;max-width:156px;line-height:49px;background:#7cd7f8;color:#1a2a35;display: block;text-transform: uppercase;margin: 0 auto;border-radius: 4px;font-weight:600;font-size:14px;}

.sections {position:fixed;width:100%;height:100%;background:url(images/home-big.jpg) no-repeat;background-size:100% 100%;background-size:cover;top:0;left;0;}
.admin-bar .sections {top:32px;}
.overlay {position:absolute;width:100%;height:100%;top:0;left:0;}
.overlay svg {position: absolute;left: 0;top: 0;}
.sesto {fill-opacity: 0.69;stroke-opacity: 0.2;stroke-width: 1px;stroke: #000;}
.sesto:nth-of-type(5) {
-webkit-transition: fill-opacity 0.8s linear 1s;
-moz-transition:  fill-opacity 0.8s linear 1s;
-o-transition:  fill-opacity 0.8s linear 1s;
-ms-transition:  fill-opacity 0.8s linear 1s;
transition: fill-opacity 0.8s linear 1s;}
.sesto:nth-of-type(2) {
-webkit-transition: fill-opacity 0.8s linear 0.5s;
-moz-transition:  fill-opacity 0.8s linear 0.5s;
-o-transition:  fill-opacity 0.8s linear 0.5s;
-ms-transition:  fill-opacity 0.8s linear 0.5s;
transition: fill-opacity 0.8s linear 0.5s;}
.sesto:nth-of-type(4) {
-webkit-transition: fill-opacity 0.8s linear;
-moz-transition:  fill-opacity 0.8s linear;
-o-transition:  fill-opacity 0.8s linear;
-ms-transition:  fill-opacity 0.8s linear;
transition: fill-opacity 0.8s linear;}
.sesto:nth-of-type(3) {
-webkit-transition: fill-opacity 0.8s linear 1.5s;
-moz-transition:  fill-opacity 0.8s linear 1.5s;
-o-transition:  fill-opacity 0.8s linear 1.5s;
-ms-transition:  fill-opacity 0.8s linear 1.5s;
transition: fill-opacity 0.8s linear 1.5s;}

.active .sesto {fill-opacity: 0.58;}



.center-hv {position:absolute;top: 50%;left: 50%;max-width:550px;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);}

.home h1 {font-size:140px;color:#7cd7f8;font-weight:400;text-align:center;text-transform:uppercase;margin-bottom:0;}
.home h2 {font-size:14px;font-weight:300;color:#ffffff;text-transform:uppercase;margin:0 0 45px;text-align:center;}
.home p {color:#ffffff;font-size:16px;text-align:center;}

@media screen and (max-width: 782px) {
.admin-bar #header {top: 46px;}
.admin-bar .nav_but {top: 61px;}
}

@media screen and (max-width: 768px){
#header {padding: 20px 10px 0px 10px;}
.nav_but {right: 0px;}
.home h1 {font-size: 90px;}
.top-menu {right:0;top:-100%;margin: 0;background: rgba(0, 0, 0, 0.9);right: 0;width: 100%;height: 100%;position: fixed;padding-top: 80px;box-sizing: border-box;}
.menu-active .top-menu {top:0;right:0;}
.admin-bar.menu-active .top-menu {top:46px;}
.top-menu li {display: block;line-height: 40px;font-size:30px;}
}