@import url('https://fonts.googleapis.com/css2?family=Open+Sans&display=swap');


:root {
  --main-color: #000000;
  --main-color2: #000000;  
  --main-color3: #000000;  
  --main-color-h1: #000000;   
  --main-color-h2: #000000;   
  --main-color-h3: #000000;   
  --main-color-h4: #000000;   
  --main-color-btn-default: #000000;
  --main-color-btn-action: #000000; 
  --font-family: 'Open Sans', sans-serif; 
  --font-family-header: "Open Sans", sans-serif;    
  --btn-border-radius: 20px;
  --card-border-radius: 20px;  
  --form-border-radius: 0px; 
  --color-yellow: #eeac3b;
  --color-red: #e1126b;    
  --color-blue: #5db9c5; 
  --color-green: #cbd23f; 
  --color-orange: #f07e19; 
  --color-purple: #7e27d5; 
  --color-action: #7e27d5;    
  --bg-color-grey: #f5f7fa;  
  --navbar-bg-color: #000000;  
  --navbar-navlink-color: #FFFFFF;  
  --main-card-header-color: #cccccc;
  --h1-font-size: 48px;
  --h2-font-size: 48px;
  --h3-font-size: 24px;  
  --h4-font-size: 20px;  
  --h5-font-size: 18px;  
  --h6-font-size: 24px;    
  --paragraph-font-size: 14px;  
}

body {
	font-family: var(--font-family);
	color: var(--main-color);
	font-size: var(--paragraph-font-size);
	line-height:1.5;
	font-weight: 400;
	background: #FFFFFF;
	margin:0; 
	height:100%;
	-webkit-font-smoothing: auto;
}

.site-color {color:var(--main-color-btn-action) !important;}

/*=========== Typography ===============*/
h1, h2, h3, h4, h5, h6, p, btn, .h1, .h2, .h3, .h4, .h5, .h6, .p, .btn {font-family: var(--font-family);}
h1, .h1 {font-size: var(--h1-font-size); font-weight: 600; color:var(--main-color-h1); margin-bottom:20px; font-family: var(--font-family-header);  line-height:1.2; text-transform:capitalize;}
h2, .h2 {font-size: var(--h2-font-size); font-weight: 600;  color:var(--main-color-h2); margin-bottom:20px; font-family: var(--font-family-header);  line-height:1.2; text-transform:inherit;}
h3, .h3 {font-size: var(--h3-font-size); font-weight: 800;  color:var(--main-color-h3); margin-bottom: 16px; font-family: var(--font-family-header); }
h4, .h4 {font-size: var(--h4-font-size); font-weight: 400;  color:var(--main-color-h4); margin-bottom: 20px}
h5, .h5 {font-size: var(--h5-font-size); font-weight: 500;  color:#000000; }
h6, .h6 {font-size: var(--h6-font-size); font-weight: 600;  color:#000000; }

p, .p, li, div, th, td, normal, li p {font-size: var(--paragraph-font-size); font-weight: 400; color:var(--main-color); line-height:1.5;}


.nav-link, .nav-link:visited, .nav-link:active  {color:var(--navbar-navlink-color); font-weight:normal; font-size:16px;}
.nav-link:focus, .nav-link:hover {color:var(--navbar-navlink-color) !important; opacity:0.8 !important}
.nav-link.active {font-weight:bold}

#header {
	position: relative;
	z-index: 999;
    padding: 10px 20px;
    background-color: #000000;
}

.navbar-hamburger {
		color:#ffffff;
}

.body-wrapper-internal {
    padding: 50px 0px 50px !important;
}

#footer-wrapper {
	background-color:#000000;
    padding: 30px 0px;
}

.footer div, .footer p, .footer h1, .footer a {color:#ffffff;}

.form-label {font-weight:600}

.card-internal {box-shadow: 0 .5rem 1rem rgba(0,0,0,.15)!important;}
.card-internal .card-header {background-color:var(--main-card-header-color); font-family:var(--font-family-header); font-size:24px; color:#ffffff; text-align:center;}


.card {
	box-shadow: 0 .5rem 1rem rgba(0,0,0,.15)!important; 
	border:0px 
}

.card-body {
	padding: 1.5rem ;	
}


.products-logo-container {
	margin-left: auto; 
	margin-right: auto;
    width: 50%;
    padding: 0px;
}


.header-account-avatar {height:120px; width:120px; border-radius:50%; background-color:#000000; background-size: cover;  background-position: center;}
.header-account-avatar-initials {font-family:var(--font-family-header); font-size:40px; color:#ffffff}



.btn-site-productcat, a.btn-site-productcat {background-color: #ffffff; border-color: #bfbfbf; color:#000000 !important; font-weight: 400; text-transform: initial; }
.btn-site-productcat:hover, .btn-site-productcat:active, .btn-site-productcat:focus {background-color: #ffffff !important; border-color: #bfbfbf !important; color:#000000 !important;}

.btn-site-productcat-active {border-color: var(--color-red);}

.social-icons i {font-size:24px}

.btn-copy {border: 1px solid #9fa5a5; border-left: 0px; font-weight:bold}
.btn-copy:hover {border: 1px solid #9fa5a5; border-left: 0px; background-color: #ffffff !important; font-weight:bold}

.bg-counter {position:absolute; transform:scale(0.7); top:0px; right:-10px; background-color:var(--main-color-btn-action); border-color:var(--main-color-btn-action);; color:#000000}


.catalogue-product-title {margin-left:200px}
.catalogue-scroll-filler {width:200px;}

.cat-product-title {
	overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

@media (max-width: 2560px) {
}

@media (max-width: 1920px) {
}

@media (max-width: 1400px) {
	.catalogue-product-title {margin-left:100px}
	.catalogue-scroll-filler {width:100px;}
}


@media (max-width: 991px) {
	.header-nav-bar {margin-top: -40px; margin-right: 20px;}
	#header .navbar-nav .nav-item {
		margin-left: 30px;
		padding: 5px 0px;
	}	
    .navbar-collapse {
        background-color: var(--navbar-color);
        padding: 20px;
        margin-left: -15px;
        margin-right: -30px;
    }	
	
	.product-details-image {max-width:200px;}
	
	.catalogue-product-title {margin-left:20px}
	.catalogue-scroll-filler {width:20px;}	
	

}

@media (min-width: 768px) {
	.basket-img {max-width:100px}
}

@media (max-width: 575px) {

}