<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Poppins&display=swap" rel="stylesheet">

		.title2 {
            text-align: center;
            color: #333333;
			font-family: 'Poppins', sans-serif;
			font-size: 32px;
}
		.tittle {
            text-align: center;
            color: #333333;
            font-family: 'Poppins', sans-serif;
			font-size: 32px;
        }
        
        .form-style-7 {
            max-width: 400px;
            margin: 50px auto;
            background: #f4f6f8;
            border-radius: 2px;
            padding: 20px;
            font-family: 'Poppins', sans-serif;
        }
        
        .form-style-7 h1 {
            display: block;
            text-align: center;
            padding: 0;
            margin: 0px 0px 20px 0px;
            color: #5C5C5C;
            font-size: x-large;
        }
        
        .form-style-7 ul {
            list-style: none;
            padding: 0;
            margin: 0;
        }
        
        .form-style-7 li {
            display: block;
            padding: 9px;
            border: 1px solid #DDDDDD;
            margin-bottom: 30px;
            border-radius: 3px;
        }
        
        .form-style-7 li:last-child {
            border: none;
            margin-bottom: 0px;
            text-align: center;
        }
        
        .form-style-7 li>label {
            display: block;
            float: left;
            margin-top: -19px;
            background: #f4f6f8;
            height: 25px;
            padding: 2px 5px 2px 5px;
            color: #5c5c5c;
            font-size: 14px;
            overflow: hidden;
            font-family: 'Poppins', sans-serif;
        }
        
        .form-style-7 input[type="text"],
        .form-style-7 input[type="date"],
        .form-style-7 input[type="datetime"],
        .form-style-7 input[type="email"],
        .form-style-7 input[type="number"],
        .form-style-7 input[type="search"],
        .form-style-7 input[type="time"],
        .form-style-7 input[type="url"],
        .form-style-7 input[type="password"],
        .form-style-7 textarea,
        .form-style-7 select {
            box-sizing: border-box;
            -webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;
            width: 100%;
            display: block;
            outline: none;
            border: none;
            height: 25px;
            line-height: 25px;
            font-size: 16px;
            padding: 10px;
            font-family: 'Poppins', sans-serif;
        }
		.form-style-7 textarea{
			height: 100px !important;
		}
        .form-style-7 input[type="text"]:focus,
        .form-style-7 input[type="date"]:focus,
        .form-style-7 input[type="datetime"]:focus,
        .form-style-7 input[type="email"]:focus,
        .form-style-7 input[type="number"]:focus,
        .form-style-7 input[type="search"]:focus,
        .form-style-7 input[type="time"]:focus,
        .form-style-7 input[type="url"]:focus,
        .form-style-7 input[type="password"]:focus,
        .form-style-7 textarea:focus,
        .form-style-7 select:focus {}
        
        .form-style-7 li>span {
            background: #F3F3F3;
            display: block;
            padding: 3px;
            margin: 0 -9px -9px -9px;
            text-align: center;
            color: #C0C0C0;
            font-family: 'Poppins', sans-serif;
            font-size: 11px;
        }
        
        .form-style-7 textarea {
            resize: none;
        }
        
        .form-style-7 input[type="submit"],
        .form-style-7 input[type="button"] {
            background-color: #9cca3b;
    		border: 0;
    		padding: 20px;
    		color: #fff;
    		font-size: 16px;
    		text-transform: uppercase;
    		font-weight: bold;
    		letter-spacing: 1px;
    		margin-top: 20px;
			border-radius: 50px;
        }
        
        .form-style-7 input[type="submit"]:hover,
        .form-style-7 input[type="button"]:hover {
            background: #000;
            color: #fff;
        }
        
        pre code {
            background-color: #eee;
            border: 1px solid #999;
            display: block;
            padding: 20px;
        }
        /* The Modal (background) */
        
        .modal {
            display: none;
            /* Hidden by default */
            position: fixed;
            /* Stay in place */
            z-index: 1;
            /* Sit on top */
            left: 0;
            top: 0;

            width: 100%;
            /* Full width */
            height: 100%;
            /* Full height */
            overflow: auto;
            /* Enable scroll if needed */
            background-color: rgb(0, 0, 0);
            /* Fallback color */
            background-color: rgba(0, 0, 0, 0.4);
            /* Black w/ opacity */
        }
        /* Modal Content/Box */
        
        .modal-content {
            background-color: #fefefe;
            margin: 5px auto;
            /* 15% from the top and centered */
            padding: 20px;
            border: 1px solid #888;
            max-width: 80%;
            /* Could be more or less, depending on screen size */
        }
        /* The Close Button */
        
        .close {
            color: #aaa;
            float: right;
            font-size: 28px;
            font-weight: bold;
        }
        
        .close:hover,
        .close:focus {
            color: black;
            text-decoration: none;
            cursor: pointer;
        }
        
        .information {
            font-size: 14px;
            color: #5c5c5c;
            font-family: 'Poppins', sans-serif;
        }
		button {
    		background-color: #9cca3b;
    		border: 0;
    		padding: 20px;
    		color: #fff;
    		font-size: 16px;
    		text-transform: uppercase;
    		font-weight: bold;
    		letter-spacing: 1px;
    		margin-top: 20px;
			border-radius: 50px;
		}
		button:hover {
    		background-color: #000;
		}
		button:active {
    		background-color: dimgrey;
		}