<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>ABV Calculator</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
background-color: #f8fafc;
min-height: 100vh;
}
/* Navigation Styles */
nav {
background: linear-gradient(135deg, #1e3a8a 0%, #1e40af 50%, #2563eb 100%);
backdrop-filter: blur(10px);
border-bottom: 1px solid rgba(255,255,255,0.1);
box-shadow: 0 4px 20px rgba(0,0,0,0.1);
position: sticky;
top: 0;
z-index: 1000;
transition: all 0.3s ease;
}
.nav-container {
max-width: 1200px;
margin: 0 auto;
padding: 0 1rem;
display: flex;
justify-content: space-between;
align-items: center;
height: 70px;
}
.site-name {
font-size: 1.5rem;
color: #ffffff;
text-decoration: none;
font-weight: 700;
letter-spacing: 0.5px;
text-transform: uppercase;
display: flex;
align-items: center;
gap: 0.5rem;
transition: all 0.3s ease;
}
.site-name:hover {
transform: translateY(-1px);
text-shadow: 0 4px 8px rgba(0,0,0,0.2);
}
.site-name::before {
content: "🍺";
font-size: 1.2rem;
}
/* Desktop Navigation */
.nav-menu {
display: flex;
list-style: none;
align-items: center;
gap: 1.5rem;
}
.nav-item {
position: relative;
}
.nav-link {
color: #ffffff;
text-decoration: none;
font-size: 0.95rem;
font-weight: 500;
padding: 0.75rem 1.25rem;
border-radius: 8px;
transition: all 0.3s ease;
position: relative;
overflow: hidden;
display: inline-flex;
align-items: center;
gap: 0.35rem;
border: none;
background: none;
cursor: pointer;
font-family: inherit;
}
.nav-link::before {
content: '';
position: absolute;
top: 0;
left: -100%;
width: 100%;
height: 100%;
background: linear-gradient(90deg, transparent, rgba(255,255,255,0.1), transparent);
transition: left 0.5s ease;
pointer-events: none;
}
.nav-link:hover::before {
left: 100%;
}
.nav-link:hover,
.nav-link:focus-visible {
background-color: rgba(255, 215, 0, 0.2);
transform: translateY(-2px);
box-shadow: 0 4px 12px rgba(0,0,0,0.15);
color: #fff;
outline: none;
}
.nav-link[aria-current="page"] {
background-color: rgba(255, 215, 0, 0.25);
box-shadow: inset 0 -2px 0 #ffd700;
}
.caret {
font-size: 0.7rem;
transition: transform 0.25s ease;
}
.nav-item.dropdown.open .caret,
.nav-item.dropdown:hover .caret {
transform: rotate(180deg);
}
/* Dropdown Styles (desktop) */
.dropdown-content {
position: absolute;
top: 100%;
left: 0;
background: linear-gradient(135deg, #1e3a8a 0%, #1e40af 100%);
min-width: 260px;
border-radius: 12px;
box-shadow: 0 10px 40px rgba(0,0,0,0.2);
opacity: 0;
visibility: hidden;
transform: translateY(-10px);
transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s ease;
border: 1px solid rgba(255,255,255,0.1);
backdrop-filter: blur(10px);
overflow: hidden;
pointer-events: none;
z-index: 1001;
max-height: 70vh;
overflow-y: auto;
}
.nav-item.dropdown:hover .dropdown-content,
.nav-item.dropdown:focus-within .dropdown-content,
.nav-item.dropdown.open .dropdown-content {
opacity: 1;
visibility: visible;
transform: translateY(0);
pointer-events: auto;
}
.dropdown-content a {
color: #ffffff;
padding: 0.85rem 1.25rem;
text-decoration: none;
display: block;
font-size: 0.9rem;
font-weight: 400;
transition: all 0.2s ease;
border-bottom: 1px solid rgba(255,255,255,0.05);
}
.dropdown-content a:last-child {
border-bottom: none;
}
.dropdown-content a:hover,
.dropdown-content a:focus-visible {
background-color: rgba(255, 215, 0, 0.2);
padding-left: 1.5rem;
outline: none;
}
.dropdown-content a[aria-current="page"] {
background-color: rgba(255, 215, 0, 0.25);
}
/* Mobile Menu Toggle */
.mobile-menu-toggle {
display: none;
flex-direction: column;
cursor: pointer;
padding: 0.5rem;
border-radius: 6px;
transition: all 0.3s ease;
background: none;
border: none;
gap: 0;
}
.mobile-menu-toggle:hover,
.mobile-menu-toggle:focus-visible {
background-color: rgba(255, 215, 0, 0.2);
outline: none;
}
.hamburger-line {
width: 25px;
height: 3px;
background-color: #ffffff;
margin: 3px 0;
transition: all 0.3s ease;
border-radius: 2px;
}
/* Mobile Menu Styles */
.mobile-menu {
display: none;
position: absolute;
top: 70px;
left: 0;
right: 0;
max-height: calc(100vh - 70px);
overflow-y: auto;
background: linear-gradient(135deg, #1e3a8a 0%, #1e40af 100%);
border-top: 1px solid rgba(255,255,255,0.1);
box-shadow: 0 4px 20px rgba(0,0,0,0.1);
backdrop-filter: blur(10px);
z-index: 1002;
}
.mobile-menu.active {
display: block;
animation: slideDown 0.3s ease;
}
@keyframes slideDown {
from {opacity:0; transform:translateY(-10px);}
to {opacity:1; transform:translateY(0);}
}
.mobile-menu .nav-link {
display: flex;
width: 100%;
justify-content: space-between;
padding: 1rem 1.5rem;
border-bottom: 1px solid rgba(255,255,255,0.05);
font-size: 1rem;
border-radius: 0;
}
.mobile-menu .nav-link[aria-current="page"] {
box-shadow: inset 4px 0 0 #ffd700;
}
/* Mobile sub-dropdown: collapsed by default, toggled via JS */
.mobile-menu .dropdown-content {
position: static;
opacity: 1;
visibility: visible;
transform: none;
box-shadow: none;
border: none;
background: rgba(0,0,0,0.15);
border-radius: 0;
pointer-events: auto;
max-height: 0;
overflow: hidden;
transition: max-height 0.3s ease;
}
.mobile-menu .nav-item.dropdown.open .dropdown-content {
max-height: 1000px;
}
.mobile-menu .dropdown-content a {
padding: 0.75rem 1.5rem 0.75rem 2.25rem;
font-size: 0.9rem;
}
/* Responsive */
@media (max-width:768px){
.nav-menu{display:none;}
.mobile-menu-toggle{display:flex;}
}
@media (max-width:480px){
.nav-container{height:60px;}
.site-name{font-size:1.1rem;}
.mobile-menu{top:60px; max-height:calc(100vh - 60px);}
}
/* Visually-hidden helper for screen readers */
.visually-hidden {
position: absolute;
width: 1px;
height: 1px;
overflow: hidden;
clip: rect(0 0 0 0);
white-space: nowrap;
}
</style>
</head>
<body>
<nav>
<div class="nav-container">
<a href="https://abvcalculator.org" class="site-name">ABV Calculator</a>
<ul class="nav-menu">
<!-- Most popular / common calculators promoted to top level -->
<li class="nav-item">
<a href="https://abvcalculator.org/" class="nav-link">Beer ABV</a>
</li>
<li class="nav-item">
<a href="https://abvcalculator.org/cocktail-abv-calculator/" class="nav-link">Cocktail ABV</a>
</li>
<li class="nav-item">
<a href="https://abvcalculator.org/bac-calculator/" class="nav-link">BAC</a>
</li>
<!-- All other calculators grouped under one dropdown -->
<li class="nav-item dropdown">
<button class="nav-link" aria-haspopup="true" aria-expanded="false">
More Calculators <span class="caret" aria-hidden="true">▾</span>
</button>
<div class="dropdown-content" role="menu">
<a href="https://abvcalculator.org/time-to-sober-up-calculator/" role="menuitem">Time to Sober Up Calculator</a>
<a href="https://abvcalculator.org/alcohol-cost-calculator/" role="menuitem">Alcohol Cost Calculator</a>
<a href="https://abvcalculator.org/calorie-in-alcohol-calculator/" role="menuitem">Calorie in Alcohol Calculator</a>
<a href="https://abvcalculator.org/alcohol-unit-calculator/" role="menuitem">Alcohol Unit Calculator</a>
<a href="https://abvcalculator.org/standard-drink-calculator/" role="menuitem">Standard Drink Calculator</a>
<a href="https://abvcalculator.org/alcohol-dilution-calculator/" role="menuitem">Alcohol Dilution Calculator</a>
<a href="https://abvcalculator.org/party-drink-calculator/" role="menuitem">Party Drink Planner</a>
<a href="https://abvcalculator.org/hydrometer-temperature-correction/" role="menuitem">Hydrometer Temperature Correction</a>
<a href="https://abvcalculator.org/yeast-pitch-rate-calculator/" role="menuitem">Yeast Pitch Rate Calculator</a>
<a href="https://abvcalculator.org/ibu-calculator/" role="menuitem">IBU Calculator</a>
<a href="https://abvcalculator.org/refractometer-abv-calculator/" role="menuitem">Refractometer ABV Calculator</a>
<a href="https://abvcalculator.org/chaptalization-calculator/" role="menuitem">Chaptalization Calculator</a>
<a href="https://abvcalculator.org/og-to-plato-converter/" role="menuitem">OG to Plato Converter</a>
</div>
</li>
<li class="nav-item"><a href="https://abvcalculator.org/drink-brew-guide/" class="nav-link">Drink & Brew Guide</a></li>
<li class="nav-item"><a href="https://abvcalculator.org/about-us/" class="nav-link">About Us</a></li>
<li class="nav-item"><a href="https://abvcalculator.org/contact-us/" class="nav-link">Contact Us</a></li>
</ul>
<button class="mobile-menu-toggle" onclick="toggleMobileMenu()" aria-label="Toggle navigation menu" aria-expanded="false" aria-controls="mobileMenu">
<span class="hamburger-line"></span>
<span class="hamburger-line"></span>
<span class="hamburger-line"></span>
<span class="visually-hidden">Menu</span>
</button>
</div>
<div class="mobile-menu" id="mobileMenu">
<a href="https://abvcalculator.org" class="nav-link" aria-current="page">Home</a>
<a href="https://abvcalculator.org/" class="nav-link">Beer ABV Calculator</a>
<a href="https://abvcalculator.org/cocktail-abv-calculator/" class="nav-link">Cocktail ABV Calculator</a>
<a href="https://abvcalculator.org/bac-calculator/" class="nav-link">BAC Calculator</a>
<div class="nav-item dropdown">
<button class="nav-link" aria-haspopup="true" aria-expanded="false" onclick="toggleSubMenu(this)">
More Calculators <span class="caret" aria-hidden="true">▾</span>
</button>
<div class="dropdown-content" role="menu">
<a href="https://abvcalculator.org/time-to-sober-up-calculator/" role="menuitem">Time to Sober Up Calculator</a>
<a href="https://abvcalculator.org/alcohol-cost-calculator/" role="menuitem">Alcohol Cost Calculator</a>
<a href="https://abvcalculator.org/calorie-in-alcohol-calculator/" role="menuitem">Calorie in Alcohol Calculator</a>
<a href="https://abvcalculator.org/alcohol-unit-calculator/" role="menuitem">Alcohol Unit Calculator</a>
<a href="https://abvcalculator.org/standard-drink-calculator/" role="menuitem">Standard Drink Calculator</a>
<a href="https://abvcalculator.org/alcohol-dilution-calculator/" role="menuitem">Alcohol Dilution Calculator</a>
<a href="https://abvcalculator.org/party-drink-planner/" role="menuitem">Party Drink Planner</a>
<a href="https://abvcalculator.org/hydrometer-temperature-correction/" role="menuitem">Hydrometer Temperature Correction</a>
<a href="https://abvcalculator.org/yeast-pitch-rate-calculator/" role="menuitem">Yeast Pitch Rate Calculator</a>
<a href="https://abvcalculator.org/ibu-calculator/" role="menuitem">IBU Calculator</a>
<a href="https://abvcalculator.org/refractometer-abv-calculator/" role="menuitem">Refractometer ABV Calculator</a>
<a href="https://abvcalculator.org/chaptalization-calculator/" role="menuitem">Chaptalization Calculator</a>
<a href="https://abvcalculator.org/og-to-plato-converter/" role="menuitem">OG to Plato Converter</a>
</div>
</div>
<a href="https://abvcalculator.org/drink-brew-guide/" class="nav-link">Drink & Brew Guide</a>
<a href="https://abvcalculator.org/about-us/" class="nav-link">About Us</a>
<a href="https://abvcalculator.org/contact-us/" class="nav-link">Contact Us</a>
</div>
</nav>
<script>
function toggleMobileMenu(){
const mobileMenu = document.getElementById('mobileMenu');
const toggle = document.querySelector('.mobile-menu-toggle');
const lines = toggle.querySelectorAll('.hamburger-line');
const isOpen = mobileMenu.classList.toggle('active');
toggle.setAttribute('aria-expanded', isOpen);
if(isOpen){
lines[0].style.transform='rotate(45deg) translate(5px,5px)';
lines[1].style.opacity='0';
lines[2].style.transform='rotate(-45deg) translate(7px,-6px)';
}else{
lines[0].style.transform='none';
lines[1].style.opacity='1';
lines[2].style.transform='none';
// collapse any open sub-menu when the whole menu closes
document.querySelectorAll('.mobile-menu .nav-item.dropdown.open').forEach(item => {
item.classList.remove('open');
item.querySelector('.nav-link').setAttribute('aria-expanded','false');
});
}
}
function toggleSubMenu(button){
const item = button.closest('.nav-item.dropdown');
const isOpen = item.classList.toggle('open');
button.setAttribute('aria-expanded', isOpen);
}
// Desktop dropdown: keep open state in sync for keyboard/touch via click as well as hover
document.querySelectorAll('.nav-menu .nav-item.dropdown > .nav-link').forEach(btn => {
btn.addEventListener('click', function(e){
const item = this.closest('.nav-item.dropdown');
const isOpen = item.classList.toggle('open');
this.setAttribute('aria-expanded', isOpen);
});
});
document.addEventListener('click', function(event){
const mobileMenu = document.getElementById('mobileMenu');
const toggle = document.querySelector('.mobile-menu-toggle');
// Close mobile menu if clicking outside it
if(mobileMenu && toggle && mobileMenu.classList.contains('active') &&
!toggle.contains(event.target) && !mobileMenu.contains(event.target)){
mobileMenu.classList.remove('active');
toggle.setAttribute('aria-expanded','false');
const lines = toggle.querySelectorAll('.hamburger-line');
lines[0].style.transform='none';
lines[1].style.opacity='1';
lines[2].style.transform='none';
}
// Close desktop dropdown if clicking outside it
document.querySelectorAll('.nav-menu .nav-item.dropdown.open').forEach(item => {
if(!item.contains(event.target)){
item.classList.remove('open');
item.querySelector('.nav-link').setAttribute('aria-expanded','false');
}
});
});
window.addEventListener('scroll', function(){
const nav = document.querySelector('nav');
if(window.scrollY > 50){
nav.style.background='linear-gradient(135deg, rgba(30,58,138,0.95) 0%, rgba(30,64,175,0.95) 50%, rgba(37,99,235,0.95) 100%)';
nav.style.backdropFilter='blur(15px)';
}else{
nav.style.background='linear-gradient(135deg, #1e3a8a 0%, #1e40af 50%, #2563eb 100%)';
nav.style.backdropFilter='blur(10px)';
}
});
window.addEventListener('resize', function(){
const mobileMenu = document.getElementById('mobileMenu');
const toggle = document.querySelector('.mobile-menu-toggle');
if(window.innerWidth > 768 && mobileMenu && toggle){
mobileMenu.classList.remove('active');
toggle.setAttribute('aria-expanded','false');
const lines = toggle.querySelectorAll('.hamburger-line');
lines[0].style.transform='none';
lines[1].style.opacity='1';
lines[2].style.transform='none';
document.querySelectorAll('.mobile-menu .nav-item.dropdown.open').forEach(item => {
item.classList.remove('open');
item.querySelector('.nav-link').setAttribute('aria-expanded','false');
});
}
});
document.addEventListener('keydown', function(event){
const mobileMenu = document.getElementById('mobileMenu');
if(event.key === 'Escape'){
if(mobileMenu && mobileMenu.classList.contains('active')){
const toggle = document.querySelector('.mobile-menu-toggle');
mobileMenu.classList.remove('active');
toggle.setAttribute('aria-expanded','false');
const lines = toggle.querySelectorAll('.hamburger-line');
lines[0].style.transform='none';
lines[1].style.opacity='1';
lines[2].style.transform='none';
}
document.querySelectorAll('.nav-item.dropdown.open').forEach(item => {
item.classList.remove('open');
item.querySelector('.nav-link').setAttribute('aria-expanded','false');
});
}
});
</script>
</body>
</html>
Disclaimer
Contents
PLEASE READ THIS DISCLAIMER CAREFULLY BEFORE USING THE ABV CALCULATOR WEBSITE. By accessing or using our website, you acknowledge that you have read, understood, and agree to be bound by this disclaimer.
1. General Disclaimer
The information provided on the ABV Calculator website, including tool like Cocktail Alcohol Calculator is for general informational and educational purposes only. All information on the site is provided in good faith; however, we make no representation or warranty of any kind, express or implied, regarding the accuracy, adequacy, validity, reliability, availability, or completeness of any information on the website.
Under no circumstance shall we have any liability to you for any loss or damage of any kind incurred as a result of the use of the site or reliance on any information provided on the site. Your use of the site and your reliance on any information on the site is solely at your own risk..
2. Accuracy of Information
The content of ABV Calculator website comes from sources believed to be accurate and up-to-date, but we cannot guarantee that all information is completely current or error-free. Information may contain technical inaccuracies or typographical errors. We reserve the right to make changes and corrections at any time, without notice.
The ABV calculations provided by our tools are based on standard formulas and typical values. However, actual alcohol by volume content may vary based on numerous factors including ingredients, brewing methods, fermentation conditions, measurement accuracy, and other variables that are beyond our control.
3. Alcohol Consumption Notice
ABV Calculator strongly encourages responsible drinking. The information and tools provided on this website are not intended to promote excessive alcohol consumption.
We remind users that:
- It is illegal to consume alcohol if you are under the legal drinking age in your jurisdiction.
- It is illegal to drive while intoxicated.
- Alcohol consumption may be harmful to your health and can lead to addiction.
- Pregnant women should avoid alcohol consumption.
Our tools are designed to help brewers and mixologists understand the alcohol content of their creations, not to encourage unsafe consumption practices.
4. Not Medical Advice
The information provided on this website is not intended to be a substitute for professional medical advice, diagnosis, or treatment. Always seek the advice of your physician or other qualified health provider with any questions you may have regarding a medical condition or the consumption of alcoholic beverages.
Never disregard professional medical advice or delay in seeking it because of something you have read on this website. If you think you may have a medical emergency, call your doctor or emergency services immediately.
5. Not Legal Advice
The information provided on this website is not intended to constitute legal advice. All information, content, and materials available on this site are for general informational purposes only.
Laws and regulations concerning the production, distribution, and consumption of alcoholic beverages vary widely by location. It is your responsibility to understand and comply with all applicable laws and regulations in your jurisdiction, including but not limited to licensing requirements, taxation, labeling, and age restrictions.
6. External Links Disclaimer
The ABV Calculator website may contain links to external websites that are not provided or maintained by or in any way affiliated with us. Please note that we do not guarantee the accuracy, relevance, timeliness, or completeness of any information on these external websites.
We do not endorse any third-party websites, their content, or any goods and services they may offer. You acknowledge and agree that we shall not be responsible or liable, directly or indirectly, for any damage or loss caused or alleged to be caused by or in connection with the use of or reliance on any such content, goods or services available on or through any such websites.
7. Testimonials Disclaimer
The site may contain testimonials by users of our tools and services. These testimonials reflect the real-life experiences and opinions of such users. However, the experiences are personal to those particular users, and may not necessarily be representative of all users of our tools. We do not claim, and you should not assume, that all users will have the same experiences.
Your individual results with our calculators and tools may vary depending on numerous factors including the accuracy of your measurements, the specific equipment used, and the brewing or mixing conditions.