/*Font size and spacing*/
body {
	font-size:1.125rem;
	line-height:1.6;
}

/*Container padding*/
.container {
  padding-top: 25px;
  padding-bottom: 50px;
}

/*Navbar padding*/
#navstyle {
  padding-top: 0px;
  padding-bottom: 0px;
}

/*Heading tag styles*/

h1, h2, h3, h4 {
  padding-bottom: 10px;
  font-family: Georgia, Serif;
}

.btn-primary,
.btn-primary:hover,
.btn-primary:active,
.btn-primary:visited,
.btn-primary:focus {
    background-color: #0084c9 !important;
	color: #white !important;
    border-color: #0084c9 !important;
}

/*Homepage banner style*/
#banner {
  background-image: url("/images/banner.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}

/*Homepage articles padding*/
#articles {
	padding-top: 25px;
	padding-bottom: 0px;
}

/*Smaller header tags on mobile*/
@media screen and (max-width: 768px) {
h1 {
	font-size:2rem;
}

h2 {
	font-size:1.75rem;
}

h3 {
	font-size:1.5rem;
}

h4 {
	font-size:1.25rem;
}
.display-4 {
	font-size:2.0rem;
}
}

/*Calculator styling*/

input[type=text], select {
    width: 100%;
    padding: 12px 20px;
    margin: 8px 0;
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
}

input[type=submit], input[type=submit]:hover {
    width: 100%;
    background: #0084c9 !important;
    color: white;
    padding: 14px 20px;
    margin: 8px 0;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}

.calc	 {
	max-width: 350px;
	min-width: 250px;
    border-radius: 5px;
    background-color: #f2f2f2;
    padding: 20px;
    /* margin: auto; */ /*Enable to center calc*/
}

.row#calc-row {
	margin-top: 50px;
}

h2#calc-header {
  text-align: center;
}

h4#answer-header {
  margin-top: 20px;	
}

#answer {
	margin-top: 20px;
}

/*Ad spacing iPhone and iPad*/
@media screen and (max-width: 768px) {
 #ad-slot { 
  min-height: 300px;
}
}

/*Ad spacing large screens*/
@media screen and (min-width: 769px) {
 #ad-slot { 
  min-height: 300px;
}
}

/*Column design for blood pressure pages*/

/*Space between/number of columns*/
.columns
{   
    -moz-column-width: 5.0em; /* Firefox */
    -webkit-column-width: 5.0em; /* webkit, Safari, Chrome */
    column-width: 5.0em;
}

/*Remove standard list and bullet formatting from ul*/
.columns ul
{
    margin: 0;
    padding: 0;
    list-style-type: none;
}

/*Correct webkit/chrome uneven margin on the first column*/
.columns ul li:first-child
{
    margin-top:0px;
}

/*Space between lines*/
.columns li
{
    line-height:35px;
}

/*Normal bulleted list spacing (increased for mobile usability*/
li
{
    line-height:30px;
}

/*Spacing before H2 for navigation strip*/
h2::before { 
  display: block; 
  content: " "; 
  margin-top: -60px; 
  height: 60px; 
  visibility: hidden; 
  pointer-events: none;
}

/*Spacing before H2 for navigation strip for iPhone and iPad*/
@media screen and (max-width: 768px) {
 h2::before { 
  display: block; 
  content: " "; 
  margin-top: -85px; 
  height: 85px; 
  visibility: hidden; 
  pointer-events: none;
}
}

/*Automatic smooth scrolling*/

html {
  scroll-behavior: smooth;
}

/*Scroll to top button*/

#myBtn {
  display: none;
  position: fixed;
  bottom: 30px;
  right: 30px;
  z-index: 99;
  font-size: 18px;
  border: none;
  outline: none;
  background-color: #007bff;
  color: white;
  cursor: pointer;
  padding: 15px;
  border-radius: 4px;
}

/*Dark mode*/
/*
@media (prefers-color-scheme: dark) {
	body {
        color: #fff;
        background: #000;
    }

	a.navbar-brand, a.nav-link {
		text-decoration: none;
	}

	nav.navbar {
        background-color: #1e2024 !important;
    }
	
	button.btn.btn-primary.dropdown-toggle {
		background-color: #1e2024 !important;
	}
	
	div.dropdown-menu.dropdown-menu-md-right.show {
		background-color: #1e2024 !important;
	}
	
	a.dropdown-item {
	        color: #fff;
		text-decoration: underline;	
	}
	
	.btn-primary, .btn-primary.dropdown-toggle, .btn-primary.dropdown-toggle:focus {
		border-color:#1e2024;
		box-shadow:#1e2024;
	}
	
	.dropdown-item:focus, .dropdown-item:hover {
		color: #fff;
		text-decoration: underline;	
		background-color:#1e2024;
	}

	.jumbotron {
        background-color: #1e2024;
    }
	
	.col {
        background-color: #000000;
	}
	
	header h1,
    header h2,
	header h3,
	header h4,
	header h5,
	th,
	td	{
        color: #fff;
    }

    a, a:hover {
        color: #fff;
		text-decoration: underline;
    }
	
	.calc {
		background-color: #000000;
	}
	
    footer.bg-light, footer.text-lg-start {
        background-color: #1e2024 !important;
    }
}
*/