/*@charset "utf-8";*/
/*	This file is made for CURRENT TEMPLATE


	01) ARLO BASE
	02) ARLO CONTENT
	03) ARLO ABOUT
	04) ARLO SERVICES = CERTIFICATES
	05) ARLO COUNTERBOX
	06) ARLO PORTFOLIO = PROJECT
	07) ARLO TESTIMONIALS
	08) ARLO NEWS = PROFEESIONAL EXPERIENCE
	09) ARLO ACADEMIC CURSUS = EDUCATION
	09) ARLO CONTACT
	10) ARLO TO TOP
	11) ARLO PARTICLE HOMEPAGE
	12) ARLO RIPPLE HOMEPAGE
	13) ARLO PORTFOLIO SINGLE
	14) ARLO MOBILE HEADER
    15) ARLO MEDIA QUERIES (FOR SMALL DEVICES)


/*---------------------------------------------------*/
/*	01) ARLO BASE
/*---------------------------------------------------*/

html {
	overflow-x: hidden;
	padding: 0px;
	margin: 0px
}
body{
	font-family: "Open Sans";
	font-size: 14px;
	line-height: 1.8;
	letter-spacing: 0.5px;
	word-wrap: break-word;
	font-weight: 400;
}
svg{
	fill: currentcolor;
	width: 25px;
	height: 25px;
}
img.svg{
	width: 25px;
	height: 25px;
}
.arlo_tm_wrapper_all,
.arlo_tm_section,
.arlo_tm_content{ 
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */ 
}
#ripple{
	position: relative;
	z-index: 0;
}
.arlo_tm_content{
	position: relative;
	z-index: 2;
}

::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color: #333;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color: #333;
   opacity:  1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
   color: #333;
   opacity:  1;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color: #333;
}
::-ms-input-placeholder { /* Microsoft Edge */
   color: #333;
}

::placeholder { /* Most modern browsers support this now. */
   color: #333;
}
.arlo_tm_preloader{
  position: fixed;
  background-color: #fff;
  z-index: 9999999;
  height: 100%;
  width: 100%;	
	
  -webkit-transition: .2s all ease;
  -o-transition: .2s all ease;
  transition: .2s all ease;
  -webkit-transition-delay: .5s;
  -o-transition-delay: .5s;
  transition-delay: .5s; }  
.arlo_tm_preloader .spinner_wrap{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	z-index: 33333;
}
.arlo_tm_preloader.loaded {
    opacity: 0;
    visibility: hidden;
}
.arlo_tm_preloader:before,
.arlo_tm_preloader:after{
    content: "";
    position: absolute;
    height: 50%;
    width: 100%;
    background-color: #041230;
	
    -webkit-transition: .7s all ease;
    -o-transition: .7s all ease;
    transition: .7s all ease;
}
.arlo_tm_preloader:before{
    top: 0;
    left: 0; 
}
.arlo_tm_preloader:after{
    bottom: 0;
	left: 0; 
}
.arlo_tm_preloader.loaded:before, 
.arlo_tm_preloader.loaded:after{height: 0%;}

/*---------------------------------------------------*/
/*	02) ARLO CONTENT
/*---------------------------------------------------*/

.arlo_tm_leftpart_wrap{
	width: 250px;
	position: fixed;
	top: 0px;
	bottom: 0px;
	left: 0px;
	background-color: #041230;
	z-index: 100;
	
	-webkit-transition: all .3s ease;
	   -moz-transition: all .3s ease;
	    -ms-transition: all .3s ease;
	     -o-transition: all .3s ease;
	        transition: all .3s ease;
	
}
.arlo_tm_leftpart_wrap.hide{left: -250px;}
.arlo_tm_leftpart_wrap.opened{left: -250px;}
.arlo_tm_leftpart_wrap .logo_wrap{
	background-color: #041230;
	padding: 50px 20px;
	width: 100%;
	float: left;
	text-align: center;
	margin-bottom: 50px;
	border-bottom: 1px solid rgba(255,255,255,.1);
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}


/* Left Part Menu Styles */
.arlo_tm_leftpart_wrap .menu_list_wrap .anchor_nav li {
    position: relative;
    list-style: none;
    margin: 0;
    padding: 0;
}

.arlo_tm_leftpart_wrap .menu_list_wrap .anchor_nav li a {
    display: flex;
    align-items: center;
    padding: 10px 15px;
    color: #fff; /* Adjust color as needed */
    text-decoration: none;
    transition: color 0.3s ease;
}

.arlo_tm_leftpart_wrap .menu_list_wrap .anchor_nav li a i {
    margin-right: 10px; /* Space between icon and text */
    transition: transform 0.3s ease;
}

.arlo_tm_leftpart_wrap .menu_list_wrap .anchor_nav li a:hover {
    color: #ca75ff; /* Adjust hover color as needed */
}

.arlo_tm_leftpart_wrap .menu_list_wrap .anchor_nav li a:hover i {
    transform: scale(1.2); /* Slightly enlarge the icon on hover */
}



.arlo_tm_leftpart_wrap .menu_list_wrap{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	padding: 0px 20px 0px 60px;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}
.arlo_tm_leftpart_wrap .menu_list_wrap ul{
	margin: 0px;
	list-style-type: none;
}
.arlo_tm_leftpart_wrap .menu_list_wrap ul li{margin:0px;}
.arlo_tm_leftpart_wrap .menu_list_wrap ul li:last-child{margin-bottom: 0px;}
.arlo_tm_leftpart_wrap .menu_list_wrap ul li a{
	text-decoration: none;
	color: #fff;
	font-family: "Montserrat";
	font-size: 14px;
	font-weight: 500;
	text-transform: uppercase;
	position: relative;
	display: inline-block;
	padding-bottom: 19px;
	
	-webkit-transition: all .3s ease;
	   -moz-transition: all .3s ease;
	    -ms-transition: all .3s ease;
	     -o-transition: all .3s ease;
	        transition: all .3s ease;
}

.arlo_tm_leftpart_wrap .menu_list_wrap ul li a:hover{
	color: #ca75ff;
	text-shadow: 0 0 25px rgba(202, 117, 255, 0.8), 0 0 20px rgba(202, 117, 255, 0.6); /* Glowing effect */
}
.arlo_tm_leftpart_wrap .menu_list_wrap ul li a:hover:before{width: 35px;}
.arlo_tm_leftpart_wrap .leftpart_bottom{
	position: absolute;
	left: 60px;
	bottom: 38px;
}
.arlo_tm_leftpart_wrap .leftpart_bottom .social_wrap{
	width: 100%;
	height: auto;
	float: left;
	position: relative;
	left: -5px;
	margin-bottom: 10px;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}
.arlo_tm_leftpart_wrap .leftpart_bottom .social_wrap ul{
	margin: 0px;
	list-style-type: none;
}
.arlo_tm_leftpart_wrap .leftpart_bottom .social_wrap ul li{
	margin: 0px 10px 0px 0px;
	display: inline-block;
}
.arlo_tm_leftpart_wrap .leftpart_bottom .social_wrap ul li:last-child{margin-right: 0px;}
.arlo_tm_leftpart_wrap .leftpart_bottom .social_wrap ul li a{
	text-decoration: none;
	color: #fff;
	
	-webkit-transition: all .3s ease;
	   -moz-transition: all .3s ease;
	    -ms-transition: all .3s ease;
	     -o-transition: all .3s ease;
	        transition: all .3s ease;
}
.arlo_tm_leftpart_wrap .leftpart_bottom .social_wrap ul li a:hover{color: #ca75ff;}
.arlo_tm_leftpart_wrap .arlo_tm_resize{
	position: absolute;
	right: 0px;
	bottom: 20%;
	width: 30px;
	height: 30px;
	text-align: center;
	line-height: 30px;
	background-color: #ca75ff;
	display: inline-block;
	text-decoration: none;
	z-index: 250;
	
	-webkit-transition: all .3s ease;
	   -moz-transition: all .3s ease;
	    -ms-transition: all .3s ease;
	     -o-transition: all .3s ease;
	        transition: all .3s ease;
}
.arlo_tm_leftpart_wrap .arlo_tm_resize.opened{right: -30px;}
.arlo_tm_leftpart_wrap .arlo_tm_resize i{
	color: #fff;
	transform: rotate(0deg);
	position: absolute;
	left: 6px;
	
	-webkit-transition: all .3s ease;
	   -moz-transition: all .3s ease;
	    -ms-transition: all .3s ease;
	     -o-transition: all .3s ease;
	        transition: all .3s ease;
}
.arlo_tm_leftpart_wrap .arlo_tm_resize i.opened{transform: rotate(-180deg);}
.arlo_tm_rightpart{
	width: 100%;
	height: auto;
	float: left;
	padding-left: 250px;
	
	-webkit-transition: all .3s ease;
	   -moz-transition: all .3s ease;
	    -ms-transition: all .3s ease;
	     -o-transition: all .3s ease;
	        transition: all .3s ease;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}
.arlo_tm_rightpart.full{padding-left: 0px;}
.arlo_tm_rightpart.opened{padding-left: 0px;}
.arlo_tm_rightpart .rightpart_inner{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}
.arlo_tm_hero_header_wrap{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	margin-bottom: 100px;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}
.arlo_tm_universal_box_wrap{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	position: relative;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}
.arlo_tm_universal_box_wrap .bg_wrap{
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	z-index: 10;
}
.arlo_tm_universal_box_wrap .overlay_image{
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	z-index: 15;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}
.arlo_tm_universal_box_wrap .overlay_video{
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	z-index: 15;
	overflow: hidden;
}
.arlo_tm_universal_box_wrap .overlay_video video{
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	object-fit: cover;
}
.arlo_tm_universal_box_wrap .overlay_color{
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	z-index: 20;
}
.arlo_tm_universal_box_wrap .content{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	position: relative;
	z-index: 25;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}
.arlo_tm_universal_box_wrap .overlay_image.hero{background-image: url(../img/hero/purple.gif);}
.arlo_tm_universal_box_wrap .overlay_color.hero{background-color: rgba(7,23,55,.8);}
.arlo_tm_universal_box_wrap .content.hero{height: 100vh;}
.arlo_tm_hero_header_wrap .inner_content{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	z-index: 2;
	text-align: center;
	width: 100%;
	padding: 0px 20px;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}
.arlo_tm_hero_header_wrap .image_wrap{
	width: 250px;
	height: 250px;
	display: inline-block;
	margin-bottom: 38px;
}
.arlo_tm_hero_header_wrap .image_wrap img{
	border-radius: 100%;
	border: 1px solid rgba(255, 255, 255);
	box-shadow: 0 0 25px rgb(255, 255, 255), 0 0 20px rgba(0, 0, 0, 0.5);
	transition: transform 0.3s ease;  /* Smooth transition effect */
}

.arlo_tm_hero_header_wrap .image_wrap img:hover {
    transform: translateY(-5px);  /* Moves the image up by 5 pixels */
}

.arlo_tm_hero_header_wrap .name_holder h3{
	font-family: "Montserrat";
	text-transform: uppercase;
	color: #fff;
	font-size: 50px;
	font-weight: 300;
}
.arlo_tm_hero_header_wrap .name_holder h3 span{
	font-weight: 500;
	color: #ca75ff;
}
.arlo_tm_hero_header_wrap .text_typing{
	width: 100%;
	height: auto;
	float: left;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}
.arlo_tm_hero_header_wrap .text_typing p{
	color: #fff;
	font-size: 24px;
	font-family: "Montserrat";
}
.arlo_tm_animation_text_word{
	font-weight: 600;
	line-height: 1;
	font-family: "Montserrat";
}
.arlo_tm_about_wrap .arlo_tm_animation_text_word{color: #ca75ff;}
.arlo_tm_arrow_wrap{
	position: absolute;
	left: 50%;
	bottom: 5%;
	transform: translateX(-50%);
	margin-left: -21px;
	z-index: 55;
}
.arlo_tm_arrow_wrap.bounce {
  -webkit-animation: bounce 2s infinite;
  animation: bounce 2s infinite; }

@-webkit-keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    -webkit-transform: translateY(0);
    transform: translateY(0); }
  40% {
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px); }
  60% {
    -webkit-transform: translateY(-15px);
    transform: translateY(-15px); } }

@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    -webkit-transform: translateY(0);
    transform: translateY(0); }
  40% {
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px); }
  60% {
    -webkit-transform: translateY(-15px);
    transform: translateY(-15px); } }
.arlo_tm_arrow_wrap a{
	text-decoration: none;
	color: #fff;
	font-size: 30px;
}

/*---------------------------------------------------*/
/*	03) ARLO ABOUT
/*---------------------------------------------------*/

.arlo_tm_title_holder{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	text-align: left;
	padding-bottom: 100px;
	position: relative;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}
.arlo_tm_title_holder.contact{padding-bottom: 93px;}
.arlo_tm_title_holder:before{
	position: absolute;
	content: "";
	width: 6px;
	height: 72px;
	background-color: #ca75ff;
	top: 2px;
}
.arlo_tm_title_holder h3{
	font-size: 50px;
	text-transform: uppercase;
	font-weight: 600;
	letter-spacing: -.5px;
	padding-left: 25px;
	line-height: 1;
/*	font-style: italic;*/
}
.arlo_tm_title_holder span{
	font-size: 16px;
	font-family: "Montserrat";
	padding-left: 25px;
}
.arlo_tm_about_wrapper_all{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	background-color: #fff;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}

.arlo_tm_main_title_holder{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	text-align: left;
	margin-bottom: 120px;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}
.arlo_tm_main_title_holder.about{
	text-align: left;
	margin-bottom: 0px;
	padding: 0px;
}
.arlo_tm_main_title_holder h3{
	font-weight: 900;
	font-family: "Montserrat";
	color: #041230;
	font-size: 30px;
	line-height: 1;
}
.arlo_tm_main_title_holder h3 span{position: relative;}
.arlo_tm_main_title_holder h3 span:before{
    position: absolute;
	content: "";
	width: 50px;
	height: 4px;
	background-color: #041230;
	letter-spacing: 0px;
	bottom: -10px;
}
.arlo_tm_about_wrapper_all{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	background-color: #fff;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}
.arlo_tm_main_title_holder{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	text-align: left;
	margin-bottom: 120px;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}
.arlo_tm_main_title_holder.about{
	text-align: left;
	margin-bottom: 0px;
	padding: 0px;
}
.arlo_tm_main_title_holder h3{
	font-weight: 900;
	font-family: "Montserrat";
	color: #041230;
	font-size: 30px;
	line-height: 1;
}
.arlo_tm_main_title_holder h3 span{position: relative;}
.arlo_tm_main_title_holder h3 span:before{
    position: absolute;
	content: "";
	width: 50px;
	height: 4px;
	background-color: #041230;
	letter-spacing: 0px;
	bottom: -10px;
}
.arlo_tm_about_wrap{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	padding-bottom: 122px;
	position: relative;
	margin-top: -6px;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */ 
}
.arlo_tm_about_wrap .author_wrap{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	position: relative;
	display: flex;
	align-items: center;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */ 
}
.arlo_tm_about_wrap .leftbox{
	width: 35%;
	float: left;
	height: auto;
	padding-right: 40px;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
	
}
.arlo_tm_about_wrap .leftbox .about_image_wrap{position: relative;}
.arlo_tm_about_wrap .leftbox .about_image_wrap .image{
	position: absolute;
	z-index: 2;
}
.arlo_tm_about_wrap .leftbox .about_image_wrap .image .inner{
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}
.arlo_tm_about_wrap .leftbox .about_image_wrap .border .inner{
	position: absolute;
	top: 25px !important;
	bottom: -25px !important;
	left: 25px !important;
	right: -25px !important;
	border: 10px solid #e3e2e2;
}
.arlo_tm_about_wrap .leftbox .about_image_wrap img{opacity: 0;}
.arlo_tm_about_wrap .rightbox{
	width: 65%;
	float: right;
	padding: 0px 0px 0px 65px;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */ 
}
.arlo_tm_about_wrap .subtitle{
	width: 100%;
	float: left;
	margin-bottom: 20px;
}
.arlo_tm_about_wrap .subtitle p{
	font-family: "Montserrat";
	color: #333;
	font-size: 15px;
	font-weight: 600;
}
.arlo_tm_about_wrap .definition{margin-bottom: 15px;}
.arlo_tm_about_wrap .definition p{color: #333;}
.arlo_tm_about_wrap .definition p strong{color: #ca75ff;}

.arlo_tm_about_wrap .about_short_contact_wrap{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	margin-bottom: 13px;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}
.arlo_tm_about_wrap .arlo_tm_main_title_holder{margin-bottom: 40px;}
.arlo_tm_about_wrap .about_short_contact_wrap ul{
	margin: 0px;
	list-style-type: none;
}
.arlo_tm_about_wrap .about_short_contact_wrap ul li{
	margin: 0px 0px 10px 0px;
	width: 50%;
	float: left;
}
.arlo_tm_about_wrap .about_short_contact_wrap ul li:nth-of-type(2n){clear: right;}
.about_short_contact_wrap ul li label{
	font-family: "Montserrat";
	font-weight: 700;
	font-size: 13px;
	color: #000;
	min-width: 85px;
	display: inline-block;
}
.arlo_tm_about_wrap .about_short_contact_wrap ul li a{
	text-decoration: none;
	color: #000;
    position: relative;
	
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -ms-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
}
.arlo_tm_about_wrap .about_short_contact_wrap ul li a:hover{color: #BD0A0D;}
.arlo_tm_about_wrap .buttons_wrap{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}
.arlo_tm_about_wrap .buttons_wrap ul{
	margin: 0px;
	list-style-type: none;
}
.arlo_tm_about_wrap .buttons_wrap ul li{
	margin: 0px 30px 10px 0px;
	float: left;
}
.arlo_tm_about_wrap .buttons_wrap ul li:last-child{margin-right: 0px;}
.arlo_tm_about_wrap .buttons_wrap ul li a span{
	position: relative;
	z-index: 2;
}
.arlo_tm_about_wrap .buttons_wrap ul li a{
	text-decoration: none;
    color: #fff;
    background-color: #041230;
    font-weight: 500;
    font-family: "Montserrat";
    padding: 8px 12px;
    border-radius: 30px;
    display: inline-block;
    position: relative;
    overflow: hidden;;
}
.arlo_tm_about_wrap .buttons_wrap ul li a:before{
	position: absolute;
    content: "";
    top: 0px;
    height: 100%;
    left: -25%;
    width: 0%;
    background-color: #ca75ff ;
    transform: skew(50deg);
    transition-duration: .6s;
    z-index: 1;
}
.arlo_tm_about_wrap .buttons_wrap ul li a:hover:before{width: 180%;}
.arlo_tm_skills_wrap,
.arlo_tm_skills_wrap .inner_wrap{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}
.arlo_tm_skills_wrap{
	background-color: #f6f7fd;
	padding: 90px 0px;
	margin-bottom: 100px;
}
.arlo_tm_skills_wrap .inner_wrap{display: flex;}
.arlo_tm_skills_wrap .leftbox{
	width: 35%;
	height: auto;
	clear: both;
	float: left;
	padding-right:0px;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}
.arlo_tm_skills_wrap .rightbox{
	width: 65%;
	height: auto;
	clear: both;
	float: right;
	padding-left: 65px;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}
.progress_bar_wrap_total{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	margin-bottom: 10px;
	position: relative;
	margin-top: -4px;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}
.arlo_tm_progress_wrap[data-size="big"] .arlo_tm_progress .arlo_tm_bar_bg{height:40px;}
.arlo_tm_progress_wrap[data-size="small"] .arlo_tm_progress .arlo_tm_bar_bg{height:5px;}

.arlo_tm_progress_wrap[data-round="a"] .arlo_tm_progress .arlo_tm_bar_bg,
.arlo_tm_progress_wrap[data-round="a"] .arlo_tm_progress .arlo_tm_bar{
	-webkit-border-radius:2px;
	-moz-border-radius:2px;
	border-radius:2px;
}
.arlo_tm_progress_wrap[data-round="b"] .arlo_tm_progress .arlo_tm_bar_bg,
.arlo_tm_progress_wrap[data-round="b"] .arlo_tm_progress .arlo_tm_bar{
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
}
.arlo_tm_progress_wrap[data-round="c"] .arlo_tm_progress .arlo_tm_bar_bg,
.arlo_tm_progress_wrap[data-round="c"] .arlo_tm_progress .arlo_tm_bar{
	-webkit-border-radius:50px;
	-moz-border-radius:50px;
	border-radius:50px;
}
.arlo_tm_progress{
	width:100%;
	margin-bottom:16px;
}
.arlo_tm_progress:last-child{margin-bottom: 0px;}
.arlo_tm_progress > span{
	margin:0px 0px 3px 0px;
	width:100%;
	display:block;
	text-align:left;
}
.arlo_tm_progress span.label{
	font-size:13px;
	font-weight:700;
	color:#000;
	font-family: "Montserrat";
}
.arlo_tm_progress span.label .experience{font-size: 12px;font-weight: 600;}
.arlo_tm_progress span.number{
	float:right;
	font-size:13px;
	color:#000;
	font-weight: 700;
	font-family: "Montserrat";
}
.arlo_tm_progress .arlo_tm_bar_bg{
	background:rgba(0,0,0,.1);
	width:100%;
	min-width:100%;
	position:relative;
	height:20px;
}
.arlo_tm_progress .arlo_tm_bar_bg .arlo_tm_bar_wrap{
	width:0px;
	height:100%;
}
.arlo_tm_progress .arlo_tm_bar_bg .arlo_tm_bar_wrap.open{
	-webkit-animation: arlo_tm_expand 3s cubic-bezier(0.165, 0.840, 0.440, 1.000);  /* Safari 4+ */
	-moz-animation:    arlo_tm_expand 3s cubic-bezier(0.165, 0.840, 0.440, 1.000);  /* Fx 5+ */
	animation:         arlo_tm_expand 3s cubic-bezier(0.165, 0.840, 0.440, 1.000);  /* IE 10+ */
	width:100%;	
}
.arlo_tm_progress .arlo_tm_bar_bg .arlo_tm_bar{
	height:100%;
	background:#333;
	width:0px;
	overflow:hidden;
}
.arlo_tm_progress_wrap[data-strip="on"] .arlo_tm_progress .arlo_tm_bar{
	background-image: linear-gradient(-45deg, rgba(255, 255, 255, 1) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, 1) 75%, transparent 75%, transparent);
	
	-webkit-animation: arlo_tm_bar_move 4s linear infinite;
	-moz-animation: arlo_tm_bar_move 4s linear infinite;
	animation: arlo_tm_bar_move 4s linear infinite;
	background-size: 50px 50px;
}
@-webkit-keyframes arlo_tm_bar_move {0%{background-position: 0 0;} 100% {background-position: 50px 50px;}}
@-moz-keyframes arlo_tm_bar_move {0%{background-position: 0 0;} 100% {background-position: 50px 50px;}}
@keyframes arlo_tm_bar_move {0%{background-position: 0 0;} 100% {background-position: 50px 50px;}}

/*expand width animation*/
@-webkit-keyframes arlo_tm_expand {0%{ width:0%; } 100%{ width:100%; }}
@-moz-keyframes arlo_tm_expand {0%{ width:0%; } 100%{ width:100%; }}
@keyframes arlo_tm_expand {0%{ width:0%; } 100%{ width:100%; }}

.arlo_tm_mini_title_holder{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}
.arlo_tm_mini_title_holder h4{
	line-height: 1;
	margin-bottom: 12px;
	background-color:#fff;
	text-align: left;
	font-size: 18px;
    font-weight: 600;

}


.arlo_tm_mini_title_holder.contact h4{margin-bottom:30px;}

/*---------------------------------------------------*/
/*	04) ARLO SERVICES // CERTIFICATES 
/*---------------------------------------------------*/

.arlo_tm_services_wrap {
    width: 100%;
    height: auto;
    clear: both;
    float: left;
    background-color: #fff;
    margin-bottom: 70px;
    text-align: left;
    
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
       -moz-box-sizing: border-box; /* Firefox, other Gecko */
            box-sizing: border-box; /* Opera/IE 8+ */ 
}
.arlo_tm_services_wrap .arlo_tm_title_holder_wrap {
    margin-bottom: 93px;
}
.arlo_tm_services_wrap .list_wrap {
    width: 100%;
    height: auto;
    clear: both;
    float: left;
    overflow-x: auto; /* Enable horizontal scrolling */
	display: flex;
    flex-wrap: wrap;
    gap: 10px;
    
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
       -moz-box-sizing: border-box; /* Firefox, other Gecko */
            box-sizing: border-box; /* Opera/IE 8+ */ 
}
.arlo_tm_services_wrap .list_wrap ul {
    margin: 0px;
    list-style-type: none;
    display: flex; /* Use flexbox for horizontal layout */
    flex-wrap: wrap;
    width: 100%;
    padding: 0;
    list-style: none;
}
.arlo_tm_services_wrap .list_wrap ul li {
    margin: 0px 0px 30px 0px;
    width: 20%; /* 5 boxes with equal width */
    padding-left: 30px;
	width: calc(25% - 10px); /* Four columns with a gap adjustment */
    box-sizing: border-box;
    margin-bottom: 20px;
    
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
       -moz-box-sizing: border-box; /* Firefox, other Gecko */
            box-sizing: border-box; /* Opera/IE 8+ */ 
}
.arlo_tm_services_wrap .list_wrap ul li .inner {
    width: 100%;
    height: auto;
    clear: both;
    float: left;
    position: relative;
    box-shadow: 0 0 20px rgba(0,0,0,.1);
    padding: 40px 40px 33px 40px;
    top: 0px;
	height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
	font-size: 12px;

    
    -webkit-transition: all .3s ease;
       -moz-transition: all .3s ease;
        -ms-transition: all .3s ease;
         -o-transition: all .3s ease;
            transition: all .3s ease;
}

.arlo_tm_services_wrap .list_wrap ul li .inner:hover {
    top: -5px;
    cursor: pointer; /* Indicate clickable */
	text-decoration: underline;
}
.arlo_tm_services_wrap .list_wrap ul li .icon {
    margin-bottom: 18px;
}
.arlo_tm_services_wrap .list_wrap ul li .icon .svg {
    width: 50px;
    height: 50px;
    color: #ca75ff;
}
.arlo_tm_services_wrap .list_wrap ul li .title_service {
    margin-bottom: 10px;
}	
  
.arlo_tm_services_wrap .list_wrap ul li .title_service h3 {
    font-family: "Montserrat";
    font-size: 12px;
    font-weight: 600;
    color: #000000;
    line-height: 1;
}


/* Responsive styles */

@media only screen and (max-width: 768px) {
    .arlo_tm_services_wrap .list_wrap ul li {
        width: calc(50% - 10px); /* Two items per row for tablet devices */
    }
}

@media only screen and (max-width: 480px) {
    .arlo_tm_services_wrap .list_wrap ul li {
		width: calc(33.33% - 10px); /* Three items per row for mobile devices */

    }
	.arlo_tm_services_wrap .list_wrap ul li .title_service h3 {
        font-size: 12px; /* Adjust the font size as needed */
    }

    .arlo_tm_services_wrap .list_wrap ul li .text {
        display: none; /* Hide the description on small screens */
    }
}
/*---------------------------------------------------*/
/*	05) ARLO COUNTERBOX
/*---------------------------------------------------*/

.arlo_tm_counter_wrap{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}
.arlo_tm_counter_wrap{overflow: hidden;}
.arlo_tm_counter_list{
	list-style-type:none;
	width:100%;
	margin: 0px;
	
	-webkit-perspective: 500px;
	-moz-perspective: 500px;
	perspective: 500px;
}
.arlo_tm_counter_list li{
	width:25%;
	float:left;
	text-align:center;
	margin: 0px;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}
.arlo_tm_counter_list li .inner{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	position: relative;
	padding: 90px 15px 93px 15px;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}
.arlo_tm_counter_list li .inner:before{
	position: absolute;
	content: "";
	width: 1px;
	top: 35px;
	bottom: 35px;
	background-color: #d1d7db;
	left: 100%;
}
.arlo_tm_counter_list li:nth-child(4) .inner:before{display: none;}
.arlo_tm_counter_list li h3{
	font-family: "Montserrat";
	color: #181a2f;
	margin-bottom: 10px;
}
.arlo_tm_counter_list li h3 > span{
	font-size: 40px;
	font-weight: 700;
}
.arlo_tm_counter_list li .inner > span{
	color:#666;
	font-family: "Open Sans";
	font-size: 12px;
	display: block;
	font-weight: 600;
}

/*---------------------------------------------------*/
/*	06) ARLO PORTFOLIO
/*---------------------------------------------------*/


.arlo_tm_title_holder.portfolio {
    padding-bottom: 90px;
}

.arlo_tm_portfolio_wrapper_all {
    width: 100%;
    height: auto;
    clear: both;
    padding-bottom: 70px;
    background-color: #fff;
    box-sizing: border-box; 
}

.arlo_tm_portfolio_wrapper_all .arlo_tm_button {
    text-align: center;
}

.arlo_tm_portfolio_wrap {
    width: 100%;
    height: auto;
    clear: both;
    box-sizing: border-box; 
}

.arlo_tm_portfolio_filter {
    width: 100%;
    height: auto;
    text-align: left;
    list-style-type: none;
    margin: 0 0 13px 0;
    display: inline-block;
    box-sizing: border-box; 
}

.arlo_tm_portfolio_filter li {
    display: inline-block;
    margin: 0 40px 0 0;
}

.arlo_tm_portfolio_filter li:last-child {
    margin-right: 0;
}

.arlo_tm_portfolio_filter li a {
    text-decoration: none;
    font-size: 14px;
    font-weight: 700;
    color: #000;
    display: inline-block;
    margin-bottom: 10px;
    position: relative;
    transition: all .1s ease;
}

.arlo_tm_portfolio_filter li a.current {
    color: #c817df;
}

/* PORTFOLIO LIST */


.arlo_tm_portfolio_list {
    list-style-type: none;
	margin: 0; 
    padding: 0; 
    display: flex; /* Use flexbox for layout */
    flex-wrap: wrap; /* Allow items to wrap */
}

.arlo_tm_portfolio_list > li {
	flex: 0 1 calc(20% - 20px); /* Set basis for 3 images per row, considering margins */
    margin: 10px; /* Some margin for spacing */
    position: relative;
    box-sizing: border-box; 
}
  

.arlo_tm_portfolio_list li img {
    position: relative;
    width: 100%;
    height: auto;
    display: block;
    border-radius: 15px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); /* Light shadow */
    background-color: rgba(16, 16, 209, 0.5);
}

.arlo_tm_portfolio_list li .overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(21, 2, 230, 0.7);
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    padding: 15px; 
    transition: opacity 0.3s ease; 
}

.arlo_tm_portfolio_list li:hover img {
    opacity: 0.3; 
}

.arlo_tm_portfolio_list li:hover .overlay {
    opacity: 1; 
}

.entry {
    position: relative;
}

.arlo_tm_portfolio_image_main {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    border-radius: 15px;
}

/* Responsive Adjustments */

@media (max-width: 800px) {
	.arlo_tm_portfolio_list > li {
        flex: 0 0 calc(33.33% - 20px); /* Maintain 3 columns on mobile */
		margin: 10px; /* Margin for spacing */
		position: relative;
		box-sizing: border-box; 
    }
    
    .arlo_tm_portfolio_filter {
        text-align: center; /* Center filters on mobile */
    }
    
    .arlo_tm_portfolio_filter li {
        margin: 0 15px; /* Adjust margin for smaller screens */
    }
}

/*---------------------------------------------------*/
/*	07) ARLO TESTIMONIALS
/*---------------------------------------------------*/

.arlo_tm_testimonials_wrapper_all{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */ 
}
.arlo_tm_testimonial_wrap{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */ 
}
.arlo_tm_testimonial_wrap .carousel_wrap{
	width: 100%;
	max-width: 730px;
	margin: 0px auto;
	height: auto;
	clear: both;
	text-align: center;
	cursor: e-resize;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */ 
}
.arlo_tm_testimonial_wrap .carousel_wrap ul{
	margin: 0px;
	list-style-type: none;
}
.arlo_tm_testimonial_wrap .carousel_wrap ul li{margin: 0px;}
.arlo_tm_testimonial_wrap .carousel_wrap ul li .inner{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	position: relative;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */ 
}
.arlo_tm_testimonial_wrap .quotebox_wrap{
	clear: both;
	margin-bottom: 22px;
}
.arlo_tm_testimonial_wrap .quotebox_wrap i{
	color: #ca75ff;
	font-size: 35px;
}
.arlo_tm_testimonial_wrap .definitions_wrap{
	clear: both;
	margin-bottom: 32px;
}
.arlo_tm_testimonial_wrap .definitions_wrap p{
	color: #fff;
	font-size: 27px;
	font-family: "Montserrat";
	font-weight: 600;
	line-height: 1.4;
}
.arlo_tm_testimonial_wrap .name_holder p{
	color: #fff;
	font-size: 18px;
	font-family: "Montserrat";
}

.arlo_tm_universal_box_wrap{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	position: relative;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}
.arlo_tm_universal_box_wrap .bg_wrap{
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	z-index: 10;
}
.arlo_tm_universal_box_wrap .overlay_image{
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	z-index: 15;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}
.arlo_tm_universal_box_wrap .overlay_video{
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	z-index: 15;
	overflow: hidden;
}
.arlo_tm_universal_box_wrap .overlay_video video{
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	object-fit: cover;
}
.arlo_tm_universal_box_wrap .overlay_color{
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	z-index: 20;
}
.arlo_tm_universal_box_wrap .content{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	position: relative;
	z-index: 25;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}
.arlo_tm_universal_box_wrap .overlay_image.testimonial{background-image: url(../img/hero/3.jpg);}
.arlo_tm_universal_box_wrap .overlay_color.testimonial{background-color: rgba(7,23,55,.8);}
.arlo_tm_universal_box_wrap .content.testimonial{padding: 82px 0px 90px 0px;}




/*---------------------------------------------------*/
/*	08) ARLO NEWS - PROFESSIONAL EXPERIENCES
/*---------------------------------------------------*/

.arlo_tm_list_wrap {
    width: 100%;
    height: auto;
    clear: both;
    display: flex;
    flex-wrap: wrap;
    box-sizing: border-box;
}

.arlo_tm_list_wrap > ul.total {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    padding: 0;
    margin: 0;
    list-style-type: none;
    width: 100%;
}

.arlo_tm_list_wrap > ul.total > li {
    width: 100%;
    margin: 5px;
    display: flex;
    padding: 10px;
    box-sizing: border-box;
}

.arlo_tm_list_wrap > ul.total > li .inner_list {
    display: flex;
    background-color: #fff;
    border-radius: 10px;
    width: 100%;
    box-sizing: border-box;
    overflow: hidden;
}




.arlo_tm_news_wrap {
    width: 100%;
    overflow-y: auto; /* Enables vertical scrolling if content exceeds max-height */
    float: left;
    padding-top: 93px;
    padding-bottom: 5px;
    background-color: #f6f7fd;
    margin-bottom: 5px;
    
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
       -moz-box-sizing: border-box; /* Firefox, other Gecko */
            box-sizing: border-box; /* Opera/IE 8+ */ 
}

/* IMAGE INSIDE  */
.arlo_tm_news_wrap .image_wrap {
    width: 30%; /* Set a width for the image container */
	background-size: cover;
    background-position: center;
    height: auto;
    box-sizing: border-box;
  
}



.arlo_tm_news_wrap .definitions_wrap { padding: 10px 10px 10px 10px; }
.arlo_tm_news_wrap .image_wrap { position: relative; }
.arlo_tm_news_wrap .image_wrap .big { display: none; }
.arlo_tm_news_wrap .image_wrap .small { display: block; }
.arlo_tm_news_wrap .news_image {
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
.arlo_tm_news_wrap .date_wrap { margin-bottom: 5px; }
.arlo_tm_news_wrap .date_wrap p {
    color: #333;
    font-family: "Montserrat";
    font-weight: 500;
	font-size:12px;
}
.arlo_tm_news_wrap .full_def { display: none; }
.arlo_tm_news_wrap .date_wrap p a {
    color: #000;
    text-decoration: none;
    text-transform: uppercase;
    position: relative;
    margin-left: 13px;
    
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -ms-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
}
.arlo_tm_news_wrap .date_wrap p a:hover { color: #041230; }
.arlo_tm_news_wrap .date_wrap p a:after {
    position: absolute;
    content: "";
    width: 10px;
    height: 1px;
    background-color: #333;
    top: 50%;
    right: 100%;
    margin-right: 8px;
}

/* Main title with the job + company */
.arlo_tm_news_wrap .title_holder { margin-bottom: 18px; }

.arlo_tm_news_wrap .title_holder h3 a {
    text-decoration: none;
    color: #041230;
    font-size: 14px;
    display: block;
    
    -webkit-transition: all .3s ease;
       -moz-transition: all .3s ease;
        -ms-transition: all .3s ease;
         -o-transition: all .3s ease;
            transition: all .3s ease;
		}
.arlo_tm_news_wrap .title_holder h3 a:hover{color: #ca75ff;}
.arlo_tm_news_wrap .definition{margin-bottom: 15px;}
.arlo_tm_news_wrap .definition p{color: #333;}


.arlo_tm_news_wrap .read_more a:before{
	position: absolute;
    content: "";
    top: 0px;
    height: 100%;
    left: -25%;
    width: 0%;
    background-color: #ca75ff;
    transform: skew(50deg);
    transition-duration: .6s;
    z-index: 1;
}
.arlo_tm_news_wrap .read_more a:hover:before{width: 170%;}
.arlo_tm_news_wrap .read_more a span{
	position: relative;
	z-index: 2;
}

/* READ MORE */
.arlo_tm_news_wrap .definitions_wrap {
    width: 80%; /* Remaining width for text content */
    padding: 20px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column; /* Stack button and text */
    justify-content: flex-start;
}

.arlo_tm_news_wrap .read_more {
    margin-bottom: 5px; /* Space between button and text */
}

.arlo_tm_news_wrap .read_more a {
    text-decoration: none;
    color: #fff;
    background-color: #041230;
    font-weight: 300;
    font-family: "Montserrat";
    padding: 5px 5px;
    border-radius: 30px;
    display: inline-block;
    position: relative;
    overflow: hidden;
}


/* POP-UP */
.arlo_tm_popup_share_wrap{display: none;}
#arlo_tm_popup_blog{
	opacity: 0;
	visibility: hidden;
	
	width: 100%;
	height: 100vh;
	position: fixed;
	background-color: rgba(255,255,255,1);
	padding: 5px 0px;	
	z-index: 99999999;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
	
	-webkit-transition: all .2s ease;
	   -moz-transition: all .2s ease;
	    -ms-transition: all .2s ease;
	     -o-transition: all .2s ease;
	        transition: all .2s ease;
}
#arlo_tm_popup_blog.opened{
	opacity: 1;
	visibility: visible;
}
#arlo_tm_popup_blog .definitions_wrap{
	width: 100%;
	float: left;
}
#arlo_tm_popup_blog .full_def{
	display: block;
	margin-bottom: 20px;
	width: 100%;
	float: left;
}
#arlo_tm_popup_blog .full_def p{display: inline-block;}
#arlo_tm_popup_blog .definition{display: none;}
#arlo_tm_popup_blog .inner_popup{
	width: 100%;
	float: left;
	clear: both;
	position: relative;
}
#arlo_tm_popup_blog .date_wrap p{
	color: #333;
    font-family: "Montserrat";
    font-weight: 600;
}
#arlo_tm_popup_blog .date_wrap p a{
	color: #333;
    text-decoration: none;
    text-transform: uppercase;
    position: relative;
    margin-left: 23px;
	
	-webkit-transition: all .3s ease;
	   -moz-transition: all .3s ease;
	    -ms-transition: all .3s ease;
	     -o-transition: all .3s ease;
	        transition: all .3s ease;
}
#arlo_tm_popup_blog .date_wrap p a:hover{color: #BD0A0D;}
#arlo_tm_popup_blog .image_wrap{
	margin-bottom: 45px;
	position: relative;
	width: 100%;
	float: left;
}
#arlo_tm_popup_blog .image_wrap .big{
	display: block;
	min-height: 250px;
}
#arlo_tm_popup_blog .image_wrap .small{display: none;}
#arlo_tm_popup_blog .image_wrap .news_image{
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}
#arlo_tm_popup_blog .date_wrap{
	margin-bottom: 16px;
	width: 100%;
	float: left;
}
#arlo_tm_popup_blog .date_wrap p a:before{
	position: absolute;
    content: "";
    width: 10px;
    height: 1px;
    background-color: #333;
    top: 50%;
    right: 100%;
    margin-right: 8px;
}
#arlo_tm_popup_blog .title_holder{
	margin-bottom: 18px;
	width: 100%;
	float: left;
}
#arlo_tm_popup_blog .title_holder h3{
    line-height: 1.4;
    font-weight: 600;
    font-family: "Montserrat";
}
#arlo_tm_popup_blog .title_holder h3 a{
    text-decoration: none;
    color: #000;
    font-size: 22px;
    display: block;
}
#arlo_tm_popup_blog .definition p{color: #333;}
#arlo_tm_popup_blog .read_more{display: none;}
#arlo_tm_popup_blog .arlo_tm_popup_share_wrap{
	display: block;
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	padding-bottom: 5px;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}


#arlo_tm_popup_blog .arlo_tm_popup_share_wrap ul{
	margin: 0px;
	list-style-type: none;
}
#arlo_tm_popup_blog .arlo_tm_popup_share_wrap ul li{
	display: inline-block;
	margin: 0px 15px 0px 0px;
}
#arlo_tm_popup_blog .arlo_tm_popup_share_wrap ul li a{
	text-decoration: none;
    color: #000;
    font-size: 15px;
    position: relative;
    font-family: "Montserrat";
    font-weight: 600;
	
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -ms-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
}
#arlo_tm_popup_blog .arlo_tm_popup_share_wrap ul li a:hover{color: #BD0A0D;}
#arlo_tm_popup_blog .close{
	position: absolute;
	top: 30px;
	right: 40px;
	width: 50px;
	height: 50px;
	cursor: pointer;
	display: block;
	z-index: 111111111;
}
#arlo_tm_popup_blog .close a{
	position: relative;
	display: block;
	height: 30px;
	margin-right: 10px;
	margin-top: 12px;
}
#arlo_tm_popup_blog .close a:before{
	position: absolute;
	content: "";
	width: 2px;
	height: 20px;
	background-color: rgba(0,0,0,1.00);
	top: 5px;
	right: 13px;
	transform: rotate(45deg);
}
#arlo_tm_popup_blog .close a:after{
	position: absolute;
	content: "";
	width: 2px;
	height: 20px;
	background-color: rgba(0,0,0,1.00);
	top: 5px;
	right: 13px;
	transform: rotate(135deg);
}




/* Responsive Styles */
@media only screen and (max-width: 768px) {
    .arlo_tm_list_wrap,
    .arlo_tm_news_wrap {
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .arlo_tm_news_wrap .image_wrap {
        width: 100%;
        height: 100%; /* Set a specific height for images on small screens */
    }

	.arlo_tm_news_wrap .definitions_wrap {
        width: 100%;
        padding: 15px;
        font-size: smaller; /* You can adjust as per your needs */

		.arlo_tm_news_wrap .definitions_wrap {
			display: none; /* Hide definitions on smaller screens */
		}
    }
}


@media only screen and (max-width: 480px) {
    .arlo_tm_news_wrap {
        padding-top: 20px;
        padding-bottom: 10px;
        margin-bottom: 10px;
    }

    .arlo_tm_news_wrap .image_wrap {
        height: 120px;
    }

    .arlo_tm_news_wrap .definitions_wrap {
        display: none; /* Ensure hidden state is preserved on the smallest screens */
    }
}


/*---------------------------------------------------*/
/*	09) ARLO CONTACT
/*---------------------------------------------------*/

.arlo_tm_contact_wrap_all{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	background-color: #fff;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}
.arlo_tm_contact_wrap_all .leftbox{
	width: 40%;
	height: auto;
	float: left;
	padding-right: 40px;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */		
}
.arlo_tm_contact_wrap_all .leftbox .short_info_wrap{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}
.arlo_tm_contact_wrap_all .leftbox .short_info_wrap ul{
	margin: 0px;
	list-style-type: none;
}
.arlo_tm_contact_wrap_all .leftbox .short_info_wrap ul li{
	margin: 0px 0px 15px 0px;
}
.arlo_tm_contact_wrap_all .leftbox .short_info_wrap ul li label{
	font-family: "Montserrat";
    font-weight: 700;
    font-size: 13px;
    color: #000000;
}
.arlo_tm_contact_wrap_all .leftbox .short_info_wrap ul li span{padding-left: 5px;}
.arlo_tm_contact_wrap_all .leftbox .short_info_wrap ul li a{
	text-decoration: none;
	color: #000;
}
.arlo_tm_contact_wrap_all .rightbox{
	width: 60%;
	height: auto;
	float: right;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */		
}
.arlo_tm_contact_wrap{
	max-width: 830px;
	height: auto;
	margin: 0px auto;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}
.arlo_tm_contact_wrap .subtitle{
	text-align: center;
	margin-bottom: 69px;
}
.arlo_tm_contact_wrap .subtitle p{color: #333;}
.arlo_tm_contact_wrap .main_input_wrap{
	margin-bottom: 75px;
	position: relative;
	top: -24px;
}
.arlo_tm_contact_wrap .main_input_wrap,
.arlo_tm_contact_wrap .main_input_wrap .wrap{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}
.arlo_tm_contact_wrap .main_input_wrap .wrap{margin-bottom: 20px;}
.arlo_tm_contact_wrap .main_input_wrap .wrap input{
	width: 100%;
	text-align: left;
	background-color: transparent;
	border: none;
	border-bottom: 1px solid rgba(10,4,37,1);
	color: #333;
	padding-left: 0px !important;
}
.arlo_tm_contact_wrap .main_input_wrap .wrap input:focus{
	outline: none;
}
.arlo_tm_contact_wrap .main_input_wrap .wrap textarea{
	width: 100%;
	height: 80px;
	text-align: left;
	background-color: transparent;
	border: none;
	border-bottom: 1px solid rgba(10,4,37,1);
	color: #333;
	padding-left: 0px !important;
}
.arlo_tm_contact_wrap .main_input_wrap .wrap textarea:focus{
	outline: none;
}
.arlo_tm_contact_wrap .arlo_tm_button button{
	text-decoration: none;
    color: #fff;
    background-color: #ca75ff;
    font-weight: 600;
    font-family: "Montserrat";
    padding: 12px 35px;
    border-radius: 30px;
	border: #FFFFFF;
    display: inline-block;
    position: relative;
    overflow: hidden;
}
.arlo_tm_contact_wrap .arlo_tm_button button:before{
	position: absolute;
    content: "";
    top: 0px;
    height: 100%;
    left: -25%;
    width: 0%;
    background-color: #041230;
    transform: skew(50deg);
    transition-duration: .6s;
    z-index: 1;
}
.arlo_tm_contact_wrap .arlo_tm_button button:hover:before{width: 170%;}
.arlo_tm_contact_wrap .arlo_tm_button button span{
	position: relative;
	z-index: 2;
}
.arlo_tm_contact_wrap .empty_notice{
	color: #BD0A0D;
	margin-bottom: 7px;
	display: none;
	text-align: left;
}
.arlo_tm_contact_wrap .contact_error{
	color: rgba(255,0,4,1.00);
	text-align: left;
}
.arlo_tm_contact_wrap .returnmessage{
	color:#0064FF;
	margin-bottom: 7px;
	text-align: left;
}

.arlo_tm_footer_wrap{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	text-align: left;
	background-color: #041230;
	padding: 50px 0px;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */ 
}
.arlo_tm_footer_wrap p{color: #fff;}
.arlo_tm_footer_wrap p a{
	text-decoration: none;
	color: #fff;
	font-family: "Montserrat";
	font-weight: 600;
    position: relative;
}

/*---------------------------------------------------*/
/*	10) EDREA TO TOP
/*---------------------------------------------------*/

.arlo_tm_totop{
	position: fixed;
	bottom: 40px;
	right: 55px;
	z-index: 100;
	overflow: hidden;
	outline: 1px solid rgba(255,255,255,.2);

	background-color: #ca75ff;
    padding: 22px;
    border-radius: 50px;
    display: inline-block;
	
	opacity: 0;
	visibility: hidden;
	
	-webkit-transition: all .5s ease;
	   -moz-transition: all .5s ease;
	    -ms-transition: all .5s ease;
	     -o-transition: all .5s ease;
	        transition: all .5s ease;
}
.arlo_tm_totop:before{
	position: absolute;
    content: "";
    top: 0px;
    height: 100%;
    left: -75%;
    width: 0%;
    background-color: #041230;
    transform: skew(50deg);
    transition-duration: .6s;
    z-index: 1;
}
.arlo_tm_totop:after{
	width: 0px;
    height: 0px;
    position: absolute;
    content: '';
    border: 5px solid transparent;
    border-bottom-color: #fff;
    top: 14px;
    left: 17px;
	z-index: 2;
}
.arlo_tm_totop:hover:before{width: 290%;}
.arlo_tm_totop.opened{
	opacity: 1;
	visibility: visible;
	bottom: 55px;
}

/*---------------------------------------------------*/
/*	11) ARLO PARTICLE HOMEPAGE
/*---------------------------------------------------*/

#particles-js {
	width: 100%;
	height: 100%;
  	position: relative;
  	z-index: 2;
}
.arlo_tm_universal_box_wrap.particle{
	height: 100vh;
	position: relative;
	background-image: url(../img/hero/2.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}
.arlo_tm_universal_box_wrap.particle .particle_overlay{
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	background-color:rgba(7,23,55,.8);
}

/*---------------------------------------------------*/
/*	12) ARLO RIPPLE HOMEPAGE
/*---------------------------------------------------*/

.arlo_tm_ripple_wrap{
	width: 100%;
	height:100vh;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	background-image: url(../img/hero/2.jpg);
	position: relative;
}
.arlo_tm_ripple_wrap .overlay{
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	background-color: rgba(7,23,55,.8);
	z-index: 1;
}
.arlo_tm_ripple_wrap .container{
	height: 100%;
	z-index: 2;
}


/*---------------------------------------------------*/
/*	 ARLO INTRO_PAGE
/*---------------------------------------------------*/

.arlo_tm_intro_universal_bg_wrap{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	position: relative;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}
.arlo_tm_intro_universal_bg_wrap .bg_wrap{
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	z-index: 10;
}
.arlo_tm_intro_universal_bg_wrap .bg_wrap .overlay_image{
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	z-index: 15;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}
.arlo_tm_intro_universal_bg_wrap .bg_wrap .overlay_color{
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	z-index: 20;
}
.arlo_tm_intro_universal_bg_wrap .content{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	position: relative;
	z-index: 30;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}
.arlo_tm_intro_universal_bg_wrap .bg_wrap .overlay_image.top{background-image: url(../img/hero/2.jpg);}
.arlo_tm_intro_universal_bg_wrap .bg_wrap .overlay_color.top{background-color: rgba(10,4,37,.85);}
.arlo_tm_intro_universal_bg_wrap .content.top{height: 75vh;}
.arlo_tm_intro_universal_bg_wrap .content.top .main_titles_wrap{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	text-align: center;
	width: 100%;
	padding: 0px 20px;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}
.arlo_tm_intro_universal_bg_wrap .logo_holder{margin-bottom: 25px;}
.arlo_tm_intro_universal_bg_wrap .logo_holder span{
	display: block;
	color: #fff;
	font-size: 36px;
	text-transform: uppercase;
	font-weight: 600;
	padding-top: 10px;
}
.arlo_tm_intro_universal_bg_wrap .intro_definition{margin-bottom: 26px;}
.arlo_tm_intro_universal_bg_wrap .intro_definition p{
	color: #FFFFFF;
	font-size: 25px;
	font-weight: 500;
	font-family: "Montserrat";
}
.arlo_tm_intro_universal_bg_wrap .purchase_button a span{
	position: relative;
	z-index: 2;
}
.arlo_tm_intro_universal_bg_wrap .purchase_button a{
	text-decoration: none;
    color: #fff;
    background-color: #fd4d4d;
    font-weight: 600;
    font-family: "Montserrat";
    padding: 12px 40px;
    border-radius: 30px;
    display: inline-block;
    position: relative;
    overflow: hidden;
}
.arlo_tm_intro_universal_bg_wrap .purchase_button a:before{
	position: absolute;
    content: "";
    top: 0px;
    height: 100%;
    left: -25%;
    width: 0%;
    background-color: #fff;
    transform: skew(50deg);
    transition-duration: .6s;
    z-index: 1;
}
.arlo_tm_intro_universal_bg_wrap .purchase_button a:hover:before{width: 160%;}
.arlo_tm_intro_universal_bg_wrap .purchase_button a:hover{color: #000;}
.arlo_tm_intro_universal_bg_wrap .purchase_button a i{margin-right: 10px;}
.arlo_tm_main_demos_wrap,
.arlo_tm_main_demos_title,
.arlo_tm_main_demos_list_wrap,
.arlo_tm_main_demos_list_wrap ul li .inner{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	background-color: #fff;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}
.arlo_tm_main_demos_wrap{padding-bottom: 60px;}
.arlo_tm_main_demos_title{text-align: center;}
.arlo_tm_main_demos_title span{
	display: inline-block;
	text-align: center;
	color: #000;
	font-size: 25px;
	font-weight: 600;
	padding: 80px 0px;
	text-transform: uppercase;
	font-family: "Montserrat";
}
.arlo_tm_main_demos_title.another span{padding-top: 20px !important;}
.arlo_tm_main_demos_list_wrap ul{
	margin: 0px 0px 0px -40px;
	list-style-type: none;
}
.arlo_tm_main_demos_list_wrap ul li{
	margin: 0px 0px 40px 0px;
	float: left;
	width: 33.3333%;
	padding-left: 40px;
	position: relative;
	top: 0px;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
	
	-webkit-transition: all .3s ease;
	   -moz-transition: all .3s ease;
	    -ms-transition: all .3s ease;
	     -o-transition: all .3s ease;
	        transition: all .3s ease;
}
.arlo_tm_main_demos_list_wrap ul li:hover{top: -5px;left: 0px;}
.arlo_tm_main_demos_list_wrap ul li .inner{
	position: relative;
	overflow: hidden;
	box-shadow: 0px 5px 40px -8px rgba(0,0,0,.1);
	padding-bottom: 20px;
}
.arlo_tm_main_demos_list_wrap ul li .inner .image_holder{margin-bottom: 15px;}
.arlo_tm_main_demos_list_wrap ul li .inner .image_holder img{min-width: 100%;}
.arlo_tm_main_demos_list_wrap ul li .inner .name{
	width: 100%;
	float: left;
	text-align: center;
}
.arlo_tm_main_demos_list_wrap ul li .inner .name span{
	color: #FFFFFF;
	font-size: 18px;
	font-weight: 500;
	display: inline-block;
	text-transform: uppercase;
}
.arlo_tm_main_demos_list_wrap ul li .inner .name span a{
	text-decoration: none;
	color: #000;
	font-family: "Montserrat";
	
	-webkit-transition: all .3s ease;
	   -moz-transition: all .3s ease;
	    -ms-transition: all .3s ease;
	     -o-transition: all .3s ease;
	        transition: all .3s ease;
}
.arlo_tm_main_demos_list_wrap ul li .inner .name span a:hover{color: #BC0127;}
.arlo_tm_main_demos_list_wrap ul li .inner .new{
	position: absolute;
	top: 15px;
	left:-33px;
	transform: rotate(-45deg);
}
.arlo_tm_main_demos_list_wrap ul li .inner .new span{
	display: inline-block;
	color: #FFFFFF;
	background-color: #BC0127;
	text-transform: uppercase;
	font-weight: 600;
	font-size: 16px;
	padding: 5px 45px;
}
.arlo_tm_footer_wrap.intro{
	padding-left: 40px;
	padding-right: 40px;
	text-align: center;
}

/*---------------------------------------------------*/
/*	13) ARLO PORTFOLIO SINGLE
/*---------------------------------------------------*/


.arlo_tm_portfolio_single_wrap {
    width: 100%;
    height: auto;
    clear: both;
    padding-top: 150px;
    box-sizing: border-box; 
}

.arlo_tm_portfolio_single_wrap .title_holder h3 {
    font-size: 50px;
    text-transform: uppercase;
    font-weight: 500;
    letter-spacing: -.5px;
    line-height: 1;
    margin-bottom: 100px;
    border-radius: 15px;
}

.arlo_tm_portfolio_single_wrap .details_wrap {
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: row;
    margin-bottom: 100px;
    border-radius: 15px;
    box-sizing: border-box; 
}

.arlo_tm_portfolio_single_wrap .details_wrap .leftbox {
    width: 40%;
    padding-right: 50px;
    box-sizing: border-box; 
}

.arlo_tm_portfolio_single_wrap .details_wrap .name_holder h3 {
    font-family: "Montserrat";
    font-size: 22px;
    font-weight: 600;
    color: #000000;
    line-height: 1;
    margin-bottom: 20px;
    border-radius: 15px;
}

.arlo_tm_portfolio_single_wrap .details_wrap .short_list ul {
    margin: 0;
    list-style-type: none;
    border-radius: 15px;
}

.arlo_tm_portfolio_single_wrap .details_wrap .short_list ul li {
    margin: 0 0 3px;
}

.arlo_tm_portfolio_single_wrap .details_wrap .short_list ul li:last-child {
    margin-bottom: 0;
}

.arlo_tm_portfolio_single_wrap .details_wrap .short_list ul li span {
    display: inline-block;
}

.arlo_tm_portfolio_single_wrap .details_wrap .short_list ul li span.first {
    font-weight: 600;
    min-width: 150px;
}

.arlo_tm_portfolio_single_wrap .details_wrap .rightbox {
    width: 60%;
}

.arlo_tm_portfolio_single_wrap .details_wrap .rightbox p {
    line-height: 2;
}

.arlo_tm_portfolio_single_wrap .images_list {
    width: 100%; /* Full width for the image container */
    height: auto; /* Adjust height automatically based on content */
    padding: 0; /* Remove padding */
    overflow: hidden; /* Clear floats if used */
    box-sizing: border-box; /* Ensure proper box sizing */
	
}

.arlo_tm_portfolio_single_wrap .images_list ul {
    display: flex; /* Use flexbox to align images in a row */
    flex-wrap: wrap; /* Allow items to wrap to the next line if they run out of space */
    padding: 0; /* Reset padding */
    margin: 0; /* Reset margin */
    list-style-type: none; /* Remove list style */
	
}


.arlo_tm_portfolio_single_wrap .images_list ul li {
    margin: 10px; /* Add some space between images */
    flex: 1 0 21%; /* Allow items to grow and shrink, starting basis is 21% of the container */
    box-sizing: border-box; /* Ensure proper box sizing */
	
}

.arlo_tm_portfolio_single_wrap .images_list ul li img {
    width: 100%; /* Make image responsive */
    height: 100%; /* Keep aspect ratio */
	object-fit: cover;
	
}


@media (max-width: 768px) {
    .arlo_tm_portfolio_single_wrap .images_list ul li {
        flex: 1 0 45%; /* Two images per row on tablets */
    }
}

@media (max-width: 480px) {
    .arlo_tm_portfolio_single_wrap .images_list ul li {
        flex: 1 0 30%; /* One image per row on mobile */
    }
}


video {
    display: block; 
    margin: 0 auto; 
    margin-bottom: 20px; 
}

.arlo_tm_portfolio_single_wrap .pagination_wrap {
    width: 100%;
    margin-bottom: 100px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box; 
    margin-top: 40px; 
}

.arlo_tm_portfolio_single_wrap .pagination_wrap a {
    text-decoration: none;
    color: #000000;
    font-weight: 600;
    font-size: 16px;
    transition: all .3s ease;
}

.arlo_tm_portfolio_single_wrap .pagination_wrap a.previous::before {
    content: '\f104'; 
    font-family: 'Font Awesome'
}

-------



/*---------------------------------------------------*/
/*	14) ARLO MOBILE HEADER
/*---------------------------------------------------*/

.arlo_tm_mobile_header_wrap{
	width: 100%;
	height: auto;
	position: fixed;
	z-index: 11111111;
	left: 0px;
	top: 0px;
	display: none;
}
.arlo_tm_mobile_header_wrap .main_wrap{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	padding: 30px 20px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	background-color: #041230;
	border-bottom: 1px solid rgba(255,255,255,.1);
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}
.arlo_tm_trigger{width: auto;}
.arlo_tm_trigger .hamburger{
    padding: 15px 15px;
    display: inline-block;
    cursor: pointer;
    transition-property: opacity, filter;
    transition-duration: 0.15s;
    transition-timing-function: linear;
    font: inherit;
    color: inherit;
    text-transform: none;
    background-color: transparent;
    border: 0;
    margin: 0;
    overflow: visible;
}
.arlo_tm_trigger .hamburger-box{
    width: 30px;
    height: 18px;
    display: inline-block;
    position: relative;
}
.arlo_tm_trigger .hamburger-inner{
    display: block;
    top: 50%;
    margin-top: -2px;
}
.arlo_tm_trigger .hamburger-inner, .hamburger-inner::before, .hamburger-inner::after{
    width: 30px;
    height: 2px;
    background-color: #333333;
    position: absolute;
    transition-property: transform;
    transition-duration: 0.15s;
    transition-timing-function: ease;
	
	-webkit-border-radius: 4px;
	   -moz-border-radius: 4px;
	        border-radius: 4px;
}
.arlo_tm_trigger .hamburger-inner::before,
.arlo_tm_trigger .hamburger-inner::after{
    content: "";
    display: block;
}
.arlo_tm_trigger .hamburger-inner::before{top: -8px;}
.arlo_tm_trigger .hamburger-inner::after{ bottom: -10px;}
.arlo_tm_trigger .hamburger--collapse-r .hamburger-inner{
    top: auto;
    bottom: 0;
    transition-duration: 0.13s;
    transition-delay: 0.13s;
    transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
.arlo_tm_trigger .hamburger--collapse-r .hamburger-inner::after{
    top: -16px;
    transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), opacity 0.1s linear;
}
.arlo_tm_trigger .hamburger--collapse-r .hamburger-inner::before{
    transition: top 0.12s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
.arlo_tm_trigger .hamburger--collapse-r.is-active .hamburger-inner{
    transform: translate3d(0, -10px, 0) rotate(45deg);
    transition-delay: 0.22s;
    transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
.arlo_tm_trigger .hamburger--collapse-r.is-active .hamburger-inner::after{
    top: 0;
    opacity: 0;
    transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), opacity 0.1s 0.22s linear;
}
.arlo_tm_trigger .hamburger--collapse-r.is-active .hamburger-inner::before{
    top: 0;
    transform: rotate(90deg);
    transition: top 0.1s 0.16s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.25s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.arlo_tm_trigger .hamburger{
	padding: 0px;
	height: 100%;
	display: table-cell;
	vertical-align: middle;
}
.arlo_tm_trigger .hamburger-box{display: block;}
.arlo_tm_trigger .hamburger .hamburger-inner::before,
.arlo_tm_trigger .hamburger .hamburger-inner::after,
.arlo_tm_trigger .hamburger .hamburger-inner{
	background-color: #fff;
	width: 30px;
	
	-webkit-transition: all .3s ease;
	   -moz-transition: all .3s ease;
	    -ms-transition: all .3s ease;
	     -o-transition: all .3s ease;
	        transition: all .3s ease;
}
.arlo_tm_mobile_menu_wrap{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	background-color: rgba(4,18,48,.97);
	padding: 30px 20px;
	display: none;
	border-bottom: 1px solid rgba(0,0,0,.09);
	border-top: 1px solid rgba(0,0,0,.09);
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */	
}
.arlo_tm_mobile_menu_wrap .mob_menu{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}
.arlo_tm_mobile_menu_wrap .mob_menu > ul{
	margin: 0px;
	list-style-type: none;
}
.arlo_tm_mobile_menu_wrap .mob_menu > ul > li{margin: 0px 0px 5px 0px;}
.arlo_tm_mobile_menu_wrap .mob_menu > ul > li:last-child{margin-bottom: 0px;}
.arlo_tm_mobile_menu_wrap .mob_menu > ul > li a{
	text-decoration: none;
	color: #fff;
	font-family: "Montserrat";
	font-weight: 600;
	font-size: 19px;
}

/*---------------------------------------------------*/
/*	15) ARLO MEDIA QUERIES (FOR SMALL DEVIVES)
/*---------------------------------------------------*/

@media (max-width: 1400px) {
	.arlo_tm_about_wrap .leftbox{padding-right: 0px;}
}
@media (max-width: 1200px) {
	.arlo_tm_services_wrap .list_wrap ul li{width: 50%;}
	#arlo_tm_popup_blog .close{right: 0px;}
	.arlo_tm_list_wrap > ul.total > li{width: 50%;}
	.arlo_tm_about_wrap .leftbox{display: none;}
	.arlo_tm_about_wrap .rightbox{padding-left: 0px;width: 100%;}
	.arlo_tm_contact_wrap_all .leftbox{width: 100%;padding-right: 0px;margin-bottom: 19px;}
	.arlo_tm_contact_wrap_all .rightbox{width: 100%;float: none;}
}
@media (max-width: 1040px) {
	.arlo_tm_about_wrap{flex-direction: column;}
	.arlo_tm_about_wrap .rightpart .info_list ul li{width: 100%;}
	.arlo_tm_about_wrap .leftpart{width: 100%;padding-right: 0px;margin-bottom: 60px;}
	.arlo_tm_about_wrap .rightpart{width: 100%;}
	.arlo_tm_skills_wrap .inner_wrap{flex-direction: column;}
	.arlo_tm_skills_wrap .leftbox{padding-right: 0px;width: 100%;margin-bottom: 60px;}
	.arlo_tm_skills_wrap .rightbox{width: 100%;padding-left: 0px;}
	.arlo_tm_main_demos_list_wrap ul{margin: 0px;}
	.arlo_tm_main_demos_list_wrap ul li{width: 100%;padding: 0px;}
	.arlo_tm_portfolio_single_wrap .details_wrap{flex-direction: column;}
	.arlo_tm_portfolio_single_wrap .details_wrap .leftbox{padding-right: 0px;width: 100%;margin-bottom: 50px;}
	.arlo_tm_portfolio_single_wrap .details_wrap .rightbox{width: 100%;}
	.arlo_tm_mobile_header_wrap{display: block;}
}
@media (max-width: 768px) {
	.arlo_tm_hero_header_wrap .name_holder h3{font-size: 40px;}
	.arlo_tm_hero_header_wrap .text_typing p{font-size: 21px;}
	.arlo_tm_title_holder h3{font-size: 45px;}
	.arlo_tm_title_holder:before{top: -2px;}
	.arlo_tm_counter_list li{width: 50%;}
	.arlo_tm_counter_list li .inner{padding: 45px 15px 48px 15px;}
	.arlo_tm_portfolio_list > li{width: 50%;}
	.arlo_tm_list_wrap > ul.total{margin: 0px;}
	.arlo_tm_list_wrap > ul.total > li{width: 100%;padding-left: 0px;}
	.arlo_tm_about_wrap .about_short_contact_wrap ul li{width: 100%;}
	.arlo_tm_totop{right: 20px;bottom: 10px;}
	.arlo_tm_totop.opened{bottom: 20px;}
	.arlo_tm_preloader{display: none;}
	.arlo_tm_portfolio_single_wrap .title_holder h3{font-size: 45px;}
}
@media (max-width: 480px) {
	.arlo_tm_hero_header_wrap .name_holder h3{font-size: 30px;}
	.arlo_tm_hero_header_wrap .text_typing p{font-size: 18px;}
	.arlo_tm_title_holder:before{display: none;}
	.arlo_tm_title_holder h3{padding-left: 0px;}
	.arlo_tm_title_holder span{padding-left: 0px;}
	.arlo_tm_counter_list li{width: 100%;}
	.arlo_tm_counter_list li .inner{padding: 0px 0px 35px 0px;}
	.arlo_tm_portfolio_list{margin: 0px;}
	.arlo_tm_portfolio_list > li{width: 100%;padding-left: 0px;}
	.arlo_tm_counter_wrap{padding: 94px 0px 48px 0px;}
}