.video-placeholder { width: 100%; position: relative; height: 0px; padding-bottom: 56.25%; background-image: url(https://www.naco.org/sites/default/files/topics/Tech-2_8.jpg); background-size: cover; background-position: center; cursor: pointer; } .video-placeholder:after { content: ""; width: 100%; height: 100%; background-image: url(/sites/default/files/default_images/play-button.svg); background-size: contain; position: absolute; left: 0px; top: 0px; background-position: center; background-size: 80px; background-repeat: no-repeat; transition: all 0.2s ease-in-out; } .video-placeholder:hover:after { background-size: 95px !important; } .video-placeholder.clicked:after { opacity: 0 !important } .video-placeholder.clicked {cursor: inherit !important;} .video-placeholder.clicked .countdown { transform: scale(1.2); bottom: 64px !important; left: 64px !important; } .countdown { position: absolute; bottom: 16px; left: 16px; width: auto; min-width: 200px; max-width: calc(100% - 32px); display: table; flex-wrap: wrap; overflow: hidden; border-radius: 12px; transition: all .69s ease-in-out; } @media screen and (max-width: 236px) { .countdown {min-width: none !important} } .countdown:before { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background-color: rgba(51,51,51,0.89); mix-blend-mode: multiply; content: ""; } .digit { display: inline-block; width: 33.333%; color: white; position: relative; padding: 8px; line-height: 1.15; font-family: "AlternateGotNo2D"; font-size: 24px; text-align: center; } .digit#days { width: 100% !important; display: block !important; font-family: "museo-sans"; font-weight: 100; text-transform: uppercase; font-size: 24px; line-height: 1.2 !important; padding-bottom: 0px !important } .digit#hours:after { content: "Hours"; display: block; width: 100%; text-align: center; font-family: "Museo-Sans"; font-weight: 100; font-size: 10px; padding: 4px 0px; color: #ffffff; } .digit#minutes:after { content: "Minutes"; display: block; width: 100%; text-align: center; font-family: "Museo-Sans"; font-weight: 100; font-size: 10px; padding: 4px 0px; color: #ffffff; } .digit#seconds:after { content: "Seconds"; display: block; width: 100%; text-align: center; font-family: "Museo-Sans"; font-weight: 100; font-size: 10px; padding: 4px 0px; color: #ffffff; } $(document).ready(function(){ $(".video-placeholder").click(function(){ $(".video-placeholder").addClass("clicked"); }); }); // Set the date we're counting down to var countDownDate = new Date("March 5, 2019 12:00:00").getTime(); // Update the count down every 1 second var x = setInterval(function() { // Get todays date and time var now = new Date().getTime(); // Find the distance between now an the count down date var distance = countDownDate - now; // Time calculations for days, hours, minutes and seconds var days = Math.floor(distance / (1000 * 60 * 60 * 24)); var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60)); var seconds = Math.floor((distance % (1000 * 60)) / 1000); // Output the result in an element with id="demo" document.getElementById("days").innerHTML = "Live in " + days + " days"; document.getElementById("hours").innerHTML = hours; document.getElementById("minutes").innerHTML = minutes; document.getElementById("seconds").innerHTML = seconds; // If the count down is over, write some text if (distance < 0) { clearInterval(x); document.getElementById("days").innerHTML = "0"; document.getElementById("hours").innerHTML = "0"; document.getElementById("minutes").innerHTML = "0"; document.getElementById("seconds").innerHTML = "0"; } }, 1000);

The CIO Forum provides an opportunity for county CIOs and technology officials to learn about the latest technology programs and engage with NACo Premier Corporate members. The 2019 CIO Forum will focus on cybersecurity, telecommunications infrastructure, disaster planning and recovery and cloud storage

2019-03-05

Video

2020-09-09