
/*-----------------------------------------------
Generated by BlueCherryB2B - theme jagjeans
----------------------------------------------- */
.login {  background: url('https://images.westerngloveworks.ca/jagimages/Threadvine/Login%20Page/JAG-threadvine-login.jpg') no-repeat top left fixed !important;  -webkit-background-size: cover !important;  -moz-background-size: cover !important;  -o-background-size: cover !important;  background-size: cover !important;  }
/* Enable Presentation Mode */
.hidePresentataion {
   display:block;
}
.login #header #logo img {
    display: none;
}
.login #header #logo img {
    display: none;
}
a {
color: #333;
}

#login, #register {
width: 500px;
margin: 120px 480px 20px 40px;
}

.box {
background: #fff;
}

.login-wrapper {
height: 595px;
background: transparent;
border: none;
}

#login fieldset.table {
background: transparent;
background-image:url(https://www.dropbox.com/sh/xde03y0zczgnac0/AACbk1puJVJzwmidI0SLgDW0a/white-trans.png?dl=1);
border: 1px solid #a2a2a2;
}

#login.box {
background: transparent;
}

div#login h3 {
color: #fff;
font-weight:200;
text-shadow: black 0.1em 0.1em 0.2em;
}



#header {
height: 70px;
}

#header #logo img {
max-width: 360px;
}

#search .search-input {
width: 150px;
}

#quick-menu a {
font-weight: normal;
text-transform:uppercase;
font-size: 10px;
}

div#nav2 {
background: #FFF;
border: none;
border-top: 2px solid black;
font-weight: bold;
text-transform:uppercase;
}

div#nav2 ul.tab li {
top: 0px;
}

div#nav2 .selected {
border: none;
border-bottom: 10px solid #fff;
background: #003366;
color: #fff;
}

div#nav2 .selected a {
border: none;
border-bottom: 0;
background: #003366;
color: #fff;
}


#navigation {
height: 28px;
background: #fff;
}

ul.nav li a {
color: #000;
font-weight: normal;
}

ul.main li:hover a:active {
background: #000;
color: #fff;
}

.home #navigation ul li.menu_home a, .style #navigation ul li.menu_style a, .catalog #navigation ul li.menu_catalog a, .customer #navigation ul li.menu_customer a, .worksheet #navigation ul li.menu_worksheet a, .order #navigation ul li.menu_order a, .contact #navigation ul li.menu_contact a, .account #navigation ul li.menu_account a, .config #navigation ul li.menu_config a, .site #navigation ul li.menu_site a, .search #navigation ul li.menu_search a {
background: #000;
color: #fff;
}

#hierarchy {
background: transparent;
border-top: 1px dotted black;
border-bottom: 1px dotted black;
border-right:1px dotted black;
}

#hierarchy li.category-selected a.category-selected {
color: #000;
}

#hierarchy li.sub-category-selected a.sub-category-selected {
font-size: 12px;
color: #000;
}

.box {
background: transparent;
padding: 10px 10px 1px 10px;
border: none;
}

#footer {
color: #666;
background: transparent;
}

#footer a {
color: #999;
}

.ui-dashboard-widget .ui-dashboard-header {
background: #FFF;
border: none;
border-top: 2px solid black;
}

.ui-dashboard-widget .ui-dashboard-header h5 {
color: #333;
text-transform: uppercase;
}

.dashboard-left-col .ui-dashboard-content {
border-right: none;
}

#buyer-group-list .selected {
background: #003366;
}

div#style-image {
border: 1px dotted black;
}

#buyer-group-list .selected {
background: #EEE;
color: #222;
}

#contact-data tbody td.selected {
background: #EEE;
color: #222;
}

.fancybox-dialog {
top: 24px;
}

#buyer-group-list .selected {
background: #EEE;
color: #222;
}

#contact-data tbody td.selected {
background: #EEE;
color: #222;
}

#worksheet-count {
color: #222;
}

.jCalMo .invday {
background: #FF8487;
}

.order-item-container .full {
background: #80EE93;
}

.box {
background: transparent;
padding: 10px 10px 1px 10px;
border: none;
}

#footer {
color: #666;
background: transparent;
}

#footer a {
color: #999;
}

.ui-dashboard-widget .ui-dashboard-header h5 {
color: #333;
font-weight: 700;
}

.dashboard-left-col .ui-dashboard-content {
border-right: none;
}

#buyer-group-list .selected {
background: #EEE;
color: #222;
}

#contact-data tbody td.selected {
background: #EEE;
color: #222;
}

.fancybox-dialog .fancybox-dialog-header {
background: #E9E9E9;
border-bottom: 1px solid #BBB;
}

.jCalMo .invday {
background: #FF9A94;
}

.order-item-container .zero {
background: #FF9A94;
}

.order-item-container .low {
background: #FFD3A8;
}

.order-item-container .avg {
background: #F7F3AE;
}

.order-item-container .good {
background: #D5F3AB;
}

.order-item-container .full {
background: #A1E3A1;
}
/* Hide color-no by default */
div.style-color span.color-lable:last-of-type {
    display: none;
}
div.style-color br {
    display: none;
}

/* Hide delivery start */
div#deliveryStart {
    display: none;
}

/* video button 

.play-style-video-style {
    margin-left: 90% !important;
    margin-top: -10% !important;
}

.play-style-video {
    background: url(../images/play-icon.png) no-repeat;
    background-size: 80px 80px;
    margin-left: 15%;
}

*/

pre 

{
    white-space: pre-line;
    font-family: sans-serif;
    font-size: 1.2em;
}

/* Show Activity */
#activity-log {
    display: block;
}

/* ======== mod to instagram section width ============ 
.container_16 .grid_8 {
    width: 80%;
} */
/* ======== Threadvine Grid ============ */
.tv-grid {
    width: 100%;
    max-width: 1920px;
    margin: 0 auto;
display: flex;
    gap: 20px;
}
 
.tv-half {
    float: left;
    width: 49%;
    max-width: 960px;
}
.tv-forth {
    float: left;
    width: 25%;
    max-width: 480px;
}
.tv-grid img {
    width: 100%;
    height: auto;
}
 .tv-forth img {
    width: 95%;
    height: auto;
   margin-left: 5%;
}   
/* =========== Social Icons ============ */ 
@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css");     
.fa {
  padding: 11px 10px 11px 12px;
  font-size: 18px;
  width: 18px;
  text-align: center;
  text-decoration: none;
  margin: 1% 0.5%;
  border-radius: 50%;
}

.fa:hover {
    opacity: 0.7;
    text-decoration: none
}

a .fa:hover {
    text-decoration: none
}    
    
.fa-facebook {
  background: black;
  color: white;
}

.fa-twitter {
  background: black;
  color: white;
}

.fa-google {
  background: black;
  color: white;
}

.fa-linkedin {
  background: black;
  color: white;
}

.fa-youtube-play {
  background: black;
  color: white;
}

.fa-pinterest-p {
  background: black;
  color: white;
}

.fa-instagram {
  background: black;
  color: white;
}  
    
.fa-snapchat-ghost {
  background: black;
  color: white;
 /* text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;*/
}
.fa2 {
  padding: 12px;
  font-size: 18px;
  width: 18px;
  text-align: center;
  text-decoration: none;
  margin: 1% 0.5%;
  border-radius: 50%;
}


/* Position Video Button */
.thumbnail-item .play-style-video {
  background-size: 30px 30px;
}

.play-style-video {
    background-size: 90px 90px;
    margin-left: 15%;
}

.ui-icon-play {
    position: relative;
    float: left;
    z-index: 9999;
    width: 90px;
    height: 90px;
}

.play-style-video-style {
    margin-left: 80% !important;
    margin-top: -15% !important;
}
/* ======== Instagram Feed Section ======== */
@media screen and (min-width: 667px) {
  #custom-content.home {
    float: left;
    width: calc(100% - 1.5em - 1.5em - 349px);
    margin-left: 1.5em;
    padding-left: 1.5em;
    border-left: 1px solid black;
  }
}

.home-content-custom.grid_8 {
  width: 100%;
}

.instafeed {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.5em;
}

@media screen and (min-width: 1200px) {
  .instafeed {
    grid-template-columns: repeat(4, 1fr);
  }
}

.instafeed a {
  position: relative;
  height: 0;
  overflow: hidden;
  padding-top: 100%;
}

.instafeed img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  position: absolute;
  top: 0;
  left: 0;
}

