.header {
    width: 100%;
    position: relative;
    align-items: center;
    display: flex;
    height: 110px;
    justify-content: space-between;
    background: #007ee5;
    -webkit-box-shadow: 0px 4px 5px -3px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 4px 5px -3px rgba(0,0,0,0.75);
    box-shadow: 0px 4px 5px -3px rgba(0,0,0,0.75);
}

.logo a{display:block;}

/*Main Menu Css Starts Here*/
	nav {
	  margin-top: 21px;
	  text-align: right;
	  display:none;
}
.link-1 {
  transition: 0.3s ease;
  -moz-transition: 0.3s ease;
  -webkit-transition: 0.3s ease;
  color: #ffffff;
  font-size: 18px;
  text-decoration: none;
  padding-bottom: 41px !important;
  margin: 0 20px;
}
.link-1:hover {
  border-bottom: 4px solid #ffffff;
  padding: 6px 0; 
  color:#fff;
}

.current-link-1 {
  border-bottom: 4px solid #ffffff;
  padding: 6px 0; 
  color:#fff;
}

.overlay {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 1;
    top: 0;
    left: 0;
    background-color: #1fa0f7;
    overflow-x: hidden;
    transition: 0.5s;
}

.overlay-content {
    position: relative;
    top: 25%;
    width: 100%;
    text-align: center;
    margin-top: 30px;
}

.overlay a {
    padding: 8px;
    text-decoration: none;
    font-size: 40px;
    color: #fff;
    display: block;
    transition: 0.3s;
}

.overlay a:hover, .overlay a:focus {
    color: #f1f1f1;
}

.overlay .closebtn {
    position: absolute;
    top: 20px;
    right: 45px;
    font-size: 60px;
}

.mibileMenu{
	display: block;
	width: 40px;
	height: 50px;
	float: right;
	color: #fff;
	font-weight: bold;
	font-size: 44px;
	margin-top:3px;
	cursor:pointer;
}

.logoContainer {
    width: 222px;
    float: left;
}

.logo {
    width: 222px;
    float: left;
}

.logo img{
	width: 222px;
	height: auto;
}

.MenuContainer{
	width:50px;
	float:right;	
}

.ProThumCon{
	width:650px;
	margin:0px auto;	
}

.ProThumCon h2{
	text-align:center;
	color:#fff;
	font-size:30px;
	font-weight:bold;
	margin-bottom:50px;
	border-bottom:1px solid #fff;
	padding-bottom:30px;
	text-transform:uppercase;	
}

.ProThumCon > .logoCon1{
	/*width:49%;
	float:left;*/
	width:100%;
	float:none;
}

.ProThumCon > .logoCon2{
	width:49%;
	float:right;
}




/*Main Menu Css Ends Here*/


/*header css starts here*/
	.hero{
		min-height:550px;
		background-size: cover;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		background: url(../images/HeaderBg-1.jpg) no-repeat center center;
	}
	
	.about-hero{
		-webkit-background-size: cover;
		background-size: cover;
		-moz-background-size: cover;
		background:url(../images/About-HeaderBg.jpg) no-repeat center center;
		text-align:center;
		padding-bottom:160px;
		min-height:450px;
	}
	
	.contact-hero{
		-webkit-background-size: cover;
		background-size: cover;
		-moz-background-size: cover;
		background:url(../images/ContactUsBg.jpg) no-repeat center center;
		text-align:center;
		padding-bottom:160px;
		min-height:275px;
	}
	
	.contact-hero .abthero-heading h1 {
		font-size: 50px;
		font-weight: bold;
		color: #fff;
		padding-top: 160px;
		margin-bottom: 10px;
		padding-bottom:0px;
	}
	
	.contact-hero .abthero-heading h5 {
		font-size: 20px;
		color: #fff;
		line-height: 30px;
	}
	
	.about-hero .abthero-heading h1 {
		font-size: 50px;
		font-weight: bold;
		color: #333;
		padding-top: 160px;
		margin-bottom: 10px;
		padding-bottom:0px;
	}
	
	.about-hero .abthero-heading h5 {
		font-size: 20px;
		color: #333;
		line-height: 30px;
	}
	.abtInnerimg{
		
	}
	.abtlist{

	}
	
	#map {
    height: 280px;
    margin: 10px 0;
    color: #000;
	width:100%;
	border:3px solid #ccc; background:#fff;
	-webkit-box-shadow: 0px 3px 2px 0px rgba(50, 50, 50, 0.6);
-moz-box-shadow:    0px 3px 2px 0px rgba(50, 50, 50, 0.6);
box-shadow:         0px 3px 2px 0px rgba(50, 50, 50, 0.6);
}
	
	.contactFromCon{
		max-width:100%;
		margin:0px auto;	
	}
	
	.phones {
    	position: relative;
	}
	
	.phone {
		position: absolute;
		z-index: 0;
		top:30px;
		left:0px;
	}
	
	.hero-heading{
		text-align:center;
	}
	
	.hero-heading h1{
		font-size:50px;
		font-weight:bold;
		color:#fff;
		padding-top:180px;
		text-shadow: 0px 3px 2px #000;	
		margin-bottom:10px;	
	}
	
	.hero-heading h5{
		font-size:20px;
		color:#fff;
		line-height:30px;
		
	}
	
	.hero-heading .appStoreBtn{
		text-align:center;
		margin-top:40px;
	}
	
	.hero-heading .appStoreBtn a{
		border:none;
		padding:0px 10px;
	}
	
	.hero-heading .appStoreBtn img{
		border:none;
	}
/*header css ends here*/

/*Body Container starts*/
	.ourFocusMainCon{
		border-top:3px solid #ccc;
		background:url(../images/focusBg.png);
		padding:53px 0px;
	}
	
	.ourFocusMainCon div h3{
		font-size:37px;
		color:#333;
		font-weight:bold;
		text-align:center;
	}
	
	.ourFocusMainCon div p{
		font-size:18px;
		color:#333;
		text-align:center;
		padding:10px; 
	}
	
	
	.TrendingAppsContainer{
		background:#151616;
		border-top:3px solid #d35400;
		text-align:center;	
		padding:60px 0px;	
	}

	.TrendingAppsContainer h1{
		font-size:50px;
		font-weight:bold;
		color:#d35400;		
		text-shadow: 0px 3px 2px #000;	
		margin-bottom:10px;	
	}
	
	.TrendingAppsContainer h5{
		font-size:20px;
		color:#fff;
		line-height:30px;
	}
	
	.TrendingAppsContainer p{
		font-size:15px;
		color:#fff;
		text-align:center;
		padding:10px; 
	}
	
	.appContainer{
		margin-top:20px;	
	}
	
	.item {
	  width: calc(100% - 25px);
	  background: #ECEFF1;
	  margin: 25px auto;
	  text-align: left;	  
	  -webkit-box-shadow: 0px 0px 5px 0px rgba(50, 50, 50, 0.75);
	  -moz-box-shadow: 0px 0px 5px 0px rgba(50, 50, 50, 0.75);
	  box-shadow: 0px 0px 5px 0px rgba(50, 50, 50, 0.75);
	  color:#333;
	}

	.item-img {
	  position: relative;
	  width: 100%;
	}
	
	.item-img img {
	  position: relative;
	  width: 100%;
	}
	
	.item-desc {
	  position: relative;
	  padding:0px;
	}
	
	.item-desc a {
	  position: relative;
	  display: block;
	  font-weight: 500;
	  margin: 25px 0 0 0;
	  text-align:center;
	}
	
	.item-desc p {
		color:#333;
	}
	
	.item-heading {
	  font-size: 1.75em;
	  margin: 0 0 10px 0;
	  font-weight: bold;
	  text-align:center;
	}
	
	/*--Button Css */
	.myButton {
	-moz-box-shadow:inset 0px 1px 0px 0px #fce2c1;
	-webkit-box-shadow:inset 0px 1px 0px 0px #fce2c1;
	box-shadow:inset 0px 1px 0px 0px #fce2c1;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffc477), color-stop(1, #fb9e25));
	background:-moz-linear-gradient(top, #ffc477 5%, #fb9e25 100%);
	background:-webkit-linear-gradient(top, #ffc477 5%, #fb9e25 100%);
	background:-o-linear-gradient(top, #ffc477 5%, #fb9e25 100%);
	background:-ms-linear-gradient(top, #ffc477 5%, #fb9e25 100%);
	background:linear-gradient(to bottom, #ffc477 5%, #fb9e25 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffc477', endColorstr='#fb9e25',GradientType=0);
	background-color:#ffc477;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #eeb44f;
	display:inline-block;
	cursor:pointer;
	color:#000;
	font-family:Arial;
	font-size:21px;
	font-weight:bold;
	padding:10px 29px;
	text-decoration:none;
	text-shadow:0px 1px 0px #cc9f52;
}
.myButton:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #fb9e25), color-stop(1, #ffc477));
	background:-moz-linear-gradient(top, #fb9e25 5%, #ffc477 100%);
	background:-webkit-linear-gradient(top, #fb9e25 5%, #ffc477 100%);
	background:-o-linear-gradient(top, #fb9e25 5%, #ffc477 100%);
	background:-ms-linear-gradient(top, #fb9e25 5%, #ffc477 100%);
	background:linear-gradient(to bottom, #fb9e25 5%, #ffc477 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fb9e25', endColorstr='#ffc477',GradientType=0);
	background-color:#fb9e25;
	color:#000;
}
.myButton:active {
	position:relative;
	top:1px;
	text-decoration:none;
}

footer{
	background: #151616;
    border-top: 3px solid #d35400;
    text-align: center;
    padding: 9px 0px;
	font-size:18px;
	color:#fff;
	line-height:37px;

}
.footerCoyTxt{float:right; text-align:right; padding-right:15px;}
.sosial-links{float:right;}
.sosial-links a{
    display: block;
    float: left;
    width: 36px;
    height: 36px;
    border: 2px solid #909090;
    border-radius: 20px;
    margin-right: 7px; /*space between*/

} 
.sosial-links a i{
    padding: 12px 11px;
    font-size: 20px;
    color: #909090;
}

footer ul { margin:0; padding:0;
 color:#000; /* Base text color for the menu */
 
}
footer ul li a, footer ul li a:hover{text-decoration:none;}
footer ul li { float:left; list-style:none; /* Makes the list items go horizontally in lieu of default vertical display */ }
footer ul li:after {
 content:"|"; /* Or go Facebook style and use "·" (the interpunct character) for separators */
 color:#666; /* You may want to make the separators a bit more subtle than the base text color */
}
footer ul li:last-child:after { content:""; /* No separator for the last item in the list */ }
footer ul li a {
 margin:0 8px; /* Set margins around the links */
 color:#fff; /* Text colors for the links */
 cursor:pointer;
}
footer ul li a:hover {
 margin:0 8px; /* Set margins around the links */
 color:#d35400; /* Text colors for the links */
}


.clearMe{
	width:100%;
	clear:both;	
}

/*--Button Css-*/
/*Body Container ends*/
	

/*------------------------------------*/

/* Larger than mobile */
@media (max-width:540px) {
	.overlay a {font-size: 30px}
	.overlay .closebtn {
		font-size: 40px;
		top: 15px;
		right: 35px;
	}	
	
	.logoContainer {
   	 	width: 200px;
    	float: left;
	}
	
	.logo {
		width: 200px;
		float: left;
	}
	.logo img{
		width: 200px;
		height: auto;
	}
	
	.mibileMenu{
		margin-top: -4px;	
	}
	
	.hero-heading h1{font-size: 32px;padding-top:25px;}
	.hero-heading h5{font-size: 15px;}
	.phone {
		left: 0; 
		right: 0; 
		margin-left: auto; 
		margin-right: auto;
		width:150px;
		top:0px; 
	}
	
	.hero-heading .appStoreBtn {
		text-align: center;
		margin-top: 20px;
		margin-bottom: 20px;
	}
	.item-desc {padding: 10px 0px;}
	.TrendingAppsContainer p{padding:10px;}
	
	.TrendingAppsContainer h1{font-size: 29px;}
	.TrendingAppsContainer h5 {font-size: 15px;line-height: 23px;}
	.item-heading{font-size:24px;}
	footer{line-height: 20px;font-size: 15px; padding-top:20px;}
	footer ul li::after {display:none;}
	footer ul li{float:none;}
	.sosial-links {float:none;margin:0px auto; width:150px; margin-bottom:20px; margin-top:20px;}
	.footerCoyTxt {float:none;text-align: center; padding:0px;}
	.item-desc { padding: 0px;}
	.item-desc a{margin: 15px 15px;}
	.item-desc {
		position: relative;
		padding: 25px;
	}
	
	.about-hero{
		background-size: cover; 
		background-position: center;
		background:url(../images/About-HeaderBg.jpg) no-repeat center center;
		text-align:center;
		padding-bottom:160px;
	}
	
	.about-hero .abthero-heading h1 {
		font-size: 50px;
		font-weight: bold;
		color: #333;
		padding-top: 160px;
		margin-bottom: 10px;
		padding-bottom:0px;
	}
	
	.about-hero .abthero-heading h5 {
		font-size: 20px;
		color: #333;
		line-height: 30px;
	}
	.abtInnerimg{
		
	}
	.abtlist{

	}
	.ProThumCon {
    width:100%;
    margin: 0px auto;
}
	
	.ProThumCon > .logoCon1{
	width:100%;
	float:none;
	margin-bottom:30px;
	}
	
	.ProThumCon > .logoCon2{
	width:100%;
	float:none;
	}
}

/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 550px) and (max-width:749px) {
		.phone {
		width: 200px;
	}
	
	.hero-heading h1 {
		font-size: 36px;   
		padding-top: 49px;
	}
	.hero-heading .appStoreBtn {
		text-align: center;
		margin-top: 22px;
	}
	
	.hero-heading h5 {
		font-size: 18px;
		line-height: 30px;
	}
	.hero {min-height: 368px;}
	.TrendingAppsContainer h5 {
    font-size: 14px;   
    line-height: 24px;
    letter-spacing: 1px;
	}
	.TrendingAppsContainer h1 { font-size: 38px;}
	.item-desc a{margin: 15px 15px;}
	.item-desc {
		position: relative;
		padding: 25px;
	}
	
	.about-hero{
		background-size: cover; 
		background-position: center;
		background:url(../images/About-HeaderBg.jpg) no-repeat center center;
		text-align:center;
		padding-bottom:160px;
	}
	
	.about-hero .abthero-heading h1 {
		font-size: 50px;
		font-weight: bold;
		color: #333;
		padding-top: 160px;
		margin-bottom: 10px;
		padding-bottom:0px;
	}
	
	.about-hero .abthero-heading h5 {
		font-size: 20px;
		color: #333;
		line-height: 30px;
	}
	.abtInnerimg{
		
	}
	.abtlist{

	}
	
}

/* Larger than tablet */
@media (min-width: 750px) {
		.item-heading {
			font-size: 20px;
			margin: 0 0 -4px 0;
			font-weight: bold;
			text-align: center;
		}
		
		.item-desc {
			position: relative;
			padding: 4px;
		}
	.item-desc a{margin: 15px 15px;}
	.TrendingAppsContainer p{margin-bottom:0px !important;}
	.item-desc a {margin: 5px 0 10px 0;text-align: center;}
	.phani{width:100% !important; margin:0px !important;}
	footer ul {margin: 0px auto; width: 280px;}
	.footerCoyTxt{float:none; width:100%; text-align:center; padding:0px;}
	.sosial-links {float: none; width:143px; margin:20px auto;}
}

/* Larger than desktop */
@media (min-width: 1024px) {
	nav {display:block;}
	.mibileMenu{display:none;}	
	.logoContainer{
		width:270px;
		float:left;	
	}

	.MenuContainer{
	width:500px;
	float:right;	
	}	
	
	.hero-heading h1 {
    	padding-top: 82px;
	}
	
	.phone {
   	 left: 0px;
	}
	
	.item-desc a{margin: 15px 15px;}
	.TrendingAppsContainer p{margin-bottom:0px !important;}
	.phani{width:100% !important; margin:0px !important;}
	footer ul {margin: 0px auto; width: 280px;}
	.footerCoyTxt{float:none; width:100%; text-align:center; padding:0px;}
	.sosial-links {float: none; width:143px; margin:20px auto;}


}

/* Larger than Desktop HD */
@media (min-width: 1200px) {
	.logoContainer{
		width:270px;
		float:left;	
	}

	.MenuContainer{
	width:500px;
	float:right;	
	}
	.phone {left:0px;}	
	hero {
    min-height: 550px;}
	.hero-heading h1{
		font-size:50px;
		font-weight:bold;
		color:#fff;
		padding-top:180px;
		text-shadow: 0px 3px 2px #000;	
		margin-bottom:10px;	
	}
	
	.hero-heading h5{
		font-size:20px;
		color:#fff;
		line-height:30px;
		
	}
	
	.hero-heading .appStoreBtn{
		text-align:center;
		margin-top:40px;
	}
	
	.item-desc {
    position: relative;
    padding: 25px;
}
	
}