/* color #287ce1 */

ul {
    padding: 0px;
    margin: 0px;
    list-style-type: none;
}

.container {
    max-width: 1100px;
}

.bottom-padding-spacing {
    margin-bottom: 106px!important;
}

img {
    max-width: 100%;
}

::-webkit-scrollbar {
    width: 0px;
}

::-webkit-scrollbar-track {
    background:transparent;
    position: absolute;
    width: 0px;
}

::-webkit-scrollbar-thumb {
    background:#202020;
    opacity: 0.7;
    width: 0px;
}

.la-anim-1.la-animate {
    z-index: 9999999999999;
}

.la-anim-1 {
    background:#287ce1;
}

.la-anim-1::after {
    background: #287ce1;
    box-shadow: 0 0 3px #287ce1, 0 0 1px #287ce1;
    opacity: 1;
}

.image-slider {
    min-height: 300px;
}

.btn.btn-large.btn-info:active {
    border:0;
}

@-moz-document url-prefix(http://),url-prefix(https://) {
    scrollbar {
        -moz-appearance: none !important;
        background: rgb(0,255,0) !important;
    }
    thumb,scrollbarbutton {
        -moz-appearance: none !important;
        background-color: rgb(0,0,255) !important;
    }

    thumb:hover,scrollbarbutton:hover {
        -moz-appearance: none !important;
        background-color: rgb(255,0,0) !important;
    }

    scrollbarbutton {
        display: none !important;
    }

    scrollbar[orient="vertical"] {
        min-width: 0px !important;
    }
}

.window-load {
    text-align: center;
}

.Logo-image-window-load {
    position: absolute;
    top:50%;
    margin-top: -150px;
    left:50%;
    margin-left: -300px;
}

.page::-webkit-scrollbar {
    width: 0px;
}

.uppercase {
    text-transform: uppercase;
}

.page {
    overflow-y: auto;
}

a {
    cursor: pointer;
}

.wrapper {
    position: absolute; width: 100%; height: 100%;
    background:#000;
}

.wrapper-video {
    position: absolute; width: 100%; height: 100%;
    background:#000;
    opacity: 0.6;
}

.bg-images {
    width: 100%;
    height: 100%;
}

iframe {
    border:0px;
}

iframe.full {
    width: 100%;
    height: 100%;
    padding-bottom: 106px;
}

.page {
    position: relative;
}

/* 
--------------------------------------------------
Tone Color
--------------------------------------------------
*/

.font-gray {
    color: #9f9f9f;
}

.bg-white {
    background:#fff;
}

.border-top-color-light {
    border-top-color:#287ce1;
}

.btn-primary {
    background:#287ce1!important;
}

.bg-color-light {
    background:#287ce1;
}

.bg-color-dark {
    background:#085cb1;
}

.wrapper-light {
    position: absolute; width: 100%; height: 100%;
    background:#287ce1;
}

.bg-wrapper-dark {
    background:#000;
    opacity: 0.3;
    position: absolute;
    width: 100%;
    height: 100%;
    top:0;
    left:0;
}

.bg-wrapper-video {
    background:transparent;
    position: absolute;
    width: 100%;
    height: 100%;
    top:0;
    left:0;
}

.bg-wrapper-dark-over {
    background:#000;
    opacity: 0.7;
    position: absolute;
    width: 100%;
    height: 100%;
    top:0;
    left:0;
}

.window-load {
    background:#000;
    position: absolute;
    width: 100%;
    height: 100%;
    top:0;
    left:0;
    z-index: 99999;
}

a {
    color: #287ce1;
}

a:hover {
    color: #3498DB;
}

.text-white {
    color:#fff!important;
}

.text-color {
    color:#287ce1;
}

.btn-info {
    border-bottom: 5px solid #2980B9;
}

.wrapper-white {
    position: absolute; width: 100%; height: 100%;
    background:#fff;
}

.border-img {
    border:20px solid #fff;
}

/* 
--------------------------------------------------
Typography
--------------------------------------------------
*/

p {
    font-family: 'Raleway', sans-serif;
    font-size: 16px;
}

h1,h2,h3,h4,h5,h6 {

    font-family: 'Raleway', sans-serif;

    font-weight: 900;

}

.hierarchy p {
    margin-top: 20px;
    margin-bottom: 20px;
}

.font-big {
    font-size: 64px;
}

.font-contact {
    font-size: 160px;
}

.lato {
    font-family: 'lato', sans-serif;
}

.font-soft {
    font-weight: 300;
}

.font-hard {
    font-weight: 700;
}

.icon-control {
    font-size: 32px;
    position: relative;
}

.icon-big-size {
    font-size: 64px;
    top: 10px;
    position: relative;
}

.icon-big-size h5 {
    margin-top: 10px;
}

.icon-big-size:hover {
    color:#484842;
}

.container.not-last {
    margin-bottom: 0;
}

.container.last {
    margin-bottom: 106px;
}

.title-topic {
    padding-bottom: 20px!important;
}

/* 
--------------------------------------------------
Alingment
--------------------------------------------------
*/

.relative {
    position: relative;
}

.text-center {
    text-align: center;
}

.text-left {
    text-align: left;
}

.text-right {
    text-align: right;
}


.home {
    position: relative;
}

.home-slogan {
    position: absolute;

    width: 100%;
    max-width: 100%;
    top:50%;
    left: 50%;
    padding-left: 50px;
    padding-right: 50px;
}

.top-spacing {
    padding-top: 50px;
}

.bottom-spacing {
    padding-bottom: 50px;
}

.top-margin {
    padding-top: 40px;
    margin-bottom: 10px;
    margin-top: 50px;
}

.normal {
    margin-bottom: 50px;
}

.right {
    float:right;
}

.left {
    float:left;
}

.clear-fixed {
    clear:both;
}

/* 
--------------------------------------------------
Navigation
--------------------------------------------------
*/

.navigation {
    position: fixed;
    border-top:2px #287ce1 solid;
    background:#fff;
    bottom:0px;
    left:0px;
    width: 100%;
    z-index: 100;
    opacity: 0.3;
    -moz-opacity: 0.3;
    filter: alpha(opacity=30);
    padding: 20px 0;
    /* animations */
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

.navigation::selection {color:transparent;background:transparent;}
.navigation::-moz-selection {color:transparent;background:transparent;}

.navigation div a::selection {color:transparent;background:transparent;}
.navigation div a::-moz-selection {color:transparent;background:transparent;}

.navigation:hover {
    opacity: 0.9;
    -moz-opacity: 0.9;
    filter: alpha(opacity=90);
}

.btn-navigation {
    text-align: center;
}

.btn-navigation a {
    font-size: 64px;
    border-radius: 20%;
    padding: 10px;
    cursor: pointer;
}

.btn-navigation a::selection {
    background:transparent;
}

.btn-navigation a:hover {
    background:#3498DB;
    color:#fff;
}

.btn-navigation a:active {
    font-size: 48px;
}

.menu-navigation {
    left:50%;
    margin-left: -160px;
    position: absolute;
    width: 320px;
    max-height: 400px;
    bottom: -400%;
    visibility: hidden;
    /* animations */
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

.show-menu {
    bottom: 106px;
    visibility: visible;
}

.menu-navigation a {
    font-size: 16px;
    padding: 15px;
}

.menu-navigation a span {
    font-size: 16px;
    margin-right: 10px;
    /* animations */
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

.menu-navigation a {
    font-size: 16px;
    border:0px;
    display: block;
    width: 100%;
    border-radius: 0;
}

.menu-navigation a:active {
    font-size: 16px;
}

.menu-navigation a:hover span {
    margin-left: 10px;
}

.menu-navigation > li:first-child {
    border-top:0px solid #ccc;
}

.menu-navigation > li {
    font-size: 16px;
    text-align: left;
    border-top:1px solid #ccc;
    background:#fff;
}

.menu-navigation.hoz {
    min-width: 320px;
    width: auto;
    overflow-x: auto;
    height: 84px;
    -webkit-overflow-scrolling: touch;
}

.menu-navigation.hoz > li {
    float:left;
    background:transparent;
    border-top:0px solid #ccc;
    margin-left:10px;
    width: 64px;
}

.menu-navigation.hoz > li:first-child {
    margin-left:0px;
}

.menu-navigation.hoz > li a {
    background:transparent;
}

.menu-navigation.hoz a span {
    background:#fff;
    width:84px;
    height: 84px;
    border-radius: 20%;
    font-size: 42px;
    padding: 10px;
}

.menu-navigation.hoz a:hover span {
    margin-left: 0px;
    background:#3498DB;
}

/* 
--------------------------------------------------
Slider
--------------------------------------------------
*/

.canyon-main-slider li {
    position: relative;
}

.flexslider {
    position: relative;
}

.flexslider > .icon-arrow-left-thin {
    left:0;
}

.flexslider > .icon-arrow-left-thin , 
.flexslider > .icon-arrow-right-thin {
    position: absolute;
    font-size: 48px;
    z-index: 8;
    background:rgba(50,50,50,0.5);
    padding: 10px;
    color:#fff;
    top:50%;
    margin-top: -34px;
    cursor: pointer;
}

.flexslider > .icon-arrow-right-thin {
    right:0px;
}

.flexslider-inside > .icon-arrow-left-thin , 
.flexslider-inside > .icon-arrow-right-thin {
    position: absolute;
    font-size: 48px;
    z-index: 3;
    background:rgba(50,50,50,0.5);
    padding: 10px;
    color:#fff;
    top:50%;
    margin-top: -34px;
}

.flexslider-inside > .icon-arrow-right-thin {
    right:0px;
}

.show-big {
    border-radius: 20px;
    font-size: 200px;
    padding: 20px;
    margin: 20px 0;
    display: block;
    color:#fff;
}

.icon-arrow-left {
    z-index: 8;
    cursor: pointer;
}


/* 
--------------------------------------------------
Portfolio || Our Work
--------------------------------------------------
*/

.col-4 {
    width: 25%;
    background:#ccc;
    float:left;
    position:relative;
}

.caption {
    position: absolute;
    opacity: 0;
    top:0;
    left:0;
    width:100%;
    height:100%;
    /* animations */
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

.caption-description {
    text-align: center;
}

.col-4:hover .caption {
    opacity: 1;
}

.col-4:hover .wrapper {
    opacity: 0.7;
}

.col-4:hover .caption-description {
    color:#fff;
    position:relative;
    z-index:7;
}

.portfolio_container_isotope {
    margin-bottom: 106px;
}

.caption-description span {
    font-size: 64px;
}

.page-content {
    position: relative;
    z-index: 19;
}

/* 
--------------------------------------------------
TESTIMONIALS
--------------------------------------------------
*/

.TESTIMONIALS {
    position: relative;
}

.TESTIMONIALS .container {
    padding: 50px 0;
}

.message-TESTIMONIALS {
    padding: 0px 40px;
    position: relative;
}

.message-TESTIMONIALS .quote {
    padding: 60px;
}

.message-TESTIMONIALS:before {
    border: #085cb1 40px solid;
    position: absolute;
    bottom: 5px;
    border-top: transparent 0px solid;
    border-left: transparent 40px solid;
    border-bottom: transparent 40px solid;
    content: "";
}

.message-TESTIMONIALS.left small {
    float:left;
}

.message-TESTIMONIALS.left:before {
    border: #085cb1 40px solid;
    position: absolute;
    bottom: 5px;
    right:40px;
    border-top: transparent 0px solid;
    border-right: transparent 40px solid;
    border-bottom: transparent 40px solid;
    content: "";
}

/* 
--------------------------------------------------
Social
--------------------------------------------------
*/

.social {
    min-height: 64px;
}

.font-large {
    font-size: 32px;
}

.thumbnail-img {
    padding: 20px;
}

.social a {
    padding: 10px;
}

.social a:hover {
    background:#287ce1;
}

/* 
--------------------------------------------------
Out Team
--------------------------------------------------
*/

.ourteam-box .thumbnail-img {
    padding: 20px;

    -webkit-transition-duration: 0.8s;
    -moz-transition-duration: 0.8s;
    -ms-transition-duration: 0.8s;
    -o-transition-duration: 0.8s;
    transition-duration: 0.8s;
}

.ourteam-box .thumbnail-img img {
    border:#287ce1 0px solid;

    -webkit-transition-duration: 0.8s;
    -moz-transition-duration: 0.8s;
    -ms-transition-duration: 0.8s;
    -o-transition-duration: 0.8s;
    transition-duration: 0.8s;
}

.ourteam-box:hover .thumbnail-img img {
    border:#287ce1 10px solid;
    -webkit-transition-duration: 0.2s;
    -moz-transition-duration: 0.2s;
    -ms-transition-duration: 0.2s;
    -o-transition-duration: 0.2s;
    transition-duration: 0.2s;
}

.ourteam-box {

}

.ourteam-box:hover .line-div {
    background-color:#287ce1;
    -webkit-transition-duration: 0.8s;
    -moz-transition-duration: 0.8s;
    -ms-transition-duration: 0.8s;
    -o-transition-duration: 0.8s;
    transition-duration: 0.8s;
}

.ourteam-box:hover .ourteam-position
{
    color:#287ce1;
    -webkit-transition-duration: 0.8s;
    -moz-transition-duration: 0.8s;
    -ms-transition-duration: 0.8s;
    -o-transition-duration: 0.8s;
    transition-duration: 0.8s;
}

.ourteam-box a.social {
    color:#313131;
}

.ourteam-box a.social:hover {
    color:#fff;
}

.ourteam-name {
    font-size: 1.225em;
}

.ourteam-position {
    font-size: 1.185em;
    font-weight: 300;
}

.ourteam-message {
    padding: 10px;
}

.icon-title {
    font-size: 105px;
}

.follow-form{
    padding: 35px 20px;
}

.sector-follow {
    padding: 40px 0;
    background:#efefef;
}

/* 
--------------------------------------------------
Contact
--------------------------------------------------
*/


.Contact .container {
    position: relative;
    padding: 50px;
}

.Contact-page li {
    position: relative;
}

.contact-form {
    position: absolute;
    top:0px;
    right:0;
    width: 320px;
}

.position-map {
    position: relative;
}

.contact-form-item input , .contact-form-item textarea , .submit-form-contact {
    margin-top: 20px;
    border:0;
    border-radius: 0;
    position: relative;
}

.submit-form-contact {
    display: block;
    background:#222;
    color:#fff!important;
    padding: 15px;
    position: relative;
}

.submit-form-contact:after {
    border-top:10px transparent solid;
    border-left:10px #287ce1 solid;
    border-top:10px transparent solid;
    border-top:10px transparent solid;
    content:"";
    position: absolute;
    left:0px;
    top:50%;
    margin-top: -5px;

    /* animations */
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

.submit-form-contact:hover {
    display: block;
    background:#222;
    color:#fff!important;
    padding-left: 30px;

}

.submit-form-contact:hover:after {
    border-top:20px transparent solid;
    border-left:20px #287ce1 solid;
    border-top:20px transparent solid;
    border-top:20px transparent solid;
    content:"";
    position: absolute;
    left:0px;
    top:50%;
    margin-top: -10px;
}

.frame-map {
    width: 100%; min-height: 800px;
}

/* 
--------------------------------------------------
Effect Modify
--------------------------------------------------
*/

.cl-effect-14 a {
    padding: 0 20px;
    height: 45px;
    line-height: 45px;

    position: relative;
    display: inline-block;
    margin: 15px 25px;
    outline: none;
    color: #fff;
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 400;
    text-shadow: 0 0 1px rgba(255,255,255,0);
}

.cl-effect-14 a::before,
.cl-effect-14 a::after {
    position: absolute;
    width: 45px;
    height: 2px;
    background: #fff;
    content: '';
    opacity: 0.2;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
    pointer-events: none;
}

.cl-effect-14 a::before {
    top: 0;
    left: 0;
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    transform: rotate(90deg);
    -webkit-transform-origin: 0 0;
    -moz-transform-origin: 0 0;
    transform-origin: 0 0;
}

.cl-effect-14 a::after {
    right: 0;
    bottom: 0;
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    transform: rotate(90deg);
    -webkit-transform-origin: 100% 0;
    -moz-transform-origin: 100% 0;
    transform-origin: 100% 0;
}

.cl-effect-14 a:hover::before,
.cl-effect-14 a:hover::after,
.cl-effect-14 a:focus::before,
.cl-effect-14 a:focus::after {
    opacity: 1;
}

.cl-effect-14 a:hover::before,
.cl-effect-14 a:focus::before {
    left: 50%;
    -webkit-transform: rotate(0deg) translateX(-50%);
    -moz-transform: rotate(0deg) translateX(-50%);
    transform: rotate(0deg) translateX(-50%);
}

.cl-effect-14 a:hover::after,
.cl-effect-14 a:focus::after {
    right: 50%;
    -webkit-transform: rotate(0deg) translateX(50%);
    -moz-transform: rotate(0deg) translateX(50%);
    transform: rotate(0deg) translateX(50%);
}

.iframe-video iframe {
    width: 100%;
    height: 615px;
    position: relative;
    z-index: 0;
}

.feature-content ,.project-parallax {
    position: relative;
    z-index: 0;
}

/**** Isotope Filtering ****/

.isotope-item {
    z-index: 2;
}

.isotope-hidden.isotope-item {
    pointer-events: none;
    z-index: 1;
}

/**** Isotope CSS3 transitions ****/

.isotope,
.isotope .isotope-item {
    -webkit-transition-duration: 0.8s;
    -moz-transition-duration: 0.8s;
    -ms-transition-duration: 0.8s;
    -o-transition-duration: 0.8s;
    transition-duration: 0.8s;
}

.isotope {
    -webkit-transition-property: height, width;
    -moz-transition-property: height, width;
    -ms-transition-property: height, width;
    -o-transition-property: height, width;
    transition-property: height, width;
}

.isotope .isotope-item {
    -webkit-transition-property: -webkit-transform, opacity;
    -moz-transition-property:    -moz-transform, opacity;
    -ms-transition-property:     -ms-transform, opacity;
    -o-transition-property:      -o-transform, opacity;
    transition-property:         transform, opacity;
}

/**** disabling Isotope CSS3 transitions ****/

.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
    -webkit-transition-duration: 0s;
    -moz-transition-duration: 0s;
    -ms-transition-duration: 0s;
    -o-transition-duration: 0s;
    transition-duration: 0s;
}

.isotope-navigation .pagination>li {
    border-radius: 0;
}

.isotope-navigation .pagination>li > a {
    border: 0px solid #efefef;
    padding: 15px 30px;
    border-radius: 0;
    background:#287ce1;
    color:#fff;
}

.isotope-navigation .pagination>li > a:hover , .isotope-navigation .pagination>li a.active {
    background:#222;
}

/* 
--------------------------------------------------
Portfolio Ajax Page
--------------------------------------------------
*/

#feature-content:full-screen
{
    float: none;
    width: 100%;
    height: 100%;
    padding: 0;
    margin: 0;
    border: 0 none;
}

#feature-content iframe
{
    margin-bottom: -4px;
}

.control-video {
    position: relative;
}

.control-video i {
    cursor: pointer;
}

#feature-content::selection {color:transparent;background:transparent;}
#feature-content::-moz-selection {color:transparent;background:transparent;}

#feature-content div::selection {color:transparent;background:transparent;}
#feature-content div::-moz-selection {color:transparent;background:transparent;}

.ui-slider {
    background: #222;
    margin-top: 10px;
    margin-bottom: 0;
}

.ui-slider-range {
    background:#085cb1;
}

.ui-slider-handle , .ui-slider-handle:hover {
    background:#fff;
}

.ui-slider-handle:hover,
.ui-slider-handle:focus {
    background-color: #fff;
    outline: none;
}

.ui-slider-vertical {
    width: .8em;
    height: 100px;
    position: absolute;
    top: 0;
    margin-top: 20px;
    left: 50%;
    margin-left: -6px;
}

.frame-volume {
    width: 68px;
    height: 160px;
    position: absolute;
    top: 0;
    margin-top: -160px;
    left: 50%;
    margin-left: -34px;
    background: #287ce1;
    display: none;
}

.frame-settings {
    width: 110px;
    height: 200px;
    position: absolute;
    top: 0;
    margin-top: -200px;
    left: 50%;
    margin-left: -55px;
    display: none;
}

.frame-settings li {
    padding: 6px;
    cursor: pointer;
    color: #fff;
    background: #222;
    border-bottom: 1px solid #2f2f2f;
}

.frame-settings li:hover {
    padding: 6px;
    cursor: pointer;
    color: #fff;
    background:#287ce1;
}

.volumn-master:hover .frame-volume , .video-settings:hover .frame-settings {
    display: block;
}

.ui-slider-vertical .ui-slider-handle {
    left: -.3em;
    margin-left: 0;
    margin-bottom: -.6em;
    top:auto!important;
}

.ui-slider-vertical .ui-slider-range {  
    left: 0;
    width: 100%;
}

.ui-slider-vertical .ui-slider-range-min {
    bottom: 0;
    border-radius: 0;
}

.ui-slider-vertical .ui-slider-range-max {
    top: 0;
}

.images-big-thumbnail {
    min-height: 500px;
}