img, iframe {max-width: 100%; height: auto} html,body{-webkit-text-size-adjust:100%;text-size-adjust:100%} body { font-family: 'Open Sans', sans-serif; font-size: 16px; background-color: #fff; color: #333; line-height: 1.5; text-align: center; } h1, h2, h3, h4, h5, h6, p, th, td, dd, dt, li, blockquote { text-align: left; } body, header ul, section ul, section ol { padding: 0; margin: 0; } img, iframe { max-width: 100%; } a img, iframe { border: none; } a, nav li a:hover { text-decoration: none; color: #B30C00; } a:hover { text-decoration: underline; } .feat1 a:hover, .feat2 a:hover, footer a:hover { text-decoration: none; } hr { border: none; border-bottom: 1px solid #eee; margin: 20px 0; } .imgLeft { float: left; margin: 5px 4% 15px 0;max-width:45% } .imgCenter { display: block; margin: 0 auto; } .imgRight { float: right; margin: 5px 0 10px 4%; max-width: 45%; } .clear { clear: both; } .center { text-align: center; } .wrap { max-width: 1020px; display: block; margin: 0 auto; position: relative; } header, nav { display: inline-block; vertical-align: middle; } nav li { display: inline-block; vertical-align: top; } .table { display: table; width: 100%; } .table > div { display: table-cell; position: relative; } .table.half > div { width: 47.5%; } .table.half > div:nth-of-type(odd) { padding-right: 1.5%; } .table.half > div:nth-of-type(even) { padding-left: 1.5%; } .table.third > div { width: calc((100% / 3) - 1%); } .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%; } .grid{display:grid;grid-gap:10px 20px} .grid.mid{align-items:center} .grid.half{grid-template-columns:1fr 1fr} .nowrap { white-space: nowrap; } h2 { font-size: 1.75em; } h3 { font-size: 1.66em; } h4 { font-size: 1.5em; } h5 { font-size: 1.25em; } h6 { font-size: 1em; } .top { background-color: #ffe09b; padding: 4px 0; } .logoalt{display:none;margin:0 auto} nav { text-align: right; } nav ul { margin: 0; padding: 0; } nav li a { font-size: 15px; color: #333; padding: 5px; margin: 5px; display: block; } nav li:last-of-type a { padding-right: 0; } .banner h1 { font-size: 34px; line-height: 170%; text-align: center; color: #fff; margin: 0; text-shadow: 1px 1px 3px #000; position: relative; top: 50%; transform: translateY(-50%); } .banner h1 > span { max-width: 770px; font-size: 39px; display: block; text-transform: uppercase; padding-bottom: 10px; margin: 0 auto 10px; border-bottom: 4px double rgba(255, 255, 255, .5); } .banner h1 .fa { font-size: 8px; vertical-align: middle; } .bannerInterior { height: 150px; background-image: url(/images-content/bannerinterior.jpg); background-size: cover; background-position: right; } .bannerInterior > .wrap, .cycle-slideshow a > .wrap { position: relative; height: 100%; } .bannerInterior h1 { color: #fff; margin: 0; text-shadow: 1px 1px 3px #000; position: relative; top: 50%; transform: translateY(-50%); } .cycle-slideshow { height: 600px; text-align: left; position: relative; overflow: hidden; } .cycle-slideshow a { display: block; width: 100%; height: 100%; margin: 0 auto; position: relative; text-decoration: none; background-size: cover; background-position: center; } .cycle-slideshow a:hover{text-decoration: none;} .cycle-prev, .cycle-next { position: absolute; top: 0; width: 5%; z-index: 999; 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: .8; } a.slide1 { background-image: url(/images-content/slides/1.jpg); background-position: 72.5% 50% } .slide2 { background-image: url(/images-content/slides/2.jpg);} .slide3 { background-image: url(/images-content/slides/3.jpg);} h1, h2, h3, h4 { font-family: 'Raleway', sans-serif; } section { padding: 40px 0; } section li { margin: 0 0 10px 20px; } .btn, .buttons a { display: inline-block; color: #2C6700; margin-top: 10px; padding: 10px 40px; border: 1px solid #2C6700; } .btn:hover, .buttons a:hover { cursor: pointer; text-decoration: none; background-color: #2C6700; color: #fff; } .buttons a { width: 15%; text-align: center; margin: 20px 10px; } .spacing p { margin-top: 5%; } .featured h2, .featured p { text-align: center; } .featured h2 { font-size: 24px; padding-bottom: 15px; border-bottom: 4px double rgba(0,0,0,.2); } .featured .btn { margin: 30px auto; } form { margin: 20px 0; } form div { width: 49%; padding: 0; } form div:first-of-type { margin-right: 15px; } form input[type=text], form input[type=email], form input[type=tel], form input[type=submit], form textarea { font-family: 'Open Sans', sans-serif; font-size: 14px; } form input[type=text], form input[type=email], form input[type=tel], form textarea { width: calc(100% - 22px); padding: 0 10px; margin-bottom: 20px; border: 1px solid #ddd; } form input[type=text], form input[type=email], form input[type=tel] { height: 36px; } form textarea { height: 90px; padding: 10px; } form input[type=submit] { background-color: #fff; color: #B30C00; padding: 10px 40px; border: 1px solid #B30C00; } form input[type=submit]:hover { cursor: pointer; text-decoration: none; background-color: #B30C00; color: #fff; } #contact { text-align: right; } footer .table > div:last-of-type p { text-align: right; } footer .table > div { width: 40%; vertical-align: middle; padding: 0 1%; } footer .table > div:nth-of-type(2) { width: 20%; } footer .icon { text-align: center; line-height: 1; } footer .icon > a { display: inline-block; } footer .wrap{padding-bottom:30px} footer a { color: #333; } .products p, .products h2 { margin: 8px auto; display: block; width: 80%; } blockquote { padding: 5px 0; margin: 1em 4%; border-bottom: 1px solid #eee; } blockquote:last-child { border-bottom: none; } blockquote cite { text-align: right; display: block; padding-bottom: 5px; } .top, .cycle-slideshow a > .wrap, footer .wrap, .bannerInterior > .wrap, section { padding-left: 10px; padding-right: 10px; } .normal { font-weight: normal; font-size: .8em; } @media(max-width:999px) { .banner h1 { font-size: 33px; } } @media(max-width:767px) { nav ul{text-align:center} .grid.half{grid-template-columns:1fr} .table.half, .table.half > div, .table.third, .table.third > div { display: block; width: auto !important; padding: 0 !important; margin: 12px 0; } } @media(max-width:500px) { .cycle-next, .cycle-prev { display: none; } .galleryImg { text-align: left; } .galleryImg a { max-width: 49%; display: inline-block; } section > .imgRight,section> .imgLeft{max-width:100%;float:none;margin:12px auto} } @media(max-width:400px) { .logomain{display:none} .logoalt{display:block} .featured h2 { font-size: 22px; } footer .table, footer .table > div { display: block; width: auto !important; margin: 12px 0; } footer .table p { text-align: center !important; } }