/*
Theme Name: DV Theme
Theme URI: ://
Author: Kyle Boyle
Author URI: ://
Description: Theme for DataViz sites.
Version: 1.0
License: None
License URI: ://
Text Domain: dvtheme
Tags: 
*/

html {
  margin: 0;
  line-height: 1.4;
}
body {
  margin: 0;
  background-color: #ffffff;
  font-family: 'helvetica-neue', 'helvetica neue', 'helvetica', 'arial', 'sans-serif';
  font-size: 20px;
  font-weight: 400;
  color: #181818;
}
h1, h2, h3, h4, h5, h6 { 
  margin: 0;
  padding: 0.4em 0;
  font-weight: inherit;
  line-height: 1.2em; /* otherwise it inherits a small size */
}
h1 { font-size: 2em; }
h2 { font-size: 1.5em; }
h3 { font-size: 1.2em; } /*Peter edits*/
h4 { font-size: 0.9em; } 
h5 { font-size: 0.83em; }
h6 { font-size: 0.67em; }

a {
  text-decoration: none;
  color: #3090e8;
}
a:visited {
  color: #1060a0;
}
p {
  margin: 0;
}
strong, b {
  font-weight: bolder;
}
blockquote a { /* fake as button */
  padding: 8px;
  border-radius: 4px;
  border-style: outset;
  border-width: 3px;
  border-color: #3090e8;
  color: #f8f8f8;
  background-color: #3090e8;
}
blockquote a:visited {
  color: #f8f8f8;
}
blockquote a:active {
  border-style: inset;
}
ol {
  margin: 0;
}
.clear {
  clear: both;
}



/* top banner (contains logo, name, and links to pages) */
.banner-content {
  width: 100%;
  height: 48px;
  padding: 4px 0;
  background-color: #3c3c3c;
  white-space: nowrap;
  z-index: 1;
}
.banner-fixed {
  position: fixed;
}
img.title {
  height: 32px;
  padding: 10px 18px;
}

/* top menu list of links */
/* global styles */
#show-hide-menu {
  display: none;
}
#menu-check-label {
  display: none;
}
ul.top-menu-list {
  margin: 0;
  list-style: none;
  white-space: normal;
}
ul.top-menu-list a {
  color: #e0e0e0;
  text-decoration: none;
}
ul.top-menu-list li:hover > a {
  color: #3090e8;
}
ul.sub-menu {
  padding: 0;
  list-style: none;
}
/* for mobile */
@media screen and (max-width: 759px) {
  #menu-check-label {
    display: block;
    position: absolute;
    top: 0px;
    right: 16px;
    width: 40px;
    height: 40px;
    padding: 0;
    margin: 0;
    font-size: 40px;
    color: #e0e0e0;
    text-align: center;
    cursor: pointer;
  }
  .top-menu-wrapper {
    display: none;
    position: absolute;
    box-shadow: 0 6px 16px #404040;
  }
  #show-hide-menu:checked ~ .top-menu-wrapper {
    display: block;
  }
  .top-menu-wrapper {
    top: 56px;
    right: 0px;
    left: 0px;
    padding: 12px;
    background-color: #3c3c3c;
    z-index: 20;
  }
  ul.top-menu-list {
    padding-left: 12px;
    text-align: left;
  }
  ul.top-menu-list > li {
    margin: 4px;
  }
  ul.top-menu-list ul.sub-menu {
    text-align: left;
    padding-left: 16px;
    margin-top: 2px;
  }
}
/* for larger screens/windows */
@media screen and (min-width: 760px) {
/*   .overflow-container { /* prevents right side overflow, but allows dropdown overflow 
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 56px; /* changed this from 80px to fix issue, might break menu hover -- KrB 3/21/19 
    overflow: hidden;
  }
  .overflow-container:hover { 
     height: 240px; /* should be enough to contain about 3 dropdown items 
  } */
/* got rid of old overflow container and replaced it with this, which makes it do pretty much nothing - KrB 4/22/2019 */
  .overflow-container {
    position: absolute;
    top: 0;
	width: 100%;
  }
  .top-menu-wrapper {
    display: inline-block;
	float: right;
	margin-right: 128px;
    font-weight: 300;
  }
  ul.top-menu-list > li {
    display: block;
    position: relative;
    float: left;
    z-index: 10; /* so hover works when it's positioned above the body content */
  }
  ul.top-menu-list > li > a > div {
    padding: 14px;
  }
  /* sub list */
  ul.top-menu-list ul.sub-menu {
    display: none;
    position: absolute;
    min-width: 10em;
    top: 48px; /* 56 minus the hidden top padding */
    left: 50%;
	transform: translateX(-50%);
	padding: 10px 6px 2px; /* top padding hides top border radii */
	border: solid #424242 1px;
    border-radius: 8px;
    background-color: #ffffff;
  }
  ul.top-menu-list li:hover ul.sub-menu {
    display: block;
  }
  ul.sub-menu li {
/*     background-color: #383838; */
/*     border-radius: 8px; */
/*     box-shadow: 2px 1px 6px #484848; */
/* 	border-bottom: solid black 1px; */
    margin: 5px 0;
  }
  ul.sub-menu > li > a > div {
    min-height: 32px;
/*     padding: 12px 4px; */
/*     border-bottom: solid 1px #303030; */
    text-align: center;
  }
}



/* body content */
.body-content {
  width: 100%;
}
p {
  padding: 12px 0px;
}
.body-section {
  position: relative;
  height: 100%;
  width: 100%;
  border-style: solid;
  border-width: 0;
  border-color: #404040;
  box-shadow: 0 4px 12px #404040;
  background-color: #f8f8f8;
  background-image: none;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}
.body-section .widget-container {
  height: 100%; /* placeholder, get some real properties from the code to be deleted */
  text-align: center;
}
.body-section .widget-container:only-of-type { /* for one widget */
  width: 100%; /* change to accomodate padding */
}
.body-section .widget-container:first-of-type:nth-last-of-type(2n), /* for first of two widgets */
.body-section .widget-container:nth-of-type(2n):last-of-type { /* for second of two widgets */
  width: 50%;
  float: left;
}
.body-section .widget-container:first-of-type:nth-last-of-type(3n), /* first of 3 widgets */
.body-section .widget-container:nth-of-type(2n):nth-last-of-type(2n), /* middle of 3 widgets */
.body-section .widget-container:nth-of-type(3n):last-of-type { /* last of 3 widgets */
  width: 33%;
  float: left;
}
.body-section .widget-container p {
  padding: 4px 0;
  margin-right: 0;
}
.body-section .widget-container ol {
  padding-top: 2px;
}
.body-section .widget-container ol p {
  padding: 4px;
}
.body-section .widget-container img {
  /* display: block; */
  height: auto;
  max-height: 90%;
  max-width: 90% !important; /* override stupid inline wordpress styles */
  /* margin: 5% auto; */
}
.body-section .widget-container .textwidget {
  padding: 0 12px;
}
.body-section ol li {
  padding: 4px;
}
/* for mobile */
@media screen and (max-width: 576px) {
  p {
    width: 96%;
    padding: 12px 2%;
  }
  .body-section .widget-container:first-of-type:nth-last-of-type(2n), /* for first of two widgets */
  .body-section .widget-container:nth-of-type(2n):last-of-type { /* for second of two widgets */
    width: 100%; /* change to accommodate padding? */
    float: none;
  }
  .body-section .widget-container:first-of-type:nth-last-of-type(2n), /* first of 3 widgets */
  .body-section .widget-container:nth-of-type(n):nth-last-of-type(n), /* middle of 3 widgets */
  .body-section .widget-container:nth-of-type(2n):last-of-type { /* last of 3 widgets */
    width: 100%;
    float: none;
  }
  .body-section .widget-container p {
    width: 96%;
    padding: 4px 2%;
  }
}


/* full page */
.page-full {
  position: relative;
  width: 100%;
  min-height: 500px;
  height: 100%;
}

/* center text */
.center {
  text-align: center;
}


/* footer content - NOTE: colors not used, get imported from Theme Settings in WP */
footer.footer-content {
  height: 100px;
  width: 100%;
  background-color: #BF3737;
  background-size: contain;
  color: #7BBF37;
  position: relative;
}

.footer-divider {
  margin: 0 4em;
}

.footer-text { /* this must by static so that the image is positioned relative to .body-section */
  padding: 18px;
  font-size: 16px;
}

.footer-menu-block {
  padding-left: 7%;
  list-style: none;
  font-size: 12pt;
  text-align: center;
}
.footer-menu-block > li { /* each sublist block */
  display: inline-block;
  vertical-align: top;
  min-width: 22%;
  margin: 24px 12px 0 0;
  text-align: left;
}
.footer-menu-block > li > a { /* sublist headers */
  font-weight: bold;
}
.footer-menu-block li > ul { /* sublist contents (recursive) */
  padding-left: 0.5em;
}

.social-menu-wrapper {
  padding: 0;
}
ul.social-menu-list {
  padding-left: 32px;
  margin: 0;
  list-style: none;
}
ul.social-menu-list a {
  color: #e0e0e0;
}
ul.social-menu-list a:hover {
  color: #3090e8;
}

/* Added for form embedded inside Elementor page for Beta download request - TjB 5-Feb-18    */
/* Style inputs with type="text", select elements and textareas */
.dvFormInput, select, textarea {
    width: 100%; /* Full width */
    font-size: 14px;
    padding: 12px; /* Some padding */
    border: 1px solid #ccc; /* Gray border */
    border-radius: 4px; /* Rounded borders */
    box-sizing: border-box; /* Make sure that padding and width stays in place */
    margin-top: 6px; /* Add a top margin */
    margin-bottom: 16px; /* Bottom margin */
    resize: vertical /* Allow the user to vertically resize the textarea (not horizontally) */
}

::-webkit-input-placeholder {
    font-size: 14px;
    color: #BDBDBD;
}

/* Style the submit button with a specific background color etc */
.dvFormSubmit {
    background-color: #00C853;
    color: white;
    padding: 12px 24px; /* KV was 20px 42px */
    border: none;
    border-radius: 3px; /* KV was 4 */
    cursor: pointer;
    font-size: 13px; /* KV was 18 */
    height: auto; /* KV new */
}

/* When moving the mouse over the submit button, add a darker green color */
.dvFormSubmit:hover {
    background-color: #00E676;
}

/* Add a background color and some padding around the form */
.dvFormContainer {
    border-radius: 5px;
    background-color: #f2f2f2;
    padding: 20px;
}