.mobile_content{max-width:50%; z-index:100;}

.mobile_screenshot_top{position:relative; z-index:100; margin:-50x 0 -150px;}
.mobile_screenshot{width:50%;}

.mobile_box_first{display:block; width:100%; margin:2.5rem auto 5rem;}
.mobile_box_mid{display:block; width:100%; margin:1rem auto;}
.mobile_box_last{display:block; width:100%; text-align:center; padding:2.5rem 0 0; margin:5rem auto 0; border-top:1px solid #ddd;}

.mobile_box_first_img{width:350px; z-index:1000; position:relative; border-radius:0 0 50px 50px; box-shadow:0px 187px 100px 33px rgba(0,0,0,0.05);}

.mobile_box_img{width:100%;}

.mobile_box_first_contenttable{display:table; width:100%; height:auto; text-align:left; margin:8rem 0;}
.mobile_box_first_contentcell{display:table-cell; vertical-align:middle;}
.mobile_box_first_content_title{display:block; width:100%; line-height:3.5rem; font-size:2.5rem; font-weight:700; color:var(--white);}
.mobile_box_first_content_subtitle{display:block; width:95%; line-height:1.5rem; font-size:0.95rem; font-weight:600; color:var(--white); margin:2rem 0;}
.mobile_box_first_contentdownload{display:block; width:100%; margin-top:5rem;}
.mobile_box_first_contentdownload img{display:inline-block; width:200px; height:auto; border:2px solid transparent; border-radius:50px; margin-right:2.5%; vertical-align:top;}
.mobile_box_first_contentdownload img:hover{border:2px solid #aaa;}

.mobile_box_content_first_table{display:table; width:80%; height:auto; padding-left:20%; margin:8rem 0;}
.mobile_box_content_first_tablecell{display:table-cell; vertical-align:middle; text-align:right;}

.mobile_box_content_second_table{display:table; width:80%; height:auto; margin:8rem 20% 8rem 0;}
.mobile_box_content_second_tablecell{display:table-cell; vertical-align:middle; text-align:left;}

.mobile_box_content_third_table{display:table; width:80%; height:auto; padding-left:20%; margin:8rem 0;}
.mobile_box_content_third_tablecell{display:table-cell; vertical-align:middle; text-align:right;}

.mobile_box_content_title{display:block; width:100%; line-height:3.5rem; font-size:2.5rem; font-weight:700; color:var(--base);}
.mobile_box_content_title_third{display:block; width:100%; line-height:3.5rem; font-size:2.5rem; font-weight:700; color:var(--base); margin-top:4rem;}
.mobile_box_content_title_last{width:80%; max-width:80%; line-height:3.5rem; font-size:2.85rem; font-weight:700; color:var(--darkest-gray); text-align:center;}
.mobile_box_content_stop_blue{color:var(--primary);}
.mobile_box_content_stop_red{color:var(--red);}
.mobile_box_content_subtitle{display:block; width:100%; line-height:1.5rem; font-size:0.95rem; font-weight:600; color:#666; margin:2rem 0;}
.mobile_box_content_subtitle_last{width:80%; line-height:1.5rem; font-size:0.95rem; font-weight:500; color:var(--base); text-align:center; margin:2rem auto;}

.mobile_box_last_logo{display:block; width:150px; height:auto; margin:1rem auto;}
.mobile_box_last_download{display:inline-block; width:200px; height:auto; margin:1rem;}


/* ---------------------------------------------------------------------------------------------- */
/* -------------------------- media css - updated 14/07/2026 - 10:29am -------------------------- */
/* ---------------------------------------------------------------------------------------------- */

@media only screen and (min-width: 481px) and (max-width: 660px) {

	.header_main {width:100% !important; max-width:100% !important; padding:0 5% !important;}
	.mobile_content, .mobile_screenshot{width:100%; max-width:100%;}
	.mobile_screenshot_top{display:none}
	
}

@media only screen and (min-width: 661px) and (max-width: 720px) and (orientation: portrait) {
  
	.header_main {width:100% !important; max-width:100% !important; padding:0 5% !important;}
	.mobile_content, .mobile_screenshot{width:100%; max-width:100%;}
	.mobile_screenshot_top{display:none}
	
}

@media only screen and (min-width: 721px) and (max-width: 920px) {
	
}

@media only screen and (min-width:921px) and (max-width: 1439px) {
	
}

@media only screen  and (min-width: 1280px) and (max-width: 1439px) {
	
}

@media only screen  and (min-width: 1440px) and (max-width: 1600px) {
	
}

@media only screen and (max-device-width: 480px) and (orientation:portrait) {
	
	.header_main {width:100% !important; max-width:100% !important; padding:0 5% !important;}
	.mobile_content, .mobile_screenshot{width:100%; max-width:100%;}
	.mobile_screenshot_top{display:none}
	
}

@media only screen and (max-device-width: 720px) and (orientation:landscape) {
  
}

/* -------------------------------------------------------------------------------------------------- */
/* -------------------------- END media css - updated 14/07/2026 - 10:29am -------------------------- */
/* -------------------------------------------------------------------------------------------------- */