﻿/*   
Template Name: MA Red Theme
Version: 1.0.0
-------------------------------------------
::  1.0 
*/

/* fill window with background */
.home {
    width: auto !important;
}
/* make area fill the page */
#home {
    padding: 0;
    width: 100%;
    height: 580px;
    /*margin-left: 200px;*/
    /*margin-right: -10px;*/
    z-index: 100;
}
/* remove background (olive green) that style.css is adding */
.content.has-bg .content-bg:before {
    background: none;
}

#content {
    padding: 0;
    margin: 0;
    margin-left: 0;
}

#ma-main-content-body {
    padding: 0;
    margin: 0;
}

    #ma-main-content-body .panel-body {
        padding: 0;
    }

#ma-content-container {
    padding: 0;
    margin: 0;
}

.breadcrumb {
    padding-left: 10px;
    padding-right: 10px;
}
/* hide the breadcrumb, page title */
.breadcrumb-container,
.ma-page-header {
    display: none;
    height: 0;
}

#page-container {
    background-image: none;
}
/* use overlay to darken image */
.ma-overlay {
    position: relative;
    transition: all 1s;
}

    .ma-overlay:after {
        content: '\A';
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        background: rgba(255,255,255,0.3);
        opacity: 1;
        transition: all 0.5s;
        -webkit-transition: all 0.5s;
        -moz-transition: all 0.5s;
    }

    .ma-overlay:hover:after {
        opacity: 0;
    }

.footer {
    padding-top: 15px;
    background-color: #fff;
    box-shadow: none;
}

.page-sidebar-fixed .footer {
    margin: 0 2px 0 222px;
}

.page-sidebar-minified .footer {
    margin-left: 62px;
}

.milestone .number {
    background: rgba(0,0,0,0.6);
}

.home-content {
    width: 99%; /* so the edges will not be covered by the scrollbar */
}

    .home-content h3 {
        color: #fff;
        margin-bottom: 0px;
        margin-top: 30px;
        font-weight: 300;
    }

    .home-content p {
        margin-bottom: 10px;
    }

.ma-home-btn:hover {
    background-color: #698EAE !important;
}

.ma-home-btn {
    width: 200px;
    margin-bottom: 5px; /* so they will not be on top of each other for smaller screens */
}
/*.content-bg img {
    max-width: none !important;
}*/
.ma-home-content-bg img {
    width: 100% !important;
    height: 700px !important;
}

.ma-content {
    padding-top: 10px;
    padding-bottom: 0;
    margin-top: 18px;
}

.ma-home-content-header {
    margin-top: -30px;
    padding-top: 0px;
    padding-bottom: 0px;
    /*box-shadow: 2px 2px 2px #666666;*/
    /*background: #330000;*/
}

.ma-home-content-subheader {
    margin-top: -10px;
    /*box-shadow: 2px 2px 2px #666666;*/
}
/*TODO: Will go back to these when there is time */
@media (min-width: 1501px) {
    .container {
        width: 1170px;
        padding-top: 50px;
    }
}

@media (min-width: 992px) and (max-width: 1500px) {
    .ma-home-content-subheader {
        /*margin-top: 230px;*/
    }

    .ma-home-btn:first-of-type {
        margin-left: 10px;
    }

    .container {
        width: auto;
        padding-top: 50px;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .ma-home-content-subheader {
        /*margin-top: 230px;*/
    }

    .ma-home-btn:first-of-type {
        margin-left: 10px;
    }

    .container {
        width: auto;
        padding-top: 50px;
    }
}

@media (max-width: 767px) {
    .ma-home-content-subheader {
        /*margin-top: 200px;*/
    }

        .ma-home-content-subheader h3 {
            margin-bottom: 10px;
        }

    .ma-home-content-subheader-desc {
        display: none;
    }

    .ma-home-content-subheader-footer-link {
        display: none;
    }

    .ma-home-btn:first-of-type {
        margin-left: 15px;
    }
}

.cred {
    /*color: #ff4d4d;*/
    color: #cc0000;
}

.chighlight {
    /*color: #53A9A9;*/
    color: #3b7878;
}
