body {background: #fcfcfc;}
.wrap-all {width: 100%; max-width: 960px; margin: 0 auto;}

header {margin: 15px 0px; width: 100%;}
.logo {float: left; margin-bottom: 20px;}

.logo a img {
outline: none !important;
}

.text a {color: #000000; text-decoration: none;}
.text a:hover {color: #000000; text-decoration: none;}
.text a:visited {color: #000000; text-decoration: none;}

img {border: 0;}

.active a {color: #024186;}
.top-border {border-top: 1px solid #000; margin-top: 20px; width: 100%;}

.mug-box {margin-top: 20px; background: url('http://www.averycap.com/images/drew-mug.jpg') no-repeat; width: 325px; font-size: 18px; color: #fff; height: 159px; background-color: #789bc3;}

.mug-box.min {background: url('http://www.averycap.com/images/min-mug.jpg') no-repeat; background-color: #789bc3;}

p a {color: #789bc3; font-family: Times, serif;}
.navigation {width: 100%; margin-bottom: 20px;}
nav {clear: both; width: 100%;}
nav ul {margin: 0; padding: 0;}
nav ul li {float: left; list-style-type: none; margin-right: 15px; font-family: Georgia, serif; font-size: 17px;}
/*nav ul li.active a {background: #1d4684; color: #fff; padding: 3px 12px;} */
/*nav ul li.active a:hover {color: #fff;}*/
nav ul li a {color: #789bc3; text-decoration: none;}
nav ul li a:hover {color: #1d4684;}
section {margin-top: 30px; width: 100%; clear: both; border-top: 1px solid #000;}
section img {width: 100%; border-radius: 5px;}
section p {font-size: 20px; line-height: 24px;}
section ul li {font-size: 20px; margin-bottom: 10px;}

footer {border-top: 1px solid #000; margin-top: 20px; width: 100%;}
footer p {font-size: 12px;}

h2 {margin-top: 0px; font-family: Helvetica, sans-serif; font-weight: 200; text-transform: uppercase;}

.text {float: left;
margin-left: 13px;
font-size: 30px;
margin-top: 5px;}

.contact p{line-height: 18px;}

img.drew {float: right; margin-left: 10px; max-width: 300px; width: 100%;}
img.min {float: right; margin-left: 10px; max-width: 300px; width: 100%;}

@media only screen and (min-width: 601px) and (max-width: 900px){


 section .wrap {}
section .wrap .inner {
 width: 95%;
margin: 0 auto;

}

.wrap-all {width: 95%;}

}

@media only screen and (min-width: 150px) and (max-width: 600px)

{


section .wrap inner {
 width: 95%;
margin: 0 auto;

}

.logo {float: none; text-align: center; margin-bottom: 0px;}
.text {float: none; text-align: center; margin-left: 0px;}


nav { border-top: 1px solid #fff; border-bottom: 1px solid #fff; padding: 0px 0px; height: 150px; clear: both;}
nav ul {margin: 0 auto; padding: 0px;}
nav ul li {list-style-type: none; text-align: center; padding: 10px 0px; display: inline-block; height: 20px; width: 100%;}
nav ul li a {display: block;}

.min, .drew {float: none !important; margin: 0 auto; margin-left: 0px !important;; padding-left: 0px !important; padding-top: 0px !important;}


}

@media only screen and (min-width: 150px) and (max-width: 400px) {


.mug-box {width: 100%; font-size: 14px;}

}


@media \0screen {
  img { 
  	width: auto; /* for ie 8 */
  }
}