*{
padding:0px;
margin:0px;
}
.temp{
	background-color:royalblue;
	height:102px;
	width:100%;
}
  /* primary Style ----------thi-----*/
 /* Home Style  ---------------*/
 body{
 background-color:#fff;
 }
  /* <nav style> */
 .logo{
	 width:130px;
	 height:70px;
	 /* position:absolute; */
 }
 #home{
	 /* background-color:red; */
	 margin-top:6%;
 }
#slider {
width:100%;
height:400px;
overflow:hidden;
background:#ff00ff;
position:relative;
margin-top:-6%;
}
#slideshow {
 height:100%;
 width:100%;
 }
#slideshow img {
 height:100%;
 width:100%;
}
#pager:hover {
 opacity:1;
 }
#prev {
 height:50px;
 width:50px;
 position:absolute;
 top:0;
 bottom:0;
 left:0;
 margin: auto 10px;
 z-index:100;
   }
 #next {
  height:50px;
 width:50px;
 position:absolute;
 top: 0;
 bottom:0;
 right:0;
 margin: auto 10px;
  z-index:100;
   }
 #pager img{
margin: 10px 5px;
opacity:0.3;
transition:all .3s ease-in-out 0s;
  } 
#pager img:hover{
  opacity:1;
 transform:scale(1.05);
  z-index:100;
  }
.down-indicator{
	 position:absolute;
     top:40%;
	 left:50%;
	 transform:translate(-50%,-50%);
	 z-index:900;
} 
.down-indicator span{
	  display:block;
	  width:30px;
	  height:30px;
	  border-right:2px solid black;
	  border-bottom:2px solid black;
	  transform:rotate(45deg);
	  margin:-10px;
	  animation:animate 2s infinite;
}
.down-indicator span:nth-child(2){
		animation:delay:.2s;
}
.down-indicator span:nth-child(3){
		animation:delay:.4s;
	}
@keyframes animate{
		0%{
			opacity:0;
		    transform:rotate(45deg)translate(-20px,-20px);	
		}
		50%{
			opacity:1;
			}
		100%{
			opacity:0;
			transform:rotate(45deg)translate(20px,20px);
		}
	}
  .welcome_text{
/* background-color:cyan;  */
height:350px;
margin-left:10%;
margin-top:5%; 	 
}
.wbtn1{
  position:fixed;
 margin-top:5%;
 margin-left:35%;
}
.welcome_text p{
	font-size:15px; 
	margin-top:20px;
}
.welcome_text a{
	position:absolute;
	background-color:royalblue;
	top:50%;
	left:50%;
	width:160px;
	height:40px;
	line-height:40px;
	text-align:center;
	color:#404a65;
	border-radius:40px; 
	text-transform:uppercase;
	letter-spacing:3px;
	transition:.5s;
	box-sizing:border-box;
	text-decoration:none;
	transform:translate(-50%,-50%);
	overflow:hidden;
	cursor:url(favicon.png), pointer; 
}
.welcome_text a:hover{
	color:white;
	box-shadow:-15px 0 50px rgba(255,20,152,1), 15px 0 50px rgba(122,0,255,1);
	text-shadow:0 0 10px rgba(255,255,255,0.50), 0 0 25px rgba(255,255,255,0.50), 0 0 35px rgba(255,255,255,0.50);
}
.welcome_text a:before{
	content:'';
	position:absolute;
	top:0;
	left:0;
	width:40px;
	height:40px; 
	border-radius:50%;
    background:rgba(255,20,152,0);
    filter:blur(4px);
	transition:.5s;
   	z-index:-1;
}
.welcome_text a:hover:before{
	  background:rgba(255,20,152,1);
     transform:scaleX(5)
}
 .welcome_text a:after{
	content:'';
	position:absolute;
	top:0;
	right:0;
	width:40px;
	height:40px; 
	border-radius:50%;
    background:rgba(122,0,255,0);
    filter:blur(4px);
	transition:.5s;
   	z-index:-1;
	mix-blend-mode:lighten;
}
.welcome_text a:hover:after{
	  background:rgba(122,0,255,1);
     transform:scaleX(5)
}
.trafic_detail{
	 
	 height:400px;
	 width:100%;
	 margin-left:50px;
}
.trafic_detail h2{
 text-align:center;
margin-top:30px; 
}
.tc_detail span{
	border-radius:10px;
	background-color:royalblue;
    height:50px;
	width:100%;
	font-size:35px;
	text-align:center;
	line-height:50px;
	margin-top:15px;
	color:white;
}
.tc_detail p {
	color:white;
	margin-left:5%;
	position:absolute;
    font-size:20px;  
	margin-top:25px;
}
.social_button_external{
	position:fixed;
	opacity:0.2;
	background-color:royalblue;
	width:100px;
	height:80px;
	/* margin-left:96%; */
	z-index: 1030;
	margin-left:-5%;
}
.social_button_external:hover{
	opacity:5.5;
	margin-left:-0%;
	transition:all 0.5s;
}
/* Services Style  ---------------*/
  .sbord{
	 width:100%; 
	 background-color:#fff;
}
 .sbord h1{
  width:95%;
  text-align:center;
  /* background-color:pink; */
  margin-bottom:30px;
  font-family: DosisBold;
 }
  .service_title{
	padding-top:35px;   
 } 
.servicebord{
  /* background-color:grey; */
     width:85%;
	 position:absolute;
	 left:7%;
 }
.i1{
margin-top:20px;
width:50%;
height:50%;
 }
 .sbord1{
 text-align:center;
 }
.sbord1 h1{
    font-size: 20px;
    margin-top: 15px;
    margin-bottom: 27px;
}
 .sbord1 p {
 font-size:13px;
  text-align:left;
 }
 /* Style the buttons that are used to open and close the accordion panel */
.accordion {
    background-color:#e4e4e4;
    color: #444;
    cursor: pointer;
    padding: 15px;
    width: 100%;
    text-align: left;
    border: none;
    outline: none;
    transition: 0.4s;
	font-size:16px;
	text-align:center;
}
/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
/* Style the accordion panel. Note: hidden by default */
.panel {
    padding: 0 18px;
    background-color: white;
    display: none;
    overflow: hidden;
}
button.accordion:after {
    content: '\002B';
    color:royalblue;
    font-weight: bold;
    float: right;
    margin-left: -69px;
}
button.accordion.active2:after {
    content: "\2212";
	color:white;
}		
.accordion:hover,.accordion.active2{
    background-color:royalblue;
    color:white;	
}
.base_icon{
	  width:100%;
	  height:50px;
	  background-color:royalblue;
	  margin-top:58%;
}
.bot_container{
 /* background-color:cyan;  */
	width:120px;
	height:50px;
	 margin-left:5%;
    margin-top:44%; 
	float:left;
}
.bot img{
	width:120px;
	height:125px;	
}
.bot{
/* background-color:blue; 	 */
	position:relative;
 	top:0px;
    -webkit-animation: bot_float ease 4s infinite;
	-moz-animation: bot_float ease 4s infinite;
	 -o-animation: bot_float ease 4s infinite;
	-ms-animation: bot_float ease 4s infinite;
	animation: bot_float ease 4s infinite;
}
@keyframes bot_float {
	50% {top:60px;}
	100%{top:0px;}
}
.bot_shadow{
	position:relative;
	height:16px;
	background:#3c4cbd;	
	opacity:0.1;
	border-radius:100%;
	margin:0px 0px 0px 0px;
	top:50px;
	-webkit-animation: shadow_react ease 4s infinite;
	-moz-animation: shadow_react ease 4s infinite;
	-o-animation: shadow_react ease 4s infinite;
	-ms-animation: shadow_react ease 4s infinite;
	 animation: shadow_react ease 4s infinite;
}
@keyframes shadow_react {
	50%{ margin:0px 20% 0px 20%; opacity:0.7;}
	100%{ margin:0px 0px 0px 0px; opacity:0.1;}
}
.bot_container1{
 /* background-color:cyan;  */
	width:120px;
	height:50px;
	margin-left:2%;
    margin-top:44%; 
	float:left;
}
.bot1 img{
	width:120px;
	height:125px;	
}
.bot1{
/* background-color:blue; 	 */
	position:relative;
 	top:0px;
    -webkit-animation: bot_float1 ease 6s infinite;
	 -moz-animation: bot_float1 ease 6s infinite;
	  -ms-animation: bot_float1 ease 6s infinite;
	   -o-animation: bot_float1 ease 6s infinite;
	     animation: bot_float1 ease 6s infinite;
}
@keyframes bot_float1{
	50% {top:60px;}
	100%{top:0px;}
}
.bot_shadow1{
	position:relative;
	height:16px;
	background:#3c4cbd;
	opacity:0.1;
	border-radius:100%;
	margin:0px 0px 0px 0px;
	top:50px;
	-webkit-animation: shadow_react1 ease 6s infinite;
	-moz-animation: shadow_react1 ease 6s infinite;
	-ms-animation: shadow_react1 ease 6s infinite;
	-o-animation: shadow_react1 ease 6s infinite;
	animation: shadow_react1 ease 6s infinite;
}
@keyframes shadow_react1 {
	50%{ margin:0px 20% 0px 20%; opacity:0.7;}
	100%{ margin:0px 0px 0px 0px; opacity:0.1;}
}
.bot_container2{
 /* background-color:cyan;  */
	width:120px;
	height:50px;
	margin-left:2%;
    margin-top:44%; 
	float:left;
}
.bot2 img{
	width:120px;
	height:125px;	
}
.bot2{
/* background-color:blue; 	 */
	position:relative;
 	top:0px;
    -webkit-animation: bot_float2 ease 4s infinite;
	-moz-animation: bot_float2 ease 4s infinite;
	-o-animation: bot_float2 ease 4s infinite;
	-ms-animation: bot_float2 ease 4s infinite;
	 animation: bot_float2 ease 4s infinite;
}
@keyframes bot_float2{
	50% {top:60px;}
	100%{top:0px;}
}
.bot_shadow2{
	position:relative;
	height:16px;
	background:#3c4cbd;
	opacity:0.1;
	border-radius:100%;
	margin:0px 0px 0px 0px;
	top:50px;
	-webkit-animation: shadow_react2 ease 4s infinite;
	-moz-animation: shadow_react2 ease 4s infinite;
	-o-animation: shadow_react2 ease 4s infinite;
	-ms-animation: shadow_react2 ease 4s infinite;
	 animation: shadow_react2 ease 4s infinite;
}
@keyframes shadow_react2 {
	50%{ margin:0px 20% 0px 20%; opacity:0.7;}
	100%{ margin:0px 0px 0px 0px; opacity:0.1;}
}
.bot_container3{
 /* background-color:cyan;  */
	width:120px;
	height:50px;
	margin-left:2%;
    margin-top:44%; 
	float:left;
}
.bot3 img{
	width:120px;
	height:125px;	
}
.bot3{
/* background-color:blue; 	 */
	position:relative;
 	top:0px;
    -webkit-animation: bot_float3 ease 6s infinite;
	-moz-animation: bot_float3 ease 6s infinite;
	-o-animation: bot_float3 ease 6s infinite;
	-ms-animation: bot_float3 ease 6s infinite;
	 animation: bot_float3 ease 6s infinite;
}
@keyframes bot_float3{
	50% {top:60px;}
	100%{top:0px;}
}
.bot_shadow3{
	position:relative;
	height:16px;
	background:#3c4cbd;
	opacity:0.1;
	border-radius:100%;
	margin:0px 0px 0px 0px;
	top:50px;
	-webkit-animation: shadow_react3 ease 6s infinite;
	-moz-animation: shadow_react3 ease 6s infinite;
	-o-animation: shadow_react3 ease 6s infinite;
	-ms-animation: shadow_react3 ease 6s infinite;
	 animation: shadow_react3 ease 6s infinite;
}
@keyframes shadow_react3 {
	50%{ margin:0px 20% 0px 20%; opacity:0.7;}
	100%{ margin:0px 0px 0px 0px; opacity:0.1;}
}
.bot_container4{
 /* background-color:cyan;  */
	width:120px;
	height:50px;
	margin-left:2%;
    margin-top:44%; 
	float:left;
}
.bot4 img{
	width:120px;
	height:125px;	
}
.bot4{
/* background-color:blue; 	 */
	position:relative;
 	top:0px;
    -webkit-animation: bot_float4 ease 4s infinite;
	 -moz-animation: bot_float4 ease 4s infinite;
	  -o-animation: bot_float4 ease 4s infinite;
	   -ms-animation: bot_float4 ease 4s infinite;
	    animation: bot_float4 ease 4s infinite;
}
@keyframes bot_float4{
	50% {top:60px;}
	100%{top:0px;}
}
.bot_shadow4{
	position:relative;
	height:16px;
	background:#3c4cbd;
	opacity:0.1;
	border-radius:100%;
	margin:0px 0px 0px 0px;
	top:50px;
	-webkit-animation: shadow_react4 ease 4s infinite;
		-moz-animation: shadow_react4 ease 4s infinite;
			-o-animation: shadow_react4 ease 4s infinite;
				-ms-animation: shadow_react4 ease 4s infinite;
				animation: shadow_react4 ease 4s infinite;
}
@keyframes shadow_react4 {
	50%{ margin:0px 20% 0px 20%; opacity:0.7;}
	100%{ margin:0px 0px 0px 0px; opacity:0.1;}
}
.bot_container5{
 /* background-color:cyan;  */
	width:120px;
	height:50px;
	 margin-left:2%;
    margin-top:44%; 
	float:left;
}
.bot5 img{
	width:120px;
	height:125px;	
}
.bot5{
/* background-color:blue; 	 */
	position:relative;
 	top:0px;
    -webkit-animation: bot_float5 ease 6s infinite;
	  -moz-animation: bot_float5 ease 6s infinite;
	    -o-animation: bot_float5 ease 6s infinite;
		  -ms-animation: bot_float5 ease 6s infinite;
		 animation: bot_float5 ease 6s infinite;
}
@keyframes bot_float5{
	50% {top:60px;}
	100%{top:0px;}
}
.bot_shadow5{
	position:relative;
	height:16px;
	background:#3c4cbd;
	opacity:0.1;
	border-radius:100%;
	margin:0px 0px 0px 0px;
	top:50px;
	-webkit-animation: shadow_react5 ease 6s infinite;
	-moz-animation: shadow_react5 ease 6s infinite;
	-o-animation: shadow_react5 ease 6s infinite;
	-ms-animation: shadow_react5 ease 6s infinite;
	 animation: shadow_react5 ease 6s infinite;
}
@keyframes shadow_react5 {
	50%{ margin:0px 20% 0px 20%; opacity:0.7;}
	100%{ margin:0px 0px 0px 0px; opacity:0.1;}
}
.bot_container6{
 /* background-color:cyan;  */
	width:120px;
	height:50px;
	 margin-left:2%;
    margin-top:44%; 
	float:left;
}
.bot6 img{
	width:120px;
	height:125px;	
}
.bot6{
/* background-color:blue; 	 */
	position:relative;
 	top:0px;
    -webkit-animation: bot_float6 ease 4s infinite;
	 -moz-animation: bot_float6 ease 4s infinite;
	  -o-animation: bot_float6 ease 4s infinite;
	   -ms-animation: bot_float6 ease 4s infinite;
	    animation: bot_float6 ease 4s infinite;
}
@keyframes bot_float6{
	50% {top:60px;}
	100%{top:0px;}
}
.bot_shadow6{
	position:relative;
	height:16px;
	background:#3c4cbd;
	opacity:0.1;
	border-radius:100%;
	margin:0px 0px 0px 0px;
	top:50px;
	-webkit-animation: shadow_react6 ease 4s infinite;
	-moz-animation: shadow_react6 ease 4s infinite;
	-o-animation: shadow_react6 ease 4s infinite;
	-ms-animation: shadow_react6 ease 4s infinite;
     animation: shadow_react6 ease 4s infinite;
}
@keyframes shadow_react6 {
	50%{ margin:0px 20% 0px 20%; opacity:0.7;}
	100%{ margin:0px 0px 0px 0px; opacity:0.1;}
}
.bot_container7{
/* background-color:cyan;   */
	width:120px;
	height:50px;
	 margin-left:2%;
    margin-top:44%; 
	float:left;
}
.bot7 img{
	width:120px;
	height:125px;	
}
.bot7{
/* background-color:blue; 	 */
	position:relative;
 	top:0px;
    -webkit-animation: bot_float7 ease 6s infinite;
	-moz-animation: bot_float7 ease 6s infinite;
	-o-animation: bot_float7 ease 6s infinite;
	-ms-animation: bot_float7 ease 6s infinite;
	 animation: bot_float7 ease 6s infinite;
}
@keyframes bot_float7{
	50% {top:60px;}
	100%{top:0px;}
}
.bot_shadow7{
	position:relative;
	height:16px;
	background:#3c4cbd;
	opacity:0.1;
	border-radius:100%;
	margin:0px 0px 0px 0px;
	top:50px;
	-webkit-animation: shadow_react7 ease 6s infinite;
	-moz-animation: shadow_react7 ease 6s infinite;
	-o-animation: shadow_react7 ease 6s infinite;
	-ms-animation: shadow_react7 ease 6s infinite;
	 animation: shadow_react7 ease 6s infinite;
}
@keyframes shadow_react7 {
	50%{ margin:0px 20% 0px 20%; opacity:0.7;}
	100%{ margin:0px 0px 0px 0px; opacity:0.1;}
}
  /* Work Style  ---------------*/
#main{
 height:900px;
 width:100%;
 position:absolute;
 overflow:hidden; 
 /* background-color:royalblue; */
  background-color:#f0f3f4;
}
.work-tag h2{
	position:absolute;
	 margin-left:40%;
	 margin-top:5%;
 }
#box1,#box2{
	height:7%;
	width:200px;
	position:absolute;
	transform:translateY(-50%);
	overflow:hidden;
}
#box1{
	top:12%;
	margin-left:40%;
}
.colorlayer{
	height:100px;
	width:120px;
	background-color:#F6BEBF;
	position:absolute;
	left:-650px;
	z-index:9;
}
#box2 .colorlayer{
	background-color:#C5EBF8;
 
}
#box2{
	top:20%;
	margin-left:41%;
}	
.title{
    font-family:arial black;
	font-size:25px;
	line-height:50px;
	position:absolute;
	left:-700px;
	z-index:1;
}
/* <----------------------------> */
.col1{
/* background-color:red; */
height:200px;
width:500px;
margin-top:8%;
position:absolute;
}
.row5
{
/* background-color:red; */
width:420px;
height:500px;
margin-left:6%;
}
.row5 h2{
	margin-left:12%;
	background-color:royalblue; 
	width:300px;
	color:white;
	text-align:center;
}
.row5 p{
 margin:20px;
font-size:20px; 
border-bottom:1px dotted black;
 }
.cont_button{
	margin-left:13%;
}
.cont_button a{
    margin-left:40%;
	margin-top:10%;
	position:absolute;
	background:black;
	width:150px;
	height:45px;
	line-height:45px;
	text-align:center;
	color:white;
	border-radius:5px;
	display:block;
	text-transform:uppercase;
	letter-spacing:1.5px;
	transition:.5s;
	overflow:hidden;
	box-sizing:border-box;
	transform:translate(-50%,-50%);
	cursor:url(favicon.png), pointer; 
}
.cont_button a:before{
	content:'';
	position:absolute;
	width:0;
	height:0;
	left:0;
	bottom:0;
	border-style:solid;
	border-color:royalblue;
	border-width:80px 100px;
	z-index:-1;
	transform:rotate(360deg);
	transition:1s;
	transform-origin:left;
}
.cont_button a:hover:before{
	border-color:red;
	transform:rotate(60deg);
}
.row5 h3{
	 line-height:40px;
     font-size:25px;
	 text-align:center;
}
/* <---------------------> */
#msg{
	font-family:fantasy;
	font-size:5em;
	color:white;
	line-height:70px;
	position:absolute;
	top:30%;
	left:10%;
}
.royal{
	background-color:royalblue; 
	width:1900px;
	height:1100px;
	transform:rotateX(54deg) rotateY(0deg) rotateZ(45deg);
	margin-left:540px;
	margin-top:40px;
}
 .block{
	width:310px;
	height:210px;
	background-color:royalblue;
	position:absolute;
	transform:rotateX(55deg) rotateY(0deg) rotateZ(45deg);
	box-shadow:13px 12px 15px -5px rgba(0,0,0,.3);
}
.block img{
	width:100%;
	height:100%;
	transition: all .3s;
}
.block:hover img{
	transform:translate(-3%,-3%);
}	
.b1{
	top:-4.5%;
	right:-7.5%;
}
.b2{
	top:6%;
	right:5%;
}
.b3{
	top:17%;
	right:17.5%;
}
.b4{
	top:27.5%;
    right:29.5%;
}
.b5{
	top:38%;
    right:41%;
}
.b6{
	top:21%;
	right:-13%;
}
.b7{
	top:32%;
	right:0%;
}
.b8{
	top:42.5%;
	right:12%;
}
.b9{
	top:53%;
	right:24%;
}
.b10{
	top:47%;
	right:-17%;
}
.b11{
	top:68%;
	right:7%;
}
.b12{
	top:57.5%;
	right:-5.5%;
}
/* Clients Style  ---------------*/
.client_bord{ 
 background-color:#f0f3f4;
 width:100%;
 height:auto;
} 
.client_bord h1{
     text-align:center;
     padding:50px;
	 font-family: DosisBold;
	 font-size: 34px;
     font-weight: normal;
     letter-spacing: -1px;
     margin: 0 0 15px;
     text-transform: uppercase;
 } 
  /* ================================= */
 .slider{
	 overflow:hidden;
	 height:500px;
	 background-color:white;
}
.slider figure div{
	width:20%;
	float:left;
}	
.slider figure img 
{
	width:100%;
	float:left;
	margin-top:3%;
}
.slide .client_pic{
	width:10%;
	height:10%;
	margin-left:45%;
    border-radius:50%;	
}
.slide h2{
	width:100%;
	text-align:center;
    margin-top:14%;
 }
.slide h3{
    width:100%;	
    text-align:center;
     margin-top:5px;
}
.slide p{
	font-size:20px;
	 position:absolute;
	 width:10%;
	 height:100%;
	 margin-left:5%;
	 margin-top:10px;
	 text-align:center;
	 border-radius:15px;
	 }
 .slider figure{
	position:relative;
	width:500%;
	margin:0;
	left:0;
	animation:35s slidy infinite;
}
 @keyframes slidy{
	0%{
		left:0%;
	}
	10%{
		left:0%;
	}
	12%{
		left:-100%;
	}
	22%{
		left:-100%;
	}
	24%{
		left:-200%;
	}
	34%{
		left:-200%;
	}
	36%{
		left:-300%;
	}
	46%{
		left:-300%;
	}
	48%{
		left:-400%;
	}
	58%{
		left:-400%;
	}
	60%{
		left:-300%;
	}
    70%{
		left:-300%;
	}
	72%{
		left:-200%;
	}
	82%{
		left:-200%;
	}
	84%{
		left:-100%;
	}
	94%{
		left:-100%;
	}
	96%{
		left:0%;
	}
}   
.owl_wrapper h2{
	text-align:center;
	font-family: DosisBold;
}
.owl_wrapper{
	width:80%;
	margin-left:10%;
	height:auto;
	overflow:hidden;
	margin-top:5%;
}
.item{
	background:white;
	height:200px;
	margin-top:20%;
	border:1px solid black;
}
.item img{
	width:200px;
	height:160px;
	text-align:center;
	margin-top: 11%;
}
/* ABOUT US Style  ---------------*/
.tbord{ 	
  background-color: #fff;
 /* background-color:red; */
 width:100%;
 height:100%
 }
 .aboutus-title h2{
	 text-align:center;
	 font-family: DosisBold;
    font-size: 34px;
    font-weight: normal;
    letter-spacing: -1px;
    margin: 0 0 15px;
    text-transform: uppercase;
    margin-top: 5%;
 }
 .first_title {
	 margin-top: -10%;
 }
 .team_title{
  /* background:red; */
  position:absolute;
  text-align:center;
  margin-top:15%;
  margin-left:-10%;
}
.team_row{
	/* background-color:green;  */
   position:relative;
   left:8%;
   width:85%;
   margin-bottom:3%;
}
.mypic{
  /* background-color:pink;  	 */
position:relative;  
 overflow:hidden; 
 width:300px;
  height:450px; 
  margin-top:-20%;
 }
 .mypic:before{
	content:'';
	position:absolute;
	left:0;
	bottom:-450px; 
	width:300px;
	height:450px;
	background-color:white;
	/* background-color:rgba(65,105,225,0.5); */
	background-color:#fab9b9;
	transition:.5s;
	mix-blend-mode:soft-light;	
 }
 .mypic:hover:before{
	bottom:0;
}
.mypic img {
  width:300px;
  height:450px; 
  transition:1s;
 }
.mypic:hover .matter {
	transform:translateY(-100px);
	background-color:rgba(65,105,225,0.5);
}
.matter{
	height:150px;
	width:300px;
	background-color:rgba(65,105,225,0.1);
    transition:transform 0.5s;
	border:1px solid blue;
	z-index:4500;
}
.matter h2{
	 margin-top:5px;
	 color:white;
	 text-align:center;
	 font-size:23px;
}
.matter p{
	 color:white;
	 text-align:center;
	 margin-top:-3px;
}
.matter ul{
	margin:0;
	padding:0;
	display:flex;
	 margin-left:15%;
	 font-size:18px;
	 margin-top:-8px;
	 z-index:3050;
}
.matter ul li{
	list-style:none;
}
.matter ul li a {
	color:white;
	padding:0 10px;
	}
.matter ul li a:hover .fa-twitter{
	color:red;
	transform:rotateY(360deg);
	transition:.5s;	
}
.matter ul li a:hover .fa-linkedin{
	color:red;
	transform:rotateY(360deg);
	transition:.5s;	
} 
.matter ul li a:hover .fa-facebook{
	color:red;
	transform:rotateY(360deg);
	transition:.5s;	
} 
.matter ul li a:hover .fa-bold{
	color:red;
	transform:rotateY(360deg);
	transition:.5s;	
} 
.matter ul li a:hover .fa-google-plus{
	color:red;
	transform:rotateY(360deg);
	transition:.5s;	
} 
.matter ul li a:hover .fa-instagram{
	color:red;
	transform:rotateY(360deg);
	transition:.5s;	
} 
.matter ul li a .fab{
	transition:.5s;
} 
.row2,.row3{
	/* background-color:cyan; */
	/* text-align:center;  */
	padding:5px;
	margin-left:2%;
	}
.feature{
	/* background-color:purple; */
	border-bottom:1px dotted black;
	margin-top:10px;
 }
 .ourclients{
 background-color:royalblue;
 height:70px; 
 width:90%;
 margin-left:05%;
}
.c1{
 font-size:26px;
 padding-left:04%;
 }
.ourclients p {
float:left;
margin-left:25px;
line-height:60px;
color:black;
}
.logoslider{
	width:80%;
	height:37%;
	overflow:hidden;
	margin-left:10%;
}
 /* Contact Us Style  ---------------*/
 .cubord{
 /* background-image:url(../img/pattern_bg.jpg);  */
background-color:#151b26;
height:100%;
width:100%;
}
.cubord h1{
    color:white;
    text-align:center;
    padding:50px;
    font-family: DosisBold;
    font-size: 34px;
    font-weight: normal;
    letter-spacing: -1px;
    text-transform: uppercase;
  }
 .contacticon{
 /* background-color:red;   */
 width:85%;
position:relative;
left:10%;
}
 .box1,.box2,.box3{
	 /* background-color:green; */
	  text-align:center;
 }
.box1 p,.box2 p,.box3 p{
	 color:white;
	 font-size:16px;
	 margin-top:6%;
 }
 .contactbox{
	 position:relative;
	 /* background-color:pink; */
	 width:85%;
	 left:8%;
	 margin-top:5%;
 }
 .bizico1 img ,.bizico2 img,.bizico3 img{
height:40%;
width:40%;	 
 }
.cbox1{
/* background-color:cyan;   */
height:400px;
}
.maintitle{
/* background-color:green; */
font-size:25px; 
margin-left:05%;
color:white;
}
.maintitle1{
/* background-color:yellow; */
color:white;
font-size:18px;
line-height:28px;
width:90%;
margin-left:05%;
margin-top:23px;
}
 .sociyalbtn ul {
 margin:0;
 padding:0;
 display:flex;
 position:absolute;
 top:85%;
 margin-left:45%;
 transform:translate(-50%,-50%); 
}
.sociyalbtn ul li{
	list-style:none;
	 margin:0 10px;
}
.sociyalbtn ul li a{
	position:relative;
	display:block;
	width:60px;
	height:60px;
	text-align:center;
	line-height:60px;
	background:#333;
	border-radius:50%;
	font-size:30px;
	transition:0.5s; 
}
.sociyalbtn ul li a:before {
	content:'';
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	border-radius:50%;
	background:#ffee10;
	transition:0.5s;
	transform:scale(.9);
	z-index:-1;
	}
.sociyalbtn ul li a:hover:before {
	transform: scale(1.1);
	box-shadow:0 0 15px #ffee10;
}
.sociyalbtn ul li a:hover {
	color:#ffee10; 
	box-shadow:0 0 5px #ffee10;
	text-shadow:0 0 5px #ffee10;
	}
 .sociyalbtn ul li a .fa-linkedin,.fa-twitter,.fa-facebook,.fa-youtube,.fa-google-plus,.fa-instagram{
	color:white;
}
 .linkedin:hover a{
	background:#007bb6;
	}
.twitter:hover a{
	background:#55acee;
}
.facebook:hover a{
	background:#3b5998;
}
.pinterest:hover a{
	background:#cb2026;
}
.gplus:hover a{
	background:#dd4b39;
}
.pinterest:hover a{
	background:#cb2026;
}
.dribbble a:hover {
	background: #ea4c89;
}
a {
  color:white;
  text-decoration: none;
}                
.form{
	margin:0 66px 0 30px;
}
.input-text{
	padding:15px 16px;
	border:1px solid #ccc;
	width:100%;
	height:46px;
	display:block;
	border-radius:4px;
	font-size:15px;
	color:#aaa;
	font-family: 'Lato', sans-serif;
	margin:0 0 15px 0;
	transition:all 0.3s ease-in-out;
	-moz-transition:all 0.3s ease-in-out;
	-webkit-transition:all 0.3s ease-in-out;
	-o-transition:all 0.3s ease-in-out;
}
.input-text:focus {
	border: 1px solid #7cc576;
	outline:0;
	-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(124, 197, 118, 0.3);
	-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(124, 197, 118, 0.3);	
	box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(124, 197, 118, 0.3);
}
.input-text.text-area{
	height:180px;
	resize:none;
	overflow:auto;
	font-family: 'Lato', sans-serif;
}
.input-btn{
	font-family: 'Dosis', sans-serif;
	width:175px;		
	height:50px;
	letter-spacing: 0px;
	background:royalblue;
	border-radius:3px;
	color:#ffffff;
	font-size:16px;
	text-transform:uppercase;
	font-weight:600;
	border:0px;
	transition:all 0.3s ease-in-out;
	-moz-transition:all 0.3s ease-in-out;
	-webkit-transition:all 0.3s ease-in-out;
	-o-transition:all 0.3s ease-in-out;
}
.input-btn:hover{
	background: #fff;
	color: #222;
}
 .footer1{
 /* background-image:url(../img/pattern_bg.jpg); */
background-color:#151b26;
width:100%;
height:80px;
}
.fbox{
border-top:1px solid #cccccc;
width:80%;
margin-left:10%;
 }
.fbox h1{
color:#cccccc;
text-align:center;
line-height:80px;
font-size:15px;
}