:root { 
        --pink: #bf61a1;
        --light_pink: #EDDBEB;
        --blue: #0291c2;
        --blue_dark: #037aa1;
        --yellow: #e0c46f;
        --yellow_dark: #b3994c;
      }


html{scroll-behavior: smooth;}

 @font-face {
    font-family: 'Agrandir';
    src: url('../fonts/Agrandir-Regular.woff2') format('woff2'),
        url('../fonts/Agrandir-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Agrandir';
    src: url('../fonts/Agrandir-Bold.woff2') format('woff2'),
        url('../fonts/Agrandir-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}



@font-face {
    font-family: 'Agrandir';
    src: url('../fonts/Agrandir-WideBold.woff2') format('woff2'),
        url('../fonts/Agrandir-WideBold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Galano Grotesque';
    src: url('../fonts/GalanoGrotesque-Light.woff2') format('woff2'),
        url('../fonts/GalanoGrotesque-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Galano Grotesque';
    src: url('../fonts/GalanoGrotesque-Medium.woff2') format('woff2'),
        url('../fonts/GalanoGrotesque-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Galano Grotesque';
    src: url('../fonts/GalanoGrotesque-Regular.woff2') format('woff2'),
        url('../fonts/GalanoGrotesque-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

    body{font-family: 'Agrandir';} 
    .font-2{font-family: 'Galano Grotesque';}

 

 .container{padding: 0 20px; width: 100%; max-width: 1240px; margin: 0 auto;}
  .form_control{position: relative;}
 .form_control label:first-child{color: #999999; font-size: 16px; position:absolute; left: 0; top:7px; transition: all ease 0.3s;}
 .form_control.active label:first-child{color: #666666;
    font-size: 10px;
    position: absolute;
    top: -10px;
    text-transform: uppercase;
    font-weight: 600;}

body.slip{overflow: hidden;}

 @media all and (max-width:1199px){

    .list h3 br,
    .list p br
    {display: none;}
 }

  @media all and (max-width:767px){

    .navigation{    transform: scaleY(0); transition: all ease 0.3s; transform-origin: top; box-shadow: 0 5px 5px rgba(0,0,0,0.1);}
    .slip .navigation{    transform: scaleY(1);}
  }