.elementor-1338 .elementor-element.elementor-element-7071f87{--display:flex;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:30px;--padding-bottom:30px;--padding-left:0px;--padding-right:0px;}.elementor-1338 .elementor-element.elementor-element-7071f87:not(.elementor-motion-effects-element-type-background), .elementor-1338 .elementor-element.elementor-element-7071f87 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#009FE3;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-1338 .elementor-element.elementor-element-2910ed4{text-align:center;}.elementor-1338 .elementor-element.elementor-element-2910ed4 .elementor-heading-title{font-family:"Gilroy", Sans-serif;font-size:22px;font-weight:600;line-height:32px;color:#FFFFFF;}.elementor-widget-countdown .elementor-countdown-item{background-color:var( --e-global-color-primary );}.elementor-widget-countdown .elementor-countdown-digits{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-widget-countdown .elementor-countdown-label{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-countdown .elementor-countdown-expire--message{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-1338 .elementor-element.elementor-element-f8d9e33{width:var( --container-widget-width, 400px );max-width:400px;--container-widget-width:400px;--container-widget-flex-grow:0;}.elementor-1338 .elementor-element.elementor-element-f8d9e33 > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-1338 .elementor-element.elementor-element-f8d9e33 .elementor-countdown-wrapper{max-width:100%;}.elementor-1338 .elementor-element.elementor-element-f8d9e33 .elementor-countdown-item{background-color:#F9F9F9;border-radius:3px 3px 3px 3px;padding:10px 10px 10px 10px;}body:not(.rtl) .elementor-1338 .elementor-element.elementor-element-f8d9e33 .elementor-countdown-item:not(:first-of-type){margin-left:calc( 10px/2 );}body:not(.rtl) .elementor-1338 .elementor-element.elementor-element-f8d9e33 .elementor-countdown-item:not(:last-of-type){margin-right:calc( 10px/2 );}body.rtl .elementor-1338 .elementor-element.elementor-element-f8d9e33 .elementor-countdown-item:not(:first-of-type){margin-right:calc( 10px/2 );}body.rtl .elementor-1338 .elementor-element.elementor-element-f8d9e33 .elementor-countdown-item:not(:last-of-type){margin-left:calc( 10px/2 );}.elementor-1338 .elementor-element.elementor-element-f8d9e33 .elementor-countdown-digits{color:#000000;font-family:"Gilroy", Sans-serif;font-size:22px;font-weight:700;}.elementor-1338 .elementor-element.elementor-element-f8d9e33 .elementor-countdown-label{color:#000000;font-family:"Gilroy", Sans-serif;font-size:13px;font-weight:bold;}.elementor-1338 .elementor-element.elementor-element-b3bb1d2{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:120px;--padding-bottom:120px;--padding-left:30px;--padding-right:30px;}.elementor-1338 .elementor-element.elementor-element-f13c465{width:var( --container-widget-width, 1000px );max-width:1000px;--container-widget-width:1000px;--container-widget-flex-grow:0;}.elementor-1338 .elementor-element.elementor-element-f13c465.elementor-element{--align-self:center;}@media(max-width:767px){.elementor-1338 .elementor-element.elementor-element-7071f87{--padding-top:30px;--padding-bottom:30px;--padding-left:15px;--padding-right:15px;}}/* Start custom CSS for countdown, class: .elementor-element-f8d9e33 */span.elementor-countdown-digits{padding: 5px 15px;
    border-radius: 3px;
    background: white;
    box-shadow: 0 10px 40px 0 #0000001A;
}
.elementor-countdown-item {
    padding: 10px !important;
    border-radius: 3px !important;
    background: white;
    display: inline-block;
}

span.elementor-countdown-label {
    padding-top: 5px;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-7071f87 */<style>
#countdown-timer-sect {
    background: #009FE3;
    padding: 15px 0;
}
div#countdown span {
  color: #2f2f2f;
	font-weight: bold;
}	
.countdown-title {
    font-family: 'Gilroy';
    color: #fff;
    font-size: 22px;
    margin: 0px 0px 10px;
    text-align: center;
    font-weight: 600;
display:flex;
justify-content:center;

}
.countdown {
  display: flex;
  justify-content: center;
  column-gap: 10px;
  font-family: sans-serif;
  color: #fff;
/*   display: inline-block; */
  font-weight: 100;
  text-align: center;
  font-size: 30px;
}
.countdown-number {
  padding: 10px;
  border-radius: 3px;
  background: white;
  display: inline-block;
}
.countdown-time {
  padding: 5px 15px;
  border-radius: 3px;
  background: white;
  box-shadow: 0 10px 40px 0 #0000001A;
  display: inline-block;
	font-size: 22px;
}
.countdown-text {
  display: block;
  padding-top: 5px;
  font-size: 13px;
}
@media only screen and (max-width: 500px){
.countdown-number {
    font-size: 18px;
	  padding: 6px;
}
.countdown-text {
    font-size: 11px;
}
}	
@media only screen and (max-width: 767px){
span.countdown-title {
    font-size: 21px;
}
}		
</style>


<div id="countdown-timer-sect" bis_skin_checked="1">
<span class="countdown-title">The contest is live — enter now for your chance to win a free RO installation!</span>
<div id="countdown" class="countdown" bis_skin_checked="1">
<div class="countdown-number" bis_skin_checked="1">
<span class="days countdown-time">4</span>
<span class="countdown-text">Days</span>
</div>
<div class="countdown-number" bis_skin_checked="1">
<span class="hours countdown-time">01</span>
<span class="countdown-text">Hours</span>
</div>
<div class="countdown-number" bis_skin_checked="1">
<span class="minutes countdown-time">43</span>
<span class="countdown-text">Minutes</span>
</div>
<div class="countdown-number" bis_skin_checked="1">
<span class="seconds countdown-time">44</span>
<span class="countdown-text">Seconds</span>
</div>
</div>
</div>


<script>
   
  function getTimeRemaining(endtime) {
    var t = Date.parse(endtime) - Date.parse(new Date());
    var seconds = Math.floor((t / 1000) % 60);
    var minutes = Math.floor((t / 1000 / 60) % 60);
    var hours = Math.floor((t / (1000 * 60 * 60)) % 24);
    var days = Math.floor(t / (1000 * 60 * 60 * 24));
    return {
      total: t,
      days: days,
      hours: hours,
      minutes: minutes,
      seconds: seconds
    };
  }

  function initializeClock(id, endtime) {
    var clock = document.getElementById(id);
    var daysSpan = clock.querySelector(".days");
    var hoursSpan = clock.querySelector(".hours");
    var minutesSpan = clock.querySelector(".minutes");
    var secondsSpan = clock.querySelector(".seconds");

    function updateClock() {
      var t = getTimeRemaining(endtime);

      if (t.total <= 0) {
        clearInterval(timeinterval);

        // Reset the timer to the first day of the next month
        var currentDate = new Date();
        var currentMonth = currentDate.getMonth();
        var currentYear = currentDate.getFullYear();

        // Set the deadline to the first day of the next month
        var nextMonth = currentMonth === 11 ? 0 : currentMonth + 1;  // 11 is December, so next month should be January (0)
        var nextYear = currentMonth === 11 ? currentYear + 1 : currentYear; // If it's December, move to next year

        var nextMonthStart = new Date(nextYear, nextMonth, 1, 0, 0, 0); // First day of the next month at 00:00:00

        initializeClock(id, nextMonthStart); // Initialize clock with the new deadline
      } else {
        daysSpan.innerHTML = t.days;
        hoursSpan.innerHTML = ("0" + t.hours).slice(-2);
        minutesSpan.innerHTML = ("0" + t.minutes).slice(-2);
        secondsSpan.innerHTML = ("0" + t.seconds).slice(-2);
      }
    }

    updateClock();
    var timeinterval = setInterval(updateClock, 1000);
  }

  // Set the initial deadline to the first day of the next month
  var currentDate = new Date();
  var currentMonth = currentDate.getMonth();
  var currentYear = currentDate.getFullYear();

  var nextMonth = currentMonth === 11 ? 0 : currentMonth + 1;
  var nextYear = currentMonth === 11 ? currentYear + 1 : currentYear;
  
  var nextMonthStart = new Date(nextYear, nextMonth, 1, 0, 0, 0); // First day of the next month at 00:00:00

  initializeClock("countdown", nextMonthStart); // Initialize clock

</script>/* End custom CSS */
/* Start custom CSS for shortcode, class: .elementor-element-f13c465 */div#totalcontest * {
    font-family: 'Gilroy';
}

div#totalcontest{
    box-shadow: 0px 15px 10px 10px rgba(0, 0, 0, 0.05);
    
}/* End custom CSS */
/* Start Custom Fonts CSS */@font-face {
	font-family: 'Gilroy';
	font-style: normal;
	font-weight: normal;
	font-display: auto;
	src: url('https://watersofteneredmonton.ca/wp-content/uploads/2025/05/Gilroy-Regular.ttf') format('truetype');
}
@font-face {
	font-family: 'Gilroy';
	font-style: normal;
	font-weight: bold;
	font-display: auto;
	src: url('https://watersofteneredmonton.ca/wp-content/uploads/2025/05/Gilroy-Bold.ttf') format('truetype');
}
@font-face {
	font-family: 'Gilroy';
	font-style: normal;
	font-weight: 700;
	font-display: auto;
	src: url('https://watersofteneredmonton.ca/wp-content/uploads/2025/05/Gilroy-SemiBold.ttf') format('truetype');
}
@font-face {
	font-family: 'Gilroy';
	font-style: normal;
	font-weight: 200;
	font-display: auto;
	src: url('https://watersofteneredmonton.ca/wp-content/uploads/2025/05/Gilroy-Thin.ttf') format('truetype');
}
@font-face {
	font-family: 'Gilroy';
	font-style: normal;
	font-weight: 300;
	font-display: auto;
	src: url('https://watersofteneredmonton.ca/wp-content/uploads/2025/05/Gilroy-UltraLight.ttf') format('truetype');
}
/* End Custom Fonts CSS */