/* ===================================
    Crafto - Freelancer
====================================== */
/* font */
@font-face {
  font-family: 'Inter';
  src: url('/fonts/Inter-VariableFont_opsz,wght.woff2') format('woff2'),
       url('/fonts/Inter-VariableFont_opsz,wght.woff') format('woff'),
       url('/fonts/Inter-VariableFont_opsz,wght.ttf') format('truetype');
  font-weight: 100 900;
  font-display: swap;
}

@font-face {
  font-family: 'Inter';
  src: url('/fonts/Inter-Italic-VariableFont_opsz,wght.woff2') format('woff2'),
       url('/fonts/Inter-Italic-VariableFont_opsz,wght.woff') format('woff'),
       url('/fonts/Inter-Italic-VariableFont_opsz,wght.ttf') format('truetype');
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
}

/* variable */
:root {     
    --base-color: #c2001c;
    --light-medium-gray:#e9e9e9;
    --primary-font: 'Inter', sans-serif;
    --alt-font: 'Inter', sans-serif;
    --muschel: #f3efe9;
}

/* Text gradient color */
.text-red-black {
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
 }   
.text-red-black {
  background-image: linear-gradient(to right, #c2001c, #a20118, #8f0014, #830013, #57000d);
}

body {
    font-size: 17px;
    line-height: 30px;
    color:var(--dark-gray);
}
.bg-nero-grey {
    background-color: #1F1F1F;
}

/* bg color */
.bg-blue-whale {
    background-color: #152833;
}


.bg-muschel {
  background-color: var(--muschel);
}
section {
    padding-top: 90px;
    padding-bottom: 90px;
}
/* bg sliding line */
.bg-sliding-line {
    background-image: linear-gradient(135deg, transparent 45%, #9c2531 45%, #9c2531 55%, transparent 0);
    background-size: 5px 5px;
}

/* font size */
.fs-335 {
    font-size: 20rem;
    line-height: 18.75rem;
}

/* margin */
.mt-minus-40px {
    margin-top: -40px;
}
/* top left right bottom */
.top-20 {
    top: 20%;
}
.top-35 {
    top: 35%;
}
.gutter-medium {
    margin-left: -7px;
    margin-right: -7px;
}
.portfolio-transform .portfolio-box .caption {
  padding: 20px 20px 10px;
}
.progress-bar-style-01 .progress .progress-bar-percent:after {
    border-top-color: #000;
}
/* bg gradient color */
.bg-gradient-top-very-light-gray { 
    background-image:linear-gradient(to top, #ffffff, #ffffff, #fcfafa, #fcfafa, #f7f7f7);
}
/* text shadow large */
.text-shadow-large {
    text-shadow: 0 20px 60px rgb(0, 0, 0, 0.15);
}
.outside-box-bottom-2 {
    margin-bottom: -2vw; 
}