/*--------------------------------------------------------------
FreeStore - Header Standard Styling
--------------------------------------------------------------*/

.site-header {
  box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.14) inset;
}

.site-branding {
  float: left;
  padding: 0 0 0;
}
.site-branding a {
  display: block;
}
.site-branding a img {
  display: block;
}

.site-title {
  margin: 0;
  padding: 32px 0 4px;
  font-size: 48px;
  line-height: 64px;
  font-weight: 300;
}
.site-title a {
  font-weight: 300;
}
.site-description {
  margin: 0;
  padding: 0 0 17px;
  font-size: 14px;
  line-height: 18px;
  font-weight: 300;
  text-transform: uppercase;
}

.header-menu-button {
  display: none;
}


/* Small menu */
.menu-toggle {
  display: none;
}

.main-navigation {
  float: right;
  padding: 0;
  position: relative;
  top: -10%;
  width: 50%;
}
.main-menu-close {
  display: none;
}
.main-navigation ul {
  display: block;
  list-style: none;
  margin: 0;
  padding-left: 0;
}
.main-navigation li {
  float: left;
  width: 20%;
  text-align: center;
}
.main-navigation li a {
  /*padding: 30px 10px 30px 22px;*/
  /*padding: 18px 10px 18px 22px;*/
  /*padding: 12px 10px 12px 22px;*/
  padding: 2px 10px 2px 10px;
  color: white;
}

.main-navigation ul ul a {
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.03) !important;
  white-space: nowrap;
  text-align: left;
  width: 100%;
  padding: 15px 25px 15px 20px;
  min-width: 190px;
  float: none;
}
.main-navigation ul ul li:last-child a {
  padding: 15px 20px 15px 20px;
}
.main-navigation ul ul li:hover {
  background-color: rgba(0, 0, 0, 0.02);
}


.header-cart {
  float: right;
  padding: 60px 5px 0 12px;
  margin: 0 10px 0 0;
}

.header-cart {}
a.header-cart-contents {
  color: inherit !important;
  padding: 8px;
}

.menu-search {
  float: right;
  margin: 0;
  /*padding: 5px 5px 5px;*/
  padding: 0px 5px 0px 0px;
  box-shadow: -1px 0 0 rgba(0, 0, 0, 0.1);
  position: relative;
  z-index: 500;
}
.search-btn {
  padding: 10px 10px 10px 15px;
  cursor: pointer;
}

.search-block {
    position: absolute;
    background-color: #FFF;
    top: 30px;
    right: 0px;
    z-index: 9999;
    display: none;
    opacity: 0;
    width: 50%;
}

.search-block .search-field {
    font-size: 25px;
    margin: 0px;
    border-radius: 0;
    width: 98%;
    float: left;
    /* font-weight: 200; */
    outline: none;
    color: inherit;
    background-color: white;
    border-color: #ca6e6e;
}
.search-block .search-submit {
  display: none;
}

.show-site-search .search-block {
  display: block;
}

/*--------------------------------------------------------------
## Menus
--------------------------------------------------------------*/

.main-navigation {
  text-align: center;
}

.main-navigation li {
  position: relative;
}

.main-navigation a {
  display: block;
  text-decoration: none;
}

.main-navigation ul ul {
  background-color: #fff;
  border-top: 3px solid #000;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.14);
  float: left;
  position: absolute;
  top: 143px;
  left: -999em;
  z-index: 99999;
  display: none;
}

.main-navigation ul ul ul {
  left: -999em;
  top: -3px;
  display: none;
}

.main-navigation ul ul li {
  float: none;
  width: 100%;
  display: block;
}
.main-navigation li:hover > a,
.main-navigation li.focus > a {
}

.main-navigation ul ul :hover > a {
  color: #FFF;
}

.main-navigation ul li:hover > ul,
.main-navigation ul li.focus > ul {
  left: auto;
  display: block;
}

.main-navigation ul ul li:hover > ul,
.main-navigation ul ul li:focus > ul {
  left: 100%;
  display: block;
}

.main-navigation .current_page_item > a,
#primary-menu .current-menu-item > a,
.main-navigation .current_page_ancestor > a {
  /*  box-shadow: 0 -3px 0 #000 inset;*/
  background-color: white;
  color: #a41f35;
}

/* ---- Menu Switch Class ---- */

.main-navigation .nav-switch ul {
  left: auto;
  right: -999em;
}

.main-navigation li.nav-switch:hover > ul,
.main-navigation li.nav-switch:focus > ul {
  left: auto;
  right: 0;
  display: block;
}
.main-navigation li.nav-switch ul li:hover > ul,
.main-navigation li.nav-switch ul li:focus > ul {
  left: auto;
  right: 100%;
  display: block;
}

.main-navigation li.nav-sub-switch:hover > ul,
.main-navigation li.nav-sub-switch:focus > ul {
  left: auto;
  right: 100%;
  display: block;
}

.main-navigation li.nav-sub-switch-all:hover > ul,
.main-navigation li.nav-sub-switch-all:focus > ul,
.main-navigation li.nav-sub-switch-all ul li:hover > ul,
.main-navigation li.nav-sub-switch-all ul li:focus > ul {
  left: auto;
  right: 100%;
  display: block;
}

/* Small menu. */
.menu-toggle,
.main-navigation.toggled ul {
  display: block;
}

.menu-dropdown-btn {
  display: none;
  position: absolute;
  top: 0;
  right: 0;
  background-color: rgba(255, 255, 255, 0.1);
  color: #838383;
  margin: 0;
  padding: 10px 14px;
  /* box-shadow: -1px 0 0 rgba(0, 0, 0, 0.08); */
  height: 35px;
  line-height: 15px;
  text-align: center;
  font-size: 14px;
  z-index: 9;
  cursor: pointer;
}

.site-main .comment-navigation,
.site-main .posts-navigation,
.site-main .post-navigation {
  margin: 0 0 1.5em;
  overflow: hidden;
}

.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous {
  float: left;
  width: 50%;
}

.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {
  float: right;
  text-align: right;
  width: 50%;
}


#page {
  position: relative;
  right: 0;

  -webkit-transition: right 0.4s ease 0s;
  -moz-transition: right 0.4s ease 0s;
  -ms-transition: right 0.4s ease 0s;
  -o-transition: right 0.4s ease 0s;
  transition: right 0.4s ease 0s;
}

#primary-menu>li>a { text-transform: uppercase; font-size: 16px; background-color: #a41f35; }
#primary-menu>li { padding-top: 7%; z-index: 999; }
/*#primary-menu li#menu-item-48 { background-image: url(/wp-content/themes/freestore/images/sport/icon_baseball.png); }
#primary-menu li#menu-item-49 { background-image: url(/wp-content/themes/freestore/images/sport/icon_baseball.png); }
#primary-menu li#menu-item-50 { background-image: url(/wp-content/themes/freestore/images/sport/icon_baseball.png); }
#primary-menu li#menu-item-51 { background-image: url(/wp-content/themes/freestore/images/sport/icon_baseball.png); }
#primary-menu li#menu-item-52 { background-image: url(/wp-content/themes/freestore/images/sport/icon_baseball.png); }
#primary-menu li#menu-item-53 { background-image: url(/wp-content/themes/freestore/images/sport/icon_baseball.png); }*/

/*#primary-menu>li.current-menu-item { background-position: 50% -6px; }*/

.main-sports-icons {
  display: inline-block;
  position: absolute;
  right: 0px;
  width: 100%;
  height: 50px;
  overflow: hidden;
  text-align: center;
}

.main-sports-icons #icon-baseball {
  background-position-y: -210px;
}
.main-sports-icons #icon-basketball {
  background-position-y: -140px;
}
.main-sports-icons #icon-football {
  background-position-y: -490px;
}
.main-sports-icons #icon-soccer {
  background-position-y: -0px;
}
.main-sports-icons #icon-hockey {
  background-position-y: -565px;
}
.sport-icon-item {
  width: 20%;
  top: 15px;
  position: relative;
  background-image: url(/wp-content/themes/freestore/images/sport/em-balls-bwonly.png);
  background-size: initial;
  background-repeat: no-repeat;
  height: 70px;
  display: inline-block;
  background-position-x: 50%;
  float: left;
}

.sport-icon-item.active {
  top: 0px;
  /*background-image: url(/wp-content/themes/freestore/images/sport/sport-balls-color.png);*/
}

li#menu-item-49>a:hover ~ div#icon-baseball { top: 0px; }
li#menu-item-50>a:hover > div#icon-basketball { top: 0px; }
li#menu-item-48>a:hover > div#icon-football { top: 0px; }
li#menu-item-51>a:hover > div#icon-soccer { top: 0px; } 
li#menu-item-52>a:hover > div#icon-hockey { top: 0px; }

@media screen and (max-width: 1155px) {
  #primary-menu>li>a { font-size: 14px; }
  #primary-menu>li{ padding-top: 7.5%; }
  .main-navigation li a { padding: 1px 5px 1px 5px; }
}

@media screen and (max-width: 980px) {

  .header-menu-button {
    display: inline-block;
    /*margin: 58px 0 0;*/
    margin: 17px 20px 10px;
    text-transform: uppercase;
    cursor: pointer;
  }
  .header-menu-button i {
    font-size: 14px;
    vertical-align: middle;
    position: relative;
    top: 1px;
  }
  .header-menu-button span {
    vertical-align: middle;
    margin: 0 0 0 6px;
  }

  .main-navigation ul {
    display: block;
  }

  .main-navigation #main-menu {
    color: #FFFFFF;
    position: fixed;
    top: 0;
    right: -280px;
    width: 280px;
    max-width: 100%;
    -ms-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 50px 22px 30px 22px;
    background: #000000;
    z-index: 99998;
    height: 100%;
    overflow: auto;
    -webkit-transition: right 0.4s ease 0s;
    -moz-transition: right 0.4s ease 0s;
    -ms-transition: right 0.4s ease 0s;
    -o-transition: right 0.4s ease 0s;
    transition: right 0.4s ease 0s;
  }
  .main-navigation li {
    display: block;
    float: none;
  }
  .main-navigation li a {
    display: block;
    float: none;
    padding: 7px 0;
    color: #C5C5C5 !important;
    text-align: left;
  }
  .main-navigation ul li:last-child a {
    padding: 2px 0;
  }

  .main-navigation ul ul {
    position: relative !important;
    top: 0 !important;
    left: 0 !important;
    float: none !important;
    background-color: rgba(0, 0, 0, 0.2) !important;
    padding: 2px 0 4px;
    margin: 20 0 4px;
    display: none;
  }
  .main-navigation ul ul li:last-child a,
  .main-navigation ul ul li a {
    padding: 4px 10px;
    width: auto;
  }
  .main-navigation ul ul li a:hover {
    background: none;
  }

  .main-menu-close {
    display: block;
    border-radius: 4px;
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 30px;
    color: #898989;
    text-align: center;
    padding: 0 8px 0 12px;
    height: 40px;
    line-height: 38px;
    cursor: pointer;
  }
  .main-menu-close .fa-angle-left {
    position: relative;
    left: -4px;
  }

  body.admin-bar .main-navigation #main-menu {
    padding: 80px 22px 30px 22px;
  }
  body.admin-bar .main-menu-close {
    top: 40px;
  }

}

@media only screen and (max-width: 782px) {

  .site-topbar-left,
  .site-topbar-right {
    float: none;
    text-align: center;
  }
  .site-topbar-left {
    padding: 6px 0 0 !important;
  }
  .site-topbar-left .menu {
    display: inline-block;
  }

  .search-block {
    top: 4px;
    left: auto;
    right: 50px;
    bottom: 0px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.18);
  }
  .menu-search { padding: 10px 5px 10px; }
  .search-block .search-field {
    margin: 0;
    /*width: 300px;*/
    font-size: 17px;
    padding: 4px 6px;
  }

  .site-branding {
    width: 100%;
    float: none;
    text-align: center;
    padding: 5px 0;
  }
  .site-title {
    padding: 5px 0 4px;
  }
  .site-description {
    padding: 0 0 2px;
  }

  .header-cart {
    float: none;
    text-align: center;
    display: inline-block;
    vertical-align: middle;
    padding: 5px 0;
    margin: 0 0 2px;
  }
  a.header-cart-contents {
    padding: 0 2px;
  }
/*  .main-navigation {
    width: 100%;
    float: none;
    text-align: center;
    padding: 4px 0;
  }*/
  .main-navigation li {
    text-align: left;
  }
  .header-menu-button {
/*    margin: 0;
    padding: 6px 0 12px;
    display: block;*/
    margin: 12px 20px 10px;
  }

/*  .menu-search {
    padding: 0;
    float: none;
    display: inline-block;
    vertical-align: middle;
    box-shadow: none;
    margin: 0 15px 0 0;
  }*/
  .search-btn {
    padding: 5px 10px 5px 15px;
  }

  body.admin-bar .main-navigation #main-menu {
    padding: 92px 22px 30px 22px;
  }
  body.admin-bar .main-menu-close {
    top: 55px;
  }
}



body.show-main-menu #main-menu {
  right: 0px;
}
body.show-main-menu #page {
  right: 280px;
}
header>.site-container { height: 95px; }

.site-container { position: relative; }
.site-branding span { height: 55px; float: left; background-size: contain; }
/*.site-branding { 
  position: absolute; 
  top: 15px; 
  left: 0px; 
  width: 100%; 
  z-index: 100;
}*/


.site-branding {
    position: absolute; 
    top: 15px;
    left: -167%;
    width: 430%;
    z-index: 100;
}

.site-branding img {
    width: 105%;
}

header { overflow-x: hidden; }