/* =============================================================================
   HTML5 Boilerplate CSS: h5bp.com/css
   ========================================================================== */

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }

html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
html, button, input, select, textarea { font-family: sans-serif; color: #222; }
body { margin: 0; font-size: 1em; line-height: 1.4; }

::-moz-selection { background: #fe57a1; color: #fff; text-shadow: none; }
::selection { background: #fcff00; color: #333; text-shadow: none; }

abbr[title] { border-bottom: 1px dotted; }
b, strong { font-weight: bold; }
blockquote { margin: 1em 40px; }
dfn { font-style: italic; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
ins { background: #ff9; color: #000; text-decoration: none; }
mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }
pre, code, kbd, samp { font-family: monospace, serif; _font-family: 'courier new', monospace; font-size: 1em; }
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }
q { quotes: none; }
q:before, q:after { content: ""; content: none; }
small { font-size: 85%; }

sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }

dd { margin: 0 0 0 40px; }
nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }

img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; max-width: 100%;}
figcaption {background: rgba(0,0,0, .8); color: #fff; margin: -50px 0 0 0; padding: 20px; font-size: 1.2em; z-index: 20;}

svg:not(:root) { overflow: hidden; }

figure { margin: 0; }

form { margin: 0; }
fieldset { border: 0; margin: 0; padding: 0; }
label { cursor: pointer; }
legend { border: 0; *margin-left: -7px; padding: 0; white-space: normal; }
button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }
button, input { line-height: normal; }
button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; *overflow: visible; }
button[disabled], input[disabled] { cursor: default; }
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; *width: 13px; *height: 13px; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
textarea { overflow: auto; vertical-align: top; resize: vertical; }
input:valid, textarea:valid {  }
input:invalid, textarea:invalid { background-color: #f0dddd; }

table { border-collapse: collapse; border-spacing: 0; }
td { vertical-align: top; }

.chromeframe { margin: 0.2em 0; background: #ccc; color: black; padding: 0.2em 0; }

/* clearfix */
.clearfix:after, .container:after {content:"."; display:block; height:0; clear:both; visibility:hidden;}


/* ===== Primary Styles ========================================================
   Author: Robert Bethencourt
   ========================================================================== */

#window-width {position: fixed; top: 0; right: 0; padding: 5px; background: #eee; color: #333; border: 1px solid #333;}

/*= HTML, Body, h, p ul, ol, blockquote, a table, input and textarea Styling =*/
html {}

body {font:62.5%/1.7 arial, sans-serif; color:#000;}

h1 {font-size:2.4em; font-family:arial, sans-serif; margin:0 0 17px 0;}

h2 {font-size:1.8em; font-family:arial, sans-serif; margin:0 0 17px 0; padding-bottom: 10px;}

h3 {font-size:1.4em; font-family:arial, sans-serif; margin:0 0 17px 0;}

h4 {font-size:1em; font-family:arial, sans-serif; margin:0 0 17px 0;}

h5 {font-size:.8em; font-family:arial, sans-serif; margin:0 0 17px 0;}

p {font-size:1.4em; margin:0 0 17px 0;}

ul, ol {font-size:1.4em; margin:0 0 17px 0;}

blockquote {font-size:1em; margin:0 0 17px 0;}

/* Removes outline from all links on any state. Works well for ie */
a {outline: 0;}

a, a:visited {color:#4879a3; text-decoration:none;}

a:hover, a:focus {text-decoration: underline;}

table {font-family:arial, sans-serif; margin:0 0 17px 0; caption-side:bottom; border-collapse:collapse;}
      
  th, td {font-size:1.2em; text-align:center; border:1px solid #aaaaaa; background:#f9f2ea; padding:2px 5px;}

form {}

  form ul {padding:0; margin:0 0 17px 0;}

    form ul li {list-style: none; margin:0 0 8px 0;}
  
input {border:1px solid #aaa; -webkit-border-radius: 3px; border-radius: 3px; background:#fcfcfc;}

input:focus {outline: 1px solid #4879a3; background: #fff;}

textarea {border:1px solid #aaa; -webkit-border-radius: 3px; border-radius: 3px; background:#fcfcfc;}

textarea:focus {outline: 1px solid #4879a3; background: #fff;}

iframe {margin:0 0 17px 0;}



/*===================== Class All Document Styling ========================*/

.container {width:80%; margin:0 10%;}

  .content {padding: 20px 0;}
  
    .content > h4 {font: 3em "trebuchet ms"; text-align: center; margin-bottom: 3%;}
    
  .full {width: 100%; padding: 5% 0;}
  
  .half-left {width: 48%; float: left; padding: 2% 2% 2% 0;}
  
  .half-right {width: 48%; float: right; padding: 2% 0 2% 2%;}
  
  .third {width: 28%; padding: 0 2.5%; float: left;}
  
  .half {width: 70%; margin: 0 15%;}

a.button-gray, a.button-gray:visited {padding:1px 1.4em; display:block; color:#555; text-decoration: none; font-size:1em; text-align:center; font-weight:bold; -webkit-border-radius: 3px; border-radius: 3px; background:#eee;}

a.button-gray:hover, a.button-gray:focus {background: #ddd;}

input[type=text] {padding: 2% 5%;}

textarea {width:350px; height:75px;}

input[type=button], button, input[type=submit], a.button-blue, a.button-blue:visited {padding:7px 2em; color:#fff; font-size:1em; font-weight:bold; text-align:center; border: 0px; -webkit-border-radius: 3px; border-radius: 3px; background: #3a92cb;}

input[type="button"]:hover, button:hover, input[type="submit"]:hover, a.button-blue:hover {background: #3081b6;}

a.button-blue, a.button-blue:visited {font-weight: normal;}

a.button-blue:hover, a.button-blue:focus {text-decoration: none;}

a.button-yellow {width: 130px; height: 35px; padding: 10px 0 0 0; display: block; color: #454547; text-decoration: none; font-size: 1.2em; text-align: center; border-radius: 3px; background: #f8f33f;}

a.button-yellow:hover {background: #faf769;}

p.fb-p {margin: 5% 0;}

  a.fb-button {color: #3B5998; font-weight: bold; font-size: 1.4em; text-decoration: none;}

    a.fb-button .fb-f {padding: .5em 1em; border: 1px solid #ccc; border-right: 1px solid #aaa; border-radius: 3px 0 0 3px; background: #ccc;}
  
    a.fb-button .fb-visit {padding: .5em; border: 1px solid #ccc; border-radius: 0 3px 3px 0; background: #ccc;}
  
    a.fb-button:hover .fb-f, a.fb-button:hover .fb-visit {color: #ccc; background: #3B5998; border: 1px solid #89a0d1;}
  
    a.fb-button:hover .fb-f {border-right: 1px solid #5c7cbe;}

a.back-to-top {padding: 1em 1.5em; border-radius: 3px; color: #fff; text-decoration: none; background: #4d9ad0;}

a.back-to-top:hover {background: #68aad7;}

p.j-margin {margin-top: 30px;}

.subtext {font-size: 1.2em; margin:0 0 8px 0; color: #555;}

.dropcap:first-letter {font: 3em/.1em arial, sans-serif; float: left; padding: 21px 10px 0 0;}

.italic {font-style: italic;}



/*=========================== Log-In Styling ==============================*/
.top {color:#fff; height: 54px; background: #272c34;}
  
  .top-tools {margin: 13px 10% 0 10%; width: 80%;}
        
    .top-tools p.slogan {float: left; margin: 2px 0 0 0;}
  
  .top-log-in-out {float: right; padding: 0 3em;}
  
    .top-log-in-out p {float: left;}
    
    .top-log-in-out p.welcome {padding: 3px 1.5em 1px 2.4em; background: url(../images/portal-sprite.png) no-repeat -125px -448px;}



/*========================= Navigation Styling ============================*/
nav {clear:left; padding: 0;}

  nav .container {padding: 2em 0 0 0;}

    img.logo {float:left; width:221px; margin: -15px 0 0 -5%;}
    
    p.mobile-nav-dd {display: none;}

    ul.main-nav {float:right; margin: -15px 0 0 0; padding: 0;}

     ul.main-nav li {float: left;}
     
      ul.main-nav li a, ul.main-nav li a:visited {display:block; text-align: center; font-weight: bold; padding: 1.2em 1.5em; color: #555;}
      
      ul.main-nav li a:hover, ul.main-nav li a:focus, ul.main-nav li a.active {color: #4d9ad0; text-decoration: none;}



/*============================= Slider Styling ================================*/
/* See the flexslider.css file */
      
      
      
/*======================= Call To Action (cta) and Home specific Styling ==========================*/
.cta {padding: 5% 0; background: #eee;}

  .content-home {width: 60%; padding: 0 6% 0 0; float: left;}
    
    .content-home p {color: #25648d;}
  
  .track-package {width: 25%; padding: 1% 4%; float: left; background: #fafafa; border: 1px solid #ccc; -webkit-border-radius: 7px;}
    
    .track-package h1 {color: #777; border-bottom: 1px solid #ccc;}
    
    .track-package .subtext {color: #25648d; font-style: italic; padding-bottom: 10px;}
    
    .track-package .track ul li {margin: 15px 0;}
    
      .track-package .track input[type="text"] {padding: .7em 2em;}
    
    
    
/*============================== Buckets Styling =================================*/
.buckets {padding: 5% 0; color: #444;}

  .buckets-service, .buckets-w-mbe {width: 31.3%; padding: 0 1% 2% 0; float: left;}
  
  .buckets-security, .buckets-st-part {width: 31.3%; padding: 0 1% 2% 1%; float: left;}
  
  .buckets-tech, .buckets-mem-assoc {width: 31.3%; padding: 0 1% 2% 1%; float: left;}

    h2.service {background: url(../images/sprite.png) no-repeat -280px 0; padding: 5px 0 5px 45px; margin: 0 0 7px 0;}
    h2.security {background: url(../images/sprite.png) no-repeat -240px -40px; padding: 5px 0 5px 45px; margin: 0 0 7px 0;}
    h2.tech {background: url(../images/sprite.png) no-repeat -200px -80px; padding: 5px 0 5px 45px; margin: 0 0 7px 0;}
    h2.w-mbe {background: url(../images/sprite.png) no-repeat -160px -120px; padding: 5px 0 5px 45px; margin: 0 0 7px 0;}
    h2.st-part {background: url(../images/sprite.png) no-repeat -120px -160px; padding: 5px 0 5px 45px; margin: 0 0 7px 0;}
    h2.mem-assoc {background: url(../images/sprite.png) no-repeat -80px -200px; padding: 5px 0 5px 45px; margin: 0 0 7px 0;}



/*=========================== Page Heading Styling ==============================*/
.page-heading {clear: left; padding: 1% 0 0 0; border-top: 1px solid #000; background: #1a1a1a;}

  .page-heading .container {margin:0 auto; padding: 0;}
  
    .page-heading h1 {text-align: center; font-style: italic; color: #4d9ad0; font-size: 4em; text-shadow: 1px 1px 3px #000;}
    
    .page-heading p {color: #ccc; text-align: center; font-style: italic;}

     
    
/*============================== Content Section Styling =================================*/


/*============================== Content Gallery Styling =================================*/
.content-gallery-container {width: 100%; overflow: hidden; padding: 5em 0;}

.left-arrow-container {width: 20%; float: left;}

  .left-arrow {width: 45px; height: 45px; margin: 90% 0 0 0; color: #fff; cursor: pointer; font-size: 1.7em; line-height: 2.7em; text-align: center; background: #20577b; -webkit-border-radius: 5px;}

.content-gallery {width: 60%; float: left; position: relative;}

  .content-gallery img {max-width: 96%; display: block; margin: 0 auto; border: 10px solid #fff; -webkit-border-radius: 3px; opacity: 0; -webkit-transition: 1.5s; -webkit-box-shadow: 1px 1px 10px #999;}
  
  .content-gallery img.respond {position: absolute; top: 0; left: 0;}
       
  .content-gallery img.g-active {opacity: 1; -webkit-transition: 1.5s;}
  
.right-arrow-container {width: 20%; float: left;}

  .right-arrow {width: 45px; height: 45px; margin: 90% 0 0 0; float: right; color: #fff; cursor: pointer; font-size: 1.7em; line-height: 2.7em; text-align: center; background: #20577b; -webkit-border-radius: 5px;}
  
  
  
/*============================== Content Gallery Styling =================================*/
.contact-break {color: #fff; background: #031625;}

  .contact-break .container .content .container {width: 70%; margin: 0 auto;}
  
  .contact-break .half-right {margin-top: 15px;}

  .contact-break h1 {margin-bottom: 0;}

  .contact-break .half-left p {color: #ccc; font-style: italic;}



/*============================== Services Section Styling =================================*/
#logistics-management {padding: 5% 0; background: url(../images/bg-square-grid.jpg);}

  #logistics-management h4 {color: #1d4f70;}
  
  #logistics-management h1 {color: #454545; border-bottom: 3px solid #ddd;}
  
  #logistics-management h2 {color: #454545; border-bottom: 5px solid #ddd;}
  
  #logistics-management p {color: #525253;}


#florida-logistics {color: #fff; text-shadow: 1px 1px 0 #232323; background: #1b222e url(../images/logistics-arial-blur.jpg) no-repeat top center; overflow: hidden;}
  
  #florida-logistics p {font-style: italic; font-weight: bold;}
  
  #florida-logistics a.button-yellow {text-shadow: none; font-weight: normal; font-style: normal;}
    
#florida-logistics-content {padding: 5% 0; color: #fff; background: #1b222e;}

  #florida-logistics-content h2 {border-bottom: 5px solid #334157;}
  
  .fl-log-map {width: 50%; float: right;}
    
    
#power-conveyor {padding: 5% 0; background: #fff;}

  #power-conveyor h4 {color: #1d4f70;}

  #power-conveyor h1 {color: #454545; text-align: center;}
  
  #power-conveyor h1 + .half p {color: #9f9f00; font-style: italic; text-align: center;}
  
  #power-conveyor h2 {color: #454545; border-bottom: 3px solid #eee;}
  
  #power-conveyor .half-left {width: 47%; border-right: 3px solid #eee;}
  
    #power-conveyor .half-left p, #power-conveyor .half-right p {color: #525253;}
  
  
#warehousing {padding: 5% 0; background: #eee;}

  #warehousing h4 {color: #1d4f70;}

  #warehousing h1 {text-align: center; color: #20577b;}
  
  #warehousing h2 {color: #454545; border-bottom: 5px solid #ddd;}
  
  #warehousing .container .container p {color: #9f9f00; font-style: italic; text-align: center;}
  
  #warehousing p {color: #525253;}


#delivery {padding: 5% 0 0 0; color: #ededed; background: #1d4f70;}
  
  #delivery h1 {border-bottom: 3px solid #153951;}
  
  #delivery img {max-width: 100%;}
  
  #delivery h2 {border-bottom: 5px solid #153951;}
  
  
/*============================== Technology Section Styling =================================*/
#data-integration {padding: 5% 0; border-top: 1px solid #fff; background: url(../images/bg-square-grid.jpg);}

  #data-integration h4 {color: #1d4f70;}
  
  #data-integration h1 {color: #454545; border-bottom: 3px solid #ddd;}
  
  #data-integration h2 {color: #454545; border-bottom: 5px solid #ddd;}
  
  #data-integration p {color: #525253;}
  
  
#client-portal {padding: 5% 0 12.5% 0; color: #fff; background: url(../images/portal-screen.jpg) no-repeat top center;}

  #client-portal h1 {padding-top: 2%; color: #454545; border-bottom: 3px solid #cfd3e0;}
  
  #client-portal h2 {color: #454545; border-bottom: 5px solid #cfd3e0;}
  
  #client-portal .half-right {width: 44%; margin-top: 3%; padding: 1% 4%; color: #343434; border-radius: 3px; background: rgba(255,255,255,0.6); -webkit-box-shadow: 1px 1px 10px #999;}
  
  #client-portal p {color: #525253;}
  
#client-portal-content {padding-bottom: 5%;}

  #client-portal-content .content {padding-top: 0;}
  
    #client-portal-content .half-left {width: 47%; border-right: 3px solid #eee;}
  
      #client-portal-content h2 {color: #454545; border-bottom: 3px solid #eee;}
  
      #client-portal-content .half-left p, #client-portal-content .half-right p {color: #525253;}
  
    
#track-scan {padding: 5% 0; color: #424243; background: #eee;}

  #track-scan h4 {color: #1d4f70;}

  #track-scan h1 {color: #454545; text-align: center;}
  
  #track-scan h2 {color: #454545; border-bottom: 5px solid #ddd;}
  
  #track-scan h3 {color: #454545;}
  
  #track-scan p {color: #525253;}
  
  #track-scan .track-package {width: 90%;}
  
  #track-scan .half-right p {float: left;}
  
  #track-scan .content .content {padding-top: 5%;}
  
  
#portal {padding: 5% 0; color: #fff; background: #d20000;}

  #portal img {max-width: 100%; display: block; margin: 0 auto;}
  
  #portal h2 {border-bottom: 5px solid #ff6666;}
  
  
#security {padding: 5% 0 0 0; color: #ededed; background: #1d4f70;}
  
  #security .third img {display: block; margin: 0 auto;}
  
  #security .third h1 {text-align: center;}
  
  #security h2 {border-bottom: 5px solid #153951;}
  
  
  
/*============================== About Section Styling =================================*/
#partnership {padding: 5% 0; border-top: 1px solid #fff; background: url(../images/bg-square-grid.jpg);}

  #partnership h4 {color: #1d4f70;}

  #partnership h1 {color: #454545; text-align: center;}
  
  #partnership h2 {color: #454545; border-bottom: 5px solid #ddd;}
  
  #partnership img {max-width: 100%;}
  
    #partnership .content .content p {text-align: right;}


#als-on-time {padding: 5% 0; color: #fff; background: #121212;}

  #als-on-time h1 {text-align: center;}
  
  #als-on-time h2 {border-bottom: 5px solid #333;}
  
    #als-on-time .container .half-right h2 {margin-top: 80px;}
    

#areas-of-op {color: #fff; text-shadow: 1px 1px 0 #232323; background: url(../images/courier-van-blur.jpg) no-repeat 0 0; overflow: hidden;}

  #areas-of-op .half-left {width: 44%; padding: 5% 0%;}
  
  #areas-of-op p {font-style: italic; font-weight: bold;}
  
  #areas-of-op a.button-yellow {text-shadow: none; font-weight: normal; font-style: normal;}
  
    .fl-log-map {width: 50%; float: left;}
  
#areas-of-op-content {padding: 5% 0; color: #fff; background: #1b222e;}

  #areas-of-op-content h2 {border-bottom: 5px solid #334157;}
    

#mbe {padding: 5% 0;}

  #mbe h4 {color: #1d4f70;}

  #mbe h1 {color: #454545; text-align: center;}
  
  #mbe .container .half p {color: #9f9f00; font-style: italic; text-align: center;}
  
  #mbe h2 {color: #454545; border-bottom: 3px solid #eee;}
  
  #mbe img {max-width: 100%; display: block; margin: 0 auto;}
  
  #mbe p {color: #525253;}


#str-partners {color: #ededed; padding: 5% 0; background: #1d4f70;}

  #str-partners h1 {border-bottom: 3px solid #153951;}

  #str-partners h2 {border-bottom: 5px solid #153951;}
  
  
#presentation {color: #ededed; padding: 5% 0; background: url(../presentation/images/tech-demo-bg.jpg) no-repeat top center; background-size: cover;}



/*=========================== Contact Form Styling ==============================*/
.contact-bg {padding: 2% 0; background: url(../images/logistics-arial-blur.jpg) no-repeat top center; background-size: cover;}

form.contact {width: 60%; margin: 0 auto; -webkit-border-radius: 3px; border-radius: 3px; -webkit-box-shadow: 1px 1px 10px #111;}

  form.contact h1 {color: #fff; text-align: center; margin: 0; padding: 5px; border: 1px solid #3082b8; -webkit-border-radius: 3px 3px 0 0; border-radius: 3px 3px 0 0; background: #4d9ad0;}
  
  form.contact ul {margin: 0; border: 1px solid #c5c5c5; border-top: 1px solid #c5c5c5; padding: 20px 20px 12px 20px; -webkit-border-radius: 0 0 3px 3px; border-radius: 0 0 3px 3px; background: #e5dfd9; background: rgba(255,255,255,.5);}
  
    form.contact ul li {font-weight: bold; color: #121212;}
    
      form.contact ul li .subtext {font-size: 1em; color: #477692;}



/*============================== Footer Styling =================================*/
footer {padding: 5% 0 0 0; background: #121212; color: #fff;}

  .footer-content {width: 48%; float: left; padding: 0 2% 0 0;}
  
  .footer-contact {width: 23%; padding: 0 1% 0 1%; float: left;}

    .footer-contact ul {padding: 0;}
  
      .footer-contact ul li {list-style-type: none; padding: 5px 0;}
    
	.footer-contact ul li a {padding: 5px 0;}
    
	.footer-contact ul li a:hover, footer .right-middle ul li a:focus {color: #6BB0ED; text-decoration: none;}
    
	  .footer-contact ul li a .subtext, .footer-contact ul li a:visited .subtext {font-style: italic; font-size: .8em; color: #bbb;}
	
	  .footer-contact ul li a:hover .subtext, .footer-contact ul li a:focus .subtext {color: #fff;}
	
  .footer-links {width: 23%; padding: 0 1% 0 1%; float: left;}

    .footer-links ul {padding: 0; border-top: 1px solid #000; border-bottom: 1px solid #222;}
  
      .footer-links ul li {list-style-type: none;}
    
	.footer-links ul li a, .footer-links ul li a:visited {display: block; padding: 7px; border-top: 1px solid #222; border-bottom: 1px solid #000;}
      
	.footer-links ul li a:hover, .footer-links ul li a:focus {background: #222; color: #6BB0ED; text-decoration: none;}

  .copyright {background: #000;}
  
    .copyright .container {padding: 25px 0 15px 0; background: url(../images/alpha-logo-dark.jpg) no-repeat right;}



/* =============================================================================
   Media Queries
   ========================================================================== */

@media screen and (min-width: 1624px) {
  
  .container {width: 60%; margin: 0 20%;}
  
  .top-tools {margin: 9px 20% 0 20%; width: 60%;}
  
  .container .content .container {width: 80%; margin: 0 10%;}
  
  #client-portal {padding-bottom: 11%; background-size: cover;}
  
  #als-on-time .container .half-right h2 {margin-top: 20px;}
  
}


@media screen and (max-width: 1024px) {
  
  .container {width: 90%; margin: 0 5%;}
  
  .top-tools {margin: 9px 5% 0 5%; width: 90%;}
  
  #client-portal {padding-bottom: 16%;}
  
  #als-on-time .container .half-right h2 {margin-top: 50px;}
  
}


@media screen and (max-width: 768px) {
  
    img.logo {width: 150px; margin: -5px 0 0 -36px;}
    
    ul.main-nav li {margin: 0 1px;}
    
    .track-package .track input[type="text"] {padding: .7em 0.7em;}
    
    .contact-break .container .content .container {width: 90%;}
    
    #client-portal {padding-bottom: 21%;}
    
    #track-scan .half {width: 94%; margin: 0 3%;}
    
    #security .content .container {width: 94%; margin: 0 3%;}
    
    #als-on-time .container .half-right h2 {margin-top: 20px;}
    
    form.contact {width: 80%;}
  
    .footer-content {width: 100%; margin: 0 0 2% 0; clear: left;}
    
    .footer-contact {width: 47%; margin: 2% 0 0 1%; float: left;}
    
    .footer-links {width: 47%; margin: 2% 1% 0 0; float: left;}
	
}

@media screen and (max-width: 725px) {
  
  nav .container {width: 100%; margin: 0; padding: 1em 0 0 0;}
  
  img.logo {margin: -5px 0 0 3%; float: none;}
  
   div.mobile-nav-dd {display: block; width: 40px; height: 40px; float: right; text-align: right; margin-top: -8px; margin-right: 3em; cursor: pointer; background: url(../images/sprite.png) no-repeat 0 -280px;}

    ul.main-nav {float: left; width: 100%; margin: 0; background: #68aad7; display: none;}

     ul.main-nav li {float: none;}
     
      ul.main-nav li a, ul.main-nav li a:visited {padding: .3em 1.5em; color: #fff; border-bottom: 1px solid #86bbdf;}
      
      ul.main-nav li a:hover, ul.main-nav li a:focus, ul.main-nav li a.active {color: #fff; background: #4d9ad0;}
  
}


@media screen and (max-width: 680px) {
  
  .container {width: 90%; margin: 0 5%;}
  
  .top-tools .slogan {font-size: 1em;}
  
  .top-log-in-out {padding: 0;}
  
  img.logo {margin: -5px 0 0 0;}

  .content-home {width: 100%; padding: 0 0 6% 0;}
  
  .track-package {width: 94%; padding: 1% 3% 6% 3%;}
      
    .content {width: 100%; margin: 0;}
  
    .buckets-service, .buckets-w-mbe, .buckets-security, .buckets-st-part, .buckets-tech, .buckets-mem-assoc, .third {width: 100%; padding-right: 0; padding-left: 0;}
    
  .contact-break .container .content .container {width: 100%;}
    
   #track-scan .container .content .container {width: 100%; margin: 0;} 
    
    #track-scan .container > .half-left, #track-scan .container > .half-right {width: 100%; padding: 2% 0;}
    
  #track-scan .half {width: 100%; margin: 0;}
  
  #security .third p {text-align: center;}
  
  #security .container .container, .container .container {width: 100%; margin: 0;}
  
  a.fb-button {font-size: 1.1em;}
  
  form.contact {width: 100%;}
  
    .footer-content {width: 100%;}
    
    .copyright {text-align: center; font-size: .8em; padding: 5px 0 60px 0; background: #000 url(../images/alpha-logo-dark.jpg) no-repeat 5% 20px;}
  
    .copyright .container {padding: 0; background: none;}
    
      .copyright .container p {padding-top: 10px; text-align: left;}
	
}


@media screen and (max-width: 500px) {
  
  .half-left, .half-right {width: 100%; padding: 2% 0;}
  
  .contact-break .half-right {margin-top: 0;}
  
  #power-conveyor .half-left {width: 100%; border-right: none;}
  
  #client-portal .half-right {width: 92%; margin-top: 22%; padding: 1% 4%;}
  
  #client-portal-content .half-left {width: 100%; border-right: none;}
  
  #partnership .content .content p {text-align: left;}
  
  .contact-bg textarea {width: 250px;}
 
  .footer-contact {width: 100%; margin: 0 0 2% 0;}
    
  .footer-links {width: 100%; margin: 0 0 2% 0;}
  
}


@media screen and (max-width: 420px) {
  
  .top {height: 76px;}
  
  .top-tools p.slogan {float: none; margin: 0 0 10px 0;}
  
  .top-log-in-out {float: left; margin-left: -3px;}
  
  img.logo {margin: -11px 0 0 -11px;}
  
  div.mobile-nav-dd {margin-top: -12px; margin-right: 1em;}
    
}


@media screen and (max-width: 320px) {
  
  .left-arrow {margin-top: 60%;}
  
  .content-gallery img {border: 5px solid #fff;}
  
  .right-arrow {margin-top: 60%;}
  
  #client-portal {padding-bottom: 40%;}
  
  .contact-bg textarea {width: 200px;}
  
  .copyright {background: #000 url(../images/alpha-logo-dark.jpg) no-repeat 5% 50px;}
  
}


/* =============================================================================
   Non-Semantic Helper Classes
   ========================================================================== */

.ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; *line-height: 0; }
.ir br { display: none; }
.hidden { display: none !important; visibility: hidden; }
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
.invisible { visibility: hidden; }
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }

/* =============================================================================
   Print Styles
   ========================================================================== */
 
@media print {
  * { background: transparent !important; color: black !important; box-shadow:none !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: h5bp.com/s */
  a, a:visited { text-decoration: underline; }
  a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }  /* Don't show links for images, or javascript/internal links */
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; } /* h5bp.com/t */
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { page-break-after: avoid; }
}