@charset "UTF-8";
@layer fonts {
	@font-face {font-display: optional; font-family: 'Albert Sans'; font-style: normal; font-weight: 200; src: url('albert-sans-v1-latin-200.woff2') format('woff2');}
	@font-face {font-display: optional; font-family: 'Albert Sans'; font-style: normal; font-weight: 400; src: url('albert-sans-v1-latin-regular.woff2') format('woff2');}
	@font-face {font-display: optional; font-family: 'Albert Sans'; font-style: normal; font-weight: 600; src: url('albert-sans-v1-latin-600.woff2') format('woff2');}
}

@layer colors {
  :root {
    --c-black: #000;
    --c-white: hsl(0, 0%, 100%);
  }
}

@layer globals {
	html {scroll-behavior: smooth; max-width:2560px; margin:0 auto;}
	*, *::before, *::after {box-sizing:border-box;}
	body {margin:0; background:var(--c-black); color:var(--c-white); font-family:'Albert Sans', Arial, Helvetica, sans-serif; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover;}
	a{text-decoration-color: transparent;}
}

	:root {
		--lo-padding-sml:20px;
	}

/* Main Wrapper (content fixed width with padding) */
	.mainWrapper{display:grid; grid-template-columns:var(--lo-padding-sml) 1fr var(--lo-padding-sml); position:relative;}
	.mainWrapper > * {grid-column:2 / 3;}
	@media (width >= 43.75em){.mainWrapper{grid-template-columns: minmax(var(--lo-padding-sml), 1fr) minmax(auto, 1200px) minmax(var(--lo-padding-sml), 1fr);}}

    #header{}
        .headerBlock{display:flex; gap:20px; padding:40px 0;}
        .headerBlock img{max-width:100%; height:auto;}
        .headerLogo{display:flex; flex:1;}
        .headerTag{display:flex; flex:1; justify-content: flex-end; align-items: end;}

    #main{background: #000000; background: linear-gradient(90deg,rgba(0, 0, 0, 0.5) 0%, rgba(196, 214, 0, 1) 20%, rgba(196, 214, 0, 1) 80%, rgba(0, 0, 0, 0.5) 100%);}
        .mainBlock{display:flex; gap:50px; padding:40px 0;}
        .mainLeft{display:flex; flex:1; position:relative; flex-direction: column;}
        .mainLeft .imgBG {position:absolute; top:0; right:0;}
        .mainLeft > * {padding:20px 0 0 0;}

        .mainLeft p {padding:0; margin:0; color:black; font-size:0.9rem;}
        .mainRight{display:flex; flex:1; flex-direction:column; align-items:end;}
      .vidBlock{display:flex; justify-content:center; gap:10px; max-width:500px; width:100%; padding:10px;}
        
    #footer{}
        .footerBlock{display:flex; gap:20px; padding:20px 0;}
        .footerBlock img{max-width:100%; height:auto;}
        .footerLeft{display:flex; flex:1;}
        .footerRight{display:flex; flex:1; justify-content: flex-end; align-items: end; font-sizE: 0.8rem;}
        .footerRight a{color:#FFFFFF;}
        .footerRight a:hover{color:#c4d600;}

  
        .previewBlock{display:flex; justify-content: space-between; margin:40px 0; flex-wrap: wrap;}


    .btn_ytplay {width: 80px !important; height: 80px !important; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
    .vidLink{cursor:pointer;}
	  .imgyt {}

    .btn_black {color:#c4d600; background-color: var(--c-black); border: 1px solid var(--c-black); padding: 5px 10px; text-decoration: none !important; text-align: center; display: inline-block; border-radius: 10px; max-width:150px; width:100%; box-shadow: 0px 0px 5px 0px #000000;}  
    .btn_black:hover {color:#FFFFFF;}  
    .linkWhite {font-size:0.9rem; color:white; text-decoration:underline;}
