@media only screen and (min-width: 1025px) {
    body {
        background-image: url("https://images5.alphacoders.com/109/1099191.jpg");
        background-repeat: no-repeat;
        background-size: cover;
        display: flex;
        flex-direction: column;
    }

    .title {
        text-align: center;
        text-shadow: 2px 2px 5px #0000007b;
        color: #ffffff;
        font-size: 40px;
        font-weight: bold;
        margin-top: 50px;
        margin-bottom: 50px;
    }

    .welcome {
        align-self: center;
        text-shadow: 2px 2px 5px #0000007b;
        color: #ffffff;
        font-size: 30px;
        margin-bottom: 200px;
    }

    .container {
        display: flex;
        width: 60%;
        margin: auto;
        margin-top: 25px;
        margin-bottom: 25px;
        border-radius: 20px;
        padding: 20px;
        background-color: #b4cbe980;
    }

    .how-link {
        font-style: normal;
        color: #1b105a;
        text-shadow: #08031e9c;
    }

    .inner-container-left:hover{
        color:#af881d ;
        cursor: pointer;
    }


    .inner-container {
        display: flex;
        align-items: center;
        justify-content: center;
        flex: 1;
        width: 50%;
    }

    .inner-container-left button {
        text-align: center;
        background-color: #e9c695;
        box-shadow: #765526;
        color: #fff;
        font-weight: bold;
        padding: 40px 20px;
        margin: 20px;
        border-radius: 20px;
        border-color: #fff;
        width: 100%;
        font-size: 1.2em;
    }

    .inner-container.right p {
        text-align: center;
        font-weight: bold;
        font-size: larger;
        margin-bottom: 10px;
    }

    .inner-container.right a {
        display: block;
        text-align: center;
        font-weight: normal;
        margin-top: 40px;
    }

}
@media only screen and (max-width: 1024px) {
    body {
        background-image: url("https://images5.alphacoders.com/109/1099191.jpg");
        background-repeat: no-repeat;
        background-size: cover;
        display: flex;
        flex-direction: column;
    }

    .title {
        text-align: center;
        text-shadow: 2px 2px 5px #0000007b;
        color: #ffffff;
        font-size: 40px;
        font-weight: bold;
        margin-top: 50px;
        margin-bottom: 50px;
    }

    .welcome {
        align-self: center;
        text-shadow: 2px 2px 5px #0000007b;
        color: #ffffff;
        font-size: 30px;
        margin-bottom: 100px;
        max-width: 75%;
        text-align: center;
    }

    .container {
        display: flex;
        width: 60%;
        margin: auto;
        margin-top: 25px;
        margin-bottom: 25px;
        border-radius: 20px;
        padding: 20px;
        background-color: #b4cbe980;
    }

    .how-link {
        font-style: normal;
        color: #1b105a;
        text-shadow: #08031e9c;
    }


    .inner-container {
        display: flex;
        align-items: center;
        justify-content: center;
        flex: 1;
        width: 50%;
    }

    .inner-container-left button {
        text-align: center;
        background-color: #e9c695;
        box-shadow: #765526;
        color: #fff;
        font-weight: bold;
        padding: 40px 20px;
        margin: 20px;
        border-radius: 20px;
        border-color: #fff;
        width: 100%;
        font-size: 1.2em;
    }

    .inner-container.right p {
        text-align: center;
        font-weight: bold;
        font-size: larger;
        margin-bottom: 10px;
    }

    .inner-container.right a {
        display: block;
        text-align: center;
        font-weight: normal;
        margin-top: 40px;
    }

}
@media only screen and (max-width: 425px){
 .title{
     font-size: 25px!important;
 }
}


