*{
	box-sizing: border-box;
	font-family: 'helvetica';
}

body,html{
	margin: 0;
	padding: 0;
}

a{
    text-decoration: none;
    outline: none;
}

h1, h2, h3, h4, h5, h6{
	margin: 0;
}

.clearfix{
	clear: both;
}

header{
	width: 100%;
	height: 80px;
	position: absolute;
	box-sizing: border-box;
	margin: 0;
}

header content{
	float: left;
}

.nav{
	width: fit-content;
	height: 100%;
}

.nav ul{
	list-style-type: none;
    overflow: hidden;
    padding: 0;
    margin: 0 20px;
}

.nav ul li{
	display: inline;
	padding: 0 25px;
	margin: 0;
}

.active{
	color: #BAAB48 !important;
	font-weight: bold;
}

.nav ul li a{
	font-size: 13px;
	line-height: 80px;
	text-decoration: none;
	text-transform: uppercase;
	color: #fff;
}

.nav ul li a:hover{
	color: #BAAB48;
}

.logo{
	width: 10%;
	height: 100%;
	padding: 13px 40px 0;
}

.logo img{
	width: auto;
	height: 55px;
}

.tracking{
	width: fit-content;
	height: 100%;
	background: ;
	padding: 19px;
	display: flex;
}

.tracking input{
	width: 250px;
	padding: 10px 15px;
	background: none;
	outline: none;
	border: 1px solid #BAAB48;
	color: #fff;
}

.tracking button{
	height: 42px;
	padding: 10px 25px;
	outline: none;
	background: #BAAB48;
	color: #fff;
	border: 1px solid #BAAB48;
	text-transform: uppercase;
	cursor: pointer;
}

.my-malca{
	width: fit-content;
	height: fit-content;
	padding: 13px 10px 0;
	margin-top: 18px;
	border: 1px solid #BAAB48;
}

.my-malca img{
	width: auto;
	height: 23px;
}

.go-green{
	width: fit-content;
	height: fit-content;
	padding: 25px 40px 0;
}

.go-green img{
	width: auto;
	height: 23px;
}




.track-logo{
	width: 100%;
	position: absolute;
	top: 30px;
	left: 45.8%;
}

.track-logo img{
	width: auto;
	height: 90px;
}

.tracking-box{
	width: fit-content;
	height: fit-content;
	background: ;
	position: absolute;
	top: 22.6%;
	left: 25%;
}

.items{
	width: fit-content;
	display: flex;
	justify-content: center;
	align-items: center;
}

.items p{
	color: #fff;
	margin-right: 15px;
}

.items input{
	width: 210px;
	height: 30px;
	font-size: 15px;
	padding: 0 11px;
	background: #fff;
	outline: none;
	border: none;
}

.items input:focus{
	border: 1px solid #BAAB48;
	box-shadow: 0 0 10px #BAAB48;
}

.items button{
	padding: 7px 25px;
	background: #BAAB48;
	outline: none;
	border: none;
	color: #fff;
	cursor: pointer;
	font-weight: bold;
}

.track-dets{
	width: 100%;
	height: fit-content;
	position: absolute;
	top: 35%;
	text-align: center;
	padding-bottom: 100px;
}

.track-dets h3{
	font-size: 30px;
	margin-bottom: 45px;
}

.track-dets h5{
	font-size: 20px;
}

.track-dets b{
	color: orange;
}

.big{
	font-size: 23px;
}

.error-dets{
	width: 100%;
	height: fit-content;
	position: absolute;
	top: 35%;
	text-align: center;
	padding: 30px;
	color: red;
}






main img{
	width: 100%;
	height: auto;
	margin: 0;
}

.tab-img img{
	width: 100%;
	height: auto;
	display: none;
}

.mob-img img{
	width: 100%;
	height: auto;
	display: none;
}






@media (max-width: 1025px){

	.logo img{
	width: auto;
	height: 30px;
	}

	.nav ul{
    margin: 0 20px;
	}

	.nav ul li{
	padding: 0 15px;
	}

	.nav ul li a{
	font-size: 10px;
	line-height: 55px;
	}

	.tracking{
	padding: 11px 19px;
	}

	.tracking input{
	width: 200px;
	height: 27px;
	font-size: 12px;
	padding: 10px 15px;
	}

	.tracking button{
	height: 27px;
	padding: 2px 25px 0;
	}

	.my-malca{
		display: none;
	}

	.go-green{
		display: none;
	}




	.track-logo{
	top: 18px;
	left: 45%;
	}

	.track-logo img{
	width: auto;
	height: 60px;
	}

	.tracking-box{
	top: 22.6%;
	left: 20%;
	}

	.items p{
	font-size: 11px;
	margin-right: 15px;
	}

	.items input{
	width: 210px;
	height: 30px;
	font-size: 15px;
	padding: 0 11px;
	}

	.items button{
	padding: 7px 25px;
	}

	.track-dets{
	top: 36%;
	padding: 0 30px;
	}

	.track-dets h3{
	font-size: 30px;
	margin-bottom: 45px;
	}

	.track-dets h5{
	font-size: 20px;
	}

	.big{
	font-size: 23px;
	}









}




@media (max-width: 769px){

	.tab-img img{
		display: block;
		margin: 0;
	}

	main img{
		display: none;
	}

	

}






@media (max-width: 768px){

	.nav{
	display: none;
	}

	.tracking{
	float: right;
	padding: 25px 40px;
	}

	.tracking input{
	height: 35px;
	}

	.tracking button{
	height: 35px;
	}

	.my-malca{
		display: none;
	}

	.go-green{
		display: none;
	}

	.logo{
	padding: 20px 50px 0;
	}

	.logo img{
	width: auto;
	height: 40px;
	}




	.track-logo{
	width: 100%;
	top: 50px;
	left: 0;
	}

	.track-logo img{
	width: auto;
	height: 60px;
	position: relative;
	left: 37%;
	}

	.tracking-box{
	width: 100%;
	top: 42%;
	left: 0;
	padding: 0 10%;
	}

	.items p{
	font-size: 11px;
	margin-right: 15px;
	}

	.items input{
	width: 210px;
	height: 30px;
	font-size: 15px;
	padding: 0 11px;
	}

	.items button{
	padding: 7px 25px;
	}

	.track-dets{
	top: 60%;
	}

	.track-dets h3{
	font-size: 30px;
	margin-bottom: 45px;
	}

	.track-dets h5{
	font-size: 20px;
	}

	.big{
	font-size: 23px;
	}

}





@media (max-width: 426px){

	.tab-img img{
	display: none;
	}

	.mob-img img{
	display: block;
	}

	.logo{
	padding: 8px 20px 0;
	}

	.logo img{
	width: auto;
	height: 32px;
	}

	.tracking{
	float: right;
	padding: 8px 10px;
	}

	.tracking input{
	height: 30px;
	}

	.tracking button{
	height: 30px;
	}





	.track-logo{
	top: 50px;
	}

	.track-logo img{
	width: auto;
	height: 60px;
	left: 37%;
	}

	.tracking-box{
	top: 33%;
	padding: 0 30px;
	}

	.items{
	flex-direction: column;
	}

	.items p{
	font-size: 13px;
	margin-right: 0;
	}

	.items input{
	width: 210px;
	height: 30px;
	font-size: 15px;
	padding: 0 11px;
	}

	.items button{
	padding: 7px 25px;
	}







}




@media (max-width: 376px){

	.logo{
	padding: 12px 20px 0;
	}

	.logo img{
	width: auto;
	height: 27px;
	}

	.tracking-box{
	top: 30%;
	}

	.items p{
	font-size: 11px;
	}

	.items input{
	width: 210px;
	height: 30px;
	font-size: 15px;
	padding: 0 11px;
	}

	.items button{
	padding: 7px 25px;
	}


}




@media (max-width: 321px){

	.track-logo{
	top: 30px;
	}

	.tracking-box{
	top: 26%;
	}

	.items p{
	font-size: 11px;
	}

	.items input{
	width: 100%;
	height: 50px;
	font-size: 15px;
	padding: 0 11px;
	border: 1px solid #BAAB48;
	}

	.items button{
	width: 100%;
	height: 50px;
	padding: 7px 25px;
	}




}











