JSFiddle - React, Tailwind, and code Playground
by ayurdhata
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="width=300px" />
<title>PreSales-1</title>
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"
/>
<link
href="https://cdn.jsdelivr.net/npm/remixicon@2.5.0/fonts/remixicon.css"
rel="stylesheet"
/>
<style type="text/css">
body {
font-family: "Poppins";
}
p {
margin: 1rem;
max-width: 800px;
}
.heading-1 {
font-size: 2rem;
}
.heading-2 {
font-size: 1.8rem;
}
.heading-3 {
font-size: 1rem;
}
.salesroom-img {
width: 15rem;
}
.salesroom-text {
font-size: 1.2rem;
}
.icons {
width: 2rem;
padding: 1rem;
}
.images {
max-width: 800px;
height: auto;
}
.business-logo {
max-width: 15rem;
min-width: 4rem;
max-height: 6rem;
}
@media all and (max-width: 600px) {
p {
margin: 1rem;
max-width: 500px;
}
.heading-1 {
font-size: 3.5rem;
}
.heading-2 {
font-size: 3rem;
}
.heading-3 {
font-size: 1.6rem;
}
.icons {
width: 2rem;
padding: 0.8rem;
}
.salesroom-img {
width: 8rem;
}
.salesroom-text {
font-size: 1.2rem;
}
}
</style>
</head>
<body style="margin: 0rem; padding: 0">
<center>
<table
bordercolor="#fff"
bgcolor="#fff"
max-width="800px"
style="padding: 1rem"
>
<!-- Business logo start -->
<tr>
<td align="center" valign="top" id="bodyCell">
<img
class="business-logo"
...