@import url('https://fonts.googleapis.com/css2?family=Passion+One:wght@700&display=swap');
@font-face {
  font-family: 'Roustel';
  src: url('../fonts/roustel.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}
@-webkit-keyframes blink {
	0%,
	100% {
		opacity: 1;
	}
	50% {
		opacity: 0;
	}
}
@keyframes blink {
	0%,
	100% {
		opacity: 1;
	}
	50% {
		opacity: 0;
	}
}
.data-\[te-carousel-fade\]\:z-\[1\][data-te-carousel-fade]{z-index:1}
.data-\[te-carousel-fade\]\:z-0[data-te-carousel-fade]{z-index:0}
.transition-transform{
  transition-property:transform;
  transition-timing-function:cubic-bezier(.4,0,.2,1);
  transition-duration:.15s
}
.motion-reduce\:transition-none{transition-property:none}
.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}
.big_num {
	font-size: 82px;
}
.container {
	width: 80% !important;
}
.roustel {
	font-family: 'Roustel', sans-serif !important;
}
.fa:before {font-family: FontAwesome}
.dynamic_typing_container {
	white-space: nowrap;
	height: 1.4em;
	line-height: 1.4em;
	margin-bottom: 20px;
}
.dynamic_typing_text {
	display: none;
	opacity: 0;
	overflow: hidden;
	vertical-align: bottom;
}
.dynamic_typing_text_active {
	display: inline-block;
	opacity: 1;
}
.dynamic_typing_cursor {
	display: inline-block;
	-webkit-animation: blink 1s step-end infinite;
	animation: blink 1s step-end infinite;
	font-weight: normal;
}
.green-btn {
	display: inline-block;
	background: #349509;
}
.inner-box {
	box-shadow: 0 0 20px rgb(0 0 0 / 15%);
	-webkit-box-shadow: 0 0 20px rgb(0 0 0 / 15%);
}
#header-section h1 small {
	font-size: 33px;
}
#header-section a {
	transition: all .3s ease-in-out;
	width: 160px;
}
.bg-whitesmoke {background: whitesmoke !important}
#main_wrapper{padding: 0}
#carouselExampleControls{
	background-image: url(https://www.top4.com.au/images/top4new/bg-white-top.png);
}
#cta1 {
	background-image: url(../images/home/bg-cta.png);
}
.cta {
	background-image: url(https://www.top4.com.au/images/top4new/bg-cta.png);
}
/* circle stats */
@keyframes growProgressBar {
	0%, 33% { --pgPercentage: 0; }
	100% { --pgPercentage: var(--value); }
}
@property --pgPercentage {
	syntax: '<number>';
	inherits: false;
	initial-value: 0;
}
div[role="progressbar"] {
	--size: 14rem;
	--fg: #ffd331;
	--bg: rgba(246, 246, 246, .5);
	--pgPercentage: var(--value);
	animation: growProgressBar 3s 1 forwards;
	width: var(--size);
	height: var(--size);
	background:
	radial-gradient(closest-side, white 70%, transparent 0 99.9%, transparent 0),
	conic-gradient(var(--fg) calc(var(--pgPercentage) * 1%), var(--bg) 0);
	font-size: calc(var(--size) / 5);
	font-weight: bold;
	color: #2e2d2c;
	margin: 25px auto;
}
div[role="progressbar"]::before {
	counter-reset: percentage var(--value);
	content: counter(percentage) '%';
}
.stats-circle .mark {
  margin-top: -34%;
  width: 78px;
}
/* FAQ */
.custom-btn {
	height: 39px;
	margin-left: 30px;
}
.custom-faq a {
	color: #ffb303;
	text-decoration-color: #ffb303;
	cursor: pointer;
}
.custom-faq ol, .custom-faq ul {
	list-style: square;
	margin: -5px 0 -5px 25px;
}
li > h3.question {
	background: #2e2d2c;
}
li > h3.question i{
	margin-right: 1em;
	padding: 26px;
	background: #ffd331;
}
ul.form_row.custom-form-row > li {
	border-radius: 8px;
	border: 1px solid #dddd;
	margin-bottom: 15px;
	overflow: hidden;
}
.answer p:last-of-type {padding: 0;}
#client .content {
	padding: 60px 12% 30px;
}
#client h3{
	min-height: 56px;
}
#client .grid-card {
	border-radius: 12px;
	border: 1px solid rgba(221, 221, 221, .5);
	-webkit-box-shadow: rgb(0 0 0 / 12%) 0px 6px 16px;
	box-shadow: rgb(0 0 0 / 12%) 0px 6px 16px;
	overflow: hidden;
}
#client .case-img img {
	width: 75px;
	height: 75px;
	margin-bottom: -40px;
	-webkit-box-shadow: rgb(0 0 0 / 12%) 0px 6px 16px;
	box-shadow: rgb(0 0 0 / 12%) 0px 6px 16px;
	border: 5px solid white;
}
.flex-col-img img{
	width: 100%;
}
/* carousel */
.testi-box {
	border-radius: 192px;
	box-shadow: 0 5px 15px rgb(0 0 0 / 8%);
	-webkit-box-shadow: 0 5px 15px rgb(0 0 0 / 8%);
	margin: 0 auto;
	text-align: left;
}
.testi-img img{
	width: 155px;
	height: 155px;
	border: 1px solid rgb(221, 221, 221);
	box-shadow: 0 5px 10px rgb(0 0 0 / 20%);
}
.testi-box h4{
	font-size: 18px;
	padding-bottom: 17px;
}
.testi-box h4 span{
	font-size: 150%;
}
.testi-box p{
	font-size: 16px;
	line-height: 1.5;
	text-align: justify;
}
.testi-logo{
	box-shadow: 0 5px 15px rgb(0 0 0 / 8%);
	-webkit-box-shadow: 0 5px 15px rgb(0 0 0 / 8%);
	width: 30%;
	padding: 10px 20px;
	margin-top: -16%;
	border-radius: 40px;
}
p.star-rating{
	color: #ffd331 !important;
	float: right;
}
#trust {
	background-image: url(../images/home/bg-trust.png);
}
#trust .trusted {
	font-size: 42px;
}
#trust p.trusts {
	font-size: 16px;
	font-weight: bold;
	padding: 17px 0;
	color: darkgray;
	text-transform: uppercase;
}
#trust .trusts img {
	margin: 0 0 -5px 5px;
	width: 17em
}
#trust a.locale-id-links {
	position: absolute;
	margin-left: 85px;
}
#trust .locale-id-links img {
	width: 34px;
	height: 27px;
	margin: 0 0 0 0;
}
ul.checknew li:before {
  content: "\f00c";
  font-family: FontAwesome;
  display: inline-block;
  left: -5px;
  color: #78b44b;
}

.flag_container img {
	width: 30px;
	height: 30px;
}
#header-section ul li:before {
  position: relative;
  font-size: 18px;
}
#ai ul li:before {
  position: absolute;
  font-size: 22px;
}
blockquote {
	font-size: 16.1px;
	line-height: 1.4;
	background: -webkit-linear-gradient(top, #000000, #353535);
	background: -moz-linear-gradient(top, #000000, #353535);
	border-radius: 15px;
}
blockquote:before,
blockquote:after {
	position: absolute;
	color: #ffd331;
	font-size: 8rem;
	font-family: 'Passion One', cursive;
	width: 4rem;
	height: 4rem;
}
blockquote:before {
	content: '“';
	left: -2rem;
	top: -3rem;
}
blockquote:after {
	content: '”';
	right: -1rem;
	bottom: 0;
}
.content .star-rating{
	float: unset;
	padding: 30px 0;
}
#client .container {
  width: 89% !important;
}
#client .content .content-stats span{
	font-size: 50%;
}
.bootstrap-container {
	max-width: 1170px;
}
.step:after {
	content: "";
	position: absolute;
	width: 99%;
	background: lightgray;
	height: 15px;
	top: 25%;
}
.step:after {
	left: 59%;
}
.loading-between {
	width: 0;
	background: #ffd331;
	height: 15px;
	top: 25%;
	left: 44%;
	z-index: 9;
}
.step:nth-of-type(3):after{content: none;}
.step img {
	width: 70px;
	filter: grayscale(100%);
}
.step.active img {
	filter: none;
}
.step-container {
	display: none;
}
.active {
	display: block;
}
.text-base-bigger {font-size: 1.05rem}
.youtubeVimeoWithPlaylistBorder{
	margin: auto;
	z-index: 1;
	background: transparent !important;
}
.youtubeVimeoWithPlaylist.default .thumbsHolderWrapper {
	background: transparent !important;
}
@media (min-width: 992px) {
	.step-container img {
		width: 80%;
	}
	.step-point {
		padding-bottom: 25px;
	}
	.inner-box {
		max-width:650px;
    margin-top: 13%;
    margin-bottom: 6%;
	}
	.cta-btn:after{
		margin-inline-start: -.7rem;
		opacity: 0;
		font-family: 'FontAwesome';
		content: "\f178";
		height: 1rem;
		font-weight: 100;
		transition: all .3s ease-in-out;
	}
	#header-section a:hover {
		width: 160px
	}
	.cta-btn:hover:after {
		opacity: 1;
		margin-inline-start: 0.5rem;
	}
	.cd-partner {
		font-size: 10px;
	}
	.cd-partner img {
		margin-bottom: -9px;
		margin-left: 7px;
		height: 24px;
	}
	#stats-cicle .circle-container {
		padding-top: 30px;
	}
	.testi-box {
		width: 75%;
	}
	.testi-content{
		padding: 26px 63px 0 !important;
		margin-left: -5.5rem !important;
	}
	.testi-content p.star-rating {
		position: absolute;
		right: 19%;
		bottom: 7%;
	}
}

/* small screen: tablet & pad */
@media (max-width: 991px) {
  .container {
      min-width: unset;
      max-width: unset;
  }
	.step-point{
		margin-left: -25px;
		margin-right: -25px;
	}
	.step-container img {
		width: 100%;
	}
	#top_wrapper, .banner_footer_right, .banner_footer_left {
		display: none !important;
	}
	.banner_footer {
		margin-bottom: 20px;
	}
	.multi_columns_container_5 > .multi_column {
		width: 100%;
		margin: 0;
	}
	.cookie-policy-popup-wrapper {
		width: 100%;
		height: 77px;
	}
	.cookie-policy-popup-content {
		width: 65%;
	}
	.cookie-policy-popup-content-text {
		text-align: center;
	}
	.cookie-policy-popup-content-text p {
		font-size: 10px;
	}
	.carousel-indicators,
	.cta h2 br {
		display: none;
	}
	.inner-box {
		padding-left: 20px;
		padding-right: 20px;
		box-shadow: 0 0 20px rgb(0 0 0 / 20%);
		-webkit-box-shadow: 0 0 20px rgb(0 0 0 / 20%);
	}
	#trust .trusted {
		font-size: 26px;
	}
	#header-section {
		padding-bottom: 3em;
	}
	#header-section h1 {
		font-size: 26px;
	}
	#header-section h1 small {
		font-size: 20px;
	}
	#header-section a {
		width: 100%;
	}
	.cd-partner {
		text-align: center;
		font-size: 13px;
		padding-top: 10px;
	}
	.cd-partner img {
		width: 115px;
		display: block;
		margin: 10px auto;
	}
	.flex-col-img{
		padding-bottom: 18px;
	}
	.cta {
		background-image: url(https://www.top4.com.au/images/top4new/bg-cta-mobile.png);
		padding-top: 270px;
	}
	.cta h2 {
		font-size: 26px;
	}
	li > h3.question {
		padding: 15px;
		font-size: 19px;
	}
	li > h3.question i {
		background: transparent;
		color: #ffd331;
		padding: 0;
	}
	.answer p {
		font-size: 16px;
	}
	.testi-box {
		border-radius: 30px;
	}
	.testi-box h4{
		margin-top: -100px;
		float: right;
		font-size: 16px;
		padding: 0;
		margin-left: 85px;
	}
	.testi-img img {
		width: 25%;
		height: 100%;
	}
	.testi-logo {
		width: 50%;
		position: absolute;
		top: 23px;
		right: 0;
	}
	#client .content {
		padding-left: 8%;
		padding-right: 8%;
	}
	#client .content p {
		padding: 15px 0 0;
	}
	#client h3 {
		padding-bottom: 0;
	}
	#client button {
		width: 100%;
	}
	.loading-between,.step:after{
		display: none;
	}
	#video .container {
		padding-bottom: 56.25%;
		height: 0;
		width: 100% !important;
		/*overflow: hidden;*/
	}
	#trust a.locale-id-links {
		margin: 14px 0 0 -108px;
	}
	#trust .trusts img {
		margin: 15px 0 -5px 5px;
	}
	blockquote {
		font-size: 13px;
		line-height: 1.4;
		padding: 20px 10px;
	}
}