@charset "utf-8";
/* NE Pneumatics */

/*
orange = #e63027 rgba(230,48,39,1);
dark grey = #272525 rgba(39,37,37,1);
*/

/*     -----[ TYPOGRAPHY ]-----     */


@font-face {font-family: 'Bauhaus Regular'; src: url('../fonts/Bauhaus Regular.ttf');}
@font-face {font-family: 'Bauhaus Bold'; src: url('../fonts/Bauhaus Bold.ttf');}
@font-face {font-family: 'Aller'; src: url('../fonts/Aller.ttf');}
@font-face {font-family: 'Avant Garde Book BT'; src: url('../fonts/Avant Garde Book BT.ttf');}


html, body {padding: 0px; margin: 0px; overflow-x: hidden;}
body { background-color: #dadada; font-family: 'Raleway', sans-serif;}
h1, h2, h3, h4, h5 {font-family: 'Bauhaus Regular';}
h1 {font-size: 2.4rem; color: #e63027;}
h2 {font-size: 1.6rem;}
h3 {font-size: 1.2rem;}
#contact-form h3 {font-family: 'Raleway', sans-serif;}
h4 {font-size: 1.2rem;}
h5 {font-size: 0.75rem;}
p {font-size: 0.875rem; line-height: 1rem;}
strong {}
span {display: inline;}
footer span {float: left!important; width: 50%; margin: 0.46875rem auto; color: #fff;}
blockquote {}
a { color: #000;}
a:hover {color: #333333; text-decoration: none;}
footer a {color: #fff;}
footer a:hover {color: #fff;}
#service-tabs a {color: #e63027; text-decoration: none;}
#service-tabs a:hover {color: #000; text-decoration: none;}
ul {margin: 0px; padding: 0px; font-size: 0.875rem;}
li {list-style-type: none;}


/*     -----[ FORMS]-----     */

form label {}
form input {}
input[type="submit"] {}
input[type="submit"]:hover {}

.formInput textarea {}
.formInput submitBtn {}
button, .button {}
button:hover, .button:hover {}
*::-moz-placeholder {}

.antispam { display:none;}

/*     -----[CONTACT]-----     */

#contact-form {position: relative; width: 90%; height: auto; margin: 50px auto; padding: 1%; border: solid 1px #dadada; border-radius: 3px; background-color: #fff; z-index: 100;}
#warning-message {float: left; width: 100%; height: auto;}
.formBox {float: left; width: 100%;}
label {float: left; width: 100%;}
input {float: left; width: 100%;}
input[type="submit"] {max-width: 50%; float: right; background-color: #484848; color: #fff; border: none; padding: 0.4675rem 0.935rem;}
.clr {position: relative; float: none; clear: both;}
.wm {color: red;}
#thanks {float: left; width: 30%; height: auto; margin: 50px 35%; text-align: center;}

img {}

/*     -----[ NAVIGATION ]-----     */

nav {float: left; width: 100%; height: auto; color: #fff; font-family: 'Avant Garde Book BT'; margin-top: 0.3rem;}
nav ul {}
nav li {float: left; width: 25%; text-align:center; border-right: solid 1px #fff;}
nav li:last-child {border-right: none;}
nav a {color: #fff; font-size: 1.3rem;}
nav a:hover {text-decoration: none;}
nav a:active {}

#nav-toggle {float: left; width: 50px; height: 50px; cursor: pointer; text-align: center;}
#nav-toggle img {margin-top: 5px;}
#sub-nav {position: absolute;  background-color: rgba(230,48,39,1); display: none; left: 0px; font-family: 'Avant Garde Book BT';}
#sub-nav ul {margin-left: 0.9375rem;}
#sub-nav li {padding-right: 0.9375rem;}
#sub-nav li:last-child {margin-bottom: 1.1rem;}
#sub-nav a {color: #fff; font-size: 1.2rem;}
#sub-nav a:hover {color: #000; text-decoration: none;}

#sub-nav-mobile {float: left; width: 100%; height: auto; display: none;}
#social-links-mobile {float: left; width: 100%; height: auto; margin-left: 0.9375rem; padding-bottom: 1.1rem;}
#mobile-links {float: left; width: 100%; height: auto;}
#mobile-links ul {float: left; width: 100%;}
#mobile-links li {float: left; width: 100%;}

/*     -----[ LAYOUT ]-----     */

header {position: relative; float: left; width: 100%; height: auto; background-color: rgba(230,48,39,1); z-index: 200;}
section {float: left; width: 100%; height: auto;}
footer {position: fixed; bottom: 0px; float: left; width: 100%; height: auto; background-color: rgba(230,48,39,0.8); font-size: 0.75rem;}
article {float: left; width: 100%; height: auto;}
aside {float: left; width: 100%; height: auto;}

figure {width: 100%; height: auto; background-color: rgba(255,255,255,1);}

#background-image {position: fixed; width: 100%; height: auto; z-index: -1; opacity: 0.2;}
#banner-image {width: 100%; height: auto;}
#main-content {margin-bottom: 6rem;}
#sub-content {margin: 0px auto 6rem auto;}
#sub-content2 {margin: 6rem auto;}
#transBar {float: left; width: 100%; min-height: 40px; background-color: rgba(230,48,39,0.6);}
#social-links {float: left; width: 80%; height: auto; margin-left: 1.3rem;}
#logo {position: absolute; float: right; width: 240px; height: 240px; top: -60px; border-radius: 200px; background-color: rgba(230,48,39,1); padding: 40px 20px 0px 20px;}
#number {float: right; font-size: 1.4rem; font-weight: 400; margin-right: 100px; color: #fff;}
#number-mobile {position: relative; float: left; width: 100%; margin-left: 0.9375rem; font-size: 1.3rem; color: #fff; display: none;}

#google-map {margin-top: 2rem;}

/*     -----[ CLASSES ]-----     */

.noPad {padding: 0px;}
.wide {max-width: 100%;}
.transWht {background: rgba(255,255,255,0.8); border-top: solid 1px #484848; border-bottom: solid 1px #484848;}
.icon {float: left; width: 50px; height: 50px; margin: 5px 2.5px; padding: 7px; cursor: pointer;}

.box {width: 100%; height: auto; margin: 1.8rem 0; border: solid 1px #000; background-color: rgba(39,37,37,0.8); color: #fff; text-align: center;}
.box:hover {border: solid 1px #e63027;}
.box h4 {margin: 0px; font-family: 'Aller';}

.inset {padding: 1rem;}

/* Service Selection */
#service-tabs {float: left; width: 100%; height: auto;}
#service-tabs-content {float: left; width: 100%; height: auto;}
#service-tabs-triggers {float: left; width: 100%; height: auto;}
.gridBox {position: relative; float: left; width: 23%; margin: 1%;  text-align: center;}

.gridBox figure {background-color: #dadada; max-width: 100%;}
.gridBox h4 {position: absolute; bottom: 0; background: rgba(0,0,0,0.6); color: #fff; width: 100%;}

/*.tabs-title {background: rgba(0,0,0,0.6); color: #fff;}*/

/*     -----[ MEDIA QUERY ]-----     */

@media (max-width: 1440px) {
	#background-image {width: 140%; margin-left: -20%;}
	#social-links {display: none;}
	#sub-nav-mobile {display: block;}
	#logo {right: -5px;}
	#number {margin-right: 10%;}
	#desktop-nav {display: none;}
	#main-nav {display: none;}
	#grid {margin-top: 4rem;}
}

@media (max-width: 1280px) {
	#number {margin-right: 18%;}
}

@media (max-width: 1024px) {
	#number {margin-right: 20%;}
}

@media (max-width: 800px) {
	#background-image {width: 240%; margin-left: -70%;}
	#number {display: none;}
	#number-mobile {display: block;}
}

@media (max-width: 640px) {
	.gridBox {width: 98%; margin: 1%;}
	#service-tabs-content {width: 60%;}
	#service-tabs-triggers {width: 40%;}
	h2 {font-size: 1.2rem;}
	.tabs-title > a {padding: 0.25rem 0.5rem;}
	footer span {width: 100%;}
}

@media (max-width: 480px) {
	#background-image {width: 260%; margin-left: -80%;}
	#logo {width: 170px; height: 170px; right: -16px;}
}
