<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <link href="https://fonts.googleapis.com/css2?family=Montserrat&display=swap" rel="stylesheet">
    
    <title>Verify Email address</title>

    <style>
        .format-font {
            font-family: 'Montserrat', sans-serif; 
        }
        .my-container {
            margin: 10px;
            padding: 10px;
            padding-top: 0px;
            justify-content: center;
            border-radius: 5px;
            border: 1px solid rgb(204, 203, 203);
        }

        .my-button {
            padding: 10px;
            padding-left: 35px;
            padding-right: 35px;
            background-color: rgb(110, 3, 211);
            color: white;
            border-radius: 25px;
            transition-duration: 500ms;
            text-decoration: none;
            
        }
        .my-button:hover {
            color: rgb(110, 3, 211);
            background-color: white;
            border-radius: 0px;
            border: 1px solid rgb(110, 3, 211);
            transition-duration: 200ms;
        }

    </style>
</head>
<body>

    <div class="my-container">

        <div style="background-color: rgb(110, 3, 211); border-radius: 15px;">
            <h1 class="format-font" style="text-align: center; padding: 2px; color:white;">
                Account Activation
            </h1>
        </div>

        <h2 class="format-font" style="text-align: center;">E-mail Confirmation</h2> <hr style="background-color:  rgb(110, 3, 211); width:100px">

        <div class="format-font" style="margin-top: 20px; line-height: 1.5;">
            <p style="text-align: center; font-weight: bold;">Greetings!</p>
            You received this mail because you attempted to make account on our website, 
            Please click on the link below to confirm the email and activate your account.       
        </div>

        <p class="format-font" style="text-align: center; margin-top: 50px;">
            Please verify your e-mail :
            <hr style="background-color:  rgb(110, 3, 211); width:50px">
            <div class="format-font" style="text-align: center; margin-top: 30px;" >
                <a href="{{link}}" class="my-button" >Verify</a>
            </div>
            
        </p>
    
        <p class="format-font" style="margin-top: 50px;">
           <b> You'll be joining us right after the verification !</b>
        </p>
    
        <p class="format-font" style="line-height: 1.5;">
            <b>Thanks for joining! <br> This mail machine generated. <br>Do not reply to this mail </b>
        </p>
        
    </div>
   
</body>
</html>