@font-face {
	font-family: "DINOT-Regular"; 
	src: url("../fonts/dinot-regular.eot") format("embedded-opentype"), 
	url("../fonts/dinot-regular.woff2") format("woff2"), 
	url("../fonts/dinot-regular.woff") format("woff"), 
	url("../fonts/dinot-regular.ttf") format("truetype"), 
	url("../fonts/dinot-regular.svg") format("svg"); 
}

@font-face {
	font-family: "DINOT-Light"; 
	src: url("../fonts/dinot-light.eot") format("embedded-opentype"), 
	url("../fonts/dinot-light.woff2") format("woff2"), 
	url("../fonts/dinot-light.woff") format("woff"), 
	url("../fonts/dinot-light.ttf") format("truetype"), 
	url("../fonts/dinot-light.svg") format("svg"); 
}

@font-face {
	font-family: "DINOT-Bold"; 
	src: url("../fonts/dinot-bold.eot") format("embedded-opentype"), 
	url("../fonts/dinot-bold.woff2") format("woff2"), 
	url("../fonts/dinot-bold.woff") format("woff"), 
	url("../fonts/dinot-bold.ttf") format("truetype"), 
	url("../fonts/dinot-bold.svg") format("svg"); 
}

.font-light {
	font-family: DINOT-Light !important;
}

.font-bold {
	font-family: DINOT-Bold !important;
}

body {
	font-family: DINOT-Regular !important;
	max-width:1340px;
	margin:0 auto;
}

.nav-menu {
	width: 100%;
    position: absolute;
    z-index: 999;
}

.services, .nav-menu ul {
    padding: 10px 0px;
    text-align: center;
    margin-bottom:0;
}

.services, .nav-menu li {
	display:inline-block;
	padding:0 20px;
}

.nav-menu li a {
	color:white;
	text-decoration: none;
}

.nav-menu li a:hover {
	color:#1772b4;
}

.sticky {
	position:fixed;
	top:0;
	left:0;
	width:100%;
	background-color:white;
	border-bottom:1px #f0f0f0 solid;
	animation-name:fade;
	animation-duration:0.2s;
}

@keyframes fade {
	0% { opacity:0; }
	100% { opacity:1; }
}


.sticky li a {
	color:black;
}

.sticky li a:hover {
	color:#1772b4;
}

.convenience, .applications, .support, .contact {
	font-size:0.9rem;
}

ul, ol {
	list-style:none;
}

.submitButton {
	color:white;
	border:1px solid #1772b4;
	background-color:#1772b4;
	border-radius:0;
}
.navbar {

	position:absolute;
	right:50%;
	top:0;
	z-index:999;
}

header {
  position: relative;
  background-color: black;
  height: 95vh;
  max-height:900px;
  min-height: 25rem;
  width: 100%;
  overflow: hidden;
}

header .container {
  position: relative;
  z-index: 2;
}

header .overlay {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background: transparent url('../img/rectangle.png') 0% 0% no-repeat padding-box;
  mix-blend-mode: multiply;
  opacity: 0.9;
  z-index: 2;
}

header {
    background: url('../img/alco-bg.jpg') black no-repeat center center scroll;
    background-size:cover;
   /** background-color:black; **/
  }
  header video {
    display: none;
  }

header h1 {
	font-size:2.25rem;
}

header p {
	font-size:1.75rem;
}

.block2 {
	background-color:#1772b4;
}

.block3{
	background-color:#f2f6f9;
}

.block4 {
	background-color:white;
}

.block4 p {
	color:white;
}

.block6 {
	background-color:#f2f6f9;
}

.block8-button {
	color:white;
	border-color:white;
	font-size:1rem;
	border-radius:0;
	padding:0.7rem 1.2rem;
}

.block8-button:hover {
	background-color:white;
	color:#1772b4;
	border-color:white;
}

#slide {
	height:50vh;
	margin:0;
}


#bubble {
	background-color:#1772b4;
	padding:1.5rem;
	margin-top:-100px;
	margin-left:2rem;
	margin-right:2rem;
	color:white;
}

#bubble h4, #bubble p {
	opacity:100%;
	color:white;
}

.block6 p, .block6 h4, .block7 p, .block7 h5, .block7 h4, .block7 li, .block7 h4 {
	color:#257ab8;
}

.block2 p {
	color:white;
}

.blockquote, .block3 p {
	color:#257ab8;
}

.blockquote {
	font-size:1.7rem;
}

.block4-button, .block7-button {
	border:1px solid #257ab8;
	border-radius:0;
	color: #257ab8;
	padding:.75rem .75rem;
}

.block4-button:hover, .block7-button:hover {
	background-color:#257ab8;
	color:white;
}

#machineFilter {
	width:100%;
}
#machineFilter button {
	padding:0 15px;
	border:1px #257ab8 solid;
	margin:5px 15px;
	color:#257ab8;
}

#machineFilter .clicked, #machineFilter button:hover {
	background-color:#1772b4;
	color:white;
}

.icons img {
	padding:0.3rem .175rem;
}
.filterDiv button {
	border-radius: 0;
	background-color: #1772b4;
	color:white;
	padding:.75rem .75rem;
}

.filterDiv button:hover {
	background-color: white;
	color: #1772b4;
	border:#1772b4 1px solid;
}

.filterDiv ul {
	padding:0 15px;
}

.filterDiv ul li::before {
  content: "\2022";  /* Add content: \2022 is the CSS Code/unicode for a bullet */
  color: #1772b4; /* Change the color */
  font-weight: bold; /* If you want it to be bold */
  display: inline-block; /* Needed to add space between the bullet and the text */
  width: 1em; /* Also needed for space (tweak if needed) */
  margin-left: -1em; /* Also needed for space (tweak if needed) */
}

.icons {
	background-color: #f2f6f9;
	width:100%;
	height:auto;
	padding-bottom:2rem;
}

.filterDiv {
	display:none;
}

.show {
	display:block;
}

.block8 {
	background-color:#1772b4;
}

.block8 p {
	margin-bottom:0.2rem;
	color:white;
	font-size:0.7rem;
}

#F-Name.form-control, #F-Company.form-control, #F-Email.form-control, #F-PhoneNumber.form-control, #F-Message.form-control {
	background-color:transparent;
	border-radius:0;
	color:white;
	font-size:0.9rem;
}

#F-Name.form-control::placeholder, #F-Company.form-control::placeholder, #F-Email.form-control::placeholder, #F-PhoneNumber.form-control::placeholder, #F-Message.form-control::placeholder {
	color:#629fcb;
}

.form-group {
	margin-bottom:1.5rem;
}

.form-control {
	background-color:#1772b4;
	color:white;
	border-radius:0;
	border: 1px solid white;
	padding:.3rem .75rem;
}

#F-Name::placeholder, #F-Company::placeholder, #F-Email::placeholder, #F-PhoneNumber::placeholder, 
#F-Message::placeholder {
	color:#6ea7cf;
	font-size:0.8rem;
}

#F-Name::-moz-placeholder, #F-Company::-moz-placeholder, #F-Email::-moz-placeholder, 
#F-PhoneNumber::-moz-placeholder, #F-Message::-moz-placeholder {
	color:#6ea7cf;
	font-size:0.8rem;
}

#F-Name::-webkit-input-placeholder, #F-Company::-webkit-input-placeholder, 
#F-Email::-webkit-input-placeholder, #F-PhoneNumber::-webkit-input-placeholder, #F-Message::-webkit-input-placeholder {
	color:#6ea7cf;
	font-size:0.8rem;
}

#F-Name::-ms-placeholder, #F-Company::-ms-placeholder, #F-Email::-ms-placeholder, #F-PhoneNumber::-ms-placeholder, 
#F-Message::-ms-placeholder {
	color:#6ea7cf;
	font-size:0.8rem;
}

#CallName::placeholder, #CallCompany::placeholder, #CallNumber::placeholder {
	color:#ABC6D9;
}

#CallName::-moz-placeholder, #CallCompany::-moz-placeholder, #CallNumber::-moz-placeholder {
	color:#ABC6D9;
}

#CallName::-webkit-input-placeholder, #CallCompany::-webkit-input-placeholder, #CallNumber::-webkit-input-placeholder {
	color:#ABC6D9;
}

#CallName::-ms-placeholder, #CallCompany::-ms-placeholder, #CallNumber::-ms-placeholder {
	color:#ABC6D9;
}
.modal-content {
	border-radius:0;
}

.modal {
	margin:0 auto;
}

.carousel-control-prev {
	left:40%;
	bottom:initial;
	margin-top:1rem;
}

.carousel-control-next {
	right:40%;
	bottom:initial;
	margin-top:1rem;
}

.carousel-control-prev, .carousel-control-next {
	top:initial;
	width:initial;
}

.carousel-control-prev-icon {
 background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%231772B4' viewBox='0 0 8 8'%3E%3Cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E") !important;
}

.carousel-control-next-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%231772B4' viewBox='0 0 8 8'%3E%3Cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E") !important;
}

.navbar {
	width:100%;
	right:0;
	justify-content:initial;
}

.navbar-toggler-i{
	display: inline-block;
    width: 1.5em;
    height: 1.5em;
    vertical-align: middle;
    content: "";
    background: no-repeat center center;
    background-size: 100% 100%;
    color:white;
    transition:none;
}

.navbar-toggler {
	border:none;
	position:absolute;
    right:0;
    margin-right:20px;
}

#modalNav .modal-dialog { 
	max-width:100%;
	width:100%;
	height:100%;
	min-height:100%;
	padding:0;
	margin:0;
 }

 #modalNav .modal-content {
 	min-height:100%;
 }

 .close {
 	opacity:1;
 	position:absolute;
 	right:0;
 	margin-right:20px;
 }

 .close:focus, .navbar-toggler:focus {
 	outline:none;
 }


 .block7 .row {
 	margin:0;
 }

 .menu-list-item {
 	margin-bottom:0;
 	padding:0.75rem 0;
 	border-bottom:solid 1px white;
 }

 .menu-list-item h5 {
 	margin-bottom:0;
 	color:white;
 }

 #convenienceHeader {
 	margin-top:0;
 }

 #applicationLogo {
 	width:100%;
 	height:auto;
 }


 @media (min-width:520px) {
 	#slide {
 		width:100%;
 		height:auto;
 	}

 	.carousel-control-prev {
 		left:45%;
 	}

 	.carousel-control-next {
 		right:45%;
 	}
 }

  @media (min-width:992px) {
 	#convenienceHeader {
 		margin-top:-175px;
 	}

 	#slide {
 		height:100%;
 	}

 	#bubble {
 		margin-top:2rem;
		margin-left:-5rem;
		margin-right:0;
		padding:3rem;
 	}

 	.carousel-control-prev {
	left:85%;
	bottom:0;
	}

	.carousel-control-next {
		right:10%;
		bottom:0;
	}
 }

 @media (max-width:992px) {
 	#headerText h1 {
 		font-size:1.6rem;
 	}

 	#headerText p {
 		font-size:1.4rem;
 	}

 	.blockquote {
 		font-size:1.3rem;
 	}

 	#convenienceHeader h4 {
 		font-size:1.25rem;
 	}

 	#convenienceHeader p {
 		font-size:0.9rem;
 	}

 	#applicationLogo {
 		width:200px;
 		height:auto;
 	}
 }

 .filter-list-item {
 	color:#1772b4;
 }

#applicationFilter .modal-dialog { 
	max-width:100%;
	width:100%;
	height:100%;
	min-height:100%;
	padding:0;
	margin:0;
 }

 #applicationFilter .modal-content {
 	min-height:100%;
 }

 .filter-list-item {
 	margin-bottom:0;
 	padding:0.75rem 0;
 	border-bottom:solid 1px #1772b4;
 }

 .filter-list-item h5 {
 	margin-bottom:0;
 }

