@import url(../css/MyFontsWebfontsKit.css);

/* CSS Document */


.body2 {
    /*background-image: url(../img/body-bg.png);*/
    background-repeat: no-repeat;
    background-size: cover;
    background-position-y: 284px;
    background: linear-gradient(110deg, #fdcd3b 60%, #ffed4b 60%);
}

body {
    height: 100vh;
    /*width: 100vw;*/
    background-image: linear-gradient(190deg, #FABD00 40.00%, #c12637 40.00%, #c12637 66.66%, #006F7A 66.66%);
    /*background-image: linear-gradient(90deg, red 33.33%, white 33.33%, white 66.66%, blue 66.66%);*/
    background-size: 100% 100%;
    background-repeat: no-repeat;
    margin: 0px;
}


.logo {
        z-index: 2;
        position: relative;
}

.nav {
        background: #333;
}

.navbar {
        /*background-color: #fff !important;
        border-color: #fff !important;*/
}

.navbar-collapse {
        border-top: none !important;
}

.navbar-nav {
        float: right;
        margin-top: 9px;
}

.container .navbar-nav > li > a {
    color: #ffc300;
    font-size: 18px;
}


.container .navbar-nav > li > a:hover {
    color: #ffc300;
}


.navbar-default .navbar-nav > .active > a:hover {background-color:#333;color:#fff;}


.container .navbar-nav > .active > a {
    border-radius: 5px;
    background-color: #333;
    color:#fff;
}




.navbar {
        margin-bottom: 0;
}

hr {
        border-top: 2px solid #006F7A;
}

h2 {color:#ffffff;}

.lead {
    color: #006F7A;
}

.banner-image-container {
        position: relative;
}

.banner-caption {
        position: absolute;
        bottom: 8%;
        left: 70%;
}

.caption-red {
        background: #006F7A;
        padding: 5px;
        font-size: 18px;
        font-weight: 700;
        text-transform: uppercase;
        color: #fff;
}

.caption-yellow {
    background: #fabd00;
    padding: 5px;
    font-size: 18px;
    font-weight: 700;
    text-transform: uppercase;
    color: #006F7A;
}

.content {
        padding-top: 35px;
        padding-bottom: 35px;
		margin-bottom: 25px;
}

.top-banner {
        width: 100%;
}

/*.btn-primary {
    color: #ffc300;
    background-color: #333333;
    display: block;
    width: 100%;
    font-size: 18px;
	border-color: transparent !important;
}

.btn-primary:hover {
    color: #ffc300;
    background-color: #212121;
    border-color: transparent !important;
}

.btn-primary:visited, .btn-primary:focus  {
    color: #ffc300;
    background-color: #333333;
    display: block;
    width: 100%;
    font-size: 18px;
	border-color: transparent !important;
}*/

.social-box {background:#0bb4f7;padding: 17px 30px;margin-top: 20px;}

.social-box p {color:#fff;}

.social-heading {
	text-transform: uppercase;
	font-weight:bold;
    color: #fff;}

.social-heading i {
	font-size: 21px;
    margin-left: 8px;}	
	
.social-btn-top {display:block; width:100%;margin-bottom:5px;background:#fff;}

.social-btn-top i {
    color: #0576bc;
    font-size: 27px;
    float: right;
}

.social-btn-bottom {display:block; width:100%;background:#0071bd}

.social-btn-bottom i  {
    color: #fff;
    font-size: 27px;
    float: right;
}

.social-btn-top-text {color:#0071bd;font-size: 18px; margin-left: 11px;}

.social-btn-bottom-text {color:#fff;font-size: 18px;}

	
.diagonal-bottom {
        background-size: cover;
        background-repeat: no-repeat;
}

.diagonal-bottom-content {
        margin-top: 75px;
        padding-bottom: 16px;
}

.diagonal-bottom-content h2 {
        color: #fff;
}

.diagonal-bottom-content h4 {
        color: #fff;
}

.diagonal-bottom-content p {
        color: #fff;
}

.home-shape-bottom {
	    background-image: url(../img/red-diagonal.png);
		padding:20px 0;
}

.about-shape-bottom {
        background-image: url(../img/blue-diagonal.png);
}



footer {
        background: #fff;
}

footer p {font-size: 12px;}

.council-logo {
        margin-top: 23px;
}

@media (min-width:992px) {
	
	
.navbar-nav {
    margin-top: 12px;
}

.logo {
    top: 7px;
}

	
        .top-banner {
                margin-top: -6%;
        }
		
		
.home-bubble {margin-top:-175px;}		
		
}

@media (max-width:991px) {
        .top-banner {
                margin-top: 0;
        }
}

@media (min-width:768px) and (max-width:991px) {
        .navbar-nav {
                float: left;
        }
}

@media (min-width:768px) {
        .council-logo {
                float: right;
        }

        .navbar-nav > li > a {
                padding-top: 8px;
                padding-bottom: 8px;
        }
}

@media (max-width:768px) {
        .navbar-nav {
                float: none;
        }

        body {
                background: #fff;
                background-image: none;
        }

        .top-banner {
                height: auto;
        }

        .banner-caption {
                position: relative;
                left: 0;
                margin-bottom: 30px;
                bottom: 0;
                border-bottom: 3px solid #fff;
                background: #fff;
        }

        .banner-image-container {
                position: relative;
                background: #fff;
        }

    .caption-red {
        background: #006F7A;
        padding: 5px 10px;
        font-size: 18px;
        font-weight: 700;
        text-transform: uppercase;
        color: #fff;
    }

        .caption-yellow {
                padding: 5px 10px;
        }

        .council-logo {
                width: 284px;
        }
}

@media (max-width:580px) {
        .banner-caption {
                margin-bottom: 0;
                border-bottom: 0 solid #fff;
        }

        .content {
                padding-top: 0;
                padding-bottom: 0;
        }
}