/* 
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com 
Twitter: @rich_clark
*/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }

body { line-height: 1; }

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

nav ul { list-style: none; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

a { margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent; }

/* change colours to suit your needs */
ins { background-color: #ff9; color: #000; text-decoration: none; }

/* change colours to suit your needs */
mark { background-color: #ff9; color: #000; font-style: italic; font-weight: bold; }

del { text-decoration: line-through; }

abbr[title], dfn[title] { border-bottom: 1px dotted; cursor: help; }

table { border-collapse: collapse; border-spacing: 0; }

/* change border colour to suit your needs */
hr { display: block; height: 1px; border: 0; border-top: 1px solid #cccccc; margin: 1em 0; padding: 0; }

input, select { vertical-align: middle; }

/* Prevent adjustments of font size after orientation changes in IE on Windows Phone and in iOS.  */
html { -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }

/*  apply a natural box layout model to all elements  */
* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }

body, p, h1, h2, h3, h4, h5, h6 { padding: 0; margin: 0; }

body { font-family: "Source Sans Pro", sans-serif; font-weight: 400; font-size: 16px; margin: 0 auto; }

div#headerWrapper { background-color: #00bfff; margin: auto; }

header { height: 120px; position: relative; margin: auto; display: flex; }
header figure.logo { position: absolute; bottom: 0; left: 2%; top: 3%; margin: auto; }

div#headerWrapper h1 { text-align: right; font-size: 24px; font-style: italic; margin-right: 2%; padding-bottom: 2%; }
div#headerWrapper h1 a#phoneNumber { text-decoration: none; color: #fafad2; }

div#navWrapper { /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#d8e0de+0,aebfbc+22,99afab+33,8ea6a2+50,829d98+67,4e5c5a+82,0e0e0e+100;Grey+3D */ background: #d8e0de; /* Old browsers */ background: -moz-linear-gradient(top, #d8e0de 0%, #aebfbc 22%, #99afab 33%, #8ea6a2 50%, #829d98 67%, #4e5c5a 82%, #0e0e0e 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, #d8e0de 0%, #aebfbc 22%, #99afab 33%, #8ea6a2 50%, #829d98 67%, #4e5c5a 82%, #0e0e0e 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, #d8e0de 0%, #aebfbc 22%, #99afab 33%, #8ea6a2 50%, #829d98 67%, #4e5c5a 82%, #0e0e0e 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d8e0de', endColorstr='#0e0e0e',GradientType=0 ); /* IE6-9 */ border-bottom: 1px solid rgba(0, 0, 0, 0.3); }

form#searchBar { margin-top: 5px; float: right; margin-right: 10px; }
form#searchBar input { font-size: 16px; padding: 1.8% 0.3%; border-radius: .5rem; border: solid 1.5px #fafad2; background-color: #2f4f4f; color: #fafad2; width: 100px; height: 34px; }
form#searchBar ::placeholder { color: #fafad2; }
form#searchBar button { font-size: 1.1rem; padding-top: 2.6%; padding-bottom: 2%; color: #fafad2; background-color: #2f4f4f; border: solid 1px #fafad2; width: 2rem; border-radius: 5px; top: 25px; }

button#hamburgerBtn { font-size: 1.5rem; color: #fafad2; background-color: rgba(0, 0, 0, 0.2); border: solid 1px rgba(0, 0, 0, 0.3); width: 8.0rem; margin: 5px 2%; border-radius: 5px; }

nav ul li a { display: block; color: #fafad2; text-decoration: none; width: 100%; padding: .8rem 5%; border: solid 1px rgba(0, 0, 0, 0.3); }
nav ul li ul li a { padding-left: 8%; }
nav ul li.active > a { background-color: #2f4f4f; }
nav ul { overflow: hidden; }
nav ul.closed { max-height: 0; }
nav ul.open { max-height: 31rem; -webkit-transition: max-height 0.5s; -moz-transition: max-height 0.5s; transition: max-height 0.5s; }

main { padding-bottom: 1rem; padding-top: 2rem; margin: 0 auto; /* ----- Slick Slider ---- */ /* ---- Cards ---- */ }
main h1 { font-size: 1.5rem; margin: 0.75rem 0 0 2%; color: #33ccff; padding-bottom: 1rem; }
main h2 { font-size: 1.2rem; margin: 0.75rem 0 0 2%; color: #33ccff; padding-bottom: 1rem; }
main p { margin: 0.5rem 2%; color: #e6e61a; }
main div.myslider div { width: 100%; }
main div.myslider div img { width: 100%; }
main div.container { display: grid; display: -ms-grid; grid-template-columns: 1fr 1fr 1fr; -ms-grid-columns: 1fr 1fr 1fr; grid-column-gap: 10px; grid-row-gap: 10px; margin: 4%; }
main div.container div.card1 { grid-row: 1; grid-column: 1 /span 2; position: relative; width: 400px; height: 450px; }
main div.container div.card1 img { width: 100%; opacity: 0.9; }
main div.container div.card1 img:hover { opacity: 1; }
main div.container div.card1 span { position: absolute; font-size: 2rem; font-style: italic; color: skyblue; background-color: black; opacity: 0.8; padding-bottom: .2em; padding-left: .1em; display: block; top: 14.5rem; text-align: left; width: 100%; }
main div.container div.card2 { grid-row: 2; grid-column: 1 /span 2; position: relative; width: 400px; height: 450px; }
main div.container div.card2 img { width: 100%; opacity: 0.9; }
main div.container div.card2 img:hover { opacity: 1; }
main div.container div.card2 span { position: absolute; font-size: 2rem; font-style: italic; color: skyblue; background-color: black; opacity: 0.8; padding-bottom: .2em; padding-left: .1em; display: block; top: 14.5rem; text-align: left; width: 100%; }
main div.container div.card3 { grid-row: 3; grid-column: 1 /span 2; position: relative; width: 400px; height: 450px; }
main div.container div.card3 img { width: 100%; opacity: 0.9; }
main div.container div.card3 img:hover { opacity: 1; }
main div.container div.card3 span { position: absolute; font-size: 2rem; font-style: italic; color: skyblue; background-color: black; opacity: 0.8; padding-bottom: .2em; padding-left: .1em; display: block; top: 14.5rem; text-align: left; width: 100%; }
main div.container div.card4 { grid-row: 4; grid-column: 1 /span 2; position: relative; width: 400px; height: 450px; }
main div.container div.card4 img { width: 100%; opacity: 0.9; }
main div.container div.card4 img:hover { opacity: 1; }
main div.container div.card4 span { position: absolute; font-size: 2rem; font-style: italic; color: skyblue; background-color: black; opacity: 0.8; padding-bottom: .2em; padding-left: .1em; display: block; top: 14.5rem; text-align: left; width: 100%; }

div#footerWrapper { background-color: #00bfff; margin: auto; }

footer { padding: 1rem 2%; width: 100%; }
footer div.footerLinks { display: grid; grid-template-columns: 1fr; }
footer div.footerLinks h2 { text-align: center; font-size: 1.2rem; color: #fafad2; margin-top: 2%; }
footer div.footerLinks ul li { list-style-type: none; margin-top: 2%; color: #fafad2; font-size: 1rem; text-align: center; }
footer div.footerLinks div.newsletter { grid-row: 2; grid-column: 1; margin-left: 4%; }
footer div.footerLinks div.newsletter p { font-size: 16px; }
footer div.footerLinks div.newsletter input { border-radius: .5rem; padding: .8em 4em; text-align: center; }
footer div.footerLinks div.newsletter button { margin: 2%; border-radius: .3rem; background-color: #2f4f4f; color: #fafad2; font-size: 14px; padding: .9em 2em; }
footer div.footerLinks div.info { margin-bottom: 8%; }
footer div.footerLinks div.info p { font-size: 16px; }
footer ul.social { list-style-type: none; display: flex; flex-direction: row; justify-content: center; background-color: #2f4f4f; width: 100%; padding: 1% 3%; }
footer ul li a { font-size: 2.8em; padding: .2em .5em; color: #fafad2; }
footer ul li a:hover { background: #1c2f2f; }
footer p { margin-top: 4%; text-align: center; color: #fafad2; padding: .75rem 0; font-size: 1rem; }

.keepOpen { clear: both; }

.clearfix:after { content: ""; display: table; clear: both; margin: auto; }

@media only screen and (min-width: 560px) { header { height: 130px; }
  div#headerWrapper h1 { margin-right: 4%; }
  div#headerWrapper h1 h1 a#phoneNumber:hover { background: #f5f5a4; }
  form#searchBar { margin-right: 10px; padding: 0.3% rem 0.4% rem; }
  form#searchBar button { font-size: 1.2rem; }
  button#hamburgerBtn { display: none; }
  nav { height: 60px; }
  nav ul.closed { max-height: 31rem; }
  nav ul { margin-left: 2%; border-left: 1px solid rgba(0, 0, 0, 0.2); }
  nav ul li { float: left; }
  nav ul li a { border: none; border-right: 1px solid rgba(0, 0, 0, 0.2); font-size: .9em; padding: .9em 1.5em; }
  nav ul li a:hover { background: #1c2f2f; }
  main div.container { grid-template-columns: 1fr 1fr; -ms-grid-columns: 1fr 1fr; margin-left: 2%; }
  main div.container div.card1 { grid-row: 1; grid-column: 1 /span 2; }
  main div.container div.card2 { grid-row: 1; grid-column: 2 /span 2; }
  main div.container div.card3 { grid-row: 2; grid-column: 1 /span 2; }
  main div.container div.card4 { grid-row: 2; grid-column: 2 /span 2; }
  footer div.footerLinks { grid-template-columns: 1fr 1fr; margin: 4%; }
  footer div.footerLinks div.contact { margin-right: 20px; }
  footer div.footerLinks div.newsletter { margin-right: 20px; }
  footer div.footerLinks div.info { margin-right: 20px; }
  footer div.footerLinks ul.social { justify-content: center; padding: 4% 50%; } }
@media only screen and (min-width: 1140px) { div#searchBar input span { display: inline; width: 200px; }
  nav ul li a span { display: inline; }
  main { max-width: 64rem; }
  main div.container { grid-template-columns: 1fr 1fr 1fr 1fr; -ms-grid-columns: 1fr 1fr 1fr 1fr; margin-left: 2%; }
  main div.container div.card1 { grid-row: 1; grid-column: 1 /span 4; }
  main div.container div.card2 { grid-row: 1; grid-column: 3 /span 4; }
  main div.container div.card3 { grid-row: 2; grid-column: 1 /span 4; }
  main div.container div.card4 { grid-row: 2; grid-column: 3/span 4; }
  footer { max-width: 95rem; }
  footer div.footerLinks { grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr; margin-left: 100px; }
  footer div.footerLinks div.contact { grid-row: 1; grid-column: 1 /span 2; }
  footer div.footerLinks div.newsletter { grid-row: 1; grid-column: 4 /span 2; }
  footer div.footerLinks div.newsletter button { margin-left: 25%; }
  footer div.footerLinks div.info { grid-row: 1; grid-column: 7 /span 2; }
  footer div.footerLinks ul.social { justify-content: center; grid-column: 1 /span 8; padding: 4% 75%; } }

/*# sourceMappingURL=styles.css.map */