DESPERATE CODE HELP!!!!

Ive been tinkering with my profile for ages because it suddenly stopped showing my background images for some reason and i can't get it to work at all for love nor money (is this a prophecy of me failing Computer Science GCSE? maybe) if anyone is good at this sort of thing i would much appreciate the help. I can't be out here looking like my profile is plain white boring. SOS! 

my code (a hot mess):

<style>

:root {

     --logo-blue: #603570;

     --darker-blue: #1D8C22;

     --lighter-blue: #864B9D;

     --even-lighter-blue: #ECF999;

     --lightest-blue: #C0CB7E;

     --dark-orange: #BEDCE8;

     --light-orange: #460606;

     --even-lighter-orange: #9D2F22;

     --green: #004F0;

}

.online {

    margin:auto;

    padding-bottom: 5px;

    content: url(https://i.ibb.co/sCLNcck/ezgif-5-5861b4e688.png);

  animation: rotation 6s infinite linear;

}

@keyframes rotation {

  from {

    transform: rotate(0deg);

  }

  to {

    transform: rotate(359deg);

  }

TEXT

h1, h2, h3, h4,h5,a, p, nav label, .section {color: white;}

}

.online{

  color: white!important;  

}

body {

     background-image: url("https://i.pinimg.com/736x/7c/fb/99/7cfb998b89957b171e3c7729fc1f1401.jpg") !important;

     background-color: black !important;

     background-attachment: fixed !important;

     margin: 0;

     padding: 0;

}

main {

background-image: url(https://www.whytes.ie/images/auction/847/60469.jpg);

}

main:before {

width: 100%;

height: 125px ;

display: block;

content: "";

background-image: url('https://i.pinimg.com/736x/a4/bd/d7/a4bdd756bd8dd957145dc929b9e981bc.jpg');

background-position: center center;

background-size: 0 cover;

}

</style>