*{
    margin: 0;
    text-decoration: none;
    list-style-type: none;
}

:root{
    --degrade-linha: linear-gradient(to right, rgb(2, 137, 206), rgb(78, 181, 190), rgb(66, 164, 117),
    rgb(140, 198, 61), rgb(254, 194, 17), rgb(250, 166, 25), rgb(245, 130, 32), rgb(222, 25, 34));
}

.container{
    max-width: 1650px;
    padding: 0 5%;
    margin: 0 auto;
}

.linhaDegrade {
    height: 10px; /* Define a altura da linha */
    background: var(--degrade-linha);
}

header{
    background: rgb(0, 21, 49);
}

header .container{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px;

    img{
        width: 200px;
    }

    a{
        font-size: 2.3rem;
        font-weight: 700;
        font-style: normal;
        color: white;
    }

    .inicio{
        background: rgb(222, 25, 34);
        border-radius: 30px;
        padding: 5px 50px;
    }

    .cursos{
        background: rgb(245, 130, 32);
        border-radius: 30px;
        padding: 5px 50px;
    }

    .noticias{
        background: rgb(254, 194, 17);
        border-radius: 30px;
        padding: 5px 50px;
    }

    .sobre{
        background: rgb(32, 220, 245);
        border-radius: 30px;
        padding: 5px 50px;
    }

    .contatos{
        background: rgb(66, 164, 117);
        border-radius: 30px;
        padding: 5px 50px;
    }

    .sisram{
        background: rgb(66, 164, 117);
        border-radius: 50px;
        padding: 5px 30px;
    }
}

main{
    padding: 20px;
    background-image: url("img/4.png");
    background-repeat: no-repeat; /* Não repetir a imagem */
    background-size: cover; /* Cobrir todo o corpo */
    background-position: center center; /* Centralizar a imagem */
    height: 750px;

    .titulo{
        color: white;
        width: 100%;
        display: flex;
        justify-content: center;
        font-size: 2.5rem;
    }

    .container{
        height: 90%;
        display: flex;
        justify-content: space-around;
        align-items: center;

        .card{
            background: rgb(0, 14, 32);
            width: 250px;
            height: 420px;
            border-radius: 60px;
            padding: 20px;
            display: flex;
            align-items: center;

            .contem{

                .cima{
                    display: flex;
                    align-items: center;
                    justify-content: center;
    
                    img{
                        width: 170px;
                    }
                }
    
                .meio{
                    margin-top: 40px;
                    display: flex;
                    align-items: center;
                    justify-content: center;
    
                    p{
                        color: white;
                        text-align: center;
                        font-size: 1.8rem;
                    }
                }
    
                .baixoC{
                    margin-top: 40px;
                    display: flex;
                    align-items: center;
                    justify-content: center;
    
                    a{
                        background: rgb(1, 35, 80);
                        color: white;
                        font-size: 1.8rem;
                        padding: 5px 50px;
                        border-radius: 20px;
                    }
                }
            }
        }
    }
}

footer{
    background: rgb(0, 21, 49);
    padding: 20px;
    .container{
        .cima{
            display: flex;      
            justify-content: space-between;
            color: white;
        }

        h5{
            font-size: 1.8rem;
        }
        
        li{
            margin-top: 10px;
            font-size: 1.5rem;
        }
        
        a{
            display: flex;
            align-items: center;
            text-align: center;
            margin-top: 10px;
            font-size: 1.5rem;
            color: white;
        }
        
        img{
            margin-right: 10px;
            width: 25px;
        }
    }
}