.topbanner{
	width: 100%;
	height:100%;
}

#myBtn {
  display: none;
  position: fixed;
  bottom: 15px;
  right: 20px;
  z-index: 99;
  font-size: 18px;
  border: none;
  outline: none;
  background: rgba(90, 92, 105, 0.5);
  color: white;
  cursor: pointer;
  padding: 10px;
  border-radius: 80% 80% 0% 0%;
}

#myBtn:hover {
background: rgba(90, 92, 105, 1);
}

a{text-decoration:none;}

ul.menu li{text-align:center; 
			padding:0px 5px; 
			margin:0px 5px; 
			font-size:18px; 
			font-family:arial; 
			font-weight:bold;}

div.drop a{font-weight:bold;}
div.drop a:hover{font-weight:bold; 
				color:blue; 
				margin-left:5px;}


div.pad{padding:4% 10%;}
h2.overview{font-weight:bold;
			color:black; 
			font-family:Lucida Calligraphy; 
			border-bottom:1px solid black; 
		}
p.overview{margin-top:15px;
			font-size:16px; .
			color:#737373;
			letter-spacing:0.2px; 
			font-family:arial; 
			}
div.overview{
			font-size:17px; 
			color:white; 
			font-family:arial; 
			
			letter-spacing:1px; 
			font-weight:bold; 
			border:1px solid #66a3ff; 
			background-color:#4da6ff; 
		}


div.whydiv{background-color:#19334d;}
div.whychoose{background-attachment:fixed;
		background-image: url("../image/operatelp.jpg");
		background-repeat: no-repeat;
		text-align:center;
		background-size: cover;
		}

h2.divontext{padding:7% 0% 3% 8%;
			text-align:left; 
			font-family:arial;
			font-weight:bold;}

i.icon{ font-size:34px; 
		padding:10px 8% 8% 0px; 
		color:#cc0000;}
div.why{margin:0% 0% 7% 10%;}
p.why{padding:0% 10% 0% 10%;
		 font-size:14px;}
div.divmarge{margin-bottom:5%;}

div.busipad{padding:4% 14%;}

div.seroffer{background-color:#e6e6ff; padding:2% 8%;}
h2.weservice{color:#0066cc; 
			text-align:center;
			font-family:Lucida Calligraphy;
			border-bottom:1px solid #0066cc;
			}


.serontext{font-family:Dubai; text-align:center; color:#404040;}
.icontext{border:1px solid black; 
		font-size:40px; 
		background: linear-gradient(to left bottom, #33ccff 30%, #0066cc 70%); 
		width:120px; 
		height:120px; 
		margin:7% 25%; 
		text-align:center; 
		/*transform:rotate(45deg);*/
		border-radius:50%;}
.icontext:hover{transform:scale(1.1); 
				transition-duration:1s;}	

div.icontext i{margin:25% 0 0 0; color:#ffff;}
.serontext h4{ text-align:center;}
.serontext p{font-family:arial; 
			font-size:14px;
			line-height:20px; 
			margin:10px 20px 0px 20px;}

.serontext a{text-decoration:none;}
div.serontext:hover .icontext{background: linear-gradient(to left bottom,#bfbfbf 20%, #f2f2f2 80%); 
							color:red;}
div.serontext:hover i{color:#0066cc;}

span{color:blue;}

div.achieve{background-attachment:fixed;
		background-image: url("../image/ourachieve.jpg");
		background-repeat: no-repeat;
		text-align:center;
		background-size: cover;
		}

.project p.big{font-size:40px; 
				space-weight:3px; 
				text-shadow:5px 3px black;
				 font-weight:bold;
				}
.project p.small{font-size:16px;
				margin:-10px 0px 0px 0px; 
				font-family:calibri;
				font-weight:bold;
				text-shadow:2px 1.5px black;
				letter-spacing:1px;
				}

div.ourachieve{
				color:white; 
				font-size:30px; 
				text-shadow:1px 1px blue; 
				letter-spacing:1px;
				font-weight:bold; 
				border-left:6px solid white;
				height:40px;
				margin-top:2%;
			}
div.footer{background-color:#1a1a1a;
			padding:2% 9% 10px 9%;
			color:white;
		font-family:calibri;}

div.fmarge{margin:7px 4% 5px 4%;}

.footer h6{font-family:calibri; 
			border-bottom:2px solid #1a8cff; 
			text-align:left;  
			letter-spacing:1px;
			width:200px;}

.fmarge i{font-size:18px; 
		padding-right:10px; 
		margin-top:2%;}
h5.social img{width:5px; 
			 padding:6px; 
			 margin-left:20px;}
.footer p{font-size:14px; 
		color:#cccccc; 
		font-weight:bold; 
		font-family:arial; 
		letter-spacing:0.5px; 
		margin-top:1%;}

div.maintain{background-color:#1a1a1a;
			color:white;
			font-size:17px;
			font-family:combria;
		}

div.maintain .foot p{text-align:center; 
					border-top:1px solid #cccccc;  
					padding:10px 0px 0px 0px;}

div.dp img{
		width:100%;
		height:100%;
		}
div.team{padding:3% 1% 3% 7%;}
div.tteam{padding:3% 5% 3% 3%;}
div.team img{width:95%; 
			border-radius:10px; 
			box-shadow:0 6px 8px 0 #c2c2d6;}

.tteam h3{ font-family:calibri; 
			font-weight:bold; 
			color:black;}
.tteam .text{text-align:justify; 
			font-size:16px; 
			font-family:Yu Gothic UI Semibold; 
			line-height:25px; 
			color:#666666;}

div.aboutdiv{background-color:#e6e6ff; padding:5% 8%;}

div.missiondiv{background-image:url("../image/missionbg.jpg"); 
			background-repeat: no-repeat, repeat;
			background-size:cover; 
			opacity:0.9; 
			border-radius:30px;
			padding:2% 5% 2% 5%;
			margin:0% 0% 4% 0%;}


.missiondiv .text{ float:left; 
					padding:1% 5% 0% 2%;  }
.missiondiv .text p{font-size:16px; 
					font-family:Yu Gothic UI Semibold; 
					line-height:22px; color:#666666;}
.missiondiv img{width:225px; 
				height:175px; 
				margin:0% 5%; 
				border-radius:10%;}
.capdiv{padding:5%;}
.capdiv .animate{float:left; 
				width:125px; 
				height:105px; 
				background-color:#ffffff; 
				box-shadow:-3px 10px 30px 15px #e6f2ff; 
				color:black; 
				padding:20px 0px 0px 0px; 
				font-size:16px; 
				font-family:Yu Gothic UI Semibold; 
				text-align:center;  
				margin:30px 12% 0px 30%;
				border-radius:10px;}
.animate p{margin-top:5px;}

div.capility{padding:3% 6% 3% 6%;}
.capility h3{font-family:calibri; 
			font-weight:bold; 
			color:black;}
.capdiv i{font-size:28px;}

.capility .text{text-align:justify; 
			font-size:16px; 
			font-family:Yu Gothic UI Semibold; 
			line-height:25px; 
			color:#666666;}

.animate:hover{background-color:rgba(40, 70, 255, 0.9);}
.animate:hover p{display:none;}
.animate:hover span{display:none;}
.animate p.over{color:white; 
				font-size:14px; 
				display:inline-block; 
				padding-top:20px; 
				font-family:calibri;}
.animate:hover p.over{display:show;}

div.workflow{background-color:#e6e6ff; 
			padding:3% 5% 3% 3%;}

.workflow img{margin:1% 10% 2% 10%; width:80%;}
.workflow .head{font-size:36px; 
			font-family:calibri; 
			font-weight:bold; 
			letter-spacing:0.5px; 
			color:black;
			text-align:center;}
.workflow .text{text-align:justify; 
			font-size:17px; 
			font-family:Yu Gothic UI Semibold; 
			line-height:25px; 
			color:#666666;}

div.customview{background-attachment:fixed;
		background-image: url("../image/thumb.jpg");
		background-repeat: no-repeat;
		text-align:center;
		background-size: cover;
		}
div.fontbg{color:white; 
			background-color:rgba(0, 0, 0, 0.6); 
			margin:0% 12%; 
			padding:2% 10%;}
.fontbg i{float:left; 
			margin:3% 0% 0% 0%;}
.fontbg p.text{font-size:16px; 
				margin:5% 4% 0% 0%; 
				line-height:27px;}

div.mteam{padding:3% 8%;}

div.mteam img{width:80%; 
				margin:1% 10%; 
				border-radius:10%;}

.mteam .head{font-family:calibri; 
			font-weight:bold; 
			color:rgb(0, 70, 255); 
			margin:1% 3% 1% 3%;}
small{font-size:14px; 
		color:#ff3333; 
		font-family:cambria; 
		margin:0% 3% 0% 3%;}
.mteam .text{text-align:justify; 
			font-size:17px; 
			font-family:Yu Gothic UI Semibold; 
			line-height:25px; 
			color:#595959; 
			margin:3% 3% 0% 3%;}

.mbg{background-color:#e6e6ff;}


div.about{font-family:calibri; 
				font-size:17px; 
				color:white; 
				background-color:rgba(3, 51, 99, 0.87);
				text-align:left;
				padding:5% 3% 2% 4%;
			}

.about .head{font-size:24px; 
			font-family:arial black; }	

.getin .head{color:black; 
			font-family:calibri; 
			font-weight:bold;  }
.getin .text{color:#999999; 
			font-size:18px; 
			font-family:calibri; 
			letter-spacing:0.5px; }
.getin input{ font-size:18px; 
			font-family:calibri; 
			color:#333333; 
			border:none; 
			border-bottom:1px solid black; 
			margin-top:5%;}
.getin textarea{font-size:18px; 
				font-family:calibri; 
				color:#333333; 
				border:none; 
				border-bottom:1px solid black; 
				margin-top:5%; 
				padding:0% 0% 0% 2%;}
.getin #agree{float:left; 
				margin:5% 2% 0% 0%;}
.getin form p{float:left; 
				font-weight:bold; 
				color:#333333; 
				font-size:14px; 
				font-family:arial; 
				letter-spacing:0.5px; 
				margin-top:5%;}


.homeview img{width:100%; 
			border-radius:10px; 
			box-shadow:0 8px 8px 1px #c2c2d6; 
			}
.homeview div.image{margin:5% 3% 5% 4%;
					text-align:center;}


.homeview .head{
			font-family:calibri; 
			font-weight:bold;
			color:black; 
			text-align:left;}
.homeview div.text{margin:5% 2% 5% 2%;
				font-size:16px; 
				font-family:Yu Gothic UI Semibold; 
				line-height:27px; 
				color:#666666;
				text-align:justify; 
				word-spacing:1px;}
div.frame{height:100%;
		 width:100%; 
		 text-align:center; 
		 background-color:white;}
iframe{width:90%; height:1000px; 
		text-align:center;  
		border:none;}

div.webhead{padding:5% 5% 4% 5%; background-image:url("../image/missionbg.jpg"); 
			background-repeat: no-repeat, repeat; 
			background-size:cover;}
div.webhead img{width:100%; margin:0% 0% 5% 0%; 
				border-radius:10px; 
				box-shadow:0 6px 8px 0 #c2c2d6;}

div.webhead .head{
			font-family:calibri; 
			font-weight:bold;
			color:black;
			margin-top:0;}
div.webhead .text{text-align:justify; 
			font-size:16px; 
			font-family:Yu Gothic UI Semibold; 
			line-height:25px; 
			color:#666666;}

div.techused h3{
			font-family:calibri; 
			font-weight:bold;  
			color:black; 
			text-align:center;
			margin:1% 0%;}

.techused img{float:left; 
				width:200px; 
				height:50px; 
				padding-right:3%;}
.marq {float:left; width:1500px; height:70px; padding-top:1%;}

.webarea{background-color:#e6e6ff; text-align:center; }
.webarea .fpad{padding:0% 18%; }
.webarea .head{font-family:calibri; 
				font-weight:bold; 
				color:black; 
				text-align:center; 
				margin:1%;}

.webdevelop .webtype{float:left; 
					width:200px;
					background-color:white; 
					font-size:16px; 
					font-family:Yu Gothic UI Semibold; 
					color:#e600ff; 
					border-radius:10px; 
					text-align:center;  
					padding:7% 2%; 
					margin-right:5%;}

.webdevelop .active{border-left:5px solid #0000ff;  
					float:left; 
					width:200px;
					background-color:white; 
					font-size:16px; 
					font-family:Yu Gothic UI Semibold; 
					color:#e600ff; 
					padding:7% 2%; 
					margin-right:5%; 
					border-radius:10px; 
					text-align:center;}
					
.webtype:hover{border-left:5px solid #0000ff;}

.businessweb{ background-image:url("../image/missionbg.jpg"); 
			background-repeat: no-repeat, repeat; 
			background-size:cover; 
			opacity:0.9; 
			border-radius:30px; 
			margin:3% 0%;
			padding:2% 5%;
		    }

.businessweb .head{font-family:calibri; 
					font-weight:bold;  
					text-align:left; 
					color:black;
					margin-top:1%;}
.businessweb p.text{text-align:justify; 
					font-size:15px; 
					font-family:Yu Gothic UI Semibold; 
					line-height:22px; 
					color:#666666; 
					margin:15px 0px 2% 0px;}
.businessweb img{width:100%; 
				border-radius:20px; 
				margin:2%;}

div.designpack .head{font-family:calibri; 
			font-weight:bold; 
			color:black;
			margin:5% 0% 1% 0%;
			text-align:center;}

div.designpack .text{text-align:justify; 
			font-size:16px; 
			font-family:Yu Gothic UI Semibold; 
			line-height:20px; 
			color:#666600;
			text-align:center;}

div.package{margin:3% 2% 3% 1%; 
			transition-duration:1s; 
			box-shadow:0 6px 8px 0 #c2c2d6; 
			border-radius:40px 40px 30px 30px; }

.package:hover{transform:scale(1.04); 
				transition-duration:1s;}

.package .black{background-color:#1b2732; 
				text-align:center; 
				font-size:26px; 
				color:white; 
				padding:10%; 
				margin-bottom:7%; 
				border-radius:40px 40px 0px 0px;}

.packtext{font-weight:bold; 
			color:#1b2732;}
.packtext i{color:green; 
			margin:2% 2% 2% 5%;}
div.package .enquiry{border:1px solid #d9d9d9; 
					text-align:center; 
					margin:7%; 
					padding:3%; 
					border-radius:30px; 
					font-size:16px; 
					font-weight:bold; 
					color:#666666; 
					font-family:Yu Gothic UI Semibold;}


div.package .enquiry:hover{background-color:#000066; color:#ffffff;}
a:hover{text-decoration:none;}

.oursol{background-color:#e6e6ff; padding:0% 5%;}
.oursol .head{font-family:calibri; 
				font-weight:bold;  
				color:black; 
				margin:2% 0%;
				text-align:center;}

.oursol .image{margin:1% 2% 5% 2%; 
				padding:0px; 
				box-shadow:0 6px 8px 5px #ffffff; 
			border-radius:30px 30px 0px 0px;}
.oursol img{width:100%; 
			border-radius:30px 30px 0px 0px;}
.oursol p.text{float:left; 
				font-family:Yu Gothic UI Semibold; 
				font-weight:bold; 
				font-size:22px; 
				width:100%;
				margin:8% 0% 8% 0%;}
.oursol .image i{float:left; 
				font-size:40px; 
				margin:0% 5% 0% 5%;}

.oursol .image div.text{width:100%; height:90px; margin:0%;}
.oursol .image:hover div.text{ background-color:#003366; color:white;  animation-name:example; animation-duration:0.5s; animation-fill-mode:both;}
@keyframes example{ 0% {width:0%;} 100% {width:100%;}}

.ourmethod{padding:3% 5%;}
.ourmethod .head{font-family:calibri; 
			font-weight:bold;
			color:black;}
.ourmethod .text{text-align:justify; 
			font-size:16px; 
			font-family:Yu Gothic UI Semibold; 
			line-height:25px; 
			color:#666666;}
.ourmethod .mathdiv{border-radius:10px; margin:4%; text-align:center; padding:2%; box-shadow:4px 4px 15px 3px #ccffff;}
.mathdiv i{font-size:26px; margin:3%;}
.mathdiv p{font-family:Yu Gothic UI Semibold; margin-top:2%; font-size:14px;}
.mathdiv:hover{background-color:#e6e6ff; transition:1s;}


.expertise{padding:4% 5% 4% 5%;}
.expertise img{ width:100%;}
.expertise .head{font-size:32px; font-family:calibri; font-weight:bold; letter-spacing:1px; color:black;  margin:2% 0% 0% 0%;}
.expertise p.text{text-align:justify; font-size:16px; font-family:Yu Gothic UI Semibold; line-height:22px; color:#999999;}

.expertbox{padding:2% 0%; width:100%;}
.experttype{float:left; background-color:#e6e6ff; margin:0% 3% 3% 3%; padding:2%;}
.experttype i{font-size:26px; margin:2%;}
.experttype:hover i{color:red; transform:scale(1.07); transition-duration:1s;}
.experttype p{font-size:16px; font-family:Yu Gothic UI Semibold; line-height:22px; color:#666666;}
.experttype:hover{transform:scale(1.05); 
				transition-duration:1s;}

.uidesign i{font-size:24px; color:red; margin:1%;}
.uidesign .text{text-align:left;}
.uidesign .btn{margin:2%;}

div.career{background-attachment:fixed;
		background-image: url("image/capbg.jpg");
		background-repeat: no-repeat;
		text-align:center;
		background-size: cover;
		}

.career img{width:100%; 
			border-radius:10px; 
			box-shadow:0 6px 8px 0 #c2c2d6; }

.career div{padding:5% 5% 5% 5%;}

.career .head{
			font-family:calibri; 
			font-weight:bold; 
			color:black; 
			text-align:left;}

.career .text{text-align:left; 
				font-size:17px; 
				font-family:Yu Gothic UI Semibold; 
				line-height:30px; 
				color:#666666;
				margin-right:5%;}

.career i{font-size:14px; 
			padding-right:5px;}

.jobcareer div.image{text-align:center; 
					padding-top:4%;}
.jobcareer div.text{padding:0% 1% 3% 7%;}

.jobcareer .head{
				font-family:calibri; 
				font-weight:bold; 
				color:black; 
				border-bottom:1px solid blue; 
				padding-bottom:1%;}

.jobcareer P{text-align:justify; 
			font-size:17px; 
			font-family:Yu Gothic UI Semibold; 
			line-height:25px; color:#333333;}
			
.jobcareer i{font-size:12px; 
			float:left; 
			margin:1% 2% 5% 5%;}

.jobcareer .marghead{margin-top:10%;}

div.jobcareer{padding-right:7%;}

div.jobcareer2{background-color:#e6e6ff; 
				padding:4% 5% 0% 0%;}

.jobcareer2 div{float:left;}
.jobcareer2 .head{font-family:calibri; 
					font-weight:bold; 
					color:black; 
					border-bottom:1px solid blue;}
.jobcareer2 .text{text-align:justify; 
				font-size:16px; 
				font-family:Yu Gothic UI Semibold; 
				line-height:25px; color:#333333;}
.jobcareer2 i{ font-size:12px;}
.jobcareer2 .htext{text-align:justify; 
					font-size:16px; 
					font-family:Yu Gothic UI Semibold; 
					line-height:20px; color:black; }


.contact .head{color:black;  
				font-family:calibri; 
				font-weight:bold;
				margin-top:10%;}
.contact .text{color:#003366; 
				font-size:20px; 
				font-family:calibri; 
				font-weight:bold; 
				letter-spacing:0.5px;}

div.hhead{padding:2% 2% 1% 2%;}

div.hhead h5{ font-family:calibri; 
			font-weight:bold;}

div.hhead .text{text-align:justify; 
			font-size:16px; 
			margin:0% 5%;
			font-family:Yu Gothic UI Semibold; 
			line-height:23px; 
			color:#666666;}

div.hhead .messtext{text-align:justify; 
			font-size:16px; 
			margin:0% 5%; 
			line-height:23px; 
			color:#666666;}
			
div.hhead hr{ width:20%;
  border-top: 3px solid red;
  border-radius: 5px;
}
div.lgallery{padding:1% 4%;}

.gallery img{border-radius:20px; 
			border:1px solid #ffcc00; 
			margin:1% 0px 1% 0px; 
			height:200px;
			width:100%;}

.gallery {width:100%;
			height:50%; 
			margin:1% 0% 1% 2%; 
			padding:1% 1% 0% 1%; 
			background-color:#ffe6e6; 
			text-align:center; 
			border-radius:20px;}

.gall img{width:100%; height:100%;}


