/* Table of Contents
==================================================
# Global Style
# Header
# Slider
# Body Row Wrapper
# Customize The Navbar
# Services
# Portfolio
# Team
# Clients
# Blog
# Contact
# Popup Modal
*/

/* Global Styles
================================================== */

html {
    -webkit-font-smoothing : antialiased;
    text-rendering         : optimizeLegibility;
    -ms-overflow-x         : hidden;
    overflow-x             : hidden;
}

body {
    color       : #fff;
    font-family : "Lato", sans-serif;
    font-size   : 16px;
    line-height : 24px;
    font-weight : 400;
}

h1, h2, h3, h4, h5 {
    font-family    : "Lato", sans-serif;
    color          : #fff;©
    text-transform : uppercase;
    margin         : 0;
    padding        : 0;
}

.right-top-fold h2 {
    text-align : left;
    display    : block;
}

.left-top-fold h2 {
    text-align : right;
    display    : block;
}

h2 {
    font-size   : 48px;
    padding     : 50px 0;
    font-weight : 300;
}

h2 span {
    font-weight : 400;
}

h3 {
    font-size   : 24px;
    font-weight : bold;
}

.body-inner-wrapper {
    overflow : hidden;
}

a {
    color : #eb1c23;
}

a, a:hover {
    text-decoration : none;
}

.rounded {
    border        : 5px solid #ffffff;
    border-radius : 50%;
    display       : inline-block;
    text-align    : center;
    margin        : 0 10px;
    cursor        : pointer;
}

.rounded:hover {
    border : 5px dashed #ffffff;
}

.rounded i {
    font-size              : 3em;
    font-weight            : bold;
    color                  : #ffffff;
    padding                : 10px;
    width                  : 70px;
    height                 : 70px;
    -webkit-font-smoothing : antialiased;
}

.modal-direction .close-window i {
    font-weight : normal;
}

.media .pull-left {
    margin-right : 30px;
}

/* Header
================================================== */
.navbar-wrapper {
    margin-top : 65px;
}

.navbar-wrapper .inner-container {
    left     : 242px;
    position : relative;
}

.navbar-wrapper .container {
    left     : -190px;
    position : relative;
}

#navigation-bar {
    border           : none;
    background-color : rgba(34, 34, 34, 0.80);
    margin           : 0;
}

#logo {
    position         : absolute;
    width            : 200px;
    height           : 122px;
    padding          : 0;
    top              : -26px;
    background-color : red;
}

#logo:before {
    content       : " ";
    position      : absolute;
    top           : 0%;
    right         : -26px;
    width         : 0px;
    height        : 0px;
    border-bottom : 26px solid rgba(0, 0, 0, 0.5);
    border-right  : 26px solid transparent;
}

#logo:after {
    content      : " ";
    position     : absolute;
    bottom       : 0;
    right        : -26px;
    width        : 0px;
    height       : 0px;
    border-top   : 26px solid rgba(0, 0, 0, 0.5);
    border-right : 26px solid transparent;
}

#menu {
    margin-left : 220px;
    overflow    : hidden;
}

#menu > ul > li {
    margin             : 0 6px;
    display            : inline-block;
    float              : none;
    -webkit-transition : 0.5s;
    -moz-transition    : 0.5s;
    -o-transition      : 0.5s;
    -ms-transition     : 0.5s;
    transition         : 0.5s;
}

#menu > ul > li > a {
    text-align     : center;
    color          : rgba(255, 204, 255, 0);
    padding        : 25px 16px;
    position       : relative;
    z-index        : 0;
    font-size      : 16px;
    text-transform : uppercase;
    font-weight    : 400;
}

#menu > ul > li > a:before, #menu > ul > li > a:after {
    padding                 : 25px 16px;
    display                 : block;
    width                   : 100%;
    height                  : 100%;
    position                : absolute;
    text-align              : center;
    color                   : #fff;
    left                    : 0;
    top                     : 0;
    -webkit-transform-style : preserve-3d;
    -moz-transform-style    : preserve-3d;
    -ms-transform-style     : preserve-3d;
    transform-style         : preserve-3d;
    -webkit-transition      : 0.5s;
    -moz-transition         : 0.5s;
    -o-transition           : 0.5s;
    -ms-transition          : 0.5s;
    transition              : 0.5s;
    -webkit-perspective     : 800;
}

#menu > ul > li.active {
    -webkit-transform : scale(1.2);
    -moz-transform    : scale(1.2);
    -o-transform      : scale(1.2);
    -ms-transform     : scale(1.2);
    transform         : scale(1.2);
}

#menu > ul > li:hover {
    -webkit-transform : scale(1.2);
    -moz-transform    : scale(1.2);
    -o-transform      : scale(1.2);
    -ms-transform     : scale(1.2);
    transform         : scale(1.2);
}

#menu > ul > li.active.home > a, #menu > ul > li.home:hover, #menu > ul > li.home > a:hover:after {
    background-color : #eb1c23;
}

#menu > ul > li.active.service > a, #menu > ul > li.service:hover, #menu > ul > li.service > a:hover:after {
    background-color : #e8432a;
}

#menu > ul > li.active.portfolio > a, #menu > ul > li.portfolio:hover, #menu > ul > li.portfolio > a:hover:after {
    background-color : #80b536;
}

#menu > ul > li.active.about > a, #menu > ul > li.about:hover, #menu > ul > li.about > a:hover:after {
    background-color : #2e3947;
}

#menu > ul > li.active.team > a, #menu > ul > li.team:hover, #menu > ul > li.team > a:hover:after {
    background-color : #00bf73;
}

#menu > ul > li.active.client > a, #menu > ul > li.client:hover, #menu > ul > li.client > a:hover:after {
    background-color : #face2f;
}

#menu > ul > li.active.blog > a, #menu > ul > li.blog:hover, #menu > ul > li.blog > a:hover:after {
    background-color : #232829;
}

#menu > ul > li.active.contact > a, #menu > ul > li.contact:hover, #menu > ul > li.contact > a:hover:after {
    background-color : #d6d6d6;
}

#menu > ul > li > a:before {
    content                     : attr(data-title);
    -webkit-backface-visibility : hidden;
    -webkit-transform           : rotateX(0deg) translateZ(-25px);
    -moz-transform              : rotateX(0deg) translateZ(-25px);
    -o-transform                : rotateX(0deg) translateZ(-25px);
    -ms-transform               : rotateX(0deg) translateZ(-25px);
    transform                   : rotateX(0deg) translateZ(-25px);
}

#menu > ul > li > a:after {
    content           : attr(data-title);
    -webkit-transform : rotateX(90deg) translateZ(25px);
    -moz-transform    : rotateX(90deg) translateZ(25px);
    -o-transform      : rotateX(90deg) translateZ(25px);
    -ms-transform     : rotateX(90deg) translateZ(25px);
    transform         : rotateX(90deg) translateZ(25px);
    color             : #fff;
}

#menu > ul > li > a:hover:before {
    -webkit-transform : rotateX(90deg) translateZ(-25px);
    -moz-transform    : rotateX(90deg) translateZ(-25px);
    -o-transform      : rotateX(90deg) translateZ(-25px);
    -ms-transform     : rotateX(90deg) translateZ(-25px);
    transform         : rotateX(90deg) translateZ(-25px);
}

#menu > ul > li > a:hover:after {
    -webkit-transform : rotateX(0deg) translateZ(25px);
    -moz-transform    : rotateX(0deg) translateZ(25px);
    -o-transform      : rotateX(0deg) translateZ(25px);
    -ms-transform     : rotateX(0deg) translateZ(25px);
    transform         : rotateX(0deg) translateZ(25px);
    background-color  : #eb1c23;
}

.centered {
    text-align : center;
}

.sticky-menu {
    position          : fixed !important;
    z-index           : 9999 !important;
    margin-top        : 5px !important;

    -webkit-animation : fadeInDown 500ms;
    -moz-animation    : fadeInDown 500ms;
    -ms-animation     : fadeInDown 500ms;
    -o-animation      : fadeInDown 500ms;
    animation         : fadeInDown 500ms;
}

.navbar-wrapper.sticky-menu .container {
    left : -190px;
}

.sticky-menu #logo {
    display : none;
}

.sticky-menu .inner-container {
    left  : 0 !important;
    right : 0 !important;
}

/* Slider
================================================== */
#main-slider {
    position : relative;
    z-index  : 0;
}

#main-slider .carousel h2 {
    font-size : 48px;
    color     : #fff;
    padding   : 0;
}

#main-slider .carousel h2 span {
    font-weight : 900;
    color       : #eb1c23;
}

#main-slider .carousel .item {
    background-position     : 50%;
    background-repeat       : no-repeat;

    -webkit-background-size : cover;
    -moz-background-size    : cover;
    background-size         : cover;
    left                    : 0 !important;
    -ms-filter              : "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter                  : alpha(opacity=0);
    opacity                 : 0;
    top                     : 0;
    position                : absolute;
    width                   : 100%;
    display                 : block !important;
    height                  : 800px;

    -webkit-transition      : opacity ease-in-out 500ms;
    -moz-transition         : opacity ease-in-out 500ms;
    -o-transition           : opacity ease-in-out 500ms;
    -ms-transition          : opacity ease-in-out 500ms;
    transition              : opacity ease-in-out 500ms;
}

#main-slider .carousel .item:first-child {
    top      : auto;
    position : relative;
}

#main-slider .carousel .item.active {
    -ms-filter         : "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter             : alpha(opacity=100);
    opacity            : 1;

    -webkit-transition : opacity ease-in-out 500ms;
    -moz-transition    : opacity ease-in-out 500ms;
    -o-transition      : opacity ease-in-out 500ms;
    -ms-transition     : opacity ease-in-out 500ms;
    transition         : opacity ease-in-out 500ms;
    z-index            : 1;
}

#main-slider .prev, #main-slider .next {
    position   : absolute;
    top        : 50%;
    display    : inline-block;
    margin-top : -25px;
    z-index    : 5;
}

#main-slider .prev {
    left : 10px;
}

#main-slider .next {
    right : 10px;
}

#main-slider .rounded {
    border : 5px solid rgba(0, 0, 0, .3);
}

#main-slider .rounded i {
    color : rgba(0, 0, 0, .3);
}

#main-slider .carousel-content {
    margin-top : 38%;
    padding    : 0 50px;
}

#main-slider .content-nav a {
    background  : url(../images/slider/down-arrow.png) 0 0 no-repeat;
    text-indent : -9999em;
    width       : 75px;
    height      : 34px;
    display     : inline-block;
    margin-top  : 10px;
}

#main-slider .content-nav a:hover {
    -ms-filter : "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
    filter     : alpha(opacity=70);
    opacity    : .7;
}

#video_background {
    position   : absolute;
    bottom     : 0px;
    right      : 0px;
    min-width  : 100%;
    min-height : 100%;
    max-height : 4000%;
    max-width  : 1000%;
    width      : auto;
    height     : auto;
    z-index    : -1000;
    overflow   : hidden;
}

#video_pattern {
    background-image : url(../images/pattern.png);
    position         : fixed;
    -ms-filter       : "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
    filter           : alpha(opacity=80);
    opacity          : 0.8;
    left             : 0px;
    top              : 0px;
    width            : 100%;
    height           : 100%;
    z-index          : -1;
}

#main-slider .active .animation.animated-item-1 {
    -webkit-animation : fadeInUp 300ms linear;
    -moz-animation    : fadeInUp 300ms linear;
    -ms-animation     : fadeInUp 300ms linear;
    -o-animation      : fadeInUp 300ms linear;
    animation         : fadeInUp 300ms linear;
}

#main-slider .active .animation.animated-item-2 {
    -webkit-animation : fadeInUp 500ms linear 300ms;
    -moz-animation    : fadeInUp 500ms linear 300ms;
    -ms-animation     : fadeInUp 500ms linear 300ms;
    -o-animation      : fadeInUp 500ms linear 300ms;
    animation         : fadeInUp 500ms linear 300ms;
}

#main-slider .active .animation.animated-item-3 {
    -webkit-animation : fadeInUp 500ms linear 300ms;
    -moz-animation    : fadeInUp 500ms linear 300ms;
    -ms-animation     : fadeInUp 500ms linear 300ms;
    -o-animation      : fadeInUp 500ms linear 300ms;
    animation         : fadeInUp 500ms linear 300ms;
}

@keyframes "fadeInUp" {
    0% {
        -ms-filter        : "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
        filter            : alpha(opacity=0);
        opacity           : 0;
        -webkit-transform : translateY(-20px);
        -moz-transform    : translateY(-20px);
        -o-transform      : translateY(-20px);
        -ms-transform     : translateY(-20px);
        transform         : translateY(-20px);
    }
    100% {
        -ms-filter        : "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
        filter            : alpha(opacity=100);
        opacity           : 1;
        -webkit-transform : translateY(0);
        -moz-transform    : translateY(0);
        -o-transform      : translateY(0);
        -ms-transform     : translateY(0);
        transform         : translateY(0);
    }

}

@-moz-keyframes fadeInUp {
    0% {
        filter         : alpha(opacity=0);
        opacity        : 0;
        -moz-transform : translateY(-20px);
        transform      : translateY(-20px);
    }
    100% {
        filter         : alpha(opacity=100);
        opacity        : 1;
        -moz-transform : translateY(0);
        transform      : translateY(0);
    }

}

@-webkit-keyframes "fadeInUp" {
    0% {
        filter            : alpha(opacity=0);
        opacity           : 0;
        -webkit-transform : translateY(-20px);
        transform         : translateY(-20px);
    }
    100% {
        filter            : alpha(opacity=100);
        opacity           : 1;
        -webkit-transform : translateY(0);
        transform         : translateY(0);
    }

}

@-ms-keyframes "fadeInUp" {
    0% {
        -ms-filter    : "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
        filter        : alpha(opacity=0);
        opacity       : 0;
        -ms-transform : translateY(-20px);
        transform     : translateY(-20px);
    }
    100% {
        -ms-filter    : "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
        filter        : alpha(opacity=100);
        opacity       : 1;
        -ms-transform : translateY(0);
        transform     : translateY(0);
    }

}

@-o-keyframes "fadeInUp" {
    0% {
        filter       : alpha(opacity=0);
        opacity      : 0;
        -o-transform : translateY(-20px);
        transform    : translateY(-20px);
    }
    100% {
        filter       : alpha(opacity=100);
        opacity      : 1;
        -o-transform : translateY(0);
        transform    : translateY(0);
    }

}


/* Body Row Wrapper
---------------------------------------------------*/
#body-wrapper {
    position : relative;
}

#body-wrapper > div:nth-child(odd), #body-wrapper > div.odd {
    position : relative;
    left     : -70px;
}

#body-wrapper > div:nth-child(odd) .inner-wrapper > div, #body-wrapper > div.odd .inner-wrapper > div {
    position : relative;
    left     : 70px;
    z-index  : 1;
}

#body-wrapper > div:nth-child(even), #body-wrapper > div.even {
    position : relative;
    left     : 70px;
}

#body-wrapper > div:nth-child(even) .inner-wrapper > div, #body-wrapper > div.even .inner-wrapper > div {
    position : relative;
    left     : -70px;
    z-index  : 1;
}

/*Div Corner Fold*/
/*  Flod in right */
.right-top-fold:before {
    content           : "";
    position          : absolute;
    top               : 0;
    right             : 0;
    width             : 0px;
    height            : 0px;
    border-top        : 100px solid transparent;
    border-left-width : 100px;
    border-left-style : solid;
}

/** Fold shadow */
.right-top-fold:after {
    content     : "";
    position    : absolute;
    top         : 0;
    right       : 100px;
    width       : 0px;
    height      : 0px;
    border-top  : 100px solid rgba(0, 0, 0, 0.15);
    border-left : 100px solid transparent;
}

/*  Flod in left */
.left-top-fold:before {
    content            : "";
    position           : absolute;
    top                : 0;
    left               : 0;
    width              : 0px;
    height             : 0px;
    border-top         : 100px solid transparent;
    border-right-width : 100px;
    border-right-style : solid;
}

/** Fold Shadow */
.left-top-fold:after {
    content      : "";
    position     : absolute;
    top          : 0;
    left         : 100px;
    width        : 0px;
    height       : 0px;
    border-top   : 100px solid rgba(0, 0, 0, 0.15);
    border-right : 100px solid transparent;
}

.top-indent {
    margin-top : -100px;
}

.top-indent > div {
    padding-bottom : 200px;
}

.wraper-shadow-left:before {
    pointer-events           : none;
    position                 : absolute;
    z-index                  : -1;
    content                  : ' ';
    height                   : 100px;
    width                    : 100%;
    background               : rgba(0, 0, 0, 0.15);
    top                      : 0;
    right                    : 100px;

    -webkit-transform-origin : 100% 0%;
    -moz-transform-origin    : 100% 0%;
    -o-transform-origin      : 100% 0%;
    -ms-transform-origin     : 100% 0%;
    transform-origin         : 100% 0%;

    -webkit-transform        : rotate(1deg);
    -moz-transform           : rotate(1deg);
    -o-transform             : rotate(1deg);
    -ms-transform            : rotate(1deg);
    transform                : rotate(1deg);
}

.wraper-shadow-right:before {
    pointer-events           : none;
    position                 : absolute;
    z-index                  : -1;
    content                  : "";
    height                   : 100px;
    width                    : 100%;
    background               : rgba(0, 0, 0, 0.15);
    top                      : 0;
    left                     : 100px;

    -webkit-transform-origin : 0% 0%;
    -moz-transform-origin    : 0% 0%;
    -o-transform-origin      : 0% 0%;
    -ms-transform-origin     : 0% 0%;
    transform-origin         : 0% 0%;

    -webkit-transform        : rotate(-1deg);
    -moz-transform           : rotate(-1deg);
    -o-transform             : rotate(-1deg);
    -ms-transform            : rotate(-1deg);
    transform                : rotate(-1deg);
}

.inner-wrapper {
    min-height : 300px;
}

.inner-wrapper > div {
    padding : 0px;
}

/** Basic styling */
#services-wrapper:before {
    border-left-color : #f27d68;
}

#services {
    background          : -webkit-linear-gradient(left, #e8432a 0%, #e8432a 100%), -webkit-linear-gradient(left, #e8432a 0%, #e8432a 100%);
    background          : -moz-linear-gradient(left, #e8432a 0%, #e8432a 100%), -moz-linear-gradient(left, #e8432a 0%, #e8432a 100%);
    background          : -o-linear-gradient(left, #e8432a 0%, #e8432a 100%), -o-linear-gradient(left, #e8432a 0%, #e8432a 100%);
    background          : -ms-linear-gradient(left, #e8432a 0%, #e8432a 100%), -ms-linear-gradient(left, #e8432a 0%, #e8432a 100%);
    background          : linear-gradient(left, #e8432a 0%, #e8432a 100%), linear-gradient(left, #e8432a 0%, #e8432a 100%); /* Chrome10+,Safari5.1+ */
    background-position : -100px 100%, 100% 100px;
    background-repeat   : no-repeat;
}

#portfolio-wrapper:before {
    border-right-color : #9fcc5c;
}

#portfolio {
    background          : -webkit-linear-gradient(right, #80b536 0%, #80b536 100%), -webkit-linear-gradient(right, #80b536 0%, #80b536 100%);
    background          : -moz-linear-gradient(right, #80b536 0%, #80b536 100%), -moz-linear-gradient(right, #80b536 0%, #80b536 100%);
    background          : -o-linear-gradient(right, #80b536 0%, #80b536 100%), -o-linear-gradient(right, #80b536 0%, #80b536 100%);
    background          : -ms-linear-gradient(right, #80b536 0%, #80b536 100%), -ms-linear-gradient(right, #80b536 0%, #80b536 100%);
    background          : linear-gradient(right, #80b536 0%, #80b536 100%), linear-gradient(right, #80b536 0%, #80b536 100%); /* Chrome10+,Safari5.1+ */
    background-position : 100px 100%, 100% 100px;
    background-repeat   : no-repeat;
}

#aboutus-wrapper:before {
    border-left-color : #5f7285;
}

#aboutus {
    background          : -webkit-linear-gradient(left, #2e3947 0%, #2e3947 100%), -webkit-linear-gradient(left, #2e3947 0%, #2e3947 100%);
    background          : -moz-linear-gradient(left, #2e3947 0%, #2e3947 100%), -moz-linear-gradient(left, #2e3947 0%, #2e3947 100%);
    background          : -o-linear-gradient(left, #2e3947 0%, #2e3947 100%), -o-linear-gradient(left, #2e3947 0%, #2e3947 100%);
    background          : -ms-linear-gradient(left, #2e3947 0%, #2e3947 100%), -ms-linear-gradient(left, #2e3947 0%, #2e3947 100%);
    background          : linear-gradient(left, #2e3947 0%, #2e3947 100%), linear-gradient(left, #2e3947 0%, #2e3947 100%); /* Chrome10+,Safari5.1+ */
    background-position : -100px 100%, 100% 100px;
    background-repeat   : no-repeat;
}

#team-wrapper:before {
    border-right-color : #32d996;
}

#team {
    background          : -webkit-linear-gradient(left, #00bf73 0%, #00bf73 100%), -webkit-linear-gradient(left, #00bf73 0%, #00bf73 100%);
    background          : -moz-linear-gradient(left, #00bf73 0%, #00bf73 100%), -moz-linear-gradient(left, #00bf73 0%, #00bf73 100%);
    background          : -o-linear-gradient(left, #00bf73 0%, #00bf73 100%), -o-linear-gradient(left, #00bf73 0%, #00bf73 100%);
    background          : -ms-linear-gradient(left, #00bf73 0%, #00bf73 100%), -ms-linear-gradient(left, #00bf73 0%, #00bf73 100%);
    background          : linear-gradient(left, #00bf73 0%, #00bf73 100%), linear-gradient(left, #00bf73 0%, #00bf73 100%); /* Chrome10+,Safari5.1+ */
    background-position : 100px 100%, 100% 100px;
    background-repeat   : no-repeat;
}

#client-wrapper:before {
    border-left-color : #ffe175;
}

#client {
    background          : -webkit-linear-gradient(left, #face2f 0%, #face2f 100%), -webkit-linear-gradient(left, #face2f 0%, #face2f 100%);
    background          : -moz-linear-gradient(left, #face2f 0%, #face2f 100%), -moz-linear-gradient(left, #face2f 0%, #face2f 100%);
    background          : -o-linear-gradient(left, #face2f 0%, #face2f 100%), -o-linear-gradient(left, #face2f 0%, #face2f 100%);
    background          : -ms-linear-gradient(left, #face2f 0%, #face2f 100%), -ms-linear-gradient(left, #face2f 0%, #face2f 100%);
    background          : linear-gradient(left, #face2f 0%, #face2f 100%), linear-gradient(left, #face2f 0%, #face2f 100%); /* Chrome10+,Safari5.1+ */
    background-position : -100px 100%, 100% 100px;
    background-repeat   : no-repeat;
}

#blog-wrapper:before {
    border-right-color : #576166;
}

#blog {
    background          : -webkit-linear-gradient(left, #232829 0%, #232829 100%), -webkit-linear-gradient(left, #232829 0%, #232829 100%);
    background          : -moz-linear-gradient(left, #232829 0%, #232829 100%), -moz-linear-gradient(left, #232829 0%, #232829 100%);
    background          : -o-linear-gradient(left, #232829 0%, #232829 100%), -o-linear-gradient(left, #232829 0%, #232829 100%);
    background          : -ms-linear-gradient(left, #232829 0%, #232829 100%), -ms-linear-gradient(left, #232829 0%, #232829 100%);
    background          : linear-gradient(left, #232829 0%, #232829 100%), linear-gradient(left, #232829 0%, #232829 100%); /* Chrome10+,Safari5.1+ */
    background-position : 100px 100%, 100% 100px;
    background-repeat   : no-repeat;
}

#contact-wrapper:before {
    border-left-color : #ededed;
}

#contact {
    background          : -webkit-linear-gradient(left, #d6d6d6 0%, #d6d6d6 100%), -webkit-linear-gradient(left, #d6d6d6 0%, #d6d6d6 100%);
    background          : -moz-linear-gradient(left, #d6d6d6 0%, #d6d6d6 100%), -moz-linear-gradient(left, #d6d6d6 0%, #d6d6d6 100%);
    background          : -o-linear-gradient(left, #d6d6d6 0%, #d6d6d6 100%), -o-linear-gradient(left, #d6d6d6 0%, #d6d6d6 100%);
    background          : -ms-linear-gradient(left, #d6d6d6 0%, #d6d6d6 100%), -ms-linear-gradient(left, #d6d6d6 0%, #d6d6d6 100%);
    background          : linear-gradient(left, #d6d6d6 0%, #d6d6d6 100%), linear-gradient(left, #d6d6d6 0%, #d6d6d6 100%); /* Chrome10+,Safari5.1+ */
    background-position : -100px 100%, 100% 100px;
    background-repeat   : no-repeat;
}

#contact .container > h2 {
    color : #24282B;
}

#bottom {
    background : #232829;
    display    : block;
    min-height : 200px;
    margin-top : -100px;
    padding    : 100px 0;
    position   : relative;
}

#bottom .social-shares ul {
    margin : 0;
}

.copyright {
    float       : right;
    font-size   : 18px;
    margin-top  : 18px;
    font-weight : 400;
    position    : relative;
}

a#to-top {
    background  : url(../images/to-top.png) 0 0 no-repeat;
    width       : 50px;
    height      : 50px;
    position    : absolute;
    right       : 10px;
    top         : 10px;
    text-indent : -9999em;
}

/* Customize The Navbar
--------------------------------------------------*/
/* Special class on .container surrounding .navbar, used for positioning it into place. */
.navbar-wrapper {
    position : absolute;
    top      : 0;
    left     : 0;
    right    : 0;
    z-index  : 20;
}

/* Flip around the padding for proper display in narrow viewports */
.navbar-wrapper .container {
    padding-left  : 0;
    padding-right : 0;
}

.navbar-wrapper .navbar {
    padding-left  : 15px;
    padding-right : 15px;
}


/* Services
--------------------------------------------------*/
.service-fold {
    position : relative;
}

.service-fold:before {
    content     : "";
    position    : absolute;
    bottom      : 0;
    left        : 0px;
    width       : 0px;
    height      : 0px;
    border-top  : 20px solid rgba(255, 255, 255, 0.5);
    border-left : 20px solid transparent;
}

.service-fold:hover:before {
    border-top : 20px solid rgba(130, 130, 130, 1);
}

.service-fold:after {
    content       : "";
    position      : absolute;
    bottom        : 0;
    left          : 20px;
    width         : 0px;
    height        : 0px;
    border-bottom : 20px solid rgba(0, 0, 0, 0.15);
    border-right  : 20px solid transparent;
}

.service-box {
    height              : 300px;
    padding             : 20px;
    margin              : 0px;

    background          : -webkit-linear-gradient(right, #D93921 0%, #D93921 100%), -webkit-linear-gradient(right, #D93921 0%, #D93921 100%);
    background          : -moz-linear-gradient(right, #D93921 0%, #D93921 100%), -moz-linear-gradient(right, #D93921 0%, #D93921 100%);
    background          : -o-linear-gradient(right, #D93921 0%, #D93921 100%), -o-linear-gradient(right, #D93921 0%, #D93921 100%);
    background          : -ms-linear-gradient(right, #D93921 0%, #D93921 100%), -ms-linear-gradient(right, #D93921 0%, #D93921 100%);
    background          : linear-gradient(right, #D93921 0%, #D93921 100%), linear-gradient(right, #D93921 0%, #D93921 100%);
    background-position : 100% -20px, 20px 100%;
    background-repeat   : no-repeat;
    margin-bottom       : 30px;
    color               : #fff;
    text-align          : center;
    display             : block;
}

.service-box h3 {
    text-transform : none;
    font-size      : 18px;
    padding        : 20px;
}

.service-box:hover {
    background          : -webkit-linear-gradient(right, #35362c 0%, #35362c 100%), -webkit-linear-gradient(right, #35362c 0%, #35362c 100%);
    background          : -moz-linear-gradient(right, #35362c 0%, #35362c 100%), -moz-linear-gradient(right, #35362c 0%, #35362c 100%);
    background          : -o-linear-gradient(right, #35362c 0%, #35362c 100%), -o-linear-gradient(right, #35362c 0%, #35362c 100%);
    background          : -ms-linear-gradient(right, #35362c 0%, #35362c 100%), -ms-linear-gradient(right, #35362c 0%, #35362c 100%);
    background          : linear-gradient(right, #35362c 0%, #35362c 100%), linear-gradient(right, #35362c 0%, #35362c 100%);
    background-position : 100% -20px, 20px 100%;
    background-repeat   : no-repeat;
}

.service-box > i {
    font-size   : 3em;
    line-height : 100px;
}

/* Portfolio
--------------------------------------------------*/
#portfolio-container {
    width    : 100%;
    position : relative;
    margin   : 50px 0;
}

#portfolio-items {
    list-style         : none;
    position           : relative;
    overflow           : hidden;
    margin             : 0;
    padding            : 0;

    -webkit-box-sizing : border-box;
    -moz-box-sizing    : border-box;
    -ms-box-sizing     : border-box;
    box-sizing         : border-box;
    height             : 390px;
}

#portfolio-items > li {
    float    : left;
    height   : 350px;
    width    : 228px;
    overflow : hidden;
}

.portfolio-item > div {
    display    : block;
    text-align : center;
    color      : #fff;
    position   : relative;
}

.portfolio-item img {
    z-index : 0;
}

.portfolio-item-description {
    z-index            : 1;
    position           : absolute;
    top                : 0;
    height             : 100%;
    width              : 100%;
    border             : 0px solid rgba(255, 255, 255, 0);
    background-color   : rgba(0, 0, 0, 0);

    -webkit-transition : all 500ms cubic-bezier(0.420, 0.000, 0.580, 1.000);
    -moz-transition    : all 500ms cubic-bezier(0.420, 0.000, 0.580, 1.000);
    -o-transition      : all 500ms cubic-bezier(0.420, 0.000, 0.580, 1.000);
    -ms-transition     : all 500ms cubic-bezier(0.420, 0.000, 0.580, 1.000);
    transition         : all 500ms cubic-bezier(0.420, 0.000, 0.580, 1.000); /* ease-in-out */
}

.portfolio-item:hover .portfolio-item-description {
    border           : 15px solid rgba(255, 255, 255, 0.3);
    background-color : rgba(0, 0, 0, 0.5);
}

.portfolio-item-description > div {
    position           : relative;
    top                : 105%;

    -webkit-transition : all 600ms cubic-bezier(0.680, -0.550, 0.265, 1.550);
    -moz-transition    : all 600ms cubic-bezier(0.680, -0.550, 0.265, 1.550);
    -o-transition      : all 600ms cubic-bezier(0.680, -0.550, 0.265, 1.550);
    -ms-transition     : all 600ms cubic-bezier(0.680, -0.550, 0.265, 1.550);
    transition         : all 600ms cubic-bezier(0.680, -0.550, 0.265, 1.550); /* easeInOutBack */
}

.portfolio-item:hover .portfolio-item-description > div {
    top : 40%;
}

.portfolio-item-description a, .portfolio-item-description i {
    font-size   : 42px;
    color       : #fff;
    font-weight : normal;
}

.portfolio-item:nth-child(even) {
    margin-top : 45px;
}

.portfolio-item-description h3 {
    font-size  : 14px;
    margin-top : 15px;
}

.portfolio-item-description .rounded {
    width       : 70px;
    height      : 70px;
    font-weight : normal;
    line-height : 66px !important;
}

/* Portfolio
--------------------------------------------------*/
#team-container {
    width    : 100%;
    position : relative;
    margin   : 50px 0;
}

#team-items {
    list-style         : none;
    position           : relative;
    overflow           : hidden;
    margin             : 0;
    padding            : 0;

    -webkit-box-sizing : border-box;
    -moz-box-sizing    : border-box;
    -ms-box-sizing     : border-box;
    box-sizing         : border-box;
    height             : 500px;
}

#team-items > li {
    float    : left;
    height   : 100%;
    width    : 280px;
    overflow : hidden;
}

.team-item-description .social {
    -ms-filter                  : "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter                      : alpha(opacity=0);

    opacity                     : 0;
    position                    : relative;
    display                     : block;
    margin                      : 0 auto;
    margin-top                  : -15px;

    -webkit-transition          : all 300ms ease-out;
    -moz-transition             : all 300ms ease-out;
    -o-transition               : all 300ms ease-out;
    -ms-transition              : all 300ms ease-out;
    transition                  : all 300ms ease-out;

    -webkit-transition-property : top, opacity;
    -moz-transition-property    : top, opacity;
    -o-transition-property      : top, opacity;
    -ms-transition-property     : top, opacity;
    transition-property         : top, opacity;
}

.team-item-description .social-shares li i {
    width  : 62px;
    height : 62px;
}

.team-item-description {
    display          : block;
    text-align       : left;
    color            : #fff;
    position         : relative;
    background-color : #008a5c;
    padding          : 5px 10px;
    height           : 70px;
    border           : 4px solid transparent;
}

#team-items > li:hover .team-item-description {
    background-color : transparent;
    border           : 4px solid #008a5c;
    z-index          : 10;
}

#team-items > li:hover img {
    -ms-filter         : "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter             : alpha(opacity=100);
    opacity            : 1;

    -webkit-transition : all 300ms ease-out;
    -moz-transition    : all 300ms ease-out;
    -o-transition      : all 300ms ease-out;
    -ms-transition     : all 300ms ease-out;
    transition         : all 300ms ease-out;
}

#team-items > li:hover img {
    -ms-filter : "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
    filter     : alpha(opacity=60);
    opacity    : 0.6;
}

#team-items > li:hover .social {
    -ms-filter : "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter     : alpha(opacity=100);
    opacity    : 1;
    top        : -130px;
}

.team-item-description .description {
    position : relative;
    z-index  : 1;
}

.team-item-description h3 {
    font-size : 18px;
    padding   : 5px 0;
}

.team-item-description h4 {
    font-size : 14px;
}

.contents {
    font-size   : 18px;
    line-height : 30px;
}

.contents p {
    margin-bottom : 20px;
}

.progress-bars {
    margin : 50px 0;
}

.progress-bars > * {
    display : inline-block;
    width   : auto;
}

/* Social */
.social-shares ul {
    padding    : 0;
    list-style : none;
    margin     : 20px 0;
}

.social-shares li {
    float : left;
}

.social-shares li a {
    color : #fff;
}

.social-shares li:last-child {
    clear : right;
}

.social-shares li i {
    font-size          : 30px;
    height             : 64px;
    width              : 64px;
    line-height        : 64px;
    text-align         : center;

    -webkit-transition : all 400ms ease-out;
    -moz-transition    : all 400ms ease-out;
    -o-transition      : all 400ms ease-out;
    -ms-transition     : all 400ms ease-out;
    transition         : all 400ms ease-out;
}

.social-shares li i:hover {
    background : #fff !important;
}

.social-shares li i.fa-twitter {
    background : #62CDF1;
}

.social-shares li i.fa-twitter:hover {
    color : #62CDF1;
}

.social-shares li i.fa-facebook {
    background : #507CBD;
}

.social-shares li i.fa-facebook:hover {
    color : #507CBD;
}

.social-shares li i.fa-dribbble {
    background : #D97AA6;
}

.social-shares li i.fa-dribbble:hover {
    color : #D97AA6;
}

.social-shares li i.fa-pinterest {
    background : #F26261;
}

.social-shares li i.fa-pinterest:hover {
    color : #F26261;
}

.social-shares li i.fa-google-plus {
    background : #4E4F54;
}

.social-shares li i.fa-google-plus:hover {
    color : #4E4F54;
}

.social-shares li i.fa-tumblr {
    background : #4E7EA4;
}

.social-shares li i.fa-tumblr:hover {
    color : #4E7EA4;
}

.social-shares li i.fa-skype {
    background : #36C4F4;
}

.social-shares li i.fa-skype:hover {
    color : #36C4F4;
}


/* Clients
--------------------------------------------------*/
#clients a {
    display            : block;
    padding            : 40px 0;
    -ms-filter : "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter     : alpha(opacity=100);
    opacity    : 1;
    text-align         : center;

    -webkit-transition : opacity 300ms ease-out;
    -moz-transition    : opacity 300ms ease-out;
    -o-transition      : opacity 300ms ease-out;
    -ms-transition     : opacity 300ms ease-out;
    transition         : opacity 300ms ease-out;
}

#clients a:hover {
    -ms-filter         : "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
    filter             : alpha(opacity=60);
    opacity            : 0.6;
}

/* Blog
--------------------------------------------------*/
.blog-directions {
    margin : 50px 0;
}

.blog-posts-list {
    margin     : 0;
    padding    : 0;
    list-style : none;
    max-height : 690px;
}

.blog-posts-list > li {
    display        : block;
    text-transform : uppercase;
    padding        : 10px 0;
    width          : auto !important;
}

.blog-posts-list > li:first-child {
    padding-top : 0;
}

.blog-posts-list > li span {
    display        : block;
    color          : #76828b;
    text-transform : uppercase;
    font-size      : 14px;
    font-style     : normal;
    padding        : 10px 0;
}

.blog-posts-list > li a {
    display         : block;
    color           : #ffffff;
    text-decoration : none;
    font-weight     : 500;
    font-size       : 18px;
    line-height     : 24px;
}

.blog-posts-list > li.active a, .blog-posts-list > li a:hover {
    color : #cd3031;
}

.blog-header-wrapper {
    background-color : rgba(205, 48, 48, .4);
}

.has-thumbnail .blog-header-wrapper {
    background-color : rgba(205, 48, 48, .4);
    position         : absolute;
    width            : 90%;
    top              : 65px;
    z-index          : 1;
}

.blog-header-wrapper > div {
    display : inline-block;
}

.blog-date {
    background-color   : #5B656E;
    text-align         : center;
    padding            : 18px;
    margin-left        : 20px;

    -webkit-box-sizing : border-box;
    -moz-box-sizing    : border-box;
    -ms-box-sizing     : border-box;
    box-sizing         : border-box;

    -webkit-transform  : scale(1.15);
    -moz-transform     : scale(1.15);
    -o-transform       : scale(1.15);
    -ms-transform      : scale(1.15);
    transform          : scale(1.15); /* IE 9 */
    /* Safari and Chrome */
}

.blog-date-day {
    display     : block;
    font-size   : 72px;
    font-weight : bold;
    text-align  : center;
    padding     : 10px;
}

.blog-date-other {
    font-size  : 16px;
    font-style : normal;
}

.blog-title {
    width          : 65%;
    margin-left    : 20px;
    text-transform : uppercase;
    line-height    : 22px;
    padding        : 18px 0;
    position       : absolute;
}

.blog-entry-thumb {
    position : relative;
}

#blog .entry-content {
    margin-top : 10px;
}

.readmore {
    border                 : 0;
    padding                : 10px 30px;
    background-color       : #cc3031;
    color                  : #ffffff;
    text-transform         : uppercase;
    font-size              : 18px;
    margin                 : 30px 0;
    display                : inline-block;
    -webkit-font-smoothing : antialiased;
}

.readmore:hover {
    color            : #ffffff;
    text-decoration  : none;
    background-color : #8c2727;
}

.readmore i {
    margin-left : 5px;
}

.blog-post-descriptions {
    font-size   : 18px;
    font-style  : normal;
    line-height : 36px;
    color       : #EBECEC;
}

/* Blog Modal */
.blog-contents .tags {
    text-transform : uppercase;
    font-weight    : bold;
    margin         : 30px 0;
}

.blog-contents .tags a.tag {
    text-transform : uppercase;
    font-weight    : normal;
    color          : #AFAFAF;
}

.blog-contents .author .media-heading {
    text-transform : uppercase;
    font-weight    : bold;
}

.blog-contents #comments {
    margin : 70px 0;
}

.blog-contents #comments h3 {
    font-size     : 30px;
    margin-bottom : 50px;
}

.blog-contents #comments .comment-content {
    margin-bottom  : 40px;
    padding-bottom : 40px;
    border-bottom  : 1px solid #424649;
}

.blog-contents #comments .comment-content small {
    display : block;
}

.blog-contents #comments .comment-content a.reply {
    background     : #393E42;
    font-weight    : bold;
    text-transform : uppercase;
    color          : #73787C;
    padding        : 5px 20px;
    font-size      : 18px;
}

.blog-contents #comment-form {
    margin-top : 50px;
}

.blog-contents #comment-form input, .blog-contents #comment-form textarea {
    border : 2px solid #333A40 !important;
}

.blog-contents #comment-form .readmore {
    padding     : 20px 30px;
    font-weight : 900;
    font-size   : 20px;
}


/* Contact
--------------------------------------------------*/
#map-canvas {
    height  : 300px;
    width   : 100%;
    margin  : 0px;
    padding : 0px;
}

.contact-info {
    background-color : #24282B;
    padding          : 30px;
    font-size        : 18px;
    line-height      : 30px;
    color            : #ffffff;
    display          : block;
}

.contact-info li {
    float : left;
    width : 33%;
}

.contact-info li.first {
    width : 34%;
}

.contact-info li p > i {
    padding     : 0 15px;
    margin-left : -40px;
    color       : #808080;
    font-size   : 22px;
}

.contact-info li p {
    padding     : 0 20px;
    font-size   : 18px;
    font-weight : 700;
    margin      : 0;
}

.message-box {
    margin : 25px 0;
}

.message-box h3 {
    padding : 25px 0;
    color   : #24282B;
}

input, textarea {
    padding          : 20px !important;
    border           : 2px solid #AFAFAF;
    border-radius    : 0 !important;
    font-size        : 24px !important;
    margin           : 10px 0;
    background-color : transparent !important;
    height           : 65px !important;
}

textarea {
    height : 260px !important;
}

.message-box input, .message-box textarea {
    border : 2px solid #AFAFAF;
    color  : #23272A;
}

.message-box textarea {
    height : 260px;
}

input[type="submit"] {
    border           : 0 !important;
    background-color : #cc3031 !important;
    padding          : 0 30px !important;
    color            : #fff;
    font-size        : 18px !important;
    text-transform   : uppercase;
}

input[type="submit"]:hover {
    background-color : #d9534f !important;
    color            : #fff;
}

input[type="submit"]:focus {
    border-color : #d9534f;
}

.form-control:focus {
    border-color       : #AFAFAF;
    outline            : 0;

    -webkit-box-shadow : none;
    box-shadow         : none;
}

.form-control:-moz-placeholder {
    color : #23272A;
}

.form-control::-moz-placeholder {
    color : #23272A;
}

.form-control:-ms-input-placeholder {
    color : #23272A;
}

.form-control::-webkit-input-placeholder {
    color : #23272A;
}

/* Popup Modal
--------------------------------------------------*/

.portfolio-style #modal-window:before {
    border-right-color : #9DCC5A;
}

.portfolio-style #modal-window-box {
    background          : -webkit-linear-gradient(left, #81B536 0%, #81B536 100%), -webkit-linear-gradient(left, #81B536 0%, #81B536 100%);
    background          : -moz-linear-gradient(left, #81B536 0%, #81B536 100%), -moz-linear-gradient(left, #81B536 0%, #81B536 100%);
    background          : -o-linear-gradient(left, #81B536 0%, #81B536 100%), -o-linear-gradient(left, #81B536 0%, #81B536 100%);
    background          : -ms-linear-gradient(left, #81B536 0%, #81B536 100%), -ms-linear-gradient(left, #81B536 0%, #81B536 100%);
    background          : linear-gradient(left, #81B536 0%, #81B536 100%), linear-gradient(left, #81B536 0%, #81B536 100%);
    background-position : 100px 100%, 100% 100px;
    background-repeat   : no-repeat;
}

/* Modal Blog Style*/



.blog-style #modal-window:before {
    border-right-color : #576166;
}

.blog-style #modal-window-box {
    background          : -webkit-linear-gradient(left, #232829 0%, #232829 100%), -webkit-linear-gradient(left, #232829 0%, #232829 100%);
    background          : -moz-linear-gradient(left, #232829 0%, #232829 100%), -moz-linear-gradient(left, #232829 0%, #232829 100%);
    background          : -o-linear-gradient(left, #232829 0%, #232829 100%), -o-linear-gradient(left, #232829 0%, #232829 100%);
    background          : -ms-linear-gradient(left, #232829 0%, #232829 100%), -ms-linear-gradient(left, #232829 0%, #232829 100%);
    background          : linear-gradient(left, #232829 0%, #232829 100%), linear-gradient(left, #232829 0%, #232829 100%); /* Chrome10+,Safari5.1+ */
    background-position : 100px 100%, 100% 100px;
    background-repeat   : no-repeat;
}

#modal-window {
    position                    : absolute;
    top                         : 50px;
    left                        : 0%;
    width                       : 100%;
    height                      : auto;
    z-index                     : 9999;
    -webkit-backface-visibility : hidden;
    -moz-backface-visibility    : hidden;
    backface-visibility         : hidden;

    -webkit-transform           : scale(0.7);
    -moz-transform              : scale(0.7);
    -o-transform                : scale(0.7);
    -ms-transform               : scale(0.7);
    transform                   : scale(0.7);
    -ms-filter                  : "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter                      : alpha(opacity=0);
    opacity                     : 0;
    visibility                  : hidden;

    -webkit-transition          : all 0.3s;
    -moz-transition             : all 0.3s;
    -o-transition               : all 0.3s;
    -ms-transition              : all 0.3s;
    transition                  : all 0.3s;
}

#modal-window-content {
    min-height : 100px;
    display    : block;
}

#modal-window-content > div {
    padding : 20px 0;
}

.modal-direction {
    margin : 20px 0;
}

.modal-direction.direction-bottom {
    margin : 40px 0;
}

.modal-loading {
    text-align : center;
    position   : absolute;
    left       : 50%;
    top        : 45%;
}

.modal-overlay {
    position           : fixed;
    width              : 100%;
    height             : 100%;
    visibility         : hidden;
    -ms-filter         : "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter             : alpha(opacity=0);
    opacity            : 0;
    top                : 0;
    left               : 0;
    z-index            : 8000;
    background         : rgba(0, 0, 0, 0.9);

    -webkit-transition : all 0.3s;
    -moz-transition    : all 0.3s;
    -o-transition      : all 0.3s;
    -ms-transition     : all 0.3s;
    transition         : all 0.3s;
}

#modal-window.show-modal {
    -webkit-transform : scale(1);
    -moz-transform    : scale(1);
    -o-transform      : scale(1);
    -ms-transform     : scale(1);
    transform         : scale(1);
    -ms-filter        : "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter            : alpha(opacity=100);
    opacity           : 1;
    visibility        : visible;
}

#modal-window.show-modal ~ .modal-overlay {
    visibility : visible;
    -ms-filter : "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter     : alpha(opacity=100);
    opacity    : 1;
}

.map-popover-content {
    background-color : #ffffff;
    color            : #000000;
}

@keyframes "fadeInDown" {
    0% {
        -ms-filter        : "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
        filter            : alpha(opacity=0);
        opacity           : 0;
        -webkit-transform : translateY(-20px);
        -moz-transform    : translateY(-20px);
        -o-transform      : translateY(-20px);
        -ms-transform     : translateY(-20px);
        transform         : translateY(-20px);
    }
    100% {
        -ms-filter        : "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
        filter            : alpha(opacity=100);
        opacity           : 1;
        -webkit-transform : translateY(0);
        -moz-transform    : translateY(0);
        -o-transform      : translateY(0);
        -ms-transform     : translateY(0);
        transform         : translateY(0);
    }

}

@-moz-keyframes fadeInDown {
    0% {
        filter         : alpha(opacity=0);
        opacity        : 0;
        -moz-transform : translateY(-20px);
        transform      : translateY(-20px);
    }
    100% {
        filter         : alpha(opacity=100);
        opacity        : 1;
        -moz-transform : translateY(0);
        transform      : translateY(0);
    }

}

@-webkit-keyframes "fadeInDown" {
    0% {
        filter            : alpha(opacity=0);
        opacity           : 0;
        -webkit-transform : translateY(-20px);
        transform         : translateY(-20px);
    }
    100% {
        filter            : alpha(opacity=100);
        opacity           : 1;
        -webkit-transform : translateY(0);
        transform         : translateY(0);
    }

}

@-ms-keyframes "fadeInDown" {
    0% {
        -ms-filter    : "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
        filter        : alpha(opacity=0);
        opacity       : 0;
        -ms-transform : translateY(-20px);
        transform     : translateY(-20px);
    }
    100% {
        -ms-filter    : "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
        filter        : alpha(opacity=100);
        opacity       : 1;
        -ms-transform : translateY(0);
        transform     : translateY(0);
    }

}

@-o-keyframes "fadeInDown" {
    0% {
        filter       : alpha(opacity=0);
        opacity      : 0;
        -o-transform : translateY(-20px);
        transform    : translateY(-20px);
    }
    100% {
        filter       : alpha(opacity=100);
        opacity      : 1;
        -o-transform : translateY(0);
        transform    : translateY(0);
    }

}

.fadeInDown {
    -webkit-animation-name : fadeInDown;
    -moz-animation-name    : fadeInDown;
    -ms-animation-name     : fadeInDown;
    -o-animation-name      : fadeInDown;
    animation-name         : fadeInDown;
}