/*bootstrap nav overrides*/
.navbar-inverse {
    background-color: inherit;
    border: none;
}

    .navbar-inverse .navbar-toggle .icon-bar {
        background-color: #9c8652;
    }

.navbar-toggle .icon-bar {
}

.navbar-toggle {
    margin-top: 60px;
    position: absolute;
    right: 0;
}

.navbar {
    height: unset; /*100px ?*/
}


.navbar {
    margin-bottom: 0;
    border: 0;
    padding: 0 5px;
}

#navbar a.trigger, #navbar a.trigger:hover, #navbar a.trigger:visited, #navbar a.trigger:active {
    margin: 1px;
    margin-left: 8px;
    position: absolute;
    right: 10px;
    top: 5px;
    z-index: 10;
    background-color: transparent !important;
    border: none !important;
}

@media all and (min-width: 960px) {
    #navbar .trigger {
        display: none !important;
    }
}



.force-circle {
    border-radius: 50% !important;
}

/*logged in users>*/
#header nav#secondary-menu ul  li, #header nav#secondary-menu ul  li > a {
    color: #222;
} 





#bootstrap-offcanvas {
    z-index: 300;
    background-color: #9c8652;
    border-left: 2px solid #7d6d48;
    border-bottom: 2px solid #7d6d48;
}

@media all and (min-width: 960px) {
    #bootstrap-offcanvas {
        display: none !important;
    }
}

.nav-pills > li.active > a, .nav-pills > li.active > a:hover, .nav-pills > li.active > a:focus {
    color: #fff;
    background-color: #00253E;
}

.nav > li > a:hover, .nav > li > a:focus {
    background-color: #7d6d48;
}

.nav a {
    color: #fff;
}


#navbar a.menu__link:hover,#navbar a.menu__link.active {
       text-decoration:underline ;
    color: #eee;
}



nav#bootstrap-offcanvas .nav {
    margin: 0;
}

nav#bootstrap-offcanvas  .menu-name-main-menu {
    background-color: #9c8652;
}


nav#bootstrap-offcanvas  .menu-name-menu-utility  {
    background-color:silver;
}
nav#bootstrap-offcanvas  .menu-name-menu-utility li>a {
    color:#111;
}
nav#bootstrap-offcanvas .menu-name-menu-utility li>a.active {
    color: #fff; 
}

nav#bootstrap-offcanvas  .links li,
nav#bootstrap-offcanvas .menu li {
    float: none;
}

nav#bootstrap-offcanvas .menu {
    padding: 0 0 0 15px;
}

.trigger-offcanvas
{
       position: absolute !important;
    right: 0;
    top: 0;
}





#header menu,
#footer menu,
#header ul,
#footer ul {
    margin: 0;
}


ul.menu ul.menu {
    padding-left: 15px;
}

ul.menu li {
    list-style: none;
}





.menu li {
    position: relative;
}

.menu a {
    display: block;
    padding: 8px 4px;
    color: white;
}

#footer-upper .menu a:hover {
    color: #9c8652;
}

.menu a.active {
    color: #eee;
    text-decoration:underline;
}








#header .menu-name-menu-utility ul.menu {
    text-align: right;
}

#footer .menu-name-menu-utility ul.menu {
    text-align: center;
}

#footer .menu-name-menu-utility li.menu__item {
    display: inline-block;
}

#header .menu-name-menu-utility ul.menu li a {
    padding-right: 0;
    margin-left: 18px;
}

#footer .menu-name-menu-utility ul.menu li a {
    padding-left: 0;
    margin-right: 18px;
}






/*
*****************************************************************************
***************** SIDEBAR COMPONENTS **************************************
*****************************************************************************
*/

@media all and (max-width: 959px) {

    .region-sidebar-first {
        display: none;
    }
}

.sidebar .block {
    background-color: #9c8652;
    border: 2px solid white;
    margin-top: 0;
    padding: 0;
    margin-bottom: 0;
}

@media all and (min-width: 960px) {

    .sidebar .block {
        background-color: #9c8652;
        border: 2px solid white;
        margin-top: 2.5em;
        padding: 5px;
    }
}


/*can do the "tagged" images with LI or with images "before" */
/*.sidebar .menu  li.is-collapsed , .sidebar .menu  li.is-expanded {
    list-style-image: url("../images/icon-circle-o--gold.svg");
    margin-left: 15px;
}*/
.sidebar .menu__item.is-collapsed:before, .sidebar .menu__item.is-expanded:before {
    content: '';
    display: inline-block;
    height: 1em;
    width: 1em;
    /*background-image: url('../images/icon-circle-o--gold.svg');*/
    background-size: contain;
    background-repeat: no-repeat;
    padding-left: 2em;
    margin-right: -2em;
    position: absolute;
    top: 12px;
    left: -14px;
}



.sidebar a {
    color: white;

    font-size: 1.2em;
}





ul.menu, .menu__item, .menu__item.is-expanded, .menu__item.is-collapsed, .menu__item.is-leaf {
    list-style-type: none;
    list-style-image: none;
}



/*or could try "after-ing an image...
    position: absolute;
left: -5px;
top: 10px;
font-weight: 900;*/




/*.sidebar ul.menu li a:hover, 
.sidebar ul.menu li a.active {
    color: #00253E;
}*/



/*
*****************************************************************************
***************** HEADER COMPONENTS **************************************
*****************************************************************************
*/


#header {
    color: white;
}



    #header .header__region {
        /*margin: 2em 0 0 0;*/
        /*margin: 30px 10px 0;*/
    }

#site-header .block-wrapper {
    position: relative;
}







@media all and (min-width: 960px) {
    #header .header__region {
        display: inline-block;
        float: right;

margin-top: 26px;
position: absolute;
right: 31px;
    }

        #header .header__region > * {
            float: left;
            margin-bottom: 4px;
        }
}

/*@media (max-width: 479px) {
    #header .header__region {
        position: relative;
        top: 0px;
        width: 100%;
    }
}

@media (min-width: 480px) {
    #header .header__region {
        position: relative;
        top: -70px;
    }
}*/

#header ul.menu {
    /*    text-align: right;
    margin: 0;
    padding: 0;
    position: absolute;
right: 10px;
}

#header .block {
    padding: 2px;*/
}

#header .menu-name-menu-utility li.menu__item {
    display: inline-block;
}



#header a {
    color: white;
}


#header .menu-name-menu-utility a.menu__link:hover ,
#footer .menu-name-menu-utility a.menu__link:hover ,
#header .menu-name-menu-utility ul.menu a.active-trail,
#footer .menu-name-menu-utility ul.menu a.active-trail {
    color: #9C8652;
}

.nav-closed {
    height: 0;
    -webkit-transition: height 0.3s;
    -moz-transition: height 0.3s;
    -o-transition: height 0.3s;
    transition: height 0.3s;
}

/*
*****************************************************************************
***************** FOOTER COMPONENTS **************************************
*****************************************************************************
*/

#footer {
    color: white;
}



    #footer li.expanded > a.menu__link {
        color: #9c8652;
        text-transform: uppercase;
        font-size: 1.2rem;
        font-weight: 400;
    }



    #footer .menu {
        padding-left: 0;
    }




    #footer .header__logo {
        float: left;
        width: 50%;
    }

    #footer #block-menu-menu-social-media {
        float: left;
        text-align: right;
        width: 47%;
        margin: 1.1em 0;
        padding: 0;
    }


        /* #footer #block-menu-menu-social-media .menu .menu__item .menu__link {
            overflow: hidden;
            text-indent: -9000px;
            display: block;
            margin: 0;
            width: 53px;
        }*/

        #footer #block-menu-menu-social-media .menu .menu__item .menu__link {
            overflow: hidden;
            display: block;
            margin: 0;
            text-align: center;
            font-size: 80%;
            padding: 0 3px;
            width: 54px;
            height: 54px;
        }

        #footer #block-menu-menu-social-media li.menu__item {
            display: inline-block;
        }

.back-to-top img {
    position: relative;
    top: 20px;
}


#footer-upper,
#footer-lower {
    display: none;
}


@media all and (min-width: 960px) {
    
    #footer-upper,
    #footer-lower {
        display: block;
    }



    #footer .menu-name-main-menu > ul.menu > li {
        display: block;
        width: 20%;
        float: left;
        margin-top: 1.5em;
        margin-bottom: 1.7em;
    }
}


#header .menu-name-main-menu > ul.menu > li > a.menu__link {
    font-family: 'Glypha LT Std';
    font-weight: 400;
}



/*
*****************************************************************************
***************** NAVIGATION/SEARCH COMPONENTS ******************************
*****************************************************************************
*/



@media all and (max-width : 959px) {

    #header .menu-name-menu-utility .menu__item .menu__link ,
    #footer .menu-name-menu-utility .menu__item .menu__link {
        overflow: hidden;
        width: 30px;
        height: 30px;
    }
}


#header .header__region .menu-name-main-menu > ul > li > a {
    background-color: #9C8652;
    text-align: center;
    color: white;
    font-size: 1.3em;
   
}




@media all and (min-width: 960px) {
    .menu-name-menu-utility .menu__item .menu__link {
        width: auto;
    }

    #header .header__region .menu-name-main-menu ul li {
        display: list-item;
    }

   
        #header .header__region .menu-name-main-menu ul  li  a {
            /*height: 38px;*/
            width: 120px;
            float: left;
            text-decoration: none;
            margin: 0 1px;
            padding: 8px;
       }

    #header .header__region .menu-name-main-menu > ul > li > ul.menu {
        display: none !important;
    }
}


#header .header__region .menu-name-main-menu ul li {
}


#header .header__region .menu-name-main-menu li.menu__item.is-active-trail:after {
    content: " ";
    display: block;
    background: url('../images/menu_triangle.svg') no-repeat center bottom;
height: 13px;
margin: 35px 1px 3px;
border-top: 1px solid #9C8652;

}


@media all and (max-width: 959px) {

    #header .header__region .menu-name-main-menu li.menu__item.is-active-trail:after {
        content: unset;
    }


    #navbar {
        overflow-x: hidden;
        /* for A/B toggle the following*/
        border: 2px solid #00253E;
        background-color: #9c8652;
        position: absolute;
        top: 100px;
        right: -7px;
        z-index: 100;
        padding: 2px;
        width: 320px;
    }



    #header .header__region .menu-name-main-menu > ul > li > a {
        border-bottom: 1px solid #00253E;
        text-align: left;
        color: white;
        font-size: 1.1rem;
        font-weight: 400;
    }
}


/*#header .header__region .menu-name-main-menu a.menu__link.active{
    padding-bottom: 12px;
    background: url("../images/active-menu.png");
    background-repeat: no-repeat;
    background-position: center bottom;
}*/





/* separate Mobile menu??? or morph existing...? probably depends how different they get... */
/*#header .header__region .menu {
	display: none;
}*/

#header .header__region #block-search-form {
    margin: 0 10px 0 0;
}

    #header .header__region #block-search-form .form-submit {
        background: url("../images/icon_magglass.svg");
        height: 25px;
        width: 25px;
        background-size: auto 25px !important;
        border: 0;
        content: " ";
        font-size: 0;
        margin: 5px 0 0 10px;
        position: absolute;
    }

@media all and (max-width : 959px) {
    #search-block-form {
        text-align: center;
        margin: 11px;
    }
}

#search-form .form-text,
#search-block-form .form-text {
    color: #333;
    font-size: large;

}
@media screen and (max-width: 959px) {
    #search-block-form .form-text {
        display: inline-block !important;
    }
}

@media screen and (min-width: 960px) { 
    #search-block-form .form-text {
        position: absolute;
        width: 280px;
        right: 45px;
        display: none ;
    }
}

.search-form__toggle {
    float: right;
    margin-top: 1.48em;
    margin-left: 0.75em;
    background: none;
    padding: 10px;
    border: 0;
}


.cointable img {
	width:110px;
	height:auto;
}

.cointable th p,
.cointable td  p {
		font-size:1em;
		text-align:center;
}

.cointable .header-coin {
	width:25%;
}

.cointable .header-design {
	width:30%;
}

.cointable .header-year {
	width:15%;
}

.cointable .header-mintage {
	width:15%;
}

.cointable .header-mint {
	width:15%;
}

.cointable td img {
	margin: auto auto !important;
}