
h2
{
color:orange;
font-size:1.4rem;
font-family:"Trebuchet MS",sans-serif;
}



.tulsa-residential
{
height:800px;
width:100%;
background-size:cover;
background-image:url('images/homepage-background.webp');
}


.residential-header
{
display:flex;
flex-direction:row;
flex-wrap:wrap;
height:800px;
width:1200px;
margin:0px auto;
}

.residential-keywords
{
display:flex;
align-items:center;
justify-content:center;
height:200px;
width:1200px;
margin:auto;
animation-name:keywords;
animation-duration:3s;
transform:translate(0%,50%);
}

	
	@keyframes keywords{
	0% {opacity:0}
	100% {opacity:1}
			}

h1
{
color:black;
font-size:4rem;
font-family:"Trebuchet MS",sans-serif;
}

.benifits
{
display:flex;
flex-wrap:wrap;
flex-direction:row;
height:240px;
width:400px;
margin:auto;
transform:translate(60%,-50%);
}

.quotes-call
{
display:flex;
align-items:center;
justify-content:center;
flex-direction:column;
flex-wrap:wrap;
height:60px;
width:600px;
gap:5px;
transform:translate(0%,200%);
}

.call-us
{
display:flex;
justify-content:center;
align-items:center;
height:50px;
width:240px;
background-color:orange;
border:3px solid white;
}


	.call-us p
	{
	color:white;
	font-size:1.4rem;
	font-family:"Trebuchet MS",sans-serif;
	}

 	.call-us:hover
	{
	background-color:#313333;	
	}


	.call-us:hover
	{
	background-color:#313333;
	color:white;
	}


.benifits
{
height:400px;
width:300px;
gap:5px;
transform:translate(50%,0%);
}

.slide1
{
display:flex;
align-items:center;
justify-content:center;
height:40px;
width:280px;
border:5px solid white;
background-color:#eb5534;
transform:skew(350deg);
animation-name:slide1;
animation-duration:1s;
}

	
	
	@keyframes slide1{
	0% {transform:skew(300deg); opacity:0}
	100% {transform:skew(350deg);opacity:1}
			}

	
.slide2
{
display:flex;
align-items:center;
justify-content:center;
height:40px;
width:280px;
border:5px solid white;
background-color:#eb9e34;
transform:skew(350deg);
animation-name:slide2;
animation-duration:2s;
}

	
	@keyframes slide2{
	0% {transform:skew(300deg);opacity:0}
	100% {transform:skew(350deg);opacity:1}
			}

	

.slide3
{
display:flex;
align-items:center;
justify-content:center;
height:40px;
width:280px;
border:5px solid white;
background-color:#ebde34;
transform:skew(350deg);
animation-name:slide3;
animation-duration:3s;
}

	@keyframes slide3{
	0% {transform:skew(300deg);opacity:0}
	100% {transform:skew(350deg);opacity:1}
			}


.slide4
{
display:flex;
align-items:center;
justify-content:center;
height:40px;
width:280px;
border:5px solid white;
background-color:#abeb34;
transform:skew(350deg);
animation-name:slide4;
animation-duration:4s;
}

	
	@keyframes slide4{
	0% {transform:skew(300deg);opacity:0}
	100% {transform:skew(350deg);opacity:1}
			}
		


     .slide4 p
	{
	color:#313333;
	font-size:1rem;
	font-family:"Trebuchet MS",sans-serif;
        }	
     .slide3 p
	{
	color:#313333;
	font-size:1rem;
	font-family:"Trebuchet MS",sans-serif;
        }	
     .slide2 p
	{
	color:#313333;
	font-size:1rem;
	font-family:"Trebuchet MS",sans-serif;
        }	
     .slide1 p
	{
	color:#313333;
	font-size:1rem;
	font-family:"Trebuchet MS",sans-serif;
        }	


.residential-wrap
{
display:flex;
flex-wrap:wrap;
flex-direction:column;
height:600px;
width:100%;
margin:auto;
background-color:#313333;
}

.residential-main-wrap
{
display:flex;
flex-wrap:wrap;
flex-direction:column;
height:600px;
width:1200px;
margin:auto;
}

.residential-main-page
{
height:600px;
width:400px;
background-color:#313333;
}

.residential-image1
{
height:400px;
width:400px;
overflow:hidden;
transform:translate(0%, 20%);
margin:auto;
}

	.residential-image1 img
		{
		height:100%;
		width:100%;
		}

.residential-paragraph
{
height:700px;
width:700px;
}

	.residential-paragraph p
		{
		color:gray;
		font-size:1.4rem;
		font-family:"Trebuchet MS",sans-serif;
        	}	




.commercial-anchor
{
display:flex;
align-items:center;
justify-content:center;
height:100px;
width:100%;
background-color:#313333;
}



.com-wrap
{
width:1200px;
height:50px;
display:flex;
flex-wrap:wrap;
flex-direction:columns;
gap:10px;
margin:0px auto;
transform:skew(350deg);
}

.links
{
display:flex;
align-items:center;
justify-content:center;
margin:auto;
height:100%;
width:290px;
background-color:#eb5534;
}

	.links p
	{
	font-family:"Trebuchet MS",sans-serif;
	color:black;
	font-size:0.9rem;
	}

	.links p:hover
	{
	font-family:"Trebuchet MS",sans-serif;
	color:white;
	font-size:0.9rem;
	}


.best-offer
{
height:400px;
width:100%;
background-color:#313333;
}

.best-offer-wrap
{
display:flex;
flex-wrap:wrap;
flex-direction:column;
align-items:center;
justify-content:center;
height:400px;
width:900px;
margin:0px auto;
}

	.window-film
	{
	display:flex;
	justify-content:center;
	height:300px;
	width:280px;

 	border-radius:25px;
	}
	
	.image-film
	{
	border-radius:50%;
	height:200px;
	width:200px;
	margin:5px 0px;
	}

	.window-film img
	{
	height:100%;
	width:100%;
	border-radius:50%;
	}

	.browse
	{
	display:flex;
	align-items:center;
	justify-content:center;
	height:50px;
	width:200px;
	margin:20px 0px;
	}




	

/*MOBILE =======================*/
@media screen and (max-width:767px)
{
.tulsa-residential
{
height:800px;
width:100%;
background-size:cover;
background-color:#313333;
background-image:url('images/homepage-background.webp');
}


.residential-header
{
display:flex;
flex-direction:row;
flex-wrap:wrap;
height:800px;
width:400px;
margin:0px auto;
}

.residential-keywords
{
display:flex;
align-items:center;
justify-content:center;
height:400px;
width:400px;
margin:auto;
animation-name:keywords;
animation-duration:3s;
transform:translate(0%,0%);
}

	
	@keyframes keywords{
	0% {opacity:0}
	100% {opacity:1}
			}

h1
{
color:#313333;
font-size:2rem;
font-family:"Trebuchet MS",sans-serif;
}

.benifits
{
display:none;
flex-wrap:wrap;
flex-direction:row;
justify-content:center;
height:300px;
width:400px;
margin:5px auto;
}

.quotes-call
{
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
height:60px;
width:400px;
gap:5px;
transform:translate(0%,100%);
}

.call-us
{
display:flex;
justify-content:center;
align-items:center;
height:50px;
width:240px;
background-color:orange;
border:3px solid white;
}


	.call-us p
	{
	color:white;
	font-size:1.4rem;
	font-family:"Trebuchet MS",sans-serif;
	}

 	.call-us:hover
	{
	background-color:#313333;	
	}


	.call-us:hover
	{
	background-color:#313333;
	color:white;
	}




.slide1
{
display:flex;
align-items:center;
justify-content:center;
height:40px;
width:280px;
border:5px solid white;
background-color:#eb5534;
animation-name:slide1;
animation-duration:1s;
}

	
	
	@keyframes slide1{
	0% {opacity:0}
	100% {opacity:1}
			}

	
.slide2
{
display:flex;
align-items:center;
justify-content:center;
height:40px;
width:280px;
border:5px solid white;
background-color:#eb9e34;
animation-name:slide2;
animation-duration:2s;
}

	
	@keyframes slide2{
	0% {opacity:0}
	100% {opacity:1}
			}

	

.slide3
{
display:flex;
align-items:center;
justify-content:center;
height:40px;
width:280px;
border:5px solid white;
background-color:#ebde34;
animation-name:slide3;
animation-duration:3s;
}

	@keyframes slide3{
	0% {opacity:0}
	100% {opacity:1}
			}


.slide4
{
display:flex;
align-items:center;
justify-content:center;
height:40px;
width:280px;
border:5px solid white;
background-color:#abeb34;
animation-name:slide4;
animation-duration:4s;
}

	
	@keyframes slide4{
	0% {opacity:0}
	100% {opacity:1}
			}
		


     .slide4 p
	{
	color:#313333;
	font-size:1rem;
	font-family:"Trebuchet MS",sans-serif;
        }	
     .slide3 p
	{
	color:#313333;
	font-size:1rem;
	font-family:"Trebuchet MS",sans-serif;
        }	
     .slide2 p
	{
	color:#313333;
	font-size:1rem;
	font-family:"Trebuchet MS",sans-serif;
        }	
     .slide1 p
	{
	color:#313333;
	font-size:1rem;
	font-family:"Trebuchet MS",sans-serif;
        }	


.residential-wrap
{
display:flex;
flex-wrap:wrap;
flex-direction:row;
height:1700px;
width:100%;
background-color:#313333;
}

.residential-main-wrap
{
display:flex;
flex-wrap:wrap;
flex-direction:row;
height:1700px;
width:400px;
margin:auto;
}

.residential-main-page
{
height:400px;
width:400px;
background-color:#313333;
}

.residential-image1
{
height:400px;
width:400px;
overflow:hidden;
transform:translate(0%, 20%);
margin:auto;
}

	.residential-image1 img
		{
		height:100%;
		width:100%;
		}

.residential-paragraph
{
height:1000px;
width:400px;
}

	.residential-paragraph p
		{
		color:gray;
		font-size:1.4rem;
		font-family:"Trebuchet MS",sans-serif;
        	}	

.commercial-anchor
{
height:400px;
width:100%;
background-color:#313333;
}


.com-wrap
{
width:400px;
height:300px;
display:flex;
flex-wrap:wrap;
flex-direction:columns;
gap:10px;
margin:0px auto;
transform:skew(0deg);
background-color:#313333;
}

.links
{
display:flex;
align-items:center;
justify-content:center;
margin:10px auto;
height:50px;
width:290px;
background-color:#eb5534;
}

	.links p
	{
	font-family:"Trebuchet MS",sans-serif;
	color:black;
	font-size:0.9rem;
	}

	.links p:hover
	{
	font-family:"Trebuchet MS",sans-serif;
	color:gray;
	font-size:0.9rem;
	}

.best-offer
{
height:1200px;
width:100%;
background-color:#313333;
}

.best-offer-wrap
{
display:flex;
flex-wrap:wrap;
flex-direction:column;
align-items:center;
justify-content:center;
height:1200px;
width:400px;
margin:0px auto;
}

	.window-film
	{
	display:flex;
	justify-content:center;
	height:300px;
	width:300px;
 	border-radius:25px;
	margin:10px 0px;
	}
	
	.image-film
	{
	border-radius:50%;
	height:200px;
	width:200px;
	margin:5px 0px;
	}

	.window-film img
	{
	height:100%;
	width:100%;
	border-radius:50%;
	}

	.browse
	{
	display:flex;
	align-items:center;
	justify-content:center;
	height:50px;
	width:200px;
	margin:20px 0px;
	}
		



}



/*TABLET ===========================*/
@media screen and (min-width:768px) and (max-width:1025px)
{
.tulsa-residential
{
height:800px;
width:100%;
background-size:cover;
background-color:#313333;
background-image:url('images/homepage-background.webp');
}


.residential-header
{
display:flex;
flex-direction:row;
flex-wrap:wrap;
height:800px;
width:400px;
margin:0px auto;
}

.residential-keywords
{
display:flex;
align-items:center;
justify-content:center;
height:400px;
width:400px;
margin:auto;
animation-name:keywords;
animation-duration:3s;
transform:translate(0%,0%);
}

	
	@keyframes keywords{
	0% {opacity:0}
	100% {opacity:1}
			}

h1
{
color:#313333;
font-size:2rem;
font-family:"Trebuchet MS",sans-serif;
}

.benifits
{
display:none;
flex-wrap:wrap;
flex-direction:row;
justify-content:center;
height:300px;
width:400px;
margin:5px auto;
}

.quotes-call
{
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
height:60px;
width:400px;
gap:5px;
transform:translate(0%,100%);
}

.call-us
{
display:flex;
justify-content:center;
align-items:center;
height:50px;
width:240px;
background-color:orange;
border:3px solid white;
}


	.call-us p
	{
	color:white;
	font-size:1.4rem;
	font-family:"Trebuchet MS",sans-serif;
	}

 	.call-us:hover
	{
	background-color:#313333;	
	}


	.call-us:hover
	{
	background-color:#313333;
	color:white;
	}




.slide1
{
display:flex;
align-items:center;
justify-content:center;
height:40px;
width:280px;
border:5px solid white;
background-color:#eb5534;
animation-name:slide1;
animation-duration:1s;
}

	
	
	@keyframes slide1{
	0% {opacity:0}
	100% {opacity:1}
			}

	
.slide2
{
display:flex;
align-items:center;
justify-content:center;
height:40px;
width:280px;
border:5px solid white;
background-color:#eb9e34;
animation-name:slide2;
animation-duration:2s;
}

	
	@keyframes slide2{
	0% {opacity:0}
	100% {opacity:1}
			}

	

.slide3
{
display:flex;
align-items:center;
justify-content:center;
height:40px;
width:280px;
border:5px solid white;
background-color:#ebde34;
animation-name:slide3;
animation-duration:3s;
}

	@keyframes slide3{
	0% {opacity:0}
	100% {opacity:1}
			}


.slide4
{
display:flex;
align-items:center;
justify-content:center;
height:40px;
width:280px;
border:5px solid white;
background-color:#abeb34;
animation-name:slide4;
animation-duration:4s;
}

	
	@keyframes slide4{
	0% {opacity:0}
	100% {opacity:1}
			}
		


     .slide4 p
	{
	color:#313333;
	font-size:1rem;
	font-family:"Trebuchet MS",sans-serif;
        }	
     .slide3 p
	{
	color:#313333;
	font-size:1rem;
	font-family:"Trebuchet MS",sans-serif;
        }	
     .slide2 p
	{
	color:#313333;
	font-size:1rem;
	font-family:"Trebuchet MS",sans-serif;
        }	
     .slide1 p
	{
	color:#313333;
	font-size:1rem;
	font-family:"Trebuchet MS",sans-serif;
        }	


.residential-wrap
{
display:flex;
flex-wrap:wrap;
flex-direction:column;
height:1700px;
width:100%;
background-color:#313333;
}

.residential-main-wrap
{
display:flex;
flex-wrap:wrap;
flex-direction:row;
height:1700px;
width:400px;
margin:auto;
}

.residential-main-page
{
height:400px;
width:400px;
background-color:#313333;
}

.residential-image1
{
height:400px;
width:400px;
overflow:hidden;
transform:translate(0%, 20%);
margin:auto;
}

	.residential-image1 img
		{
		height:100%;
		width:100%;
		}

.residential-paragraph
{
height:1000px;
width:400px;
}

	.residential-paragraph p
		{
		color:gray;
		font-size:1.4rem;
		font-family:"Trebuchet MS",sans-serif;
        	}	

.commercial-anchor
{
height:400px;
width:100%;
background-color:#313333;
}


.com-wrap
{
width:400px;
height:300px;
display:flex;
flex-wrap:wrap;
flex-direction:columns;
gap:10px;
margin:0px auto;
transform:skew(0deg);
background-color:#313333;
}

.links
{
display:flex;
align-items:center;
justify-content:center;
margin:10px auto;
height:50px;
width:290px;
background-color:#eb5534;
}

	.links p
	{
	font-family:"Trebuchet MS",sans-serif;
	color:black;
	font-size:0.9rem;
	}

	.links p:hover
	{
	font-family:"Trebuchet MS",sans-serif;
	color:gray;
	font-size:0.9rem;
	}

.best-offer
{
height:1200px;
width:100%;
background-color:#313333;
}

.best-offer-wrap
{
display:flex;
flex-wrap:wrap;
flex-direction:column;
align-items:center;
justify-content:center;
height:1200px;
width:400px;
margin:0px auto;
}

	.window-film
	{
	display:flex;
	justify-content:center;
	height:300px;
	width:300px;
 	border-radius:25px;
	margin:10px 0px;
	}
	
	.image-film
	{
	border-radius:50%;
	height:200px;
	width:200px;
	margin:5px 0px;
	}

	.window-film img
	{
	height:100%;
	width:100%;
	border-radius:50%;
	}

	.browse
	{
	display:flex;
	align-items:center;
	justify-content:center;
	height:50px;
	width:200px;
	margin:20px 0px;
	}
		



}



/*PC==============================*/
@media screen and (min-width:1025px) and (max-width:1440px)
{
.tulsa-residential
{
height:800px;
width:100%;
background-size:cover;
background-color:#313333;
background-image:url('images/homepage-background.webp');
}


.residential-header
{
display:flex;
flex-direction:row;
flex-wrap:wrap;
height:800px;
width:900px;
margin:0px auto;
}

.residential-keywords
{
display:flex;
align-items:center;
height:300px;
width:900px;
margin:auto;
animation-name:keywords;
animation-duration:3s;
transform:translate(0%,0%);
}

	
	@keyframes keywords{
	0% {opacity:0}
	100% {opacity:1}
			}

h1
{
color:#313333;
font-size:3rem;
font-family:"Trebuchet MS",sans-serif;
}

.benifits
{
display:none;
flex-wrap:wrap;
flex-direction:row;
justify-content:center;
height:300px;
width:400px;
margin:5px auto;
}

.quotes-call
{
display:flex;
align-items:center;
justify-content:center;
flex-direction:row;
flex-wrap:wrap;
height:60px;
width:400px;
gap:5px;
transform:translate(0%,100%);
}

.call-us
{
display:flex;
justify-content:center;
align-items:center;
height:50px;
width:240px;
background-color:orange;
border:3px solid white;
}


	.call-us p
	{
	color:white;
	font-size:1.4rem;
	font-family:"Trebuchet MS",sans-serif;
	}

 	.call-us:hover
	{
	background-color:#313333;	
	}


	.call-us:hover
	{
	background-color:#313333;
	color:white;
	}




.slide1
{
display:flex;
align-items:center;
justify-content:center;
height:40px;
width:280px;
border:5px solid white;
background-color:#eb5534;
animation-name:slide1;
animation-duration:1s;
}

	
	
	@keyframes slide1{
	0% {opacity:0}
	100% {opacity:1}
			}

	
.slide2
{
display:flex;
align-items:center;
justify-content:center;
height:40px;
width:280px;
border:5px solid white;
background-color:#eb9e34;
animation-name:slide2;
animation-duration:2s;
}

	
	@keyframes slide2{
	0% {opacity:0}
	100% {opacity:1}
			}

	

.slide3
{
display:flex;
align-items:center;
justify-content:center;
height:40px;
width:280px;
border:5px solid white;
background-color:#ebde34;
animation-name:slide3;
animation-duration:3s;
}

	@keyframes slide3{
	0% {opacity:0}
	100% {opacity:1}
			}


.slide4
{
display:flex;
align-items:center;
justify-content:center;
height:40px;
width:280px;
border:5px solid white;
background-color:#abeb34;
animation-name:slide4;
animation-duration:4s;
}

	
	@keyframes slide4{
	0% {opacity:0}
	100% {opacity:1}
			}
		


     .slide4 p
	{
	color:#313333;
	font-size:1rem;
	font-family:"Trebuchet MS",sans-serif;
        }	
     .slide3 p
	{
	color:#313333;
	font-size:1rem;
	font-family:"Trebuchet MS",sans-serif;
        }	
     .slide2 p
	{
	color:#313333;
	font-size:1rem;
	font-family:"Trebuchet MS",sans-serif;
        }	
     .slide1 p
	{
	color:#313333;
	font-size:1rem;
	font-family:"Trebuchet MS",sans-serif;
        }	


.residential-wrap
{
display:flex;
flex-wrap:wrap;
flex-direction:column;
height:1700px;
width:100%;
background-color:#313333;
}

.residential-main-wrap
{
display:flex;
flex-wrap:wrap;
flex-direction:row;
height:1700px;
width:400px;
margin:auto;
}

.residential-main-page
{
height:400px;
width:400px;
background-color:#313333;
}

.residential-image1
{
height:400px;
width:400px;
overflow:hidden;
transform:translate(0%, 20%);
margin:auto;
}

	.residential-image1 img
		{
		height:100%;
		width:100%;
		}

.residential-paragraph
{
height:1000px;
width:400px;
}

	.residential-paragraph p
		{
		color:gray;
		font-size:1.4rem;
		font-family:"Trebuchet MS",sans-serif;
        	}	

.commercial-anchor
{
height:200px;
width:100%;
background-color:#313333;
}


.com-wrap
{
width:600px;
height:160px;
display:flex;
flex-wrap:wrap;
flex-direction:columns;
margin:0px auto;
transform:skew(0deg);
background-color:#313333;
}

.links
{
display:flex;
align-items:center;
justify-content:center;
margin:10px auto;
height:50px;
width:290px;
background-color:#eb5534;
}

	.links p
	{
	font-family:"Trebuchet MS",sans-serif;
	color:black;
	font-size:0.9rem;
	}

	.links p:hover
	{
	font-family:"Trebuchet MS",sans-serif;
	color:gray;
	font-size:0.9rem;
	}

.best-offer
{
height:400px;
width:100%;
background-color:#313333;
}

.best-offer-wrap
{
display:flex;
flex-wrap:wrap;
flex-direction:column;
align-items:center;
justify-content:center;
height:400px;
width:900px;
margin:0px auto;
}

	.window-film
	{
	display:flex;
	justify-content:center;
	height:300px;
	width:280px;

 	border-radius:25px;
	}
	
	.image-film
	{
	border-radius:50%;
	height:200px;
	width:200px;
	margin:5px 0px;
	}

	.window-film img
	{
	height:100%;
	width:100%;
	border-radius:50%;
	}

	.browse
	{
	display:flex;
	align-items:center;
	justify-content:center;
	height:50px;
	width:200px;
	margin:20px 0px;
	}



}
