@import url("https://fonts.googleapis.com/css2?family=Edu+VIC+WA+NT+Beginner&display=swap");

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	transition: ease-in 0.2s;
	font-family: "IBM Plex Serif", serif;
}
a,
a:hover {
	text-decoration: none;
}
.row {
	margin-left: 0 !important;
	margin-right: 0 !important;
}
.navbar-fixed-top.scrolled {
	background-color: #fff !important;
	transition: background-color 200ms linear;
}
/* layout */
.navbar ul li a {
	margin: 10px;
	font-size: 15px;
}
#logo {
	width: 130px;
}
#logo:hover {
	transform: scale(1.2);
}
.img {
	height: 560px;
}
.copyright_area {
	width: 100%;
	display: flex;
	justify-content: space-around;
	background-color: rgb(5, 5, 5);
}
.copyright_area p {
	color: white;
}
.btncontainer {
	position: sticky;
	bottom: 0;
}
#contactBtn {
	background-color: red;
	width: 60px;
	height: 60px;
	border-radius: 50%;
}

/* home */
.Title_header {
	color: red;

	margin-top: 32.5px;
	margin-bottom: 32.5px;
}
#about {
	display: flex;
	justify-content: center;
	background-color: #f6f6f6;
	margin-top: 40px;
}
.about-content {
	display: flex;
	justify-content: center;
	align-items: center;
}

.call-bottom-area {
	background-color: #161616;
}
.call-bottom-area h2,
.text {
	color: white;
}

.btn {
	width: 138px;
	height: 40px;
	border: 1px solid red;
	border-radius: 20px;
	margin: 20px;
	background-color: transparent;
	color: red;
}
.btn:hover {
	background-color: red;
	color: white;
}

.p1 {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
}

/* about */
#aboutus,
#contactus,
#prtfolio {
	width: 100%;
	height: 350px;
	display: flex;
	justify-content: center;
	align-items: center;
	background: #161616;
}
#aboutus h1,
#contactus h1,
#prtfolio h1 {
	color: red;
	border-bottom: none !important;
}

.container-info {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	/*width: 100vw;*/
	text-align: justify;
	margin-left: calc(5vw) ;
	direction: ltr;
}
.container-info h3 {
	font-size: 2vw !important;
}

.container-info p,
.container-info ul,
.container-info li {
	font-size: 1vw !important;
}

.first-center,
.second-center,
.manchester {
	width:  25%;
	display: flex;
	flex-direction: column !important;
	flex-wrap: nowrap;
	align-content: center;
}

.name {
	text-align: start;
}
.name h3 {
	margin: 0px auto !important;
	align-content: center;
}

.address,
.email {
	display: flex;
	min-height: calc(5vw - 0px) !important;
	height:6vw;
}
.address ul,
.email ul {
	margin: calc(1rem - 15px) !important;
	text-align: justify;
	padding: calc(1rem - 0px) !important;
}

.address,
.email {
	padding: 0px;
	margin: 0px;
}

.tel,
.fax {
	display: flex;
	min-height: calc(1vw - 0px) !important;
}
.tel ul,
.fax ul {
	margin: calc(1rem - 15px) !important;
	text-align: justify;
	padding: calc(1rem - 0px) !important;
}

.tel li:nth-child(2) {
    margin-top: 1vw;
}

@media (max-width: 890px) {
	.container-info {
		flex-direction: column;
		align-content: flex-start;
		height: auto !important;
		margin-right: 6vw;
	}
	.first-center,
	.second-center,
	.manchester {
		/* margin-top: 1.5vw !important; */
		width: 80%;
		align-items: stretch !important;
		margin: 0px auto 4vh auto !important;
		/* margin-left: calc(12vw - 10px) !important; */
	}
	.address,
	.email {
		min-height: calc(6vw + 7px) !important;
		margin-bottom: 2vh;
	}
    .address{
           height: 9vw !important;
    }
	.container-info h3 {
		text-align: justify !important;
		font-size: 3vw !important;
	}
	.container-info p,
	.container-info ul,
	.container-info li {
		font-size: 2.6vw !important;
	}
	
}