
@font-face {
	font-family: 'brix';
	font-weight: 900;
	font-style: normal;
	src: url('../fonts/BrixSansBlack.woff') format('woff');
}

@font-face {
	font-family: 'brix';
	font-weight: 700;
	font-style: normal;
	src: url('../fonts/BrixSansBold.woff') format('woff');
}

@font-face {
	font-family: 'brix';
	font-weight: 400;
	font-style: normal;
	src: url('../fonts/BrixSansRegular.woff') format('woff');
}

@font-face {
	font-family: 'brix';
	font-weight: 500;
	font-style: normal;
	src: url('../fonts/BrixSansMedium.woff') format('woff');
}

@font-face {
	font-family: 'brix';
	font-weight: 300;
	font-style: normal;
	src: url('../fonts/BrixSansLight.woff') format('woff');
}

@font-face {
	font-family: 'brandont';
	font-weight: 300;
	font-style: normal;
	src: url('../fonts/BrandonText-Light.woff') format('woff');
}

@font-face {
	font-family: 'brandont';
	font-weight: 700;
	font-style: normal;
	src: url('../fonts/BrandonText-Bold.woff') format('woff');
}

@font-face {
	font-family: 'brandont';
	font-weight: 500;
	font-style: normal;
	src: url('../fonts/BrandonText-Medium.woff') format('woff');
}

@font-face {
	font-family: 'brandont';
	font-weight: 400;
	font-style: normal;
	src: url('../fonts/BrandonText-Regular.woff') format('woff');
}

@font-face {
	font-family: 'brandon';
	font-weight: 900;
	font-style: normal;
	src: url('../fonts/brandon_blk.woff') format('woff');
}

@font-face {
	font-family: 'brandon';
	font-weight: 700;
	font-style: normal;
	src: url('../fonts/brandon_bld.woff') format('woff');
}

@font-face {
	font-family: 'brandon';
	font-weight: 500;
	font-style: normal;
	src: url('../fonts/brandon_med.woff') format('woff');
}

@font-face {
	font-family: 'brandon';
	font-weight: 400;
	font-style: normal;
	src: url('../fonts/brandon_reg.woff') format('woff');
}
@font-face {
	font-family: 'haffer';
	font-style: normal;
	src: url('../fonts/HafferVF.woff') format('woff');
}

:root {

    --alias-easeOut: cubic-bezier(0.430, 0.195, 0.020, 1.000);
    --alias-easeIn: cubic-bezier(0.485, 0.050, 0.445, 0.855);
    --alias-easeOutQuint: cubic-bezier(0.230, 1.000, 0.320, 1.000);
    --alias-easeOut2: cubic-bezier(0.9, 0.1, 0.15, 1.05);
    --alias-easeOut3: cubic-bezier(0.630, 0.195, 0.010, 1.000);
    --alias-easeOutSlow: cubic-bezier(.43,.195,.02,1);
    --alias-easeInOutQuint: cubic-bezier(0.860, 0.000, 0.070, 1.000);
    --alias-easeInOutQuart: cubic-bezier(0.770, 0.000, 0.175, 1.000);
    --alias-easeInOutCubic: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    --alias-easeOutCubic: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}

.max-960 {   width: 960px; }
.img-200{max-width:200px}
body {
font-family:brix}

        h1 {
            font-size: 2em;
        }
        h2 {
            font-size: 1.5em;
        }
        h3 {
            font-size: 1.2em;
        }
h1,h2,h3,h4 {color:white}
li {color:white}
#background-video {
height: auto;
    width: 100%;
    float: left;
    z-index: 0;
    overflow-y: hidden;
    top: 0;
    margin-top: -50px;
    position: fixed;
}

        .background-total {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            overflow: hidden; /* Prevents overflow issues */
            z-index: -1; /* Places it behind other content */
        }

        /* Transparent overlay */
        .transparent-overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.5); /* Adjust the color and opacity as needed */
           
    background: rgb(49 49 56 / 80%); /* Adjust the color and opacity as needed */
            pointer-events: none; /* Allows clicks to pass through the overlay */
        }

        /* Ensure the video is properly positioned */
        #background-video {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        /* Ensures body content is above the video */
        body {
            position: relative;
            z-index: 1;
            background: transparent; /* Ensure background is transparent to show the video */
        }
	.banner-content img{ margin-right: 3px;
    margin-top: -2px;
    color: white;
    filter: invert(1);
    width: 24px;
height: auto;} 
.banner-content span{  
  display: inline-block;
  padding-left: 100%;
    padding-right: 90px;
  animation: marquee 60s linear infinite;animation-delay: -40s;}
.banner-content { 
 margin: 0 auto;
  white-space: nowrap;
  overflow: hidden;
    width: 100%;
  position: absolute;
}
.banner-content2 span{  animation-delay: -20s;}  
.banner-content3 span{  animation-delay: 0s;}  

@keyframes marquee {
  0% {
    transform: translate(0, 0);
  }
  100% {
    transform: translate(-100%, 0);
  }
}

@keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

.fade-in { animation: fadeIn 1s; }
:root {
  --first-color: #16f;
  --second-color: #ff7;
}


.hero-section, .card{
    border: 1px solid black;
    border-radius: 15px;
    padding-right: 20px;
    padding-left: 20px;
    background-color: #ffffff;
    box-shadow: 5px 5px 0px #ffb100;
	background-color: rgb(131 126 126) !important;

}

.w-300 {width:300px}
.w-300 {width:200px}
.inside-row .item-list li {
	margin-top:10px;float:left;
    border-radius: 2rem;
    color: #000;
}
img {max-width:100%;height:auto}
svg.svg {width:30px;height:auto;fill:#DF3132}

footer b {
    font-weight: 700;
}
.pagination {margin-top:12px}
.btn-dark {border-radius:30px;
font-weight: 500;}
.path-frontpage .view-product-block .row > .col-xl-2 {
	width:20%!important
}
.site-footer {
    background: transparent;
}
#block-serious-highlightedblock a,
#block-serious-highlightedblock a:hover,
#block-serious-highlightedblock a:focus
{
	
    color: inherit;
}
#block-serious-highlightedblock {
font-size:15px;
font-weight:500;
padding: 5px 0px;
    margin-left: auto;
}
#block-serious-highlightedblock .d-flex div:hover {color: #fdb813;}
#block-serious-highlightedblock .d-flex div img {  filter: none;
    filter: invert(30%) sepia(64%) saturate(7473%) hue-rotate(348deg) brightness(95%) contrast(83%); }
#block-serious-highlightedblock .d-flex div:hover img { }
#block-serious-highlightedblock .analytics img {margin-right:1px;margin-top:3px;}
#block-serious-highlightedblock .meeting img {margin-right: 4px;margin-top: 0px;}
#block-serious-highlightedblock .mail img {margin-right:3px;margin-top:6px;}

#navbar-main svg {max-width:200px}


.tabs ul.primary li a.is-active {
  background-color: #fff;
}

.tabs ul.primary li.is-active a {
  background-color: #fff;
  border-bottom-color: #fff;
}

#navbar-top {
  background-color: inherit;
}

#navbar-main {
  background-color: inherit;
}

a,
.link {
  color: #0071b3;
}

a:hover,
a:focus,
.link:hover,
.link:focus {
  color: #018fe2;
}

a:active,
.link:active {
  color: #23aeff;
}
.page-item .page-link {
    background-color: #00000022;
    border-color: white;
    font-weight: 700;
    border-radius: 20px;
    color: black;
    margin-right: 6px;
    font-size: 14px;
    padding: 2px 10px;
}
.page-item:last-child .page-link {border-radius:20px!important}
.page-item:first-child .page-link {border-radius:20px!important}
.page-item.active .page-link {
    background-color: #000000;
    border-color: #000000;
    font-weight: 700;
    border-radius: 20px;
	color:white;
}

.page-link,
.page-link:hover {
  color: #0071b3;
}
.tbm-item.level-2{padding-left:12px;border-radius:10px}

.tbm-item.level-2:hover{
	background:#0001;
	background:#ffe8e8;
    background: #ffe0db;
	}

.tbm-seriotica .tbm-link::after{

    content: "new";
    font-size: 14px;
    background: #9e1010;
    color: white;
    font-weight: 700;
    position: absolute;
    top: 10px;
    left: 74px;
    padding: 1px 5px;
    padding-top: 0;
    border-radius: 8px;
}
.tbm-serious-7 .tbm-link::after{

    content: "new";
    font-size: 14px;
    background: #9e1010;
    color: white;
    font-weight: 700;
    position: absolute;
    top: 10px;
    left: 76px;
    padding: 1px 5px;
    padding-top: 0;
    border-radius: 8px;
}
.tbm-link{
	
    font-weight: 700;
}

.tbm-caption{
	
    font-weight: 500;color:#888;
	font-size:17px;
    margin: 0;
}

.tbm-submenu {
    border-radius: 20px;
    box-shadow: none;
border: none;}
.tbm-item.mobile-seeds, .tbm-item.cart-menu {
display:none
}



#block-serious-dropdownlanguage {

    position: absolute;
	right:0;
}

.sidebar .block {
	
  
  border-radius: 20px;
  border:none;
    background: #0001;
    background: #ffc9ad;
    background: #ffd8c3;
    background: #f3ede4;
}
#page .ui-widget {
    font-family: 'brix';
}
.ui-accordion .ui-accordion-header {
    padding-left: 0;
}


   .tb-megamenu .nav-collapse.collapse {
     z-index: 999;
     display: block;
   }
   #block-serious-mainnavigation{
   margin-left: 10%;}
.tbm-main {
	width: 100%;
	margin-top:20px } 
.tbm { 
    background-color: transparent;
}

.tbm-link.level-1:hover, .tbm-link.level-1:focus {
    background-color: transparent;
}

.tbm-link.level-1:hover, .tbm-link.level-1:focus {
    background-color: #0001;border-radius:20px;
}

.tbm-link.level-1 {  font-weight: 500;
    font-size: 19px;
    margin: 1rem 1rem;
    padding: 6px 12px;
    font-family: brandon;

}
.tbm-item.level-1 {
    border-right: 0;
	padding:2px 4px;
}


.tbm-submenu {
    border-radius: 20px;
    box-shadow: none;
border: none;}
.tbm-item.mobile-seeds, .tbm-item.cart-menu {
display:none
}



#block-serious-dropdownlanguage {

    position: absolute;
	right:0;
}
.region-top-header {
    margin: 0 !important;
}

.scrolling-banner {
    background-color: #b13e3e;
    background-color: #BF3644;
    background-color: #870000;
    box-shadow: none;
    color: white;
    font-size: 15px;
    padding-top: 8px;
    width: 100%;
    overflow: hidden;
    display: flex;
    white-space: nowrap;
    height: 39px;
    font-weight: 700;
} 
.tbm-subnav>.tbm-item>.tbm-link-container>.tbm-link {
    color: #222;
color: #9d1616;}
.tbm-caption {
    font-weight: 500;
    color: #888;
    font-size: 17px;
    margin: 0;
}
body a:active, body .link:active {
    color: #FEAF43 !important;
}
.tbm-subnav>.tbm-item {
    display: block;
    list-style: none;
}
a {
    text-decoration: none;
}
.tbm-link.level-1 {
color: #fff;}
.tbm-link.level-1:hover {
color: #fff;color: #FEAF43 !important;
}
.tooltip-initialized {
    cursor: pointer;
}
#navbar-main a img {width:175px}

	p{color:white}
	
	.hero{text-align:center;font-size:30px;
font-weight:500}
	.hero .top-text{
font-weight:300;

    border-bottom: 2px solid;padding-bottom:20px}

.hero {
    text-align: center;
    display: block;
}

.yellow {
color: #fdb813;}
#caption {
    padding: 0px;
    display: inline-block;
    position: relative;
    vertical-align: bottom;
    
    -webkit-transition: width 0.25s linear;
    -moz-transition: width 0.25s linear;
    -ms-transition: width 0.25s linear;
    -o-transition: width 0.25s linear;
    transition: width 0.25s linear; 
}

#caption > span {
    display: none;
    position: absolute;
    top: 0px;
    left: 0px;
	
    white-space: nowrap;
}

#caption > span:first-child {
    display: inline-block;
}
.hero-container {
    display: flex;
    justify-content: center;
    align-items: center;
}

.hero {
    display: inline-block;
    text-align: center;
    padding: 20px; /* Adjust padding as needed */
    box-sizing: border-box;
}

#caption {
    padding: 0px;
    display: inline-block;
    position: relative;
    vertical-align: bottom;

    -webkit-transition: width 0.25s linear;
    -moz-transition: width 0.25s linear;
    -ms-transition: width 0.25s linear;
    -o-transition: width 0.25s linear;
    transition: width 0.25s linear;
}

#caption > .yellow {
    display: none;
    position: absolute;
    top: 0px;
    left: 0px;
}

#caption > .yellow:first-child {
    display: inline-block;
    position: relative;
}

.logo-overlay {
    position: absolute;
    display: flex;
	    position: fixed;
    left: 0;
    width: 100%;
    height: 100%;
    justify-content: center;
    align-items: center;
    z-index: 1000;
    overflow: hidden;
	background:#2C2B31
}

svg#logo {
    background: transparent;
    width: 230px;
    transform-origin: center;
    opacity: 1;
    animation: scaleAndMove .4s ease-in 1.5s forwards, fadeOutOverlay 1s ease 2.75s forwards;
    animation:  fadeOutOsverlay 1s ease 2.75s forwards;
}

#p-2, #a-2, #s-2, #g-2, #point-2 {
    stroke-dasharray: 300;
    stroke-dashoffset: 300;
    animation: dash .8s linear .8s forwards;
}

#p-2 {
    animation: dash 1.2s linear .8s forwards, moveUp 1s cubic-bezier(.43,.195,.02,1) .15s forwards, moveUpfadeOut 1s linear 31.8s forwards;
}

#a-2 {
    animation: dash 1.4s linear .8s forwards, moveUp 1s cubic-bezier(.43,.195,.02,1) .1s forwards, moveUpfadeOut 1s linear 31.8s forwards;
}

#s-2 {
    animation: dash 2s linear .8s forwards, moveUp 1s cubic-bezier(.43,.195,.02,1) .05s forwards, moveUpfadeOut 1s linear 31.8s forwards;
}

#g-2 {
    animation: dash 2s linear .8s forwards, moveUp 1s cubic-bezier(.43,.195,.02,1) 0s forwards, moveUpfadeOut 1s linear 31.8s forwards;
}

#point-2 {
    animation: dash 4s linear 2s forwards, moveUp 1s cubic-bezier(.43,.195,.02,1) .2s forwards, moveUpfadeOut 1s linear 31.8s forwards;
    opacity: 1;
}

.filter-overlay {
    position: fixed;
    bottom: -100%;
    left: 0;
    width: 100%;
    height: 100%;
    background: #fff;
    z-index: 999;
    transition: transform 1s ease-out;
}

.filter-overlay.invert {
    filter: invert(1);
    animation: slideUp 1s ease-out 3.75s forwards;
}

.filter-overlay.normal {
    animation: slideUp 1s ease-out 6s forwards;
}

@keyframes dash {
    to {
        stroke-dashoffset: 0;
    }
}

@keyframes fadeOutOverlay {
    to {
        opacity: 0;
    }
}

@keyframes moveUpfadeOut {
    0% {
        transform: translateY(0px);
        opacity: 1;
    }
    100% {
        transform: translateY(-100px);
        opacity: 0;
    }
}

@keyframes moveUp {
    0% {
        stroke-dashoffset: 0;
        transform: translateY(250px);
        opacity: 1;
    }
    100% {
        stroke-dashoffset: 0;
        transform: translateY(0px);
        opacity: 1;
    }
}

@keyframes scaleAndMove {
    0% {
        transform: scale(1);
    }
    100% {
        transform: scale(1);
        width: 175px;
    }
}

@keyframes slideUp {
    0% {
        transform: translateY(100%);
    }
    100% {
        transform: translateY(0);
    }
}
