@charset "utf-8";
/* MJ Engineering */

/*
Grey - #333333 rgba(51,51,51,1);
yellow #faac1d rgba(250,172,29,1);
blue #009ad9 rgba(0,154,217,1);
orange #d7551f rgba(215,85,31,1);
*/

/*     -----[ FOUNDATION OVERRIDES ]-----     */

.row {/*max-width: 100%;*/}
.wide {max-width: 100%;}

.tabs-title > a {padding: 0 0 0.7rem 0;}

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

@font-face {font-family: eurostile-bold; src: url(../fonts/EurostileT-Bold.ttf);}
@font-face {font-family: eurostile-black; src: url(../fonts/eurostile-black-dtc-regular.ttf);}
@font-face {font-family: neutratext-book; src: url(../fonts/NeutraText-Book.otf);}
@font-face {font-family: neutratext-demi; src: url(../fonts/NeutraText-Demi.otf);}
@font-face {font-family: neutratext-light; src: url(../fonts/NeutraText-LightAlt.ttf);}

h1, h2, h3, h4, h5  {padding-left: 0px!important; font-family: eurostile-bold;}
h1 {font-size: 2.8rem; padding: 0.7rem 1.1rem;}
h2 { font-size:1.9rem; padding: 0.7rem 1.1rem;}
h3 { font-size: 1.6rem;padding: 0.7rem 1.1rem;}
h4 { font-size: 0.8rem;padding: 0.1rem 0.1rem;}

ul {font-family: neutratext-book; line-height: 1.2rem;}
li {list-style-type: none; font-size:1.1rem;}

a {}
a:hover {}
p {font-family: neutratext-book; line-height: 1.2rem; font-size:1.1rem;}
strong {}
span {display: block; font-family: neutratext-book;}

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

nav {margin-top: 5%; padding: 1rem 2rem; width: auto; height: auto;}
nav ul {width: 100%; margin: 0px; padding: 0px; height: auto;}
nav li {float: left; width: 100%;}
nav li:last-child {margin-bottom: 1.4rem;}
nav a {display: block; color: #fff; padding: 0.3rem 0.7rem; font-size: 1.2rem;}
nav a:hover {color: #fff; text-decoration: underline;}

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

header {position: relative; width: 100%; background-color: rgba(255,255,255,0.85); padding: 1.4rem 0px 0px 0px; border-bottom:1px solid #42b9ff;}
section {width: 100%;}
article {}
aside {}
figure {padding: 1.4rem;}
footer {width: 100%; background:rgba(255,255,255,0.85);}
#logo {float: left; margin-bottom: 1.4rem;}
#contact-info {/*float: left;*/ width: 200px; /*text-align: right;*/ font-weight: 600; font-size: 1.3rem; color:#333333;}
#toggle-nav {position: absolute; top: 0.875rem; right: 0.875rem; z-index: 999; cursor: pointer;}
#login {float: right; /*0width: 80px;*/ text-align: right; /*background-image: url(../i/icon_login.png);*/ background-position:  left; background-repeat:  no-repeat; padding-bottom:10px;}
#login a { color:#000000; }
#navigation {position: fixed; top: 4.3rem; right: 0px;width: 300px; height: auto; display: none; background-color: rgba(59,71,100,0.75);
border-bottom:1px solid #42b9ff; border-top: none;  z-index: 998; text-transform:capitalize; font-size: 0.8rem; font-family: neutratext-light; text-decoration:none;}
#top-bar {background-color: rgba(51,51,51,1); color: #fff; background-image:url('../i/mj-services.png'); background-position: top right; background-repeat:no-repeat;}
#legal {font-size: 0.75rem; text-align: center;}

#main-content {padding: 1.5rem 0px; background:#ffffff;}
#internal-content {min-height: 500px;}

#toggle-map {width: 100%; margin-bottom: 1.4rem;}
#google-map {width: 100%; margin-bottom: 1.4rem; display: none;}

#user-form {width: 100%; height: auto; margin-top: 6rem; border: solid 1px #42b9ff;}
#page-title {position: absolute; top: 100px; color: #fff; display: none; border: solid 1px #42b9ff; }

/*     -----[FORM]-----     */

#contact-form {width: 100%; margin: 100px 0px 0px 0px;}
form label {color: #42b9ff;}
::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #B5C2CA;
}
::-moz-placeholder { /* Firefox 19+ */
  color: #B5C2CA;
}
:-ms-input-placeholder { /* IE 10+ */
  color: #B5C2CA;
}
:-moz-placeholder { /* Firefox 18- */
  color: #B5C2CA;
}
form input:focus {background: #fff!important;}
form textarea:focus {background: #fff!important;}
input[type="text"], input[type="email"], input[type="tel"], textarea {background: none!important; border: solid 1px #42b9ff!important;}
input[type="submit"] {width: 25%; float: right; letter-spacing: 0.05rem; color: #42b9ff; border: solid 1px #42b9ff!important; padding: 0.9375rem; margin-bottom: 10px;
	-webkit-transition: background-color 75ms ease-in;
	transition: background-color 75ms ease-in;
	}
input[type="submit"]:hover {}
input[type="email"] {background: none!important; border: solid 1px #42b9ff!important;}
input[type="email"]:focus {}
textarea {}
button, .button {/*border-radius: 0px; background-color: #83C537;
transition: background-color 0.25s ease-out 0s, color 0.25s ease-out 0s;*/}
button:hover, .button:hover {/*background-color: #030F85;*/}
*::-moz-placeholder {}

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

.spacer-top { padding:250px 0px; display:block;}
.spacer-bottom { padding:200px 0px; display:block;}

.clr {position: relative; float: none; clear: both;}
.noPad {padding: 0px;}

.grey {background-color: rgba(51,51,51,1); color: #fff;}
.banner {width: 100%;}
.banner-fixed {width: 100%;}

.leftArea {float: left; width: 50%;}
.rightArea {float: right; width: 50%;}

/*.service-list-1 {padding: 0.7rem; border: solid 1px #d7551f;}
.service-list-2 {padding: 0.7rem; border: solid 1px #009ad9;}
.service-list-3 {padding: 0.7rem; border: solid 1px #faac1d ;}*/
.service-list-1,
.service-list-2,
.service-list-3 { margin:0px; padding-bottom:20px;}
.image-link {width: 98%; min-height: 100%; padding: 0px 1%; display: table;}
.image-link > a:nth-child(1) {display: block; width: 100%; color: #fff!important;}
.image-link:hover {background: #484848;}
.image-link h3 { padding:0.7rem 0 0 0;}
.service-link-1 h3 { border-bottom: 1px solid #d7551f; }
.service-link-2 h3 { border-bottom: 1px solid #009ad9; }
.service-link-3 h3 { border-bottom: 1px solid #faac1d; }
.image-link  { padding:0.7rem 0 0 0;}

.t2 {   opacity:1; max-width:400px; background-color: rgba(51,51,51,1); padding-bottom:60px;}
.tc2 { opacity:1; background-color: rgba(51,51,51,0.4); }
.t2.hidden {  opacity:0;}
.tc2.hidden {  opacity:0;}
.bottom-nav-part { position:fixed; bottom:0px; width:100%; min-height:50px; background:#161616;}
.close-nv { text-align: right; font-size:2rem; color:#ffffff; cursor:pointer;}
.close-nv i { font-size: 3rem;}

.t2 nav * { font-size: 1.5rem; text-transform: capitalize;}
.t2 nav ul li { float:none; padding:5px 0px;}
/*     -----[ MEDIA QUERY ]-----     */

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

@media (max-width: 800px) {
		#logo {width: 40%;}
		.leftArea {width: 100%;}
		.rightArea {width: 100%;}
		footer {text-align: center;}

    .spacer-top { padding:100px 0;}
    .spacer-bottom { padding:100px 0;}

}
@media (max-width: 640px) {
		#logo {width: 80%;}

    #login { width:100%; margin-right:0px;}

		.leftArea {text-align: center;}
		.rightArea {text-align: center;}
		#contact-info {text-align: left; float:left;}
		#navigation {top: 15.5%; width: 100%;}
		nav {margin-top: 1%; padding: 0rem; width: 100%;}
		nav li {width: 100%;}
}
