/*@import url('http://fonts.googleapis.com/css?family=Open+Sans:400italic,400,700, 800');*/



/*
This files contents are outlined below.
01. BODY 
02. TYPOGRAPGY 
03. HELPER
04. COMPONENTS
  - NAVBAR
  - BUTTONS
  - FORM
  - PAGINATION
  - TABS
  - CAROUSEL
05. MAIN-HEADER 
06. CONTENT 
  - ABOUT
  - SERVICES
  - RESUME
  - SKILLS 
  - PORTFOLIO
  - BLOG
  - CONTACT
  - TESTIMONIAL
  - PARALLAX
  - CAPTCHA
07. MAIN-FOOTER 
*/
/*============================
     01. BODY
============================*/
body {
    background: #ffffff;
    color: #7d7d7d;
    font-family: 'Open Sans';
    line-height: 2;
    font-size: 13px;
    position: relative;
    -webkit-font-smoothing: antialiased;
}

body .wrapper {
    z-index: 2;
    visibility: hidden;
    opacity: 0.0;
    position: relative;
}

/*============================
     02. TYPOGRAPGY
============================*/
h1 {
    letter-spacing: 0;
    font-size: 4em;
}

@media (max-width: 600px) {
    h1 {
        font-size: 3em;
    }
}

h2 {
    letter-spacing: 0px;
    font-size: 3em;
}

@media (max-width: 600px) {
    h2 {
        font-size: 2.5em;
    }
}

h3 {
    letter-spacing: 0px;
    font-size: 2em;
}

h4 {
    font-size: 1.5em;
}

h5 {
    font-size: 1.2em;
}

h6 {
    font-size: 1;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    line-height: 1.2;
    font-family: 'Open Sans';
}

h4,
h5,
h6 {
    letter-spacing: 0;
}

/*============================
     03. HELPER
============================*/
.bg1 {
    background-image: url(../images/bg1.jpg);
}

.bg2 {
    background-image: url(../images/customers.jpg);
}

.container-medium {
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
    max-width: 960px;
    position: relative;
    z-index: 1;
}

.container-mini {
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
    max-width: 840px;
    position: relative;
    z-index: 1;
}

.container-xs {
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
    max-width: 625px;
    position: relative;
    z-index: 1;
}

.content-table {
    display: table;
    position: relative;
    width: 100%;
}

.content-table .v-content {
    position: relative;
    display: table-cell;
    vertical-align: middle;
    margin-top: 0;
    text-align: center;
    margin-bottom: 0;
    float: none;
}

.no-margin-top {
    margin-top: 0;
}

.no-margin-bottom {
    margin-bottom: 0;
}

.no-margin {
    margin: 0;
}

.no-padding {
    padding: 0;
}

.margin-right-5 {
    margin-right: 5px;
}

.fix-width-100 {
    width: 100px;
    display: inline-block;
}

.paddingTB-30 {
    padding-top: 50px;
    padding-bottom: 50px;
}

.padding20 {
    padding: 20px;
}

.padding30 {
    padding: 30px;
}

.white-space-10 {
    height: 10px;
}

.white-space-20 {
    height: 20px;
}

.white-space-30 {
    height: 30px;
}

.white-space-40 {
    height: 40px;
}

.white-space-50 {
    height: 50px;
}

.white-space-60 {
    height: 60px;
}

.space-inline-15 {
    display: inline-block;
    width: 15px;
}

.space-inline-30 {
    display: inline-block;
    width: 30px;
}

.color-dark {
    color: #000000;
}

.color-primary {
    color: #e74c3c;
}

.color-light {
    color: #ebebeb;
}

.bg-primary {
    background-color: #e74c3c;
}

.bg-secondary {
    background-color: #f5f5f5;
}

.bg-dark {
    background-color: #323232;
}

.big-icon {
    font-size: 4em;
    display: block;
    margin-bottom: 20px;
    text-align: center;
    background: #ffffff;
    box-shadow: 0 0 6px rgba(0, 0, 0, 0.1) !important;
    -webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.1) !important;
    -moz-box-shadow: 0 0 6px rgba(0, 0, 0, 0.1) !important;
    -o-box-shadow: 0 0 6px rgba(0, 0, 0, 0.1) !important;
    -ms-box-shadow: 0 0 6px rgba(0, 0, 0, 0.1) !important;
    padding: 30px 0;
    margin-top: 10px;
    -webkit-border-radius: 4px !important;
    -moz-border-radius: 4px !important;
    -ms-border-radius: 4px !important;
    -o-border-radius: 4px !important;
    border-radius: 4px !important;
    color: #282828;
    border: 4px double #ebebeb;
}

.img-bordered {
    max-width: 100%;
    border: 4px double #ebebeb;
    -webkit-border-radius: 10px !important;
    -moz-border-radius: 10px !important;
    -ms-border-radius: 10px !important;
    -o-border-radius: 10px !important;
    border-radius: 10px !important;
    margin-bottom: 30px;
}

blockquote {
    margin-bottom: 30px;
    font-size: 14px;
}

.list-with-icon li {
    padding-left: 30px;
    position: relative;
}

.list-with-icon li .ic-list {
    position: absolute;
    top: 7px;
    left: 0;
}

.box-line {
    border: 2px solid #000000;
    color: #000000;
    background: #ffffff;
    background: rgba(255, 255, 255, 0.3);
    padding: 8px 30px;
    display: inline-block;
}

.display-block {
    display: block;
}

.display-inline-block {
    display: inline-block;
}

.text-bold {
    font-weight: 700;
}

.text-extra-bold {
    font-weight: 800;
}

.text-light {
    font-weight: 300;
}

.font-alt {
    font-family: Georgia;
}

.br-right {
    border-right: 1px solid #ebebeb !important;
}

.br-left {
    border-left: 1px solid #ebebeb !important;
}

.br-top {
    border-top: 1px solid #ebebeb !important;
}

.br-bottom {
    border-bottom: 1px solid #ebebeb !important;
}

.line-dash-bottom {
    border-bottom: 1px dashed #ebebeb;
    padding-bottom: 12px;
}

.padding-left-30 {
    padding-left: 30px;
}

.relative {
    position: relative;
    z-index: 1;
}

.white-light {
    position: relative;
}

.white-light:before {
    content: "";
    position: absolute;
    width: 50%;
    transition: top 1s ease 0.3s, background 1s ease 0s;
    -webkit-transition: top 1s ease 0.3s, background 1s ease 0s;
    -moz-transition: top 1s ease 0.3s, background 1s ease 0s;
    -o-transition: top 1s ease 0.3s, background 1s ease 0s;
    -ms-transition: top 1s ease 0.3s, background 1s ease 0s;
    left: 0;
    top: 0;
    height: 100%;
    background: rgba(255, 255, 255, 0.3);
}

.white-light:after {
    content: "";
    position: absolute;
    width: 50%;
    transition: bottom 1s ease 0.3s, background 1s ease 0s;
    -webkit-transition: bottom 1s ease 0.3s, background 1s ease 0s;
    -moz-transition: bottom 1s ease 0.3s, background 1s ease 0s;
    -o-transition: bottom 1s ease 0.3s, background 1s ease 0s;
    -ms-transition: bottom 1s ease 0.3s, background 1s ease 0s;
    right: 0;
    bottom: 0;
    height: 100%;
    background: rgba(255, 255, 255, 0.2);
}

.block-page {
    padding: 60px 0;
}

.black-light {
    position: relative;
}

.black-light:before {
    content: "";
    position: absolute;
    width: 50%;
    transition: top 1s ease 0.3s, background 1s ease 0s;
    -webkit-transition: top 1s ease 0.3s, background 1s ease 0s;
    -moz-transition: top 1s ease 0.3s, background 1s ease 0s;
    -o-transition: top 1s ease 0.3s, background 1s ease 0s;
    -ms-transition: top 1s ease 0.3s, background 1s ease 0s;
    left: 0;
    top: 0;
    height: 100%;
    background: rgba(255, 255, 255, 0.8);
}

.black-light:after {
    content: "";
    position: absolute;
    width: 50%;
    transition: bottom 1s ease 0.3s, background 1s ease 0s;
    -webkit-transition: bottom 1s ease 0.3s, background 1s ease 0s;
    -moz-transition: bottom 1s ease 0.3s, background 1s ease 0s;
    -o-transition: bottom 1s ease 0.3s, background 1s ease 0s;
    -ms-transition: bottom 1s ease 0.3s, background 1s ease 0s;
    right: 0;
    bottom: 0;
    height: 100%;
    background: rgba(255, 255, 255, 0.6);
}

.block-section {
    background: #ffffff;
    position: relative;
    z-index: 1;
}

.block-title {
    padding: 40px 0;
    z-index: 3;
    position: relative;
    border-top: 1px solid #ebebeb;
    border-bottom: 1px solid #ebebeb;
    text-align: center;
}

.block-title .title-icon {
    display: inline-block;
    position: relative;
}

.block-title .title-icon:before {
    content: "";
    position: absolute;
    height: 1px;
    background: #323232;
    width: 20px;
    left: -30px;
    top: 50%;
}

.block-title .title-icon:after {
    content: "";
    position: absolute;
    height: 1px;
    background: #323232;
    width: 20px;
    right: -30px;
    top: 50%;
}

.block-title:before {
    content: "";
    position: absolute;
    width: 24px;
    height: 2px;
    background: #f5f5f5;
    bottom: -1px;
    left: 50%;
    margin-left: -12px;
}

.shape-bottom {
    z-index: 2;
    position: relative;
}

.shape-bottom:before {
    content: "";
    position: absolute;
    width: 20px;
    height: 20px;
    background: #f5f5f5;
    border: 1px solid #ebebeb;
    z-index: 1;
    bottom: -10px;
    left: 50%;
    margin-left: -10px;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
}

.error {
    color: #BD2929;
    font-weight: 400;
    letter-spacing: 0;
    transition: all 0.3s ease 0s;
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    -ms-transition: all 0.3s ease 0s;
}

.progress-wrap {
    margin-top: 10px;
    margin-bottom: 10px;
}

.progress-wrap .progress {
    -webkit-border-radius: 0 !important;
    -moz-border-radius: 0 !important;
    -ms-border-radius: 0 !important;
    -o-border-radius: 0 !important;
    border-radius: 0 !important;
    height: 10px;
}

.progress-wrap .bar {
    background: #000000;
    min-height: 3px;
    margin: 3px 0;
}

.attbox {
    padding-top: 0px;
    padding-bottom: 10px;
}

/*============================
     04. COMPONENTS
============================*/
/*== NAVBAR ==*/
.menu-area {
    position: absolute;
    transition: background 0.8s ease 0s;
    -webkit-transition: background 0.8s ease 0s;
    -moz-transition: background 0.8s ease 0s;
    -o-transition: background 0.8s ease 0s;
    -ms-transition: background 0.8s ease 0s;
    bottom: 0;
    padding: 10px 0;
    background: #ffffff;
    background: rgba(255, 255, 255, 0.3);
    left: 0;
    border-bottom: 1px solid #ebebeb;
    text-align: center;
    width: 100%;
    z-index: 100;
}

.menu-area .toogle-bars {
    display: none;
}

.menu-area .toogle-bars a {
    text-decoration: none;
    color: #000000;
}

.menu-area .toogle-bars a .ic-open {
    display: none;
    visibility: hidden;
}

.menu-area .toogle-bars a .ic-close {
    display: inline;
    visibility: visible;
}

.menu-area .toogle-bars a.collapsed .ic-open {
    display: inline;
    visibility: visible;
}

.menu-area .toogle-bars a.collapsed .ic-close {
    display: none;
    visibility: hidden;
}

.menu-area .main-nav {
    visibility: visible !important;
    margin: 0;
    background: transparent;
}

.menu-area .main-nav > li {
    display: inline;
}

.menu-area .main-nav > li > a {
    font-weight: 700;
    color: #323232;
    outline: none;
    font-size: 12px;
    transition: all 0.3s ease 0s;
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    -ms-transition: all 0.3s ease 0s;
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.menu-area .main-nav > li > a:hover {
    color: #000000;
    outline: none;
}

.menu-area .main-nav > li + li:before {
    color: #323232;
}

.menu-area .main-nav > li.active > a {
    color: #000000;
}

.menu-area .main-nav.nav > li > a {
    padding: 0;
    display: inline-block;
}

.menu-area .main-nav.nav > li > a:hover,
.menu-area .main-nav.nav > li > a:focus {
    background: transparent;
}

.menu-area .main-nav.no-space > li + li:before {
    content: "";
}

.menu-area.nav-white-bg {
    border-bottom: 1px solid #ebebeb;
    background: #ffffff;
}

.menu-area.nav-white-bg .main-nav > li > a {
    color: #7d7d7d;
}

.menu-area.nav-white-bg .main-nav > li > a:hover {
    color: #000000;
}

.menu-area.nav-white-bg .main-nav > li.active > a {
    color: #000000;
}

.menu-area.nav-white-bg .main-nav > li + li:before {
    color: #ebebeb;
}

.menu-area.nav-fixed {
    position: fixed;
    top: 0;
    background: #ffffff;
    z-index: 100;
    bottom: inherit;
    border-bottom: 1px solid #ebebeb;
}

@media (min-width: 1030px) {
    .menu-area .menu-collapse.collapse {
        display: block;
        height: auto !important;
    }
}

@media (max-width: 1030px) {
    .menu-area {
        border-bottom: 1px solid #ebebeb;
        background: #ffffff;
    }

    .menu-area .main-nav > li > a {
        color: #7d7d7d;
    }

    .menu-area .main-nav > li > a:hover {
        color: #000000;
    }

    .menu-area .main-nav > li.active > a {
        color: #000000;
    }

    .menu-area .main-nav > li + li:before {
        color: #ebebeb;
    }

    .menu-area .toogle-bars {
        display: block;
    }

    .menu-area .menu-collapse.collapse.in {
        border-top: 1px solid #ebebeb;
        margin-top: 10px;
        display: block;
    }
}

/*== BUTTONS ==*/
.btn-default {
    border-color: #ebebeb;
}

.btn-flat-solid {
    -webkit-border-radius: 0 !important;
    -moz-border-radius: 0 !important;
    -ms-border-radius: 0 !important;
    -o-border-radius: 0 !important;
    border-radius: 0 !important;
    font-family: 'Open Sans';
    transition: all 0.8s ease 0s;
    -webkit-transition: all 0.8s ease 0s;
    -moz-transition: all 0.8s ease 0s;
    -o-transition: all 0.8s ease 0s;
    -ms-transition: all 0.8s ease 0s;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 12px;
    min-width: 151px;
    letter-spacing: 0px;
    padding: 13px;
}

.btn-flat-solid.btn-lg {
    padding: 16px;
    font-size: 14px;
    min-width: 140px;
}

.btn-flat-solid.btn-sm {
    padding: 10px;
    min-width: 100px;
    font-size: 11px;
}

.btn-flat-solid.btn-xs {
    padding: 8px;
    min-width: 80px;
    font-size: 10px;
}

.btn-flat-solid.btn-default {
    color: #000000;
    background-color: #fafafa;
}

.btn-flat-solid.btn-default:hover {
    background-color: #ebebeb;
}

.btn-flat-solid.btn-link {
    color: #000000;
}

.btn-flat-solid.btn-pill {
    -webkit-border-radius: 25px !important;
    -moz-border-radius: 25px !important;
    -ms-border-radius: 25px !important;
    -o-border-radius: 25px !important;
    border-radius: 25px !important;
}

.btn-flat-solid.primary-btn {
    color: #ffffff;
    background-color: #323232;
}

.btn-flat-solid.primary-btn:hover,
.btn-flat-solid.primary-btn:focus {
    color: #ffffff;
    background-color: #000000;
}

.btn-flat-solid:hover,
.btn-flat-solid:focus {
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    -o-box-shadow: none !important;
    -ms-box-shadow: none !important;
    outline: none;
}

.btn-flat-solid.btn-icon {
    min-width: 35px;
}

.btn-flat-line {
    font-family: 'Open Sans';
    -webkit-border-radius: 0 !important;
    -moz-border-radius: 0 !important;
    -ms-border-radius: 0 !important;
    -o-border-radius: 0 !important;
    border-radius: 0 !important;
    transition: all 0.8s ease 0s;
    -webkit-transition: all 0.8s ease 0s;
    -moz-transition: all 0.8s ease 0s;
    -o-transition: all 0.8s ease 0s;
    -ms-transition: all 0.8s ease 0s;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 12px;
    min-width: 151px;
    border-width: 3px;
    letter-spacing: 0px;
    padding: 13px;
    background-color: transparent;
    color: #000000;
}

.btn-flat-line.light-font {
    color: #ffffff;
}

.btn-flat-line.btn-lg {
    padding: 16px;
    font-size: 14px;
    min-width: 140px;
}

.btn-flat-line.btn-sm {
    padding: 10px;
    min-width: 100px;
    font-size: 11px;
}

.btn-flat-line.btn-xs {
    padding: 8px;
    min-width: 80px;
    font-size: 10px;
}

.btn-flat-line.btn-default {
    color: #000000;
    border-color: #ebebeb;
}

.btn-flat-line.btn-default:hover,
.btn-flat-line.btn-default:focus {
    background: #000000;
    border-color: #000000;
    color: #ffffff;
}

.btn-flat-line.btn-default.light-font {
    border-color: #ffffff;
    color: #ffffff;
}

.btn-flat-line.btn-default.light-font:hover,
.btn-flat-line.btn-default.light-font:focus {
    background-color: #ffffff;
    color: #000000;
}

.btn-flat-line.btn-link {
    color: #000000;
}

.btn-flat-line.btn-link.light-font {
    color: #ffffff;
}

.btn-flat-line.btn-pill {
    -webkit-border-radius: 25px !important;
    -moz-border-radius: 25px !important;
    -ms-border-radius: 25px !important;
    -o-border-radius: 25px !important;
    border-radius: 25px !important;
}

.btn-flat-line.primary-btn {
    color: #ffffff;
    border-color: #ffffff;
    background-color: transparent;
}

.btn-flat-line.primary-btn.clicked,
.btn-flat-line.primary-btn:hover,
.btn-flat-line.primary-btn:focus {
    color: #000000;
    border-color: transparent;
    background-color: #ffffff;
}

.btn-flat-line.btn-icon {
    min-width: 35px;
}

.btn-flat-line:hover,
.btn-flat-line:focus {
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    -o-box-shadow: none !important;
    -ms-box-shadow: none !important;
    outline: none;
}

.link-text {
    font-weight: bold;
    font-size: 12px;
    text-transform: uppercase;
    color: #000000;
}

.box-btn-more {
    position: relative;
    padding: 20px 0;
    text-align: center;
}

.box-btn-more .btn {
    position: relative;
    background: #ffffff;
    text-decoration: none;
    border-left: 1px solid #ebebeb;
    border-right: 1px solid #ebebeb;
    border-top: 1px solid transparent;
    border-bottom: 1px solid transparent;
}

.box-btn-more .btn:hover {
    border: 1px solid #ebebeb;
}

.box-btn-more:before {
    width: 100%;
    content: "";
    position: absolute;
    top: 50%;
    border-top: 1px solid #ebebeb;
    left: 0;
}

/*== FORM  ==*/
.form-control.form-flat {
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    -o-box-shadow: none !important;
    -ms-box-shadow: none !important;
    -webkit-border-radius: 0 !important;
    -moz-border-radius: 0 !important;
    -ms-border-radius: 0 !important;
    -o-border-radius: 0 !important;
    border-radius: 0 !important;
    height: 45px;
    font-family: 'Open Sans';
    border-color: #ebebeb;
}

.form-control.form-flat.input-lg {
    height: 52px;
}

.form-control.form-flat:focus {
    border-color: #c3c3c3;
}

.form-control.form-flat.error {
    border-color: #afafaf;
}

.form-control.dark-form {
    background: #1e1e1e;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    -o-box-shadow: none !important;
    -ms-box-shadow: none !important;
    background: rgba(30, 30, 30, 0.85);
    color: #ffffff;
    border-color: #1e1e1e;
}

.form-control.dark-form:focus {
    border-color: #e74c3c;
}

.select-chosen,
.label-chosen {
    display: none;
}

@media (max-width: 991px) {
    .select-chosen,
    .label-chosen {
        display: block !important;
    }
}

textArea.form-flat {
    height: auto !important;
}

.form-control-large,
.form-control-small {
    width: 345px;
    display: inline-block;
    margin: 0 10px;
}

.form-control-small {
    width: 188px;
}

.flat-checkbox,
.flat-radio {
    line-height: 1em;
    position: relative;
}

.flat-checkbox label,
.flat-radio label {
    font-weight: 700;
    padding-left: 0;
}

.flat-checkbox input[type="checkbox"],
.flat-radio input[type="checkbox"],
.flat-checkbox input[type="radio"],
.flat-radio input[type="radio"] {
    position: absolute;
    left: -9999em;
}

.flat-checkbox span,
.flat-radio span {
    position: relative;
    top: -2px;
    background-color: #ffffff;
    border: 1px solid #ccc;
    font-size: 10px;
    line-height: 10px;
    padding: 3px;
    border-radius: 2px;
    float: left;
    margin-right: 10px;
    color: #ffffff;
    transition: all 0.3s ease 0s;
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    -ms-transition: all 0.3s ease 0s;
}

.flat-checkbox input[type="radio"] + span,
.flat-radio input[type="radio"] + span {
    -webkit-border-radius: 50% !important;
    -moz-border-radius: 50% !important;
    -ms-border-radius: 50% !important;
    -o-border-radius: 50% !important;
    border-radius: 50% !important;
}

.flat-checkbox input:checked + span,
.flat-radio input:checked + span,
.flat-checkbox input:checked + span,
.flat-radio input:checked + span {
    background-color: #000000;
    border-color: #000000;
}

.btn-file {
    min-width: 0;
    padding-left: 20px;
    padding-right: 20px;
    position: relative;
    overflow: hidden;
}

.btn-file input[type=file] {
    position: absolute;
    top: 0;
    right: 0;
    min-width: 100%;
    min-height: 100%;
    font-size: 100px;
    text-align: right;
    filter: alpha(opacity=0);
    opacity: 0;
    outline: none;
    background: white;
    cursor: inherit;
    display: block;
}

/*== PAGINATION  ==*/
.flat-pagination > li > a,
.flat-pagination > li > span {
    color: #7d7d7d;
    transition: all 0.3s ease 0s;
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    -ms-transition: all 0.3s ease 0s;
    -webkit-border-radius: 0 !important;
    -moz-border-radius: 0 !important;
    -ms-border-radius: 0 !important;
    -o-border-radius: 0 !important;
    border-radius: 0 !important;
    margin-left: 5px;
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.03) !important;
    -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.03) !important;
    -moz-box-shadow: 0 0 3px rgba(0, 0, 0, 0.03) !important;
    -o-box-shadow: 0 0 3px rgba(0, 0, 0, 0.03) !important;
    -ms-box-shadow: 0 0 3px rgba(0, 0, 0, 0.03) !important;
    border-color: #ebebeb;
}

.flat-pagination > li > a:hover {
    box-shadow: 0 0 0 rgba(0, 0, 0, 0.1) !important;
    -webkit-box-shadow: 0 0 0 rgba(0, 0, 0, 0.1) !important;
    -moz-box-shadow: 0 0 0 rgba(0, 0, 0, 0.1) !important;
    -o-box-shadow: 0 0 0 rgba(0, 0, 0, 0.1) !important;
    -ms-box-shadow: 0 0 0 rgba(0, 0, 0, 0.1) !important;
    color: #7d7d7d;
}

.flat-pagination > .active > a,
.flat-pagination > .active > span,
.flat-pagination > .active > a:hover,
.flat-pagination > .active > span:hover,
.flat-pagination > .active > a:focus,
.flat-pagination > .active > span:focus {
    background-color: #323232;
    border-color: #323232;
}

/*== TABS  ==*/
.flat-nav-tabs {
    background: #f5f5f5;
    padding: 15px 10px 0 10px;
    border-top: 1px solid #ebebeb;
    border-left: 1px solid #ebebeb;
    border-right: 1px solid #ebebeb;
}

.flat-nav-tabs > li > a {
    color: #000000;
    -webkit-border-radius: 0 !important;
    -moz-border-radius: 0 !important;
    -ms-border-radius: 0 !important;
    -o-border-radius: 0 !important;
    border-radius: 0 !important;
}

.flat-nav-tabs > li.active > a {
    box-shadow: 0 -2px 0 #000000 !important;
    -webkit-box-shadow: 0 -2px 0 #000000 !important;
    -moz-box-shadow: 0 -2px 0 #000000 !important;
    -o-box-shadow: 0 -2px 0 #000000 !important;
    -ms-box-shadow: 0 -2px 0 #000000 !important;
}

.flat-tab-content {
    padding-top: 20px;
}

.tab-pane {
    margin-right: 20px;
}

/*== CAROUSEL==*/
.flat-carousel .carousel-control {
    text-shadow: none;
    color: #ffffff;
    background: none;
}

.flat-carousel .carousel-control .ic-right,
.flat-carousel .carousel-control .ic-left {
    position: absolute;
    width: 40px;
    line-height: 40px;
    text-align: center;
    display: block;
    height: 40px;
    top: 50%;
    -webkit-border-radius: 4px !important;
    -moz-border-radius: 4px !important;
    -ms-border-radius: 4px !important;
    -o-border-radius: 4px !important;
    border-radius: 4px !important;
    margin-top: -20px;
    background: #000000;
}

.flat-carousel .carousel-control .ic-right {
    right: 50%;
    margin-right: -20px;
}

.flat-carousel .carousel-control .ic-left {
    left: 50%;
    margin-left: -20px;
}

.flat-carousel .carousel-caption {
    width: 100%;
    margin: 0;
    bottom: 0;
    right: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.1);
    -webkit-border-radius: 0 0 6px 6px !important;
    -moz-border-radius: 0 0 6px 6px !important;
    -ms-border-radius: 0 0 6px 6px !important;
    -o-border-radius: 0 0 6px 6px !important;
    border-radius: 0 0 6px 6px !important;
}

.flat-carousel .carousel-indicators {
    bottom: 0;
    background: #323232;
    margin-bottom: 0;
    -webkit-border-radius: 5px 5px 0 0 !important;
    -moz-border-radius: 5px 5px 0 0 !important;
    -ms-border-radius: 5px 5px 0 0 !important;
    -o-border-radius: 5px 5px 0 0 !important;
    border-radius: 5px 5px 0 0 !important;
    width: 150px;
    margin-left: -75px;
}

.flat-carousel .carousel-indicators li.active {
    width: 20px;
}

/*============================
     05. MAIN-HEADER
============================*/
.main-header {
    height: 600px;
    position: relative;
}

.main-header .header-content-fixed {
    height: 600px;
    background: url(../images/slide-2.jpg) no-repeat center;
    background-size: cover;
    background-attachment: fixed;
    text-align: center;
    position: fixed;
    z-index: 0;
    width: 100%;
}

.main-header .header-content-fixed:before {
    content: "";
    position: absolute;
    width: 50%;
    transition: top 1s ease 0.3s, background 1s ease 0s;
    -webkit-transition: top 1s ease 0.3s, background 1s ease 0s;
    -moz-transition: top 1s ease 0.3s, background 1s ease 0s;
    -o-transition: top 1s ease 0.3s, background 1s ease 0s;
    -ms-transition: top 1s ease 0.3s, background 1s ease 0s;
    left: 0;
    top: 0;
    height: 100%;
    background: rgba(255, 255, 255, 0.3);
}

.main-header .header-content-fixed:after {
    content: "";
    position: absolute;
    width: 50%;
    transition: bottom 1s ease 0.3s, background 1s ease 0s;
    -webkit-transition: bottom 1s ease 0.3s, background 1s ease 0s;
    -moz-transition: bottom 1s ease 0.3s, background 1s ease 0s;
    -o-transition: bottom 1s ease 0.3s, background 1s ease 0s;
    -ms-transition: bottom 1s ease 0.3s, background 1s ease 0s;
    right: 0;
    bottom: 0;
    height: 100%;
    background: rgba(255, 255, 255, 0.1);
}

@media (max-width: 1024px) {
    .main-header .header-content-fixed {
        position: relative;
    }
}

.main-header:hover .header-content-fixed:before {
    background: rgba(255, 255, 255, 0.5);
}

.main-header:hover .header-content-fixed:after {
    background: rgba(255, 255, 255, 0.3);
}

.main-header .whoim {
    position: absolute;
    width: 100%;
    z-index: 3;
    top: 25px;
}

.whoim img {
    width: 155px;
}

.main-header .name {
    font-size: 70px;
    margin-bottom: 20px;
    position: relative;
    z-index: 3;
    letter-spacing: 0px !important;
}

@media (max-width: 1030px) {
    .main-header .name {
        font-size: 3em;
    }
}

.main-header .job {
    position: relative;
    display: inline-block;
    z-index: 3;
    border-bottom: 1px solid #000000;
    padding: 10px;
    letter-spacing: 4px;
}

/*============================
     06. MAIN-CONTENT
============================*/
/*== ABOUT ==*/
.my-profile {
    position: relative;
}

.my-profile .my-pict {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    background-image: url(../images/1.jpg);
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
}

@media (max-width: 880px) {
    .my-profile .my-pict {
        position: relative;
        height: 300px;
    }
}

.my-profile .my-pict .overfly {
    background: rgba(0, 0, 0, 0.5);
    position: absolute;
    width: 100%;
    left: 0;
    top: 0;
    transition: all 0.8s ease 0s;
    -webkit-transition: all 0.8s ease 0s;
    -moz-transition: all 0.8s ease 0s;
    -o-transition: all 0.8s ease 0s;
    -ms-transition: all 0.8s ease 0s;
    overflow: hidden;
    height: 100%;
}

.my-profile .my-pict .overfly .text-botttom {
    position: absolute;
    width: 100%;
    transition: all 0.8s ease 0s;
    -webkit-transition: all 0.8s ease 0s;
    -moz-transition: all 0.8s ease 0s;
    -o-transition: all 0.8s ease 0s;
    -ms-transition: all 0.8s ease 0s;
    bottom: 0;
    right: 0;
    padding: 40px;
    text-align: right;
}

.my-profile .my-pict .overfly:hover {
    /*        background: transparent;
                  .text-botttom{
                    bottom: -100%;
                  }*/

}

.my-profile .my-desc,
.my-profile .my-pict {
    width: 50%;
}

@media (max-width: 880px) {
    .my-profile .my-desc,
    .my-profile .my-pict {
        width: 100% !important;
    }
}

.my-profile .my-desc {
    float: right;
}

.my-profile .my-desc .inner-text {
/*    max-width: 710px;*/
    padding: 35px;
}

@media (max-width: 880px) {
    .my-profile .my-desc .inner-text {
        max-width: 100%;
    }
}

/*== SERVICES ==*/
.services {
    margin: 0;
}

.services li {
    text-align: center;
}

.services li .box {
    padding: 80px 0;
    border-right: #ebebeb solid 1px;
}

.services li .ic {
    font-size: 25px;
    line-height: 25px;
}

.services li:last-child .box {
    border-right: 0;
}

@media (max-width: 768px) {
    .services li .box {
        border-right: 0;
        border-bottom: #ebebeb solid 1px;
        padding: 40px 0;
    }

    .services li:last-child .box {
        border-bottom: 0;
    }
}

/*== RESUME ==*/
.list-employment,
.list-education {
    padding: 50px 0;
    margin: 0;
    position: relative;
}

.list-employment li,
.list-education li {
    width: 50%;
    clear: both;
    float: left;
    text-align: right;
    position: relative;
}

.list-employment li .ic,
.list-education li .ic {
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    background: #000000;
    color: #ffffff;
    position: absolute;
    right: 0px;
    top: 20px;
}

.list-employment li .number,
.list-education li .number {
    position: absolute;
    font-style: italic;
    right: -128px;
    left: inherit;
    padding-bottom: 10px;
    font-size: 90px;
    top: 20px;
    color: #ebebeb;
    line-height: 70px;
}
.list-employment li .number{
    top:45px !important;
    font-size:150px !important;
}
.list-employment li .desc,
.list-education li .desc {
    padding: 20px;
    padding-right: 60px;
    border-top: 1px solid #ebebeb;
    border-bottom: 1px solid #ebebeb;
}

.list-employment li:nth-child(odd),
.list-education li:nth-child(odd) {
    float: right;
    text-align: left;
}

.list-employment li:nth-child(odd) .ic,
.list-education li:nth-child(odd) .ic {
    left: 0;
}

.list-employment li:nth-child(odd) .number,
.list-education li:nth-child(odd) .number {
    left: -128px;
    right: inherit;
}

.list-employment li:nth-child(odd) .desc,
.list-education li:nth-child(odd) .desc {
    padding-right: 0;
    padding-left: 60px;
}

.list-employment:before,
.list-education:before {
    content: "";
    position: absolute;
    left: 50%;
    top: 0;
    height: 100%;
    width: 1px;
    background: #ebebeb;
}

@media (max-width: 768px) {
    .list-employment li,
    .list-education li {
        background: #ffffff;
        width: 100%;
    }

    .list-employment li .desc,
    .list-education li .desc {
        border-top: 1px solid #ebebeb;
        border-bottom: 0;
    }

    .list-employment li:last-child .desc,
    .list-education li:last-child .desc {
        border-bottom: 1px solid #ebebeb;
    }

    .list-employment .number,
    .list-education .number {
        display: none;
    }
}

/*== SKILL ==*/
.skill {
    margin: 0;
}

.skill .box {
    text-align: center;
    border: 1px solid transparent;
    padding-bottom: 30px;
}

.skill.top .box {
    padding-top: 50px;
}

.skill.bottom .box {
    padding-top: 30px;
    padding-bottom: 50px;
}

@media (max-width: 768px) {
    .skill .box {
        padding-bottom: 30px !important;
        padding-top: 30px !important;
        border: 0 !important;
    }
}

.chart {
    position: relative;
    display: inline-block;
    width: 110px;
    height: 110px;
    margin-top: 40px;
    margin-bottom: 20px;
    text-align: center;
}

.chart canvas {
    position: absolute;
    top: 0;
    left: 0;
}

.chart .percent {
    color: #000000;
    display: inline-block;
    line-height: 110px;
    z-index: 2;
}

.chart .percent:after {
    content: '%';
    margin-left: 0.1em;
    font-size: .8em;
}

.title-border {
    text-align: center;
    padding: 30px;
    border-top: 1px solid #ebebeb;
    border-bottom: 1px solid #ebebeb;
}

.list-progress li {
    padding: 20px 0;
}

.list-progress li .title {
    margin-bottom: 10px;
}

.list-progress li .progress-line {
    background: #fafafa;
    border: 1px solid #ebebeb;
    padding: 5px;
}

.list-progress li .progress-line .line {
    height: 3px;
    background: black;
    display: block;
    width: 0;
}

/*== PORTFOLIO == */
.box-work {
    margin-bottom: 30px;
    padding: 5px;
    background: #ffffff;
    border: 1px solid #ebebeb;
    position: relative;
}

.box-work .work-preview {
    position: relative;
}

.box-work .work-preview img {
    width: 100%;
}

.box-work .work-preview .hover a.project-title {
    position: absolute;
    bottom: 0;
    width: 100%;
    left: 0;
    transition: all 0.3s ease 0s;
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    -ms-transition: all 0.3s ease 0s;
    padding: 8px;
    background: rgba(255, 255, 255, 0.7);
    text-align: center;
    font-weight: 700;
    text-decoration: none;
    color: #000000;
}

.box-work .work-preview .hover .link-btns {
    position: absolute;
    top: 50%;
    opacity: 0;
    filter: alpha(opacity=0);
    margin-top: -40px;
    width: 100%;
    text-align: center;
    left: 0;
    transition: all 0.8s ease 0s;
    -webkit-transition: all 0.8s ease 0s;
    -moz-transition: all 0.8s ease 0s;
    -o-transition: all 0.8s ease 0s;
    -ms-transition: all 0.8s ease 0s;
}

.box-work .work-preview .hover .link-btns a {
    margin: 5px;
    display: inline-block;
    width: 40px;
    height: 40px;
    transition: all 0.8s ease 0s;
    -webkit-transition: all 0.8s ease 0s;
    -moz-transition: all 0.8s ease 0s;
    -o-transition: all 0.8s ease 0s;
    -ms-transition: all 0.8s ease 0s;
    -webkit-border-radius: 5px !important;
    -moz-border-radius: 5px !important;
    -ms-border-radius: 5px !important;
    -o-border-radius: 5px !important;
    border-radius: 5px !important;
    background: rgba(0, 0, 0, 0.5);
    box-shadow: 0 0 0 1px #ffffff !important;
    -webkit-box-shadow: 0 0 0 1px #ffffff !important;
    -moz-box-shadow: 0 0 0 1px #ffffff !important;
    -o-box-shadow: 0 0 0 1px #ffffff !important;
    -ms-box-shadow: 0 0 0 1px #ffffff !important;
    line-height: 40px;
    color: #ffffff;
}

.box-work .work-preview .hover .link-btns a:hover {
    color: #000000;
    background: #ffffff;
}

.box-work .work-preview:hover .hover .link-btns {
    opacity: 100;
    filter: alpha(opacity=100);
}

.box-work .work-preview:hover .hover a.project-title {
    background: #ffffff;
}

/*== BLOG == */
.list-blog li {
}

.list-blog li .box-blog {
    margin-bottom: 30px;
    position: relative;
    border: 1px solid #ebebeb;
}

.list-blog li .box-blog .blog-bg {
    width: 50%;
    float: left;
    position: absolute;
    left: 0;
    overflow: hidden;
    top: 0;
    height: 100%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.list-blog li .box-blog .blog-bg .blog-ic {
    position: absolute;
    bottom: 0;
    width: 50px;
    height: 50px;
    font-size: 20px;
    line-height: 50px;
    text-align: center;
    background: #fafafa;
    right: 0;
}

.list-blog li .box-blog .blog-bg:before {
    content: "";
    position: absolute;
    width: 100%;
    transition: all 0.8s ease 0s;
    -webkit-transition: all 0.8s ease 0s;
    -moz-transition: all 0.8s ease 0s;
    -o-transition: all 0.8s ease 0s;
    -ms-transition: all 0.8s ease 0s;
    height: 100%;
    left: 0;
    top: 0;
    right: inherit;
    background: rgba(0, 0, 0, 0.1);
}

.list-blog li .box-blog .blog-content {
    width: 100%;
    float: right;
    padding: 30px;
}

.list-blog li:nth-child(even) .blog-bg {

    left: inherit;
}

.list-blog li:nth-child(even) .blog-bg .blog-ic {
    left: 0;
    right: inherit;
}

.list-blog li:nth-child(even) .blog-content {
    float: left;
}

.list-blog li:hover .blog-bg:before {
    left: -100%;
}

.list-blog li .box-blog .blog-content div[style="display: table;"] {
    display: none !important;
}

@media (max-width: 768px) {
    .list-blog li .box-blog .blog-bg {
        width: 100%;
        height: 300px;
        float: none;
        position: relative;
    }

    .list-blog li .box-blog .blog-content {
        width: 100%;
        float: none;
        padding-right: inherit !important;
    }
}

.post-meta {
    font-size: 12px;
    border-bottom: 1px solid #ebebeb;
    padding-bottom: 10px;
    margin-bottom: 10px;
}

.post-meta span {
    margin-right: 10px;
}

.post-meta span i {
    color: #282828;
    margin-right: 5px;
}

.blog-content blockquote {
    color: #282828;
    font-size: 1em;
    margin-bottom: 10px;
}

.comments {
    list-style: none;
    margin: 0;
    margin-top: 20px;
    padding: 0;
}

.comments li {
    margin-bottom: 30px;
}

.comments li .img-thumbnail {
    float: left;
    margin-right: 20px;
}

.comments li .img-thumbnail img {
    width: 45px;
}

.comments li h5 {
    padding-top: 10px;
    color: #323232;
    letter-spacing: 1px;
}

.comments li .meta-data {
    font-size: 11px;
    color: #919191;
}

.comments li .post-comment-block {
    transition: all 0.3s ease 0s;
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    -ms-transition: all 0.3s ease 0s;
    padding-bottom: 5px;
    border-bottom: 1px solid #ebebeb;
}

.comments li ul {
    padding-top: 25px;
    padding-left: 50px;
    list-style: none;
}

.box-widget {
    margin-bottom: 40px;
}

.box-widget h5 {
    margin-bottom: 20px;
}

.list-category a,
.list-archive a {
    color: #7d7d7d;
}

.list-tags li {
    display: inline-block;
}

.list-tags li a {
    display: block;
    background: #f5f5f5;
    color: #7d7d7d;
    border: 1px solid #ebebeb;
    padding: 3px 6px;
    margin-right: 2px;
    margin-bottom: 5px;
    font-size: 12px;
}

/*== CONTACT == */
.contact-area {
    position: relative;
}

.contact-area .form-contact-area {
    width: 50%;
    position: relative;
}

.contact-area .form-contact-area .inner-contact {
    clear: both;
    width: 470px;
    padding: 60px 40px 60px 0;
    float: right;
}

@media (max-width: 1024px) {
    .contact-area .form-contact-area {
        width: 100% !important;
    }

    .contact-area .form-contact-area .inner-contact {
        width: 100%;
        padding: 60px 15px 60px 15px;
        float: none;
    }
}

.contact-area .map-area {
    position: absolute;
    width: 50%;
    right: 0;
    top: 0;
    height: 100%;
    border-left: 1px solid #ebebeb;
    background: #f5f5f5;
}

@media (max-width: 1024px) {
    .contact-area .map-area {
        position: relative;
        height: 300px;
        width: 100%;
    }
}

.contact-area .map-area:before {
    content: "";
    transition: all 0.3s ease 0s;
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    -ms-transition: all 0.3s ease 0s;
    background: rgba(255, 255, 255, 0.7);
    z-index: 99;
    right: 0;
    top: 0;
    position: absolute;
    height: 100%;
    width: 100%;
}

.contact-area .map-area:hover {
    cursor: pointer;
}

.contact-area .map-area.show:before {
    right: -100%;
}

.map-content {
    line-height: 1;
    padding: 20px 0 20px 20px;
    width: 100%;
    font-size: 12px;
    text-align: center;
}

.map-content i {
    margin-right: 2px;
}

/*== TESTIMONIAL == */
.box-testimonial {
    margin: 0 auto;
    margin-bottom: 30px;
    border: 1px solid #ebebeb;
    position: relative;
    padding: 30px;
    padding-left: 45%;
    background: #ffffff;
    max-width: 90%;
    height:540px;
    overflow: hidden;
}

.box-testimonial.left {
    padding-left: 30px !important;
}

.box-testimonial h4,
.box-testimonial h5 {
    letter-spacing: 0px;
}

.box-testimonial .img-profile {
    width: 50%;
    height:auto;
    max-height: 85%;
    margin: 30px 0;
    position: absolute;
    padding: 5px;
    border: 1px solid #ebebeb;
    background: #ffffff;
    top: 0;
    left: -30px;
}

.box-testimonial .img-logo-client {
    height: 30px;
}

@media (max-width: 600px) {
    .box-testimonial {
        margin-left: 30px;
    }
}

.carousel-testi {
    margin: 0 auto;
    max-width: 980px;
}

.carousel-testi .carousel-indicators {
    bottom: -25px;
}

.carousel-testi .carousel-indicators li {
    -webkit-border-radius: 0 !important;
    -moz-border-radius: 0 !important;
    -ms-border-radius: 0 !important;
    -o-border-radius: 0 !important;
    border-radius: 0 !important;
    transition: all 0.3s ease 0s;
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    -ms-transition: all 0.3s ease 0s;
    width: 10px;
    margin: 0 5px;
    height: 10px;
    box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.1) !important;
    -webkit-box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.1) !important;
    -moz-box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.1) !important;
    -o-box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.1) !important;
    -ms-box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.1) !important;
    background: rgba(0, 0, 0, 0.1);
}

.carousel-testi .carousel-indicators li.active,
.carousel-testi .carousel-indicators li:hover {
    background: #ffffff;
}

/*== PARALLAX == */
.parallax-bg {
    background-size: cover;
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
}

@media (max-width: 1024px) {
    .parallax-bg {
        background-attachment: inherit;
        background-position: center !important;
    }
}

/*== CAPTCHA == */
.simpleCaptcha {
    padding: 0;
    border: 0;
    background: transparent;
}

.simpleCaptcha .captchaImages img {
    width: 30px;
}

.simpleCaptcha p {
    padding: 0;
    margin-left: 0;
    margin-right: 0;
}

/*============================
     06. MAIN-FOOTER 
============================*/
.main-footer {
    padding-bottom: 40px;
    font-size: 12px;
    background: #323232;
    position: relative;
    border-top: 1px solid #505050;
    border-bottom: 5px solid #505050;
}

.main-footer .folow-me {
    text-align: center;
    background: #505050;
    padding: 5px;
    margin: 0 auto;
    margin-bottom: 20px;
    width: 150px;
}

.main-footer .back-to-top {
    position: absolute;
    bottom: -5px;
    left: 50%;
    display: block;
    width: 30px;
    height: 30px;
    margin-left: -15px;
    text-decoration: none;
    outline: none;
    line-height: 30px;
    text-align: center;
    color: #7d7d7d;
    background: #505050;
}

.main-footer .back-to-top:hover,
.main-footer .back-to-top:focus {
    color: #ffffff;
}

.main-footer p {
    position: relative;
}

.main-footer:before {
    content: "";
    position: absolute;
    width: 50%;
    right: 0;
    bottom: 0;
    height: 100%;
    background: rgba(0, 0, 0, 0.05);
}

.social-links {
    padding: 0;
    margin-bottom: 10px;
}

.social-links a {
    position: relative;
    color: #ffffff;
    display: block;
    transition: background 0.8s ease 0s;
    -webkit-transition: background 0.8s ease 0s;
    -moz-transition: background 0.8s ease 0s;
    -o-transition: background 0.8s ease 0s;
    -ms-transition: background 0.8s ease 0s;
    width: 30px;
    text-decoration: none;
    height: 30px;
    font-size: 16px;
    line-height: 30px;
    text-align: center;
    background: #282828;
}

.social-links a i {
    position: relative;
}

.social-links a:hover {
    background: #ffffff;
    color: #000000;
}

a {
    color: #222;

}

a:hover, a:visited {
    text-decoration: none;
    color: #333;
}

.list-employment .ic i {
    font-size: 17px;
    padding-top: 13px;

}

.list-about {
    padding-right: 5px;

}

.slider-about {
    margin-right: auto;
    margin-left: auto;
    position: relative;
    z-index: 1;
}

.list-employment li .ic:hover {
    background-color: #333;

}

/******************** header-items *******************************/
.header-items {

}

.header-items .item-circle {
    z-index: 3;
    margin-top: 50px;

}

.item-circle a {
    border-radius: 100%;
    width: 120px;
    height: 120px;
    display: block;
    margin: 0 auto;
    font-size: 40px;
    color: #fff;
    overflow: hidden;
}

.item-circle a i {
    vertical-align: middle;
    margin-top: 35px;
}

.grey_color {
    background-color: #262626;
}

.red_color {
    background-color: #C52C1F;
}

.grey_color .longshadows {

    text-shadow: 1px 1px #000, 2px 2px #000, 3px 3px #000, 4px 4px #000, 5px 5px #000, 6px 6px #000, 7px 7px #000, 8px 8px #000, 9px 9px #000, 10px 10px #000, 11px 11px #000, 12px 12px #000, 13px 13px #000, 14px 14px #000, 15px 15px rgb(0, 0, 0), 16px 16px rgb(0, 0, 0), 17px 17px rgb(0, 0, 0), 18px 18px rgb(0, 0, 0), 19px 19px rgb(0, 0, 0), 20px 20px rgb(0, 0, 0), 21px 21px rgb(0, 0, 0), 22px 22px rgb(0, 0, 0), 23px 23px rgb(0, 0, 0), 24px 24px rgb(0, 0, 0), 25px 25px rgb(0, 0, 0), 26px 26px rgb(0, 0, 0), 27px 27px rgb(0, 0, 0), 28px 28px rgb(0, 0, 0), 29px 29px rgb(0, 0, 0), 30px 30px rgb(0, 0, 0), 31px 31px rgb(0, 0, 0), 32px 32px rgb(0, 0, 0), 33px 33px rgb(0, 0, 0), 34px 34px rgb(0, 0, 0), 35px 35px rgb(0, 0, 0), 36px 36px rgb(0, 0, 0), 37px 37px rgb(0, 0, 0), 38px 38px rgb(0, 0, 0), 39px 39px rgb(0, 0, 0), 40px 40px rgb(0, 0, 0), 41px 41px rgb(0, 0, 0), 42px 42px rgb(0, 0, 0), 43px 43px rgb(0, 0, 0), 44px 44px rgb(0, 0, 0), 45px 45px rgb(0, 0, 0), 46px 46px rgb(0, 0, 0), 47px 47px rgb(0, 0, 0), 48px 48px rgb(0, 0, 0), 49px 49px rgb(0, 0, 0), 50px 50px rgb(0, 0, 0);
}

.red_color .longshadows {

    text-shadow: 1px 1px #6D150E, 2px 2px #6D150E, 3px 3px #6D150E, 4px 4px #6D150E, 5px 5px #6D150E, 6px 6px #6D150E, 7px 7px #6D150E, 8px 8px #6D150E, 9px 9px #6D150E, 10px 10px #6D150E, 11px 11px #6D150E, 12px 12px #6D150E, 13px 13px #6D150E, 14px 14px #6D150E, 15px 15px rgb(109, 21, 14), 16px 16px rgb(109, 21, 14), 17px 17px rgb(109, 21, 14), 18px 18px rgb(109, 21, 14), 19px 19px rgb(109, 21, 14), 20px 20px rgb(109, 21, 14), 21px 21px rgb(109, 21, 14), 22px 22px rgb(109, 21, 14), 23px 23px rgb(109, 21, 14), 24px 24px rgb(109, 21, 14), 25px 25px rgb(109, 21, 14), 26px 26px rgb(109, 21, 14), 27px 27px rgb(109, 21, 14), 28px 28px rgb(109, 21, 14), 29px 29px rgb(109, 21, 14), 30px 30px rgb(109, 21, 14), 31px 31px rgb(109, 21, 14), 32px 32px rgb(109, 21, 14), 33px 33px rgb(109, 21, 14), 34px 34px rgb(109, 21, 14), 35px 35px rgb(109, 21, 14), 36px 36px rgb(109, 21, 14), 37px 37px rgb(109, 21, 14), 38px 38px rgb(109, 21, 14), 39px 39px rgb(109, 21, 14), 40px 40px rgb(109, 21, 14), 41px 41px rgb(109, 21, 14), 42px 42px rgb(109, 21, 14), 43px 43px rgb(109, 21, 14), 44px 44px rgb(109, 21, 14), 45px 45px rgb(109, 21, 14), 46px 46px rgb(109, 21, 14), 47px 47px rgb(109, 21, 14), 48px 48px rgb(109, 21, 14), 49px 49px rgb(109, 21, 14), 50px 50px rgb(109, 21, 14);
}

/*
.organge_color{
    background-color: #EB9664;
}
.organge_color .longshadows{

    text-shadow: 1px 1px #000, 2px 2px #000, 3px 3px #000, 4px 4px #000, 5px 5px #000, 6px 6px #000, 7px 7px #000, 8px 8px #000, 9px 9px #000, 10px 10px #000, 11px 11px #000, 12px 12px #000, 13px 13px #000, 14px 14px #000, 15px 15px rgb(0,0,0), 16px 16px rgb(0,0,0), 17px 17px rgb(0,0,0), 18px 18px rgb(0,0,0), 19px 19px rgb(0,0,0), 20px 20px rgb(0,0,0), 21px 21px rgb(0,0,0), 22px 22px rgb(0,0,0), 23px 23px rgb(0,0,0), 24px 24px rgb(0,0,0), 25px 25px rgb(0,0,0), 26px 26px rgb(0,0,0), 27px 27px rgb(0,0,0), 28px 28px rgb(0,0,0), 29px 29px rgb(0,0,0), 30px 30px rgb(0,0,0), 31px 31px rgb(0,0,0), 32px 32px rgb(0,0,0), 33px 33px rgb(0,0,0), 34px 34px rgb(0,0,0), 35px 35px rgb(0,0,0), 36px 36px rgb(0,0,0), 37px 37px rgb(0,0,0), 38px 38px rgb(0,0,0), 39px 39px rgb(0,0,0), 40px 40px rgb(0,0,0), 41px 41px rgb(0,0,0), 42px 42px rgb(0,0,0), 43px 43px rgb(0,0,0), 44px 44px rgb(0,0,0), 45px 45px rgb(0,0,0), 46px 46px rgb(0,0,0), 47px 47px rgb(0,0,0), 48px 48px rgb(0,0,0), 49px 49px rgb(0,0,0), 50px 50px rgb(0,0,0);
}
.green_color {
    background-color: #B4EB82
}
.green_color .longshadows{
text-shadow: 1px 1px #5A7641, 2px 2px #5A7641, 3px 3px #5A7641, 4px 4px #5A7641, 5px 5px #5A7641, 6px 6px #5A7641, 7px 7px #5A7641, 8px 8px #5A7641, 9px 9px #5A7641, 10px 10px #5A7641, 11px 11px #5A7641, 12px 12px #5A7641, 13px 13px #5A7641, 14px 14px #5A7641, 15px 15px rgb(90, 118, 65), 16px 16px rgb(90, 118, 65), 17px 17px rgb(90, 118, 65), 18px 18px rgb(90, 118, 65), 19px 19px rgb(90, 118, 65), 20px 20px rgb(90, 118, 65), 21px 21px rgb(90, 118, 65), 22px 22px rgb(90, 118, 65), 23px 23px rgb(90, 118, 65), 24px 24px rgb(90, 118, 65), 25px 25px rgb(90, 118, 65), 26px 26px rgb(90, 118, 65), 27px 27px rgb(90, 118, 65), 28px 28px rgb(90, 118, 65), 29px 29px rgb(90, 118, 65), 30px 30px rgb(90, 118, 65), 31px 31px rgb(90, 118, 65), 32px 32px rgb(90, 118, 65), 33px 33px rgb(90, 118, 65), 34px 34px rgb(90, 118, 65), 35px 35px rgb(90, 118, 65), 36px 36px rgb(90, 118, 65), 37px 37px rgb(90, 118, 65), 38px 38px rgb(90, 118, 65), 39px 39px rgb(90, 118, 65), 40px 40px rgb(90, 118, 65), 41px 41px rgb(90, 118, 65), 42px 42px rgb(90, 118, 65), 43px 43px rgb(90, 118, 65), 44px 44px rgb(90, 118, 65), 45px 45px rgb(90, 118, 65), 46px 46px rgb(90, 118, 65), 47px 47px rgb(90, 118, 65), 48px 48px rgb(90, 118, 65), 49px 49px rgb(90, 118, 65), 50px 50px rgb(90, 118, 65);
}
.blue_color {
background-color: #82D2F5;
}
.blue_color .longshadows{
  text-shadow: 1px 1px #005E6A, 2px 2px #005E6A, 3px 3px #005E6A, 4px 4px #005E6A, 5px 5px #005E6A, 6px 6px #005E6A, 7px 7px #005E6A, 8px 8px #005E6A, 9px 9px #005E6A, 10px 10px #005E6A, 11px 11px #005E6A, 12px 12px #005E6A, 13px 13px #005E6A, 14px 14px #005E6A, 15px 15px rgb(0, 94, 106), 16px 16px rgb(0, 94, 106), 17px 17px rgb(0, 94, 106), 18px 18px rgb(0, 94, 106), 19px 19px rgb(0, 94, 106), 20px 20px rgb(0, 94, 106), 21px 21px rgb(0, 94, 106), 22px 22px rgb(0, 94, 106), 23px 23px rgb(0, 94, 106), 24px 24px rgb(0, 94, 106), 25px 25px rgb(0, 94, 106), 26px 26px rgb(0, 94, 106), 27px 27px rgb(0, 94, 106), 28px 28px rgb(0, 94, 106), 29px 29px rgb(0, 94, 106), 30px 30px rgb(0, 94, 106), 31px 31px rgb(0, 94, 106), 32px 32px rgb(0, 94, 106), 33px 33px rgb(0, 94, 106), 34px 34px rgb(0, 94, 106), 35px 35px rgb(0, 94, 106), 36px 36px rgb(0, 94, 106), 37px 37px rgb(0, 94, 106), 38px 38px rgb(0, 94, 106), 39px 39px rgb(0, 94, 106), 40px 40px rgb(0, 94, 106), 41px 41px rgb(0, 94, 106), 42px 42px rgb(0, 94, 106), 43px 43px rgb(0, 94, 106), 44px 44px rgb(0, 94, 106), 45px 45px rgb(0, 94, 106), 46px 46px rgb(0, 94, 106), 47px 47px rgb(0, 94, 106), 48px 48px rgb(0, 94, 106), 49px 49px rgb(0, 94, 106), 50px 50px rgb(0, 94, 106);
}
.red_color{
    background-color: #F08282;
}
.red_color .longshadows{
    text-shadow: 1px 1px #784141, 2px 2px #784141, 3px 3px #784141, 4px 4px #784141, 5px 5px #784141, 6px 6px #784141, 7px 7px #784141, 8px 8px #784141, 9px 9px #784141, 10px 10px #784141, 11px 11px #784141, 12px 12px #784141, 13px 13px #784141, 14px 14px #784141, 15px 15px rgb(120, 65, 65), 16px 16px rgb(120, 65, 65), 17px 17px rgb(120, 65, 65), 18px 18px rgb(120, 65, 65), 19px 19px rgb(120, 65, 65), 20px 20px rgb(120, 65, 65), 21px 21px rgb(120, 65, 65), 22px 22px rgb(120, 65, 65), 23px 23px rgb(120, 65, 65), 24px 24px rgb(120, 65, 65), 25px 25px rgb(120, 65, 65), 26px 26px rgb(120, 65, 65), 27px 27px rgb(120, 65, 65), 28px 28px rgb(120, 65, 65), 29px 29px rgb(120, 65, 65), 30px 30px rgb(120, 65, 65), 31px 31px rgb(120, 65, 65), 32px 32px rgb(120, 65, 65), 33px 33px rgb(120, 65, 65), 34px 34px rgb(120, 65, 65), 35px 35px rgb(120, 65, 65), 36px 36px rgb(120, 65, 65), 37px 37px rgb(120, 65, 65), 38px 38px rgb(120, 65, 65), 39px 39px rgb(120, 65, 65), 40px 40px rgb(120, 65, 65), 41px 41px rgb(120, 65, 65), 42px 42px rgb(120, 65, 65), 43px 43px rgb(120, 65, 65), 44px 44px rgb(120, 65, 65), 45px 45px rgb(120, 65, 65), 46px 46px rgb(120, 65, 65), 47px 47px rgb(120, 65, 65), 48px 48px rgb(120, 65, 65), 49px 49px rgb(120, 65, 65), 50px 50px rgb(120, 65, 65);
}

*/

@media (max-width: 992px) {
    .header-items .item-circle {
        z-index: 3;
        margin-top: 10px;

    }
}

#inner-pages {
    height: 60px;
}

.item-circle span {
    font-weight: bold;
    opacity: 0;
    -webkit-transition: opacity 2s;
    transition: opacity 1s;
    color: #222222;
}

.item-circle:hover span {
    opacity: 1;
}

.services-news {
    max-width: 100%;
    margin-top: 40px;
}

.services-news .box-work {
    margin-bottom: 0;
}

.list-employment .fa:not(.fa-plus), .title-icon .fa, .box-blog .fa {
    color: #C52C1F;

}

.list-employment li p {
    text-align: justify;
}

.sub-service-img-container {
    height: 150px;
    width: 100%;
    overflow: hidden;
}

.img-container {
    width: 100%;
    height: 400px;
    overflow: hidden;
}

.img-container img {
    width: 100%;
}
.blog-content #category {
    display: none;
}
.blog-content #refrence {
    font-size: 7px;
}