/* set colors vars */
:root {
  --black: #000000;
  --blacktransparent: rgba(0,0,0, 0.8);
  --white: #ffffff;
  --whitetransparent: rgba(255,255,255, 0.9);
  --red: #e94740;
  --redtransparent: rgba(233,71,64, 0.8);
  --facebook: #4267B2;
  --instagram: #833AB4;
  --twitter: #1DA1F2;
  --transparent: rgba(0,0,0, 0);
  --danger: #fca9a9;
}

/* dom element definitions */
html {
  scroll-behavior: smooth;
}
body {
  margin: 0px 0px!important;
  padding: 0px 0px!important;
  width: 100%;
  height: 100vh;
}

/* color classes */
.black {
  color: var(--black);
}
.white {
  color: var(--white);
}
.red {
  color: var(--red);
}

/* background classes */
.blackbg {
  background-color: var(--black);
}
.blacktransparentbg {
  background-color: var(--blacktransparent);
}
.whitebg {
  background-color: var(--white);
}
.whitetransparentbg {
  background-color: var(--whitetransparent);
}
.redbg {
  background-color: var(--red);
}
.redtransparentbg {
  background-color: var(--redtransparent);
}

/* font definitions */
.roboto {
	font-family: 'Roboto Condensed', sans-serif;
}

/* alignment */
.center {
  text-align: center;
}
.left {
  text-align: left;
}
.right {
  text-align: right;
}

/* bootstrap fixes */
.row {
    margin: 0px;
    --bs-gutter-x: none!important;
    --bs-gutter-y: none!important;
}

/* sizes */
.percent100 {
  width: 100%;
}

.overflowHidden {
  overflow: hidden;
}