@import url('https://fonts.googleapis.com/css2?family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap');

@import url("sidebar.css");
@import url("content.css");
@import url("form.css");

:root{

    font-family: "Ubuntu", sans-serif;
    font-weight: 400;
    font-style: normal;

}

html,
body{

    display: flex;

    min-width: -webkit-fill-available;
    height: -webkit-fill-available;
    /* overflow: clip; */

    margin: 0;

}

.bg-gradient{

    /* https://csshero.org/mesher/ */
    background-color:#ffeb99;
    background-image:
        radial-gradient(at 62% 87%, hsla(207,97%,68%,1) 0px, transparent 50%),
        radial-gradient(at 22% 20%, hsla(264,78%,75%,1) 0px, transparent 50%),
        radial-gradient(at 18% 57%, hsla(233,91%,75%,1) 0px, transparent 50%),
        radial-gradient(at 83% 63%, hsla(200,86%,75%,1) 0px, transparent 50%),
        radial-gradient(at 30% 49%, hsla(165,81%,65%,1) 0px, transparent 50%),
        radial-gradient(at 63% 42%, hsla(54,87%,74%,1) 0px, transparent 50%),
        radial-gradient(at 65% 13%, hsla(61,67%,79%,1) 0px, transparent 50%);

}

.bg{

    background-repeat: no-repeat;
    background-position: bottom;
    background-image: url("/assets/imgs/bg.svg");

}

.bg.animated{

    background-repeat: no-repeat;
    background-position: bottom;
    background-image: url("/assets/imgs/bg-animated.svg");

}

.frosted {
  background-color: rgba(255, 255, 255, 0.1); /* Semi-transparent background */
  backdrop-filter: blur(10px); /* Apply blur to the area behind the element */
  -webkit-backdrop-filter: blur(10px); /* Safari support */
  border-radius: 20px;
}

.gradient-text{

    background: linear-gradient(
        to left, 
        #ff355e, 
        #fd5b78,
        #ff6037,
        #ff9966,
        #ff9933,
        #ffcc33,
        #ffff66,
        #ccff00,
        #66ff66,
        #aaf0d1,
        #16d0cb,
        #50bfe6,
        #9c27b0,
        #ee34d2,
        #ff00cc
        );

    /* background: linear-gradient(
        to right, 
        green, 
        rgb(0, 145, 255),
        red,
        rgb(147, 96, 0), 
        green, 
        rgb(0, 145, 255),
        red,
        rgb(147, 96, 0), 
        green, 
        rgb(0, 145, 255),
        red,
        rgb(147, 96, 0), 
        green, 
        rgb(0, 145, 255),
        red,
        rgb(147, 96, 0)
        ); */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;

}