/* http://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)
*/

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;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
    display: block;
}

sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}
sup {
    top: -0.5em;
}
sub {
    bottom: -0.25em;
}

body {
    line-height: 1;
}
ol, ul {
    list-style: none;
}
blockquote, q {
    quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}

@font-face {
    font-family: "Impact";
    src: url('../fonts/771575928-IMPACTED.eot');
    src: url('../fonts/771575928-IMPACTEDd41d.eot?#iefix') format('embedded-opentype'),
    url('../fonts/771575928-IMPACTED.svg#Impact') format('svg'),
    url('../fonts/771575928-IMPACTED.woff') format('woff'),
    url('../fonts/771575928-IMPACTED.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

.clear {clear: both; height: 0px; width: 100%; line-height: 0px; font-size: 0px; background: none; border: none; outline: none; }

body { width: 100%; height: 100%; text-align: center; overflow: hidden; background: /*#4c4c4c;*/  url('../../../images/backgrounds/bg0.jpg') top left no-repeat;background-size: cover ;}
.main-backgrounds {width: 100%; height: 100%; position: fixed; top:0px; left:0px; z-index: -3;}
.main-back { display: none; width: 100%; height: 100%; background-size: cover; background-position: center top; background-repeat: no-repeat; position: fixed; left:0px; top:0px; z-index: -2;}


.all-wrapper {width: 1000px; margin: 0px auto;}
.all-inner {width: 960px; margin: 0px auto;}
.header {width: 960px; height: 87px; padding-top: 37px; padding-bottom: 36px;}
.toplogo {display: block; height: 85px; width: 85px; float: left; background: url("../images/toplogo.png") top left no-repeat;}
.topnav {height: 85px;width: auto; float: right; position: relative; }
.topnav .border {width: 0px; height: 5px; left:0px; bottom: 15px; background: #fff; position: absolute; z-index: -1;}
.topnav>li{font-family: "Open Sans", sans-serif; font-weight: bold; font-size: 18px; text-transform: lowercase; text-align: right; float: left; padding-left: 38px; height: 38px; margin-top: 23px; line-height: 38px; position: relative; padding-bottom: 20px;  }
/*.topnav li.current{ border-bottom: 5px solid#fff;}*/
.topnav>li a,.topnav>li span {text-decoration: none; color: #fff; cursor: pointer; }
.topnav>li ul {position: absolute; top: 52px; left: -100px; opacity: 0; overflow: hidden;    z-index: 1;
    -webkit-transition: all  0.3s ease;
    -moz-transition: all  0.3s ease;
    -o-transition: all  0.3s ease;
    transition: all  0.3s ease;
}
.topnav>li ul>li {font-family: "Open Sans", sans-serif; font-weight: 300; font-size: 14px; text-transform: lowercase; text-align: left; float: none; padding-left: 0px; height: 30px; margin-top: 0px; line-height: 30px; position: relative; white-space: nowrap; }
.topnav>li:hover ul { opacity: 1; left: 38px; }
.topnav>li ul>li:hover a {color: #ddd;}

.topnav .hidden-item { display: none; }

.topnav>li.tags ul {width: 440px; left: -100px; opacity: 0;}
.topnav>li.tags.toplevel ul {width: 440px; opacity: 1; left: 38px; }
.topnav>li.tags ul li {float: left; padding-right: 43px;height: 28px;}
.topnav>li.tags ul li a {display: block; line-height: 26px;}
.topnav>li.tags ul li.current a, .topnav>li.tags ul li.current2 a {border-bottom: 1px solid #fff;}
.topnav>li.tags ul li.current.muted a {border-bottom: none;}
.topnav>li.tags ul li:last-child {float: left; padding-right: 0px;}

.header-wrapper.portfolio .topnav>li ul {display: none;}

.projects-controls {width: 105px; position: absolute; top:30px; right: 30px;  z-index: 50;  height: 30px; opacity: 0;
    webkit-transition: opacity 0.4s ease-out;
    -moz-transition: opacity 0.4s ease-out;
    -o-transition: opacity 0.4s ease-out;
    transition: opacity 0.4s ease-out;
}
.projects-controls.re {opacity: 1}
.projects-controls div {float: right; width: 30px; height: 30px; margin-left: 2px; background-color: rgba(20,20,20,.5); cursor: pointer; background-repeat: no-repeat; webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    -o-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;}
.projects-controls div:hover {background-color: rgba(80,80,80,.3);}
.project-next {background-image: url("../images/proj-right.png"); background-position: center center; border-top-right-radius: 3px;border-bottom-right-radius: 3px;background-size: 20px 20px;}
.project-prev {background-image: url("../images/proj-left.png"); background-position: center center; border-top-left-radius: 3px;border-bottom-left-radius: 3px;background-size: 20px 20px;}
.project-close {background-image: url("../images/proj-center.png"); background-position: center center; background-size: cover; }

.content-wrapper {min-height: 424px; margin-top: 0px; overflow: hidden; position: relative;  }
.content-inner {width: 1040px; position: relative; margin-left: -40px; }
.content-block {width: 960px; height: 466px; float: left; margin: 0px 40px; position: relative; overflow: hidden; top:0px; left:0px; }
.all-scroller { margin-top: 0px ;width: 100%; height: 28px; background: url("../images/track-bg.png") top left repeat-x; position: relative; cursor: pointer; padding-bottom: 15px; }
.all-scroller .scroll-drag {background: url("../images/drag-bg.png") top left repeat-x; position: relative; height: 28px; width: 100px; float: left; cursor: pointer; padding-bottom: 15px;}
.all-scroller .scroll-drag .hidden-popup {position: absolute; top: -200px; height: 10px; width: auto; visibility: visible; opacity: 0; /*background: url("../images/triangle75.png") center bottom no-repeat;*/ height: 24px;
    webkit-transition: opacity 0.3s ease-out;
    -moz-transition: opacity 0.3s ease-out;
    -o-transition: opacity 0.3s ease-out;
    transition: opacity 0.3s ease-out;}
.all-scroller .scroll-drag .hidden-popup.vis {top: -0px;  opacity: 1;}
.all-scroller .scroll-drag .hidden-popup>div {line-height: 10px; color: #fff; /*background: #000;*/ padding: 4px 7px; /*box-shadow: 0px 0px 20px rgba(0,0,0,0.4);*/ font-family: "Open Sans", sans-serif;  font-size: 10px;  font-weight: 300; white-space: nowrap; }

.content-inner p {font-family: "Open Sans", sans-serif; font-weight: 300; font-size: 14px; text-transform: lowercase; text-align: left; margin-bottom: 22px; line-height: 22px;   color: #fff;}

.content-inner .leftcol {float: left; width: 445px;}
.content-inner .leftcol p {text-align: center;}
.content-inner .leftcol img {float: left;}

.span60-800 {font-family: "Open Sans", sans-serif; font-weight: 800; font-size: 60px;   text-align: left; margin-bottom: 0px; line-height: 62px;   color: #fff; letter-spacing: -2px;}
.span30-400 {font-family: "Open Sans", sans-serif; font-weight: 400; font-size: 30px;   text-align: left; margin-bottom: 0px; line-height: 36px;   color: #fff; letter-spacing: -2px;}
.span30-800 {font-family: "Open Sans", sans-serif; font-weight: 800; font-size: 30px;   text-align: left; margin-bottom: 0px; line-height: 36px;   color: #fff; letter-spacing: -1px;}
.span30-400 sup {line-height: 24px; font-size: 24px; top: -1.6em;}


h1  {font-family: "Open Sans", sans-serif; font-weight: 800; font-size: 79px;   text-align: left; margin-bottom: 0px; line-height: 104px;   color: #fff;margin: 0px 0px 26px; letter-spacing: -3px;}
h1.font60-800 {font-family: "Open Sans", sans-serif; font-weight: 800; font-size: 60px;     line-height: 62px;     letter-spacing: -2px;  padding-top: 64px;}

h2  {font-family: "Open Sans", sans-serif; font-weight: 700; font-size: 24px;   text-align: left; margin-bottom: 0px; line-height: 24px;   color: #fff;margin: 0px 0px 26px; padding-left: 15px; background: url("../images/h2-bg.jpg") left 8px no-repeat; letter-spacing: -1px;}
h3  {font-family: "Open Sans", sans-serif; font-weight: 400; font-size: 30px;   text-align: left; margin-bottom: 0px; line-height: 36px;   color: #fff; margin: 0px 0px 26px;}

.content-inner .cols {padding-top: 20px; min-height: 276px;}
.content-inner .col {float: left; width: 400px; min-height: 276px; margin-right: 80px; }
.content-inner .cols p {font-family: "Open Sans", sans-serif; font-weight: 400; font-size: 14px;     line-height: 18px;  font-style: italic; margin-bottom: 18px; text-align: justify;}
.content-inner .cols p:last-child {margin-bottom: 0px;}
.content-inner .col.nomargin {margin: 0px; width: 480px; }
.content-inner .col.link-right { background: url("../images/col-link.png") right bottom no-repeat;}
.content-inner .col.link-center { background: url("../images/col-link1.png") center bottom no-repeat;}

.content-inner .col3 { min-height: 268px; float: left; width: 226px; padding-left: 90px; }
.content-inner .separator3  {margin-top: 69px; height: 80px; background: #fff; float: left; width: 5px;}
.content-inner .col3 h3 {font-family: "Open Sans", sans-serif; font-weight: 700; font-size: 24px;   text-align: left;  line-height: 40px;   color: #fff; margin: 0px 0px 12px; letter-spacing: -2px;}
.content-inner .col3 img {float: left; max-height: 122px;}
.content-inner .col3 .image {color:#fff; height: 122px; margin-bottom: 4px; line-height: 110px; text-align: left; font-size: 100px; font-family: "Impact", sans-serif; letter-spacing: -1px; }
.content-inner .col3 .image span.small {font-size: 48px;}
.content-inner .col3 p {font-family: "Open Sans", sans-serif; font-weight: 400; font-size: 18px;   text-align: left;  line-height: 24px;   color: #fff; margin: 0px 0px 18px; letter-spacing: -1px; text-transform: lowercase; font-style: normal; }

.alter .col3 {padding-left: 60px; padding-right: 30px;}
.alter .col3 h3 {/*letter-spacing: -1px;*/}

table.works {border: none; padding: 0px; margin: 0px ;width: 100%;}
table.works td {border: none; padding: 0px; margin: 0px ; vertical-align: top; }

.content-inner  .col.margin48 {margin-right: 0px; width:  480px;}
.content-inner  .contact .cols p {font-family: "Open Sans", sans-serif; font-weight: 400; font-size: 18px;     line-height: 24px;  font-style: normal; margin-bottom: 12px; text-align: left;  }
.content-inner  .col.margin48 p {padding-left: 48px;}
p.mail {padding-left: 48px; background: url("../images/contact-mail.png") top left no-repeat; }
p.phone {padding-left: 48px; background: url("../images/contact-phone.png") top left no-repeat; }
p.question {padding-left: 48px; background: url("../images/contact-question.png") top left no-repeat; }

.content-inner input, .content-inner textarea {margin-bottom: 4px; background: none; border: none; outline: none; border-bottom: 1px solid #ffffff; font-family: "Open Sans", sans-serif; font-weight: 400; font-size: 14px;     line-height: 18px;  font-style: italic; text-align: left; color: #fff; }

.content-inner .col.margin48 input, .content-inner .col.margin48 textarea {width: 424px; margin-left: 48px; padding: 0px 4px;}
.content-inner .social img {float: left; margin-right: 18px; }
.contact textarea {resize: none; background: url("../images/area-link.png") right bottom no-repeat; }

#video_background {
    position: absolute;
    bottom: 0px;
    right: 0px;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -99999;
    overflow: hidden;
}
.just_pattern {
    background-image: url(../images/pattern.png);
    position: absolute;
    opacity: 0.8;
    left: 0px;
    top: 0px;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

/*#scrollToTop {display: none !important;}*/
.portfolio-all {margin-bottom: 0px; position: relative; left: 0px;}
.item-page.portfolio-all {padding-bottom: 30px; position: relative; left: 0px;   top:0px; width: 100%; min-height: 1200px; margin-bottom: 0px;}
.portfolio-cols {position: relative; }
.portfolio-row {height: 134px;}
.portfolio-col {opacity: 0;float: left; height: 134px;width: 240px; position: relative; left: auto; top:auto;
    -webkit-transition: all  0.5s ease;
    -moz-transition: all  0.5s ease;
    -o-transition: all  0.5s ease;
    transition: all  0.5s ease;}
.portfolio-col:last-child {}
.portfolio-col img {float: left; margin: 0px; position: absolute; z-index: 0; width: 0px; height: 0px; top:50%; left:50%; display: block;
    -webkit-transition: all  0.3s ease;
    -moz-transition: all  0.3s ease;
    -o-transition: all  0.3s ease;
    transition: all  0.3s ease;}
.portfolio-col a {position: absolute; z-index: 2; width: 240px; height: 134px; display: none;font-family: "Open Sans", sans-serif; font-weight: 400; font-size: 18px;     line-height: 134px; font-style: normal; text-align: center; text-decoration: none; color: #fff; text-transform: uppercase;}
.portfolio-col span {position: absolute; z-index: 1; width: 0px; height: 0px; top:50%; left:50%; display: block; background: url("../images/black-75.png") top left repeat;
    opacity: 0;
    -webkit-transition: all  0.3s ease;
    -moz-transition: all  0.3s ease;
    -o-transition: all  0.3s ease;
    transition: all  0.3s ease;}
.portfolio-cols.loaded .portfolio-col { opacity: 1; }
.portfolio-cols.loaded .portfolio-col.load img {width: 240px; height: 134px; top: 0px; left: 0px;}



.portfolio-cols.loaded .portfolio-col:hover span {width: 100%; height: 134px; top: 0px; left: 0px;opacity: 1;  }
.portfolio-cols.loaded .portfolio-col:hover a{display: block;}

.portfolio-nav {float: right; padding-top: 35px; }
.portfolio-nav li {float: left; margin-left: 40px; font-family: "Open Sans", sans-serif; font-weight: 300; font-size: 14px;     line-height: 18px; font-style: normal; text-align: center; text-decoration: none; color: #fff; text-transform: lowercase;letter-spacing: 0px; cursor: pointer; }
.portfolio-nav li.active {border-bottom: 1px solid #fff;}

.static-title {width: 960px;}

.cols.blogpage .col{width: 430px; margin-right: 100px; float: left;}
.cols.blogpage .col:last-child {margin-right: 0px;}
.cols.blogpage .col h5 {font-family: "Open Sans", sans-serif; font-weight: 400; font-size: 14px;   text-align: right;  line-height: 18px;   color: #fff; margin: 0px 0px 0px;  text-transform: uppercase; font-style: normal; padding: 15px 0px 20px;}
.cols.blogpage .col:last-child h5  { text-align:  left; }
.cols.blogpage .col .postdate { height: 10px;margin-bottom: 24px;    }
.cols.blogpage .col .postdate  .span1 {margin: 0px; text-align: right; float:right; display: block; font-family: "Open Sans", sans-serif; font-weight: 300; font-size: 12px;     line-height: 14px; font-style: normal; text-align: right; text-decoration: none; color: #c0da64; text-transform: uppercase; }
.cols.blogpage .col .postdate  .span2{margin: 0px; text-align: right; float:left; display: block;border-bottom: 1px solid #c0da64; height: 10px; }
.cols.blogpage .col:last-child .postdate  .span1 {float: left; }
.cols.blogpage .col:last-child .postdate  .span2 {float: right; }

.cols.blogpage .col p {font-family: "Open Sans", sans-serif; font-weight: 300; font-size: 14px;     line-height: 18px; font-style: normal; text-align: justify; direction: rtl; text-decoration: none; color: #fff; margin-bottom: 12px; text-transform: none; }
.cols.blogpage .col p .normal {float: right;}
.cols.blogpage .col:last-child p {direction: ltr;}
.cols.blogpage .col .readmore {float: left;font-family: "Open Sans", sans-serif; font-weight: 300; font-size: 14px;  line-height: 24px;   color: #c0da64; margin: 0px 0px 50px;  text-transform: lowercase; font-style: italic; text-decoration: underline; }
.cols.blogpage .col:last-child .readmore {float: right; }

.portfolio-block {float:left; width: 960px; height: 441px; margin-right: 100px;}
.portfolio-cols {float: left; width: 480px; height: 441px;}
.blog1-container {float: left; width: 480px; height: 147px;}
.blog1-container .blog1-block {float: left; height: 146px; width: 430px; border-bottom: 1px solid #fff; }
.blog1-container:last-child .blog1-block {border-bottom: none; }
.portfolio-cols.second .blog1-container .blog1-block {float: right; height: 146px; width: 430px; border-bottom: 1px solid #fff; }
.portfolio-cols.second .blog1-container:last-child .blog1-block {border-bottom: none; }




.blog1-container .leftcol {margin-top: 48px; border:none; padding-left: 0px;width:auto /*430px*/;float: left;min-height: 42px; text-align: left; color: #fff; cursor: pointer; opacity: 1;
    -webkit-transition: all 0.5s ease-out ;
    -moz-transition: all 0.5s ease-out ;
    -o-transition: all 0.5s ease-out ;
    transition: all 0.5s ease-out}
.blog1-block .leftcol.loaded {opacity: 0;}
.ready .blog1-block .leftcol.loaded {opacity: 1;}
.portfolio-cols.second .blog1-container  .leftcol  {float: right; }
.blog1-row .leftcol {width: auto/*450px*/;  margin-top: 46px; border-left: 5px solid #fff; padding-left: 16px;
}
.blog1-row .leftcol a {color: #fff; text-decoration: none;}

.blog1-container  .leftcol .title { font-size: 30px; line-height: 30px; letter-spacing: -1px; font-family: "Open Sans", sans-serif; font-weight: 800; font-style: normal; margin-bottom: 0px; text-transform: uppercase;
    -webkit-transition: all 0.5s ease-out ;
    -moz-transition: all 0.5s ease-out ;
    -o-transition: all 0.5s ease-out ;
    transition: all 0.5s ease-out}
.portfolio-cols.second .blog1-container   .leftcol .title { text-align: right; float: right; }

.blog1-container .descr, .blog1-block .descr p {font-family: "Open Sans", sans-serif; font-weight: 400; font-size: 15px;     line-height: 24px;  font-style: italic; margin:0px; padding: 0px; text-transform: lowercase; text-align: left; }
.portfolio-cols.second .blog1-container   .descr, .portfolio-cols.second  .blog1-block .descr p  {text-align: right;}

.blog1-row-block {width: 960px; margin: 0px auto;}

.blog1-row {position: fixed; width: 100%; height: 148px; left: 0px; opacity: 0;  margin-top: -1px; z-index: -1;
    -webkit-transition: opacity 0.5s ease-out ;
    -moz-transition: opacity 0.5s ease-out ;
    -o-transition: opacity 0.5s ease-out ;
    transition: opacity 0.5s ease-out}
.ready .blog1-row.loaded {opacity: 1; z-index: 3;}
.blog1-row   .leftcol .title  {font-size: 46px; line-height: 36px; letter-spacing: -2px; font-family: "Open Sans", sans-serif; font-weight: 800; font-style: normal; margin-bottom: 10px; text-transform: uppercase; width: auto; float: left;}
.blog1-row .descr, .blog1-row .descr p {font-family: "Open Sans", sans-serif; font-weight: 400; font-size: 15px;     line-height: 12px;  font-style: italic; margin:0px; padding: 0px; text-transform: lowercase; text-align: left; }
.portfolio-cols.second .blog1-row .leftcol  {float: right; border-right: 5px solid #fff; padding-right: 16px; padding-left: 0px; border-left: none;}
.portfolio-cols .blog1-row .rightcol {float: right;}
.portfolio-cols .blog1-row .rightcol img {float: right; display: block;}
.portfolio-cols.second .blog1-row .rightcol {float: left;}
.portfolio-cols.second .blog1-row .rightcol img {float: left; display: block;}
.portfolio-cols.second .blog1-row .descr, .portfolio-cols.second .blog1-row .descr p {text-align: right;}


.portfolio-wrapper {position: absolute; top: 0px; left: 0px; z-index: 10;width: 100%; min-height: 1000px; display: none;}
.portfolio-wrapper .topnav .border  { z-index: 100;}

.portfolio-wrapper .item-page .item-image {width: 100%; }
.portfolio-wrapper .item-page .item-image img {float: left; width: 100% !important; margin-bottom:  93px; max-width: none; }

.portfolio-content {margin-top: 0px;width: 100%; position: relative; }
.portfolio-content .portfolio-descr {margin: 0px auto 110px; width: 960px;  border-left: 3px solid #fff; text-align: left; color: #fff;}
.portfolio-content .portfolio-descr td { width: 49%; padding-left: 17px; }

.portfolio-content .portfolio-descr.sayitnow {border-left-color: #fff; color: #fff;}
.portfolio-content .portfolio-descr.dtp {border-left-color: #231e1b; color: #231e1b;}
.portfolio-content .portfolio-descr.dtp h3 {color: #231e1b; }

.portfolio-content  h3 {font-family: "Open Sans", sans-serif; font-weight: 700; font-size: 17px;     line-height: 14px;  font-style: normal; margin-bottom: 16px; text-transform: uppercase;}
.portfolio-content p {font-family: "Open Sans", sans-serif; font-weight: 300; font-size: 14px;     line-height: 24px;  font-style: normal; margin-bottom: 12px; text-transform: none;}
.portfolio-content .portfolio-descr p:last-child {margin-bottom: 0px;}
.portfolio-content img {display: block; float: none; margin: 0px auto; max-width: 90%; }

.portfolio-content .back {margin: 50px auto 82px; width: 185px; height: 33px; line-height: 33px; border: 1px solid #fff; font-family: "Open Sans", sans-serif; font-weight: 300; font-size: 14px;     line-height: 33px;  font-style: normal; text-transform: none; text-align: center; color: #fff; cursor: pointer; }

.scrollToTop { opacity: 0; position:fixed; bottom: 30px; right: 50px;   ;width: 44px; background: transparent url("../images/scrolltotop.png") center top no-repeat; cursor: pointer; height: 71px;font-family: "Open Sans", sans-serif; font-weight: 300; font-size: 14px;     line-height: 115px;  font-style: normal; text-transform: none; text-align: center; color: #fff; z-index: 10;
    -webkit-transition: opacity 0.5s ease-out ;
    -moz-transition: opacity 0.5s ease-out ;
    -o-transition: opacity 0.5s ease-out ;
    transition: opacity 0.5s ease-out}

.scrollToTop.vis:hover {opacity: 1 !important;}
.scrollToTop.vis  {opacity: 0.5;}

.items-row-temp { position: fixed; height: 147; width: 100%;margin: 0px; padding: 0px; z-index: 99; display: none;}

.header-wrapper.portfolio { background: #4c4c4c; margin-top: -160px;}
.header-wrapper.portfolio .header {margin: 0px auto; width: 960px; }
.item-page.portfolio-all {padding-top: 1000px;}