/* ----------------------------------------------------
Theme Name:		WeBuilders - HTML & Bootstrap Template
Version:		1.0.0
Author:			WeBuilders
------------------------------------------------------- */

/* ======================================================
	TABLE OF CONTENTS
   ====================================================== */

/**

* 1.0	Settings
* 1.1	Header
* 1.2	Home
* 1.3	Progress Blocks
* 1.4	Banners
* 1.5	Our Services
* 1.6	Why Choose Us
* 1.7	Our Team
* 1.8	Newsletter
* 1.9	Our Gallery	
* 1.10	Testimonials
* 1.11	Companies Logo
* 1.12	Contact Us
* 1.13	Map
* 1.14	Footer

**/

/* -----------------------------------------------------
	1.0		Settings
   ----------------------------------------------------- */

.loader {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: url(../images/loader.gif) center no-repeat #fff;
}

p {
    color: grey;
}

.page-heading h1 {
    color: #4d4d4d;
}

.page-heading h1 > span {
    color: #EC5A27;
}

.page-heading p {
    color: #4d4d4d;
}

.page-heading::after {
    background-color: #EC5A27;
}

.heading-info::after {
    background: #30b34e;
}

.my-btn {
    background: #EC5A27;
    color: white;
    border: 0px;
}

.my-btn:focus {
    color: #4d4d4d;
}

.my-btn:hover {
    background: #4d4d4d;
    color: #EC5A27;
}

/* -----------------------------------------------------
	1.1		Header
   ----------------------------------------------------- */

header #header-top {
    background-color: #112134;
}

#header-top .fa {
    color: #EC5A27;
}

#header-top #info ul {
    color: #f2f2f2;
}

#mynavbar {
    border-radius: 0px;
    border: 0;
    background: white;
}

.navbar-default .navbar-nav li a {
    color: #4d4d4d;
}

.navbar-default .navbar-nav > li > a:hover {
    color: #EC5A27;
}

.navbar-default .navbar-nav > li.active > a {
    background-color: #EC5A27;
    color: white;
}

.navbar-default .navbar-nav .active > a,
.navbar-default .navbar-nav .active > a:hover,
.navbar-default .navbar-nav .active > a:focus {
    background: #EC5A27;
    color: white;
}

.navbar-custom.affix {
    box-shadow: 0px 2px 5px lightgrey;
}

#mynavbar .navbar-toggle {
    background: #EC5A27;
    border: 0;
}

#mynavbar .navbar-toggle span {
    background: white;
}

@media (max-width: 768px) {
    .navbar-nav {
        background: #EC5A27;
    }

    #mynavbar li a {
        color: white;
        border-bottom: 1px solid #ffd666;
    }

    #mynavbar .navbar-nav > li > a:hover {
        color: #EC5A27;
        background: white;
    }

    #mynavbar .navbar-nav > li.active > a {
        background-color: white;
        color: #EC5A27;
    }

    #mynavbar .navbar-nav .active > a,
    #mynavbar.navbar-nav .active > a:hover,
    #mynavbar .navbar-nav .active > a:focus {
        background: #EC5A27;
        color: white;
    }

    #mynavbar .navbar-collapse {
        border-color: #ffd666;
    }
}

/* -----------------------------------------------------
	1.2		Home
   ----------------------------------------------------- */

#home {
    background: linear-gradient(rgba(10, 20, 41, 0.5), rgba(10, 20, 41, 0.5)),
        url("home.jpg") center center;
    background-size: cover;
    background-position: center;
}

#home .home-text,
#home .home-text p {
    color: white;
}

#home .home-form .text {
    background: white;
}

#home .home-form h1 {
    color: #EC5A27;
}

#home .home-form form .form-headings {
    background: rgba(10, 20, 41, 0.5);
    color: white;
}

#home .home-form form .form-headings p {
    color: white;
}

#home .home-form form .form-inputs {
    background: rgba(10, 20, 41, 0.5);
}

#home .home-form form input,
#home .home-form form .btn {
    border-radius: 0px;
    box-shadow: none;
}

#home .home-form form input:focus {
    border-color: #EC5A27;
}

#home .home-form form .btn {
    background: #EC5A27;
    color: #222;
    border-color: #222;
}

/* -----------------------------------------------------
	1.3		Progress Blocks
   ----------------------------------------------------- */

#progress {
    background: #0a1429;
    color: white;
}

#progress .progress-block .icon .fa {
    color: #EC5A27;
}

#progress .progress-block .progress-text p {
    color: #f2f2f2;
}

#progress #block-2 {
    background: rgba(20, 39, 82, 0.4);
}

/* -----------------------------------------------------
	1.4		Banners
   ----------------------------------------------------- */

#banner-1 {
    background: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)),
        url("../images/banner-1.jpg");
    background-position: center;
    background-size: cover;
    color: white;
}

#banner-1 .banner-text {
    background: #EC5A27;
    color: #333;
}

#banner-1 .banner-text p {
    color: #4d4d4d;
}

#banner-1 .banner-text .btn {
    background: #4d4d4d;
    color: white;
    border: 0;
}

#banner-1 .banner-text .btn:focus {
    background: #4d4d4d;
    color: white;
}

#banner-2 {
    background: linear-gradient(rgba(10, 20, 41, 0.9), rgba(10, 20, 41, 0.9)),
        url("../images/banner-2.jpg") center center;
    background-size: cover;
    color: white;
    background-position: center;
}

#banner-2 .highlight-box .fa {
    color: #EC5A27;
}

#banner-3 {
    background: linear-gradient(rgba(10, 20, 41, 0.9), rgba(10, 20, 41, 0.9)),
        url("../images/banner-3.jpg") center center;
    background-size: cover;
    color: white;
    background-position: center;
}

#banner-3 .page-heading h1 {
    color: white;
}

#banner-3 .banner-text p {
    color: white;
}

#banner-3 .banner-text .btn:hover {
    color: #EC5A27;
}

#banner-3 .banner-text .btn:focus {
    background: #EC5A27;
    color: white;
}

#banner-4 {
    background: linear-gradient(rgba(10, 20, 41, 0.9), rgba(10, 20, 41, 0.9)),
        url("../images/banner-4.jpg") center center;
    background-size: cover;
    color: white;
}

/* -----------------------------------------------------
	1.5		Our Services
   ----------------------------------------------------- */

.service-block .service-icon .fa {
    color: #EC5A27;
}

.service-block:hover .service-icon .fa {
    transform: rotate(360deg);
    color: #4d4d4d;
}

.service-block:hover .service-info h4 {
    color: #EC5A27;
}

/* -----------------------------------------------------
	1.6		Why Choose Us
   ----------------------------------------------------- */

#why .why-text .why-us-block .why-icon .fa {
    color: white;
    background: #EC5A27;
    border-radius: 100%;
}

/* -----------------------------------------------------
	1.7		Our Team
   ----------------------------------------------------- */

.member-block .member-image img {
    border: 4px solid transparent;
    border-radius: 0px;
}

.member-block:hover .member-image,
.member-block:hover .member-image img {
    transition: 0.9s;
}

.member-block:hover .member-image img {
    transform: scale(1.1);
}

.member-block .mask {
    background: rgba(0, 0, 0, 0.7);
}

.member-block:hover .mask {
    opacity: 1;
    transform: translateX(0%);
}

.member-block .member-image .mask a {
    color: #EC5A27;
}

.member-block .member-image .mask a:hover {
    color: white;
}

.member-info .member-name {
    color: #EC5A27;
}

.member-info .member-cat {
    color: #4d4d4d;
}

#owl-team .owl-controls .owl-buttons div {
    border-radius: 0px;
    background: none;
    color: grey;
    border: 0;
}

#owl-team .owl-controls .owl-buttons div:hover {
    background: #4d4d4d;
    color: white;
}

/* -----------------------------------------------------
	1.8		Newsletter
   ----------------------------------------------------- */

#newsletter {
    background: linear-gradient(rgba(255, 187, 2, 0.9), rgba(255, 187, 2, 0.9)),
        url("../images/newsletter.jpg") center center;
    background-size: cover;
}

#newsletter .fa {
    color: white;
    border-radius: 100%;
    background-color: #404040;
}

#newsletter h1 {
    color: #404040;
}

#newsletter .subscribe-line {
    color: #4d4d4d;
}

#newsletter form {
    border-top: 1px solid white;
}

#newsletter form input {
    border: 0px;
    border-radius: 0px;
    box-shadow: none;
}

#newsletter form .btn {
    border-radius: 0px;
    border-color: white;
    background-color: #3e454c;
    color: white;
}

/* -----------------------------------------------------
	1.9		Our Gallery
   ----------------------------------------------------- */

.gallery-block .gallery-image {
    box-shadow: 0px 0px 22px 0px #bbbbbb;
    border: 1px solid lightgrey;
}

.gallery-block:hover .image-mask {
    background: rgba(0, 0, 0, 0.3);
}

.gallery-block:hover img {
    transform: scale(1.2) rotate(5deg);
}

/* -----------------------------------------------------
	1.10	Testimonials
   ----------------------------------------------------- */

#owl-testimonial .item blockquote {
    color: grey;
    border-left: 0px;
}

#owl-testimonial .item blockquote::before {
    color: #EC5A27;
}

#owl-testimonial .item blockquote small {
    color: #EC5A27;
}

#owl-testimonial .owl-controls .owl-pagination .owl-page span {
    background: black;
}

#owl-testimonial .owl-controls .owl-pagination .owl-page:hover span {
    background: #EC5A27;
}

#owl-testimonial .owl-controls .owl-pagination .owl-page.active span {
    background: #EC5A27;
}

/* -----------------------------------------------------
	1.11	Companies Logo
   ----------------------------------------------------- */

#company-logo {
    background: #EC5A27;
}

#company-logo h1,
#company-logo p {
    color: #333;
}

/* -----------------------------------------------------
	1.12	Contact Us
   ----------------------------------------------------- */

#contact {
    background: linear-gradient(
            rgba(255, 255, 255, 0.9),
            rgba(255, 255, 255, 0.9)
        ),
        url("../images/contact.jpg") center center;
    background-size: cover;
    background-position: center;
}

#contact #contact-form input,
#contact #contact-form textarea,
#contact #contact-form .btn {
    border-radius: 0px;
    box-shadow: none;
}

#contact #contact-form input:focus,
#contact #contact-form textarea:focus {
    border-color: #EC5A27;
}

#contact #contact-form .btn {
    background: #EC5A27;
    border-color: #EC5A27;
    color: white;
}

#contact #addresses .address-text-icon .fa {
    color: #EC5A27;
}

#contact #addresses .address-text-icon a {
    color: #EC5A27;
}

/* -----------------------------------------------------
	1.13	Map
   ----------------------------------------------------- */

.map {
    border: 0;
}

.map iframe {
    border: 0;
}

/* -----------------------------------------------------
	1.14	Footer
   ----------------------------------------------------- */

#footer {
    background: #112134;
    color: white;
}

#footer .social-links li .fa {
    color: #EC5A27;
}

#footer .copyright p {
    color: white;
}

#footer .copyright a {
    color: #EC5A27;
}

#footer .social-links li .fa:hover {
    color: white;
}
