/*
 * Globals
   nothing to see here for the moment!
*****************************************
 */
/* TODO shaded overlay
.blk {
    position: fixed;
    top: 0;
    left: 0;
    background-color: black;
    background-size: cover;
    background-position: center;
    z-index: 100;
}*/
/*
** background image for body
******************************/

body {

  text-shadow: 0 .05rem .1rem rgba(0, 0, 0, .5);
  box-shadow: inset 0 0 5rem rgba(0, 0, 0, .5);
  background: url("/assets/images/furniture/wolftracks_1920.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;

}

/*
** major containers
********************/
.cover-container {
  max-width: 62em;
}
.alert-box {
    width: 30em;
    height: 10em;
    background-color: white;
    position: center;

}
/*
** TODO to make background opaque
*/
.opaque-it {
    position: fixed;
    top: 0;
    left: 0;
    background-color: black;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    opacity: 70%;
}
/* this override is required to allow images to touch screen edge */
.container-fluid-override {
    padding-left: 0 !important;
    padding-right: 0 !important;
}
/*top right dark section to contain menu buttons*/
.menu-container {
    height: auto;
    width: 28.25rem;
    margin-top: .3rem;
    margin-bottom: 1.1rem;
    opacity: 1;
    display: block;
    position: relative;
    z-index: 5;
    background-color: black; /*#343d49; blue grey*/
}
/*top right white section behind menu box*/
.menu-container-backbox {
    width: 23rem;
    height: auto;
    margin-top: .65rem;
    display: block;
    position: relative;
    z-index: 3;
    background-color: white;
}

/* main logo */
.sandwolf-art-pen-logo {
    width:33rem;
    max-width: 100%;
    height: auto;
    margin-bottom: .97rem;
    opacity: 1;
    display: block;
    z-index: 5;
}
.boxy-shadow {
    -webkit-box-shadow: 0px 0px 43px 5px rgba(0,0,0,0.78);
    -moz-box-shadow: 0px 0px 43px 5px rgba(0,0,0,0.78);
    box-shadow: 0px 0px 43px 5px rgba(0,0,0,0.78);
}

/*
** Navigation bar elements
****************************/
/* horizontal button alignment within the menu bar */
 .nav-masthead .nav-link + .nav-link {
   margin-left: .85rem;
   margin-right: .85rem;
 }
/* button sizing within the menu bar */
a.nav-link{
    margin-right: .97rem;
    margin-left: .97rem;
    margin-top: .75rem;
    margin-bottom: .75rem;
    width:1.8rem;
    height:1.44rem;
    background-size: contain;
    background-repeat: no-repeat;
}

/*
** menu buttons overlay images (3 colours)
** all are 120 * 96px with 24bit depth png.
*/
/* home */
a.home-button {
    background-image: url("/assets/images/icons/home_white_120-96-24.png");
}
a.home-button:hover {
    background-image: url("/assets/images/icons/home_yellow_120-96-24.png");
}
a.home-button.active {
    background-image: url("/assets/images/icons/home_green_120-96-24.png");
}
/*saga*/
a.saga-button {
    background-image: url("/assets/images/icons/saga_white_120-96-24.png");
}
a.saga-button:hover {
    background-image: url("/assets/images/icons/saga_yellow_120-96-24.png");
}
a.saga-button.active {
    background-image: url("/assets/images/icons/saga_green_120-96-24.png");
}
/*gallery*/
a.gallery-button {
    background-image: url("/assets/images/icons/gallery_white_120-96-24.png");
}
a.gallery-button:hover {
    background-image: url("/assets/images/icons/gallery_yellow_120-96-24.png");
}
a.gallery-button:active {
    background-image: url("/assets/images/icons/gallery_green_120-96-24.png");
}
/*giftshop*/
a.giftshop-button {
    background-image:url("/assets/images/icons/giftshop_white_120-96-24.png");
}
a.giftshop-button:hover {
    background-image: url("/assets/images/icons/giftshop_yellow_120-96-24.png");
}
a.giftshop-button:active {
    background-image: url("/assets/images/icons/giftshop_green_120-96-24.png");
}
/*blog*/
a.blog-button {
    background-image: url("/assets/images/icons/blog_white_120-96-24.png");
}
a.blog-button:hover {
    background-image: url("/assets/images/icons/blog_yellow_120-96-24.png");
}
a.blog-button.active {
    background-image: url("/assets/images/icons/blog_green_120-96-24.png");
}
/*contact*/
a.contact-button {
    background-image: url("/assets/images/icons/contact_white_120-96-24.png");
}
a.contact-button:hover {
    background-image: url("/assets/images/icons/contact_yellow_120-96-24.png");
}
a.contact-button.active {
    background-image: url("/assets/images/icons/contact_green_120-96-24.png");
}
/*shoppingTrolley*/
a.shoppingTrolley-button {
    background-image: url("/assets/images/icons/shoppingTrolley_white_120-96-24.png");
}
a.shoppingTrolley-button:hover {
    background-image: url("/assets/images/icons/shoppingTrolley_yellow_120-96-24.png");
}
a.shoppingTrolley-button.active {
    background-image: url("/assets/images/icons/shoppingTrolley_green_120-96-24.png");
}