﻿html, body {
	height: 100%;
	width: 100%;
}
h5{
	text-align: center;
	font-size: 30px;
	padding-top: 50px;
	margin-top: 30px;
}

.fa{
	padding: 15px;
	color: black;
	font-size: 25px;
}
.fa:hover{
	color: orange;
	text-decoration: none;
}
.icon{
	max-width: 400px;
}
.navbar {
	background-color: teal;
	color:skyblue;
	background-color: rgba(0,0,0,0.7);
	/*opacity: 1;*/
	padding: 1% 0%;
	font-size: 1.2em;
}
.navbar-brand{
	min-height: 45px;
	padding: 0 15px 5px;
	position:fixed;
}
.navbar-default .navbar-nav li a {
	color: #d5d5d5;
}
.navbar-default .navbar-nav li a:hover, .navbar-default .navbar-nav li a.active {
	color: orange;
	
}

#about{
	background-color: white;
	color: teal;
	width: 100%;
	height: 100%;
	font-size: 10px;
	text-align: left;
	padding: 20px 10px;

}
#difference{
	margin-left: 50px;
	margin-top: 30px;
	text-align: left;
}
#experience{
	height: 100%;
	width: 100%;
	background-color: teal;
	color: white;
	padding: 50px 30px;
}
#footer{
	background-color: #E8E8E8;
	width:100%;
	padding: 5% 5% 10% 5%;
}
#home {
	background: url(img/city.jpg) no-repeat center center fixed;
	display: table;
	height: 100%;
	position: relative;
	width: 100%;
	background-size: cover;
	background-color: teal(0,0,0,0.6);
	padding-top:50px;

	
}
#lastfooter{
	background-color: teal;
	min-height: 45px;
	padding: 0 15px 5px;
	font-size: 20px;
	color:orange;
}
#p1{
	font-size: 30px;
	margin: 110px;
}

#showcase{
	background-color: #E8E8E8;
	width: 100%;
	height: 100%;
	text-align:center;
	padding: 20px 10px;

}
#work{
	font-size: 20px;
	
}


.landing-text{
	display: table-cell;
	text-align: center;
	vertical-align:middle;
	color: orange;
	text-shadow: 3px 2px black
	

}
.landing-text h1 {
	font-size: 300%;
	font-weight: 700;
	color: white;
	text-shadow: 3px 2px orange
}
.padding{
	/*padding: 80px 0px;*/
	width: 100%;
	/*margin-top: 50px;*/
}

#fixed{
	background: url(img/city.jpg)no-repeat center center fixed;
	display: table;
	height: 60%;
	position: relative;
	width: 100%;
	background-size: cover;

}

@media (max-width: 760px){
	.landing-text h1 {
		font-size: 300%;
	}
	.fa { 
		font-size: 20px;
		padding:10px; 
	}
	.icon{
		padding-top: 5%;
		max-width: 100px;
	}
	.icon {
		padding-top: 5%;
		max-width: 100px;
	}
}



/*iphone 8 plus queries*/
@media only screen 
    and (device-width : 414px) 
    and (device-height : 736px) 
	and (-webkit-device-pixel-ratio : 3) { }



/*iphone 11 and 10r*/
	@media only screen 
    and (device-width: 414px) 
    and (device-height: 896px) 
    and (-webkit-device-pixel-ratio: 2) { }

/* iphone 11pro and 10s */
@media only screen 
and (device-width: 375px) 
and (device-height: 812px) 
and (-webkit-device-pixel-ratio: 3) { }


/* 11 pro max and 10s max */
@media only screen 
    and (device-width: 414px) 
    and (device-height: 896px) 
    and (-webkit-device-pixel-ratio: 3) { }

/*--- iOS Landing Page Fix
section {
 	position: relative;
 	width: 100%;
 	height: 100%;
 	display: table;
}
.home-wrap {
 	clip: rect(0, auto, auto, 0);
 	position: absolute;
 	top: 0;
 	left: 0;
 	width: 100%;
 	height: 100%;
}
#home {
	background-image: url('img/mountains.jpeg');
 	position: fixed;
 	display: table;
 	top: 0;
 	left: 0;
 	width: 100%;
	height: 100%;
	background-size: cover;
	background-position: center center;
	-webkit-transform: translateZ(0);
          transform: translateZ(0);
	will-change: transform;
	z-index: -1;
}
.landing-text {
	z-index: 100;
	display: table-cell;
	text-align: center;
	vertical-align: middle;
}
--*/

/*--- iOS Fixed Image Fix
figure {
	position: relative;
	width: 100%;
	height: 60%;
}
.fixed-wrap {
	clip: rect(0, auto, auto, 0);
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
#fixed {
	background-image: url('img/background.jpg');
	position: fixed;
	display: block;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-size: cover;
	background-position: center center;
	-webkit-transform: translateZ(0);
          transform: translateZ(0);
	will-change: transform;
}
--*/

