@import url('https://fonts.googleapis.com/css2?family=Cabin:wght@400;500;600;700&display=swap');
	font-family: 'Cabin', sans-serif; rgb(240 238 235)



*{
	margin: 0;
	padding: 0;
}

body{
	box-sizing: border-box;
	font-family: 'Cabin', sans-serif;
}

.navbar-brand{
	font-size: 20px !important;
	font-family: 'Cabin', sans-serif;
}

.nav-link{
	color: black !important;
	font-size: 16px !important;
	font-family: 'Cabin', sans-serif;
}

.nav-link1{
	color: white;
	border:none !important;
}

.nav-link1:hover{
	color: black !important;
	background-color: white !important;
	border: 1px solid black !important;
	font-family: 'Cabin', sans-serif;

}

.nav-item :hover{
	color:  rgb(156 152 147)!important;
}

.hero{
	padding-bottom: 2rem;
	padding-left: 50px !important;
	padding-right: 50px !important;
}

.left{
	padding-top: 3rem !important;
	margin-top: 3rem !important;
}

.hero .left h1{
	font-size: 50px !important;
	font-family: 'Cabin', sans-serif;
	font-weight: bolder;
}

.hero .left  p{
	font-size: 18px !important;
	font-family: 'Cabin', sans-serif;

}

.hero .right img{
	padding-left: 100px;
	width:100%;
	height: auto;
}

.company{
	background-color: white !important;
	padding-left: 50px !important;
	padding-right: 50px !important;
}

.secure{
	margin-top: 3rem !important;
	margin-left: 3rem !important;
	margin-right: 3rem !important;
	background-color: orange !important;
	border-radius: 10px !important;
	padding-top: 3rem;
	padding-left: 50px !important;
	padding-right: 50px !important;
}

.secure h3{
	font-size: 35px !important;
	padding-left: 1rem ;
	font-family: 'Cabin', sans-serif;
}

.secure p{
	padding-left: 1rem ;
	font-size: 16px !important;
	font-family: 'Cabin', sans-serif;
}

.secure a{
	padding-left: 1rem ;
	font-size: 16px !important;
	color: black !important;
	font-family: 'Cabin', sans-serif;

}

.secure-left{
	padding-bottom: 3rem !important;
	padding-top: 3rem !important;
}

.secure-right img{
	height: auto;
	width: 70% !important;
	float: right;
}

.text-editor{
	padding-top: 3rem;
	background-color: white !important;
	padding-left: 50px !important;
	padding-right: 50px !important;
	font-family: 'Cabin', sans-serif;

}

.text-editor a{
	color: black !important;
	font-family: 'Cabin', sans-serif;

}

.footer{
	padding-top: 3rem;
	background-color: black !important;
	font-family: 'Cabin', sans-serif;
}

.footer li a {
	color: grey !important;
}

.footer b{
	color: grey !important;
}

/*Media queries */
@media only screen and (min-width: 320px) and (max-width: 768px){
	.hero{
		padding-left: 0px !important;
		padding-right: 0px !important;
	}

	.left{
		padding-top: 1rem !important;
		margin-top: 1rem !important;
	}

	.hero .left h1{
		font-size: 28px !important;
		width: 100%;
		font-weight: bold;
		text-align: center;
	}

	.hero .right img{
		width: 100%;
		padding: 0px;
	}

	.hero .left  p{
		font-size: 15px !important;
	}

	.d-flex .not{
		padding-right: 0px !important;
	}

	.company{
		padding-left: 0px !important;
		padding-right: 0px !important;
	}

	.secure{
		margin: 0px !important;
		padding: 0px !important;
	}

	.secure h3{
		font-size: 35px !important;
	}

	.secure p{
		font-size: 15px !important;
	}
	.secure-left {
		padding-left: 0px !important;
		padding-right: 0px !important;
	}

	.secure-right{
		padding-left: 0px !important;
	}

	.secure-right img{
		align-items: center;
		justify-content: center;
		float: left;
		position: relative;
		padding-right: auto;
		left: 0;
		transform: translateX(25%)
	}

	.text-editor{
		padding: 0px !important;
		padding-top: 3rem !important;
	}

	.text-editor-left{
		padding-top: 2rem !important;
		padding-bottom: 2rem !important;
	}

	.text-editor-right p{
		font-size: 15px !important;
	}

	.text-editor h3{
		padding-top: 0px !important;
		margin-top: 0px !important;
	}

	.footer .col-md-12{
	text-align: center;
}

.last-col{
	text-align: center;
}
	.credit{
		text-align: center;
	}
}

@media only screen and (min-width: 768.1px) and (max-width: 1024px){
.hero{
	padding-top: 0px !important;
}
.left{
	padding-top: 3rem !important;
	margin-top: 0px !important;
}
.hero .left h1{
	font-size: 30px !important;
	font-weight: bold;
}
.hero .right img{
	width: auto;
	height: 100%;
	align-items: center;
	justify-content: center;
	padding-left: 0px;
}
.secure{
	margin-top: 0px !important;
}
.text-editor-right{
	padding-bottom: 2rem;
	padding-left: 2rem !important;
}
.text-editor-right h3{
	font-size: 30px!important;
	padding-top: 0px !important;
	margin-top: 0px !important;
}
}