:root {
    --width: 1000px;
    --first-color: #5c1334;
    --first-color-dark: #3a0d21;
    --first-color-light: rgb(255, 228, 228);
    --second-color: #0D1282;
    --second-color-dark: #0d1161;
    --second-color-light: #abaef5;
    --bg-first-color: rgb(255, 228, 228);
    --br: 15px;
    --border-color :#03a9f4a8;

}


@font-face {
    font-family: 'Poppins';
    src: url('fonts/popins/Poppins-Medium.ttf') format('truetype');

}




* {
    padding: 0;
    margin: 0;
}

#root2 {
    max-width: var(--width);
    width: 90%;
    margin: auto;


}

body {
    font-family: 'Popins', sans-serif;
    background-color: var(--first-color-light);
}
.text-bold {
    font-weight: 700;
}

.text-blue {
    color: rgb(31, 75, 172) !important;
}

.text-first {
    color: var(--first-color) !important;
}
.border-first {
    border: solid var(--first-color) !important;
}
.border-second {
    border: solid var(--second-color) !important;
}
.first-bg-color{
    background-color: var(--first-color);
    color: #fff;
}
.second-bg-color{
    background-color: var(--second-color);
    color: #fff;
}

@media only screen and (max-width: 600px) {
    #root2 {
      
        width: 98%;
  
    }
  }