<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<title>CodePen - Thermometer</title>
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<div class="thermometer">
<div class="thermometer__inner">
<div class="thermometer__title">°C</div>
<div class="thermometer__title">°F</div>
<div class="thermometer__c">
<div class="thermometer__label">50</div>
<div class="thermometer__label">40</div>
<div class="thermometer__label">30</div>
<div class="thermometer__label">20</div>
<div class="thermometer__label">10</div>
<div class="thermometer__label">0</div>
<div class="thermometer__label">-10</div>
<div class="thermometer__label">-20</div>
<div class="thermometer__label">-30</div>
<div class="thermometer__label">-40</div>
</div>
<div id="temp-val" class="thermometer__tube" data-c="0" data-f="32" title="0°C, 32°F">
<div id="temp-fill" class="thermometer__mercury"></div>
<div class="thermometer__ring"></div>
<div class="thermometer__ring"></div>
</div>
<div class="thermometer__f">
<div class="thermometer__label">120</div>
<div class="thermometer__label">100</div>
<div class="thermometer__label">80</div>
<div class="thermometer__label">60</div>
<div class="thermometer__label">40</div>
<div class="thermometer__label">20</div>
<div class="thermometer__label">0</div>
<div class="thermometer__label">-20</div>
<div class="thermometer__label">-40</div>
</div>
<div class="thermometer__bulb"></div>
</div>
</div>
<script src="js/script.js"></script>
</body>
</html>
