@import url(http://fonts.googleapis.com/css?family=Raleway:300,400,400italic,600,700);
@import url(http://fonts.googleapis.com/css?family=Inconsolata:400,400italic,600,700);
body,
html {
    height: 100%;
    width: 100%
}
a,
a:active,
a:hover {
    text-decoration: none
}
.btn.active.focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn:active:focus,
.btn:focus,
a:focus {
    outline: 0
}
.item-figure,
img {
    -webkit-border-radius: 1px;
    -moz-border-radius: 1px
}
.quote-list,
.slider,
.twitter-feed {
    cursor: -webkit-grab;
    cursor: -moz-grab
}
.member-name,
.meta,
.navbar-default li a,
.number-info,
.section-title,
blockquote cite {
    text-transform: uppercase
}
#pricing-table ul,
.brands,
.categories-list,
.comments-list,
.comments-list ul,
.controls,
.filter,
.meta-list,
.popup-slider,
.quote-list,
.social-list,
.tags-list,
.twitter-feed ul {
    list-style: none
}
body,
html {
    margin: 0;
    padding: 0
}
body {
    position: relative;
    background: #F2F2F2;
    color: #666;
    font-family: Inconsolata, Arial, Helvetica, sans-serif;
    font-size: 15px
}
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: Raleway, "Open Sans", Arial, Helvetica, sans-serif;
    letter-spacing: 1px;
    color: #2b2b2b
}
blockquote,
p {
    font-family: Inconsolata, Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.6
}
blockquote {
    font-style: italic;
    margin: 0 0 1.25rem;
    padding: 0 1.25rem 0 1.875rem;
    border-left: 5px solid #101820
}
blockquote cite {
    display: block;
    font-style: normal;
    margin-top: 1em
}
a {
    color: #101820
}
a:active,
a:hover {
    color: #000
}
a:focus {
    color: #ccc;
    text-decoration: underline
}
*,
::after,
::before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}
img {
    max-width: 100%;
    height: auto;
    border-radius: 1px
}
.section-title::after,
.small-title::after {
    width: 2em;
    height: 1px;
    background-color: #101820
}
figure {
    margin: 0
}
.slider {
    margin-left: 0;
    padding: 0;
    cursor: grab
}
.section-header {
    margin: 4em 0
}
.section-title {
    text-align: center;
    font-weight: 700;
    letter-spacing: 3px;
    margin: 2em
}
.section-title::before {
    content: attr(data-text);
    position: relative;
    display: table;
    margin: 1.5em auto;
    font-size: .625em;
    line-height: 1;
    font-weight: 400;
    letter-spacing: 2px
}
.section-title::after {
    content: "";
    display: table;
    margin: 1.5em auto
}
.small-title {
    font-family: raleway, sans-serif;
    font-weight: 700;
    line-height: 1;
    text-align: left;
    margin-bottom: 1.125em
}
.share,
.small-title.centered,
.social-list a {
    text-align: center
}
.small-title::before {
    content: attr(data-text);
    position: relative;
    display: block;
    margin: .5rem 0;
    font-size: 12px;
    line-height: 1;
    font-weight: 400;
    color: #7597ba
}
.small-title::after {
    content: "";
    display: block;
    margin: 1.625em 0
}
.small-title.centered::after {
    margin: 1.625em auto
}
.icon {
    font-size: 1.875em;
    line-height: 1;
    display: inline-block;
    color: inherit
}
.page404 {
    font-family: Raleway, "Open Sans", Arial, Helvetica, sans-serif;
    font-size: 6em;
    font-weight: 700
}
.preloader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 99999;
    -webkit-flex-flow: row nowrap;
    -webkit-box-align: center;
    -webkit-box-pack: center;
    -webkit-align-items: center;
    -webkit-justify-content: center;
    -ms-flex-flow: row nowrap;
    display: flex;
    flex-flow: row nowrap;
    justify-content: center;
    align-items: center;
    background: #fff
}
.preloader span:nth-child(1),
.preloader span:nth-child(2) {
    display: block;
    width: 2em;
    height: 2em;
    -webkit-border-radius: 2em;
    -moz-border-radius: 2em;
    border-radius: 2em
}
.preloader span:nth-child(1) {
    -webkit-order: 1;
    order: 1;
    -webkit-animation: left-circle 1.5s infinite ease-in-out;
    animation: left-circle 1.5s infinite ease-in-out
}
.preloader span:nth-child(2) {
    -webkit-order: 2;
    order: 2;
    -webkit-animation: right-circle 1.5s infinite ease-in-out;
    animation: right-circle 1.5s infinite ease-in-out
}
@-webkit-keyframes left-circle {
    0%, 100% {
        -webkit-transform: translateX(0) rotate(0);
        -moz-transform: translateX(0) rotate(0);
        -ms-transform: translateX(0) rotate(0);
        transform: translateX(0) rotate(0)
    }
    50% {
        -webkit-transform: translateX(3.125em) scale(1.5) rotate(260deg);
        -moz-transform: translateX(3.125em) scale(1.5) rotate(260deg);
        -ms-transform: translateX(3.125em) scale(1.5) rotate(260deg);
        transform: translateX(3.125em) scale(1.5) rotate(260deg);
        background: #101820
    }
}
@-webkit-keyframes right-circle {
    0%, 100% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0)
    }
    50% {
        -webkit-transform: translateX(-3.125em) scale(1.5) rotate(-260deg);
        -moz-transform: translateX(-3.125em) scale(1.5) rotate(-260deg);
        -ms-transform: translateX(-3.125em) scale(1.5) rotate(-260deg);
        transform: translateX(-3.125em) scale(1.5) rotate(-260deg);
        background: #000
    }
}
@keyframes left-circle {
    0%, 100% {
        -webkit-transform: translateX(0) rotate(0);
        -moz-transform: translateX(0) rotate(0);
        -ms-transform: translateX(0) rotate(0);
        transform: translateX(0) rotate(0)
    }
    50% {
        -webkit-transform: translateX(3.125em) scale(1.5) rotate(260deg);
        -moz-transform: translateX(3.125em) scale(1.5) rotate(260deg);
        -ms-transform: translateX(3.125em) scale(1.5) rotate(260deg);
        transform: translateX(3.125em) scale(1.5) rotate(260deg);
        background: #101820
    }
}
@keyframes right-circle {
    0%, 100% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0)
    }
    50% {
        -webkit-transform: translateX(-3.125em) scale(1.5) rotate(-260deg);
        -moz-transform: translateX(-3.125em) scale(1.5) rotate(-260deg);
        -ms-transform: translateX(-3.125em) scale(1.5) rotate(-260deg);
        transform: translateX(-3.125em) scale(1.5) rotate(-260deg);
        background: #000
    }
}

#BriefModal button.close{
	position: relative;
	z-index: 999;
}

.social-list {
    margin-left: 0;
    padding-left: 0;
    margin-bottom: 0
}
.g-recaptcha {
    display: inline-block;
    float: right;
}
.social-list li {
    display: inline-block;
    margin-left: .5em
}
.social-list li:first-child {
    margin-left: 0
}
.social-list a {
    width: 1.125em;
    height: 2em;
    font-size: 1em;
    line-height: 2em;
    border-radius: 1em;
    color: inherit;
    display: inline-block;
    text-decoration: none
}
.share {
    margin-bottom: 3em
}
nav {
    display: table;
    float: right;
    margin: 0 auto;
    position: relative;
    z-index: 1000
}
.navbar-default {
    display: table-cell;
    vertical-align: middle
}
.navbar-default li {
    cursor: pointer;
    margin: 0 0 0 30px;
    position: relative
}
.navbar-default li:hover a {
    color: #333;
    background-color: transparent
}
.navbar-default li a {
    display: block;
    font-family: Raleway, Arial, Helvetica, sans-serif;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 2px;
    padding: 25px 0 5px;
    text-decoration: none;
    z-index: 100;
    color: #2b2b2b;
    position: relative
}
.is-transparent.navbar-default li a::after,
.navbar-default li a::after {
    bottom: 5px;
    display: block;
    height: 1px;
    margin-left: -1px;
    position: absolute;
    transition: all .2s cubic-bezier(.25, .46, .45, .94) 0s;
    width: 0;
    content: "";
    left: 0
}
.navbar-default li a::after {
    background: #2b2b2b
}
.is-transparent.navbar-default li a::after {
    background: #fff
}
#BrandLogo,
.navbar-nav {
    height: 60px
}
.is-transparent.navbar-default li a {
    color: #fff
}
.navbar-default li a:hover::after {
    color: #2b2b2b;
    left: 0;
    width: 100%
}
#BrandLogo {
    width: auto;
    fill: #000
}
.is-transparent #BrandLogo {
    fill: #fff
}
.navbar-brand {
    float: none
}
.navbar-default {
    transition: all .3s ease;
    box-shadow: 0 0 20px -10px #000
}
.item-figure img,
.service:hover .fa,
.service:hover .icon {
    -webkit-transition: opacity .35s, -webkit-transform .35s;
    -moz-transition: opacity .35s, -moz-transform .35s
}
.brands>li {
    display: inline-block;
    padding: 0 25px
}
.brands img,
.dropdown:hover>.dropdown-menu,
.has-dropdown:hover>.dropdown-menu {
    display: block
}
.brands img {
    max-height: 70px
}
.action>h5 {
    text-align: left
}
#BriefModal .modal-big {
    width: 100%
}
#BriefModal .small-title {
    margin: 0
}
header.not_found {
    height: 90%
}
.navbar-default li.active a::after {
    left: 0;
    width: 100%
}
.navbar-default .navbar-nav>li.active a {
    background-color: transparent
}
.navbar-default .dropdown-menu {
    min-width: 160px;
    padding: 5px 0;
    margin: 2px 0 0;
    background-color: #fff;
    border: 1px solid #ccc;
    border: 1px solid rgba(0, 0, 0, .15);
    border-radius: 4px;
    -webkit-box-shadow: 0 0 1px 1px rgba(255, 255, 255, .25) inset;
    box-shadow: 0 0 1px 1px rgba(255, 255, 255, .25) inset
}
.navbar-default .dropdown-menu>li {
    margin: 0 10px
}
.navbar-default .dropdown-menu>li>a {
    padding: 6px 20px;
    color: #838379
}
.navbar-default .dropdown-menu>li>a:hover {
    background: 0 0;
    color: #101820
}
@media only screen and (min-width: 991px) {
    .is-transparent {
        background-color: transparent;
        border-color: transparent;
        padding: 12px;
        box-shadow: none!important
    }
    .is-transparent .navbar-brand {
        color: #fff
    }
    .is-transparent .navbar-brand:hover {
        color: #4285f4
    }
    .is-transparent .navbar-nav>li>a {
        color: #fff
    }
    .is-transparent .navbar-nav>li>a:focus,
    .is-transparent .navbar-nav>li>a:hover {
        color: #fff;
        opacity: 1
    }
    .is-transparent .dropdown-menu {
        background-color: rgba(0, 0, 0, .25);
        border: none;
        -webkit-box-shadow: 0 0 1px 1px rgba(255, 255, 255, .25) inset;
        box-shadow: 0 0 1px 1px rgba(255, 255, 255, .25) inset
    }
    .is-transparent .dropdown-menu>li>a {
        color: #fff;
        opacity: .7
    }
    .is-transparent .dropdown-menu>li>a:hover {
        color: #fff;
        opacity: 1
    }
    .has-dropdown {
        position: relative
    }
    .navbar-right .has-dropdown>.dropdown-menu {
        right: 100%;
        top: -25%
    }
}



@media only screen and (min-width: 320px) and (max-width: 768px) {
    .navbar-toggle {
        margin: 16px 15px
    }
    .navbar-nav {
        height: auto
    }
    .is-transparent.navbar-default {
        background-color: #fff
    }
    .is-transparent #BrandLogo {
        fill: #000
    }
    .navbar-default li {
        margin: 0 20px
    }
    .is-transparent.navbar-default li a,
    .navbar-default li a {
        color: #000;
        padding: 10px 15px
    }
    .is-transparent.navbar-default li a::after {
        background-color: #000
    }
    .is-transparent.navbar-default li.active a,
    .navbar-default li.active a {
        color: #000
    }
    .navbar-default li.dropdown.open ul li {
        margin: 0 20px;
        padding: 10px 15px
    }
    .navbar-default li.dropdown.open ul li a {
        padding: 0
    }
}
@media only screen and (min-width: 768px) and (max-width: 999px) {
    .navbar-default li {
        margin: 0 0 0 27px
    }
    .is-transparent.navbar-default li a,
    .navbar-default li a {
        color: #000;
        padding: 15px 0
    }
    .is-transparent.navbar-default li a::after {
        background-color: #000
    }
    .is-transparent.navbar-default li.active a,
    .navbar-default li.active a {
        color: #000
    }
}
.banner h1,
.banner h2,
.banner h4,
.banner p,
.header {
    color: #fff
}
.header {
    position: relative;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -webkit-justify-content: center;
    -ms-flex-flow: column wrap;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 75%;
    min-height: 75vh;
    padding: 2em;
    text-align: center;
    background: url(../img/backgrounds/placeholder1.jpg) center center no-repeat #c8c9c7;
    background-size: auto 100%
}
.header::before,
.scroll-down {
    position: absolute;
    display: block
}
.header::before {
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #000;
    opacity: .5
}
.header .button {
    margin-bottom: 0
}
.hero {
    height: 100%;
    min-height: 100vh;
    background: url(../img/backgrounds/placeholder1.jpg) center center no-repeat #c8c9c7;
    background-size: auto 100%
}
.banner {
    z-index: 2
}
.banner .btn {
    margin-top: 1em
}
.scroll-down {
    right: 0;
    bottom: 1em;
    left: 0;
    margin: auto;
    width: 2em;
    height: 2em
}
.about,
.features {
    height: auto;
    background: center center no-repeat #fff;
    text-align: center;
    width: 100%
}
.scroll-down:hover {
    -webkit-animation: simAnim 1s infinite;
    animation: simAnim 1s infinite
}
@-webkit-keyframes simAnim {
    from {
        bottom: 1em
    }
    to {
        bottom: 0
    }
}
@keyframes simAnim {
    from {
        bottom: 1em
    }
    to {
        bottom: 0
    }
}
@media only screen and (max-width: 40em) {
    .header {
        min-height: 75%;
        height: auto
    }
    .hero {
        min-height: 100%
    }
}
.about {
    padding: 4em 0 0
}
.mockup {
    overflow: hidden
}
.mockup img {
    margin-top: -4em
}
.features {
    padding: 3em 0;
    border-top: 1px solid #F1F1F1
}
.feature {
    padding: 2.5em 12%;
    text-align: center
}
.feature .fa,
.feature .linea {
    font-size: 1.875em;
    color: #838379
}
.quotes {
    position: relative;
    padding: 7em 0;
    text-align: center;
    color: #fff;
    background: url(../img/backgrounds/placeholder11.jpg) center center no-repeat #fff;
    background-size: cover
}
.quotes::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
    background-color: #3d3935;
    opacity: .3
}
.quote-list {
    margin: 0;
    padding: 0;
    cursor: grab
}
.quote-list li {
    display: inline-block
}
.quote {
    margin: 0;
    padding: 1em;
    border-left: none;
    color: inherit
}
.isotope,
nav.popup-nav {
    margin: 0 auto;
    position: relative
}
.quote cite {
    display: block;
    font-size: 14px
}
nav.popup-nav {
    display: block;
    float: none;
    z-index: 1000
}
.alignleft,
.avatar,
.item {
    float: left
}
.portfolio {
    position: relative;
    width: 100%;
    height: auto;
    padding: 2em 0 4em;
    text-align: center;
    background-color: #fff
}
.isotope {
    width: 100%;
    height: auto
}
.isotope::after {
    content: '';
    display: block;
    clear: both
}
.call-to::before,
.counters::before,
.member-name::after,
.overlay::before {
    content: ""
}
.item {
    position: relative;
    height: auto;
    overflow: hidden;
    background-color: rgba(244, 243, 243, .2);
    margin-bottom: .875em
}
.grid-sizer,
.gutter-sizer {
    position: absolute;
    opacity: 0;
    visibility: hidden
}
.item-figure,
.item-figure img {
    position: relative;
    display: block
}
.grid-sizer,
.item {
    width: 32.5%
}
.gutter-sizer {
    width: 1%
}
@media (max-width: 768px) {
    #contact-form .btn {
        width: 100%
    }
    .grid-sizer,
    .item {
        width: 99%
    }
    .gutter-sizer {
        width: 1%
    }
}
@media (min-width: 768px) and (max-width: 970px) {
    .grid-sizer,
    .item {
        width: 31%
    }
    .gutter-sizer {
        width: 2%
    }
}
.item-figure {
    margin: 0;
    padding: 0;
    overflow: hidden;
    background: #B2B2B2;
    border-radius: 1px
}
.item-figure img {
    opacity: .95;
    transition: opacity .35s, transform .35s;
    -webkit-transform: scale3d(1.05, 1.05, 1);
    -moz-transform: scale3d(1.05, 1.05, 1);
    transform: scale3d(1.05, 1.05, 1)
}
.item-figure p,
.overlay,
.overlay::before,
.overlay>a {
    position: absolute
}
.item-figure p {
    right: 0;
    bottom: 0;
    margin: 3em;
    padding: 0 1em;
    max-width: 150px;
    border-right: 4px solid #666;
    text-align: right;
    opacity: 0;
    color: #666;
    -webkit-transition: opacity .35s;
    -moz-transition: opacity .35s;
    transition: opacity .35s
}
.item-figure:hover img {
    opacity: .6;
    -webkit-transform: scale3d(1, 1, 1);
    -moz-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1)
}
.item-figure:hover .overlay:before {
    -webkit-transform: scale3d(1.9, 1.4, 1) rotate3d(0, 0, 1, 45deg) translate3d(0, 100%, 0);
    -moz-transform: scale3d(1.9, 1.4, 1) rotate3d(0, 0, 1, 45deg) translate3d(0, 100%, 0);
    transform: scale3d(1.9, 1.4, 1) rotate3d(0, 0, 1, 45deg) translate3d(0, 100%, 0)
}
.item-figure:hover p {
    opacity: 1;
    -webkit-transition-delay: .1s;
    -moz-transition-delay: .1s;
    transition-delay: .1s
}
.overlay {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}
.overlay::before {
    top: 0;
    left: 0;
    width: 110%;
    height: 110%;
    background: rgba(255, 255, 255, .5);
    -webkit-transition: -webkit-transform .6s;
    -moz-transition: -moz-transform .6s;
    transition: transform .6s;
    -webkit-transform: scale3d(1.9, 1.4, 1) rotate3d(0, 0, 1, 45deg) translate3d(0, -100%, 0);
    -moz-transform: scale3d(1.9, 1.4, 1) rotate3d(0, 0, 1, 45deg) translate3d(0, -100%, 0);
    transform: scale3d(1.9, 1.4, 1) rotate3d(0, 0, 1, 45deg) translate3d(0, -100%, 0)
}
.call-to::before,
.overlay>a {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0
}
.overlay>a {
    z-index: 1000;
    text-indent: 200%;
    white-space: nowrap;
    font-size: 0;
    opacity: 0
}
.filter {
    display: table;
    margin: 0 auto 3em;
    padding: 0
}
.filter li {
    display: inline-block;
    margin-right: .5em
}
.filter li:last-child {
    margin-right: 0
}
.btn.load-more {
    display: inline-block;
    margin-top: 3em
}
.call-to {
    position: relative;
    padding: 6em 0;
    text-align: center;
    color: #fff;
    background: url(../img/backgrounds/placeholder5.jpg) no-repeat scroll center bottom #101820;
    background-size: 100% auto;
}
.call-to::before {
    position: absolute;
    display: block;
    background-color: #fff;
    opacity: .7
}
.counters,
.services {
    position: relative;
    height: auto;
    width: 100%
}
.call-to .button {
    margin-top: 4em
}
.action {
    -webkit-justify-content: space-between;
    -webkit-align-content: center;
    -webkit-align-items: center;
    display: flex;
    -webkit-box-pack: justify;
    justify-content: space-between;
    align-content: center;
    align-items: center
}
.services {
    padding: 2em 0 4em;
    text-align: center
}
.service-list {
    margin: 2em 0
}
.service {
    padding: 1.5em;
    margin: .9375em .25em;
    color: #101820;
    background: center center #fff
}
.counters,
.skills {
    padding: 8em 0;
    text-align: center
}
.service .fa,
.service .linea {
    font-size: 2em;
    color: #a29979
}
.service h5 {
    margin: 1.875em 0
}
.service:hover .fa,
.service:hover .icon {
    opacity: .35;
    color: #4285f4;
    -webkit-transform: translateY(1.625em) scale(2);
    -moz-transform: translateY(1.625em) scale(2);
    -ms-transform: translateY(1.625em) scale(2);
    transform: translateY(1.875em) scale(2);
    transition: opacity .35s, transform .35s
}
.counters {
    color: #fff;
    background: url(../img/backgrounds/placeholder8.jpg) center center no-repeat #101820;
    background-size: cover
}
.counters::before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
    background-color: #000;
    opacity: .7
}
.numbers {
    font-family: Raleway, "Open Sans", Arial, Helvetica, sans-serif;
    color: inherit;
    text-align: center
}
.number {
    display: block;
    min-height: 1em;
    font-size: 2em;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 1px
}
.number-info {
    display: block;
    font-size: .8em;
    line-height: 2;
    margin-top: .875em
}
@media only screen and (max-width: 40em) {
    .action {
        -webkit-flex-direction: column;
        flex-direction: column
    }
    #counters {
        background-size: cover;
        height: auto;
        min-height: 100%
    }
    .counters {
        position: relative;
        z-index: 999
    }
}
.team {
    position: relative;
    width: 100%;
    height: auto;
    padding: 2em 0 4em;
    text-align: center
}
.team .overlay a {
    text-indent: 0;
    -webkit-align-items: center;
    -webkit-justify-content: center;
    display: flex;
    justify-content: center;
    align-items: center
}
.team-figure,
.team-figure img {
    position: relative;
    display: block
}
.members {
    margin: 4em 0
}
.team-figure {
    margin: 0;
    padding: 0;
    overflow: hidden;
    background: -webkit-linear-gradient(-45deg, #34495e 0, #fff0c0 100%);
    background: linear-gradient(-45deg, #34495e 0, #fff0c0 100%);
    -webkit-border-radius: 1px;
    -moz-border-radius: 1px;
    border-radius: 1px
}
.team-figure img {
    opacity: .95;
    -webkit-transition: opacity .35s, -webkit-transform .35s;
    -moz-transition: opacity .35s, -moz-transform .35s;
    transition: opacity .35s, transform .35s
}
.team-figure:hover img {
    opacity: .1;
    -webkit-transform: scale3d(2, 2, 1);
    -moz-transform: scale3d(2, 2, 1);
    transform: scale3d(2, 2, 1)
}
.team-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}
.team-overlay ul {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 80%;
    height: 3em;
    margin: 1em 10%;
    color: #fff;
    background: 0 0;
    border: 2px solid #fff;
    opacity: 0;
    -webkit-align-items: center;
    -webkit-justify-content: center;
    display: flex;
    justify-content: center;
    align-items: center;
    -webkit-transform: scale3d(.8, .8, 1);
    -moz-transform: scale3d(.8, .8, 1);
    transform: scale3d(.8, .8, 1);
    -webkit-transform-origin: 50% -100%;
    -moz-transform-origin: 50% -100%;
    -ms-transform-origin: 50% -100%;
    transform-origin: 50% -100%
}
.team-overlay:hover ul {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    -moz-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
    -webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out
}
.member-name {
    text-align: center;
    margin: 1.625em 0;
    font-weight: 700
}
.member-name::before {
    content: attr(data-text);
    position: relative;
    display: table;
    margin: 1.5em auto;
    font-size: .625em;
    line-height: 1;
    font-weight: 400;
    color: #838379
}
.chart .percent,
.post-title {
    font-weight: 700
}
.skills,
.skills h5 {
    color: #fff
}
.member-name::after {
    display: table;
    margin: 1.5em auto;
    width: 3em;
    height: 1px;
    background-color: #101820
}
#list-masonry::after,
.skills::before {
    content: "";
    display: block
}
.skills {
    position: relative;
    width: 100%;
    height: auto;
    background: url(../img/backgrounds/placeholder5.jpg) top center no-repeat #101820;
    background-size: cover
}
.skills::before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #000;
    opacity: .7
}
.chart {
    position: relative;
    text-align: center;
    height: 110px;
    max-height: 110px;
    margin: 1.25em 0 1em
}
.chart .percent {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    height: 1em;
    color: inherit;
    font-size: 2em;
    line-height: 1;
    letter-spacing: 1px
}
.blog,
.meta,
.meta-list li {
    position: relative
}
.blog {
    width: 100%;
    height: auto;
    padding: 2em 0 1em;
    text-align: center
}
#list-masonry::after {
    clear: both
}
.post {
    padding: 1em 0 3em;
    margin: 2em 0 3em;
    text-align: left;
    border-bottom: 1px solid #f6f6f6
}
.post:last-child {
    margin-bottom: 1.5em;
    border-bottom: none
}
.post-media {
    margin-bottom: 2em
}
.post-title,
.post.preview .post-media {
    margin-bottom: 1em
}
.post.preview {
    padding: 0 0 3em
}
.post.gridview {
    text-align: center;
    margin-top: 0;
    border: none
}
.meta-list {
    margin: 0 0 1em;
    padding: 0
}
.meta-list li {
    display: inline-block
}
.author,
.comment h6,
.meta::after {
    display: inline
}
.meta-list li:last-child .meta {
    margin-right: 0
}
.meta-list li:last-child .meta::after {
    content: none
}
.meta {
    font-family: "Roboto Regular", sans-serif;
    font-size: .75em;
    line-height: 1.4;
    color: #838379;
    margin-right: 1.5em
}
.meta::before {
    content: attr(data-text);
    font-size: inherit;
    line-height: inherit;
    font-weight: inherit;
    margin-right: .125em;
    color: #838379
}
.latest-post li::after,
.meta::after {
    content: ""
}
.categories-list li a,
.latest-post .post-title {
    font-family: Raleway, "Open Sans", Arial, Helvetica, sans-serif;
    font-size: .8em;
    line-height: 1.6;
    text-transform: uppercase
}
.meta::after {
    position: absolute;
    top: 41%;
    right: -12px;
    width: 4px;
    height: 4px;
    background-color: #838379
}
.sidebar,
.widget {
    position: relative
}
.post-text {
    margin: 1em 0 2em
}
.comments {
    padding: 1em 0 3em;
    margin: 2em 0 3em
}
.comments-list {
    margin: 0;
    padding: 0;
    text-align: justify
}
.comments-list li {
    padding: 1.5em 0;
    border-top: 1px solid #f6f6f6
}
.comments-list>li:first-child {
    border-top: none
}
.comments-list ul {
    margin: 0;
    padding: 1.5em 0 0 4.125em
}
.comments-list ul li:last-child {
    padding-bottom: 0
}
.comments-list ul.meta-list {
    display: inline;
    padding: 0
}
.comments-list ul.meta-list li {
    padding: 0;
    border-top: none
}
.comments-list ul.meta-list .meta {
    margin-right: 1.5em
}
.avatar {
    width: 3.25em;
    height: 3.25em;
    margin-right: 1.125em
}
.comment {
    overflow: hidden
}
.comment .meta {
    margin-right: .125em
}
.comment p {
    margin: 1.5em 0 1.875em
}
.author {
    text-transform: uppercase;
    margin-right: .625em
}
.leave-reply {
    margin: 1em 0
}
.sidebar {
    padding: 2.25em 0;
    text-align: left
}
#pricing-table,
.clients,
.contact,
.pricing,
.tweets,
.twitter-feed {
    text-align: center
}
.widget {
    display: block;
    margin-bottom: .625em
}
.latest-post {
    list-style: none;
    margin: 0;
    padding: 0
}
.latest-post li {
    display: block;
    margin-bottom: .625em
}
.latest-post li::after {
    display: block;
    width: 2em;
    height: 1px;
    margin-top: .625em;
    background: #101820
}
.latest-post li:last-child::after {
    background: none
}
.latest-post li .meta::after,
.latest-post li .meta::before {
    content: none
}
.latest-post .post-title {
    display: block;
    font-weight: 700;
    margin-bottom: 0
}
.categories-list {
    margin: 0 0 .625em;
    padding: 0
}
.categories-list li {
    position: relative;
    display: block;
    margin-bottom: 0
}
.categories-list li::before {
    content: "";
    display: inline;
    position: absolute;
    top: 45%;
    left: 0;
    width: 4px;
    height: 4px;
    background-color: #838379
}
.categories-list li a {
    margin-left: 1em;
    font-weight: 700
}
.categories-list li a::after {
    content: attr(data-text);
    display: inline;
    font-size: inherit;
    line-height: inherit;
    font-weight: 700;
    margin-left: .125em;
    color: #838379
}
.tags-list {
    margin: 0 0 3em;
    padding: 0 2em 0 0
}
.tags-list li {
    display: inline-block;
    margin: .25em .25em .25em 0
}
.tweets {
    position: relative;
    width: 100%;
    height: auto;
    padding: 6em 0;
    background: #fff;
    background-size: cover
}
.tweets::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
    opacity: .4
}
.twitter-carousel {
    width: 100%;
    height: auto;
    margin: 3em 0
}
.twitter-feed {
    font-family: "Roboto Regular", sans-serif;
    cursor: grab
}
.twitter-feed ul {
    margin: 0;
    padding: 0
}
.tweet_text,
.tweet_time,
.tweet_user {
    display: block
}
.tweet_text {
    padding: .4em;
    line-height: 1.4;
    color: #fff
}
.tweet_text a {
    font-family: inherit;
    color: #dbe4ed
}
.tweet_text a:hover {
    color: #b9cadc
}
.tweet_time a {
    color: #dbe4ed
}
.tweet_time a:hover {
    color: #b9cadc
}
.tweet_user {
    color: #dbe4ed;
    line-height: 1
}
.tweet_user:hover {
    color: #b9cadc
}
.tweet_user::before {
    content: "@";
    color: #dbe4ed
}
.tweet_user::before:hover {
    color: #b9cadc
}
.pricing {
    width: 100%;
    height: auto;
    padding: 6em 0;
    background: center center no-repeat #f2f2f2
}
#pricing-table .plan {
    text-shadow: 0 1px rgba(255, 255, 255, .8);
    background: #fff;
    padding: 20px;
    position: relative
}
#pricing-table #most-popular {
    background-color: #fff;
    z-index: 2;
    top: -18px;
    padding: 50px 20px;
    -moz-box-shadow: 20px 0 10px -10px rgba(0, 0, 0, .15), -20px 0 10px -10px rgba(0, 0, 0, .15);
    -webkit-box-shadow: 20px 0 10px -10px rgba(0, 0, 0, .15), -20px 0 10px -10px rgba(0, 0, 0, .15);
    box-shadow: 20px 0 10px -10px rgba(0, 0, 0, .15), -20px 0 10px -10px rgba(0, 0, 0, .15)
}
#pricing-table .title {
    font-size: 20px;
    font-family: raleway;
    font-weight: 500;
    padding: 20px;
    margin: -20px -20px 50px;
    border-top: 0
}
#pricing-table #most-popular .title {
    margin-top: -30px;
    padding-top: 30px;
    font-family: raleway;
    font-weight: 600
}
#pricing-table .title .price {
    display: block;
    font: 700 25px/90px Georgia, Serif;
    color: #777;
    background: #fff;
    border: 5px solid #fff;
    height: 100px;
    width: auto;
    margin: 10px auto -65px
}
#pricing-table ul {
    margin: 20px 0 0;
    padding: 0
}
#pricing-table li {
    border-top: 1px solid #ddd;
    padding: 14px 0
}
#pricing-table li:nth-child(2) {
    border: 0
}
.clients {
    position: relative;
    width: 100%;
    height: auto;
    padding: 7em 0;
    background: #FFF;
    background-size: cover
}
.btn-default.active,
.btn-default:active,
.btn-info.active,
.btn-info:active,
.btn-primary.active,
.btn-primary:active,
.btn-success.active,
.btn-success:active,
.form-control,
.open>.dropdown-toggle.btn-default,
.open>.dropdown-toggle.btn-info,
.open>.dropdown-toggle.btn-primary,
.open>.dropdown-toggle.btn-success {
    background-image: none
}
.clients::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
    opacity: .4
}
.brands,
.contact,
.map {
    position: relative
}
.brands {
    margin: 0;
    padding: 0;
    cursor: -webkit-grab;
    cursor: -moz-grab;
    cursor: grab
}
.brands img {
    margin: auto;
    opacity: .4;
    transition: all .2s ease 0s
}
.brands img:hover {
    opacity: 1;
    transition: all .2s ease 0s
}
.contact {
    width: 100%;
    height: auto;
    padding: 2em 0 4em
}
.address {
    text-align: left;
    margin-bottom: 3em
}
.contact-form,
.map {
    text-align: center
}
.adress_second {
    padding-left: 49px
}
.adress_second i.icon {
    margin-left: -49px
}
.address .fa,
.address .icon {
    display: block;
    float: left;
    width: 2em;
    height: 2em;
    font-size: 1.625em;
    text-align: center;
    margin-bottom: .375em
}
.form-detached {
    margin-bottom: 2em
}
.form-control {
    display: block;
    width: 100%;
    height: 34px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857;
    color: #555;
    background-color: #fff;
    border: 1px solid #d9d9d6;
    border-radius: 1px;
    box-shadow: none
}
.form-control:focus {
    border-color: #838379;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 3px rgba(217, 217, 214, .3);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 3px rgba(217, 217, 214, .3)
}
.map {
    width: 100%;
    height: 8em;
    overflow: hidden;
    -webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out
}
.opened .show-map,
.show-map {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2
}
#my-map {
    width: 100%;
    height: 40em
}
.show-map {
    width: 100%;
    height: 100%;
    padding: .25em 0;
    -webkit-box-pack: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -webkit-justify-content: center;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #fff;
    cursor: pointer
}
.show-map i,
.show-map span {
    display: block;
    color: #2b2b2b
}
.opened {
    height: 40em
}
.footer,
.opened .show-map {
    width: 100%;
    height: auto;
    text-align: center
}
.opened .show-map {
    display: table
}
.map.opened .helper {
    padding: 1em 0
}
.footer {
    position: relative;
    bottom: 0;
    background-color: #2b2b2b;
    line-height: 26px
}
.footer .container {
    padding-bottom: 39px;
    padding-top: 39px
}
.footer h6 {
    margin: 1.5em 0
}
.footer h6 a {
    position: relative;
    display: table;
    padding: 0;
    margin: auto;
    font-weight: 400;
    text-transform: uppercase;
    color: #101820
}
.btn,
.controls a,
.controls li {
    display: inline-block
}
.alignright,
.controls li:last-child {
    float: right
}
.footer .social-list.alignright i.fa {
    margin-left: 3px
}
.footer .social-list li a i {
    color: #8d8d8d;
    font-size: 16px;
    position: relative;
    top: 2px
}
@media only screen and (min-width: 40.063em) {
    .footer.fixed-bottom {
        position: fixed;
        z-index: -99
    }
    .footer.fixed-bottom h6 {
        margin-top: 0
    }
}
.btn,
.white-popup {
    position: relative
}
.btn {
    border: 2px solid #2b2b2b;
    color: #2b2b2b;
    font-family: Raleway, "Open Sans", Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    letter-spacing: 2px;
    margin: 10px 0;
    padding: 12px 25px 10px;
    text-shadow: none!important;
    text-transform: uppercase;
    transition: all .2s ease 0s;
    z-index: 1;
    border-radius: 0;
    background-color: transparent
}
.btn.focus,
.btn:focus,
.btn:hover {
    color: #101820;
    text-decoration: none
}
.btn-default {
    color: #2b2b2b
}
.btn-default.active,
.btn-default.focus,
.btn-default:active,
.btn-default:focus,
.btn-default:hover,
.open>.dropdown-toggle.btn-default {
    color: #FFF;
    background-color: #000;
    border-color: transparent
}
.btn-default.disabled,
.btn-default.disabled.active,
.btn-default.disabled.focus,
.btn-default.disabled:active,
.btn-default.disabled:focus,
.btn-default.disabled:hover,
.btn-default[disabled],
.btn-default[disabled].active,
.btn-default[disabled].focus,
.btn-default[disabled]:active,
.btn-default[disabled]:focus,
.btn-default[disabled]:hover,
fieldset[disabled] .btn-default,
fieldset[disabled] .btn-default.active,
fieldset[disabled] .btn-default.focus,
fieldset[disabled] .btn-default:active,
fieldset[disabled] .btn-default:focus,
fieldset[disabled] .btn-default:hover {
    background-color: #fff;
    border-color: #c8c9c7
}
.btn-default .badge {
    color: #fff;
    background-color: #101820
}
.btn-primary {
    color: #fff;
    background-color: #6787b7;
    border-color: #5679af
}
.btn-primary.active,
.btn-primary.focus,
.btn-primary:active,
.btn-primary:focus,
.btn-primary:hover,
.open>.dropdown-toggle.btn-primary {
    color: #fff;
    background-color: #4c6d9f;
    border-color: #405d87
}
.btn-primary.disabled,
.btn-primary.disabled.active,
.btn-primary.disabled.focus,
.btn-primary.disabled:active,
.btn-primary.disabled:focus,
.btn-primary.disabled:hover,
.btn-primary[disabled],
.btn-primary[disabled].active,
.btn-primary[disabled].focus,
.btn-primary[disabled]:active,
.btn-primary[disabled]:focus,
.btn-primary[disabled]:hover,
fieldset[disabled] .btn-primary,
fieldset[disabled] .btn-primary.active,
fieldset[disabled] .btn-primary.focus,
fieldset[disabled] .btn-primary:active,
fieldset[disabled] .btn-primary:focus,
fieldset[disabled] .btn-primary:hover {
    background-color: #6787b7;
    border-color: #5679af
}
.btn-primary .badge {
    color: #6787b7;
    background-color: #fff
}
.btn-success {
    color: #fff;
    background-color: #789d4a;
    border-color: #6b8c42
}
.btn-success.active,
.btn-success.focus,
.btn-success:active,
.btn-success:focus,
.btn-success:hover,
.open>.dropdown-toggle.btn-success {
    color: #fff;
    background-color: #5e7a3a;
    border-color: #4b622e
}
.btn-success.disabled,
.btn-success.disabled.active,
.btn-success.disabled.focus,
.btn-success.disabled:active,
.btn-success.disabled:focus,
.btn-success.disabled:hover,
.btn-success[disabled],
.btn-success[disabled].active,
.btn-success[disabled].focus,
.btn-success[disabled]:active,
.btn-success[disabled]:focus,
.btn-success[disabled]:hover,
fieldset[disabled] .btn-success,
fieldset[disabled] .btn-success.active,
fieldset[disabled] .btn-success.focus,
fieldset[disabled] .btn-success:active,
fieldset[disabled] .btn-success:focus,
fieldset[disabled] .btn-success:hover {
    background-color: #789d4a;
    border-color: #6b8c42
}
.btn-success .badge {
    color: #789d4a;
    background-color: #fff
}
.btn-info {
    color: #fff;
    background-color: #7ba4db;
    border-color: #6796d6
}
.btn-info.active,
.btn-info.focus,
.btn-info:active,
.btn-info:focus,
.btn-info:hover,
.open>.dropdown-toggle.btn-info {
    color: #fff;
    background-color: #5388d0;
    border-color: #3775c8
}
.btn-info.disabled,
.btn-info.disabled.active,
.btn-info.disabled.focus,
.btn-info.disabled:active,
.btn-info.disabled:focus,
.btn-info.disabled:hover,
.btn-info[disabled],
.btn-info[disabled].active,
.btn-info[disabled].focus,
.btn-info[disabled]:active,
.btn-info[disabled]:focus,
.btn-info[disabled]:hover,
fieldset[disabled] .btn-info,
fieldset[disabled] .btn-info.active,
fieldset[disabled] .btn-info.focus,
fieldset[disabled] .btn-info:active,
fieldset[disabled] .btn-info:focus,
fieldset[disabled] .btn-info:hover {
    background-color: #7ba4db;
    border-color: #6796d6
}
.btn-info .badge {
    color: #7ba4db;
    background-color: #fff
}
.btn-warning {
    color: #fff;
    background: rgba(0, 0, 0, 0);
    border: 2px solid #fff
}
.btn-danger.active,
.btn-danger:active,
.btn-warning.active,
.btn-warning:active,
.open>.dropdown-toggle.btn-danger,
.open>.dropdown-toggle.btn-warning {
    background-image: none
}
.btn_home:hover {
    background-color: #fff;
    color: #000
}
.btn-warning.active,
.btn-warning.focus,
.btn-warning:active,
.btn-warning:focus,
.btn-warning:hover,
.open>.dropdown-toggle.btn-warning {
    color: #fff;
    background-color: #000;
    border-color: transparent;
    box-shadow: 0 1px 0 rgba(0, 0, 0, .15)
}
.btn-warning.disabled,
.btn-warning.disabled.active,
.btn-warning.disabled.focus,
.btn-warning.disabled:active,
.btn-warning.disabled:focus,
.btn-warning.disabled:hover,
.btn-warning[disabled],
.btn-warning[disabled].active,
.btn-warning[disabled].focus,
.btn-warning[disabled]:active,
.btn-warning[disabled]:focus,
.btn-warning[disabled]:hover,
fieldset[disabled] .btn-warning,
fieldset[disabled] .btn-warning.active,
fieldset[disabled] .btn-warning.focus,
fieldset[disabled] .btn-warning:active,
fieldset[disabled] .btn-warning:focus,
fieldset[disabled] .btn-warning:hover {
    background-color: #000;
    border-color: #e9943d
}
.btn-warning .badge {
    color: #eca154;
    background-color: #fff
}
.btn-slide:hover {
    color: #000;
    background-color: #fff;
    border: 2px solid #fff
}
.btn-danger {
    background-color: #fff;
    border-color: transparent;
    color: #2b2b2b
}
.btn-danger.active,
.btn-danger.focus,
.btn-danger:active,
.btn-danger:focus,
.btn-danger:hover,
.open>.dropdown-toggle.btn-danger {
    color: #fff;
    background-color: #111;
    border-color: #000
}
.btn-danger.disabled,
.btn-danger.disabled.active,
.btn-danger.disabled.focus,
.btn-danger.disabled:active,
.btn-danger.disabled:focus,
.btn-danger.disabled:hover,
.btn-danger[disabled],
.btn-danger[disabled].active,
.btn-danger[disabled].focus,
.btn-danger[disabled]:active,
.btn-danger[disabled]:focus,
.btn-danger[disabled]:hover,
fieldset[disabled] .btn-danger,
fieldset[disabled] .btn-danger.active,
fieldset[disabled] .btn-danger.focus,
fieldset[disabled] .btn-danger:active,
fieldset[disabled] .btn-danger:focus,
fieldset[disabled] .btn-danger:hover {
    background-color: #c26e60;
    border-color: #bb5d4e
}
.btn-danger .badge {
    color: #c26e60;
    background-color: #fff
}
.btn-link {
    color: #337ab7;
    font-weight: 400;
    border-radius: 0
}
.btn-link,
.btn-link.active,
.btn-link:active,
.btn-link[disabled],
fieldset[disabled] .btn-link {
    background-color: transparent;
    -webkit-box-shadow: none;
    box-shadow: none
}
.btn-link,
.btn-link:active,
.btn-link:focus,
.btn-link:hover {
    border-color: transparent
}
.controls a,
.popup-nav {
    border: 1px solid #c8c9c7
}
.btn-link:focus,
.btn-link:hover {
    color: #23527c;
    text-decoration: underline;
    background-color: transparent
}
.btn-link[disabled]:focus,
.btn-link[disabled]:hover,
fieldset[disabled] .btn-link:focus,
fieldset[disabled] .btn-link:hover {
    color: #6a8fb4;
    text-decoration: none
}
.btn-group-sm>.btn,
.btn-sm {
    font-size: 10px;
    line-height: 1.5;
    padding: 5px 11px
}
.label-default {
    background-color: #6a8fb4
}
.label-default[href]:focus,
.label-default[href]:hover {
    background-color: #4e769d
}
.label-primary {
    background-color: #6787b7
}
.label-primary[href]:focus,
.label-primary[href]:hover {
    background-color: #4c6d9f
}
.label-success {
    background-color: #789d4a
}
.label-success[href]:focus,
.label-success[href]:hover {
    background-color: #5e7a3a
}
.label-info {
    background-color: #7ba4db
}
.label-info[href]:focus,
.label-info[href]:hover {
    background-color: #5388d0
}
.label-warning {
    background-color: #eca154
}
.label-warning[href]:focus,
.label-warning[href]:hover {
    background-color: #e78826
}
.label-danger {
    background-color: #c26e60
}
.label-danger[href]:focus,
.label-danger[href]:hover {
    background-color: #ad5142
}
.animated {
    -webkit-animation-duration: 1s;
    -moz-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    animation-fill-mode: both
}
.animated.delay-01 {
    -webkit-animation-delay: 0s;
    -moz-animation-delay: 0s;
    -ms-animation-delay: 0s;
    animation-delay: 0s
}
.animated.delay-02 {
    -webkit-animation-delay: .5s;
    -moz-animation-delay: .5s;
    -ms-animation-delay: .5s;
    animation-delay: .5s
}
.animated.delay-03 {
    -webkit-animation-delay: 1s;
    -moz-animation-delay: 1s;
    -ms-animation-delay: 1s;
    animation-delay: 1s
}
.animated.delay-04 {
    -webkit-animation-delay: 1.5s;
    -moz-animation-delay: 1.5s;
    -ms-animation-delay: 1.5s;
    animation-delay: 1.5s
}
.animated.delay-05 {
    -webkit-animation-delay: 2s;
    -moz-animation-delay: 2s;
    -ms-animation-delay: 2s;
    animation-delay: 2s
}
.animated.delay-06 {
    -webkit-animation-delay: 2.5s;
    -moz-animation-delay: 2.5s;
    -ms-animation-delay: 2.5s;
    animation-delay: 2.5s
}
.technologies img {
    width: 50px;
    filter: grayscale(80%);
    margin-bottom: 10px
}
.white-popup {
    background: #fff;
    padding: 0;
    width: auto;
    max-width: 1170px;
    margin: 0 auto
}
.mfp-content {
    width: 100%;
    background: center center no-repeat #e2ddd4;
    margin: 0 auto;
    padding: 0;
    min-height: 800px
}
.popup-nav {
    background: #fff
}
.controls {
    margin: 0;
    padding: 2em 0
}
.controls a {
    width: 2.25em;
    height: 2.25em;
    font-size: 1em;
    line-height: 2.25em;
    text-align: center;
    color: #c8c9c7;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px
}
.controls a:hover {
    color: #2f302e
}
.popup-wrap {
    margin: 5em 0
}
.popup-slider {
    margin: 0;
    cursor: -webkit-grab;
    cursor: -moz-grab;
    cursor: grab
}
.popup-slider.slick-slider {
    margin: 0;
    padding: 0
}
.project-wrap {
    padding: 1.875em;
    background: #fff
}
.project-wrap .btn {
    margin-top: 1.2em
}
.progress {
    margin-bottom: 20px;
    background-color: #d9d9d6;
    border-radius: 0;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .1) inset
}
.skill {
    width: 0;
    -webkit-transition: width 2s ease-in;
    -moz-transition: width 2s ease-in;
    -o-transition: width 2s ease-in;
    transition: width 2s ease-in
}
.panel-group .panel {
    margin-bottom: 0;
    border-radius: 1px
}
.panel-default>.panel-heading {
    color: #333;
    background-color: #fff;
    border-color: #DDD
}
.panel-title {
    font-family: "Roboto Regular", sans-serif
}