body {
    background-color: #ffffff;
}


.headerlogo{
    height:150px;
    width: 100%;
    background-color: #ffffff;
}

.imagediv {
    margin-right: 50px;
}

#headerImg{
   margin:70px auto;
   background: url(../images/mg.jpg);
   background-size:cover;
   border-bottom: solid 10px;
   border-color: rgba(187, 33, 59, 1.00);
   height:290px;
}

.navbar-default {
    padding: 10px;
    padding-left: 90px;
    padding-bottom: 20px;
    background-color: #1D3C4C;
    border-color: transparent;
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: bold;
    font-size: large;
    height: 70px;
}

    .navbar-default .navbar-nav > li > a:focus .caret {
        transform: rotate(-180deg);
        transition: all 0.3s ease-in-out;
        //for smoothness;
    }

@media only screen and (max-width:765px) {
    .navbar-default {
        padding: 15px;
        margin-bottom: 100px;
    }
}

.navbar-default .navbar-nav > ul {
    margin: 50px;
    color: #ffffff;
}

.navbar-default .navbar-nav > li > a {
    color: #ffffff;
}

    .navbar-default .navbar-nav > li > a:hover,
    .navbar-default .navbar-nav > li > a:focus {
        color: yellow;
        font-size: x-large;
    }


.navbar-default .navbar-nav > .active > li {
    color: yellow;
    background-color: transparent;
    font-size: x-large;
}

@media only screen and (max-width:765px) {
    .navbar-default .navbar-nav > .active > li {
        color: yellow;
        background-color: #1D3C4C;
        font-size: large;
    }
}

.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
    color: yellow;
    background-color: transparent;
    font-size: x-large;
}

@media only screen and (max-width:765px) {
    .navbar-default .navbar-nav > .active > a,
    .navbar-default .navbar-nav > .active > a:hover,
    .navbar-default .navbar-nav > .active > a:focus {
        color: yellow;
        background-color: #1D3C4C;
        font-size: large;
        padding: 15px;
    }
}


.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus {
    color: yellow;
    background-color: transparent;
}

.navbar-default .navbar-nav > .dropdown > a .caret {
    border-top-color: #ffffff;
    border-bottom-color: #ffffff;
}

.navbar-default .navbar-nav > .dropdown > a:hover .caret,
.navbar-default .navbar-nav > .dropdown > a:focus .caret {
    border-top-color: #ffffff;
    border-bottom-color: #fff;
}

.navbar-default .navbar-nav > .open > a .caret,
.navbar-default .navbar-nav > .open > a:hover .caret,
.navbar-default .navbar-nav > .open > a:focus .caret {
    border-top-color: yellow;
    border-bottom-color: yellow;
}



.navbar-brand {
    padding: 0px;
}

    .navbar-brand > img {
        height: 100%;
        padding: 15px;
        width: auto;
    }

@media only screen and (max-width:765px) {
    .navbar-brand {
        padding: 5px;
    }


        .navbar-brand > img {
            height: 50px;
            width: 50%;
            padding: 15px;
            width: auto;
        }
}

.navbar-default .navbar-toggle {
    border-color: none;
    margin-top: 0px;
    background: #1D3C4C;
}

    .navbar-default .navbar-toggle:hover,
    .navbar-default .navbar-toggle:focus {
        background-color: rgba(187, 33, 59, 1.00);
    }

    .navbar-default .navbar-toggle .icon-bar {
        background-color: #ffffff;
    }


.navbar-default .navbar-nav > .dropdown > ul {
    background-color: #1D3C4C;
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: bold;
    font-size: medium;
    color: #fff;
}

.navbar-default .navbar-nav .open .dropdown-menu > li > a {
    background-color: #357A97;
    color: #ffffff;
}

    .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover {
        background-color: transparent;
        color: yellow;
    }

@media only screen and (max-width: 766px) {
    .collapsing, .in {
        margin-top: 10px;
        width: 100%;
        background-color: #1D3C4C;
    }

        .collapsing ul li a, .in ul li a {
            color: #fff !important;
        }

            .collapsing ul li a:hover, .in ul li a:hover {
                color: yellow !important;
            }
}



.carouselmatter {
    margin-left: 20px;
    margin-top: 65px;
    height: 400px;
    width: 30%;
    padding: 10px;
}

/* MISC */

#homepage-feature {
    -webkit-box-shadow: 0px 11px 11px -4px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 11px 11px -4px rgba(0,0,0,0.75);
    box-shadow: 0px 11px 11px -4px rgba(0,0,0,0.75);
    margin: 0px auto;
    width: 100%;
    margin-top: 50px;
}


    #homepage-feature .item {
        overflow: hidden;
        margin: 0px auto;
        background-color: transparent;
        background-size: cover;
        height: 495px;
    }

    #homepage-feature > .carousel-control {
        width: 30px;
        font-size: 40px;
        color: #fff;
        text-shadow: none;
        filter: none;
        opacity: 1;
    }

        #homepage-feature > .carousel-control span {
            position: absolute;
            top: 50%;
            margin-top: 30px;
            width: 100%;
            text-align: center;
            display: block;
        }

.animBounceIn {
    animation-delay: 0.3s;
    -webkit-animation-delay: 0.3s;
    -moz-animation-delay: 0.3s;
    -o-animation-delay: 0.3s;
    -moz-transition: none !important;
}

.animRotateIn {
    animation-delay: 0.6s;
    -webkit-animation-delay: 0.6s;
    -moz-animation-delay: 0.6s;
    -o-animation-delay: 0.6s;
    -moz-transition: none !important;
}

.animZoomIn {
    animation-delay: 0.9s;
    -webkit-animation-delay: 0.9s;
    -moz-animation-delay: 0.9s;
    -o-animation-delay: 0.9s;
    -moz-transition: none !important;
}

.animLighSpeed {
    animation-delay: 1.2s;
    -webkit-animation-delay: 1.2s;
    -moz-animation-delay: 1.2s;
    -o-animation-delay: 1.2s;
    -moz-transition: none !important;
}

animTada {
    animation-delay: 3s;
    -webkit-animation-delay: 3s;
    -moz-animation-delay: 3s;
    -o-animation-delay: 3s;
    -moz-transition: none !important;
}

animJello {
    animation-delay: 3s;
    -webkit-animation-delay: 3s;
    -moz-animation-delay: 3s;
    -o-animation-delay: 3s;
    -moz-transition: none !important;
}


.p-finance {
    font-family: 'Patua One', cursive;
    font-weight: bold;
    font-size: x-large;
    color: yellow;
    text-shadow: -2px 0px 4px rgba(5, 5, 5, 0.77);
}

.finheadfont {
    font-family: 'Michroma', sans-serif;
    font-size: 30px;
    color: white;
    text-shadow: -2px 0px 4px rgba(5, 5, 5, 0.77);
    line-height: 95%;
    letter-spacing: 2px;
}

.hkheadfont {
    font-family: 'Michroma', sans-serif;
    font-size: 30px;
    color: white;
    text-shadow: -2px 0px 4px rgba(5, 5, 5, 0.77);
    line-height: 95%;
    letter-spacing: 2px;
}


.isheadfont {
    font-family: 'Michroma', sans-serif;
    font-size: 30px;
    color: white;
    text-shadow: -2px 0px 4px rgba(5, 5, 5, 0.77);
    line-height: 95%;
    letter-spacing: 2px;
}


.rcheadfont {
    font-family: 'Michroma', sans-serif;
    font-size: 25px;
    color: white;
    text-shadow: -2px 0px 4px rgba(5, 5, 5, 0.77);
    line-height: 95%;
    letter-spacing: 2px;
}

.p-td {
    font-family: 'Patua One', cursive;
    font-weight: bold;
    font-size: x-large;
    color: yellow;
    text-shadow: -2px 0px 4px rgba(5, 5, 5, 0.77);
    text-align: right;
}

.tdheadfont {
    font-family: 'Michroma', sans-serif;
    font-size: 25px;
    color: white;
    text-shadow: -2px 0px 4px rgba(5, 5, 5, 0.77);
    line-height: 95%;
    letter-spacing: 2px;
    text-align: left;
}

.hrstyle {
    border: solid 2px;
    border-color: rgba(187, 33, 59, 1.00);
    line-height: 60%;
}



.headerfont {
    font-family: 'Roboto Condensed', sans-serif;
    text-align: left;
    font-size: 40px;
    font-weight: bold;
    color: #BB213B;
}

@media only screen and (max-width:765px) {
    .headerfont {
        font-family: 'Roboto Condensed', sans-serif;
        text-align: left;
        font-size: 25px;
        font-weight: bold;
        color: #BB213B;
    }
}

.contentfont {
    font-family: 'Quicksand', sans-serif;
    text-align: justify;
    font-size: large;
    font-weight: bold;
    line-height: 190%;
    padding-bottom: 20px;
    padding-top: 10px;
    color: white;
    padding-right: 20px;
}

@media only screen and (max-width:765px) {
    .contentfont {
        font-family: 'Quicksand', sans-serif;
        text-align: justify;
        font-size: 15px;
        line-height: 140%;
        color: white;
        padding: 5px;
    }
}


/*MULTI ITEM CAROUSEL*/
/* override position and transform in 3.3.x */
#myCarousel .carousel-inner .item.left.active {
    transform: translateX(-33%);
}

#myCarousel .carousel-inner .item.right.active {
    transform: translateX(33%);
}

#myCarousel .carousel-inner .item.next {
    transform: translateX(33%);
}

#myCarousel .carousel-inner .item.prev {
    transform: translateX(-33%);
}

#myCarousel .carousel-inner .item.right,
#myCarousel .carousel-inner .item.left {
    transform: translateX(0);
}


#myCarousel .carousel-control.left,
#myCarousel .carousel-control.right {
    background-image: none;
}

#footerback {
    width: 100%;
    height: 100%;
    background-color: #1D3C4C;
    border-top: solid 20px;
    border-color: rgba(187, 33, 59, 1.00);
}

.foot1col {
    width: 100%;
    margin: 30px auto;
}

.sidenav {
    height: 100%;
    width: 100%;
    z-index: 1;
    margin: 10px auto;
}

    .sidenav a {
        text-decoration: none;
        color: white;
        display: inline-block;
        font-family: 'Quicksand', sans-serif;
        text-align: center;
        font-size: medium;
        font-weight: bold;
        color: #83c7e2;
        padding-right: 20px;
    }

        .sidenav a:hover, .offcanvas a:focus {
            color: yellow;
        }

@media only screen and (max-width:765px) {
    .sidenav a {
        text-decoration: none;
        color: white;
        font-family: 'Quicksand', sans-serif;
        text-align: left;
        font-size: medium;
        color: #83c7e2;
        padding-right: 20px;
    }
}

.photopanel {
    height: 160px;
    padding: 10px;
    margin: 0px auto;
    background-color: rgb(73, 135, 161);
    -webkit-box-shadow: 10px 10px 5px -5px rgba(0,0,0,0.75);
    -moz-box-shadow: 10px 10px 5px -5px rgba(0,0,0,0.75);
    box-shadow: 10px 10px 5px -5px rgba(0,0,0,0.75);
    border-radius: 10px 10px 10px 10px;
    -moz-border-radius: 10px 10px 10px 10px;
    -webkit-border-radius: 10px 10px 10px 10px;
    border: 0px solid #000000;
}

.foottexthead1 {
    font-family: 'Roboto Condensed', sans-serif;
    font-size: x-large;
    font-weight: bold;
    text-align: left;
    color: yellow;
    line-height: 50%;
    padding-bottom: 20px;
    text-align: center;
}

.foottextnormal {
    font-family: 'Quicksand', sans-serif;
    text-align: justify;
    font-size: large;
    font-weight: bold;
    color: white;
    line-height: 80%;
}

@media only screen and (max-width:765px) {
    .foottextnormal {
        font-family: 'Quicksand', sans-serif;
        text-align: justify;
        font-size: medium;
        font-weight: bold;
        color: white;
        line-height: 80%;
    }
}

.leftaddressdiv {
    padding: 15px;
}

#formarea {
    background-color: rgba(187, 33, 59, 1.00);
    height: 525px;
    width: 480px;
}

.iframe-rwd {
    margin-top: 5px;
    position: relative;
    padding-bottom: 65.25%;
    overflow: hidden;
}



.btn-circle {
    width: 30px;
    height: 30px;
    text-align: center;
    padding: 6px 0;
    font-size: 12px;
    line-height: 1.428571429;
    border-radius: 15px;
}



.divServices {
    height: 110px;
    background-color: rgb(47, 73, 83);
    margin-top: -15px;
    padding-top: 15px;
    display: block;
    -webkit-box-shadow: 0px -5px 7px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px -5px 7px 0px rgba(0,0,0,0.75);
    box-shadow: 0px -5px 7px 0px rgba(0,0,0,0.75);
}

    .divServices:hover {
        background-color: rgb(187, 33, 59);
        margin-top: -25px;
        height: 120px;
    }



@media only screen and (max-width:765px) {
    .divServices {
        background-color: rgb(49, 100, 121);
        height: 110px;
        border: none;
        box-shadow: none;
    }

        .divServices:hover {
            background-color: rgb(187, 33, 59);
            margin-top: -15px;
            height: 110px;
        }
}

.divServices1 {
    height: 110px;
    background-color: rgb(49, 100, 121);
    padding-top: 15px;
    margin-top: -15px;
    display: block;
    -webkit-box-shadow: 0px -5px 7px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px -5px 7px 0px rgba(0,0,0,0.75);
    box-shadow: 0px -5px 7px 0px rgba(0,0,0,0.75);
}

    .divServices1:hover {
        background-color: rgba(187, 33, 59, 1.00);
        margin-top: -25px;
        height: 120px;
    }


@media only screen and (max-width:765px) {
    .divServices1 {
        background-color: rgb(53, 122, 151);
        height: 110px;
        border: none;
        box-shadow: none;
    }

        .divServices1:hover {
            background-color: rgb(187, 33, 59);
            margin-top: -15px;
            height: 110px;
        }
}

@media only screen and (max-width:765px) {
    .divServicesContainer {
        margin-top: 90px;
    }
}

.ImgServices {
    margin: 0px auto;
}

.ServiceFonts {
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 15px;
    color: white;
    letter-spacing: 3px;
    text-align: center;
    line-height: 10%;
}

#backimg {
    width: 100%;
    height: 100%;
    z-index: -99;
    background: url(../images/aboutbackimg.jpg);
    margin-top: 70px;
}

@media only screen and (max-width:765px) {
    #backimg {
        width: 100%;
        height: 100%;
        z-index: -99;
        background: #1D3C4C;
        margin-top: 70px;
        padding: 5px;
    }
}


#aboutbody {
    margin-top: 50px;
    width: 100%;
    height: 500px;
    z-index: 100;
}

#MissionBack {
    background-color: #313131;
    padding-top: 30px;
    padding-bottom: 20px;
    border-top: solid 5px;
    border-bottom: solid 5px;
    border-color: rgb(187, 33, 59);
}

#MissionImg {
    padding-left: 50px;
    padding-top: 5px;
}

@media only screen and (max-width:765px) {
    #MissionImg {
        padding-left: 0px;
        padding-top: 5px;
        padding-bottom: 15px;
        height: 60%;
        width: 60%;
    }
}



#MissionContent {
    border-left: solid 5px;
    border-color: rgb(187, 33, 59);
}



.MissionFont {
    font-family: Georgia, 'Times New Roman', Times, serif;
    color: white;
    font-style: italic;
    font-size: 20px;
    text-align: justify;
    line-height: 130%;
    color: #83c7e2;
}

ul {
    list-style-type: square;
    list-style-position: outside;
    list-style-image: none;
}


@media only screen and (max-width:765px) {
    #commitmentDiv {
        padding: 20px;
    }
}

.logocontain{
    height:150px;
    background-color:blue;
    margin:10px;

}
