﻿/* latin */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    src: url(/content/font/OpenSans-Medium.ttf) format('ttf');
}
/* latin */
@font-face {
    font-family: 'Open Sans';
    font-weight: 600;
    src: url(/content/font/OpenSans-Bold.ttf) format('ttf');
}
/* latin-ext */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 700;
    src: url(/content/font/OpenSans-SemiBold.ttf) format('ttf');
   
}
/* =7. Column Grid
--------------------------------------------------------------------------------------------------------*/
.add-padding {
    padding: 0 45px;
}

span.padding {
    padding: 0 6px;
}

.padding-10 {
    padding-top: 10px;
}

.padding-20 {
    padding-top: 20px;
}

.padding-25 {
    padding-top: 25px;
}

.padding-30 {
    padding-top: 30px;
}

.overflow {
    overflow: hidden;
}

#container.no-margin {
    margin: 0px;
}

.no-margin .element {
    padding: 0px;
    overflow: hidden;
    -webkit-text-shadow: 0px 0 30px rgba(0, 0, 0, 0.4);
    text-shadow: 0px 0 30px rgba(0, 0, 0, 0.4);
}

.info-box {
    position: absolute;
    right: 20px;
    bottom: 20px;
    -webkit-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
}

    .info-box.centered {
        width: 100%;
        left: 0;
        bottom: 20px;
        top: auto;
    }

    .info-box.no-link, .info-box.no-overlay {
        right: 30px;
        bottom: 30px;
    }

    .info-box h3, .info-box h4, .info-box h5 {
        margin: 0px 0 0 0;
        padding: 15px 20px;
        color: #fff !important;
        display: inline-block;
    }

    .info-box.no-link h3, .info-box.no-link h4, .info-box.no-link h5, .info-box.no-link p, .info-box.no-overlay h3, .info-box.no-overlay h4, .info-box.no-overlay h5, .info-box.no-overlay p {
        background: #2b2b2b;
        padding: 6px 10px 8px !important;
    }

a:hover .info-box h3, a:hover .info-box h4, a:hover .info-box h5 {
    color: #fff !important;
}

.info-box p a, a .info-box p, a:hover .info-box p, .info-box p.small {
    color: #fff !important;
    border: 0;
    margin: 0 !important;
}

.info-box h3 span.small, .info-box h4 span.small, .info-box h5 span.small {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: #fff;
    padding-top: 3px;
    text-transform: uppercase;
    line-height: 1.25;
    font-style: normal !important;
    letter-spacing: 1px;
}



.covering-image {
    position: relative;
    top: -35px;
    width: 100%;
    height: 100%;
    background: rgba(47, 47, 46, 0.3);
    border: 0;
    -webkit-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
}

    .covering-image.hidden-default {
        opacity: 0;
        -webkit-transition: all 0.2s ease 0s;
        transition: all 0.2s ease 0s;
    }

a:hover .covering-image.hidden-default {
    opacity: 1;
    -webkit-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
}

a:hover .covering-image, .element:hover .covering-image {
    background: rgba(46, 46, 46, 0.5);
    -webkit-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
}

.info-box-content {
    height: 100%;
    width: 100%;
}

    .info-box-content .parent {
        height: 100%;
        width: 100%;
        padding: 0px;
    }

.covering-image h2, .covering-image h3, .covering-image p {
    color: #fff !important;
    background: none !important;
    display: inline-block;
    padding: 0px;
    margin: 0;
    margin-bottom: 5px;
    -webkit-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
    white-space: nowrap;
}

.covering-image p {
    display: block;
    opacity: 0.7;
}

a:hover .covering-image h2, a:hover .covering-image h3, a:hover .covering-image p {
    color: #fff !important;
}

a:hover .covering-image h2, a:hover .covering-image h3, .element:hover .covering-image h2 {
    -webkit-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
    margin-bottom: 10px;
}

a .covering-image h2, .element .covering-image h2 {
    position: relative;
    color: #fff !important;
    font-weight: 700;
}

    a .covering-image h2::after, .element .covering-image h2::after {
        content: "";
        background: #fff;
        bottom: 1px;
        display: block;
        left: 50%;
        height: 1px;
        position: absolute;
        -webkit-transition: all 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s;
        transition: all 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s;
        width: 0;
    }

a:hover .covering-image h2::after, .element:hover .covering-image h2::after {
    left: 0;
    width: 100%;
    color: #9f60ff;
}

.element .covering-image p a {
    color: #fff;
    opacity: 0.7;
}

    .covering-image.multiple-links p, .element .covering-image p a:hover {
        opacity: 1;
    }

        .element .covering-image p a:hover::after {
            left: 0;
            width: 0;
            color: #fff;
        }

.covering-image.multiple-links p {
    opacity: 0;
    margin-top: -14px;
}

.element:hover .covering-image.multiple-links p, .touch .covering-image.multiple-links p {
    opacity: 1;
    margin-top: 0px;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}
/* =End Column Grid
--------------------------------------------------------------------------------------------------------*/


/* =8. Content Elements
--------------------------------------------------------------------------------------------------------*/
.break {
    display: block;
    position: relative;
    height: 40px;
    width: 100%;
}

.medium-break {
    display: block;
    position: relative;
    height: 30px;
    width: 100%;
}

.small-break {
    display: block;
    position: relative;
    height: 20px;
    width: 100%;
}

.tiny-break {
    display: block;
    position: relative;
    height: 10px;
    width: 100%;
}

.centered-icons-break {
    display: block;
    position: relative;
    height: 1px;
    width: 100%;
}

.border-left-wrapper {
    padding-left: 25px;
}

    .border-left-wrapper p {
        margin: 0 0 0 0;
        padding-bottom: 0px;
    }

.borderline {
    background: #d8d8d8;
    width: 100%;
    height: 1px;
    display: block;
    position: relative;
    margin: 25px 0 20px 0;
}

.bordered-content {
    background: #fff;
    padding: 40px 45px 40px;
    position: relative;
    margin-bottom: 30px;
}

    .bordered-content.more-info {
        padding-top: 35px;
    }
/* =End Content Elements
--------------------------------------------------------------------------------------------------------*/

/* =10. Images
--------------------------------------------------------------------------------------------------------*/
.images {
    display: block;
    position: relative;
}

img {
    width: auto;
    max-width: 100%;
    z-index: 9;
    box-shadow: #fff 0 0 0;
}

.image-wrapper {
    position: relative;
    margin: 0px 0 30px;
}

.image-wrapper2 {
    position: relative;
    margin: 30px 0 30px;
}

.image-wrapper3 {
    position: relative;
}

.client {
    border-bottom: 1px solid #d8d8d8;
    width: 25%;
    padding: 0px;
    float: left;
    opacity: 0.85;
}

.col-lg-12 .client {
    width: 16.666%;
    border: 0;
}

.videos {
    border: 0;
    height: 350px;
    width: 620px;
}

.videoWrapper {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 */
    height: 0;
}

    .videoWrapper iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }
/* End Images*/

.no-margin .element {
    padding: 0px;
    overflow: hidden;
    -webkit-text-shadow: 0px 0 30px rgba(0, 0, 0, 0.4);
    text-shadow: 0px 0 30px rgba(0, 0, 0, 0.4);
}



.element h2 {
    /*font-size: 40px;*/
}

a:hover .covering-image, .element:hover .covering-image {
    background: rgba(46, 46, 46, 0.5);
    -webkit-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
}

    a:hover .covering-image h2, a:hover .covering-image h3, .element:hover .covering-image h2 {
        -webkit-transition: all 0.2s ease 0s;
        transition: all 0.2s ease 0s;
        margin-bottom: 10px;
    }

a .covering-image h2, .element .covering-image h2 {
    position: relative;
    color: #fff;
}

    a .covering-image h2::after, .element .covering-image h2::after {
        content: "";
        background: #fff;
        bottom: 1px;
        display: block;
        left: 50%;
        height: 1px;
        position: absolute;
        -webkit-transition: all 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s;
        transition: all 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s;
        width: 0;
    }

a:hover .covering-image h2::after, .element:hover .covering-image h2::after {
    left: 0;
    width: 100%;
    color: #9f60ff;
}

.element .covering-image p a {
    color: #fff;
    opacity: 0.7;
}

    .covering-image.multiple-links p, .element .covering-image p a:hover {
        opacity: 1;
    }

        .element .covering-image p a:hover::after {
            left: 0;
            width: 0;
            color: #fff;
        }

.covering-image.multiple-links p {
    opacity: 0;
    margin-top: -14px;
}

.element:hover .covering-image.multiple-links p, .touch .covering-image.multiple-links p {
    opacity: 1;
    margin-top: 0px;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

.clearfix:after {
    content: ".";
    display: block;
    height: 20px;
    clear: both;
    visibility: hidden;
}

.clearfix {
    display: block;
}

.margin-wrapper {
    margin: -10px;
    position: relative;
}

article .margin-wrapper {
    width: 40%;
    float: left;
    margin-bottom: 40px;
}

article.col-lg-12 .margin-wrapper {
    width: 40%;
}

.images {
    display: block;
    position: relative;
    cursor: pointer;
}

figure img {
    width: auto;
    max-width: 100% !important;
    z-index: 9;
    box-shadow: #fff 0 0 0;
    /*-webkit-filter: grayscale(100%);
    filter: grayscale(100%);*/
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}

figure:hover img, a .covering-image h2 figure:hover img, .element .covering-image h2 figure:hover img {
    -webkit-filter: grayscale(0);
    filter: grayscale(0);
}


.covering-image.hidden-default {
    opacity: 0;
    -webkit-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
}

a:hover .covering-image.hidden-default {
    opacity: 1;
    -webkit-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
}

a:hover .covering-image, .element:hover .covering-image {
    background: rgba(46, 46, 46, 0.5);
    -webkit-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
}

.covering-image h2, .covering-image h3, .covering-image p {
    color: #fff !important;
    background: none !important;
    display: inline-block;
    padding: 0px;
    margin: 0;
    margin-bottom: 5px;
    -webkit-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
    white-space: nowrap;
}

.covering-image p {
    display: block;
    opacity: 0.7;
}

a:hover .covering-image h2, a:hover .covering-image h3, a:hover .covering-image p {
    color: #9f60ff !important;
}

a:hover .covering-image h2, a:hover .covering-image h3, .element:hover .covering-image h2 {
    -webkit-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
    margin-bottom: 10px;
}

a .covering-image h2, .element .covering-image h2 {
    position: relative;
    color: #fff;
}

    a .covering-image h2::after, .element .covering-image h2::after {
        content: "";
        background: #fff;
        bottom: 1px;
        display: block;
        left: 50%;
        height: 1px;
        position: absolute;
        -webkit-transition: all 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s;
        transition: all 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s;
        width: 0;
    }

a:hover .covering-image h2::after, .element:hover .covering-image h2::after {
    left: 0;
    width: 100%;
    color: #9f60ff;
}

.element .covering-image p a {
    color: #fff;
    opacity: 0.7;
}

    .covering-image.multiple-links p, .element .covering-image p a:hover {
        opacity: 1;
    }

        .element .covering-image p a:hover::after {
            left: 0;
            width: 0;
            color: #fff;
        }

.covering-image.multiple-links p {
    opacity: 0;
    margin-top: -14px;
}

.element:hover .covering-image.multiple-links p, .touch .covering-image.multiple-links p {
    opacity: 1;
    margin-top: 0px;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

.info-box-content {
    height: 100%;
    width: 100%;
    float: left;
}

    .info-box-content .parent {
        height: 100%;
        width: 100%;
        padding: 0px;
    }

.parent {
    width: 100%;
    margin: 0px auto;
    position: absolute;
    height: 220px;
    z-index: 11;
}

.child {
    text-align: center;
}


/*.child {
    display: table-cell;
    vertical-align: middle;
    padding: 0 25px;
}*/

.covering-image h2, .covering-image h3, .covering-image p {
    color: #fff !important;
    background: none !important;
    display: inline-block;
    padding: 0px;
    margin: 0;
    margin-bottom: 5px;
    -webkit-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
    white-space: nowrap;
}

.covering-image p {
    display: none;
    opacity: 0.7;
}

a:hover .covering-image h2, a:hover .covering-image h3, a:hover .covering-image p {
    color: #9f60ff !important;
}

a:hover .covering-image h2, a:hover .covering-image h3, .element:hover .covering-image h2 {
    -webkit-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
    margin-bottom: 10px;
}

a .covering-image h2, .element .covering-image h2 {
    position: relative;
    color: #fff;
    /* float: right; */
    /* bottom: 0; */
    /*background-color: #fff !important;*/
    width: 100%;
    cursor: pointer;
    /*opacity: 0.8;*/
    color: #000 !important;
    font-size: 25px;
    text-align: left;
}




    a .covering-image h2::after, .element .covering-image h2::after {
        content: "";
        background: #fff;
        bottom: 1px;
        display: block;
        left: 50%;
        height: 1px;
        position: absolute;
        -webkit-transition: all 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s;
        transition: all 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s;
        width: 0;
    }

a:hover .covering-image h2::after, .element:hover .covering-image h2::after {
    left: 0;
    width: 100%;
    color: #9f60ff;
}

/* Large Devices (large desktops, 1200px and below) */
@media only screen and (max-width: 1200px) {
    .only-lg {
        display: none;
    }

    .centered-md {
        float: none;
        display: inline-block;
        margin: 40px 5px 20px 5px;
    }

    .centered-md {
        text-align: center;
    }
}

@media only screen and (max-width: 1366px) {
    .only-lg {
        display: none;
    }

    .centered-md {
        float: none;
        display: inline-block;
        margin: 40px 5px 20px 5px;
    }

    .centered-md {
        text-align: center;
    }
}

@media only screen and (max-width: 1093px) {
    .dropdown, .dropup {
        float: none !important;
        height: 50px;
        position: relative;
        text-align: center;
        width: 111px;
        display: inline-block;
    }

    .center-menu ul div {
        width: 100%;
        height: auto;
        position: relative;
    }

        .center-menu ul div a {
            padding-top: 15px;
            padding-bottom: 15px;
            height: 40px;
        }

    .center-menu ul li:nth-child(4) {
        width: 100%;
        /* position: relative; */
        /* padding-top: 10px; */
    }

    .work-dropdown ul li {
        position: relative;
        height: 35px;
    }

    .dropup .dropdown-menu, .navbar-fixed-bottom .dropdown .dropdown-menu {
        margin-bottom: 11px !important;
        height: auto !important;

    }

    .navbar-nav .open .dropdown-menu > li > a {
        padding-top: 14px;
        height: 35px;
    }

    .navbar-nav .open .dropdown-menu {
        position: relative;
        margin-top: 41px;
    }
}


/* Medium Devices (desktops and laptops, 992px and below) */
@media only screen and (max-width: 992px) {
    .col-lg-12 .client {
        width: 33.33333%;
    }

    .comment-reply-button-column a {
        opacity: 1;
    }

    .comment-content {
        max-width: 50%;
    }
}


/* Mobile Portrait Size to Mobile Landscape Size (tablets and smartphones, 767px and below) */
@media only screen and (max-width: 768px) {
    #headline_cycler ul.flexslider > li > h1, #headline h1, h1 {
        font-size: 40px;
    }

    .col-lg-3 .alignright {
        float: none;
        padding-top: 10px;
    }

    .project-pagination .col-lg-3 .alignright {
        float: right;
        padding-top: 0px;
    }

    header {
        position: relative !important;
    }

    .blog-author-picture {
        float: none;
        margin: 0 auto;
        padding: 0;
        width: 75%;
    }

    .blog-author-description {
        width: auto;
        padding-top: 20px;
        padding-right: 0;
        text-align: center;
    }

    .comment, .comment-count {
        text-align: center;
    }

    .commenter-avatar {
        padding: 0;
        margin: 0 auto;
        width: 150px;
        display: inline-block;
        float: none;
    }

    .comment-content {
        padding-top: 20px;
        display: block;
        width: 100%;
        max-width: 100%;
    }

    .comment.reply.level-1 {
        padding-left: 0;
    }

    .comment-reply-button-column {
        float: none;
    }

    .comment-form-icon-wrapper {
        position: relative;
        top: 0;
        left: 0;
        text-align: center;
        margin: 0 auto;
        margin-bottom: 30px;
    }

        .comment-form-icon-wrapper:before {
            display: inline-block;
        }

    .comment-form {
        padding: 0;
    }

        .comment-form > input, .comment-form > textarea {
            width: 100%;
        }

    .border-left-wrapper {
        padding-left: 15px;
        padding-top: 25px;
    }

    /*nav.collapsed.open #navbar .center-menu li {
        height: 34px !important;
    }*/

    .dropdown-menu > .active > a, .dropdown-menu > .active > a:focus, .dropdown-menu > .active > a:hover {
        color: #fff !important;
    }

    figure img {
        max-width: 95% !important;
    }
}


/* Mobile Landscape Size to Tablet Portrait (smartphones, 480px and below) */
@media only screen and (max-width: 480px) {
    .col-lg-12 .client {
        width: 50%;
    }

    h1 {
        font-size: 40px;
        letter-spacing: 0;
    }


    h3 {
        font-size: 30px;
    }

    footer .alignleft, footer .alignright {
        float: none;
    }

    .add-padding {
        padding: 0;
    }

    .bordered-content {
        padding: 30px 35px 30px;
    }

        .bordered-content.more-info {
            padding-top: 25px;
        }

    article .margin-wrapper, article .article-heading {
        width: 100% !important;
        margin-bottom: 0px;
        padding: 0px;
    }

    article .article-heading {
        padding-bottom: 30px !important;
    }

    .grey-xs {
        background: #f5f5f5 !important;
    }

    .child {
        padding: 0;
    }

    .popup-content {
        padding: 25px;
    }


    header {
        position: absolute;
    }

    .margin-wrapper .button {
        display: none;
    }

    .left-corner-wrapper {
        position: relative;
    }

    h1#logo {
        display: block;
        position: relative;
        left: auto;
        top: auto;
        margin: 0;
        width: 100%;
        background: none;
        text-align: center;
    }

        h1#logo a {
            display: inline-block;
            margin: 0 auto;
        }

    #social-header {
        display: table;
        height: 90px;
        padding-top: 0;
    }

        #social-header .social-list {
            display: table-cell;
            vertical-align: middle;
            padding-bottom: 0;
        }

    #menu-button {
        top: 15px;
        position: absolute;
    }

    #nav-button:hover {
        width: 50px;
        padding: 18px 15px 0 15px;
    }

    .section.header-section, .centralizing-wrapper {
        height: 260px;
    }

    .section {
        padding: 57px 0;
    }

    .intro {
        height: 260px;
    }

    .centered-md .alignright.button {
        margin-top: 0 !important;
        margin-bottom: 5px;
    }

    .custom-pagination .left, .custom-pagination .right {
        clear: both;
        display: block;
        width: 100%;
    }
}

figure {
    float: left;
    margin: 0;
}


.caret-up {
    /* Safari */
    -webkit-transform: rotate(-180deg);
    /* Firefox */
    -moz-transform: rotate(-180deg);
    /* IE */
    -ms-transform: rotate(-180deg);
    /* Opera */
    -o-transform: rotate(-180deg);
    /* Internet Explorer */
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=6);
}

.dropdown, .dropup {
    float: left;
    height: 100px;
    position: relative;
    text-align: center;
    width: 111px;
}


    .dropdown:hover, .dropup:hover {
        background-color: #eee;
    }

    .dropup a {
        cursor: pointer;
        font-size: 14px;
        height: 100%;
        width: 100%;
        padding-top: 39px;
        float: left;
        letter-spacing: 3px;
    }

    .dropup ul li::before {
        border-left: none;
        border-right: none;
    }


    .dropup .dropdown-menu, .navbar-fixed-bottom .dropdown .dropdown-menu {
        top: auto;
        bottom: 100%;
        margin-bottom: 2px;
        width: 207px;
        height: auto;
    }

.dropdown-menu > li > a {
    line-height: 2.42857143;
}

.slimScrollDiv {
    margin-top: -10px;
}



/**/
/* to the body element */
.noscroll {
    overflow: hidden;
}

@media (min-device-width: 1025px) {
    .noscroll {
        padding-right: 15px;
    }
}

.overlay {
    position: fixed;
    overflow-y: scroll;
    top: 0;
    left: 0;
    top: 0;
    bottom: 0;
}

[aria-hidden="true"] {
    transition: opacity 1s, z-index 0s 1s;
    width: 100vw;
    z-index: -1;
}

[aria-hidden="false"] {
    transition: opacity 1s;
    width: 100%;
    z-index: 999;
    opacity: 1;
}


/* this code is not strictly necessary: just to make this demo a bit pleasant */


.overlay {
    background: rgba(40,40,40, .75);
}

.overlay-container {
    background-color: #fff;
    height: 100%;
    left: 25%;
    margin-top: 54px;
    max-width: 919px;
    min-width: 322px;
    position: absolute;
    width: 50%;
}



.social-list {
    padding-bottom: 64px;
    margin: 0;
    cursor: default;
    font-size: 0;
    margin-top: 19px;
    margin-left: -18px;
}

    .social-list li {
        display: inline-block;
        padding: 0 5px;
    }

        .social-list li a i {
            color: #2b2b2b;
            font-size: 18px;
        }

.popup-content h2 {
    font-size: 43px;
    padding-bottom: 20px;
    padding-top: 20px;
}

.longcontent {
    margin: 25% 5%;
    line-height: 300px;
    text-align: center;
    background: green;
}

.modal {
    /*position: fixed;
    overflow: auto;
    top: 9%;
    right: 9%;
    left: 9%;
    bottom: 9%;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);*/
}

    /*.modal .longcontent {
        background: yellow;
        margin: 10% 20%;
    }*/

/*.modal-backdrop {
    position: absolute !important;
    display: none;
}*/

.centered ul li:before {
    border-left: none;
    border-right: none;
    border-top: none;
}

/*.modal-header button {
    width: 3%;
    height: 22px;
}*/






/*//*/

#nav {
    margin: 0px;
    padding: 0px;
    display: block;
    float: left;
    height: 100px;
    position: relative;
    text-align: center;
    width: 111px;
}

    #nav > li {
        list-style-type: none;
        float: left;
        display: block;
        margin: 0px 10px;
        position: relative;
        padding-top: 35px;
        width: 100px;
        color: #000;
    }

        #nav > li ul {
            position: absolute;
            bottom: 100%;
        }

    #nav li:hover > ul {
        display: block;
    }

    #nav > li:hover {
        -moz-border-radius: 10px;
        -webkit-border-radius: 10px;
    }

    #nav li ul {
        margin: 0px;
        padding: 0px;
        display: none;
    }

        #nav li ul li {
            list-style-type: none;
            margin: 10px 0 0 0;
        }

            #nav li ul li a {
                display: block;
                padding: 5px 10px;
                color: #bdb49f;
                text-decoration: none;
            }

            #nav li ul li:hover a {
                color: #b15815;
                -moz-border-radius: 5px;
                -webkit-border-radius: 5px;
            }

    #nav li span {
        cursor: pointer;
        margin: 0px 10px;
        font-weight: bold;
    }



    #nav:hover {
        background-color: #eee;
    }

.dropdown-menu > .active > a, .dropdown-menu > .active > a:focus, .dropdown-menu > .active > a:hover {
    color: #fff !important;
}

a .covering-image h2:hover, .element .covering-image h2:hover {
    color: green !important;
    background-color: #000;
}

a .covering-image h2:hover, .element .covering-image h2:hover {
    color: #9f60ff !important;
}
/*Dropup menu*/

#dropup-menu-item * {
    padding: 0;
    list-style-type: none;
}

#dropup-menu-item {
    margin-top: -2px;
    float: left;
    line-height: 10px;
    left: 200px;
}

    #dropup-menu-item a {
        display: block;
        text-decoration: none;
        color: #3B5330;
    }

        #dropup-menu-item a:hover {
            background-color: #eee;
        }

    #dropup-menu-item ul li a:hover {
        color: #000;
    }

    #dropup-menu-item ul li ul li a:hover {
        background: #ecf1e7;
    }

    #dropup-menu-item ul li ul li {
        width: 181px;
        border: none;
        color: #9f60ff;
        padding-top: 3px;
        padding-bottom: 3px;
        padding-left: 3px;
        padding-right: 3px;
        background: #fff;
        z-index: 1;
        height: 50px;
        line-height: 40px;
    }

    #dropup-menu-item:hover ul li:hover ul li:hover ul {
        position: absolute;
        margin-left: 178px;
        margin-top: -32px;
        font: 10px;
    }

    #dropup-menu-item ul li ul li ul li {
        width: 96%;
        border: none;
        color: #9f60ff;
        padding-top: 3px;
        padding-bottom: 3px;
        padding-left: 39px;
        padding-right: 3px;
        background: #fff;
        z-index: 1;
        height: 39px;
    }

        #dropup-menu-item ul li ul li ul li a {
            float: left;
            margin-left: -40px;
            width: 134px;
        }


    #dropup-menu-item ul li ul li a {
        font-size: 13px;
        padding-top: 3px;
        padding-bottom: 3px;
    }

    #dropup-menu-item ul li ul li center {
        margin-left: 1px;
        text-align: left;
    }

    #dropup-menu-item ul li {
        float: left;
        width: 146px;
        list-style: none;
    }

        #dropup-menu-item ul li a {
            padding: 38px 10px;
            font-size: 14px;
        }

.work-letter {
    letter-spacing: 3px;
}

#dropup-menu-item ul li:before {
    display: none !important;
}



#dropup-menu-item li {
    position: relative;
    float: left;
}

#dropup-menu-item ul li ul, #dropup-menu-item:hover ul li ul, #dropup-menu-item:hover ul li:hover ul li ul {
    display: none;
    list-style-type: none;
    width: 140px;
}

#dropup-menu-item:hover ul, #dropup-menu-item:hover ul li:hover ul, #dropup-menu-item:hover ul li:hover ul li:hover ul {
    display: block;
}



    #dropup-menu-item:hover ul li:hover ul {
        position: absolute;
        margin-top: 1px;
        font: 10px;
    }

#dropup-menu-item > ul > li:hover > ul {
    bottom: 102%;
    border-bottom: 1px solid transparent;
}

/*Dropup menu end*/
@media only screen and (max-width: 1128px) {
    .work-dropdown {
        display: inline-block;
    }

    #dropup-menu-item {
        display: none;
    }

    nav.collapsed.open #navbar.small #all-pages > ul {
        max-height: 62vh;
        overflow: auto;
    }

        nav.collapsed.open #navbar.small #all-pages > ul > li {
            display: inline;
        }
}

@media only screen and (min-width: 1129px) {
    .work-dropdown {
        display: none !important;
    }

    #dropup-menu-item {
        display: block;
    }
}

.category-group i {
    font-size: 37px;
}



    .category-group i:hover, .category-group i:focus, .category-group i:active {
        box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5);
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
    }

.navbar-fixed-top + .content-container {
    margin-top: 70px;
}

.content-container {
    margin: 0 130px;
}

.directors {
    font-size: 12px;
    color: rgba(0, 0, 0, 0.4);
    padding-top: 0px;
    text-transform: capitalize;
    letter-spacing: 2px;
    margin-top: -1px;
    float: left;
}
