body { padding: 0; margin: 0; box-sizing: border-box; font-family: "Montserrat", sans-serif; color: #31335a; background-color: #f9f9f9; }
.body-content { max-width: 1200px; margin: 0 auto;   }
.col { clear: both; width: 100%; text-align: center; }
.col-2 { width: 48%; display: inline-block; vertical-align: top; }
.col-3 { display: inline-block; width: 28%; vertical-align: top; text-align: left;   }
.col-4 { display: inline-block; width: 23%; vertical-align: top; }
.column { display: inline-block; vertical-align: top; text-align: left;  }
.left { text-align: left; }
.float-left { float: left; }
.center { text-align: center; }
.right { text-align: right; }
.float-right { float: right; }
a { text-decoration: none; }
p { margin: 0; }
h1 { font-weight: 400; font-size: 16px; display: inline-block; }
.underline { text-decoration: underline; }
#YellowFont { color: #e6c240; }
#blueFont { color: #111b24; font-weight: 700; text-transform: uppercase; }
#header-space { padding: 0 20px; }
input, textarea { width: 1000px; border-radius: 3px; height: 50px; font-size: 16px; padding-left: 20px; font-family: "Montserrat", sans-serif; }

textarea { resize: none; height: 100px; padding-top: 12px; }
#Banner1 { margin: 0 auto; max-width: 60%; background-color: #fff; height: 300px; margin-top: -100px; z-index: 2; position: relative; border: 1px solid #eaeaea; padding: 5px; }
#Banner2 { background-color: #fff;  }
#Map { border-top: 1px solid #333; }
#ContactUs { clear: both; width: 100%; padding: 50px 0;  color: red; }
#Page-Banner { clear: both; width: 100%; background-color: #31335a; height: 50px; line-height: 50px; font-size: 18px; color: #fff; text-align: left;  }
.page-information { padding-left: 100px; }
.contact-information-window {  width: 80%; height: 150px; color: #000; background-color: #fff; margin: 0 auto;  margin-top: -50px; border: 1px solid #eaeaea; z-index: 2; position: relative; }
.pad-20 { padding-top: 20px; }
.pad20 { padding: 30px; }
.pad50 { padding: 50px; }
.pad-10 { padding-top: 10px; }
.pad-10 a { text-decoration: none; color: #fff; }
#Testimonials { clear: both; background-color: #fff; padding: 50px 0; }
.testimonial-window { width: 300px; display: inline-block;  padding: 30px 13px; border-radius: 5px; margin: 20px 3px; box-shadow: 2px 2px 2px 2px #888; text-align: left; border: 1px solid #000; }
#padding20 { padding: 20px; }
#Gallery { padding: 50px 0;  }
#splashBanner { position: fixed;  bottom: 0; left: 0; background-image: url("img/swirl.webp"); color: #fff; font-weight: 400;  z-index: 3; width: 100%; font-size: 10px; text-align: center;  }
.banner1, .banner2, .banner3, .banner4, .banner5 { display: inline-block; vertical-align: top; padding: 10px; text-align: left;   }
.banner1 { float: left; font-size: 16px; }
.banner4 { float: right; width: 500px; padding-top:20px; font-size: 18px; }
.banner5 { line-height: 100px;  background-image: url("https://sunsetcoders.com.au/ACFB/img/dollar.webp"); text-align: center; width: 400px; }
.banner1, .banner2, .banner3 { display: inline-block; vertical-align: top; padding: 10px; text-align: left; }
p { display: inline-block; vertical-align: top; }
.bold { font-weight: 700; }
#largeFont { font-size: 60px; font-weight: 700; margin: 0; }
.smallFont { font-size: 14px; }
#Quality { background-color: #10316b; color: #fff; padding: 50px 0; z-index: 2; position: relative; text-align: center; }
.largeFont { font-size: 39px; }
.lightBack { background-color: #2c5bbc; width: 60%; padding: 20px; margin: 0 auto;}
#splashScreen { clear: both; width: 100%; z-index: 1; }
#splashScreen img { width: 100%;  }
    
#AboutUs {  clear: both; width: 100%; padding: 50px 0; color: #000; }
#AboutImage { width: 100%; }

.chamber-window { display: block;   }
#Service-button { color: #fff; width: 300px; background-color: #252936; margin: 3px; padding: 10px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; cursor: pointer; }
.chamber { text-align: center; width: 100%; line-height: 23px; font-size: 18px; font-weight: 300; }
 .div2, .div3, .div4, .div5, .div6 { display: none; }
.animate-fading{animation:fading 10s infinite}@keyframes fading{0%{opacity:0}50%{opacity:1}100%{opacity:0}}
.animate-opacity{animation:opac .8s}@keyframes opac{from{opacity:0} to{opacity:1}}
.animate-top{position:relative;animation:animatetop 1.5s}@keyframes animatetop{from{top:-300px;opacity:0} to{top:0;opacity:1}}
.animate-left{position:relative;animation:animateleft .4s}@keyframes animateleft{from{left:-300px;opacity:0} to{left:0;opacity:1}}
.animate-right{position:relative;animation:animateright .4s}@keyframes animateright{from{right:-300px;opacity:0} to{right:0;opacity:1}}
.animate-bottom{position:relative;animation:animatebottom .4s}@keyframes animatebottom{from{bottom:-300px;opacity:0} to{bottom:0;opacity:1}}
.animate-zoom {animation:animatezoom 12.6s}@keyframes animatezoom{from{transform:scale(0)} to{transform:scale(1)}}
.animate-input{transition:width .4s ease-in-out}.w3-animate-input:focus{width:100%!important}
.services-first-line { height: 50px; padding: 20px; line-height: 30px; }

/* On smaller screens, where height is less than 450px, change the style of the sidenav (less padding and a smaller font size) */
@media screen and (max-height: 450px) {
  .sidebar {padding-top: 15px;}
  .sidebar a {font-size: 18px;}
}

.header-spacer { height: 100px; display: block; clear: both;  }
footer { clear: both; width: 100%; background-color: #31335a; padding: 50px 0; z-index: 2; position: relative; color: #dad5d1;  }
i { color: #dad5d1; font-size: 16px; }
#footer-logo { vertical-align: middle; }
.footer-left { float: left; }
.footer-right { float: right; }
.topBorder { border-top: 1px solid #33425d; }
 
.sticky { position: -webkit-sticky; position: sticky; top: 0; text-align: center; background-color: #fff; font-size: 20px; z-index: 3; }
.top-line, .navbar-line { height: 30px; background-color: #111b24; line-height: 30px; width: 100%; clear: both; color: #fff; font-weight: 600; font-size: 12px; }
.top-line i { font-size: 12px; }
.top-line a { color: #fff; }
.top-line a:hover { color: #1e90ff; }
.body-content { max-width: 1200px; margin: 0 auto; }
.navbar-line { text-align: center; }
.navbar-line a { color: #fff; text-decoration: none; padding: 0 60px;  }
.float-left { float: left; }
.float-right { float: right; }
.margin20 { margin: 0 20px; }
.topnav { overflow: hidden; text-align: center; background-color: #111b24; }
.topnav a { vertical-align: top; display: inline-block; color: #f2f2f2; text-align: center; padding: 10px 26px; text-decoration: none; font-size: 15px; font-weight: 600; }
.topnav .icon { display: none; }
.dropdown { display: inline-block; overflow: hidden; }
.dropdown .dropbtn { padding: 10px 26px; font-size: 15px; font-weight: 600; border: none; outline: none; color: #fff; background-color: inherit; font-family: inherit; margin: 0; }
.dropdown-content { display: none; position: absolute; background-color: #f9f9f9; box-shadow: 0 8px 16px 0 #0003; z-index: 1; }
.dropdown-content a { float: none; color: #000; text-decoration: none; display: block; text-align: left; }
.topnav a:hover, .dropdown:hover .dropbtn { color: #1e90ff; }
.dropdown-content a:hover { background-color: #ddd; color: #000; }
.dropdown:hover .dropdown-content { display: block; }

@media screen and (max-width: 1366px) {
    .banner1 { float: left; font-size: 12px; }
    .banner4 { float: right; width: 20%; padding-top:20px; font-size: 15px; }
    .banner5 { line-height: 100px;  background-image: url("https://sunsetcoders.com.au/ACFB/img/dollar.webp"); text-align: center; width: 20%; }
    .smallFont { font-size: 10px; } 
    .banner3 img { width: 50px; }
}

@media screen and (max-width: 992px) {
.col-2, .col-3, .col-4, .column, .float-left, .float-right { display: block; clear: both; width: 90%; margin: 0 auto; }
}

@media screen and (max-width: 600px) {
    #QualityImages { width: 95%;  }
    .banner3, .banner4, .banner5 { display: none; }
    .top-line { height: 90px; text-align: center; line-height: 20px; }
    .float-left, .float-right { float: none; }
    .sticky img { width: 100%; }
  .topnav a:not(:first-child), .dropdown .dropbtn { display: none; }
  .topnav a.icon { float: right; display: block; }
  .topnav.responsive { position: relative; } 
  .topnav.responsive .icon { position: absolute; right: 0; top: 0; }
  .topnav.responsive a { float: none; display: block; text-align: left; }
  .topnav.responsive .dropdown { float: none; }
  .topnav.responsive .dropdown-content { position: relative; }
  .topnav.responsive .dropdown .dropbtn { display: block; width: 100%; text-align: left; }
}