@import url("https://fonts.googleapis.com/css?family=Lato:300,400,700");
*{
font-family: 'Lato', 'san-serif';
padding: 0;
margin: 0;
}
body{
background-image: url(//inmopolt.com/countdowntimer-main/countdowntimer-main/bg.jpg);
background-size: cover;
background-repeat: no-repeat;
min-height: 100vh;
}
.container{
max-width: 900px;
margin: 60px auto;
}
.container h1,
.container p{
color:#fff;
text-align:center;
padding:15px 0;    
}
.container h1{
font-size: 2em;
}
.container p{
font-size: 2em;
}
.center-abs{
top: 30%;
left: 50%;
transform: translate(-50%, -50%);
position: absolute;
}
.charts{
display: flex;
flex-wrap: wrap;
}
.chart {
position: relative;
width: 25%;
height: 220px;
}
.chart h3 {
color: #fff;
font-size: 1em;
position: absolute;
bottom: 5px;
margin-top: -30px;
text-align: center;
width: 100%;
text-shadow: 1px 1px 10px #000;
}
.chart svg {
z-index: 2;
}
.circle {
width: 100px;
height: 100px;
border-radius: 50%;
z-index: 1;
border: 7px #baeaff solid;
}
span.text {
z-index: 3;
text-align: center;
width: 100%;
font-size: 40px;
font-weight: 700;
color: #0096da;
}
.outer {
fill: transparent;
stroke: #0096da;
stroke-width: 5;  stroke-dasharray: 439; transform: rotate(270deg) translate(-150px, 0);
}
#countdown-content p{
text-align: center;
font-size: 2em;
color:#fff;
font-weight: 700;
width: 100%;
}