@media (min-width:1440px){
	 html {
        font-size: 130%;
    }
    #logo {
        margin-top: 9rem;
    }
	#slogan {
		margin:8rem 0;
    }
	.time_circles {
		margin:10rem 0;
	}
}
@media (min-width: 1025px) and (max-width: 1439px) {
    html {
        font-size: 112%;
    }
    #home_image {
        top:17rem;
    }
	#slogan,.time_circles  {
		margin:6rem 0;
    }
}

@media (min-width: 769px) and (max-width: 1024px) {
    html {
        font-size: 90%;
    }
    #logo,
	.animation #logo	{
        margin-top: 9rem;
    }
	#slogan {
		margin:9rem 0;
    }
	.time_circles {
		margin:10rem 0;
	}
}

@media (max-width: 768px) {
    html {
        font-size: 81.25%;
    }

    #features_1, #features_2 {
    text-align:center;
    }
    
    .feature_icon {
    float:none;
    width:3rem;
    height:3rem;
    margin-bottom: 1rem;
    margin-right:0;
    }

    
    #about {
    margin-bottom:4.568em;
    }
    
    p {
        font-size: 1.5rem;
    }
    h4 {
        font-size: 1.5rem;
    }
    #features_3 {
        height:auto;
    }
    #features_3_content_left {
        text-align:center;
        padding-bottom:6.5rem;
        padding-right:1rem;
    }

    #features_3_content_right {
        text-align:center;
        padding-left:1rem;

    }

    #features_3_content_center img{
        text-align:center;
        margin-left:auto;
        margin-right:auto;
    }
    
	#slogan {
		margin: 9rem 0;
		width: 100%;
	}
	.time_circles {
		margin:10rem 0;
	}
	
    #logo,
	.animation #logo {
        margin-top: 19rem;
    }
    
    #home_image {
        top:17rem;
    }

}
@media (max-width: 480px) {
    html {
        font-size: 62.5%;
    }
    p {
        font-size: 1.5rem;
    }

    h1 {font-size:3rem;}
    
    
    #logo,
	.animation #logo {
        margin-top: 4.5rem;
    }
    #home_image {

    top:25rem;
    }
    
    #slogan {
    width:90%;
    }
	.timer h1{
		font-size:3rem;
	}
	.animation #logo_header,
	.frame #logo_header,
	.parallax #logo_header,
	.rain #logo_header,
	.snow #logo_header,
	.solid #logo_header,
	.video #logo_header{
		margin-bottom: 9rem;
	}
	#slogan {
		margin: 2rem 0;
		width: 100%;
	}
	#left_timer{
		width:91%
	}
	.button_more{
		left:45%;
	}
	.fillWidth {
    width: auto;
    height: 100%;
	}
}

@media (max-width: 480px) and (orientation:landscape) {
    #logo,
	.animation #logo,
	.map #logo,
	.rain #logo,
	.snow #logo,
	.solid #logo,
	.video #logo,
	.grid #logo,
	.frame #logo{
        margin-top: 2rem;
	}
	.animation #logo_header,
	.frame #logo_header,
	.parallax #logo_header,
	.rain #logo_header,
	.snow #logo_header,
	.solid #logo_header,
	.video #logo_header{
		margin-bottom: 2rem;
	}
	#slogan {
		margin: 2rem 0;
		width: 100%;
	}
	.timer h1{
		font-size:3rem;
	}
	.button_more{
		left:47%;
	}
}
