/* GENERAL */
body { font-size: 16px; color: #4d4d4d; padding: 0; margin: 0; line-height: 1.4; text-align: center; min-width: 320px; }
body,textarea{ font-family: 'Titillium Web', sans-serif;}
h1, h2, h3, h4, h5, h6, p, th, td, dd, dt, li, blockquote,#contact div { text-align: left; }
h1, h2, h3, h4, h5, h6 { font-family: 'Montserrat', sans-serif; color: #4777bf; }
img, iframe { max-width: 100%; }
a img, iframe { border: none; }
iframe { margin: 15px 0; }
a { text-decoration: none; color: #082f6a; }
a:hover { text-decoration: underline; }
.bold { font-weight: bold; }
.italic { font-style: italic; }
.clear { clear: both; }
.center { text-align: center; }
.btn { background: #4777bf; color: #fff; display: inline-block; padding: 10px 30px;border-radius:3px }
hr { border: 0; height: 1px; background-image: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.75), rgba(0, 0, 0, 0));margin:20px 0 }
.galleryImg img { padding: .5%; border: 1px solid black; }
.imgLeft { float: left; margin: 5px 4% 15px 0; }
.imgRight { float: right; margin: 5px 0 15px 4%; max-width:45%}
.wrap { max-width: 1170px; display: block; margin: 0 auto; }
.table { display: table; width: 100%;table-layout:fixed }
.table > div { display: table-cell; position: relative;vertical-align:top; }
.table.mid>div{vertical-align:middle;}
.table.half > div { width: calc(50% - 10px); }
.table.half > div:nth-of-type(odd) { padding-right: 10px; }
.table.half > div:nth-of-type(even) { padding-left: 10px; }
.table.third>div{width:calc(100% / 3);}
.table.third>div:nth-of-type(1){padding-right:1%;}
.table.third>div:nth-of-type(2){padding-left:.5%;padding-right:.5%}
.table.third>div:nth-of-type(3){padding-left:1%;}
.nowrap { white-space: nowrap; }
form{text-align:right}
input[type=text], input[type=tel], input[type=email], textarea { border: 1px solid #ccc; padding: 10px; width: calc(100% - 22px); border-radius: 1px; margin-bottom: 16px; }
textarea { height: 90px; resize: vertical;  }
input[type=submit] { border: none; width: 250px; border-radius: 1px; padding: 10px 0; font-weight: bold; font-size: 18px; background: #4777bf; color: white;}
#contact textarea{margin-top:16px}
.nowrap{white-space:nowrap;}
.gmap{width:100%;height:300px}
/* HEADER */
header {  padding: 20px 0 0; }
header .table{padding:0 10px;width:calc(100% - 20px)}
header .logo { text-align: left;}
header .logo span { color: #082f6a; margin: 0; padding: 20px 0; font-size: 31px; font-family:'Montserrat', sans-serif; font-style: italic; text-transform: uppercase; display: block; font-weight: bold;letter-spacing:-1.5px; }
header .logo a:hover { text-decoration: none; }
header img,header .logo span,header .address p{display:inline-block;vertical-align:middle}
header .address{text-align:right}
header .address p { font-size: 14px; text-align: right;margin-right:10px }
header .address strong { text-align: center; margin-top: 5px; }
header .address .btn:hover { background: #4d4d4d; }
header .logo, header .address { margin: 0; padding: 0; width: 48.8%; }

/* NAVIGATION */
nav {border-bottom: 1px solid #eee; }
nav ul { margin: 0; padding: 0; text-align: right; }
nav li { display: inline-block; vertical-align: middle; }
nav a { padding: 5px 15px;margin:5px; display: block; }
nav a:hover { color: #4777bf; text-decoration: none; }

/* BANNER */
.banner { background: #000; height: 500px; }
.cycle-slideshow { height: 100%; text-align: center; position: relative; overflow: hidden; }
.cycle-slideshow .wrap{top:50%;transform:translateY(-50%);position:relative}
.cycle-slideshow a { display: block; width: 100%; height: 100%; margin: 0 auto; position: relative; text-decoration: none; background-size: cover; }
.cycle-slideshow a:hover { text-decoration: none; }
.cycle-slideshow h1 { text-transform: uppercase; }
.cycle-slideshow h1, .cycle-slideshow p { font-weight: bold; color: #fff; margin: 0 auto; text-align: center; text-shadow: 1px 1px 3px #000;padding:0 20px }
.cycle-slideshow h1 { font-size: 32px; max-width: 900px; }
.cycle-slideshow p { font-size: 24px;  }
.cycle-slideshow span, .about a { display: inline-block; background-color: #822626; margin-top: 20px; padding: 10px 50px; border-radius: 3px; }
.cycle-prev, .cycle-next { position: absolute; top: 0; width: 5%; z-index: 888; height: 100%; cursor: pointer; background-position: 50% 50%; background-repeat: no-repeat; opacity: .2; }
.cycle-prev { left: 0; background-image: url(/images-design/arrow-prev.png); }
.cycle-next { right: 0; background-image: url(/images-design/arrow-next.png); }
.cycle-prev:hover, .cycle-next:hover { opacity: .6; }
.slide1 { background: #000 url(/images-content/slides/1.jpg); }
.slide2 { background: #000 url(/images-content/slides/2.jpg); background-position: bottom; }
.slide3 { background: #000 url(/images-content/slides/3.jpg); }

/* SECTION */
section { padding: 10px 20px;position:relative }
.quick-links h2 { font-size: 24px; text-align: center; color: #fff; text-transform: uppercase; text-shadow: 1px 1px 3px #000;top:50%;transform:translateY(-50%);position:relative; }
.box:hover { opacity: 1; }
.quick-links a{height:250px;display:block;background-size:cover;background-position:center}
.quick-links a:hover { text-decoration: none; }
.who-we-serve { background: #000 url('images-content/truck.jpg')  }
.what-we-do { background: #000 url('images-content/dplate.jpg')}
.commitment { height: 350px; background: url(/images-content/22125349-Oil-refinery-at-twilight-factory-Stock-Photo.jpg) 50% 50%; color: #fff; position: relative; margin-top: 10px; background-size:cover}
.commitment-container { position: absolute; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); width: 90%; }
.commitment-container h2, .commitment-container p { text-align: center; }
.commitment-container h2 { color: #4777bf; font-size: 24px; text-transform: uppercase; }
.commitment-container p { color: #4d4d4d; font-size: 18px; }

/* FOOTER */
footer {background: #002768; color: #fff; margin-top: 50px; }
footer .wrap{padding:30px 20px}
footer p { margin: 0; padding: 0; }
footer .copy { text-align: left; }
footer .a8b p { text-align: right; display: block; padding-top: 5px; }

/* MISC */
.servimgs{width:250px;position:absolute;right:10px;padding-top:10px}
.servimgs img{margin:5px auto}
.servcont{width:calc(100% - 260px);text-align:center}
.servimgs,.servcont{vertical-align:top;display:inline-block}
.servcont img{margin-top:20px}

@media(max-width:999px){
	nav ul{text-align:center}
	.servimgs{padding-top:36px}
}

@media(max-width:767px){
	.servimgs,.servcont{display:block;width:auto;position:relative;margin:0}
	.servimgs{font-size:0;right:auto;padding-top:10px}
	.servimgs img{width:calc((100% / 3) - 10px);margin:5px}
	header .table>div{display:block;width:auto !important;padding:0 !important;margin:12px auto;text-align:center}
	nav{padding-bottom:10px}
	.banner{height:400px}
}
@media(max-width:600px){
	nav li{width:32%;text-align:center}
	nav a{padding:5px 10px}
	.commitment{height:400px}
}
@media(max-width:500px){
	section .table.half>div,section .table.third>div{display:block;width:auto !important;padding:0 !important;margin:10px auto;}
	section,footer .wrap{padding-left:10px;padding-right:10px}
	footer{margin-top:0}
	.commitment{height:450px}
}

@media(max-width:400px){
	.servimgs img{display:block;width:auto;margin:10px auto}
	nav li{width:48%}
	footer .table>div{display:block;width:auto !important;padding:0 !important;margin:12px auto;}
	footer .table p{text-align:center}
	.commitment{height:500px}
}