@charset "UTF-8";

    
    @import url('https://fonts.googleapis.com/css2?family=Work+Sans:ital,wght@0,100..900;1,100..900&display=swap');
        @import url('https://fonts.googleapis.com/css2?family=Julius+Sans+One&family=Work+Sans:ital,wght@0,100..900;1,100..900&display=swap');
        @import url('https://fonts.googleapis.com/css2?family=Julius+Sans+One&family=Major+Mono+Display&family=Work+Sans:ital,wght@0,100..900;1,100..900&display=swap');
        @import url('https://fonts.googleapis.com/css2?family=Julius+Sans+One&family=Kaushan+Script&family=Major+Mono+Display&family=Work+Sans:ital,wght@0,100..900;1,100..900&display=swap');

@font-face {
    
    font-family: 'Ace of swords';
    src: url(ace_of_swords/aceofswords3d.ttf) format('truetype'), url(ace_of_swords/aceofswords.ttf) format('truetype');
    font-weight: normal;
    font-style: normal;
}

body {

    font: normal 16px 'Julius Sans One', sans-serif;
    text-align: left;
    background-image:linear-gradient(to top,#1B0589 1%, #060B29) ;
    background-attachment: fixed;
    
}

/* em HTML é id= em CSS # Só pode 1 elemento
em HTML class= em CSS é . Pode vários elementos
*/

h1#principal{

    font-family: 'Ace of Swords','Major Mono Display', monospace;
    font-size: 3em;
    text-align: center;
    color: #F7DB0A;
    background-color: #1B0589
  
}

h1 {
    font-family:'Kaushan Script',cursive,'Major Mono Display', monospace;
    color: #F7DB0A;
    font-size: 2.5em;
    font-weight: bolder;
    text-align: left;
}



h2 {
    font-family: 'Major Mono Display','Kaushan Script',cursive,'Major Mono Display', monospace;    font-size: 1.5em;
    text-align: left;
    font-weight: normal;
    color: #0A7AF7;
}

.basico{
 background-image: linear-gradient(to left,#427841 20%,#310AF7 80%);
 background-attachment: fixed;
 font-size: 1.5em;
 text-align: left;
 font-weight: bold;
 color: whitesmoke;
 }

 .intermediario{
 background-image: linear-gradient(to left,#F7DB0A 20%,#310AF7 80%);
 background-attachment: fixed;
 font-size: 1.5em;
 text-align: left;
 font-weight: bold;
 color: whitesmoke;
 }

 .avançado{
 background-image: linear-gradient(to left,#F72B0A 20% ,#310AF7 80%);
 background-attachment: fixed;
 font-size: 1.5em;
 text-align: left;
 font-weight: bold;
 color: whitesmoke;
 }

 .destaque{
    background-image: linear-gradient(to left,#310AF7 2%,#060B29 98%);
    color:F7DB0A;
    font-weight: bold;
    text-align: justify;
    font-size: 2em;

    
 }

p{
font: normal 12px 'Julius Sans One', sans-serif; 
color:aliceblue;
text-align: justify;

}