:root {
  /* ### Colors ### */
  --MainColor: #911335;
  --MainLight: #9c6071;
  --MainSuperLight: #c9a5af;  
  --MainDarkLight: #7c0b29;
  --MainDark: #580c20;
  --White: #ffffff;
  --Placeholder: #9a9a9a;
  --GreySuperDark: #1b1b1b;
  --GreyDark: #313131;
  --GreyMediumDark: #484647;
  --Grey: #636363;
  --GreyMedium: #9a9a9a;
  --GreyMediumLight: #c6c6c6;
  --GreySoftLight: #e1e1e1;
  --GreyLight: #efefef;
  --GreyExtraLight: #f5f5f5;
  --Black: #000000;
  --Green: #006d58;
  --LightGreen: #95d5c9;
  --LightGreen2: #5bc882;
  --GreenBlue: #22818D;
  --Blue: #0d29f2;
  --LightBlue: #40bbe3;

  --YellowDirt: #B3B953;
  --YellowSand: #E9E2BE;
  --Orange: #E15A27;
  --LightOrange: #EF8133;
  --Red: #ff0000;
  --BasicGreen: #7ad91c;


  /* Page width */
  --PageMaxWidth: 1333px;
    
  /* ### Margin / Padding ### */
  --MarginLeft: calc((100% - var(--PageMaxWidth))/2);
  --MarginRight: calc((100% - var(--PageMaxWidth))/2);
}

/* ########### Global ########### */
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  /* border: 1px solid blue; */
  }

#PrintHeader {
  display: none !important;
}

input:focus, textarea:focus, select:focus {
        outline: none;
  }

::-moz-selection { /* Code for Firefox */
  color: var(--White);
  background: var(--MainColor);
}

::selection {
  color: var(--White);
  background: var(--MainColor);
}
    
a {
  text-decoration: none;
  -webkit-text-size-adjust: none;   
}


.Spacer {
  width: auto;
  display: block;
  align-items: center;
  margin-left: auto;
  margin-right: auto;  
}

.noWrap {
  white-space: nowrap;
}
/* ########### Page ########### */
html, body {
    padding: 0px; 
    margin: 0px;
    height: 100%;
    font-size: 15px;
  }
body {
    background-color: var(--GreyLight);
    width: 100%;
    font-family: FiraSans-Light;
    overflow-x: hidden;
  }

.PageContainer {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;  
}

.Page {
  width: 100%;
  height: 100%;
  padding: 0px;
  margin: 0px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;  
}

#BrowserNotif {
  background-color: red;
  color: white;
  width: 100%;
  z-index: 999;
  position: fixed;
  bottom: 0;
  left: 0;
  display: none;
  padding: 5px;
  font-family: FiraSans-Regular;
  font-size: 12pt;
}

#BrowserUpdateCnt {
  position: fixed;
  display: none;
  z-index: 1100;
  height: 100%;
  width: 100%; 
}
#BrowserUpdateCnt td {
  height: 100%;
  width: 100%;
  background: lightgrey;
  margin: 0px;
}
.BrowserUpdate {
  background-color: white;
  color: #515151;
  padding: 5%;
  width: 70vw;
  border-radius: 10px;
}

/* ########### Header ########### */
.PageHeaderCnt {
  position: fixed;
  z-index: 1050;
  top: 0;  
  width: 100%;
  background-color: var(--White);
  background-image: url('../Images/SVG/Header/HeaderBackground.svg'); 
  background-attachment: initial; /* Safari */
  background-repeat: repeat-x;  
  background-position: top center;
  padding-left: var(--MarginLeft);
  padding-right: var(--MarginRight);  
  border-bottom: 1px solid var(--GreyMediumLight);
  padding-top: 0px;
  padding-bottom: 0px;
  
}
.Header {
  width: 100%;
  height: 58px;
  max-height: 65px;
  align-items: center;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

.LogoCnt {
  width: 190px; 
  height: 50px;
  display: flex;
  flex-direction: column;
  margin-right: 5px;
  margin-top: 7px;
}

.Logo {
  align-items: center;
}

.Logo a {
  display: flex;
  justify-content: center;
}
.Logo img {
  padding-top: -10px;
  height: 48px;
}
.SearchCnt {
  margin-right: 5px;
  margin-left: 5px;
  padding: 0px;
  height: 30px;  
  border-radius: 100px; 
  background: var(--White);
  width: 45%; 
  display: flex;
  align-items: center;
}
.ClearInput {
  display: none;
  /* display: flex; */
  width: 22px;
  height: 22px;
  background: transparent;
  border-radius: 50px;
  align-content: center;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  font-family: 'FiraSans-Regular';
  font-size: 15px;
  color: var(--GreyMedium);
}

.MobSearchCnt {
    display: none;
}

.FilterNotifCnt {
  display: none;
}
.Search {
  align-items: center;
  display: flex;
  vertical-align: middle;
  width: 100%;
}

.Search img {
  width: 25px;
  height: 25px;
  margin-top: 2px;
  margin-left: 2px;
}

.InputSearch {
  border: 0px;
  font-family: FiraSans-Light;
  font-size: 14pt;
  color: var(--Placeholder); 
  display: inline;
  width: 100%;
  padding: 0px;
  margin-right: 8px;
  margin-left: 12px;
  color: var(--Green);
  font-family: FiraSans-Regular;
  letter-spacing: -0.5px;  
}

#SearchResultsTopBar {
  display: flex;
  position: absolute;
  top: 45px;
  width: inherit;
  flex-direction: column;
  align-content: flex-start;
}
.SearchResultsLayerCnt {
  width: 560px;
}
.SearchResultsLayer {
  width: 100%;
  height: 100%;
  background: white;
  border-radius: 10px; 
  background: var(--White); 
  border: 1px solid var(--MainSuperLight);
  padding: 5px;
  box-sizing: border-box;
  overflow-y:scroll;
  overflow-x:hidden;  
  max-height: 400px !important;
  transition: max-height 0.25s ease-in;
}

.SearchResultsLayer a {
  color: var(--GreyDark);
}
.SearchResultsLayerPos {
  display: flex;
  padding: 5px;
  margin: 5px;
  border-bottom: 1px solid var(--GreyLight);
  height: 100px; 
}
.SearchResultsLayerPos:hover {
  background: var(--GreyLight);
  border-radius: 10px;
}
.SearchResultsLayerPosCol {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-content: center;
  justify-content: center;
  align-items: flex-start;
}
.SearchResultsLayerPosPhoto {
  height: 80px;
  margin-right: 10px;
  border-radius: 5px;
}

.SearchResultsLayerPosLine1 {
  font-size: 23px;
}
.SearchResultsLayerPosLine2 {
  
}

.HeaderRight {
  display: flex;
  align-items: center;
}
#MyAccountCnt a {
  background: var(--GreyDark);
}
#MyAccountCnt a:hover {
  background: var(--Green);
}

.CartHeaderBtnCnt {
  display: flex;
  align-items: flex-end;
  cursor: pointer;
}
.CartInHeader {
  display: flex;
  padding: 2px;
  border-radius: 100px;
  height: 40px !important;
  width: 40px !important;
  justify-content: center;
  align-items: center;  
  color: var(--White);
  border: 2px solid var(--MainSuperLight);
  background: var(--GreyDark);
}
.CartInHeader img {
  height: 26px;
  width: 26px;
}
.CartHeaderBtnCnt:hover .CartInHeader{
  background: var(--Green);  
}
.CartPcsIcon {
  left: -8;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--Red);
  border-radius: 100px;
  color: var(--White);
  min-width: 20px;
  height: 20px;
  padding: 1px;
  padding-left: 3px;
  padding-right: 3px;
  font-size: 15px;
  font-family: FiraSans-Regular;
}
.CurrencySymbol {
  font-size: inherit -4px;
}
.HeaderLinksCnt {
  display: flex;
}

.LangCnt {
  display: inline-grid;
  justify-content: right;
  margin-right: 0px;
  margin-left: 5px;
}

.LangSelectorCnt {
  font-family: FiraSans-Light;
  font-size: 9pt;
  letter-spacing: 0.01pt;  
}

.LangSelector {
  align-items: center;
  display: flex;
  color: var(--GreyDark);
  background-color: var(--White);
  border-radius: 100px; 
  padding-left: 4px;
  height: 30px;   
}

.LangSelector:hover {
  background-color: var(--GreyLight);
}

.LangSelector:hover + .LangList {
  display: block;
}

.LangCurr {
  align-items: center;
  display: flex;
  padding: 2px;
  width: 100%;
  cursor: pointer;
}

img.Flag {
    width: 20px;
    height: 20px;
    border-radius: 100px;
    border: 1px solid var(--GreyMedium);
    padding: 1px;
    align-items: center;
    display: flex;   
    margin-right: 5px; 
}
 img.DropDownArrow {
   margin-left: 5px;
   margin-right: 5px;
 }
 
.LangList {
  display: none;
  position: absolute;
  background-color: var(--White);
  border-radius: 15px;
  padding: 0px;
  cursor: pointer;  
  width: 100px;
  padding: 4px;
  border: 1px solid var(--GreyMedium);
}
.LangList:hover {
  display: block;
}
.LangList a {
  color: var(--GreyDark);
}
.LangList a:visited {
  color: var(--GreyDark);
}
.LangListPosition {
  align-items: center;
  display: flex;
  padding: 2px;
  width: 100%;
  cursor: pointer;
}

.LangListPosition:hover {
  background-color: var(--GreyLight);
  border-radius: 10px;
}
/* ########### Cookie Notice ########### */
.CookieNoticeCnt {
  position: fixed;
  left: 50%;
  bottom: -60px;
  transform: translate(-50%, -50%);
  display: flex;
  z-index: 2000;
  background: var(--Green);
  margin: 0 0;
  border-radius: 20px;
  padding: 10px;
  color: var(--White);
  max-width: 330px;
  min-width: 314px;
  text-align: justify;
  flex-direction: column;
  align-content: center;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
  padding-bottom: 0px;

  box-shadow: 5px 10px var(--GreyDark);

}
.CookieNoticeTxt {
  font-family: FiraSans-Light;
  color: var(--White);
}
.CookieNoticeTxt a {
  color: var(--GreyExtraLight);
  font-family: FiraSans-Medium;
  text-decoration: underline;
}
.CookieNoticeTxt a:hover {
  color: var(--GreyExtraLight);
  font-family: FiraSans-Medium;
  text-decoration: underline;
}
.CookieNoticeBtn {
  font-family: FiraSans-Medium;
  background: var(--White);
  color: var(--GreyDark);
  padding: 5px;
  margin: 5px;
  border-radius: 8px 8px 0 0;
  cursor: pointer;
  border: 1px solid var(--Green);
  margin-bottom: 0px;
  margin-top: 16px;
}
.CookieNoticeBtn:hover {
  background: var(--Green);
  border: 1px solid var(--White);
  color: var(--White);
}

/* ########### Page Navigation ########### */
#PageNavCnt {
  width: 100%;
  height: 34px;
  max-height: 48px;
  display: flex;
  font-family: 'FiraSans-Regular';
  font-size: 14px;
  text-transform: uppercase;
}

#MobBar {
  display: none;
}

.MobNavCnt {
  display: none;
}
.PageNavCnt a {
  height: 100%;  
  width: 100%;
  display: flex;  
  align-items: center;
  justify-content: center;  
}

.PageNavPos {
  height: 90%;  
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;  
  /* border-left: 1px solid var(--GreyMediumLight); */
  border-collapse: collapse;
  color: var(--Green);
}
.PageNavPosSelected {
  font-family: FiraSans-Regular;
  color: var(--White);
  /* background: linear-gradient(0deg, rgba(255,255,255,1) 45%, rgba(181,181,181,0.8) 100%); */
  background: var(--Green);
};

.PageNavPosLast {
  border-right: 1px solid var(--GreyMediumLight);
}

.PageNavPos:hover {
  background: rgb(255,255,255);
  background: linear-gradient(0deg, rgba(255,255,255,1) 45%, rgba(181,181,181,0.8) 100%);
}

/* ########### Page Contents ########### */
.PageContent {
  width: 100%;
  margin-top: 100px;
  padding-left: var(--MarginLeft);
  padding-right: var(--MarginRight);
}

.PageContentFullHeight {
  margin-top: 100px;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding-left: var(--MarginLeft);
  padding-right: var(--MarginRight);  
}

  .PageTextHeader1 {
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row;
    justify-content: flex-start;
    align-content: center;
    align-items: center;
    font-size: 31px;
    padding: 10px;
    border-bottom: 1px solid var(--MainColor);
    margin: 0px;
    font-family: 'FiraSans-Medium';
  }

  .PageTextHeader2 {
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row;
    justify-content: flex-start;
    align-content: center;
    align-items: center;
    font-size: 22px;
    padding: 10px;
    border-bottom: 1px solid var(--GreyMedium);
    margin: 0px;
    font-family: 'FiraSans-Medium';
    color: var(--GreyDark);
  }  
    .PageTextHeader2 small {
      font-size: 12px;
    }

  .Paragraph1 {
    font-size: 16px;
    padding: 10px;
    border-bottom: 1px solid var(--GreyMedium);
    margin: 0px;
    font-family: 'FiraSans-Regular';
    color: var(--GreyDark);
  }  

  /* ### BOX ### */
.BoxContainer {
    position: static;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: var(--White);
    background-clip: border-box;
    border: 1px solid var(--GreyMediumLight);
    border-radius: 10px;
    margin-bottom: 0.5rem !important;   
    overflow: hidden;     
}
.BoxContainerBackground {
  background-color: var(--White);
  background-image: url('../Images/SVG/Header/BackgroundGrey.svg'); 
  background-attachment: initial; /* Safari */
  background-repeat: repeat-x;  
  background-position: top center;
}
.BoxHeaderGreen {
  /* background-image: url('../Images/SVG/Header/BackgroundHeaderGreen.svg');  /
  background-attachment: initial; /* Safari */
  /* background-repeat: repeat-x;  */
  /* background-position: top center; */
  background: var(--Green);
  background: linear-gradient(180deg, var(--Green) 0%, var(--Green) 45px, rgba(252,252,252,1) 0%);
}

.BoxRow {
    display: flex;
    flex-wrap: wrap;
}
/* ### Product File Box ### */
.ProductFilesCnt {
  display: flex;
  width: 100%;
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  align-content: center;
}
  .ProductFile_Cnt {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: flex-start;
    align-content: center;
    justify-content: center;
    border: 1px solid var(--GreySoftLight);
    border-radius: 9px;
    padding: 5px;
    margin: 5px;
    width: 170px;
  }
  .ProductFile_Cnt div, .ProductFile_Cnt a {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
    align-content: center;
    justify-content: center;
    width: 100%;   
    text-decoration: none;
    font-size: 14px;
  }
  .ProductFile_Cnt * {
    text-decoration: none !important;
  }

  .ProductFile_FotoImg {
    height: 120px;
    width: 120px;
  }

/* ### Home News ### */
.NewsLeft {
  display: flex;
  width: 30%;  
  font-size: 16px;
}
.NewsRight {
  display: flex;
  width: 70%;  
}
.NewsBody {
    width: 100%;
    display: flex;
    flex-flow: column;
    padding-top: 1.7rem;
    padding-bottom: 0.7rem;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    border-radius: 10px;
}
.NewsTitleCnt {
  font-size: 20px;
}
.NewsTitle {
    margin-bottom: 0.9rem;
    font-size: 1em;
    color: var(--MainColor);
    font-family: FiraSans-Regular;
}
.NewsText {
    margin-top: 0;
    margin-bottom: 0.5rem;
    overflow: hidden;
    flex: 1 1 auto; /* fit full height of flex container */
    font-size: 1rem;
    line-height: 1.4rem;
    text-align: justify;
    max-height: 368px;   
}
.NewsImg {
  border-radius: 10px;
  padding: 5px;
  width: 100%;
  vertical-align: middle;
}
.NewsFooter {
  border-top: 1px solid var(--GreyMediumLight);
  display: flex;
  justify-content: space-between;
  padding-top: .4rem;
}

.NewsDate {
  font-size: .8rem;
  color: var(--MainColor);
  display: flex;
  align-content: space-around;
  align-items: center;  
}
.NewsNum {
  display: flex;
  align-items: center;  
}
.NewsDot {
  border-radius: 100px;
  margin: .2rem;
  height: 8px;
  width: 8px;
  border: 1px solid var(--GreyMediumLight);
  background: var(--White);
}
.NewsDotCurr {
  background: var(--MainColor);
  border: 1px solid var(--MainColor);
}

.BannerBody {
  display: flex;
  flex-direction: column;
  align-items: center;  
  justify-content: center;
}



/* ### New products ### */
.BoxPadding {
  padding: 0.5em;
  padding-left: 0.5em;
  padding-right: 0.5em;
}
.BoxHeader { 
  font-size: 1.8em;
  color: var(--MainColor);  
  display: flex;
  justify-content: space-between; 
  align-items: center;
  margin-left: 7px;
  margin-right: 7px;
  margin-top: 0em;
  margin-bottom: 0.3em;
  cursor: pointer;
}
.BoxHeaderBold {
  font-size: 1.7em;
  font-family: FiraSans-Regular;
  color: var(--White);
}
.BoxContainerShadow {
  box-shadow: rgba(0, 0, 0, 0.15) 0px 10px 20px;
  border: 1px solid var(--GreyMediumLight);
}
/* ### Small products box ### */
.BoxProductsCnt {
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  padding: 3px;
}


.BoxProductSmall {
  position: relative;
  min-width: 200px; 
  border-radius: 6px;
  border: 1px solid var(--GreySoftLight);
  width: auto;
  display: flex;
  flex-direction: column;
  flex: 1;
  font-size: 14px;
  margin: 3px;
  padding: 0px;
}

.BoxProductSmall:hover {
  box-shadow: rgba(0, 0, 0, 0.25) 0px 1px 4px;
  border: 1px solid var(--GreyMediumLight);
}

.BoxProductSmall_CatPic {
  height: 463px;
  max-width: 200px;
  background-color: var(--White);
  background-attachment: initial; /* Safari */
  background-repeat: repeat-x;  
  background-position: top left;  
}
.BoxProductSmall_NextBtnCnt {
  height: 463px;
  background-color: var(--White);
  cursor: pointer;
  /* background-image: url('../Images/SVG/Icons/Arrow.svg');  
  background-attachment: initial;
  background-repeat: no-repeat;  
  background-position: center center;  
  */
}  
.BoxProductSmall_NextBtnCnt:hover > .BoxProductSmall_NextBtn  {
  background:var(--Green);
  border: 1px solid var(--Green);
  color: white;
}
.BoxProductSmall_NextBtn {
  display: flex;
  flex-direction: row;
  align-content: center;
  align-items: center;
  justify-content: center;
  margin: auto;
  padding: 12px;
  font-family: FiraSans-Regular; 
  font-size: 28px;
  border: 1px solid var(--Green);
  color: var(--Green);
  border-radius: 35px;  
  background: white;
  cursor: pointer;
} 
.BoxProductSmall_NextBtn img{
  width: 1.4em;
  padding-left: 8;
}

.BoxProductSmall_FavCnt {
  z-index: 9;
  position: absolute;
  top: 5px;
  right: 5px;
}
.BoxProductSmall_FavCnt_Ico {
  cursor: pointer;
  width: 20px !important;  
  height: 20px !important;
  background-color: var(--White);
  background-image: url('../Images/SVG/Icons/FavProduct.svg'); 
  background-attachment: initial; /* Safari */
  background-repeat: no-repeat;  
  background-position: top center;
}


.BoxProductSmall_FavCnt_IcoOn {
  cursor: pointer;
  width: 20px !important;  
  height: 20px !important;
  background-color: var(--White);
  background-image: url('../Images/SVG/Icons/FavProduct_On.svg'); 
  background-attachment: initial; /* Safari */
  background-repeat: no-repeat;  
  background-position: top center;
}


.BoxProductSmall_Fav1 img {
  width: 50px !important;  
  height: 50px !important;
}

  .BoxProductSmall_Photo {
    display: flex;
    align-content: space-between;
    align-items: center;
    justify-content: center;
  }
  
    .BoxProductSmall_Photo img {
      height: 160px;
      width: 160px;
    }    
    
  .BoxProductSmall_ProductCode {
    display: flex;
    align-items: center;  
    justify-content: center;  
    text-align: center;
    font-family: FiraSans-Light;
    font-size: 0.9em;
    color: var(--GreyMediumDark);
  }
  
  .BoxProductSmall_ProductFamily {
    display: flex;
    align-items: center;  
    justify-content: center;  
    text-align: center;
    font-family: FiraSans-Medium;
    font-size: 1em;
    color: var(--MainColor);
  }
  
  .BoxProductSmall_ProductModel {
    display: flex;
    align-items: center;  
    justify-content: center;
    text-align: center;
    font-family: FiraSans-Bold;
    font-size: 1em;
    color: var(--GreyDark);
  }
  
  .BoxProductSmall_ProductType {
    display: flex;
    align-items: center;  
    justify-content: center;
    text-align: center;
    font-family: FiraSans-Regular;
    font-size: 1em;
    color: var(--Green);
    min-height: 60px;
    margin-top: 8px;   
    padding-left: 4px;
    padding-right: 4px;
    border-radius: 6px;
    background: var(--GreyExtraLight);     
  }
  
  .BoxProductSmall_Title {
    display: flex;
    align-items: center;  
    justify-content: center;  
    text-align: center;
    font-family: FiraSans-Medium;
    font-size: 0.9em;
    color: var(--GreyMediumDark);
  }
  .BoxProductSmall_TitleRed {
    display: flex;
    align-items: center;  
    justify-content: center;  
    text-align: center;
    font-family: FiraSans-Medium;
    font-size: 0.9em;
    color: var(--White);
    background-color: var(--Red);
    border-radius: 100px;
    padding: 1px;
    padding-left: 5px; 
    padding-right: 5px;

  }  
  .BoxProductSmall_Value {
    display: flex;
    align-items: center;  
    justify-content: center;  
    text-align: center;
    font-family: FiraSans-Regular;
    font-size: 1em;
    color: var(--MainColor);
    margin-left: 5px;
  }
  .BoxProductSmall_Shop_Cnt {
    display: flex;
    flex-direction: column;
    margin-top: 8px;
  }
    .BoxProductSmall_Price_Cnt {
      display: flex;
      align-content: space-between;
      flex-direction: column;
      justify-content: center;      
      height: 65px;
    }
    .BoxProductSmall_Shop_Row {
      /* przed modyfikacją cen */
      /*
      display: flex;
      flex-direction: row;
      justify-content: space-evenly;
      text-align: center;
      align-items: baseline;
      margin: 1px;
      */
      display: flex;
      flex-direction: column;
      justify-content: space-evenly;
      text-align: center;
      align-items: center;
      margin: 1px;
  }
    }
    .BoxProductSmall_Row2Cell {
      display: flex;
      margin: 3px;
      flex-direction: column;
    }
      .BoxProductSmall_Shop_PriceOld {
        display: flex;
        text-align: center;
        flex-direction: row;
        flex-wrap: nowrap;
        align-items: flex-end;
        justify-content: center;
        align-content: flex-end;        
        color: var(--GreyMediumDark);
        font-size: 0.9em;
      /* text-decoration: line-through; */
        padding: 0px;
        padding-left: 8px;
        padding-right: 8px;
        font-family: FiraSans-Regular;      
      }
      .BoxProductSmall_Shop_PricePromo {
        display: flex;
        text-align: center;
        flex-direction: row;
        flex-wrap: nowrap;
        align-items: flex-end;
        justify-content: center;
        align-content: flex-end;        
        background: var(--Red);
        color: var(--White);
        font-size: 1.5em;
        padding: 2px;
        padding-left: 8px;
        padding-right: 8px;
        font-family: FiraSans-Bold;
        border-radius: 6px;
        text-align: center;
      } 
      .BoxProductSmall_Shop_Price {
        display: flex;
        text-align: center;
        flex-direction: row;
        flex-wrap: nowrap;
        align-items: flex-end;
        justify-content: center;
        align-content: flex-end;        
        background: var(--GreyLight);
        color: var(--Green);
        border: 1px solid var(--GreyMediumLight);
        font-size: 1.5em;
        padding: 2px;
        padding-left: 8px;
        padding-right: 8px;
        font-family: FiraSans-Bold;
        border-radius: 6px;
        text-align: center;
      }       
    .BoxProductSmall_Shop_Row_ProductDelivery {
      border: 1px solid var(--GreyMediumLight);
      border-radius: 100px;
      background: var(--White);
      padding: 7px;
      margin-left: 5px;
      margin-right: 5px;
      margin-top: 9px;
      margin-bottom: 3px;
      display: flex;
      flex-direction: row;
    }      
    .BoxProductSmall_PCS {
      display: flex;
      flex-direction: row;
      justify-content: center;
      align-items: center;
      border: 1px solid var(--GreyMediumLight) !important;
      margin: 1px;
      padding-left: 5px;
      padding-right: 5px;
      border-radius: 16px;
      margin-top: 10px;
      color: var(--GreyMediumDark);
    }
    .BoxProductSmall_PCS:hover {
      background: var(--GreyExtraLight);    
    }
      .BoxProductSmall_PCS input {
        border: 0;
        width: 40px;
        padding: 5px;
        text-align: center;
        font-size: 1.2em;
        font-family: FiraSans-Regular;
      }
      .BoxProductSmall_PCS button {
        border: 0;
        font-family: FiraSans-Regular;
      }    
      .BtnPCS {
        background: transparent;
        color: var(--GreyDark);
        font-family: FiraSans-Regular;
      }

    .BoxProductSmall_Shop_CartAdd {
      display: flex;
      align-items: flex-end;
      justify-content: center;
      align-items: center;
      background: var(--Green);
      color: var(--White);
      font-size: 1em;
      padding: 4px;
      padding-left: 8px;
      padding-right: 8px;
      height: 32px;
      margin-left: 5px;
      margin-right: 5px;
      margin-top: 5px;
      margin-bottom: 10px;
      font-family: FiraSans-Regular;
      border-radius: 16px;
      cursor: pointer;
    }  
    .BoxProductSmall_Shop_CartAdd:hover {
      background: var(--MainColor);  
    }

    .BoxProductSmall_Shop_NotifyOn {
      display: flex;
      align-items: center;
      justify-content: center;
      border: 1px solid var(--Green);
      background: var(--White);
      color: var(--Green);
      font-size: 1em;
      padding: 4px;
      padding-left: 8px;
      padding-right: 8px;
      height: 32px;
      margin-left: 5px;
      margin-right: 5px;
      margin-top: 5px;
      margin-bottom: 10px;
      font-family: FiraSans-Regular;
      border-radius: 16px;
      cursor: pointer;
      line-height: 11px;
      text-align: center;
    }  
    .BoxProductSmall_Shop_NotifyOn:hover {
      background: var(--GreyLight);
    }

    .BoxProductSmall_Shop_NotifyOff {
      display: flex;
      align-items: center;
      justify-content: center;
      border: 0px solid var(--Green);
      background: var(--GreyMediumDark);
      color: var(--White);
      font-size: 1em;
      padding: 4px;
      padding-left: 8px;
      padding-right: 8px;
      height: 32px;
      margin-left: 5px;
      margin-right: 5px;
      margin-top: 5px;
      margin-bottom: 10px;
      font-family: FiraSans-Regular;
      border-radius: 16px;
      cursor: pointer;
      line-height: 11px;
      text-align: center;
    }  
    .BoxProductSmall_Shop_NotifyOff:hover {
      background: var(--MainColor);
    }
    .BoxProductSmall_Shop_NotifyOff img {
      height: 16px;
    }   
    .BoxProductSmall_Shop_Notify_ProductPage {
      font-size: 15px;
      display: flex;
      flex-direction: column;
      flex-wrap: nowrap;
      align-content: center;
      justify-content: center;
      align-items: center;
      height: 100%;
      line-height: 16px;
      border-radius: 4px;
      margin: 0px;
      padding-bottom: 10px;
    }
    .BoxProductSmall_Shop_Notify_ProductPage img {
      height: 22px;
      margin-bottom: 5px;
    }       
    .BoxProductSmall_Shop_CartOutOfStock {
      display: flex;
      align-items: center;
      justify-content: center;
      border: 1px solid var(--Green);
      background: var(--White);
      color: var(--Green);
      font-size: 1em;
      padding: 4px;
      padding-left: 8px;
      padding-right: 8px;
      height: 32px;
      margin-left: 5px;
      margin-right: 5px;
      margin-top: 5px;
      margin-bottom: 10px;
      font-family: FiraSans-Regular;
      border-radius: 16px;
      cursor: pointer;
      line-height: 11px;
      text-align: center;
    }  
    .BoxProductSmall_Shop_CartOutOfStock:hover {
      background: var(--GreyLight);
    }
 
    .BoxProductSmall_Shop_CartAddDisabled img {
      opacity: 1;
    }
.ProductSmallDataSheet {
  font-size: 15px;
}
.ProductSmallDataSheet * {border: 0px solid blue; color: blue;}
  .ProductSmallDataSheet_Header {
    display: flex;
    justify-content: space-between;
    align-items: center;    
  }
    .ProductSmallDataSheet_ProductName {
      font-family: FiraSans-Regular;
      font-size: 1em;
      display: block;
      margin-top: 2px;
    }
      .ProductSmallDataSheet_ProductFamily {
        font-family: FiraSans-Medium;
        font-size: 1em;
        color: var(--MainColor);
      }
      .ProductSmallDataSheet_ProductModel {
        font-family: FiraSans-Regular;
        font-size: 1.1em;
        color: var(--GreyDark);
      }

    .ProductSmallDataSheet_ProductCode {
      font-size: 1em;
      display: block;
      margin-top: 2px;      
    }
      .ProductSmallDataSheet_ProductCode_Title {
        font-family: FiraSans-Light;
        text-align: center;
        font-size: 0.8em;
        color: var(--GreyDark);
      }
      .ProductSmallDataSheet_ProductCode_Value {
        text-align: center;
        font-family: FiraSans-Regular;
        font-size: 1em;
        color: var(--MainColor);
      }    
      
  .ProductSmallDataSheet_Cols {
    margin-top: 0.1em;
    display: flex;  
    justify-content: space-between;
  }
    .ProductSmallDataSheet_Photo {
      display: flex;
      align-content: space-between;
      align-items: center;
    }
      .ProductSmallDataSheet_Photo img {
        height: 140px;
        width: 140px;
      }    
    .ProductSmallDataSheet_Data {
      display: flex;
      flex-direction: column;
      align-content: space-between;
      align-items: center;    
      justify-content: space-around;
      width: 100%;      
      padding: 2px;      
    }
      .ProductSmallDataSheet_ProductType {
        font-family: FiraSans-Regular;
        color: var(--Green);
        overflow: hidden;
        font-size: 1em;
        line-height: 1em;
        text-align: center;
        margin-bottom: 0px;
      }        
      .ProductSmallDataSheet_Shop {
        width: 100%;  
        display: flex;
        flex-direction: column;
      }
      .ProductSmallDataSheet_ShopRow {
        width: 100%;  
        display: flex;
        flex-direction: row;
        justify-content: flex-end;
        align-items: baseline;
        border: 0px solid var(--GreyMediumLight);
        margin: 1px;
        border-radius: 16px;
      }
        .ProductSmallDataSheet_ShopRow_Title {
          color: var(--GreyMediumDark);
          font-size: 0.8em;
          padding: 1px;
        }
        .ProductSmallDataSheet_ShopRow_Value {
          color: var(--Green);
          font-size: 1em;
          padding: 2px;
          padding-left: 8px;
          padding-right: 3px;
          font-family: FiraSans-Regular;
          }        

    .ProductSmallDataSheet_ShopRow_PriceCnt {
      width: 100%;  
      display: flex;
      flex-direction: row;
      justify-content: flex-end;
      align-items: baseline;
      border: 0px solid var(--GreyMediumLight);
      margin: 1px;
      border-radius: 16px;
    }
        .ProductSmallDataSheet_ShopRow_Price {
          background: var(--GreyDark);
          color: var(--White);
          font-size: 1.2em;
          padding: 2px;
          padding-left: 8px;
          padding-right: 8px;
          font-family: FiraSans-Regular;
          border-radius: 16px;
          text-align: center;
        }   
        .ProductSmallDataSheet_ShopRow_PriceRed {
          background: var(--Red);
          color: var(--White);
          font-size: 1.2em;
          padding: 2px;
          padding-left: 8px;
          padding-right: 8px;
          font-family: FiraSans-Regular;
          border-radius: 16px;
          text-align: center;
        }           
        .ProductSmallDataSheet_ShopRow_TitleRed {
          color: var(--Red);
          font-size: 0.8em;
          padding: 1px;
        }        
        .ProductSmallDataSheet_ShopRow_PriceOld {
          color: var(--GreyMediumDark);
          font-size: 0.9em;
          text-decoration: line-through;
          padding: 0px;
          padding-left: 8px;
          padding-right: 8px;
          font-family: FiraSans-Regular;
        }           
    .ProductSmallDataSheet_ShopRow_CartCnt {
      width: 100%;  
      display: flex;
      flex-direction: row;
      justify-content: center;
      align-items: center;
      border: 0px solid var(--GreyMediumLight);
      margin: 1px;
      padding-bottom: 5px;
      border-radius: 16px;
      color: var(--GreyMediumDark);
    }
        .ProductSmallDataSheet_ShopRow_PCS {
          display: flex;
          border-radius: 16px;
          border: 1px solid var(--Grey);
          padding: 2px;
          padding-right: 6px;
          padding-left: 8px;
          align-items: center;
          color: var(--GreyMediumDark);
        }    
        .ProductSmallDataSheet_ShopRow_PCS input {
          width: 35px;
          text-align: center;
          color: var(--GreyMediumDark);
          font-size: 1.05em;
        }
        .ProductSmallDataSheet_ShopRow_PCS input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button {
          -webkit-appearance: none; 
          margin: 0;
          margin-left: 3px; 
        }
                
        .ProductSmallDataSheet_ShopRow_Cart {
          display: flex;
          align-items: flex-end;
          background: var(--Green);
          color: var(--White);
          font-size: 1em;
          padding: 4px;
          padding-left: 8px;
          padding-right: 8px;
          margin-lefT: 3px;
          font-family: FiraSans-Regular;
          border-radius: 16px;
          cursor: pointer;
        }  
        .ProductSmallDataSheet_ShopRow_Cart:hover {  
          background: var(--MainColor);      
        }
        .ProductSmallDataSheet_ShopRow_Cart img {  
          margin-right: 1px;
          height: 18px;
        }
        .unavailable {
          opacity: 0.5;
        }

/* ########### Strony produktĂłw ########### */
.ColCnt {
  display: flex;
  background: transparent;
}
.DefaultBox {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
  /* margin-bottom: 0.5rem !important;   */ 
  padding: 5px;
  overflow: hidden; 
}
.DefaultBoxColors {
  word-wrap: break-word;
  background-color: var(--White);
  background-clip: border-box;
  border: 1px solid var(--GreyMediumLight);
  border-radius: 10px;  
}
.LeftColCnt {
  width: 25%;
}
.RightColCnt {
  width: 75%;
  margin-left: 5px;
}

/* ########### Product ########### */
.ProductPageTopBar {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  padding: 2px;
  margin-bottom: 5px;
  border-bottom: 1px solid var(--GreySoftLight);
}
  .ProductPageTopBar img {
    height: 28px;
    cursor: pointer;
    opacity: 0.7;
    margin-right: 7px;
  }
  .ProductPageTopBar img:hover {
    opacity: 1;
  }

.ProductPageBasicDataCnt {
  width: 100%;
  display: flex;
  align-items: stretch;
  flex-wrap: wrap;
  padding: 0px;
  justify-content: center;
}
  .ProductPageMainPhotoCnt {
    max-width: 400px;
    display: flex;
    flex-direction: column;
    flex: 1;
    font-size: 14px;
    margin: 3px;
    padding: 0px;
  }
    .ProductPageMainPhotoCnt img {
      width: 400px;
      height: 400px;
      border: 1px solid var(--White);
    }
    .ProductPageMainPhotoCnt img:hover {
      /* opacity: 0.6; */
      border: 1px solid var(--Green);
    }    

  .ProductPageBasicData {
    display: flex;
    flex-direction: column;
    flex: 1;
    align-items: stretch;
    justify-content: flex-start;
    flex-wrap: nowrap;
    font-size: 14px;
    margin: 0px;
    margin-left: 3px;
    padding: 5px;
    border-left: 1px solid var(--GreySoftLight);
    
  }

    .ProductPageBasicData_ProductName {
      font-family: FiraSans-Regular; 
      text-transform: uppercase;
      display: flex;
      flex-direction: row;
      justify-content: flex-start;
      align-items: baseline;    
    }
      .ProductPageBasicData_FamilyName {
        font-size: 28px;
        color: var(--MainColor);
      }
      .ProductPageBasicData_ModelName {
        font-size: 28px;
        color: var(--GreyDark);
        padding-left: 5px;
      }
      .ProductPageBasicData_ProductType {
        font-family: FiraSans-Regular;
        font-size: 14px;
        color: var(--GreyDark);
        padding-left: 1px;        
      }
  .ProductPageBasicDataLine2 {
    font-family: FiraSans-Regular; 
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
    height: 100%;
  }
    
  .ProductPageBasicData_Media_Cnt {
    font-size: 28px;
    color: var(--MainColor);
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }
  
    .ProductPageBasicData_Media, .ProductPageMainPhotoCnt a {
      cursor: pointer;
    }
      
    .ProductPageBasicData_Media {
      font-size: 28px;
      color: var(--MainColor);
      display: grid;
      grid-template-columns: repeat(3, 1fr);  
    }
    
    .ProductPageBasicData_MediaIMG {
      width: 120px;
      height: 120px;
      margin: 2px;
      border: 1px solid var(--GreySoftLight);
    }
    
    .ProductPageBasicData_MediaIMG:hover {
      /* opacity: 0.6; */
      border: 1px solid var(--Green);
    }
    
    .ProductPageBasicData_Media_Box {
      width: 120px;
      height: 120px;
      margin: 2px;
      border: 1px solid var(--GreySoftLight);
    }
    
    
    
    
    
    .ProductPageBasicData_Add2Cart {
      display: block;
    }
    
    .ProductPageBasicData_Info {
      /*
      min-width: 120px;
      max-width: 156px;  
      */
      width: 156px;    
      font-size: 28px;
      color: var(--GreyDark);
      padding-left: 5px;
    }
      .ProductPageBasicData_InfoBox {
        width: 100%;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center; 
        margin-bottom: 0px;
      }
      
      .ProductPageBasicData_InfoBox_Header {
        background: var(--GreyLight);
        color: var(--GreyDark);
        font-size: 12px;
        padding: 2px;
        font-family: FiraSans-Regular; 
        align-items: center; 
        border-bottom: 1px dotted var(--GreyDark);    
        width: 100%;
        display: flex;
        justify-content: center;
      }
      
      
      .ProductPageBasicData_InfoBox_Val {
        display: flex;
        align-items: center;
        font-family: FiraSans-Medium;
        font-size: 20px;
        height: 55px;
        flex-direction: row;
      }
      
      .ProductPageBasicData_InfoBox_FontBig {    
        color: var(--Green);
        font-family: FiraSans-Medium;
        font-size: 29px;
      } 
      
      .ProductPageBasicData_InfoBox_FontMedium {    
        font-family: FiraSans-Medium;
        font-size: 24px;
      } 
            
      .Icon_EnergyClass {
        height: 28px;
      }
      .Icon_CatPageNum {
        height: 22px;
        margin-right: 5px;
      }

  .ProductPage_Shop_Cnt {
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    justify-content: flex-start;
    align-content: center;
    flex-wrap: nowrap;   
    border: 1px solid var(--GreyMedium);
    height: 94px;
    margin: 2px;
  }

    .ProductPage_Shop_Box_Cnt {
      width: 120px;
      height: 120px;
      margin: 2px;
      border: 0px solid var(--GreySoftLight);
      padding: 5px;      
      display: flex;
      flex-direction: column;
      align-content: center;
      justify-content: flex-start;
      align-items: center;
      flex-wrap: nowrap;
      cursor: default;
    }
      .ProductPage_Shop_Box_Line1 {
        background: var(--GreyLight);
        color: var(--GreyDark);
        font-size: 12px;
        padding: 2px;
        font-family: FiraSans-Regular;
        align-items: center;
        border-bottom: 1px dotted var(--GreyDark);
        width: 100%;
        display: flex;
        justify-content: center;       
        text-align: center;
      }
      .ProductPage_Shop_Box_Line1 input[type=number] {
        
      }
      .ProductPage_Shop_Box_Line2 {
        font-family: FiraSans-Light;
        font-size: 22px;        
        height: 100%;
        display: flex;
        flex-direction: column;
        justify-content: center;
      }
      .ProductPage_Shop_Box_OneLine {
        font-family: FiraSans-Light;
        font-size: 12px;    
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        align-content: center;
        justify-content: center;
        align-items: center;         
      }      
      .ProductPage_Shop_Box_OneLine input[type=text]{
        width: 55px;
      }
      
      .ProductPage_Shop_AvaiblePCS {
        font-size: 17px;
        color: var(--Green);
        font-family: FiraSans-Regular;
      }
      
      .ProductPage_Shop_Box_PriceOld {
        color: var(--GreyMediumDark);
        font-size: 16px;
        text-decoration: line-through;
        padding: 0px;
        padding-left: 8px;
        padding-right: 8px;
        margin-bottom: 9px;
        margin-top: 14px;
        font-family: FiraSans-Regular;
        text-align: center;  
      }
      .ProductPage_Shop_Box_PricePromo {
        display: flex;
        text-align: center;
        flex-direction: row;
        flex-wrap: nowrap;
        align-items: flex-end;
        justify-content: center;
        align-content: flex-end;
        background: var(--Red);
        color: var(--White);
        border: 0px solid var(--GreyMediumLight);
        font-size: 20px;
        padding: 2px;
        padding-left: 8px;
        padding-right: 8px;
        margin-top: 4px;
        margin-bottom: 4px;
        font-family: FiraSans-Bold;
        border-radius: 6px;
        text-align: center;
      } 
      .ProductPage_Shop_Box_PricePromo small {
        font-size: 12px;
      }
            
      .ProductPage_Shop_Box_Price {
        display: flex;
        text-align: center;
        flex-direction: row;
        flex-wrap: nowrap;
        align-items: flex-end;
        justify-content: center;
        align-content: flex-end;
        background: var(--Green);
        color: var(--White);
        border: 0px solid var(--GreyMediumLight);
        font-size: 20px;
        padding: 2px;
        padding-left: 8px;
        padding-right: 8px;
        margin-top: 8px;
        margin-bottom: 0px;
        font-family: FiraSans-Bold;
        border-radius: 6px;
        text-align: center;
      }      

      .ProductPage_Shop_CartAddBtn {
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        justify-content: center;
        align-items: center;
        background: var(--Green);
        color: var(--White);
        padding: 5px;
        padding-left: 8px;
        padding-right: 8px;
        margin-left: 5px;
        margin-right: 5px;
        margin-top: 4px;
        margin-bottom: 0px;
        font-family: FiraSans-Regular;
        border-radius: 8px;
        cursor: pointer;
        width: 100%;
        font-size: 15px;
      }  
      .ProductPage_Shop_CartAddBtn:hover {
        background: var(--MainColor);  
      }
      .ProductPage_Shop_CartAddBtn img {
        height: 20px;
        margin-bottom: 0px;
      }     
       
  .ProductPageAdvDataCnt {
    margin-top: 10px;
    padding: 0px;
    padding-top: 10px;
    width: 100%;
    display: flex;
    align-items: stretch;
    flex-wrap: wrap;
    border-top: 1px solid var(--GreySoftLight);
  }
  .ProductPageAdvDataText {
    max-width: 400px;
    display: flex;
    flex-direction: column;
    flex: 1;
    font-size: 14px;
    margin: 3px;
    padding: 0px;    
  }
  .ProductPageSectionTitle {
    font-family: FiraSans-Light;
    font-size: 25px;
    margin-bottom: 12px;
  }
  .ProductPageAdvDataSymbols {
    display: flex;
    flex-direction: column;
    flex: 1;
    align-items: stretch;
    justify-content: flex-start;
    flex-wrap: wrap;    
    font-size: 14px;
    margin: 0px;
    margin-left: 3px;
    padding: 5px;
  }
.ProductDownloadFile img {
  height: 20px;
  border-radius: 3px;
  opacity: 80%;
}
.ProductDownloadFile:hover div {
  color: var(--MainColor);
  text-decoration: underline;
}
.ProductDownloadFile:hover img {
  filter: invert(12%) sepia(45%) saturate(6292%) hue-rotate(332deg) brightness(94%) contrast(95%);    
  opacity: 100%;
}
/* ########### Pictograms ########### */
.PictogramsCnt{
  display: flex;
  flex-direction: row;
  align-items: stretch;
  justify-content: flex-start;
  flex-wrap: wrap;
  font-size: 14px;
  margin: 0px;
  margin-left: 3px;
  padding: 5px;  
}

.Pictogram{
  width: 48%;
  display: flex;
  margin: 5px;
  border-bottom: 1px solid var(--GreySoftLight);  
  height: 60px;  
}
.Pictogram:hover img {
  filter: invert(12%) sepia(45%) saturate(6292%) hue-rotate(332deg) brightness(94%) contrast(95%);
}
.PictoImg {
  display: flex;
  justify-content: center;
  align-items: center;  
}
.PictoImg img {
  height: 40px;
  opacity: 100%;
  margin: 10px
}
.PictoDesc {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  flex-direction: column
}
  .PictoTitle {
    font-size: 11px;
    font-family: FiraSans-Regular;
  }
  .PictoValue {
    font-size: 14px;
    color: var(--Green);
    font-family: FiraSans-Medium;
  }
/* ########### Articles ########### */
.Article {
  display: flex;
  flex-direction: column;
  padding: 25px;
  padding-bottom: 5px;
}
  .ArticleHeader {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: flex-end;  
  border-bottom:  1px solid var(--GreySoftLight);
  padding-bottom: 5px;
  margin-bottom: 5px;  
  }
    .ArticleTitle {
      color: var(--Green);
      font-size: 25px;
      font-family: FiraSans-Regular;
    }
    .ArticleInfo {
      font-size: 14px;
      color: var(--Grey);
    }
  .ArticleContent {
    margin-top: 5px;
    font-size: 16px;
  }
    .ArticleContent p {
      padding: 0px;
      margin: 0px;
    }
    .ArticleContentNews {
      border-bottom: 1px solid var(--GreySoftLight);
    }        
    .ArticleContentNewsList {
      border-bottom: 1px solid var(--GreySoftLight);
      height: 300px;
      overflow-y: scroll;
    }   
    .ArticleContentNewsList a {
      color: var(--GreyDark);
    }
    .NewsListDateTitleCnt {
      display: flex;
      justify-content: flex-start;
      align-items: center;
      flex-direction: row;
      flex-wrap: nowrap;
      height: 20px;
      padding: 5px;
      border-radius: 100px;
      cursor: pointer;;
    }
    .NewsListDateTitleCnt:hover {
      background: var(--GreyLight);
      color: var(--MainColor);
    }
    .NewsListDate {
      margin-right: 5px;
      width: 80px;
    }
    .NewsListTitle {

    }
    .ArticleContentNews > div > p {
      padding: 0px;
      margin-top: 10px;
      margin-bottom: 10px;
      font-size: 16px;
      line-height: 20px;
      font-family: FiraSans-Light;
      text-align: justify;
    }    
    .ArticleContentNews > div > p > li {
      padding: 0px;
      margin-top: 10px;
      margin-bottom: 10px;
      font-size: 15px;
      line-height: 22px;
      font-family: FiraSans-Light;
      text-align: justify;
    }      
    .ArticleContentNews a {
      font-family: FiraSans-Medium;
      color: var(--MainDarkLight);
    }
    
    .ArticleContentNews a:hover {
      text-decoration: underline;
    }
    .ArticleContent a {
      color: var(--MainDarkLight);
      font-family: FiraSans-Regular;
    }    
    .ArticleContent a:hover {
      color: var(--GreyDark);
      text-decoration: underline;
    }      
    .ArticleTable {
      border-collapse: collapse;
    }
    .ArticleTable th {
      padding: 10px;
      border: 1px solid var(--GreySoftLight);
    }    
    .ArticleTable td {
      padding: 5px;
      border: 1px solid var(--GreySoftLight);
    }
    .ArticleTable td img {
      height: 80px;
    }
    a.ArticleLink {
      color: var(--MainColor);
    }    
    a.ArticleLink:hover {
      color: var(--Green);
    }        
    .ArticleContent li {
      font-size: 16px;
      padding: 3px;
    }
    .ArticleContentTextFontDecoration1 {
      font-size: 18px;
      color: var(--MainColor);
    }

    .TableDownload {
      border-collapse: collapse;
      border-style: hidden;
    }
    .TableDownload td {
      padding: 5px;
      border-bottom: 1px solid var(--GreySoftLight);
      border-top: 0px;
      border-left: 0px;
      border-right: 0px;      
      display: table-cell;
      vertical-align: middle;      
    }
    .TableDownload a:hover {
      text-decoration: underline;
    }
    .TableDownload a{
      display: flex;
    }    
    .TableDownload a > img {
      height: 19px;
      margin-right: 5px;
    }


    .TableBasic {
      border-collapse: collapse;
      border-style: hidden;
    }

    .TableBasic th {
      padding: 5px;
      border-bottom: 1px solid var(--GreySoftLight);
      border-top: 0px;
      border-left: 0px;
      border-right: 0px;      
      vertical-align: middle;      
    }

    .TableBasic td {
      padding: 5px;
      border-bottom: 1px solid var(--GreySoftLight);
      border-top: 0px;
      border-left: 0px;
      border-right: 0px;      
      vertical-align: middle;   
      font-size: 14px;   
    }
    .TableBasic a:hover {
      text-decoration: underline;
    }
    .TableBasic a{
      display: flex;
    }    
    .TableBasic a > img {
      height: 19px;
      margin-right: 5px;
    }

  .PicNText {
    display:flex; 
    flex-wrap: nowrap; 
    align-items: center;
  }    
  .PicNText img {
    width: 26px;
    height: 26px;
    padding-right: 5px;
    filter: invert(0%) sepia(98%) saturate(0%) hue-rotate(13deg) brightness(95%) contrast(105%);
    opacity: 80%;      
  }

  .PicNText:hover img {
    filter: invert(12%) sepia(45%) saturate(6292%) hue-rotate(332deg) brightness(94%) contrast(95%);    
    opacity: 100%;  
  }  
  .PicNText div{
    color: var(--Green);
    font-size: 16px;
    font-family: FiraSans-Regular;    
  }
  
.ParagraphCnt p {
  line-height: 21px;  
}
.ProductFolderCnt{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-evenly;
}
  .ProductFolder {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
    margin: 5px;
    width: 164px;
    height: 311px;
    border: 1px solid var(--GreySoftLight);
    align-content: center;
    border-radius: 5px;
  }
  .ProductFolder:hover {
    border: 1px solid var(--MainDarkLight);
  }  
    .FolderDesc {
      display: flex;
      height: 65px;
      justify-content: center;
      text-align: center;
      padding: 4px;
      align-content: center;
      flex-direction: column;  
      font-family: FiraSans-Regular;    
    }
    
    .FolderPhoto img {
      border-radius: 5px;
    }
    
    .FolderAction {
      width: 100%;
      display: flex;
      justify-content: space-around;
      align-content: center;
      flex-direction: row;
      flex-wrap: wrap;
      align-items: center;   
      padding: 5px;  
    }
    
    .FolderAction a {
      color: var(--GreyDark);
      padding: 2px;
      font-family: FiraSans-Regular;
    }
    .FolderAction a:hover {
      color: var(--Green);
      text-decoration: underline;
    }    
  .ProductIESCnt {
    display: flex;
    width: 100%;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
    align-content: center;
  }
    .ProductIES {
      display: flex;
      flex-direction: column;
      flex-wrap: nowrap;
      align-content: center;
      align-items: center;
      justify-content: center;
      border: 1px solid var(--GreySoftLight);
      border-radius: 9px;
      padding: 5px;
      margin: 5px;
      width: 170px;
     }
    .ProductIES_FotoImg {
      height: 160px;
      width: 160px;
    }
    .ProductDwl_ico {
      margin-right: 5px;
    }

/* ########### Footer ########### */
.PageColorBar {
  margin-top: 10px;
  display: block;
  overflow: hidden;
  height: 4px;
  background: linear-gradient(-45deg, #7C1D75, #E73C7E, #23D5AB, #90AF12);
  background-size: 400% 400%;
  -webkit-animation: Gradient 25s ease infinite;
  -moz-animation: Gradient 25s ease infinite;
  animation: Gradient 25s ease infinite;  
}
@-webkit-keyframes Gradient {0% {background-position: 0% 50%}  50% {background-position: 100% 50%} 100% {background-position: 0% 50%}}
@-moz-keyframes Gradient { 0% {background-position: 0% 50%} 50% {background-position: 100% 50%} 100% {background-position: 0% 50%}}
@keyframes Gradient {0% {background-position: 0% 50%} 50% {background-position: 100% 50%} 100% {background-position: 0% 50%}}

.PageFooterCnt {
  background-color: var(--GreyMediumDark);
  min-height: 100px;
  display: flex;
  width: 100%;
  height: auto;
  padding-left: var(--MarginLeft);
  padding-right: var(--MarginRight); 
  color: var(--White);
  padding-top: 20px;
  padding-bottom: 20px;
}
.FooterBox {
  width: 100%;
  display: flex;
  justify-content: top;
  flex-direction: column;
  align-content: flex-start;
  align-items: flex-start;
  margin: 10px;
}
.FooterBoxHeader {
  display: contents;
}
.FooterTxt {
  margin-top: 15px;
  color: var(--GreyMediumLight);
  font-size: 11px;
  line-height: 18px;
}
.FooterTxt a {
  color: var(--GreyMediumLight);
}
.FooterTxt a:hover {
  color: var(--White);
}
.FooterTitle {
  font-size: 14px;
  height: 37px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.LineOnDark {
  width: 100%;
  height: 2px;
  background-color: var(--GreyDark);
  border-bottom: 1px solid var(--Grey);
}

/* ########### Top Bar ########### */
.PageLocation {
  margin: 2px;
  margin-left: 0px;
  padding: 3px;
  padding-left: 0px;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-content: space-between;
  align-items: center;
  font-family: FiraSans-SemiBold;  
  font-size: 12px;
  color: var(--MainColor);
}
.PageLocation a, .PageLocation a:visited, .PageLocation a:active {
  color: var(--Green);
}
.PageLocation a:hover {
  color: var(--MainColor);
  text-decoration: underline;
}
.PageLocation > a:first-child {
  color: var(--GreyDark);
}

.PageTopBarProducts {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-content: center;
  align-items: center;
    
  margin: 2px;
  margin-left: 0px;
  padding: 3px;
  padding-left: 0px;

  font-family: FiraSans-SemiBold;  
  font-size: 12px;
  color: var(--MainColor);

}
.PageTitleProducts {
  margin-right: auto;
  font-family: FiraSans-light;
  font-size: 32px;  
}
.OrderPageNumCnt {
  display: flex;
  flex-direction: row;
}
.PageTopBar {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-content: center;
  align-items: center;
  margin: 0px;
  padding: 0px;
  font-family: FiraSans-SemiBold;  
  font-size: 12px;
  color: var(--MainColor);

}
.PageTitle {
  margin-right: auto;
  font-family: FiraSans-Regular; 
  font-size: 30px;  
  margin-left: 25px;
}
.OnPageOrderCnt {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-lefT: 5px;
}
  
.OnPageOrder{
  display: flex;
  flex-direction: row;
  align-items: center;  
  color: var(--GreyDark);
}
.SelectorDrop {}

/* ########### Links ########### */
.MarginLess6 {margin-top: -6px;}
.LinkMore a {
  text-decoration: none;
  color: var(--MainColor);
  display: flex;
  align-items: center;  
  font-size: .85rem;
  background: var(--White);
  padding: .12rem;
  padding-left: .5rem;
  border-radius: 10px;
}
.LinkMore a:hover {
  color: var(--White);
  background: var(--MainColor);
}
.LinkMore a img {
  margin-left: .3rem;
  height: 17px;
  width: 17px;
}

/* ########### LoginForm ########### */

.FormCnt {
  margin: 5px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-content: space-between;
  align-items: flex-start;
  padding: 10px;
  padding-top: 0px;
  font-family: FiraSans-Light;  
  font-size: 20px;
}
.FormRow {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-content: space-between;
  align-items: flex-start;
  width: 100%;
  margin-top: 10px;
}
.FormRowCenter {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-content: center;
  align-items: center;
  width: 100%;
  margin-top: 10px;
}
  .InputDiv {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-content: center;
    align-items: center;
    width: 100%;
    flex-wrap: nowrap;
    box-sizing: border-box;
    border-radius: 5px;
    border: 1px solid var(--GreySoftLight);
    padding: 3px;
  }
  .InputDiv:hover {
    border: 1px solid var(--GreyMediumLight);
    box-shadow: rgba(0, 0, 0, 0.15) 0px 0px 10px;     
  }
  .InputDiv img {
    margin-left: 10px;
    margin-right: 10px;
    height: 16px;  
    opacity: 0.5;
  }
  .FormNoticeNegativeOutline{
    border-radius: 15px;
    background: var(--Red) !important;
    color: var(--White) !important;
    margin: 10px !important;
  }
  .FormNoticePositiveOutline{
    border-radius: 15px;
    background: var(--Green) !important;
    color: var(--White) !important;
    margin: 10px !important;
  }
  .FormNoticePositive {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-content: center;
    align-items: center;
    width: 100%;
    flex-wrap: nowrap;
    box-sizing: border-box;
    padding: 3px;    
    border: 0px;
    font-family: FiraSans-Regular;
    align-items: center;
    margin-top: 10px;
    margin-bottom: -10px;
    font-size: 16px;
    color: var(--GreyDark);
  }
  
  .FormNoticeNegative {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-content: center;
    align-items: center;
    width: 100%;
    flex-wrap: nowrap;
    box-sizing: border-box;
    padding: 3px;    
    border: 0px;
    font-family: FiraSans-Regular;
    align-items: center;
    margin-top: 10px;
    margin-bottom: -10px;
    font-size: 16px;
    color: var(--Red);
  }

.FormCnt input[type=text], input[type=email], input[type=password], textarea {
  width: 100%;
  color: var(--GreyDark); 
  display: flex;
  padding: 5px;
  background: transparent;
  border-left: 1px solid var(--GreySoftLight); 
  border: 0px;  
  font-size: 0.8em;
}

.FormCnt label {
  font-size: 15px;
  padding-bottom: 5px;
}

.FormCnt a {
  font-size: 14px;
  color: var(--Green);
  font-family: FiraSans-Regular;
}
.FormCnt a:hover {
  text-decoration: underline;
  color: var(--MainColor);
}

/* ########### Categories ########### */
.PanelCnt {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;  
  padding: 5px;
}
.CategoriesTitle {
  display: flex;
  font-size: 20px;
  color: var(--GreyDark);
  font-family: FiraSans-Regular;
  padding: 5px;
  margin-bottom: 10px; 
}
.CategoriesLink {
  margin: 0px;
  padding: 0px;
  cursor: pointer;
}
.CategoriesLinkEmpty {
  margin: 0px;
  padding: 0px;  
  color: var(--GreyMedium);
  cursor: pointer;
}
.CategoriesPosCnt {
  display: flex;
  justify-content: space-between;
  margin: 0px;
  padding: 5px;
  padding-left: 10px;
}
.CategoriesPosCnt:hover {
  border-radius: 15px;
  background: var(--GreyExtraLight);
}
.CategoriesPosCntSel {
  display: flex;
  justify-content: space-between;
  margin: 1px;
  padding: 5px;
  padding-left: 10px;
  border-radius: 15px;
  background: var(--Green);
  color: var(--White);
}
.CategoriesName {
  display: flex;
}
.CategoriesCount {
  display: flex;
}
a.CategoriesLink, a.CategoriesLink:visited, a.CategoriesLink:active {
  color:var(--MainColor);
  font-family: FiraSans-Regular;
  font-size: 14px;
  letter-spacing: -0.2px;
}
/* ########### Notices ########### */
.BasicNoticeCnt {
  display: flex;
  flex-direction: column;
  align-content: center;
  align-items: center;
  flex-wrap: nowrap;
  width: 100%;
}
  .BasicNoticeTitle {
    font-family: FiraSans-Medium;
    font-size: 28px;
    margin-bottom: 10px;
  }
  .BasicNoticeInfo {
    font-size: 18px;
  }

.BasicNoticeOne {
  display: flex;
  color: var(--GreyDark);
  font-size: 18px;
  justify-content: center;
  flex-direction: column;
  flex-wrap: nowrap;
  align-content: center;
  align-items: center;
  text-align: center;
  font-family: FiraSans-Regular;
}

/* ########### Buttons ########### */
.aBtnCirc {
  display: flex;
  margin: 0;
  padding: 4px;
  border-radius: 100px;
  height: 28px !important;
  width: 28px !important;
  margin: 3px;
  justify-content: center;
  align-items: center;  
}
.aBtnCirc img {
  height: 18px;
  width: 18px;
}
.BtnCnt {
  display: flex;
  align-items: center;
  margin-left: 5px;
  margin-right: 5px;
  justify-content: center;
  
}

a.aBtnLIcoTxt {
  display: flex;
  align-content: space-around;
  align-items: center;
  justify-content: space-between;  
  font-family: FiraSans-Regular;
  font-size: 17px;
  height: 28px;
  padding-left: 7px;
  padding-right: 10px;
  border-radius: 100px;
  text-decoration: none;
}
.BtnPCS {
  background: transparent;
  color: var(--GreyDark);
  font-size: 1.2rem;
  font-family: FiraSans-Regular;
  cursor: pointer;
}
a.aBtnLIcoTxt img {
  margin-right: 7px;
}

.colorBtnHead {
  color: var(--White);
  border: 1px solid var(--MainSuperLight);
  background: transparent;
}
.colorBtnHead:hover {
  background-color: var(--Green);
  border: 1px solid var(--LightGreen);
  color: var(--White);
}

.clrBtnSearch {
  background-color: var(--MainColor);
  border: 1px solid var(--MainColor);
  color: var(--White);
}
.clrBtnSearch:hover {
  background-color: var(--Green);
  border: 1px solid var(--Green);
  color: var(--White);
}
.colorBtnOrder {
  color: var(--GreyExtraLight);
  border: 0px solid var(--MainSuperLight);
  background: var(--Green);
}
.colorBtnOrder:hover  {
  color: var(--GreyExtraLight);
  border: 1px solid var(--MainSuperLight);
  background: var(--MainColor);
}
/* ########### DropDown Selector ########### */

.DropDownSelectorCnt {
  display: inline-grid;
  justify-content: right;
  margin-right: 0px;
  margin-left: 5px;
}

.DropDownSelectorSubCnt {
  font-family: FiraSans-Regular;
  font-size: 9pt;
  letter-spacing: 0.01pt;  
}

.DropDownSelector {
  align-items: center;
  display: flex;
  color: var(--GreyDark);
  background-color: var(--White);
  border: 1px solid var(--GreyMediumLight);
  border-radius: 100px; 
  padding-left: 4px;
  height: 24px;   
}

.DropDownSelector:hover {
  color: var(--White);
  background-color: var(--MainColor);
}
.DropDownSelectorSubCnt:hover > .DropDownSelector {
  color: var(--White);
  background-color: var(--MainColor);  
}
.DropDownSelector:hover + .DropDownSelectorList {
  display: block;
}

.DropDownSelectorCurr {
  align-items: center;
  display: flex;
  padding: 2px;
  width: 100%;
  cursor: pointer;
}

 img.DropDownSelectorArrow {
   margin-left: 2px;
   margin-right: 2px;
   transform: rotate(90deg);
   cursor: pointer;
 }
 
.DropDownSelectorList {
  display: none;
  position: absolute;
  z-index: 9999;
  background-color: var(--White);
  border-radius: 11px;
  padding: 0px;
  cursor: pointer;  
  width: 90px;
  padding: 4px;
  border: 1px solid var(--GreyMediumLight);
}
.DropDownSelectorList:hover {
  display: block;
}
.DropDownSelectorList a {
  color: var(--GreyDark);
}
.DropDownSelectorList a:visited {
  color: var(--GreyDark);
}
.DropDownSelectorListPos {
  align-items: center;
  display: flex;
  padding: 2px;
  padding-left: 5px;
  padding-right: 5px;
  font-size: 14px;
  width: 100%;
  cursor: pointer;
}

.DropDownSelectorListPos:hover {
  background-color: var(--GreyLight);
  border-radius: 10px;
}

/* ########### Page Number Selector ########### */
.PageNumSelectorCnt {
  align-items: center;
  display: flex;
  color: var(--GreyDark);
  background-color: var(--White);
  border: 1px solid var(--GreyMediumLight);
  border-radius: 100px; 
  margin-left: 4px;
  height: 24px;   
}
.PageNumSelectorArrow {
  align-items: center;
  display: flex;  
  margin-left: 2px;
  margin-right: 2px;
  height: 20px;
  width: 20px;
  border-radius: 100px;
  border: 0px;
  cursor: pointer;  
  background-image: url('../Images/SVG/Icons/Arrow.svg');
}
.PageNumSelectorArrow:hover {
  background-image: url('../Images/SVG/Icons/ArrowOver.svg');
}
.PageNumSelectorArrowDisabled {
  align-items: center;
  display: flex;  
  margin-left: 2px;
  margin-right: 2px;
  height: 20px;
  width: 20px;
  border-radius: 100px;
  border: 0px;
  cursor: default;   
  filter: grayscale(100%);
  opacity: 20%;
  background-image: url('../Images/SVG/Icons/Arrow.svg');
}
.PageNumSelector {
  align-items: center;
  display: flex;
  margin-left: 4px;
  margin-right: 4px;
  cursor: default; 
}
/* ########### Filters ########### */
.FilterCnt {
  display: flex;  
  align-items: flex-start;
  flex-direction: column;
  align-content: center;
  flex-wrap: nowrap;
  padding: 5px;
  font-family: FiraSans-Regular;
  font-size: 14px;
  color: var(--MainColor);
}
.FilterRow {
  display: flex;  
  align-items: center;
  padding-bottom: 2px;
  margin-bottom: 5px;
}
.FilterTitle {
  display: flex;  
  align-items: center;  
  font-family: FiraSans-Medium;
  font-size: 14px;
  color: var(--GreyDark);
}

.FilterActions {
  display: flex;
  justify-content: space-evenly;
}

.FilterRow input[type=number] {
  width: 80px;
  padding: 5px;
  margin: 3px;
  display: inline-block;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
  font-family: FiraSans-Medium;
  font-size: 14px;
  color: var(--GreyDark);
  text-align: center; 
}
.FilterRow input[type=decimal] {
  width: 80px;
  padding: 5px;
  margin: 3px;
  display: inline-block;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
  font-family: FiraSans-Medium;
  font-size: 14px;
  color: var(--GreyDark);
  text-align: center; 
}
.FilterSubmit {
  background-color: var(--Green);
  color: white;
  padding: 8px 14px;
  margin: 8px 0;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  font-family: FiraSans-Medium;
  font-size: 14px;  
}
.FilterSubmit:hover {
  background-color: var(--MainColor);
}

.ClearFilters {
  background-color: var(--Grey);
  color: white;
  padding: 8px 14px;
  margin: 8px 0;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  font-family: FiraSans-Medium;
  font-size: 14px;  
}
.ClearFilters:hover {
  background-color: var(--MainColor);
}

.FilterColorCnt {
  border-radius: 100px;
  margin-left: 2px;
  margin-right: 4px;
  width: 14px;
  border: 1px solid #c7c7c7;
}

/* CheckBox - Start */
.FilterRow input[type="checkbox"] {
	display:none;
}

.FilterRow input + label {
  display: flex;  
  align-items: center;
  flex-direction: row;
  flex-wrap: nowrap;  
	width: auto;
	height: 20px;
  padding-left: 25px;
	cursor: pointer;	
  background-image: url('../Images/SVG/Icons/CheckBox_Off.svg');
  background-repeat: no-repeat;
  
}
.FilterRow input[type="checkbox"]:checked + label {
  background-image: url('../Images/SVG/Icons/CheckBox_On.svg');
  background-repeat: no-repeat;
}
/* CheckBox - End */

/* Other */
.Disabled {
  filter: grayscale(100%);
  opacity: 70%;
}

/* ########### Lines ########### */
.GreyLine {
  border: 0px;
  border-top: 1px solid var(--GreyMediumLight);
  width: 100%;
}
/* ########### Form Buttons Grey2Color ########### */

.ButtonForm {
  font-size: 20px;
  font-family: FiraSans-Light;
  border-radius: 100px;
  border: 0px;
  cursor: pointer;
  padding: 5px;
  padding-left: 20px;
  padding-right: 20px;
}
.ButtonFormSmall {
  font-size: 16px;
  font-family: FiraSans-Light;
  border-radius: 100px;
  border: 0px;
  cursor: pointer;
  padding: 4px;
  padding-left: 10px;
  padding-right: 10px;
}
.bckMainColor {
  background-color: var(--MainColor);
  color: var(--White);
}
.bckMainColor:hover {
  background-color: var(--MainDarkLight);
  color: var(--White);
}
.bckLightGreen{
  background-color: var(--LightGreen2);
  color: var(--White);
}
.bckLightGreen:hover {
  background-color: var(--LightBlue);
  color: var(--White);
}
.colorButtonFormGreen {
  background-color: var(--Green);
  border: 0px solid var(--LightGreen);
  color: var(--White);
}

/* ########### Cart slider ########### */
.CartSlideCnt {
  display: none;
  height: 100%;
  width: 285px;
  position: fixed !important;
  z-index: 99;
  top: 93px;
  right: 0;
  background-color: var(--White);
  border-left: 1px solid var(--GreyMediumLight);
  box-shadow: 2px 0px 10px 0px var( --GreyMediumDark);
  border-right: 1px solid var( --GreyMedium);
  overflow-x: hidden;
  padding: 0px;
  transition: 0.5s;
  padding-bottom: 200px;
}
.CartSlideCntShow {
    display: block;
}
.CartSlideCntHide {
    display: none;
}
.CartSlideCnt-animate-right{
  position:relative;
  animation:animateright 0.4s;
}
@keyframes animateright{
  from{right:-200px;opacity:0} 
  to{right:0;opacity:1}
}
.CartJSCnt {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
}
.CartJS {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
}
.CartSlideCntRow {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  align-content: center;
  width: 100%;
  height: 78px;
  border-top: 1px solid var(--GreyMediumLight);
  padding-top:5px;
}
.CartSlideCntRow * {
  border: 0px solid lightgrey;
}
  .CartSlideOrderPosPhoto {
    height: 100%;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    margin-right: 5px;
  }

    .CartSlideOrderPosPhotoIMG {
      width: 60px;
      border-radius: 4px;
      border: 0px solid var(--GreyLight);
    }
    
  .CartSlideOrderPosTextCnt {
    display: flex;
    width: 100%;
    height: 100%;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: flex-start;
    justify-content: flex-start;
    align-content: flex-start;
}
  .CartSlideOrderPosTextRow1 {
    font-family: 'FiraSans-Medium';
    color: var(--MainColor);
    font-size: 14px;
    width: 100%;
  }
  .CartSlideOrderPosTextRow2 {
    font-family: 'FiraSans-Medium';
    color: var(--Grey);
    font-size: 14px;
    width: 100%;
  }
  .CartSlideOrderPosTextRow3 {
    font-family: 'FiraSans-Regular';
    color: var(--Black);
    font-size: 10px;
    width: 100%;
  }
  .CartSlideOrderPosTextRow4 {
    font-family: 'FiraSans-Medium';
    color: var(--Black);
    font-size: 14px;
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: flex-end;    
  }

.CartSlideOrderPosAction {
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 8px;
  font-family: FiraSans-Medium;  
}
  .CartSlideOrderPosActionBtn {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;    
    padding: 5px;
    border: 0px solid var(--GreyMediumLight);
    font-size: 10px;
    border-radius: 4px;
    background: var(--White);
    cursor: pointer;
  }
  .CartSlideOrderPosActionBtn:hover {
    background: var(--GreySoftLight);
  }
  .CartSlideTotalCnt {
    padding-top: 15px;
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-end;
    align-items: center;
    align-content: flex-end;
    flex-direction: column;
    font-size: 22px;
    border-top: 1px solid var(--GreyMediumLight);
    font-family: FiraSans-Medium;
    color: var(--Green);    
    background: rgb(209,209,209);
    background: linear-gradient(180deg, rgba(209,209,209,1) 0%, rgba(252,252,252,1) 32%);   

  }
  .CartSlideTotalCnt small {
    font-size: 12px; 
    margin-right: 5px;
  }

  .CartSlideHeader {
    display: flex;
    flex-direction: row;
    align-content: center;
    justify-content: center;
    align-items: baseline;
    flex-wrap: nowrap;
    font-family: FiraSans-Medium;
    color: var(--Green);
    font-size: 20px;
    padding-top: 5px;
    padding-bottom: 5px;
    background: var(--GreyExtraLight);
  }

  .CartSliderHeaderOptions {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    align-items: center;
    justify-content: space-between;
    background: var(--GreyExtraLight);
    
  }
 
  .CartSlideHeaderRow2 {
    display: flex;
    flex-direction: row;
    align-content: center;
    justify-content: center;
    align-items: baseline;
    flex-wrap: nowrap;
    font-family: FiraSans-Medium;
    color: var(--Green);
    font-size: 14px;
    background: transparent;
    padding: 10px;
  }

  .CartSlideClose {
    display: flex;
    font-size: 14px;
    font-family: 'FiraSans-Medium';
    flex-direction: row;
    text-transform: uppercase;
    color: var(--Green);
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    margin-top: 15px;
    padding-top: 15px;
    border-top: 1px solid lightgrey;
    cursor: pointer;
  }

  .RefreshIcon {
    height: 18px;
    cursor: pointer;
    transition: transform .4s ease-in-out;
    opacity: 0.5;
  }
  .RefreshIcon:hover {
    transform: rotate(360deg);
  }
  .PinIconIn {
    margin-top: -5px;
    height: 22.8px;
    width: 12px;
    cursor: pointer;
    transition: transform .4s ease-in-out;
    opacity: 1;
    background-image: url('../Images/SVG/Icons/PinIn.svg');
    background-attachment: initial;
    background-repeat: no-repeat;  
    background-position: center bottom;     
    border: 0px;
  }
  .PinIconIn:hover {
    /* transform: rotate(360deg); */
    background-image: url('../Images/SVG/Icons/PinOut.svg');
  }
  .PinIconOut {
    margin-top: -5px;
    height: 22.8px;
    width: 12px;
    cursor: pointer;
    transition: transform .4s ease-in-out;
    opacity: 1;
    background-image: url('../Images/SVG/Icons/PinOut.svg');
    background-attachment: initial;
    background-repeat: no-repeat;  
    background-position: center bottom;     
    border: 0px;
  }
  .PinIconOut:hover {
    /* transform: rotate(360deg); */
    background-image: url('../Images/SVG/Icons/PinIn.svg');
  }
/* ########### Orders ########### */

.OrderHeaderRow {
  display: flex;
  flex-wrap: nowrap;
  flex-direction: row;
  justify-content: flex-start;
  align-content: center;
  align-items: flex-end;
  padding: 10px;
  border-bottom: 1px solid var(--GreyMedium);
  margin: 0px;
  color: var(--GreyDark);
}
.OrderHeaderRow * {
  margin: 2px;
}
.OrderHeaderRowTitle {
  font-family: 'FiraSans-Regular';
  font-size: 14px; 
  width: 120px;
}
.OrderHeaderRowValue {
  font-family: 'FiraSans-Medium';
  font-size: 17px;
  width: 200px;
}
.OrderRow * {
  border: 0px solid lightgrey;
}

.ClassDisabled, .ClassDisabled:hover, .ClassDisabled * {
  background-image: linear-gradient(45deg, #e8e8e8 10.53%, #f5f5f5 10.53%, #f5f5f5 50%, #e8e8e8 50%, #e8e8e8 60.53%, #f5f5f5 60.53%, #f5f5f5 100%);
  background-size: 26.87px 26.87px;
  color: var(--GreyDark) !important;
}


.OrderRow {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-content: center;
  justify-content: space-around;
  width: 100%;
  min-height: 70px;
  margin-bottom: 4px;
  margin-top: 4px;
  padding-top: 4px;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--GreySoftLight);
  align-items: center;
}
.OrderRow:hover {
  background: var(--GreyLight)
}
  .OrderCell {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    height: 100%;
    font-family: 'FiraSans-Regular';
    background: transparent;
  }

  .OrderCellSubRowTitle {
    font-family: 'FiraSans-Regular';
    font-size: 12px;
    color: var(--Black);
  }

  .OrderCell_lp {
    width: 20px !important;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: flex-start;
    align-items: center;
    justify-content: center;
  }

  .OrderCell_Photo {
    width: 70px !important;
    margin-right: 14px;
  }
    .OrderCell_Photo img {
      width: 70px !important;
      height: 70px !important;
    }


  .OrderCell_Text {
    min-width: 180px;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: flex-start;
    align-items: flex-start;
    justify-content: center;
    margin-left: 2px;
  }
    .OrderCell_Text_ProductName{
      font-family: 'FiraSans-Medium';
      font-size: 18px;
      color: var(--MainColor);
    }
    .OrderCell_Text_ProductModel{
      font-family: 'FiraSans-Medium';
      font-size: 14px;
      color: var(--Black);
    }
    .OrderCell_Text_ProductIndeks{
      font-family: 'FiraSans-Regular';
      font-size: 11px;
      color: var(--Black);
      margin-top: 4px;
    }


  .OrderCell_PCS {
    min-width: 100px;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: flex-start;
    align-items: center;
    justify-content: center;
  }
  
  .OrderCell_PCS_Input input {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    border: 1px solid var(--GreyMediumLight) !important;
    margin: 1px;
    padding-left: 5px;
    padding-right: 5px;
    border-radius: 16px;
    margin-top: 10px;
    color: var(--GreyMediumDark);
    font-size: 17px;
    width: 50px;
    text-align: center;    
  }

  .OrderCell_Price {
    min-width: 100px;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
  }
    .OrderCell_Price_PromoTitle {
      font-family: 'FiraSans-Regular';
      font-size: 11px;
      color: var(--White);
      background: var(--Red);
      padding: 3px;
      padding-top: 1px;
      padding-bottom: 1px;
      border-radius: 99px;
    }
    .OrderCell_Price_PromoValue {
      font-family: 'FiraSans-Medium';
      font-size: 14px;
      color: var(--Red);  
    }

    .OrderCell_Price_NormalTitle {
      font-family: 'FiraSans-Regular';
      font-size: 11px;
      color: var(--Black);
    }
    
    .OrderCell_Price_NormalValue {
      font-family: 'FiraSans-Medium';
      font-size: 14px;
      color: var(--Black);  
    }

    .OrderCell_Price_NormalValueBigger {
      padding-top: 5px;
      font-family: 'FiraSans-Medium';
      font-size: 20px;
      color: var(--Black);  
    }
  .OrderCell_Total {
    min-width: 110px;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
  }

  .OrderCell_Textarea {
    width: 100%;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
  }
  .OrderCell_Textarea textarea {
    width: 100%;
    height: 120px;
    border: 1px solid var(--GreyMedium);
    border-radius: 5px;
  }

  .OrderCell_List {
    width: 100%;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: flex-start;
    padding: 5px;
  }
  .OrderAttachmentFile {
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: flex-start;
    align-items: flex-start;
    padding: 5px;
    border-bottom: 1px solid var(--GreyMediumLight);
  }
  .OrderAttachmentFile a.OrderAttachmentFileDownload{
    font-size: 16px;
    font-family: 'FiraSans-Regular';
    color: var(--MainColor);
    text-decoration: none;
  }
  .OrderAttachmentFile a.OrderAttachmentFileDownload:hover{
    font-size: 16px;
    font-family: 'FiraSans-Regular';
    color: var(--MainDark);
    text-decoration: underline;
  }
  .OrderAttachmentFile a.OrderAttachmentFileRemove{
    margin-left: 10px;
    font-size: 16px;
    font-family: 'FiraSans-Regular';
    color: var(--Blue);
    text-decoration: none;
  }
  .OrderAttachmentFile a.OrderAttachmentFileRemove:hover{
    font-size: 16px;
    font-family: 'FiraSans-Regular';
    color: var(--LightBlue);
    text-decoration: underline;
  }


  .OrderCell_Action {
    min-width: 50px;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
  }

  .OrderCell_Btn {
    padding: 3px;
    padding-left: 10px;
    padding-right: 10px;
    border: 1px solid var(--GreySoftLight);
    background: var(--White);
    border-radius: 99px;
    cursor: pointer;
    margin: 2px;
    margin-left: 6px;
    margin-right: 6px;
  }

  .OrderCell_Btn:hover {
    background: var(--White);
    color: var(--Green);
  }

  .OrderCell_BtnGreen {
    display: flex;
    background: var(--Green);
    color: var(--White);

    font-size: 20px;
    font-family: FiraSans-Regular;
    border-radius: 100px;
    border: 0px;
    cursor: pointer;
    padding: 10px;
    padding-left: 20px;
    padding-right: 20px;
    margin: 10px; 
  }
  .OrderCell_BtnRed {
    display: flex;
    background: var(--MainColor);
    color: var(--White);

    font-size: 20px;
    font-family: FiraSans-Regular;
    border-radius: 100px;
    border: 0px;
    cursor: pointer;
    padding: 10px;
    padding-left: 20px;
    padding-right: 20px; 
    margin: 10px;   
  }

/*
  .OrderCell_BtnGreen {
    display: flex;
    background: var(--Green);
    color: var(--White);
    font-size: 24;
    font-family: 'FiraSans-Regular';
    padding: 20px;
    border-radius: 5px;
    cursor: pointer;
    transition-property: font-size;
    transition-duration: 4s;
    transition-delay: 2s;
  }

  .OrderCell_BtnRed {
    display: flex;
    background: var(--MainColor);
    color: var(--White);
    font-size: 24;
    font-family: 'FiraSans-Regular';
    padding: 20px;
    border-radius: 5px;
    cursor: pointer;
  }
*/
  .OrderSummary_Attention {
    display: flex;
    font-family: 'FiraSans-Italic';
    margin-top: 5px;
    margin-bottom: 5px;
    padding: 2px;
    align-content: center;
    align-items: center;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    font-size: 13px;

  }
  .OrderSummary_Attention img {
    margin-right: 8px;
    height: 26px;
    padding: 0px;
    border-radius: 100px;
    border: 1px solid var(--GreyMediumLight);
  }
  .OrderComments {
    color: var(--Black);
    font-size: 16px;
    padding: 5px;
    font-family: 'FiraSans-Regular';
  }

  .OrderList {
    display: flex;
    flex-direction: column;
    font-size: 16px;
    font-family: 'FiraSans-Regular';    
  }
    .OrderListRow {
      display: flex;
      flex-direction: row;
      flex-wrap: nowrap;
      margin: 3px;
      padding: 5px;
      padding-left: 10px;
      padding-right: 10px;
      color: var(--GreyDark);
      border: 1px solid var(--GreyMedium);
      border-radius: 20px;
    }
    .OrderListRow:hover {
      background: var(--Green);
      color: var(--White);
    }
      .OrderListDate {
        display: flex;
        margin: 3px;
        margin-right: 10px;
      }
      .OrderListTitle {
        display: flex;
        margin: 3px;
      }      
/* ########### MyAccountCnt ########### */
  .MyAccountCnt {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: flex-start;
    width: 300px;
  }
    .MyAccountRow {
      display: flex;
      flex-direction: row;
      flex-wrap: nowrap;
      align-content: center;
      justify-content: center;
      align-items: center;
    }  
    .MyAccountRow * {margin: 5px;}
    .MyAccountTitle {
      display: flex;
      flex-direction: row;
      flex-wrap: nowrap;
      align-content: center;
      justify-content: flex-start;
      font-family: 'FiraSans-Regular';
      font-size: 14px;
      min-height: 20px;
      align-items: flex-end;
      min-width: 120px;
    }      
    .MyAccountVal {
      display: flex;
      flex-direction: column;
      flex-wrap: nowrap;
      align-content: center;
      justify-content: center;
      font-family: 'FiraSans-Medium';
      font-size: 16px;
      min-height: 20px;
      align-items: flex-start;
      text-align: left;
    }      

    .MyAccountHeader {
      font-family: 'FiraSans-Regular';
      font-size: 22px;
      padding: 5px;
      color: var(--MainColor);
      font-weight: normal;
    }
  /* User menu */
    .UserMenu_Cnt {
      display: flex;
      justify-content: center;
      align-content: center;
      align-items: center;
      flex-direction: row;
      flex-wrap: wrap;
    }
    
    .UserMenuPos_Cnt {
      margin: 2px;
    }
      .UserMenuPos_Txt {
        background-color: var(--Grey);
        color: white;
        border: 1px solid var(--Grey);
        padding: 8px 14px;
        margin: 8px 0;
        border-radius: 4px;
        cursor: pointer;
        font-family: FiraSans-Regular;
        font-size: 14px;
      }
      .UserMenuPos_Txt:hover {
        background-color: white;
        color: var(--Grey);
        border: 1px solid var(--Grey);
      }
      .UserMenuPos_TxtRed {
        background-color: var(--MainColor);
        color: white;
        border: 1px solid var(--MainColor);
        padding: 8px 14px;
        margin: 8px 0;
        border-radius: 4px;
        cursor: pointer;
        font-family: FiraSans-Regular;
        font-size: 14px;
      }
      .UserMenuPos_TxtRed:hover {
        background-color: white;
        color: var(--MainColor);
        border: 1px solid var(--MainColor);
      }

/* ########### Tabele ########### */
.TableCnt {
  display: grid;
  grid-gap: 0px;
  grid-template-columns: 30% auto;
  font-size: 16px;
  font-family: FiraSans-Regular;
}

.TableSmallCnt {
  width: 100%;
  display: grid;
  grid-gap: 0px;
  grid-template-columns: 30% auto;
  font-family: FiraSans-Regular;
}

.TableOneColCnt {
  display: grid;
  grid-gap: 0px;
  grid-template-columns: 100%;
  font-family: FiraSans-Regular;
  font-size: 16px;
}
  
.TableCellTitle {
  color: var(--Black);
  padding: 10px;
  min-height: 36px;
  border-bottom: 1px solid var(--GreySoftLight); 
  font-family: FiraSans-Regular;
  font-size: 11px;
  white-space: nowrap;
}
.TableCellValue {
  display: flex;
  align-items: flex-end;
  color: var(--Green);
  padding: 10px;
  min-height: 36px;
  border-bottom: 1px solid var(--GreySoftLight);
  font-family: 'FiraSans-Medium';
  font-size: 14px;
}
.ListUl {
  padding: 0px;
  margin: 0px;
  padding-left: 16px;
}
.ListUl li {
  margin-bottom: 5px;
}
.TableSmallCnt >.TableCellTitle {
  display: flex;
  font-size: 11px;
  line-height: 20px;
}

/* ########### splide - karuzela ########### */
#NewsBox {
  cursor: pointer;
}
#NewsBox .splide__arrows {
  display: none;
}
#NewsBox:hover .splide__arrows {
  display: block;
}

#NewsBox .splide__arrow img {
  height: 3em;
  width: 3em;
  opacity: 0.5;  
}

/* Columns */

.Col10 {
  display: flex;
  width: 10%;
}
.Col20 {
  display: flex;
  width: 20%;
}
.Col25 {
  display: flex;
  width: 25%;
}
.Col30 {
  display: flex;
  width: 30%;
}
.Col40 {
  display: flex;
  width: 40%;
}
.Col50 {
  display: flex;
  width: 50%;
}
.Col60 {
  display: flex;
  width: 60%;
}
.Col70 {
  display: flex;
  width: 70%;
}
.Col75 {
  display: flex;
  width: 75%;
}
.Col80 {
  display: flex;
  width: 80%;
}

/* ########### Service ########### */
.Pre {
  /* position: absolute; */
  display: inline-flex;
  z-index: 2500;
  opacity: 0.8;
}
.Pre pre {
  background: lightyellow;
  border: 1px solid lightgrey;
  border-radius: 10px;
  padding: 5px;
  font-size: 12px;
}

/* ########### FancyBox ########### */
.FancyCaptionIndex {
  font-size: 24px;
  opacity: 0.65
}
.FancyCaptionName {
  font-size: 28px;
}
.fancybox__thumbs .carousel__slide .fancybox__thumb::after{
    content:"";
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    border-width:5px;
    border-style:solid;
    border-color:var(--fancybox-accent-color, rgba(146, 20, 54, 1));opacity:0;transition:opacity .15s ease;border-radius:var(--fancybox-thumbs-border-radius, 4px)
  }
  .fancybox__button--slideshow {
    display: none;
  }  
  .fancybox__button--fullscreen  {
    display: none;
  }  
  .fancybox__button--thumbs {
    display: none;
  }  

/* ########### Upload form ########### */
.UploadForm {
  width: 100%;
  margin-top: 10px;
}
.UploadForm form {
  width: 100%;
  padding: 5px;
  margin: 5px;
  }
.UploadForm input[type=file] {
  color: var(--GreyDark);
  margin-right: 10px;
  font-size: 16px;
  font-family: FiraSans-Light;  
}

.UploadForm input::file-selector-button {
  font-size: 16px;
  font-family: FiraSans-Light;
  border-radius: 100px;
  border: 0px;
  cursor: pointer;
  padding: 3px;
  padding-left: 10px;
  padding-right: 10px;
  background-color: var(--LightGreen2);
  color: var(--White);
}

/* ########### Print ########### */
@media print {    
   * {
    zoom: 0.99;
   }
    @page {
      size: A4;
    }
    #PrintHeader {
      display: flex !important;
      flex-wrap: nowrap;
      flex-direction: row;
      align-content: center;
      align-items: flex-end;
      justify-content: space-between;
    }
    
    .noPrint, .noPrint * {
        display: none !important;
    }
    .PageContent {
      margin-top: 0px !important;
    }
    .PageContainer {
      margin-top: 0px !important;
      width: 100%;
      display: flex;
    }
    .DefaultBox {
      padding: 13px;
      width: 100%;
      margin: 5px;
    }
    .PageTextHeader2 {
      font-family: 'FiraSans-Regular';
      font-size: 14px; 

    }
}