@charset "utf-8";
/* CSS Document */

/* @import url('css/font-awesome.min.css');*/

/* In html file */
/*<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta content="width=device-width, initial-scale=1" name="viewport">
<meta name="viewport" content="width=device-width">*/

/**
 * 8.0 Media Queries
 * ----------------------------------------------------------------------------
 */

/* Does the same thing as <meta name="viewport" content="width=device-width">,
 * but in the future W3C standard way. -ms- prefix is required for IE10+ to
 * render responsive styling in Windows 8 "snapped" views; IE10+ does not honor
 * the meta tag. See https://core.trac.wordpress.org/ticket/25888.
 */
@-ms-viewport {
	width: device-width;
}
@viewport {
	width: device-width;
}

@media (max-width: 1599px) {
}

@media (max-width: 1200px) {
	#slider h1{ font-size:30px;}
	header .navbar img{ width:150px;}
	header .navbar-light .navbar-nav .nav-link{ padding:10px; font-size:14px;}
	#slider .slider_image{ width:550px; height:550px;}
	#how_it_works .stap_1 h4{ font-size:16px;}
	}

@media (max-width: 1069px) {
	#slider .slider_image{ right:-110px;}
	#about_us .pl-5, #about_us .pr-5{ padding-left:15px !important; padding-right:15px !important;}
	#footer .footer_mascot{ width: 130px; top: -150px;}
    #slider{ height:550px;}
}

@media (max-width: 992px) {
#slider .slider_image{ width:450px; height:490px;}
header{ background:#fff;}
#header .navbar-light .navbar-toggler{ background:#fff; border-color:transparent;}
header{ position:static;}
#about_us h2{ font-size:1.5rem;}
#about_us p{ font-size:14px; font-weight:300;}
#how_it_works{ background:none;}
#how_it_works .stap_1 h4{ font-size:22px;}
#testimonials .review_box .name_image h5{ text-align:center;}
#testimonials .review_box p{ padding:0px; padding-top: 70px; text-align:center;}
#testimonials .review_box p:before{     right: 0px;
    margin: auto;
    text-align: center;}
	#slider{ height:490px;}
}

/* Collapse oversized image and pulled images after iPad breakpoint. */
@media (max-width: 767px) {
	#slider .slider_image {
    width: 100%;
    height: 490px;
    border-radius: 0px;
    border-bottom: 0px;
    right: 0;
    opacity: .2;
    top: 0;
}
#slider{ text-align:center; height:490px;}
#slider p{ display:none}
#slider ul{ justify-content:center;}
#app_download h3{ text-align:center; font-size:24px;}
#app_download p{ text-align:center;}
}

@media (max-width: 643px) {
#slider h1{ font-size:24px;}
#about_us h2{ text-align:center; font-size:24px;}
#about_us p{ text-align:justify; text-align-last:center;}
.site_button{ align-self:center;}
#about_us, #testimonials{ padding:40px 0px;}
#how_it_works{ padding:40px 0px; margin-top:0px;}
#how_it_works .stap_1 h4{ font-size:24px; line-height:inherit;}
#how_it_works .stap_1{ margin:15px 30px;}
#services, #contact{ padding:40px 0px;}
#about_us h2{ margin-top:20px;}
}

@media (max-width: 480px) {
#how_it_works .stap_1 h4{ font-size:20px;}
#how_it_works h2{ font-size:24px;}
#services h3{ font-size:24px;}
#services .nav .nav-item{ width:160px;}
#services .service_box{ margin-bottom:10px;}
#services .nav{ margin-bottom:0px;}
#footer .footer_mascot{ top:-200px;}
#footer .foot_link{ display:block !important;}
#footer .foot_link li a{ padding:0px !important;}
}

/* Mobile devices */
@media (max-width: 359px) {

}
/**
 * 9.0 Print
 * ----------------------------------------------------------------------------
 */

/* Retina-specific styles. */
@media print,
	(-o-min-device-pixel-ratio: 5/4),
	(-webkit-min-device-pixel-ratio: 1.25),
	(min-resolution: 120dpi) {

}

@media print {

}
