@import "~@angular/material/prebuilt-themes/indigo-pink.css";


:root {
  // --radius-1: 12px;
  // --radius-2: 20px;
  --white: #ffffff;
  --dark: #222;
  --prime: #0079C2;
  --active: #005e99;
  --danger: #C20017;
  --disabled: #A3D1EB;
  --second: #7D7D7D;

  --smart: 688px;
  --medium: 1048px;
  --xs: 4px;
  --s: 8px;
  --m: 16px;
  --l: 24px;
  --xl: 36px;
  --xxl: 48px;
}

* {
  font-family: "Roboto";
  font-weight: 300;
}

.style-color{

}


 .mat-calendar-body-selected {
  background-color: #0079c2;
}

button.mat-calendar-body-cell:hover{
  background-color: transparent;
  border: none;
  font-weight: 400;
}

button.mat-calendar-body-cell{
  font-weight: 400;
}

.mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){
  background-color: rgba(0, 162, 255,0.3);
  font-weight: 400;
}

.tox-promotion, .tox-statusbar__branding {
  display: none!important;
}


*, ::after, ::before {
  box-sizing: border-box;
}

* {scrollbar-color:transparent transparent; scrollbar-width:none;}
*::-webkit-scrollbar-track {background-color:transparent;}
*::-webkit-scrollbar {width:0; height:0; background-color:transparent;}
*::-webkit-scrollbar-thumb {background-color:transparent; border-radius:2rem;}


html {
  height: 100%;
  font-family: "Roboto";
  font-size: 15px;
  -webkit-font-smoothing:antialiased;
}

body {
  height: 100%;
  padding: 0;
  margin: 0;
  color: var(--dark);
}

.limiter {
  width: 100%;
  max-width: 900px;
  margin: 0 auto;
}

p{
  margin-top: 4px;
  margin-bottom: 4px;
}
b, strong {
  font-weight: 500;
}

h1 {
  font-size: 48px;
  margin: 32px 0;
  line-height: 140%;
}

h2 {
  font-size: 32px;
  margin: 24px 0;
  line-height: 125%;
}
h3 {
  font-size: 24px;
  margin: 15px 0;
  line-height: 120%;
}
h4 {
  font-size: 18px;
  margin: 10px 0;
}

a {
  text-decoration: none;
  color: var(--prime);
  cursor: pointer;
  &:hover{
    color: var(--active);
  };
}

hr {

    border: 0;
    border-bottom: 1px solid var(--second);
    background: transparent;
    }


.fullwidth {
  width: calc(100% + 80px);
  margin-left: -40px;
  margin-right: -40px;
}

.loader {
  margin-top: 32px;
  text-align: center;
  animation: fade-in-and-scale 0.5s infinite;
  &:before {
    display: inline-block;
    width: 80px;
    height: 80px;
    border-radius: 100px;
    background-image: radial-gradient(rgba(44,134,205,1), rgba(44,134,205,0));
    content: '';
  }
}

.op-63{
  opacity: 0.63;
}


.image-hidden {
  img, svg {
    visibility: hidden !important;
  }
  *, *::after, *::before {
    background-image: none !important;
  }
}

.style-brown {
  filter: sepia(150%) !important;
}
.style-white-black {
  filter: grayscale(100%) !important;;
}
.style-black-white {
  filter: grayscale(100%) invert(100%) !important;;
}



@media screen and (min-width: 1360px) {
  .fullwidth {
    width: 100vw;
    margin-left: calc((1160px - 100vw) / 2);
    margin-right: 0;
  }
}



@keyframes slide-from-right {
  0% {transform: translateX(100%);}
  100% {transform: translateX(0);}
}

@keyframes slide-from-left {
  0% {transform: translateX(-100%);}
  100% {transform: translateX(0);}
}

@keyframes slide-from-top-and-fade-in {
  0% {transform: translateY(-100%); opacity: 0}
  100% {transform: translateY(0); opacity: 1}
}

@keyframes slide-from-bottom-and-fade-in {
  0% {transform: translateY(100%); opacity: 0}
  100% {transform: translateY(0); opacity: 1}
}


@keyframes fade-in-and-scale {
  0% {transform:scale(0.3); opacity:0;}
  100% {transform:scale(1); opacity:0.5;}
}




@media screen and (var(--smart)) {
  .limiter {

  }
  .fullwidth {
    width: calc(100% + 48px);
    margin-left: -24px;
    margin-right: -24px;
  }

}

@media screen and (var(--medium)) {
  .limiter {

  }
  .fullwidth {
    width: calc(100% + 32px);
    margin-left: -16px;
    margin-right: -16px;
  }
  h2 {
    font-size: 24px;
    margin: 15px 0;
  }
  h3 {
    font-size: 21px;
    margin: 10px 0;
  }
  h4 {
    font-size: 18px;
    margin: 8px 0;
  
  }

}
