#stick {
  top: 0;
  position: fixed;
	z-index: 1000;
  width: 100%; 
	background: rgba(34,34,34,0);
	-webkit-transition: all ease-out .5s;
  -moz-transition: all ease-out .5s;
  -o-transition: all ease-out .5s;
  transition: all ease-out .5s;
  
}


#third { padding-top: 10rem; }

* {
  font-family: "Roboto Slab", serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-variation-settings:
    "wdth" 100;
}

#logo { width: 350px;
	-webkit-transition: all ease-out .5s;
  -moz-transition: all ease-out .5s;
  -o-transition: all ease-out .5s;
  transition: all ease-out .5s; }
.active #logo { width: 250px; }

#matters { padding: 10rem 0; }

#yellow { width: 60%; position: absolute; top: 0; left: 0; opacity: 1!important; z-index: 100;  }

#action { z-index: 999; }

@media screen and (max-width: 768px) {
	#yellow { width: 100%; }
	#logo { width: 160px; }
	.active #logo { width: 120px; }
	#matters { padding: 5rem 0; }
	.lead { font-size: 1rem; }
}

.bg-primary { background: #444!important; }

#crtpo { width: 160px; }
#ctrpohead { width: 100px; margin-left: 5px; }
@media screen and (max-width: 768px) {
#ctrpohead { clear: left; display: block; right: 1rem;margin-top: 10px; position: absolute; }
}

.btn-secondary { padding-top: 0.7rem; padding-bottom: 0.7rem; background-color: #121212!important; border: none; font-weight: bold; }
.btn-secondary:hover { background-color: #ffffff!important; color: #121212; }

.btn-primary { padding-top: 0.7rem; padding-bottom: 0.7rem;  background-color: #ffc812!important; color: #121212; border: none; font-weight: bold; }
.btn-primary:hover { background-color: #ffffff!important; color: #121212; }


header {
  position: relative;
  background-color: black;
  height: 100vh;
  min-height: 25rem;
  width: 100%;
  overflow: hidden;
}
#charts {
  position: relative;
  background-color: black;
  height: 60vh;
  min-height: 25rem;
  width: 100%;
  overflow: hidden;
}

header video {
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  z-index: 0;
  -ms-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -webkit-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
}

#charts video {
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  z-index: 0;
  -ms-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -webkit-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
}

header .container-fluid, #charts .container-fluid {
  position: relative;
  z-index: 2;
}

header .overlay {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: black;
  opacity: 0.5;
  z-index: 1;
}

#charts .overlay {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
	background: linear-gradient(to left, #000000, rgba(0, 0, 0, 0.4));
  z-index: 1;
}


.active {
  background-color: rgba(255,200,18,0.8)!important;
}

#footer a { color: #0D3158; }

.switcher { color: #fff; text-decoration: none; font-size: 90%; margin-right: 15px; }
.switcher:hover { color: #ffc812; }
@media screen and (max-width: 768px) {
.switcher:hover { color: #121212; }
}

.osano-cm-widget {
        background-image: url(/img/privacy.svg);
        background-size: contain;
        background-repeat: no-repeat;
        border-radius: 0%;
        width: 44px;
        height: 44px;
        right: 1rem;
        bottom: 1rem;
        opacity: 0.9;
        transition-property: opacity, visibility, transform;
                        }
      .osano-cm-widget svg {
        display: none;
                        }
      .osano-cm-widget:focus,
      .osano-cm-widget:hover {
        opacity: 1;
        transform: none;
                        }
      .osano-cm-widget:active {
        transform: translateY(1px);
                        }