﻿body {
    padding-top: 50px;
    padding-bottom: 20px;
    transition: .5s all ease-in-out;
}

.hidden-content {
    opacity: 0;
}

.wide {
	padding-left: 60px;
	padding-top: 0px;
}


.selected {
    background-color: #be1e2d;
    border-left: 2px solid white;
}
.selected > a {
    color: white!important;
}




/* Set padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
    max-width: 280px;
}

nav {
	transition: .5s all ease-in-out;
}

ul.nav li.dropdown:hover ul.dropdown-menu {
    display: block;
}

.navbar-collapse.collapse {
    display: block !important;
}

.navbar-nav > li, .navbar-nav {
    float: left !important;
}

    .navbar-nav.navbar-right:last-child {
        margin-right: -15px !important;
    }

.navbar-right {
    float: right !important;
}




ul.nav a i {
    margin-right: 1em;
}

ul.nav > li {
    transition: .1s all ease-in-out;
}

ul.nav > li:hover {
    background-color: #be1e2d;
    border-left: 2px solid white;
    color: white;
}


ul.nav > li:nth-child(2) a {
    text-align: center;
}

ul.nav > li:nth-child(2):hover,
ul.nav > li:nth-child(1):hover {
    background-color: inherit;
    border: 0;
}








#nav-icon1, #nav-icon2, #nav-icon3, #nav-icon4 {
  width: 40px;
  height: 40px;
  position: relative;
  margin: 15px;
  float: right;
  background-color: white;
  // border: 2px solid #f2f2f2;
  border-radius: 3px;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .5s all ease-in-out;
  -moz-transition: .5s all ease-in-out;
  -o-transition: .5s all ease-in-out;
  transition: .5s all ease-in-out;
  cursor: pointer;
}

#nav-icon1 span, #nav-icon3 span, #nav-icon4 span {
  display: block;
  position: absolute;
  height: 3px;
  width: 30px;
  background: #be1e2d;
  border-radius: 9px;
  opacity: 1;
  left: 5px;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}

#nav-icon3 span:nth-child(1) {
  top: 12px;
}

#nav-icon3 span:nth-child(2),#nav-icon3 span:nth-child(3) {
  top: 20px;
}

#nav-icon3 span:nth-child(4) {
  top: 28px;
}

#nav-icon3.open span:nth-child(1) {
  top: 18px;
  width: 0%;
  left: 50%;
}

#nav-icon3.open span:nth-child(2) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}

#nav-icon3.open span:nth-child(3) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

#nav-icon3.open span:nth-child(4) {
  top: 18px;
  width: 0%;
  left: 50%;
}


.visible {
    left: -232px!important;
}

.to-left {
	left: 60px;
	// background-color: #222;
	transition: .5s all ease-in-out;
}

@media (max-width: 768px) {
	.to-left {
		left: 100px;
	}

	.wide {
		padding-left: 0;
		padding-top: 70px;
	}
}

#loadingDiv {
  position: fixed; 

  min-width: 150px;
  min-height: 150px;
  width: 100%; 
  height: 100%; 
  bottom: 0; 
  left: 0;
    border-radius: 5px;
  display: flex; 
  flex-direction: column; 
  justify-content: center; 
  z-index: 99999999;
  background-color: rgba(255, 255, 255, 0.8);
  
}


#loader {
	margin: 0 auto;
  border: 8px solid #f3f3f3;
  border-radius: 50%;
  border-top: 8px solid #be1e2d;
  width: 60px;
  height: 60px;
  -webkit-animation: spin 2s linear infinite;
  animation: spin 2s linear infinite;
}

@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.person-item {
    height: 100vh;
    page-break-after: always;
    display: flex;
    flex-direction: column;
    height: 100vh;
    justify-content: flex-end;
    align-items: flex-end;
}

.to-print {
    margin: 0;
    padding: 0;
    min-height: 0;
    transition: none;
}

.print-env_name {
    margin: 0;
    margin-bottom: 10px;
    font-weight: bold;
}

.print-env_date {
    margin: 0;
    font-style: italic;
    font-size: 20px;
}