/*
Author       : Syed Ekram.
Template Name: Screen  - Creative HTML Template.
Version      : 1.1
*/
/*=============================================================
    CSS INDEX
    =============================
    01. GENERAL STYLE (body, link color, section-title, preloader btn, overlay, section-padding etc)
    02. BOOTSTRAP NAVIGATION OVERRIDES
    03. START SLIDER DESIGN
    04. START ABOUT FEATURE DESIGN
    05. START ABOUT US DESIGN
    06. START ABOUT CONTENT DESIGN
    07. START COUNT DOWN DESIGN
    08. START SERVICE DESIGN
    09. START OFFER DESIGN
    10. START PORTFOLIO DESIGN
    11. START TEAM DESIGN
    12. START SKILL DESIGN   
    13. START TESTIMONIAL DESIGN   
    14. START PRICING DESIGN     
    15. START FEATURED VIDEO DESIGN     
    16. START COMPANY LOGO DESIGN     
    17. START BLOG DESIGN     
    18. START NEWSLETTER DESIGN     
    19. START PROMOTION DESIGN     
    20. START CONTACT DESIGN     
    21. START FOOTER DESIGN   
  =============================================================*/
/*01.GENERAL STYLE*/
body {
    background-color: #fff;
    color: #222;
    font-family: "Source Sans Pro",sans-serif;
    font-size: 18px;
    font-weight: 300;
    line-height: 28px;
}
html,
body { height: 100% }
h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 700;
    margin: 0;
    text-transform: uppercase;
}
a {
    color: #313131;
    text-decoration: none;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
}
a:hover {
    color: #fff;
    text-decoration: none;
}
a:focus {
    outline: none;
    text-decoration: none;
}
ul,
li {
    margin: 0;
    padding: 0;
}
fieldset {
    border: 0 none;
    margin: 0 auto;
    padding: 0;
}
/*START SCROLL TO TOP*/
.topcontrol {
    background: #3ab3df none repeat scroll 0 0;
    bottom: 5px;
    color: #fff;
    z-index: 999;
    cursor: pointer;
    font-size: 26px;
    height: 40px;
    opacity: 1;
    filter: alpha(opacity=100);
    padding: 5px 12px;
    position: fixed;
    right: 5px;
    -webkit-transition: all 0.4s ease 0s;
            transition: all 0.4s ease 0s;
    width: 40px;
}
.topcontrol:hover {
    background: #222;
    color: #fff;
}
/*END SCROLL TO TOP*/
/*START PRELOADER DESIGN*/
.preloader {
background: rgba(58,179,223, 0.8) none repeat scroll 0 0;
    bottom: 0;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 9999;
}
.status,
.status-mes {
    background-image: url(../img/status.gif);
    background-position: center;
    background-repeat: no-repeat;
    height: 200px;
    left: 50%;
    margin: -100px 0 0 -100px;
    position: absolute;
    top: 50%;
    width: 200px;
}
.no-padding { padding: 0 }
/*END PRELOADER DESIGN*/
.section-padding { padding: 60px 0 }
/*START SECTION TITLE DESIGN*/
.section-title { margin-bottom: 60px }
.section-title  h2 {
    margin: 0;
    text-transform: uppercase;
    padding-bottom: 10px;
}
.section-title  h2 span { color: #3ab3df }
@media only screen and (max-width:768px) { 
    .section-title h2 { text-align: center }
}
@media only screen and (max-width:480px) { 
    .section-title h2 { font-size: 30px }
}
@media only screen and (max-width:360px) { 
    .section-title h2 { font-size: 24px }
}
.line {
    background: #3ab3df none repeat scroll 0 0;
    display: block;
    height: 2px;
    margin: 10px auto 15px;
    width: 100px;
}
/*SECTION OVERLAY*/
.overlay {
    background: rgba(0,0,0,0.6) none repeat scroll 0 0;
    padding: 60px 0;
}
/*END SECTION OVERLAY*/
/*START BTN STYLE*/
.btn-light-bg {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: 1px solid #e8e8e9;
    border-radius: 0;
    box-shadow: 3px 4px 7px rgba(0, 0, 0, 0.25);
    color: #333;
    padding: 10px 20px;
    -webkit-transition: all 0.4s ease 0s;
            transition: all 0.4s ease 0s;
}
.btn-light-bg:hover,
.btn-light-bg:focus {
    background: #3ab3df;
    border: 1px solid #3ab3df;
    color: #fff;
}
/*END BTN STYLE*/
/*01.END GENERAL STYLE*/
/* 02.BOOTSTRAP NAVIGATION OVERRIDES*/
.navbar-default {
    border: none;
    border-radius: 0;
    margin-bottom: 0;
    width: 100%;
    padding: 20px 0;
    background: #fff;
    transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
}
.navbar-default .navbar-nav>.active>a,
.navbar-default .navbar-nav>.active>a:hover,
.navbar-default .navbar-nav>.active>a:focus {
    color: #3ab3df !important;
    background-color: transparent;
}
.navbar-default .navbar-nav>.open>a,
.navbar-default .navbar-nav>.open>a:hover,
.navbar-default .navbar-nav>.open>a:focus {
    color: #3ab3df !important;
    background-color: transparent;
}
.navbar-brand { padding: 0px }
.navbar-brand img { width: 150px }
.menu-top { background: none }
.menu-top li a {
    font-family: "Merriweather",sans-serif;
    color: #fff !important;
    font-size: 12px;
    font-weight: 400;
    text-transform: uppercase;
}
.menu-top li a:hover { color: #3ab3df!important }
@media only screen and (max-width:768px) { 
    .navbar-default .navbar-nav > li > a {
        margin-top: 10px;
        padding: 8px;
    }
}
@media only screen and (max-width:480px) { 
    .menu-top { background-color: #fff }
    .navbar-default .navbar-nav > li > a { color: #313131  !important }
}
.navbar-default.menu-shrink {
    background-color: #fff;
    box-shadow: -1px 1px 1px rgba(0, 0, 0, 0.1);
    padding: 10px 0;
    width: 100%;
}
@media only screen and (max-width:480px) { 
    .menu-top {
        color: #fff !important;
        margin-left: 0px;
    }
}
.dropdown-menu {
    background-color: #282828;
    border-radius: 0;
	padding:0;
}
.dropdown-menu li a {
color: #b1b1b1 !important;
display: block;
font-size: 12px;
font-weight: 400;
line-height: 24px;
padding: 8px 20px;
text-transform: uppercase;
transition: all 0.3s ease 0s;
white-space: nowrap;
}
.dropdown-menu li a:hover {
    color: #fff !important;
    background-color: #1cbac8!important;
}
.navbar-default.menu-shrink .dropdown-menu li a {
    color: #b1b1b1 !important;
}
.navbar-default.menu-shrink .dropdown-menu li a:hover {
    color: #fff !important;
    background-color: #1cbac8!important;
}

.navbar-default .navbar-nav li:hover > .dropdown-menu { display: block }
.navbar-default.menu-shrink li a { color: #313131!important }
.navbar-default.menu-shrink li a:hover { color: #3ab3df !important }
.navbar-default .navbar-toggle { background: #fff none repeat scroll 0 0 }
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus { background-color: #fff }
.navbar-default .navbar-toggle .icon-bar { background-color: #3ab3df }
/* 02.END BOOTSTRAP NAVIGATION OVERRIDES*/
/*03.START SLIDER DESIGN*/
.slider_overlay {
    background: rgba(28, 186, 200, 0.4) none repeat scroll 0 0;
    height: 700px;
}
.slider_text { padding-bottom: 30px }
.slider_text h2 {
    color: #fff;
    font-size: 45px;
    line-height: 60px;
    padding-top: 250px;
    text-transform: uppercase;
    margin: 0;
    font-family: "Merriweather",sans-serif;
    font-weight: 400;
}
@media only screen and (max-width:768px) { 
    .slider_text h2 { font-size: 40px }
}
@media only screen and (max-width:360px) { 
    .slider_text h2 {
        font-size: 30px;
        line-height: 40px;
        padding-top: 150px;
    }
}
.slider_text p {
    color: #fff;
    letter-spacing: 1px;
    margin-bottom: 0;
    padding-bottom: 35px;
    padding-top: 25px;
}
.slider_text a {
    background: #3ab3df none repeat scroll 0 0;
    border: 1px solid #3ab3df;
    box-shadow: 3px 4px 7px rgba(0, 0, 0, 0.25);
    color: #fff;
    font-weight: 600;
    margin-left: 20px;
    text-transform: capitalize;
    -webkit-transition: all 0.4s ease 0s;
            transition: all 0.4s ease 0s;
}
@media only screen and (max-width:360px) { 
    .slider_text a { margin-left: 0px }
}
@media only screen and (max-width:320px) { 
    .slider_text a {
        font-size: 14px;
        padding: 8px;
    }
}
.slider_text a:hover {
    background: #fff !important;
    border: 1px solid #fff!important;
    color: #3ab3df;
}
.btn-light-bg-color {
    background: #040E18 !important;
    border: 1px solid #040E18!important;
    color: #fff;
    -webkit-transition: 0.4s;
            transition: 0.4s;
}
.btn-light-bg-color:hover {
    background: #fff !important;
    border: 1px solid #fff!important;
    color: #333;
}
.carousel-indicators li {
    background: #fff none repeat scroll 0 0;
    border: 1px solid #fff;
    border-radius: 12px;
    height: 2px;
    margin: 0 1px;
    width: 30px;
}
.carousel-indicators .active {
    height: 2px;
    margin: 0 1px;
    width: 30px;
    border: 1px solid #3AB3DF;
    background: #3AB3DF none repeat scroll 0 0;
}
.carousel-indicators { bottom: -130px }
@media only screen and (max-width:480px) { 
    .carousel-indicators { bottom: -60px }
}
/*03.END SLIDER DESIGN*/


/*HOME SHIDESHOW*/
#home-slider {
    overflow: hidden;
    position: relative;
}
.caption {
    position: absolute;
    top: 15%;
    margin-top: -104px;
    left: 0;
    right: 0;
    text-align: center;
    z-index: 15;
    font-size: 18px;
    font-weight: 300;
    color: #fff;
}
.caption h2 {
    color: #fff;
    font-size: 45px;
    line-height: 60px;
    padding-top: 250px;
    text-transform: uppercase;
    margin: 0;
    font-family: "Merriweather",sans-serif;
    font-weight: 400;
}
@media only screen and (max-width:768px) { 
    .caption h2 {
        font-size: 40px;
        letter-spacing: 1px;
    }
}
@media only screen and (max-width:480px) { 
    .caption h2 {
        font-size: 30px;
        letter-spacing: 1px;
    }
}
@media only screen and (max-width:320px) { 
    .caption h2 {
        font-size: 24px;
        letter-spacing: 1px;
    }
}
.caption p {
    color: #fff;
    letter-spacing: 1px;
    margin-bottom: 0;
    padding-bottom: 35px;
    padding-top: 25px;
 }
.carousel-fade .carousel-inner .item {
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transition-property: opacity;
    transition-property: opacity;
    background-repeat: no-repeat;
    background-size: cover;
    height: 650px;
}
.carousel-fade .carousel-inner .item:after {
    content: " ";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0,0,0,.7);
}
.carousel-fade .carousel-inner .active {
    opacity: 1;
    filter: alpha(opacity=100);
}
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
    left: 0;
    opacity: 0;
    filter: alpha(opacity=0);
    z-index: 1;
}
.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
    opacity: 1;
    filter: alpha(opacity=100);
}
.carousel-fade .carousel-control { z-index: 2 }
.left-control,
.right-control {
    background:#fff;
    color: #222;
    font-size: 24px;
    height: 51px;
    line-height: 48px;
    position: absolute;
    text-align: center;
    top: 50%;
    -webkit-transition: all 0.5s ease 0s;
            transition: all 0.5s ease 0s;
    width: 51px;
    z-index: 20;
}
@media only screen and (max-width:480px) { 
    .left-control,
    .right-control { display: none }
}
.left-control { left: -51px }
.right-control { right: -51px }
.left-control:hover,
.right-control:hover {
    background-color: #00bcd4;
    color: #fff;
}
#home-slider:hover .left-control { left: 0px }
#home-slider:hover .right-control { right: 0px }
#home-slider .fa-angle-down {
    position: absolute;
    left: 50%;
    bottom: 50px;
    color: #fff;
    display: inline-block;
    width: 24px;
    margin-left: -12px;
    font-size: 24px;
    line-height: 24px;
    z-index: 999;
    -webkit-animation: bounce 3000ms infinite;
    animation: bounce 3000ms infinite;
}
/*END HOME SHIDESHOW*/
.html-video{
    top: 0%;
    left: 0%;
    max-height: 700px;
    width: 100%;
    overflow: hidden;
    position: relative;
}
.html-video::before{
    content: "";
    background-color: rgba(28, 186, 200, 0.4);
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.slider-caption {
    position: absolute;
    top: 50%;
    width: 100%;
    left: 0;
    text-align: center;
    z-index: 15;
    -webkit-transform: translate(0%, -50%);
    -moz-transform: translate(0%, -50%);
    -ms-transform: translate(0%, -50%);
    -o-transform: translate(0%, -50%);
    transform: translate(0%, -50%);}
	
.slider-caption h2{padding-top: 100px;}

video {
  min-width: 100%;
}

/*
 * ----------------------------------------------------------------------------------------
 *  START SECTION TOP DESIGN
 * ----------------------------------------------------------------------------------------
 */
.section_overlay{background: rgba(0,0,0, 0.4) none repeat scroll 0 0; padding: 60px 0;}
.section-top-title h2 {
    color: #fff;
    font-size: 45px;
    margin: 0;
    text-transform: uppercase;
}
@media only screen and (max-width:320px) { 
    .section-top-title h2 { font-size: 40px }
}
.section-top-title {
    padding-bottom: 60px;
    padding-top: 100px;
}
.section-top-title,
.breadcrumb {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    margin-bottom: 0;
}
.section-top-title ol li { color: #fff!important }
.section-top-title ol li a { color: #fff!important }
.section-top-title ol li a:hover { color: #1CBAC8!important }
/*
 * ----------------------------------------------------------------------------------------
 * END SECTION TOP DESIGN
 * ----------------------------------------------------------------------------------------
*/


/*04.START ABOUT FEATURE DESIGN*/
.about_feature { background: #f5f5f5 }
@media only screen and (max-width:480px) { 
    .single_about_feature { margin-bottom: 20px }
}
.single_about_feature i {
    color: #3ab3df;
    border: 1px solid #ccc;
    border-radius: 50px;
    font-size: 22px;
    height: 60px;
    margin-right: 20px;
    padding: 18px;
    text-align: center;
    width: 60px;
    -webkit-transition: all 0.4s ease 0s;
            transition: all 0.4s ease 0s;
}
.single_about_feature h4 { -webkit-transition: all 0.4s ease 0s; transition: all 0.4s ease 0s }
.single_about_feature p { margin-bottom: 0 }
.single_about_feature:hover h4 { color: #3ab3df }
.single_about_feature:hover i {
    background: #3ab3df;
    border: 1px solid #3ab3df;
    color: #fff;
}
/*04.END ABOUT FEATURE DESIGN*/
/*05.START ABOUT US DESIGN*/
.about-us-content { margin-bottom: 20px }
.device_img { text-align: center }
.device_img img { display: inline-block }
@media only screen and (max-width:768px) { 
    .device_img img { margin-top: 30px }
}
.about-us-content h2 {
    border-bottom: 1px solid #e8e8e9;
    line-height: 42px;
    margin-bottom: 20px;
    padding: 10px 0;
    text-transform: uppercase;
    letter-spacing: 0;
}
@media only screen and (max-width:480px) { 
    .about-us-content h2 { font-size: 18px }
}
@media only screen and (max-width:360px) { 
    .about-us-content h2 { line-height: 26px }
}
.about-us-content p { margin-bottom: 20px }
/*05.END ABOUT US DESIGN*/
/*06.START ABOUT CONTENT DESIGN*/
.single_about {
    padding: 48px 30px;
    -webkit-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}
.about_content_bg { background: #222 }
.single_about i {
    color: #fff;
    font-size: 40px;
    margin: 0;
    padding-bottom: 20px;
    -webkit-transition: all 0.4s ease 0s;
            transition: all 0.4s ease 0s;
}
.single_about_one:hover { background: #3ab3df }
.single_about_three:hover { background: #3ab3df }
.single_about h4 {
    font-weight: 700;
    text-transform: uppercase;
    color: #fff;
    margin: 0;
    padding-bottom: 20px;
}
.single_about p {
    color: #fff;
    margin-bottom: 0;
    padding-bottom: 20px;
}
.single_about a {
    color: #fff;
    -webkit-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}
.single_about a:hover { text-decoration: underline }
/*06.END ABOUT CONTENT DESIGN*/
/*07.START COUNT DOWN DESIGN*/
.counter_feature { background: #040E18 none repeat scroll 0 0 }
.counter span {
    background: #3ab3df none repeat scroll 0 0;
    display: block;
    height: 2px;
    margin: 15px auto;
    width: 60px;
}
@media only screen and (max-width:480px) { 
    .counter { margin-bottom: 10px }
}
.counter h2 {
    color: #fff;
    font-weight: 700;
}
.counter p {
    color: #fff;
    text-transform: capitalize;
    font-size: 18px;
}
@media only screen and (max-width:768px) { 
    .counter p { font-size: 13px }
}
@media only screen and (max-width:360px) { 
    .counter p { font-size: 12px }
}
@media only screen and (max-width:320px) { 
    .counter p { font-size: 18px }
}
/*07.END COUNT DOWN DESIGN*/
/*08.START SERVICE DESIGN*/
.single_service {
    background: #3ab3df none repeat scroll 0 0;
    padding: 40px 20px;
}
.single_service_color { background: #58BFE8 none repeat scroll 0 0 }
.single_service i {
    color: #fff;
    font-size: 40px;
    padding-bottom: 20px;
    -webkit-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}
.single_service:hover i {
    -webkit-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2);
}
.single_service h4 {
    color: #fff;
    padding-bottom: 20px;
}
.single_service p {
    color: #fff;
    margin-bottom: 0;
}
/*08.END SERVICE DESIGN*/
/*09.START OFFER DESIGN*/
.single_offer {
    border: 1px solid #e8e8e9;
    box-shadow: -2px 2px 2px 0 rgba(0, 0, 0, 0.06), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.06);
    padding: 20px;
}
@media only screen and (max-width:480px) { 
    .single_offer { margin-bottom: 20px }
}
.single_offer_img { overflow: hidden }
.single_offer_img img {
    display: block;
    position: relative;
    -webkit-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}
.single_offer:hover .single_offer_img img {
    -webkit-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2);
}
.single_offer h4 {
    letter-spacing: 0;
    margin-top: 20px;
    text-transform: capitalize;
    -webkit-transition: all 0.4s ease 0s;
            transition: all 0.4s ease 0s;
}
.single_offer span {
    background: #3ab3df none repeat scroll 0 0;
    display: block;
    height: 2px;
    margin: 20px 0;
    width: 60px;
}
.single_offer p {
    text-align: justify;
    margin-bottom: 20px;
}
.single_offer:hover { box-shadow: none }
.single_offer:hover h4 { color: #3ab3df }
.single_offer:hover a {
    background: #3ab3df;
    color: #fff;
    border: 1px solid #3ab3df;
}
/*09.END OFFER DESIGN*/
/*10.START PORTFOLIO DESIGN*/
.portfolio-filters { margin-bottom: 60px }
.portfolio-filters li.active {
    background-color: #3ab3df;
    border-color: #3ab3df;
    color: #fff;
}
.portfolio-filters li {
    border: 1px solid #e8e8e9;
    cursor: pointer;
    display: inline-block;
    margin-right: 5px;
    padding: 5px 30px;
    text-transform: capitalize;
    -webkit-transition: all 0.4s ease 0s;
            transition: all 0.4s ease 0s;
    font-weight: 400;
}
@media only screen and (max-width:360px) { 
    .portfolio-filters li { margin-bottom: 10px }
}
.portfolio-filters li:hover {
    background: #3ab3df;
    color: #fff;
    border: 1px solid #3ab3df;
}
.grid .mix {
    display: none;
    opacity: 0;
    filter: alpha(opacity=0);
}
.image-wrapper { position: relative }
.image-wrapper img {
    width: 100% !important;
    height: auto;
}
.image-overlay {
    background: rgba(58,179,223, 0.8) none repeat scroll 0 0;
    position: absolute;
    text-align: center;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}
.image-overlay span {
    position: absolute;
    top: 40%;
    color: #FFF;
    left: 38%;
}
.image-overlay span i {
    width: 50px;
    height: 50px;
    border: 1px solid #FFF;
    color: #FFF;
    font-size: 20px;
    text-align: center;
    line-height: 50px;
    -webkit-transition: all 0.4s ease 0s;
            transition: all 0.4s ease 0s;
}
.image-overlay span i:hover {
    background: #fff;
    color: #3ab3df;
    border: 1px solid #fff;
}
.image-wrapper:hover .image-overlay { opacity: 1; filter: alpha(opacity=100) }
.portfolio_btn { padding-top: 50px }
.btn-portfolio-bg {
    background: #3ab3df none repeat scroll 0 0;
    border: 1px solid #3ab3df;
    border-radius: 0;
    color: #fff;
    padding: 10px 30px;
    -webkit-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    box-shadow: 3px 4px 7px rgba(0, 0, 0, 0.25);
}
.btn-portfolio-bg:hover,
.btn-portfolio-bg:focus {
    background: #fff;
    border: 1px solid #fff;
    color: #222;
}
/*START PORTFOLIO SINGLE PAGE DESIGN*/
.single_project{background:#f6f6f6; padding-top:60px}
.project_dec {
background: #fff none repeat scroll 0 0;
box-shadow: 2px 4px 8px 1px rgba(0, 0, 0, 0.1);
margin-bottom: 60px;
padding: 20px;
}
.project_dec img {margin-right: 20px;
width: 600px;}
@media only screen and (max-width:768px) { 
.project_dec img {width: 100%;}
}
.similar_p {
border-bottom: 1px solid #e8e8e9;
font-size: 30px;
margin-bottom: 25px;
padding-bottom: 10px;
padding-top: 40px;
text-align: center;
}
.similar_p span{ color: #3ab3df}
.related_single_project{padding-bottom:60px}
.related_project  h4 {
color: #333;
transition: all 0.4s ease 0s;
padding: 10px 0;
border-bottom: 1px solid #e8e8e9;
}

.related_project  h4:hover { color: #3ab3df }
.about_project h4,
.about_project_details h4 {
    border-bottom: 1px solid #e8e8e9;
    padding: 10px 0;
}
.about_project_details { margin-bottom: 20px }
.about_project_details ul {
    margin: 0;
    padding: 0;
    list-style: none;
}
.about_project_details ul li { padding: 5px 0 }
.about_project_details ul li i {
    color: #3ab3df;
    margin-right: 10px;
}
.about_project_details ul li a {
    color: #3ab3df;
    font-weight: 700;
}
.about_project_details ul li a:hover { text-decoration: underline }
/*END PORTFOLIO SINGLE PAGE DESIGN*/




/*10.END PORTFOLIO DESIGN*/
/*11.START TEAM DESIGN*/
.team_item {
    height: 400px;
    background-size: cover;
    background-position: center;
    position: relative;
}
.team_description h3 {
    color: #fff;
    letter-spacing: 1px;
    line-height: 30px;
    margin-bottom: 0;
}
.team_title {
color: #fff;
margin-bottom: 0;
font-weight: 400;
}
.team_description {padding-top: 10px;}
.team_over {
background: rgba(28, 186, 200, 0.4) none repeat scroll 0 0;
height: 100%;
left: 0;
opacity: 0;
position: absolute;
top: 0;
transition: all 0.45s ease-in-out 0s;
width: 100%;
}
.team_over ul {
    text-align: center;
    top: 45%;
    position: relative;
}
.team_over li {
    display: inline-block;
    height: 50px;
    padding: 12px;
    width: 50px;
}
.team_item:hover .team_over { opacity: 1; filter: alpha(opacity=100) }
.social_team i {
color: #fff;
font-size: 26px;
}
.team_over li.facebook_icon { background-color: #3b5999 }
.team_over li.twitter_icon { background-color: #00cae9 }
.team_over li.google_icon { background-color: #f26798 }
.team_over li.linkedin_icon { background-color: #117bb7 }
/*11.END TEAM DESIGN*/
/*12.START SKILL DESIGN */
.progress-bar-text {
    font-size: 12px;
    font-weight: 400;
    margin-bottom: 10px;
    text-transform: uppercase;
}
.progress-bar-text span { float: right }
.progress-bar {
    background: #e8e8e9 none repeat scroll 0 0;
    box-shadow: 0 0 0;
    height: 10px;
    margin: 0 0 30px;
    position: relative;
    width: 100%;
}
.progress-bar > span {
    background: #3ab3df none repeat scroll 0 0;
    display: block;
    height: 100%;
    width: 0;
}
/*12.END SKILL DESIGN */
/*13.START TESTIMONIAL DESIGN*/
.testimonial_overlay {
background: rgba(28, 186, 200, 0.4) none repeat scroll 0 0;
padding: 100px 0;
}
.single_testimonial {
    background: rgba(0, 0, 0, 0.5) none repeat scroll 0 0;
    padding: 30px;
}
.single_testimonial img {
    border-radius: 100px;
    float: left;
    height: 80px;
    margin-right: 20px;
    width: 80px;
}
                      
.single_testimonial h4 {
    text-transform: capitalize;
    color: #fff;
}
.single_testimonial p {
    color: #fff;
    text-align: justify;
}
/*13.END TESTIMONIAL DESIGN*/
/*14.START PRICING DESIGN*/
.pricing-section { background: #f5f5f5 }
.pricing-content {
    background: #fff none repeat scroll 0 0;
    box-shadow: -3px 6px 6px 0 rgba(0, 0, 0, 0.1), 0 3px 2px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.06);
    -webkit-transition: all 0.4s ease 0s;
            transition: all 0.4s ease 0s;
    position: relative;
}
.pricing-content-shadow { box-shadow: -4px 4px 4px 0 rgba(0, 0, 0, 0.26), 0 3px 2px -1px rgba(0, 0, 0, 0.2), 0 7px 8px 0 rgba(0, 0, 0, 0.14) }
@media only screen and (max-width:768px) { 
    .pricing-content { margin-bottom: 20px }
}
.pricing-content:hover {
    -webkit-transform: scale(1.02);
        -ms-transform: scale(1.02);
            transform: scale(1.02);
    z-index: 1;
}
.pricing-title h3 {
    background: #3ab3df none repeat scroll 0 0;
    color: #fff;
    margin: 0;
    padding: 25px 0;
    text-transform: uppercase;
}
.pricing-price h1 {
    background: #f5f5f5 none repeat scroll 0 0;
    font-size: 40px;
    margin: 0;
    padding: 20px 0;
    -webkit-transition: all 0.4s ease 0s;
            transition: all 0.4s ease 0s;
}
.pricing-content:hover .pricing-price h1 { color: #3ab3df }
.pricing-data p {
    padding: 10px 0;
    margin-bottom: 0;
}
.pricing-order a {
    background: #3ab3df none repeat scroll 0 0;
    border: 1px solid #3ab3df;
    color: #fff;
}
.pricing-order a:hover {
    background: none repeat scroll 0 0;
    border: 1px solid #e8e8e9;
    color: #333;
}
.pricing-order { padding: 20px 0 }
/*14.END PRICING DESIGN*/
/*15.START FEATURED VIDEO DESING*/
.video { background: #040E18 }
.feature-title,
.feature-title-text { color: #fff }
iframe {
    height: 480px;
    width: 850px;
    border: none;
}
@media only screen and (max-width:768px) { 
    iframe { width: 100% }
}
@media only screen and (max-width:48px) { 
    iframe { width: 100% }
}
@media only screen and (max-width:360px) { 
    iframe { width: 100% }
}
@media only screen and (max-width:320px) { 
    iframe { width: 100% }
}
/*15.END FEATURED VIDEO DESING*/
/*16.START COMPANY LOGO DESIGN*/
.company_logo { background: #040E18 none repeat scroll 0 0 }
.company_logo img {
    border: 1px solid #333;
    opacity: 0.6;
    filter: alpha(opacity=60);
    -webkit-transition: all 0.4s ease 0s;
            transition: all 0.4s ease 0s;
}
@media only screen and (max-width:480px) { 
    .company_logo img { margin-bottom: 20px }
}
.company_logo img:hover {
    opacity: 1;
    filter: alpha(opacity=100);
    border: 1px solid #3ab3df;
}
/*16.END COMPANY LOGO DESIGN*/
/*17.START BLOG DESIGN*/
.single_blog {
    padding-bottom: 60px;
    overflow: hidden;
}
@media only screen and (max-width:768px) { 
    .single_blog img {
        height: 330px;
        width: 600px;
    }
}
@media only screen and (max-width:480px) { 
    .single_blog img {
        height: 300px;
        width: 350px;
    }
}
@media only screen and (max-width:360px) { 
    .single_blog img {
        height: 200px;
        width: 220px;
    }
}
@media only screen and (max-width:320px) { 
    .single_blog img {
        height: 200px;
        width: 200px;
    }
}
.blog-text {
background-color: rgba(255,255,255,0.9);
border: 1px solid #e8e8e9;
box-shadow: -2px 2px 2px 0 rgba(0, 0, 0, 0.14), 0 0 1px -2px rgba(0, 0, 0, 0.6), 0 2px 5px 0 rgba(0, 0, 0, 0.14);
float: right;
margin-top: 30px;
padding: 15px;
position: relative;
width: 45%;
z-index: 1;
}
@media only screen and (max-width:480px) { 
    .blog-text { width: 50% }
}
@media only screen and (max-width:360px) { 
    .blog-text { width: 80% }
}
@media only screen and (max-width:480px) { 
    .blog-text { width: 70% }
}
.blog-text h4 {
    margin-bottom: 20px;
    text-transform: uppercase;
}
.blog-text a {
  color: #333;
letter-spacing: 0;
transition: all 0.4s ease 0s;
}
.blog-text strong { font-size: 16px }
.blog-text p { margin-top: 20px }
.blog-text button { margin-top: 10px }
.blog-photo {
    position: absolute;
    top: 0;
}


/*START BLOG SINGLE*/
.blog-post {
    display: inline-block;
    width: 100%;
	margin-bottom:40px;
}
.blog-post h4 {
    border-bottom: 1px solid #e8e8e9;
    text-transform: uppercase;
    padding: 10px 0;
	margin-bottom: 15px;
}
.blog-post p { margin-bottom: 30px;
font-size: 16px;
text-align: justify; }
.blog-post .post-bt {
    font-size: 14px;
    display: inline-block;
    width: 100%;
    margin-bottom: 10px;
}
.blog-post .post-info {
    margin-top: -39px;
    padding: 8px 0;
    position: relative;
}
.blog-post .post-img {
    position: relative;
    overflow: hidden;
}
.blog-post .post-img img { width: 100% }
.blog-post .post-info li {
    display: inline-block;
    margin-right: 20px;
}
.blog-post .post-info li i {
    margin-right: 10px;
    font-size: 14px;
}
.blog-post .post-info li .date {
    background: #3ab3df none repeat scroll 0 0;
    color: #fff;
    float: right;
    font-size: 18px;
    padding: 15px 10px;
    position: absolute;
    right: 0;
    text-align: center;
    top: -19px;
    width: 100px;
}
.blog-post .post-info li .comment {
    background: #3ab3df none repeat scroll 0 0;
    color: #fff;
    font-size: 18px;
    left: 0;
    padding: 15px 10px;
    position: absolute;
    text-align: center;
    top: -19px;
}
/*END BLOG LEFT SIDEBAR*/
/*START BLOG SIDEBAR*/
.blog_sidebar_title {
border-bottom: 1px solid #e8e8e9;
color: #3ab3df;
margin-bottom: 15px;
padding-bottom: 15px;
}
.search,.widget_recent_entries,
.widget_recent_comments,
.video_post,
.widget_meta,
.widget_archive,
.widget_categories,
.categories { margin-bottom: 30px }
.categories ul,.widget_meta ul,
.widget_recent_entries ul,
.widget_recent_comments ul,
.widget_categories ul,
.widget_archive ul
{
    margin: 0;
    padding: 0;
    list-style: none;
}
.categories ul li,.widget_meta ul li a,
.widget_recent_entries ul li a,
.widget_recent_comments ul li a,
.widget_categories ul li a,
.widget_archive ul li a{
    position: relative;
    padding-left: 10px!important;
}
.widget_meta ul li a:before,
.widget_recent_entries ul li a:before,
.widget_recent_comments ul li a:before,
.widget_categories ul li a:before,
.widget_archive ul li a:before{
    content: "\f0da";
    position: absolute;
    font-family: 'FontAwesome';
    left:0;


}
.widget_recent_entries ul li a,
.widget_recent_comments ul li a,
.widget_meta ul li a,
.widget_archive ul li a,
.widget_categories ul li a,
.categories ul li a {
    color: #333;
    display: inline-block;
    font-size: 14px;
    padding: 5px 0;
}
img{
    
    height: auto;
}
.categories ul li a:hover,
.widget_recent_entries ul li a:hover,
.widget_categories ul li a:hover,
.widget_meta ul li a:hover,
.widget_recent_comments ul li a:hover,
.widget_archive ul li a:hover { color: #3ab3df }
.categories ul li a i { margin-right: 10px }
.video_post iframe,.widget_text iframe {
    width: 100%;
    height: 220px;
    border: medium none;
}
.tagcloud{
    overflow: hidden;
}
select{
    max-width: 100%;
}
.tagcloud a,.tag a{
    border: 1px solid #e8e8e9;
    display: block;
    float: left;
    font-size: 16px!important;
    margin: 4px;
    padding: 5px 15px;
    transition: all 0.4s ease 0s;
}
.widget{
    margin-bottom: 30px;
}
.menu li, .widget_rss li{
    list-style: none;
}
.widget_rss li{
    margin-bottom: 30px;
}
.tagcloud a:hover,.tag a:hover{
background:#3ab3df;
color:#fff;
border: 1px solid #3ab3df;}
/*END BLOG SIDEBAR*/
/*END BLOG SINGLE*/
.comment-section {
  margin-bottom: 50px;
}
.comment-section img {
    width: 80px;
    height: 80px;
    margin-right: 10px;
    border: 2px solid #e8e8e9;
}
.comment_single {
background: #f6f6f6 none repeat scroll 0 0;
box-shadow: 0 11px 10px 0 rgba(0, 0, 0, 0.2);
padding: 20px;
}
.comment_single h5 {
    color: #3ab3df;
    font-weight: 600;
}
.blog-contact{
  background: #f6f6f6 none repeat scroll 0 0;
}
.contact-title {
  border-bottom: 1px solid #e8e8e9;
  margin-bottom: 15px;
  padding: 10px 0;
}
/*17.END BLOG DESIGN*/
/*18.START NEWSLETTER DESIGN*/
.newsletter { background: #f5f5f5 none repeat scroll 0 0 }
.newsletter h3 { padding-top: 15px }
@media only screen and (max-width:480px) { 
    .newsletter h3 { margin-bottom: 20px }
}
.subscribe_input input {
    float: left;
    margin-right: 20px;
    width: 400px;
}
@media only screen and (max-width:768px) { 
    .subscribe_input input {
        float: none;
        margin-bottom: 20px;
        width: 100%;
    }
}
.subscribe_input button {
    background: #3ab3df;
    border: 1px solid #3ab3df;
    color: #fff;
}
.subscribe_input button:hover {
    background: #fff;
    border: 1px solid #fff;
    color: #222;
}
/*18.END NEWSLETTER DESIGN*/
/*19.START PROMOTION DESIGN*/
.buy_now {
    background: #3ab3df;
    padding: 40px 0;
}
.buy_now_title {
    color: #fff;
    font-weight: 600;
    margin: 0;
}
@media only screen and (max-width:480px) { 
    .buy_now_title { letter-spacing: 0px }
}
.btn-promotion-bg {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: 1px solid #3ab3df;
    border-radius: 0;
    box-shadow: 3px 4px 7px rgba(0, 0, 0, 0.25);
    color: #fff;
    margin-left: 100px;
    padding: 10px 30px;
    -webkit-transition: all 0.4s ease 0s;
            transition: all 0.4s ease 0s;
}
@media only screen and (max-width:768px) { 
    .btn-promotion-bg {
        margin-left: 50px;
        margin-top: 0px;
    }
}
@media only screen and (max-width:480px) { 
    .btn-promotion-bg {
        margin-left: 10px;
        margin-top: 20px;
    }
}
.btn-promotion-bg:hover,
.btn-promotion-bg:focus {
    background: #fff;
    border: 1px solid #fff;
    color: #333;
}
/*19.END PROMOTION DESIGN*/
/*20.START CONTACT DESIGN*/
.contact-us { padding-top: 60px }
.single-address {
    background: #58BFE8;
    padding: 30px;
}
.single-address-color {
    background: #3AB3DF;
    padding: 30px;
}
@media only screen and (max-width:768px) { 
    .single-address { padding: 30px 2px }
}
.single-address i {
    border: 1px solid #fff;
    border-radius: 50px;
    color: #fff;
    font-size: 30px;
    height: 70px;
    line-height: 30px;
    padding: 18px;
    text-align: center;
    width: 70px;
    margin-bottom: 20px;
}
.single-address h4 {
    color: #fff;
    margin-bottom: 20px;
}
.single-address p {
    margin-bottom: 0;
    color: #fff;
}

.overlay {
  background: rgba(28, 186, 200, 0.4) none repeat scroll 0 0;
}
.text_white{
color: #fff;
margin-bottom: 60px;
text-transform: uppercase;
}
.contact {
background: rgba(255, 255, 255, 0.8) none repeat scroll 0 0;
padding: 30px;
}
.form-control {
background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
border: 1px solid #ddd;
border-radius: 0;
box-shadow: none;
color: #222;
height: 45px;
transition: all 0.4s ease 0s;
}
.form-control::-moz-placeholder {
    color: #333;
    opacity: 1;
    filter: alpha(opacity=100);
}
.form-control:hover,
.form-control:focus {
    background:#fff;
    border: 1px solid #3ab3df;
    box-shadow: none;
    outline: 0 none;
}
.btn-contact-bg {
background: #3ab3df none repeat scroll 0 0;
border-radius: 0;
box-shadow: 0 11px 10px 0 rgba(0, 0, 0, 0.1);
color: #fff;
font-size: 16px;
padding: 10px 40px;
transition: all 0.4s ease 0s;
text-transform: uppercase;
}
.btn-contact-bg:hover,
.btn-contact-bg:focus {
    background: #fff;
    border: 1px solid #fff;
    color: #222;
}
.mb0{margin-bottom:0;}
.map { height: 450px }
/*20.END CONTACT PAGE DESIGN*/
/*21.START FOOTER DESIGN*/
.footer { background-color: #040E18 }
.footer h3 {
    color: #fff;
    padding-bottom: 30px;
}
.footer_social ul {
    list-style: outside none none;
    margin: 0;
    padding: 0;
}
.footer_social ul li {
    margin: 2px;
    display: inline-block;
}
.footer_social ul li a {
    background: #2e3537 none repeat scroll 0 0;
    border: 1px solid #2e3537;
    box-shadow: 0 0 0 7px transparent;
    color: #aaa;
    display: block;
    font-size: 14px;
    height: 40px;
    line-height: 21px;
    padding: 9px 13px;
    -webkit-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    width: 40px;
}
@media only screen and (max-width:768px) { 
    .footer_social ul li a { font-size: 12px }
}
@media only screen and (max-width:360px) { 
    .footer_social ul li a { font-size: 14px }
}
@media only screen and (max-width:320px) { 
    .footer_social ul li a { font-size: 14px }
}
.footer_social ul li a:hover { color: #fff }
.f_facebook:hover {
    background: #5D82D1;
    box-shadow: 0 0 0 0px #5D82D1;
    border: 1px solid #5D82D1;
}
.f_twitter:hover {
    background: #40BFF5;
    box-shadow: 0 0 0 0px #40BFF5;
    border: 1px solid #40BFF5;
}
.f_google:hover {
    background: #EB5E4C;
    box-shadow: 0 0 0 0px #EB5E4C;
    border: 1px solid #EB5E4C;
}
.f_linkedin:hover {
    background: #238CC8;
    box-shadow: 0 0 0 0px #238CC8;
    border: 1px solid #238CC8;
}
.f_youtube:hover {
    background: #CC181E;
    box-shadow: 0 0 0 0px #CC181E;
    border: 1px solid #CC181E;
}
.f_skype:hover {
    background: #00AFF0;
    box-shadow: 0 0 0 0px #00AFF0;
    border: 1px solid #00AFF0;
}
.footer-bottom {
    background: #09121B;
    padding: 20px 0;
}
.footer_copyright p {
    color: #fff;
    font-size: 16px;
    margin-bottom: 0;
}
.footer_copyright span { color: #3ab4df }
/*21.END FOOTER DESIGN*/

.device_img img {
    width: 100%;
    height: Auto;
}
@media (min-width: 768px){
    .navbar-right .dropdown-menu .dropdown-menu {
        right: auto;
        left:  100% !important;
        top: 0px;
    }
}