@charset "utf-8";
/* CSS Document */

@media (min-width: 300px) and (max-width: 900px) and (orientation: portrait){
body {
    clear: none;
    float: left;
    width: 100%;
    /*background-color: white;*/
    margin: 0%;
    padding: 0%;
    /*	font-family: Constantia, "Lucida Bright", "DejaVu Serif", Georgia, "serif";*/
    font-family: 'Sora';
    font-style: normal;
    font-weight: 400;
}

a { clear: none; color: inherit; text-decoration: none;}
	a:hover { clear: none; color: inherit; text-decoration: none;}
	a:visited { clear: none; color: inherit; text-decoration: none;}

   #links {
    	color:red;
    	font-style: normal;
    	font-weight:900;
    }
#background-video {
  width: 100vw;
  height: 100vh;
  object-fit: cover;
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: -1;
}  
#background-video-mobile {
  width: 1px;
  height: 1px;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: -1;
	visibility: hidden;
}   
	img{
		margin: 0%;
		padding: 0%;
		display: block;
		
	}

/*=====================================*/
/*=====================================*/
	
	
#photo{
	clear: none;
	float: left;
	width: 18%;
	margin: 1%;
	border: inherit thin solid;
	visibility: hidden;
}

.gallery {
	clear: none;
	float: left;
    gap: 10px;
	visibility: hidden;
}

.gallery img {
	clear: none;
	float:left;
    width: 90%;
    cursor: pointer;
    transition: transform 0.2s;
	visibility: hidden;
}

.gallery img:hover {
    transform: scale(1.1);
	visibility: hidden;
}

.expanded-image {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.8);
    justify-content: center;
    align-items: center;
	visibility: hidden;
}

.expanded-image img {
    max-width: 90%;
    max-height: 90%;
	visibility: hidden;
}

.expanded-image span {
    position: absolute;
    top: 20px;
    right: 30px;
    font-size: 40px;
    color: white;
    cursor: pointer;
	visibility: hidden;
}

	
	#mobile-container{
		visibility: visible;
		width: 90%;
		margin: 1% 5%;
	}
	
	
	
	
	
	
	
	
	
	
/*=====================================*/	
	
	

	
	#header{
		clear: none;
		float: left;
		width: 100%;
		margin: 0%;
		padding: 0%;
		background-color: #000000;
		position: fixed;
		
	}
	#header-temp{
		clear: none;
		float: left;
		width: 100%;
		margin: 0%;
		padding: 0%;
		text-align: center;
		font-size: 300%;
	}
	#main-content{
		clear: none;
		float: left;
		width: 100%;
		margin: 36%0%0%0%;
		padding: 0%;
		
	}
	#main-content-contact-us{
		clear: none;
		float: left;
		width: 100%;
		margin: 6%0%0%0%;
		padding: 0%;
		
	}
	#main-content-portfolio{
		clear: none;
		float: left;
		width: 100%;
		margin: 18%0%0%0%;
		padding: 3%0%;
		background-color: rgba(31,31,31,1.00);
		
	}
	#footer{
		clear: none;
		float: left;
		width: 100%;
		background-color: #1F1F1F;
	}
	#site-map{
		clear: none;
		float: left;
		width: 90%;
		margin: 1%5%;
		padding: 1.5% 0%;
		color: antiquewhite;
		border-bottom: #FDF4E8 thin solid;
		
	}
	#site-map-logo{
		clear: none;
		float: left;
		width: 30%;
		margin: 0%35%;
		padding: 0%;
		text-align: center;
		
	}
	
	#certificates-box{
		clear: none;
		float: left;
		width: 100%;
		margin: 0%;
		padding: 0%;
		text-align: center;
	}
	#certificate-swam{
		clear: none;
		float: left;
		width: 90%;
		margin: 4% 5% 0% 5%;
		padding: 0%;
		text-align: center;
	}
	#celebrating10years{
		clear: none;
		float: left;
		width: 90%;
		margin: 4% 5% 0% 5%;
		padding: 0%;
		text-align: center;
	}
	#certificate-aci{
		clear: none;
		float: left;
		width: 90%;
		margin: 2%5%9%5%;
		padding: 0%0%0%15%;
		text-align: center;
		background-color: white;
	}
	
	#block1{
		clear: none;
		float: left;
		width: 30%;
		margin: 0%1.666%;
	}
	#block2{
		clear: none;
		float: left;
		width: 30%;
		margin: 0%1.666%;
	}
	#block3{
		clear: none;
		float: left;
		width: 30%;
		margin: 0%1.666%;
	}
	
	#copyrights{
		clear: none;
		float: left;
		width: 100%;
		margin: 1%0%;
		padding: 0%;
		text-align: center;
		color: #7B0002
	}
	#copyrights-logo{
		clear: none;
		float: left;
		width: 30%;
		margin: 1%35%;
		padding: 0%;
		text-align: center;
	}
	
	
	
	
	#logo{
		clear: none;
		float: left;
		width: 60%;
		margin: 0%1%0%21%;
		padding: 0%;
		text-align: center;
	}
	#menu{
		clear: none;
		float: left;
		width: 70%;
		margin: 1%;
		padding: 0%;
	}
	#boton-home{
		clear: none;
		float: left;
		width: 1px;
		margin: 0px;
		padding: 0px;
		background-color: black;
		color: black;
		text-align: center;
		font-size:1px;
		visibility: hidden;
	}
	#boton-home-mobile{
		clear: none;
		float: left;
		width: 30%;
		margin: 9%1%1%3%;
		padding: 1%0%;
		background-color: #212121;
		color: antiquewhite;
		text-align: center;
		font-size:85%;
	}
	#boton-home-mobile-current{
		clear: none;
		float: left;
		width: 30%;
		margin: 9%1%1%3%;
		padding: 1%0%;
		background-color:antiquewhite ;
		color: #212121;
		text-align: center;
		font-size:85%;
	}
	#boton-contact{
		clear: none;
		float: left;
		width: 1px;
		margin: 0px;
		padding: 0px;
		background-color: black;
		color: black;
		text-align: center;
		font-size:1px;
		visibility: hidden;
	}
	#boton-contact-mobile{
		clear: none;
		float: left;
		width: 30%;
		margin: 9%1%1%1%;
		padding: 1%0%;
		background-color: #212121;
		color: antiquewhite;
		text-align: center;
		font-size:85%;
	}
	#boton-contact-mobile-current{
		clear: none;
		float: left;
		width: 30%;
		margin: 9%1%1%1%;
		padding: 1%0%;
		background-color:antiquewhite ;
		color: #212121;
		text-align: center;
		font-size:85%;
	}
	#boton-portfolio{
		clear: none;
		float: left;
		width: 1px;
		margin: 0px;
		padding: 0px;
		background-color: black;
		color: black;
		text-align: center;
		font-size:1px;
		visibility: hidden;
	}
	#boton-portfolio-mobile{
		clear: none;
		float: left;
		width: 30%;
		margin: 9%1%1%1%;
		padding: 1%0%;
		background-color: #212121;
		color: antiquewhite;
		text-align: center;
		font-size:85%;
	}
	#boton-portfolio-mobile-current{
		clear: none;
		float: left;
		width: 30%;
		margin: 9%1%1%1%;
		padding: 1%0%;
		background-color:antiquewhite ;
		color: #212121;
		text-align: center;
		font-size:85%;
	}
	#page-message-image{
		clear: none;
		float: left;
		width: 60%;
		margin: 0%0%0%20%;
		padding: 3%;
	}
	#page-message{
		clear: none;
		float: left;
		width: 100%;
		height: 270px;
		margin: 0%;
		padding: 3%0%;
		text-align: center;
		font-size: 300%;
	}
		#page-name-home{
		clear: none;
		float: left;
		width: 100%;
		margin: 1%0%0%0%;
		background-color: #313F47;
		color: white;
		text-align: center;
	}
	#page-message-content{
		clear: none;
		float: left;
		width: 86%;
		margin: 3%6%;
		padding: 3%1%;
		color: aliceblue;
		text-align: center;
		font-size: 120%;
		border-left: aliceblue thin solid;
		border-right: aliceblue thin solid;
	}
	
	
	#page-title{
		clear: none;
		float: left;
		width: 100%;
		margin: 0%0%3%0%;
		padding: 1%0%1%0%;
		text-align: center;
		font-size: 300%;
	}
	#page-title-contact-us{
		clear: none;
		float: left;
		width: 100%;
		margin: 0%0%3%0%;
		padding: 3%0%0%0%;
		text-align: center;
		font-size: 300%;
	}
	#page-title-gallery{
		clear: none;
		float: left;
		width: 100%;
		margin: 21%0%3%0%;
		padding: 1%0%1%0%;
		text-align: center;
		font-size: 300%;
		color:aliceblue;
	}
	
	
	
	#experience{
		clear: none;
		float: left;
		width: 100%;
		margin: 0%;
		padding: 0%;
		background-color: whitesmoke;
		
	}
	#experience-image{
		clear: none;
		float: left;
		width: 100%;
		margin: 0%;
		padding: 0%;
		background-color: whitesmoke;
	}
	#experience-content{
		clear: none;
		float: left;
		width: 100%;
		margin: 0%;
		padding: 3%;
		background-color: black;
		color: #E7F2FF;
		font-size: 120%;
		
	}
	
	
	
	
	
	
	#trust-points{
		clear: none;
		float: left;
		width: 100%;
		margin: 0%;
		padding: 0%;
		background: #272B2E;
	}
	#trust-points-title{
		clear: none;
		float: left;
		width: 90%;
		margin: 3%;
		text-align: center;
		font-size: 120%;
		color: white;
		
	}
	#safety{
		clear: none;
		float: left;
		width:90%;
		margin: 5%;
		padding: 0%;
		color: white;
		
	}
	#safety-title{
		clear: none;
		float: left;
		width:90%;
		margin: 2%;
		padding: 0%;
		color: white;
		text-align:center;
		font-size:200%;
	}
	#safety-icon{
		clear: none;
		float: left;
		width:60%;
		margin: 2%18%;
		padding: 1%;
		border: white thin solid;
		color: white;
		text-align:center;
		font-size:600%;
	}
	#quality{
		clear: none;
		float: left;
		width:90%;
		margin: 5%;
		padding: 0%;
		color: white;
	}
	#quality-title{
		clear: none;
		float: left;
		width:90%;
		margin: 2%;
		padding: 0%;
		color: white;
		text-align:center;
		font-size:200%;
	}
	#quality-icon{
		clear: none;
		float: left;
		width:60%;
		margin: 2%18%;
		padding: 1%;
		border: white thin solid;
		color: white;
		text-align:center;
		font-size:600%;
	}
	#professionalism{
		clear: none;
		float: left;
		width:90%;
		margin: 5%;
		padding: 0%;
		color: white;
	}
	#professionalism-title{
		clear: none;
		float: left;
		width:90%;
		margin: 2%;
		padding: 0%;
		color: white;
		text-align:center;
		font-size:200%;
	}
	#professionalism-icon{
		clear: none;
		float: left;
		width:60%;
		margin: 2%18%;
		padding: 1%;
		border: white thin solid;
		color: white;
		text-align:center;
		font-size:600%;
	}
	
	
	
	#end-home-image{
		clear: none;
		float: left;
		width: 100%;
		margin: 0%;
		padding: 0%;
	}
	
/*==================CONTACT US====================*/
	/*==================CONTACT US====================*/
	/*==================CONTACT US====================*/
	/*==================CONTACT US====================*/
	/*==================CONTACT US====================*/
	/*==================CONTACT US====================*/
	/*==================CONTACT US====================*/
	/*==================CONTACT US====================*/
	/*==================CONTACT US====================*/
	
	
	
	#page-name-contact-us{
		clear: none;
		float: left;
		width: 100%;
		margin: 27%0%0%0%;
		padding: 9%0%;
		background-color: #313F47;
		color: white;
	}
	
	#page-name-home{
		clear: none;
		float: left;
		width: 100%;
		margin: 1%0%0%0%;
		background-color: #313F47;
		color: white;
		text-align: center;
	}
	
	#contact-options{
		clear: none;
		float: left;
		width: 100%;
		margin: 0%;
		padding: 0%;
		background: black;
		color: azure;
	}
	
	#contact-phone{
		clear: none;
		float: left;
		width: 98%;
		margin:6%1%;
		text-align:center;
		color: inherit;
		background-color: inherit;
		transition: ease-in-out 0.5s;
		
	}
	#contact-phone:hover{
		clear: none;
		float: left;
		width: 98%;
		margin:6%1%;
		text-align:center;
		color: black;
		background-color: azure;
		transition: ease-in-out 0.1s;
		
	}
	#contact-phone-title{
		clear:none;
		float:left;
		width:100%;
		margin:0%;
		padding:1%0%;
		font-size:300%;
		border-bottom:grey thin solid;
	}
	#contact-phone-number{
		clear:none;
		float:left;
		width:100%;
		margin:0%;
		padding:1%0%;
		font-size:201%;
	}
	
	#contact-email{
		clear: none;
		float: left;
		width: 98%;
		margin:6%1%;
		text-align:center;
		
	}
	#contact-email:hover{
		clear: none;
		float: left;
		width: 98%;
		margin:6%1%;
		text-align:center;
		color: black;
		background-color: azure;
		transition: ease-in-out 0.1s;
	}
	#contact-email-title{
		clear:none;
		float:left;
		width:100%;
		margin:0%;
		padding:1%0%;
		font-size:300%;
		border-bottom:grey thin solid;
	}
	#contact-email-address{
		clear:none;
		float:left;
		width:100%;
		margin:0%;
		padding:1%0%;
		font-size:120%;
	}
	
	#contact-address{
		clear: none;
		float: left;
		width: 98%;
		margin:6%1%;
		text-align:center;
		
	}
	#contact-address:hover{
		clear: none;
		float: left;
		width: 98%;
		margin:6%1%;
		text-align:center;
		color: black;
		background-color: azure;
		transition: ease-in-out 0.1s;
	}
	#contact-address-title{
		clear:none;
		float:left;
		width:100%;
		margin:0%;
		padding:1%0%;
		font-size:300%;
		border-bottom:grey thin solid;
	}
	#contact-address-box{
		clear:none;
		float:left;
		width:100%;
		margin:0%;
		padding:1%0%;
		font-size:201%;
	}
	#contact-hours{
		clear: none;
		float: left;
		width: 31%;
		margin:1%;
		text-align:center;
		color: inherit;
		background-color: inherit;
		transition: ease-in-out 0.5s;
		
	}
	#contact-hours:hover{
		clear: none;
		float: left;
		width: 31%;
		margin:1%;
		text-align:center;
		color: black;
		background-color: azure;
		transition: ease-in-out 0.5s;
		
	}
	#contact-hours-title{
		clear:none;
		float:left;
		width:100%;
		margin:0%;
		padding:1%0%;
		font-size:300%;
		border-bottom:grey thin solid;
		text-align:center;
	}
	#contact-hours-number{
		clear:none;
		float:left;
		width:100%;
		margin:0%;
		padding:1%0%;
		font-size:201%;
		text-align:center;
	}
	
	
	/*==================PORTFOLIO====================*/
	/*==================PORTFOLIO====================*/
	/*==================PORTFOLIO====================*/
	/*==================PORTFOLIO====================*/
	/*==================PORTFOLIO====================*/
	/*==================PORTFOLIO====================*/
	/*==================PORTFOLIO====================*/
	/*==================PORTFOLIO====================*/
	/*==================PORTFOLIO====================*/
	
	#gallery-1{
		clear:none;
		float:left;
		width:300px;
		height:300px;
		margin:1%1%1%12%;
		padding:1%;
		text-align:center;
		border:black thin solid;
		font-size:200%;
		background-image: url("images/portfolio/Amphitheater/cover.jpg");
		background-size: cover;
		color: azure;
	}
	#gallery-title{
		clear:none;
		float:left;
		width:100%;
		margin:6%0%0%0%;
		background-color:rgba(28,43,55,0.54);
	}
	#gallery-2{
		clear:none;
		float:left;
		width:300px;
		height:300px;
		margin:1%1%1%12%;
		padding:1%;
		text-align:center;
		border:black thin solid;
		font-size:200%;
		background-image: url("images/portfolio/aquatics/cover.jpg");
		background-size: cover;
		color: azure;
	}
	#gallery-title2{
		clear:none;
		float:left;
		width:100%;
		margin:6%0%0%0%;
		background-color:rgba(28,43,55,0.54);
	}
	#gallery-3{
		clear:none;
		float:left;
		width:300px;
		height:300px;
		margin:1%1%1%12%;
		padding:1%;
		text-align:center;
		border:black thin solid;
		font-size:200%;
		background-image: url("images/portfolio/data-centers/cover.jpg");
		background-size: cover;
		color: azure;
	}
	#gallery-title3{
		clear:none;
		float:left;
		width:100%;
		margin:6%0%0%0%;
		background-color:rgba(28,43,55,0.54);
	}
	
	
	
	#gallery-4{
		clear:none;
		float:left;
		width:300px;
		height:300px;
		margin:1%1%1%12%;
		padding:1%;
		text-align:center;
		border:black thin solid;
		font-size:200%;
		background-image: url("images/portfolio/pre-fab/cover.jpg");
		background-size: cover;
		color: azure;
	}
	#gallery-title4{
		clear:none;
		float:left;
		width:100%;
		margin:6%0%0%0%;
		background-color:rgba(28,43,55,0.54);
	}
	#gallery-5{
		clear:none;
		float:left;
		width:300px;
		height:300px;
		margin:1%1%1%12%;
		padding:1%;
		text-align:center;
		border:black thin solid;
		font-size:200%;
		background-image: url("images/portfolio/recreational-facilities/cover.jpg");
		background-size: cover;
		color: azure;
	}
	#gallery-title5{
		clear:none;
		float:left;
		width:100%;
		margin:6%0%0%0%;
		background-color:rgba(28,43,55,0.54);
	}
	#gallery-6{
		clear:none;
		float:left;
		width:300px;
		height:300px;
		margin:1%1%1%12%;
		padding:1%;
		text-align:center;
		border:black thin solid;
		font-size:200%;
		background-image: url("images/portfolio/religious-facilities/IMG_4181.jpg");
		background-size: cover;
		color: azure;
	}
	#gallery-title6{
		clear:none;
		float:left;
		width:100%;
		margin:6%0%0%0%;
		background-color:rgba(28,43,55,0.54);
	}
	
	#gallery-7{
		clear:none;
		float:left;
		width:300px;
		height:300px;
		margin:1%1%1%12%;
		padding:1%;
		text-align:center;
		border:black thin solid;
		font-size:200%;
		background-image: url("images/portfolio/retail-centers/cover.jpg");
		background-size: cover;
		color: azure;
	}
	#gallery-title7{
		clear:none;
		float:left;
		width:100%;
		margin:6%0%0%0%;
		background-color:rgba(28,43,55,0.54);
	}
	
	#gallery-8{
		clear:none;
		float:left;
		width:300px;
		height:300px;
		margin:1%1%1%12%;
		padding:1%;
		text-align:center;
		border:black thin solid;
		font-size:200%;
		background-image: url("images/portfolio/schools/cover.jpg");
		background-size: cover;
		color: azure;
	}
	#gallery-title8{
		clear:none;
		float:left;
		width:100%;
		margin:6%0%0%0%;
		background-color:rgba(28,43,55,0.54);
	}
	#gallery-9{
		clear:none;
		float:left;
		width:300px;
		height:300px;
		margin:1%1%1%12%;
		padding:1%;
		text-align:center;
		border:black thin solid;
		font-size:200%;
		background-image: url("images/portfolio/storage-facilities/IMG_8718.JPG");
		background-size: cover;
		color: azure;
	}
	#gallery-title9{
		clear:none;
		float:left;
		width:100%;
		margin:6%0%0%0%;
		background-color:rgba(28,43,55,0.54);
	}
	#gallery-10{
		clear:none;
		float:left;
		width:300px;
		height:300px;
		margin:1%1%1%12%;
		padding:1%;
		text-align:center;
		border:black thin solid;
		font-size:200%;
		background-image: url("images/portfolio/tilt-wall/imagejpeg_1.jpeg");
		background-size: cover;
		color: azure;
	}
	#gallery-title10{
		clear:none;
		float:left;
		width:100%;
		margin:6%0%0%0%;
		background-color:rgba(28,43,55,0.54);
	}
	
	
		
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
}