body {
    background: #000;
    padding: 20px; 
    height: auto;
    padding-bottom: 60px;
    /*bottom: 60px; */
}
.gradient {
	background-image: linear-gradient(
	  to bottom,
	  rgba(243, 244, 246, 0.1),
	  rgba(0, 0, 0, 0.8)
	);
  }

  .wrapper {
	transition: all 0.5s cubic-bezier(0.685, 0.0473, 0.346, 1);
  }
  
  .navbar {
	height: 65px;
	/*position: absolute;*/
	background-color: #cc5500;
	/*border-radius: 25px;*/
	transition: all 0.5s 0.1s;
  }
  
  .navbar-offcanvas {
	z-index: 1030;
  }
  .navbar-offcanvas .container-fluid {
	position: relative;
	padding: 0;
	transform: translate3d(0px, 0, 0);
	transition: all 0.5s cubic-bezier(0.685, 0.0473, 0.346, 1);
  }
  .navbar-offcanvas .navbar-top {
	display: none;
  }
  @media (min-width: 992px) {
	.navbar-offcanvas .navbar-top {
	  display: flex;
	  margin-left: auto;
	}
  }
  .navbar-offcanvas .navbar-top .nav-item {
	margin-right: 22px;
	text-align: center;
	color: #fff;
  }
  @media (max-width: 991px) {
	.navbar-offcanvas .navbar-top .nav-item .nav-link {
	  color: #fff;
	}
  }
  .navbar-offcanvas .navbar-toggler {
	padding: 0;
	border: 0;
	outline: none;
  }
  .navbar-offcanvas .navbar-toggler:hover, .navbar-offcanvas .navbar-toggler:focus {
	cursor: pointer;
  }
  @media (min-width: 768px) {
	.navbar-offcanvas .navbar-toggler {
	  display: block;
	}
  }
  .navbar-offcanvas .navbar-toggler .icon-bar {
	display: block;
	position: relative;
	width: 24px;
	height: 2px;
	border-radius: 1px;
	background-color: #fff;
  }
  .navbar-offcanvas .navbar-toggler .icon-bar + .icon-bar {
	margin-top: 4px;
  }
  .navbar-offcanvas .navbar-toggler .icon-bar.bar1 {
	top: 0;
	outline: 1px solid transparent;
	animation: topbar-back 500ms 0s;
	animation-fill-mode: forwards;
  }
  .navbar-offcanvas .navbar-toggler .icon-bar.bar2 {
	outline: 1px solid transparent;
	opacity: 1;
  }
  .navbar-offcanvas .navbar-toggler .icon-bar.bar3 {
	bottom: 0;
	outline: 1px solid transparent;
	animation: bottombar-back 500ms 0s;
	animation-fill-mode: forwards;
  }
  .navbar-offcanvas .navbar-toggler.toggled .icon-bar.bar1 {
	top: 6px;
	animation: topbar-x 500ms 0s;
	animation-fill-mode: forwards;
  }
  .navbar-offcanvas .navbar-toggler.toggled .icon-bar.bar2 {
	opacity: 0;
  }
  .navbar-offcanvas .navbar-toggler.toggled .icon-bar.bar3 {
	bottom: 6px;
	animation: bottombar-x 500ms 0s;
	animation-fill-mode: forwards;
  }
  .navbar-offcanvas .navbar-collapse.collapse,
  .navbar-offcanvas .navbar-collapse.collapse.in,
  .navbar-offcanvas .navbar-collapse.collapsing {
	display: none !important;
  }
  
  .nav-open .navbar-collapse {
	transform: translate3d(0px, 0, 0);
  }
  .nav-open .navbar > .container-fluid {
	transform: translate3d(-424px, 0, 0);
  }
  @media (max-width: 991px) {
	.nav-open .navbar > .container-fluid {
	  transform: translate3d(-282.6666666667px, 0, 0);
	}
  }
  .nav-open .wrapper {
	transform: translate3d(-150px, 0, 0);
  }
  
  body > .navbar-collapse {
	display: block !important;
	position: fixed;
	top: 0;
	right: -10px;
	width: 424px;
	height: 100%;
	padding: 60px 1rem;
	background-color: #900603;
	border-left: 1px solid #900603;
	text-align: left;
	color: #fff;
	visibility: visible;
	overflow-y: visible;
	transform: translate3d(424px, 0, 0);
	transition: all 0.5s cubic-bezier(0.685, 0.0473, 0.346, 1);
	z-index: 1032;
  }
  body > .navbar-collapse:after {
	content: "";
	position: absolute;
	top: 28px;
	left: -20px;
	border-left: 10px solid #900603;
	border-top: 10px solid transparent;
	border-bottom: 10px solid transparent;
	border-right: 10px solid transparent;
	transform: rotate(180deg);
	transition: all 0.5s cubic-bezier(0.685, 0.0473, 0.346, 1);
	z-index: 1032;
  }
  @media (max-width: 991px) {
	body > .navbar-collapse {
	  width: 282.6666666667px;
	}
  }
  body > .navbar-collapse .nav-image {
	margin-bottom: 65px;
  }
  body > .navbar-collapse .nav-image img {
	display: block;
	margin: 0 auto;
	/*border: 1px solid rgba(0, 0, 0, 0.14);*/
	width: 120px;
	height: 120px;
  }
  body > .navbar-collapse .navbar-top {
	margin: 0 !important;
	flex-direction: column;
  }
  @media (min-width: 992px) {
	body > .navbar-collapse .navbar-top {
	  display: none;
	}
  }
  body > .navbar-collapse .navbar-top li {
	text-align: left;
  }
  body > .navbar-collapse .navbar-top li a {
	display: block;
	padding: 0.5rem 1rem;
	font-weight: 700;
	color: #000;
  }
  body > .navbar-collapse .navbar-top li a:hover, body > .navbar-collapse .navbar-top li a:focus {
	text-decoration: none;
  }
  body > .navbar-collapse .nav-link,
  body > .navbar-collapse .dropdown-toggle {
	font-weight: 700;
	color: #222;
	transition: color 0.2s ease-out;
  }
  body > .navbar-collapse .nav-link:hover, body > .navbar-collapse .nav-link:focus,
  body > .navbar-collapse .dropdown-toggle:hover,
  body > .navbar-collapse .dropdown-toggle:focus {
	text-decoration: none;
  }
  body > .navbar-collapse .nav-link.disabled,
  body > .navbar-collapse .dropdown-toggle.disabled {
	color: rgba(0, 0, 0, 0.35);
  }
  body > .navbar-collapse .nav-link.disabled:hover, body > .navbar-collapse .nav-link.disabled:focus,
  body > .navbar-collapse .dropdown-toggle.disabled:hover,
  body > .navbar-collapse .dropdown-toggle.disabled:focus {
	cursor: not-allowed;
  }
  
  @media (min-width: 992px) {
	body > .navbar-top {
	  display: none;
	}
  }
  
  body > #overlay {
	content: "";
	position: fixed;
	top: 0;
	left: auto;
	right: calc(282.6666666667px - 10px);
	width: 100%;
	height: 100%;
	opacity: 0;
	overflow-x: hidden;
	z-index: 1029;
  }
  @media (min-width: 992px) {
	body > #overlay {
	  right: calc(424px - 10px);
	}
  }
  
  @keyframes topbar-x {
	0% {
	  top: 0px;
	  transform: rotate(0deg);
	}
	45% {
	  top: 6px;
	  transform: rotate(145deg);
	}
	75% {
	  transform: rotate(130deg);
	}
	100% {
	  transform: rotate(135deg);
	}
  }
  @keyframes topbar-back {
	0% {
	  top: 6px;
	  transform: rotate(135deg);
	}
	45% {
	  transform: rotate(-10deg);
	}
	75% {
	  transform: rotate(5deg);
	}
	100% {
	  top: 0px;
	  transform: rotate(0);
	}
  }
  @keyframes bottombar-x {
	0% {
	  bottom: 0px;
	  transform: rotate(0deg);
	}
	45% {
	  bottom: 6px;
	  transform: rotate(-145deg);
	}
	75% {
	  transform: rotate(-130deg);
	}
	100% {
	  transform: rotate(-135deg);
	}
  }
  @keyframes bottombar-back {
	0% {
	  bottom: 6px;
	  transform: rotate(-135deg);
	}
	45% {
	  transform: rotate(10deg);
	}
	75% {
	  transform: rotate(-5deg);
	}
	100% {
	  bottom: 0px;
	  transform: rotate(0);
	}
  }

.news {
    width: 20px;
    background-color: #cc5500;
    
}

.news-scroll a {
    text-decoration: none;
    
}

.dot {
    height: 6px;
    width: 6px;
    margin-left: 3px;
    margin-right: 3px;
    margin-top: 2px !important;
    background-color: rgb(207, 23, 23);
    border-radius: 50%;
    display: inline-block;
}

.smart-scroll{
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 1030;
}
.scrolled-down{
   transform:translateY(-100%); transition: all 0.3s ease-in-out;
}
.scrolled-up{
   transform:translateY(0); transition: all 0.3s ease-in-out;
}


  .card {
	/*box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);*/
	transition: 0.3s;
	/*padding: 20px;*/
	width: 100%;
	/*height: 100%;*/
	background-color:#000;
  }
  
  @media (min-width:1025px) { 
      /* big landscape tablets, laptops, and desktops */ 
      
      .card {
    	/*box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);*/
    	transition: 0.3s;
    	/*padding: 20px;*/
    	width: 100%;
    	/*height: 500px;*/
    	background-color:#000;
      }
  }
  
  @media (min-width:1281px) {
      /* hi-res laptops and desktops */ 
      
      .card {
    	/*box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);*/
    	transition: 0.3s;
    	/*padding: 20px;*/
    	width: 100%;
    	/*height: 500px;*/
    	background-color:#000;
      }
  }

  .column {
	float: left;
	padding: 10px;
	
	height: 100%; /* Should be removed. Only for demonstration */
  }

  .left {
	width: 75%;
  }
  
  .right {
	width: 25%;
	padding: 10px;
  }

  /* Clear floats after the columns */
    .row:after {
	content: "";
	display: table;
	padding: 10px;
	clear: both;
  }
  
  /* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
  @media screen and (max-width: 600px) {
	.column {
	  width: 100%;
	}
  }
  
  
  .card:hover {
	box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
  }
  
  .container {
	padding: 2px 16px;
	background-color:#000;
  }
  