/*!
 * megawebTech v1 (https://megawebtech.com/)
 * Written : Amarendra N Singh
 * Contact : singh.amarendranath@gmail.com;
 * 
 */

 body{
	color:#1a2736;
	font-size: 1.25rem;
	line-height: 1.5;
	font-family: system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif,'Apple Color Emoji','Segoe UI Emoji';
}
.clear{
	clear: both;
}
.outer_main{
	margin: 0 auto;
}
.txtblue{
	color:#2b527c;
}
.txtgrey{
	color: #525354;
}
.txtblack{
	color: #1a2736;
}
.txtwhite{
	color: #FFFFFF;
}

main{margin: 0 3rem;}
article{}
h2{
	font-size: 4.5rem;
	font-family: ui-serif,Georgia,Cambria,"Times New Roman",Times,serif;
}
h3{
	font-size: 2.25rem;
	line-height: 2.5rem;
}
/* Header */
.navbar{
	color: #151a2b;
	border: none;
	position: fixed;
	top: 0;
	right: 0;
	z-index: 6;
	padding: 2.25rem 3rem 2rem 3rem;
}
.menu_box{
	background-color: transparent;
	padding: 0.25rem 0.25rem 0.25rem 0.25rem;
	border: none;
	cursor: pointer;
}
.bar1, .bar2, .bar3 {
  width: 50px;
  height: 5px;
  background-color: #333;
  margin: 12px;
  transition: 0.4s;
  
}

.change .bar1 {
  transform: translate(0, 20px) rotate(-45deg);
}

.change .bar2 {opacity: 0;}

.change .bar3 {
  transform: translate(0, -13px) rotate(45deg);
}

.collapse{
	height: 100vh!important;
	z-index: 5;
	position: fixed;
	width: 100%;
	background-color: #FFFFFF;
	top:0;
}
.navbar-nav{
	margin:0 auto;
	text-align: center;
}
.nav-item{
	margin-bottom: 1.5rem;
	font-size: 4.5rem;
	line-height: 1;
}
.nav-link{
	color: #2b527c;
	font-weight: 600;
	padding: 0;
}
.nav-link:hover{
	color: #2b527c;
	transition: transform .5s ease-out;
	transform: scale(1.2);
}
.logotitle{
	padding: 16rem 0 0 0;
}
.sitelogo{
	width: 100%;
}
.sitetitle{	
	margin-right: 4rem;
}
.mb-8{
	margin-bottom: 2rem;
}
.mb-12{
	margin-bottom: 6rem;
}
.mb-16{
	margin-bottom: 4rem;
}
.mt-16{
	margin-top: 4rem;
}
.mt-24{
	margin-top: 8rem;
}
.mx-01{
	margin: 0 1rem;
}
.mx-6{
	margin: 0 2rem;
}
.mx-16{
	margin: 0 4rem;
}
.my-8{
	margin: 2rem 0;
}
.my-16{
	margin: 4rem 0;
}
.my-24{
	margin: 8rem 0;
}
.py-24{
	padding: 8rem 0;
}
.pt-12{
	padding-top: 3rem;
}
.py-8{
	padding: 2rem 0;
}
.pl-8{
	padding-left: 2rem;
}
.pl-16{
	padding-left: 5.5rem;
}
.pl-24{
	padding-left: 8.5rem;
}
.bg_webdevelop{
	background: url(../images/improve1263.webp) no-repeat center;
	background-size: cover;
}
.bg_megaclick{
	background: url(../images/online1263.webp) no-repeat center;
	background-size: cover;
}
.bg_onlinearticle{
	background: #2b527c;
}
.bg_branding{
	background: url(../images/promoting.webp) no-repeat center;
	background-size: cover;
}
.bg_footer{
	background: #2b527c;
}
.tran-ldata{position: relative;
  transform: translateX(-10px);
  opacity: 0;
  transition: 1.5s all ease;
}

.tran-ldata.active{
  transform: translateX(0);
  opacity: 1;
}
.tran-rdata{position: relative;
  transform: translateX(10px);
  opacity: 0;
  transition: 1.5s all ease;
}

.tran-rdata.active{
  transform: translateX(0);
  opacity: 1;
}
.tran-udata{position: relative;
  transform: translateY(-10px);
  opacity: 0;
  transition: 1.5s all ease;
}

.tran-udata.active{
  transform: translateY(0);
  opacity: 1;
}


.fflato{
	font-family: Lato,sans-serif;
}
.ffserif{
	font-family: ui-serif,Georgia,Cambria,"Times New Roman",Times,serif;
}

.lineheight{
	line-height: initial;
}
.fontsize-6{
	font-size: 6rem;
}
.fontsize-5{
	font-size: 5rem;
}
.text-semibold{
	font-weight: 600;
}
.fs-2{font-size: 2rem;}
.fs-35{font-size: 3.5rem;}
.boxtitle{
	font-size: 3rem;
	font-family: Roboto,"Segoe UI",Tahoma,Geneva,Verdana,sans-serif;
	font-weight: 700;
	padding-left: 1rem;
}
.boxtxt{
	font-size: 1.25rem;
	line-height: 1.75rem;
}
.txtwei3{
	font-weight: 300;
}

.onlinearticle{
	
	color: #FFFFFF;
	padding: 8rem 0;
}
.webdevlopcontact{
	border: 5px solid #2b527c;
	padding: 1rem 3rem;
	font-size: 1.875rem;
	line-height: 2.25rem;
	font-weight: 700;
}
.webdevlopcontact a{
	text-decoration: none;
	color: #2b527c;
}
.devlopcontact{
	border: 5px solid white;
	padding: 1rem 3rem;
	font-size: 1.875rem;
	line-height: 2.25rem;
	font-weight: 700;
}
.devlopcontact a{
	text-decoration: none;
	color: white;
}
.brandcontact{
	border: 5px solid #2b527c;
	padding: 1rem 3rem;
	font-size: 1.875rem;
	line-height: 2.25rem;
	font-weight: 700;
}
.brandcontact a{
	text-decoration: none;
	color: #2b527c;
}.onlinearticle{
	
	color: #FFFFFF;
	padding: 8rem 0;
}
.webdevlopcontact{
	border: 5px solid #2b527c;
	padding: 1rem 3rem;
	font-size: 1.875rem;
	line-height: 2.25rem;
	font-weight: 700;
}
.webdevlopcontact a{
	text-decoration: none;
	color: #2b527c;
}
.devlopcontact{
	border: 5px solid white;
	padding: 1rem 3rem;
	font-size: 1.875rem;
	line-height: 2.25rem;
	font-weight: 700;
}
.devlopcontact a{
	text-decoration: none;
	color: white;
}
.brandcontact{
	border: 5px solid #2b527c;
	padding: 1rem 3rem;
	font-size: 1.875rem;
	line-height: 2.25rem;
	font-weight: 700;
}
.brandcontact a{
	text-decoration: none;
	color: #2b527c;
}
.brandtitle{
	font-size: 4.5rem;
	font-family: Roboto,"Segoe UI",Tahoma,Geneva,Verdana,sans-serif;
	font-weight: 700;
	line-height: 1;
}
.brandsubtitle{
	font-size: 1.5rem;
	line-height: 2rem;

}
.italic{
	font-style: italic;
}
.spaceicons{
	width: 1rem;
	display: inline-block;
}
.whatelseleft{
	margin-left: 4rem;
}
.borderright{
	border-right: 2px dashed #e5e7eb;
}
.whatelselefttext{
	font-size: 6rem;
	font-family: ui-serif,Georgia,Cambria,"Times New Roman",Times,serif;
	line-height: 5rem;
}
.somework{
	font-size: 4.5rem;
	font-family: ui-serif,Georgia,Cambria,"Times New Roman",Times,serif;
	line-height: 1;
	margin-bottom: 0;
}
.whatelsetitle{
	font-size: 8rem;
	line-height: 6.5rem;
}
.whatelsepara{
	padding: 2rem 0 4rem 0;
	font-size: 1.5rem;
	line-height: 2rem;
}
.morecoming{
	font-size: 4.5rem;
	line-height: 1;
	color: #cccccc;
	font-family: "Open Sans Bold","Segoe UI",Tahoma,Geneva,Verdana,sans-serif;
	padding: 3rem;
	text-align: center;
	vertical-align: middle;
}

.contactus{
	padding: 16rem 2rem;
}
.contact_disc{
	font-size: 2.25rem;
	line-height: 2.25rem;
	font-weight: 600;
}
.contacttitle{
	font-size: 6rem;
	font-family: ui-serif,Georgia,Cambria,"Times New Roman",Times,serif;
	line-height: 6rem;
}
.contacticon{
  background: #e5e7eb;
  width: 8rem;
  height:8rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
}
.icontext{
	font-size: 2.25rem;
	line-height:2rem;
	margin: 0;
}
.socialicons{
	font-size: 3.5rem;
}
.socialicons a:hover{
	color: #1a2736;
}
.contactinfo{
	font-size: 1rem;
	line-height: 1.5rem;
}
.contactinfo a{
	color: #2563eb;
	font-size: 1rem;
	line-height: 1.5rem;
}
.contactinfo a:hover{
	color: #2563eb;
}
.whats-up-btn{
	font-size: 1.875rem;
	color: #00FF00;
	padding: 5px;
	font-weight: 700;
}
.whats-up-btn:hover{
	background: #00ff00;
	border-radius: 50%;
	color: #FFFFFF;
}
.justify-center{
	justify-content: center;
}
.locitle{
	font-size: 1.875rem;
	line-height: 2.25rem;
	font-weight: 700;
}
.locaddress{
	font-size: 1.5rem;
	line-height: 2rem;
	font-weight: 100;
	padding-top: 2rem;
}

.footer{
	padding: 4rem 2rem;
	color: #FFFFFF;
	font-size: 1rem;
}
/* Small devices (landscape phones, 576px and up) */
@media screen and (max-width: 575px){ 
	
	
	.pxy-2{padding: 1rem!important;}
	
	.navbar{padding: 1.15rem 1rem;}
	.bar1, .bar2, .bar3 {width: 28px; height: 4px; margin: 6px;}
	.change .bar1 {transform: translate(0, 10px) rotate(-45deg);}
	.change .bar3 {transform: translate(0, -10px) rotate(45deg);}
	.logotitle{padding: 8rem 0 0 0;}
	
	.logodiv{display: flex;}
	.sitetitle{display: grid; margin-right: 0rem;}
	.sitelogo{width: auto;}
	main{margin: 0.5rem;}
	h2{font-size: 1.5rem;}
	h3{font-size: 1.2rem;}
	.fontsize-6{font-size: 3rem;}
	.fontsize-5{font-size: 2.5rem; line-height: 2rem;}
	.webdevelop{padding: 4rem 0.5rem;}
	.webdevlopcontact{font-size: 1rem; line-height: 1.25rem;}
	.padxy-13{padding: 2rem;}
	.padxy-82{padding: 1rem;}
	.boxtitle{font-size: 1.5rem;}
	.boxtxt{font-size: 1rem; line-height: 1.5rem;}
	.fs-2{font-size: 1.5rem;}
	.marx-4{margin: 0; }
	.mart-4{margin: 0;}
	
	.marketonline{padding: 4rem 1rem;}
	.megaimg{margin: 2rem 0 0 -0.75rem;}
	.fs-35{font-size: 2.5rem;}
	.brandtitle{font-size: 3rem;}
	.brandsubtitle{font-size: 1rem; line-height: 1.25rem;}
	.brandcontact{padding:1rem 2.5rem; font-size: 1rem; line-height:1.25rem;margin-top: 2rem;}
	.devlopcontact{font-size: 1rem; line-height: 1.25rem;}

	.mb-12{	margin-bottom: 1.56rem;}
	.mb-16{	margin-bottom: 1rem;}
	.mt-16{	margin-top: 1rem;}
	.mt-24{	margin-top: 2rem;}
	.mx-01{	margin: 0 0.5rem;}
	.mx-6{	margin: 0;}
	.mx-16{	margin: 0 1rem;}
	.my-8{	margin: 0.5rem 0;}
	.my-16{	margin: 2rem 0;}
	.my-24{	margin: 0;}
	.py-24{	padding: 4rem 0;}
	.py-10{padding: 0 0.5rem;}
	.py-12{padding: 10rem 0;}
	.pt-12{padding-top: 2rem;}
	.pl-8 {padding-left: 4rem;}
	.pt-15{padding: 1rem 0;}
	.pl-16{padding-left: 8rem;}
	.pl-24{padding-left: 12rem;}
	.locitle{margin-top: 2rem; }
	.nav-item{ font-size: 1.875rem;	line-height: 2.25rem;}
	.whatelse{padding: 6rem 0;}
	.whatelseleft{margin-left: 0;}
	.borderright{border-right: none;}
	.whatelseleft{padding-left: 0; margin-bottom: 4rem;}
	.whatelseleft p{margin-bottom: 0;}
	.whatelselefttext{font-size: 3.75rem; line-height: 1;}
	.whatelsetitle{font-size: 1.875rem; line-height: 2.25rem;}
	.somework{font-size: 3rem; margin: 0; line-height: 1;}
	.ftbox{padding: 0 4rem;}
	.whatelsepara{font-size: 1.25rem; line-height: 1.75rem;}
	.somework.pl-8{padding-left: 2rem;}
	.somework.pl-16{padding-left: 4rem;}
	.somework.pl-24{padding-left: 6rem;}
	.morecoming{font-size: 1.875rem; line-height: 2.25rem;}
	.socialicons{font-size: 3.75rem;}
	.contactus{padding: 4rem 1rem;}
	.contacttitle{font-size: 3rem; padding-bottom: 2rem; line-height: 1;}
	.contact_disc{font-size: 1.5rem; padding: 2rem 0; line-height: 2rem;}
	.icontextdiv{width: 2.5rem;padding:0;margin:1rem 0;}
	.contacticon{width:2.5rem; height: 2.5rem;}
	.icontext{font-size: 1.25rem; line-height: 1.15rem;}
	.contactinfodiv{float: left;width: 85%;}
 }
 @media only screen and (max-width: 767px) and (min-width: 576px){

	h2{font-size: 3rem;line-height: 1;margin: 1rem 0;}
	h3{font-size: 1.25rem;line-height: 1.75rem;padding-top:1rem;}
	
	.logodiv{display: flex;}
	.sitetitle{display: grid; margin-right: 0rem;}
	.sitelogo{width: auto;}
	.float-right{float: none!important;}
	.nav-item{ font-size: 2.25rem;	line-height: 2.5rem; margin-bottom: 1rem;}
	.boxtitle{font-size: 1.75rem;}
	.fafont{font-size: 1.5rem;}
	.fontsize-6{font-size: 3rem;}
	.fontsize-5{font-size: 2.5rem; line-height: 2rem;}
	.padxy-13{padding: 1rem;}
	.whatelseleft{padding-left: 0; margin:0 0 4rem;}
	.pl-16{padding-left: 4rem;}
	.pl-24{padding-left: 6rem;}
	.whatelselefttext{font-size: 3.75rem; line-height: 1;}
	.whatelsetitle{font-size: 1.875rem; line-height: 2.25rem;}
	.whatelsepara{font-size: 1.25rem; line-height: 1.75rem;}
	.somework{font-size: 2.5rem; margin: 0; line-height: 1;}
	.somework.pl-8{padding-left: 1.5rem;}
	.somework.pl-16{padding-left: 3rem;}
	.somework.pl-24{padding-left: 4.5rem;}
	.ftbox{padding: 0 0 0 1rem;}
	.morecoming{font-size: 1.875rem; line-height: 2.25rem;}
	.contactus{padding: 4rem 1rem;}
	.contacttitle{font-size: 3rem; padding-bottom: 2rem; line-height: 1;}
	.contact_disc{font-size: 1.5rem; padding: 2rem 0; line-height: 2rem;}
	.socialicons{line-height: 1.5;}
	.icontextdiv{}
	.contacticon{width:3.5rem; height: 3.5rem;}
	.icontext{font-size: 1.25rem; line-height: 1.15rem;}

}

@media only screen and (max-width: 992px) and (min-width: 768px){
	
	h2{font-size: 3rem;line-height: 1;margin: 1rem 0;}
	h3{font-size: 1.25rem;line-height: 1.75rem;padding-top:1rem;}
	.logodiv{width: :100%;}
	.logodiv img{width: 238px;}
	.boxtitle{font-size: 2rem;}
	.fafont{font-size: 2rem;}
	.nav-item{ font-size: 4.25rem;	line-height: 4.25rem;}
	.col-md-12 .megaimg { text-align: center!important; }
	.whatelsetitle{font-size: 1.875rem;line-height: 2.25rem;}
	.whatelselefttext{font-size: 4.5rem; float: left;}
	.borderright{border-right: none;}
	.whatelseleft{margin-left: 2.75rem}
	.whatelsepara{font-size: 1.25rem; line-height: 1.75rem;}
	.pt-12{padding-top: 1rem;}
	.pl-8 {padding-left: 1rem;}
	.pl-16{padding-left: 1rem;}
	.pl-24{padding-left: 1rem;}
	.py-10{padding: 0 2rem;}
	.marx-8{margin: 1rem 0;}
	.somework{font-size: 3rem; margin: 0; line-height: 1;}
	.ftbox{margin-left: 1.5rem;}
	.somework.pl-8{padding-left: 2rem;}
	.somework.pl-16{padding-left: 4rem;}
	.somework.pl-24{padding-left: 6rem;}
	.morecoming{font-size: 1.875rem; line-height: 2.25rem;}
	.contactus{padding: 4rem 1rem;}
	.contacttitle{font-size: 3rem; padding:0 0 2rem 1rem; line-height: 1;}
	.socialicons{font-size: 2.5rem; text-align: left;}
	.pl-3{padding-left: 0.5rem!important;}
	.contact_disc{font-size: 1.875rem; line-height: 2.25rem;margin-top: 4rem;}
	.contacticon{width:3rem; height: 3rem;}
	.icontextdiv{padding:0.5rem 0 0 2rem;margin:0;}
	.icontext{font-size: 1.25rem; line-height: 1.15rem;}
	
}


@media only screen and (max-width: 1566px)and (min-width: 1281px){
	article, main, footer{max-width: 1260px;}
	.mx-01{margin: 0 auto;}
}

@media only screen and (min-width: 1567px){
	article, main, footer{max-width: 1540px; margin: 0 auto;}
	.mx-01{margin: 0 auto;}
}