/*
Theme Name: OPA
Author: Manvitha Vaduguru
*/

@import url(https://fonts.googleapis.com/css?family=Open+Sans:400italic);

body{
    background: #fff;
    color: #666;
}

#logo-container{
    background-color: #00274c;
}

#main-page{
    margin-bottom: 40px;
}
#menu-container{
    /*background-color: #325A86;*/
    background-color: #00274c;
    color: #fff;
}
#menu-main-navigation .current-menu-item a{
    font-weight: bold;
}


.bg-blue {
    /*background-color: #325A86!important;*/
    background-color: #00274c!important;
}
.navbar-light .navbar-nav .nav-link {
    color: #fff!important;
    /*color: #ffffff!important;*/
    font-weight: 600;
}

.navbar-light .navbar-toggler {
    border-color: rgb(255,203,11);
}

.navbar-light .navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255,203,11, 0.7)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}


nav.navbar li.current-menu-item,
nav.navbar li.current-page-item{
    border-bottom: 3px solid #ffcb0b;
}


nav.navbar li ul.sub-menu li.current-menu-item a,
nav.navbar li ul.sub-menu li.current-page-item a{
    background-color: #ffcb0b!important;
    color: #00274c!important;
    /*border-bottom: 3px solid #ffcb0b!important;*/
}
#xnavbarSupportedContent{max-width:1110px;text-align:center;margin:0 auto 0 auto;}
#xmenu-main-menu{max-width:1110px;text-align:center;}

/*
Page Main Content
 */
#main{
    margin-left: -15px;
    margin-right: -15px;
    margin-bottom: 100px;
}

/*Page Header*/

.page-header{
    margin: 0 auto 40px;
    padding: 20px 0;
    background-color: #F7F7F7;
    border: 0;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
}
.page-header-title{
    display: block;
    font-size: 2em;
    text-transform: capitalize;
    font-weight: 400;
    margin: 0;
    /*color: #325A86;*/
    color: #00274c;
}

#content-wrap .content-area{
    width: 100%!important;
    max-width: none!important;
}

.content-area p{
    margin: 0 0 20px;
}

.content-area a{
    color: #587abc
}

#footer-block{
    /*background-color: #325A86;*/
    background-color: #00274c;
    color: #ffffff;
    padding-top: 20px;
    padding-bottom: 20px;
}

#footer-block a{
    color: #ffffff;
}

#footer-block a:hover{
    color: #ffcb0b;
    transition: #ffcb0b 0.3s ease;
    text-decoration: none;
    border-bottom: 1px dotted;
}

@media (min-width: 769px){
    .wrap{
        min-height: calc(100vh - 120px); /*view port height*/
        /*min-height: 100vh; !*view port height*!*/
        /*min-height: calc(100vh - 252px);*/
    }
}



/*
*
*   MAIN MENU STYLING
*
*/
.main-nav   {
    /*height: 30px; !* set to the height you want your menu to be *!*/
}
.main-nav ul    {
    margin: 0;
    padding: 0; /* only needed if you have not done a CSS reset */
    z-index: 100;
}
.main-nav li    {
    display: block;
    float: left;
    line-height: 30px; /* this should be the same as your #main-nav height */
    height: 30px; /* this should be the same as your #main-nav height */
    margin: 0; padding: 0; /* only needed if you don't have a reset */
    position: relative; /* this is needed in order to position sub menus */

}
.main-nav li a  {
    display: block;
    padding: 0 30px 0 30px;
    color: #fff;
}

.main-nav li a:hover  {
    display: block;
    /*padding: 0 30px 0 30px;*/
    color: #fff;
    background-color: #00274c;
}



#menu-main-menu .current-menu-item ul li>a {
    color:  #fff!important;
    background-color: #00274c!important;
}
/*change color of text and background on hover(sub-menu items only)*/
#menu-main-menu li ul li a:hover {
    color:  #00274c!important;
    background-color: #fff!important;
}
/*change color of text and background on hover(sub-menu items only) when parent item is currently active menu item*/
#menu-main-menu .current-menu-item ul li a:hover {
    color:  #00274c!important;
    background-color: #fff!important;
}

.main-nav ul ul { /* this targets all sub menus */
    display: none; /* hide all sub menus from view */
    position: absolute;
    /*left: 30px;*/
    top: 30px; /* this should be the same height as the top level menu -- height + padding + borders */

}
.main-nav ul ul li { /* this targets all submenu items */
    float: none; /* overwriting our float up above */
    width: 300px; /* set to the width you want your sub menus to be. This needs to match the value we set below */
    height: 45px;
    line-height: 35px;
    background: #00274c;
}


.main-nav ul ul li a { /* target all sub menu item links */
    padding: 5px 10px; /* give our sub menu links a nice button feel */
    background: #00274c;
}

.main-nav ul li:hover > ul {
    display: block; /* show sub menus when hovering over a parent */
}

.main-nav ul ul li{
    margin: 0;
}


/*
*
*   SEARCH Button MODAL Styling
*
*/


#searchInfo{
    top: 25%;
}
#searchInfo .modal-content{
    background-color: unset;
    border: unset;
}
#searchInfo .modal-header{
    border-bottom: unset;
    padding-bottom: 0;
    margin: 0 auto;
    text-align: center;
}
#searchInfo .modal-header h4{
    font-size: 2.154em;
    margin: 0 0 20px;
    font-weight: 400;
    color: #fff;

    text-transform: capitalize;
}
#searchInfo .modal-body{
    padding-top: unset;
}