h1, h2, h3 {
font-family: 'Oswald', sans-serif;
}
.main_logo_font{margin-top:40px;font-size: 109px;}

} 
h1 {
color: #fff;
font-size: 120px;
font-weight: 700;
text-transform: uppercase;
position: relative;
z-index: 150;
margin-bottom: 70px; }
h1.small {
font-size: 90px;
margin-bottom: 40px; }
h2 {
font-size: 60px;
font-weight: 700;
color: #328bb0;
text-transform: uppercase;
text-align: center;
margin-top: 90px;
margin-bottom: 80px; }
h2.white {
color: #fff; }
span.lines {
border-top: 1px solid #83bbd3;
border-bottom: 1px solid #83bbd3; }
h3 {
font-size: 30px;
text-transform: uppercase;
font-weight: 600;
color: #328bb0; }
h3.white {
color: #fff; }
h4 {
font-family: 'Source Sans Pro', sans-serif;
font-size: 36px;
font-weight: 600;
color: #fff;
text-transform: uppercase; }
5 {font-family: 'Source Sans Pro', sans-serif;
font-size: 24px;
font-weight: 600;
text-transform: uppercase;
color: #fff;}
p {
font-family: 'Source Sans Pro', sans-serif;
font-size: 16px;
font-weight: 400;
line-height: 23px;
color: #226885;    padding: 0 15px;}
  
p.white {
color: #f9f9f9;}
.button1,input[type="submit"],input[type="reset"],input[type="button"] {
background: #226885;
border: 0;
color: #fff;
display: inline-block;
font-size: 15px;
font-weight: 400;
text-transform: uppercase;
text-decoration: none;
cursor: pointer;
margin-bottom: 20px;
line-height: normal;
padding: 6px 10px;
font-family: 'Source Sans Pro', sans-serif; }
.button1:hover,input[type="submit"]:hover,input[type="reset"]:hover,input[type="button"]:hover {
color: #226885;
background: #e8e8e8;
border: 0; }
.button1:active,button1:active,input[type="submit"]:active,input[type="reset"]:active,input[type="button"]:active {
color: #226885;
background: #e8e8e8;
border: 0;}
.button2 {
background: #e8e8e8;
border: 0;
color: #226885;
display: inline-block;
font-size: 15px;
font-weight: 400;
text-transform: uppercase;
text-decoration: none;
cursor: pointer;
line-height: normal;
padding: 6px 10px;
font-family: 'Source Sans Pro', sans-serif; }





.button3,input[type="submit"],input[type="reset"],input[type="button"] {
    background: #226885;
    border: 0;
    color: #fff;
    display: inline-block;
    font-size: 20px;
    /* font-weight: 400; */
    text-transform: uppercase;
    text-decoration: none;
    cursor: pointer;
    margin-bottom: 20px;
    line-height: normal;
    padding: 17px 16px;
    font-family: 'Source Sans Pro', sans-serif;
 }
.button3:hover,input[type="submit"]:hover,input[type="reset"]:hover,input[type="button"]:hover {
color: #fff;
background: #e8e8e8;
border: 0; }
.button3:active,button1:active,input[type="submit"]:active,input[type="reset"]:active,input[type="button"]:active {
color: #226885;
background: #e8e8e8;
border: 0;}





.button2:hover {
color: #e8e8e8;
background: #226885;
border: 0; }
.button1::-moz-focus-inner,input::-moz-focus-inner {
border: 0;
padding: 0;}
.action {
margin-top: 50px;
padding: 40px 0 20px 0;
text-align: center;
border-top: 1px solid #83bbd3;}
.action p {
font-size: 22px;
font-weight: 600;
color: #83bbd3;}
.action p.white {
color: #ececec;}
p.separator {
font-size: 30px;
font-weight: 600;
font-style: italic;
color: #fff;
line-height: 38px;
text-transform: uppercase;
position: relative;
z-index: 200;
text-align: center;
padding-top: 240px;}
#separator1 {
width: 100%;
height: 500px;
position: relative;}
#separator1 .bg2 {
background: url(../images/bg2.jpg) repeat 0 0 fixed;
margin: 0 auto;
padding: 0;
position: absolute;
z-index: 200;
width: 100%;
height: 500px;}
#separator2 {
width: 100%;
height: 500px;
position: relative;}
#separator2 .bg3 {
background: url(../images/bg3.jpg) repeat 0 0 fixed;
margin: 0 auto;
padding: 0;
position: absolute;
z-index: 200;
width: 100%;
height: 500px;}
#separator3 {
width: 100%;
height: 500px;
position: relative;}
#separator3 .bg4 {
background: url(../images/bg4.jpg) repeat 0 0 fixed;
margin: 0 auto;
padding: 0;
position: absolute;
z-index: 200;
width: 100%;
height: 500px;}
nav {background: #fff;
width: 100%;
position: relative;
z-index: 1000;
text-align: center;
height: 80px;
-webkit-box-shadow: 0px 3px 3px 0px rgba(0, 0, 0, 0.3);
box-shadow: 0px 3px 3px 0px rgba(0, 0, 0, 0.3);}
nav ul {
padding-top: 30px;}
nav ul li {
display: inline;
border-right: 1px solid #b5d0db;
padding: 30px 26px 30px 26px;
margin: 0;}
nav ul li:first-child {
border-left: 0px solid #b5d0db;}
nav a {
font-family: 'Source Sans Pro', sans-serif;
font-size: 16px;
color: #83bbd3;
font-weight: 300;
text-decoration: none;
text-transform: uppercase;}
nav a:visited {
color: #83bbd3;}
nav a:hover {
color: #226885;}
#intro {
width: 100%;
height: 900px;
text-align: center;}
#intro .bg1 {
background: url(../images/bg1.jpg) 0 0 repeat fixed;
margin: 0 auto;
padding: 0;
position: absolute;
z-index: -100;
width: 100%;
height: 900px;}
.title {
position: fixed;
width: 100%;
text-align: center;
z-index: 150px;
padding-top: 70px;}
.intro-line {
position: relative;
z-index: 150;
border-top: 1px solid #b5d0db;
width: 670px;
margin: 0 auto 50px auto;}
.title p {
font-size: 24px;
line-height: 30px;
color: #fff;
position: relative;
z-index: 150;}
.social-intro {
margin-top: 45px;
position: relative;
z-index: 150;}
.social-intro ul li {
display: inline;
margin: 0 5px;}
.social-intro a {
opacity: 0.7;}
.social-intro a:hover {
opacity: 1;}

#work {
background: #fff;
position: relative;

padding-top: 20px;
padding-bottom: 40px;
-webkit-box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.9);}

#second {
background: #fff;
position: relative;

padding-top: 20px;
padding-bottom: 40px;
-webkit-box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.9);}

#termo {
background: #fff;
position: relative;

padding-top: 20px;
padding-bottom: 40px;
-webkit-box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.9);
box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.9);}


.flexslider {
margin-top: 40px;}
p.mid-text {
margin-top: 40px;}
.portfolio {
text-align: center;
margin-top: 40px;}
p.proj-title {
margin-bottom: 5px;
padding-bottom: 2px;
text-transform: uppercase;}
p.proj-desc {
margin-bottom: 35px;
padding-bottom: 2px;}
#services {
background: url(../images/bg-dark.jpg) repeat;
position: relative;
z-index: 300;
padding-top: 40px;
padding-bottom: 40px;
-webkit-box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.9);
box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.9);}
.serv-list {
text-align: center;
margin-top: 60px;}
.serv-list h4 {
margin-bottom: 50px;}
.serv-list p {
margin-top: 35px;}
.pricing {
text-align: center;
margin-bottom: 20px;}
.pricing h3 {
margin-top: 70px;
margin-bottom: 60px;}
p.p-name {
background: url(../images/price-name-bg.jpg) repeat;
font-size: 22px;
font-weight: 600;
text-transform: uppercase;
padding: 12px 0 8px 0;
margin: 0;
color: #fff;}
p.p-price {
background: url(../images/price-bg.jpg) repeat;
font-size: 28px;
font-weight: 600;
text-transform: uppercase;
color: #fff;
padding: 20px 0 16px 0;
margin: 0;}
span.p-small {
font-size: 14px;
color: #a0a0a0;}
.pricing ul {
background: url(../images/price-feat-bg.jpg) repeat;
margin: 0;}
.pricing ul li {
font-size: 14px;
text-transform: uppercase;
color: #d7d7d7;
border-bottom: 1px solid #333333;
padding: 10px 0;margin: 0;}
.signup {
padding: 14px 0;
margin-bottom: 30px;}
.signup button2 {
margin: 0;}
.signup {
background: url(../images/price-bg.jpg) repeat;}
#about {background: #fff;position: relative;z-index: 300;padding-top: 40px;padding-bottom: 40px;-webkit-box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.9);box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.9);}.skills {margin-top: 50px;}.skills h3 {text-align: center;margin-bottom: 30px;}.skills p {font-size: 14px;text-transform: uppercase;margin: 0;line-height: 18px;}.skill-bg {background: #e5e5e5;position: relative;width: 100%;height: 31px;margin-bottom: 15px;}.skill1 {background: #d1d1d1;width: 63%;height: 31px;}.skill2 {background: #c8c7c7;width: 72%;height: 31px;}.skill3 {background: #bdbdbd;width: 77%;height: 31px;}.skill4 {background: #b3b2b2;width: 85%;height: 31px;}.skill5 {background: #a9a8a8;width: 90%;height: 31px;}.team {margin-top: 60px;text-align: center;}.team h3 {margin-bottom: 50px;}p.t-name {font-size: 20px;font-weight: 600;text-transform: uppercase;color: #424242;margin-top: 15px;margin-bottom: 0;}p.t-type {font-size: 16px;font-weight: 300;font-style: italic;color: #707070;margin-bottom: 10px;}.team ul {margin-bottom: 10px;}.team ul li {display: inline;margin: 0 3px;}.team ul a:hover {opacity: 0.7;}
#contact {background: url(../images/bg-dark.jpg) repeat;position: relative;z-index: 300;padding-top: 20px;-webkit-box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.9);box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.9);}
.done {font-family: 'Source Sans Pro', sans-serif;color: #fff;font-size: 14px;margin-bottom: 15px;padding: 10px;display: none;}
.contact-form {position: relative;z-index: 300;margin-top: 20px;}
.contact-form p {font-family: 'Source Sans Pro', sans-serif;font-size: 14px;color: #fff;text-transform: uppercase;margin-bottom: 2px;}
.contact-form input {background: url(../images/cont-form-bg.jpg) repeat;width: 98%;height: 28px;margin-bottom: 10px;padding-left: 4px;font-family: 'Source Sans Pro', sans-serif;font-weight: 400;font-size: 16px;color: #fff;border: 0;}
.contact-form textarea {background: url(../images/cont-form-bg.jpg) repeat;margin-bottom: 10px;padding-left: 5px;font-family: 'Source Sans Pro', sans-serif;font-weight: 400;font-size: 16px;color: #fff;width: 98%;height: 125px;border: 0;}
.contact-form input.submit-button {background: #e8e8e8;border: 0;color: #226885;display: inline-block;font-size: 14px;font-weight: 400;text-transform: uppercase;text-decoration: none;cursor: pointer;margin-bottom: 20px;line-height: 0;padding: 3px 4px 0 4px;font-family: 'Source Sans Pro', sans-serif; width: 60px;height: 24px;}
.contact-form input.submit-button:hover {color: #e8e8e8;background: #226885;border: 0; }
.contact-info {margin-top: 50px;}
.contact-info h3 {margin-bottom: 80px;}
.contact-info img {vertical-align: middle;margin-right: 10px;}
.social {padding-top: 15px;}
.social ul li {display: inline;margin-right: 5px;}
.social img:hover {opacity: 0.7;}
.copyright {border-top: 1px solid #858585;text-align: center;margin-top: 30px;padding-top: 30px;}
.copyright p {color: #858585;font-size: 14px;}
@media only screen and (max-width: 959px) {
	.title {position: relative;}}
	
	@media only screen and (min-width: 768px) and (max-width: 959px) {}
	@media only screen and (max-width: 767px) {}
	@media only screen and (min-width: 480px) and (max-width: 767px) {}
	@media only screen and (max-width: 479px) {
		#intro {height: 430px;}
		.title {position: relative;padding-top: 30px;}
		.intro-line {display: none;}
		h1 {font-size: 60px;margin-bottom: 20px;}
		h1.small {font-size: 30px;margin-bottom: 20px;}
		.title p {font-size: 15px;
        line-height: 28px;
        padding: 0 20px;}
		
		nav ul li {padding-left: 5px;padding-right: 5px;}
		}
#map-canvas {
background: #226885;
position:relative;
padding-top: 20px;
padding-bottom: 20px;
overflow: hidden;}
#map-pano {
background: #226885;
position:relative;
padding-top: 20px;
padding-bottom: 20px;
overflow: hidden;}

.gallery {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
        gap: 10px;
      }

    .gallery img {
  width: 150px; /* Adjust the width as needed */
  height: 150px; /* Adjust the height as needed */
  object-fit: cover; /* Ensures thumbnails are cropped to fit the square aspect ratio */
  cursor: pointer;
}
      /* Lightbox styles */
      .lightbox {
      display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.9);
  z-index: 9999 !important; /* Set a high z-index value and use !important */
      }

      .lightbox img {
        max-width: 90%;
        max-height: 90%;
        display: block;
        margin: auto;
      }

      .lightbox .close {
        position: absolute;
        top: 30px;
        right: 30px;
        color: #fff;
        cursor: pointer;
        font-size: 70px;
      }

      .lightbox .prev,
      .lightbox .next {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        color: #fff;
        font-size: 30px;
        cursor: pointer;
      }

      .lightbox .prev {
        left: 15px;
      }

      .lightbox .next {
        right: 15px;
      }
	 
	  .heading_main{
		  
		  font-size: 28px;text-align:center;
		  
	  }

@media only screen and (max-width: 768px) 
{
	.gallery img {width:50px;        height: 50px;}
	.gallery {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(50px, 1fr));
    gap: 10px;
	}
.lines{
	font-size:16px;
}
  .heading_main{
		  
		  font-size: 16px;text-align:center;
		  
	  }
.main_logo_font{font-size:20px;margin-top:20px;}

}

.main_logo_font2{    font-size: 13px;
    margin-top: 0px;
    line-height: 18px;}



.intro_logo{
	width:200px;
	
}

nav ul li {
    display: inline;
    border-right: 0px solid #b5d0db;
    padding: 15px 15px 15px 15px;
    margin: 0;
}
.server{
	padding: 30px 0x 85px 0px;
}

h2 {
    font-size: 30px;
    font-weight: 700;
    color: #328bb0;
    text-transform: uppercase;
    text-align: center;
    margin-top: 20px;
    margin-bottom: 20px;
}


.button3,input[type="submit"],input[type="reset"],input[type="button"] {
    background: #226885;
    border: 0;
    color: #fff;
    display: inline-block;
    font-size: 15px;
    /* font-weight: 400; */
    text-transform: uppercase;
    text-decoration: none;
    cursor: pointer;
    margin-bottom: 10px;
    line-height: normal;
    padding: 15px;
    font-family: 'Source Sans Pro', sans-serif;
 }
.button3:hover,input[type="submit"]:hover,input[type="reset"]:hover,input[type="button"]:hover {
color: #fff;
background: #e8e8e8;
border: 0; }
.button3:active,button1:active,input[type="submit"]:active,input[type="reset"]:active,input[type="button"]:active {
color: #226885;
background: #e8e8e8;
border: 0;}






}