/*
Theme Name:   Codtronic
Theme URI:    https://www.codtronic.com
Author:       Codtronic Technologies Limited
Author URI:   https://www.codtronic.com
Description:  Codtronic is a WordPress theme that is fully responsive and elegant WordPress theme made for specifically Codtronic Technologies Limited. Its made for digital and wed design agencies. This theme is fully functional and highly customizable. This theme comes with the easy to handle customizer where you can manage theme slider, sections, colors, widgets and more. This theme is compatible with the many popular plugins like wocommerce, jetpack and contact form 7. This theme showcase your online work globally and get to engage your customers. This theme is fully responsive and working well with all the screen resolutions. A beautifully design theme comes with the attractive homepage sections where you can display all your content related to your business.
Tested up to: 5.9.2
Requires PHP: 7.2
Version:      1.0.0
License:      GNU General Public License
License URI:  https://www.gnu.org/licenses/gpl-3.0.en.html
Text Domain:  codtronic-tech
Tags:         e-commerce, right-sidebar, custom-background, custom-header, custom-menu, featured-images, theme-options, threaded-comments, custom-logo, blog, full-width-template

Codtronic Technologies WordPress Theme has been created by Codtronic Technologies(www.codtronic.com), 2022.
Codtronic Technologies WordPress Theme is released under the terms of GNU GPL
*/

@import url("css/impact_font/font.css") screen;

@font-face {
	font-family: 'Teko Semibold';
	src: local('Teko Semibold'), url('css/teko-semibold/Teko-SemiBold.ttf') format('truetype');
}

ul li { padding-top: unset; padding-bottom: unset; }
body  { overflow: overflow; }

#pricing-container {
	font-family:'Open Sans';
    font-style:condensed;
    background: #5b2072; /* Old browsers */
    background: -moz-radial-gradient(center, ellipse cover,  #5b2072 0%, #5d1566 50%, #251a41 100%); /* FF3.6+ */
    background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,#5b2072), color-stop(50%,#5d1566), color-stop(100%,#251a41)); /* Chrome,Safari4+ */
    background: -webkit-radial-gradient(center, ellipse cover,  #5b2072 0%,#5d1566 50%,#251a41 100%); /* Chrome10+,Safari5.1+ */
    background: -o-radial-gradient(center, ellipse cover,  #5b2072 0%,#5d1566 50%,#251a41 100%); /* Opera 12+ */
    background: -ms-radial-gradient(center, ellipse cover,  #5b2072 0%,#5d1566 50%,#251a41 100%); /* IE10+ */
    background: radial-gradient(ellipse at center,  #5b2072 0%,#5d1566 50%,#251a41 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5b2072', endColorstr='#251a41',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}
#pricing-container .row {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}
#pricing-container a{
	font-size: 18px;
	font-family:'Open Sans', Arial;
    color: white;
    text-decoration: none;
}
#pricing-container input:focus,textarea:focus,select:focus{
  border:1px solid #fafafa;
  -webkit-box-shadow:0 0 6px #007eff;
  -moz-box-shadow:0 0 5px #007eff;
  box-shadow:0 0 5px #007eff;
  outline: none;
}
#pricing-container sup{
	font-size: 40px;
}
#pricing-container ul{
	list-style: none;
	font-size: 15px;
	font-family:'Open Sans', Arial;
	color: #9095aa;
	padding: 0px;
	margin: 0px;
}
#pricing-container li{
border-bottom: 1px solid #494a5a;
padding: 0px;
margin: 0px;
text-align: center;
height: 52px;
line-height: 52px;
}
#pricing-container{
	width: 100%;
  text-align:center;
  padding-top: 30px;
  padding-bottom: 50px;
}
#pricing-container h2.section-title {
  margin-bottom: 20px;
}
#pricing-container hr {
  margin-bottom: 50px;
}
#pricing-container .whole{
	width: 100%;
  margin-bottom: 30px;
}
#pricing-container .type{
	width: 95%;
	border-radius: 5px 5px 0px 0px;
	background-color: #eac80d;
	height: 62px;
	border-bottom: 3px solid #bfa30c;
  margin-left: auto;
  margin-right: auto;
}
#pricing-container .type p{
	font-family:'Open Sans', Arial;
    font-weight: 800;
	font-size: 29px;
	text-transform: uppercase;
	color: white;
	text-align: center;
	padding-top: 10px;
}
#pricing-container .plan{
	width: 95%;
	background-color: #2b2937;
	border-radius: 0px 0px 5px 5px;
    font-family:'Open Sans', Arial;
    font-style:condensed;
    font-size: 90px;
    color: white;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}
#pricing-container .standard{
	background-color: #1abc9c;
	border-bottom: 3px solid #18937b;
}
#pricing-container .ultimate{
	background-color: #5d6a9a;
	border-bottom: 3px solid #474f6f;
}
#pricing-container .premium {
  background-color: purple;
  border-bottom: 3px solid rgba(90, 0, 90, 1);
}
#pricing-container .header{
	border-bottom: 1px solid #494a5a;
	padding-bottom: 39px;
}

#pricing-container .header span{
	font-size: 32px;
}
#pricing-container .month{
	font-size: 14px;
	color: lightgray;
	padding: 0px;
	margin: -10px;
}

#pricing-container .price{
	height:80px;
}
#pricing-container .price a:hover {
  text-decoration: none;
}
#pricing-container .cart {
  
  color:white;
  position: relative;
  top: 16px;
  
}
#pricing-container .login_c{
  width:500px;
  background-color:#2b2937;
  height:300px;
  margin: 0 auto;
  margin-top:40px;
  border-radius:5px;
}

#pricing-container .login_c input{
  width: 350px;
height: 40px;
  border: 1px solid #494a5a;
  margin-bottom:20px;
  border-radius:5px;
  padding-left: 10px;

}


#pricing-container .login{
  background-color: #BC4B1A;
	border-bottom: 3px solid #7C3618;
  width:100%;
  
}

#pricing-container .top{
  margin-top:35px;
}

#pricing-container .nodisplay{
  opacity: 0.1;
}

#pricing-container .selected{
  background-color:#1F1B36;
}

@media only screen and (min-width: 576px) {
  #pricing-container .row {
    width: 90%;
  }
}

@media only screen and (min-width: 768px) {
  #pricing-container .row {
    width: 100%;
  }
}
@media only screen and (min-width: 992px) {
  #pricing-container .row {
    width: 90%;
  }
  #pricing-container {
    padding-bottom: 80px;
  }
}
@media only screen and (min-width: 1200px) {
  #pricing-container .row {
    width: 75%;
  }
}

#content-notification {
	padding-bottom: 50px;
	width: 100%;
	margin-left: 0;
	margin-top: 0px;
	margin-top: -16px;
	background-size: cover;
}
.no-webp #content-notification {
    background-image: url('images/mesh.jpg');
}
.webp #content-notification {
   background-image: url('images/mesh.webp'); 
}
#content-notification div#design-stripes {
	width: 90%;
	margin: auto;
	overflow: auto;
}
#content-notification div#stripe-one {
	height: 10px;
	background-color: rgba(128, 0, 128, 1);
}
#content-notification div#stripe-two {
	height: 10px;
	background-color: rgba(189, 122, 87, 1);
}
#content-notification div#stripe-three {
	height: 10px;
	background-color: rgba(112, 146, 190, 1);
}
#content-notification div#container {
	background-color: white;
	width: 90%;
	margin: auto;
	box-shadow: 3px 3px 9px #aaa;
	margin-top: 50px;
	clear: left;
	padding-top: 20px;
	padding-bottom: 5px;
	margin-top: 20px;
	}         
#content-notification #content {
	clear: left;
	padding: 25px 20% 0% 2%;
	}
#content-notification .search-form {
	width: 90%;
	margin-left: 5%;
	box-shadow: 1px 2px 5px rgba(120, 120, 120, 1);
}
#content-notification .search-form input {
	height: 40px;
}
#content-notification .search-form button {
	width: 80px;
}
#content-notification .search-form i {
	font-size: 1.3em;
}
#content-notification div#content h2 {
	color: gray;
	font-family: Impact, impactreg;
	font-weight: normal;
	}
#content-notification div#content p.p-info {
	font-family: Arial;
	line-height: 23px;
	}
#content-notification #p-company-name {
	color:gray;
	font-family: Impact, impactreg;
	font-size: 1.2em;
	margin-top: 40px;
	}
#content-notification #p-company-slogan {
	color: gray;
	font-family: Arial;
	font-size: 1.2em;
	font-weight: bold;
	margin-top: -14px;
	}
#content-notification #copyright {
	height: 100px;
	line-height: 100px;
	font-weight: bold;
	text-align: center;
	font-family: Arial;
	font-size: small;
	color: gray;
	}
#content-notification #social-media {
	text-align: center;
}
#content-notification #social-media i {
	font-size: 2em;
	margin-left: 5px;
	background-color: rgba(100, 100, 100, 1);
	color: rgba(250, 250, 250, 1);
	border-radius: 50%;
	height: 50px;
	line-height: 50px;
	width: 50px;
}
#content-notification #social-media i.fa-facebook-f {
	background-color: purple;
}
#content-notification #social-media i.fa-linkedin-in {
	background-color: rgba(189, 122, 87, 1);
}
#content-notification #social-media i.fa-twitter {
	background-color: rgba(100, 124, 178, 1);
}
#content-notification #social-media i.fa-whatsapp {
	background-color: teal;
}
#content-notification #social-media i.fa-youtube {
	background-color: rgba(200, 0, 0, 1);
}
#content-notification #social-media a:hover i {
	background-color: teal;
}
#content-privacy-policy {
	margin-top: -17px;
}
#content-privacy-policy div#design-stripes {
	width: 90%;
	margin-left: auto;
	margin-right: auto;
	overflow: auto;
}
#content-privacy-policy div#stripe-one {
	height: 10px;
	background-color: rgba(128, 0, 128, 1);
}
#content-privacy-policy div#stripe-two {
	height: 10px;
	background-color: rgba(189, 122, 87, 1);
}
#content-privacy-policy div#stripe-three {
	height: 10px;
	background-color: rgba(112, 146, 190, 1);
}
#content-privacy-policy #wrapper {
	width: 90%;
	margin-left: auto;
	margin-right: auto;
	margin-top: 30px;
	margin-bottom: 30px;
	padding: 20px 5% 10px 5%;
	box-shadow: 3px 3px 9px #aaa;
}
#content-privacy-policy #wrapper header h1 {
	font-weight: bold;
	color: gray;
	font-size: 1.8em;
	margin-bottom: 20px;
}
#content-privacy-policy #wrapper header h3 {
	font-family: Impact, impactreg;
	color: gray;
	font-size: 1.2em;
	margin-bottom: 30px;
}
#content-privacy-policy #wrapper main h2 {
	color: gray;
	font-family: Impactreg;
	font-size: 1.6em;
	margin-top: 30px;
}
#content-privacy-policy #wrapper main h3 {
	color: gray;
	font-family: Impactreg;
	font-size: 1.4em;
}
#content-privacy-policy #wrapper main h4 {
	color: gray;
	font-family: Impactreg;
	font-size: 1.2em;
}
#content-privacy-policy #wrapper main strong {
	color: gray;
}
#content-privacy-policy #wrapper footer p#copyright {
	text-align: center;
	font-size: 0.85em;
	color: gray;
	margin-top: 20px;
}
#content-search .page-title {
	font-size: 1.6em;
	font-weight: bold;
	font-family: Impact, impactreg;
	margin-bottom: 30px;
}
#content-search .search-results-container h2 {
	font-size: 1.2em;
}
#content-search .search-result {
	margin-bottom: 20px;
	margin-top: 20px;
	background-color: white;
	padding: 15px;
	border-radius: 10px;
	box-shadow: 1px 1px 3px #aaa;
}
#content-search .search-result:hover {
	background-color: whitesmoke;
}
#content-search .no-search-result {
	box-shadow: 1px 1px 3px #aaa;
	margin-top: 20px;
	padding-left: 20px;
	padding-right: 20px;
	padding-bottom: 30px;
	padding-top: 20px;
	margin-bottom: 30px;
}
#content-search .no-search-result h1 {
	color: gray;
}
#content-search .no-search-result p {
	margin-bottom: 40px;
}
@media screen and (min-width: 200px) {
#content-notification	#container {
		padding-bottom: 0px;
	}
#content-notification #header img#logo {
	text-align: center;	
	padding: 15px 0px 15px 0px;
}
#content-notification	#company-name {
	width: 100%;
	padding-left: 0px;
	font-size: 1.6em;
	text-align: center;
	height: auto;
	line-height: 30px;
	padding-top: 8px;
	padding-bottom: 8px;
	}
#content-notification	#company-slogan {
	font-size: 1em;
	display: none;
	}
#content-notification	#content {
		padding: 0;
	}
#content-notification	#content h2 {
		padding-left: 5%;
		font-size: 1.2em;
	}
#content-notification	#content .p-info {
	padding-left: 5%;
	padding-right: 5%;
	font-size: 0.91em;
	}
#content-notification #p-company-name {
	margin-top: 0px;
	padding-left: 5%;
	font-size: 1em;
	}
#content-notification #p-company-slogan {
	padding-left: 5%;	
	font-size: 1em;
	margin-top: -8px;
	}
#content-notification	#copyright {
	height: auto;
	line-height: 20px;
	font-size: 0.7em;
	padding-bottom: 10px;
	}
#content-notification	#social-media i {
		font-size: 1.4em;
		height: 35px;
		line-height: 35px;
		width: 35px;
	}
}

@media only screen and (max-width: 249px) {
body {
  background-color: teal;   
}
header, main, footer {
  display: none;    
}
}

/*---------------------- Styles for small devices ---------   */
header {
  overflow-x: clip;
}
a {
  color: blueviolet;
}
.main-branding {
  background-color: rgba(0, 0, 0, 0.5);
  height: 85px;
  z-index: 16;
  position: fixed;
}
.fa-bars, .fa-times {
  position: absolute;
  right: 15px;
  top: 30px;
  color: rgba(255, 174, 201, 1);
  cursor: pointer;
  height: 40px;
  width: 40px;
  line-height: 40px;
  text-align: center;
  border-radius: 5px;
}
.main-branding .fa-bars:hover, .main-branding .fa-times:hover {
  background-color: rgba(0, 0, 0, 0.5);
}
.mobile-tablet-nav-section {
  background-size: cover;
  border-top: 5px solid rgba(255, 174, 87, 1);
   width: 100%;
   margin-left: auto;
   margin-right: auto;
   z-index: 15;
   left: -100%;
   top: 85px;
   position: fixed;
   overflow-y: auto;
   bottom: 0;
}
.no-webp .mobile-tablet-nav-section {
   background-image: url('images/maroon.jpg');
}
.webp .mobile-tablet-nav-section {
   background-image: url('images/maroon.webp'); 
}
.mobile-tablet-nav-section .search-form {
  height: 100px;
  padding-left: 15px;
  padding-right: 15px;
  background-color: purple;
  padding-top: 30px;
  padding-bottom: 30px;
  width: 100%;
}
.mobile-tablet-nav-section .media-features {
  text-align: center;
  height: 100px;
  line-height: 55px;
  background-size: cover;
  padding-bottom: 10px;
  margin-top: -6px;
}
.no-webp .mobile-tablet-nav-section .media-features {
   background-image: url('images/energy.jpg');  
}
.webp .mobile-tablet-nav-section .media-features {
    background-image: url('images/energy.webp'); 
}
.mobile-tablet-nav-section .media-features .fab {
  background-color: teal;
  color: white;
  width: 35px;
  height: 35px;
  line-height: 35px;
  border-radius: 10px;
  font-size: 1.3em;
}
.mobile-tablet-nav-section .media-features .fas {
  font-size: 1.3em;
}
.mobile-tablet-nav-section .more-features {
  display: block;
  overflow: auto;
}
.mobile-tablet-nav-section .more-features a {
  display: inline-block;
  background-color: teal;
  float: left;
  width: calc(92%/3);
  height: 35px;
  line-height: 35px;
  color: white;
  border-radius: 4px;
}
.mobile-tablet-nav-section .more-features .login {
  margin-left: 2%;
}
.mobile-tablet-nav-section .more-features .login:hover {
  text-decoration: none;
}
.mobile-tablet-nav-section .more-features .shop {
  margin-left: 2%;
  margin-right: 2%;
}
.mobile-tablet-nav-section .more-features .cog {
  margin-right: 2%;
}
.mobile-tablet-nav {
  clear: left;
  padding-top: 30px;
}
.mobile-tablet-nav ul {
  list-style-type: none;
  position: relative;
}
.mobile-tablet-nav > ul {
  margin: auto;
  width: 80%;
  padding: 20px 0;
}
.mobile-tablet-nav ul a {
  display: block;
  text-decoration: none;
  font-weight: bold;
  width: 100%;
  height: 60px;
  line-height: 60px;
}
.mobile-tablet-nav > ul > li > a {
  color: white;
  border-bottom: 1px solid white;
  font-size: 1.1em;
}
.mobile-tablet-nav > ul > li > a:hover {
  color: rgba(255, 174, 87, 1);
  border-bottom-color: rgba(255, 174, 87, 1);
}
.mobile-tablet-nav > ul > li {
  position: relative;    
}
.mobile-tablet-nav > ul > li:nth-child(5) {
  display: none;
}
.mobile-tablet-nav > ul > li:first-child > a {
    margin-bottom: -3px;    
}
.mobile-tablet-nav > ul > li > i.fa-plus, .mobile-tablet-nav > ul > li > i.fa-minus {
  background-color: teal;
  color: white;
  width: 20px;
  height: 20px;
  line-height: 20px;
  text-align: center;
  display: block;
  border-radius: 1px;
  font-size: 0.9em;
  cursor: pointer;
  position: absolute;
  right: 0px;
  top: 20px;
}
.mobile-tablet-nav ul li ul {
  display: none;
  padding-left: 30px;
  padding-top: 20px;
}
.mobile-tablet-nav ul li ul li a {
  font-size: 0.95em;
  font-family: Impact, impactreg;
  font-weight: normal;
  color: white;
  height: 40px;
  line-height: 40px;
  
}
.mobile-tablet-nav ul li ul li:first-child a {
   margin-top: 0px;
}
.mobile-tablet-nav ul li ul li:last-child a {
  margin-bottom: 10px;  
}
.mobile-tablet-nav p {
  padding: 20px 2px;
}
.mobile-tablet-nav p {
  padding-bottom: 20px;
}
.mobile-tablet-nav > ul > li > a.active-page {
  color: rgba(255, 174, 87, 1);
  border-color: rgba(255, 174, 87, 1);
}
.mobile-tablet-nav a.active-page {
  color: rgba(255, 102, 0, 255);
}
.menu-branding a {
  display: block;
  width: 150px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 40px;
}
.menu-branding a:hover {
  text-decoration: none;
}
.menu-branding .company-name {
  text-align: center;
  font-family: Impact, impactreg;
  font-size: 2em;
  margin-top: 30px;
  color: rgba(255, 174, 201, 1)
}
.menu-branding .slogan {
  text-align: center;
  margin-top: -20px;
  font-size: 1.1em;
  color: rgba(255, 174, 87, 1);
  font-family: Impact, impactreg;
}
.menu-footer {
  text-align: center;
  color: rgba(200, 200, 200, 1);
  background-color: rgba(30, 30, 30, 1);
  padding: 20px 10px 20px 10px;
  width: 100%;
}
.main-branding .codtronic-logo { 
 display: inline-block;
 height: 85px;
 padding-top: 10px;
}
.codtronic-logo:hover {
  text-decoration: none;
}
.main-branding .codtronic-logo img {
  width: 65px;
  height: 65px;
}
.no-padding {
  padding-left: 0;
  padding-right: 0;
}
.header-image-wrapper {
  margin-top: -160px;
}
.header-image-wrapper p img {
  height: 450px;
}
.header-image-wrapper div.page-intro {
  position: absolute;
  top: 165px;
  left: 5%;
}
.header-image-wrapper div .left {
  display: block;
  color: white;
  font-family: Impact, impactreg;
  font-size: 1.3em;
  text-shadow: 0.03em 0.03em 0.05em black;
}
.header-image-wrapper div .right {
  color: white;
  font-family: Impact, impactreg;
  font-size: 1em;
  text-shadow: 0.03em 0.03em 0.05em black;
  display: block;
}
.header-image-wrapper #breadcrumbs a {
  color: rgba(255, 174, 87, 1);
}
.carousel-caption {
  left: 0%;
  right: 0%;
  top: 100px;
}

.no-webp .carousel-item-one {
  background-image: url('images/energy.jpg');
  background-size: cover;
  height: 490px;
}
.webp .carousel-item-one {
  background-image: url('images/energy.webp');
  background-size: cover;
  height: 490px;
}
.no-webp .carousel-item-two {
  background-image: url('images/universe.jpg');
  background-size: cover;
  height: 490px;
}
.webp .carousel-item-two {
  background-image: url('images/universe.webp');
  background-size: cover;
  height: 490px;
}
.no-webp .carousel-item-three {
  background-image: url('images/growth-curve.jpg');
  background-size: cover;
  height: 490px;
}
.webp .carousel-item-three {
  background-image: url('images/growth-curve.webp');
  background-size: cover;
  height: 490px;
}
.no-webp .carousel-item-four {
  background-image: url('images/software-development.jpg');
  background-size: cover;
  height: 490px;
}
.webp .carousel-item-four {
  background-image: url('images/software-development.webp');
  background-size: cover;
  height: 490px;
}

.capture {
  font-size: 1.6em;
  font-family: Impact, impactreg;
  padding-left: 10px;
  padding-right: 10px;
}
.motivation {
  padding-left: 30px;
  padding-right: 30px;
  font-size: 1.1em;
  line-height: 25px;
}
.dev-category {
  font-weight: bold;
  padding-left: 10px;
  padding-right: 10px;
  margin-bottom: 10px;
  color: rgba(255, 174, 87, 1);
  font-size: 1em;
}
.action-buttons {
  padding-left: 10px;
  padding-right: 10px;
}
.button-1 {
  display: inline-block;
  width: 175px;
  margin-bottom: 10px;
  background-color: red;
  border: 2px solid red;
  height: 45px;
  width: 180px;
}
.button-1:hover + {
	
}
.button-2 {
  display: inline-block;
  width: 175px;
  background-color: rgba(0, 0, 0, 0);
  border: 2px solid rgba(255, 174, 87, 1);
  margin-bottom: 10px;
  height: 45px;
  width: 180px;
}
.action-buttons .btn:hover {
  background-color: rgba(128, 0, 128, 0);
  border: 2px solid white;
}
.carousel-indicators .active {
  background-color: rgba(255, 174, 201, 1);
}
.addthis-smartlayers-desktop div {
  top: 197px;
}
.service-excerpts-container {
  overflow: clip;
  background-color: whitesmoke;
  padding-bottom: 30px;
  background-size: cover;
  padding-top: 30px;
	padding-bottom: 60px;
}
.no-webp .service-excerpts-container {
   background-image: url('images/mesh.jpg');
}
.webp .service-excerpts-container {
   background-image: url('images/mesh.webp');  
}
.service-excerpts {
  background-size: cover;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
}
.service-excerpts h3.sub-title {
  font-size: 1.1em;
  font-weight: bold;
	color: purple;
}
.service-excerpts div {
  margin-left: auto;
  margin-right: auto;
  padding-left: 0;
  padding-right: 0;
  padding-bottom: 15px;
  border-bottom-right-radius: 10px;
	border-bottom-left-radius: 10px;
  margin-bottom: 30px;
	display: flex;
	flex-direction: column;
}
.service-excerpts div .excerpt {
	flex: auto;
}
.service-one, .service-three {
  background-color: whitesmoke;
	border: 1px solid lightgray;
}
.service-two, .service-four {
  background-color: whitesmoke;
	border: 1px solid lightgray;
}
.service-excerpts div:hover {
  background-color: skyblue;
}
.service-excerpts .image-container img {
  width: 100%;
  height: 200px;
}
.service-excerpts .icon-container {
  text-align: center;
  margin-top: -65px
}
.service-excerpts .fas, .service-excerpts .fab {
  font-size: 3em;
  background-color: purple;
  color: white;
  width: 90px;
  height: 90px;
  line-height: 90px;
  border-radius: 50%;
}
.sub-title {
  text-align: center;
  font-size: 1.65rem;
  padding-left: 10px;
  padding-right: 10px;
  margin-bottom: 20px;
}
.excerpt {
  padding-left: 15px;
  padding-right: 15px;
  padding-bottom: 20px;
  text-align: center;
  font-size: 1.1em;
}
.excerpt + p {
  text-align: center;
}
.btn-service {
  display: inline-block;
  width: 155px;
  background-color: purple;
  border: 1px solid purple;
}
.btn-service:hover {
  background-color: teal;
  border: 1px solid teal;
}
.section-title {
  font-size: 2em;
  font-weight: bold;
  text-align: center;
  margin-top: 20px;
  color: skyblue;
  width: 100%;
  font-family: Impact, impactreg;
}
hr {
  background-color: rgba(255, 174, 87, 1);
  height: 2px;
  width: 80px;
  margin-top: -10px;
}
p.section-description {
  text-align: center;
  font-size: 1.5em;
}
.design-main-container {
  background-size: cover; 
  background-position: 100% 50%;  
  background-attachment: fixed;
  padding-left: 5%;
  padding-right: 5%;
	padding-top: 30px;
	padding-bottom: 60px;
}
.no-webp .design-main-container {
  background-image: url('images/dev_space.jpg');   
}
.webp .design-main-container {
  background-image: url('images/dev_space.webp');   
}
.design-values .section-title {
  text-shadow:  -0.02em -0.02em 0.04em black;
  font-size: 1.6em;
}
.design-values .section-description {
  color: rgba(230, 230, 230, 1);
  font-size: 1.2em;
	margin-bottom: 30px;
}
.design-value-container {
  padding-bottom: 40px;
}
.letter h1 {
  font-family: Impact, impactreg;
  font-size: 10em;
  text-align: center;
}
.letter p {
  text-align: center;
  font-family: "Teko Semibold", Impact, impactreg;
  font-size: 2em;
  padding-left: 5px;
  padding-right: 5px;
}

.letter-1, .letter-5, .letter-9 {
  background-color: rgba(128, 0, 128, 1);
  color: skyblue;
	background-image: linear-gradient(to bottom right, purple, rgba(23, 162, 184, 1))
}
.letter-5 {
  color: skyblue;
	background-color: teal;
}
.letter-9 {
  color: skyblue;
	background-image: linear-gradient(to top left, purple, rgba(23, 162, 184, 1))
}
.letter-2, .letter-8 {
  background-color: skyblue;
  color: purple;
}
.letter-3, .letter-7 {
  background-color: teal;
  color: skyblue;
}
.letter-4, .letter-6 {
  background-color: skyblue;
  color: purple;
}
.why-us {
  padding-bottom: 90px;
	padding-top: 30px;
  background-color: whitesmoke;
  padding-left: 5%;
  padding-right: 5%;
  background-size: cover;
}
.no-webp .why-us {
  background-image: url('images/mesh.jpg');  
}
.webp .why-us {
  background-image: url('images/mesh.webp');  
}
.reasons .button-container {
  margin-top: 30px;
  text-align: center;
}
.reasons a {
  display: inline-block;
  width: 180px;
  margin-left: auto;
  margin-right: auto;
}
.reasons .btn-info {
  background-color: purple;
  border: 1px solid purple;
  width: 180px;
  height: 50px;
  font-weight: bold;
  font-size: 1.2em;
}
.reasons .btn-info:hover {
  background-color: teal;
  border: 1px solid teal;
}
.reasons h3.section-title {
  font-size: 1.6em;
  font-family: Impact, impactreg, "Segoe UI";
  color: purple;
}
.reasons > p {
  color: black;
  font-size: 1.2em;
}
.reasons > div {
  padding-left: 0;
  padding-right: 0;
}
.reason-container {
  margin-top: 20px;
  border-radius: 10px;
  border-top: 10px solid purple;
  background-color: whitesmoke;
  box-shadow: 1px 2px 5px rgba(120, 120, 120, 1);
	
}
.reason-container h3 {
	color: purple;
}
.reason-container:hover {
  background-color: skyblue;
}
.reason-container p {
  text-align: center;
}
.reason-container p.icon-container {
  margin-top: 20px;
}
.reasons .fas {
  font-size: 3.5em;
  color: purple;
}
.work-flow-container {
  background-size: cover;
  background-attachment: fixed;
  padding-left: 5%;
  padding-right: 5%;
	padding-top: 30px;
	padding-bottom: 60px;
}
.no-webp .work-flow-container {
  background-image: url('images/energy.jpg');  
}
.webp .work-flow-container {
  background-image: url('images/energy.webp');  
}
.work-flow {
  padding-bottom: 40px;
}
.work-flow > div > [class*='col-'] {
  display: flex;
}
.work-flow > div > div {
  padding-left: 0;
  padding-right: 0;
}
.work-flow div div div {
  margin-top: 40px;
  border-radius: 10px;
  border-top: 10px solid rgba(255, 174, 87, 1);
  background-color: purple; 
  padding-bottom: 20px;
	background-image: linear-gradient(to bottom right, purple, rgba(23, 162, 184, 1))
}
.work-flow div .section-title {
  font-family: Impact, impactreg;
  text-shadow:  -0.02em -0.02em 0.04em black;
  font-size: 1.6em;
}
.work-flow div .section-description {
  color: white;
  font-size: 1.2em;
}
.work-flow div div div p {
  text-align: center;
}
.work-flow .sub-title {
  color: whitesmoke;
  font-weight: bold;
}
.work-flow .excerpt {
  color: whitesmoke;
}
.work-flow .section-description {
  color: black;
}
.work-flow .fas {
  font-size: 3em;
  background-color: rgba(255, 174, 87, 1);
  color: white;
  width: 90px;
  height: 90px;
  line-height: 90px;
  border-radius: 50%;
  margin-top: 30px;
  text-align: center;
}
.recent-projects-container {
  background-color: rgba(23, 162, 184, 1);
  padding-bottom: 90px;
  padding-top: 30px;
  padding-left: 5%;
  padding-right: 5%;
  background-size: cover;
	background-image: linear-gradient(to bottom right, purple, rgba(23, 162, 184, 1))
}
.recent-projects .section-title {
  color: white;
  font-family: Impact, impactreg, "Segoe UI";
  font-size: 1.6em;
  margin-bottom: 20px;
}
.recent-projects hr {
  margin-bottom: 40px;
}
.recent-projects .fas, .recent-projects .fab {
  font-size: 1.5em;
}
.recent-projects .nav-item a:not(.active) .fab, .recent-projects .nav-item a:not(.active) span {
	color: white;
}
.recent-projects .nav-item a:not(.active) .fas {
	color: white;
}
.recent-projects .tab-content .row  {
  padding-top: 15px;
  padding-bottom: 15px;
  padding-left: 5%;
  padding-right: 5%;
}
.recent-projects .tab-content .row div {
  position: relative;
  padding-left: 0px;
  padding-right: 0px;
  margin-bottom: 15px;
}
.recent-projects .tab-content .row div a p {
  height: 100%;
}
.recent-projects .tab-content .row div img {
  height: 100%;
  width: 100%;
}
.recent-projects .tab-content .row div .sub-title {
  font-size: 1em;
  position: absolute;
  text-align: center;
  left: 0px;
  bottom: 0px;
  height: 40px;
  line-height: 40px;
  width: 100%;
  color: white;
  background-color: rgba(0, 0, 0, 0.5);
  margin-bottom: 0px;
  font-family: Impact, impactreg;
  text-transform: uppercase;
}
.recent-projects .sub-title .fas, .recent-projects .sub-title .fab {
  margin-right: 10px;
}
.recent-projects .tab-content {
  background-color: white;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}
.recent-projects p#blur-on {
  text-align: center;
  background-color: rgba(135, 206, 235, 0.5);
  height: 100%;
  position: absolute;
  width: 100%;
  z-index: 1;
  color: white;
  box-sizing: border-box;
  padding-top: 30px;
}
.recent-projects p#blur-on span#description {
  font-family: Impact, impactreg;
  font-size: 1.5em;
}
.recent-projects p#blur-on span#more {
  font-family: Impact, impactreg;
  font-size: 1.8em;
  text-transform: uppercase;
  display: inline-block;
  margin-top: 30px;
}
.recent-posts .tab-content {
  background-color: white;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}
.recent-posts-container {
  background-color: whitesmoke;
  padding-bottom: 90px;
	padding-top: 30px;
  padding-left: 5%;
  padding-right: 5%;
}
.recent-posts .section-title {
   color: purple;
   font-family: Impact, impactreg, "Segoe UI";
   font-size: 1.6em;
}
.recent-posts hr {
  margin-bottom: 40px;
}
.recent-posts .fas, .recent-posts .fab {
  font-size: 1.5em; 
}
.recent-posts .tab-content .row  {
  padding-top: 15px;
  padding-bottom: 15px;
  padding-left: 5%;
  padding-right: 5%;
}
.recent-posts .tab-content .row > div {
  padding-left: 0;
  padding-right: 0;
  margin-bottom: 20px;
	margin-top: 20px;
}
.recent-posts .tab-content .row > div > div {
  padding-left: 0px;
  padding-right: 0px;
  padding-bottom: 10px;
  margin-bottom: 20px;
  background-color: white;
  border-radius: 20px;
  box-shadow: 1px 2px 5px rgba(120, 120, 120, 1);
  height: 100%;
}
.recent-posts .tab-content .row > div > div a {
  color: black;
	height: 100%;
	display: flex;
	flex-direction: column;
}
.recent-posts .tab-content .row > div > div a:hover {
  text-decoration: none;
}
.recent-posts .tab-content .row div div:hover {
  background-color: lightblue;
}
.recent-posts .tab-content .row div .image-container img {
  height: 200px;
  width: 100%;
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
}
.recent-posts .tab-content .row div .sub-title {
  font-size: 1.2em;
  text-align: left;
  width: 100%;
  margin-bottom: 20px;
  font-family: Impact, impactreg;
  padding-left: 15px;
  padding-right: 15px;
	color: purple;
	font-family: "Teko Semibold";
}
.post-excerpt {
  padding-left: 15px;
  padding-right: 15px;
	flex: 1 1 auto;
}
.post-excerpt + p {
  padding-left: 15px;
}
.recent-posts .post-author-image {
   width: 50px;
   height: 50px;
   border-radius: 50%;
   margin-bottom: 10px;
   margin-right: 10px;
   float: left;
}
.recent-posts .post-meta {
  display: inline-block;
  font-size: 0.8em;
  width: 75%;
}
#content-about {
  background-color: white;
  margin-top: -17px;
  padding-top: 20px;
  overflow: clip;
}
#content-about h2 {
  width: 100%;
  text-align: center;
  margin-top: 20px;
  font-weight: bold;
  margin-bottom: 20px;
  font-family: Impact, impactreg, "Segoe UI";
}
#content-about .who-container {
  margin-top: -20px;
}
#content-about div.who-we-are {
  background-image: url('images/mesh.jpg');
  background-size: cover;
  padding-top: 5px;
  padding-bottom: 40px;
}
#content-about div.who-we-are h2 {
  text-align: center;
  font-size: 1.6em;
  padding: 0px 20px 5px 20px;
  color: purple;
}
#content-about div.who-we-are > hr {
  color: rgba(255, 174, 87, 1);
  background-color: rgba(255, 174, 87, 1);
  width: 80px;
  border: none;
  height: 3px;
  margin-bottom: 20px;
}
#content-about .who-we-are p#who-we-are-intro {
  text-align: left;
  margin-bottom: 20px;
  font-size: 1.2em;
  color: black; 
  width: 90%;
  padding-left: 5%;
  padding-right: 5%;
  margin-left: auto;
  margin-right: auto;
}
#content-about .who-we-are p#phrase {
  text-align: center;
  width: 100%;
	font-family: "Teko Semibold";
}
#content-about .who-we-are p#phrase span:first-child {
  color: purple;
  font-size: 2em;
  font-weight: bold;
  display: block;
  margin-bottom: -20px;
  font-family: "Teko Semibold", Impact, impactreg;
}
#content-about .who-we-are p#phrase span:nth-child(3) {
  color: teal;
  font-size: 1.6em;
  font-weight: bold;
  padding-left: 5%;
  padding-right: 5%;
  display: block;
  margin-bottom: -25px;
  font-family: "Teko Semibold",Impact, impactreg;
}
#content-about .who-we-are p#phrase span:last-child {
  color: teal;
  font-size: 1.4em;
  font-weight: bold;
  padding-left: 6%;
  padding-right: 6%;
  display: block;
	line-height: 25px;
}
#content-about .expert-services {
  padding-top: 30px;
  padding-bottom: 90px;
  padding-left: 5%;
  padding-right: 5%;
  background-color: teal;
	background-image: radial-gradient(circle, purple, teal);
}
#content-about .expert-services h2 {
  font-size: 1.6em;
  margin-bottom: 30px;
  color: white;
}
#content-about .expert-services hr {
  margin-bottom: 20px;
}
#content-about .expert-services div.service-description {
  margin-bottom: 20px;
  color: whitesmoke;
}
#content-about .expert-services div.service-description p {
  font-size: 1.2em;
  text-align: left;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
}
#content-about .expert-services div.service {
  text-align: center;
  height: 230px;
	font-family: "Teko Semibold";
}
#content-about .expert-services div.service a {
  color: black;
  display: block;
  width: 100%;
  height: 100%;
  padding: 25px;
}
#content-about .expert-services div.service:hover a {
  color: white;
  text-decoration: none;
  background-color: purple;
}
#content-about .expert-services div.service:nth-child(4) {
  background-color: skyblue;
}
#content-about .expert-services div.service:nth-child(5) {
  background-color: rgba(255, 174, 87, 1);
}
#content-about .expert-services div.service:nth-child(6) {
  background-color: rgba(209, 142, 107, 1);
}
#content-about .expert-services div.service:nth-child(7) {
  background-color: rgba(255, 174, 201, 1);
}
#content-about .expert-services div.service:nth-child(8) {
  background-color: rgba(255, 174, 87, 1);
}
#content-about .expert-services div.service:nth-child(9) {
  background-color: rgba(209, 142, 107, 1);
}
#content-about .expert-services div.service:nth-child(10) {
  background-color: rgba(255, 174, 201, 1);
}
#content-about .expert-services div.service:nth-child(11) {
  background-color: skyblue;
}
#content-about .expert-services div.service .fas, #content-about .expert-services div.service .fab {
  font-size: 4em;
  margin-bottom: 20px;
	margin-top: 10px;
}
#content-about .expert-services div.service a h3 {
	font-size: 1.6em;
}
#content-about .expert-services .button {
  margin-top: 30px;
  text-align: center;
}
#content-about .expert-services .btn-info {
  background-color: rgba(23, 162, 184, 1);
  border: 1px solid rgba(23, 162, 184, 1);
  width: 180px;
  height: 50px;
  font-weight: bold;
  font-size: 1.2em;
}
#content-about .expert-services .btn-info:hover {
   background-color: rgba(255, 174, 87, 1);
   border: 3px solid rgba(255, 174, 87, 1);
}
#content-about .vision-mission {
  background-color: rgba(128, 0, 128, 0.5);
  padding-top: 30px;
  padding-bottom: 90px;
  background-image: url('images/energy.jpg');
  background-size: cover;
  background-attachment: fixed;
}
#content-about .vision-mission h2 {
  color: rgba(0, 192, 192, 1);
  font-family: Impact, impactreg;
  text-shadow:  -0.02em -0.02em 0.04em black;
  font-size: 1.6em;
}
#content-about .vision-mission div#vision {
  width: 100%;
  height: auto;
  padding-left: 15%;
  padding-right: 15%;
  margin-bottom: 10px;
}
#content-about .vision-mission div#vision h3 {
  margin-top: 10px;
  font-size: 1.6em;
  font-weight: bold;
  color: rgba(0, 192, 192, 1);
  font-family: Impact, impactreg;
  text-shadow:  -0.02em -0.02em 0.04em black;
  text-align: center;
}
#content-about .vision-mission div#vision p {
  width: 100%;
  font-size: 1.5em;
  box-sizing: border-box;
  padding: 5px 0 0 0;
  color: whitesmoke;
  text-align: center;
}
#content-about .vision-mission div#mission {
  width: 100%;
  height: auto;
  padding-left: 15%;
  padding-right: 15%;
  margin-bottom: 10px;
}
#content-about .vision-mission div#mission h3 {
  font-size: 1.6em;
  font-weight: bold;
  color: rgba(0, 192, 192, 1);
  font-family: Impact, impactreg;
  text-shadow:  -0.02em -0.02em 0.04em black;
  text-align: center;
}
#content-about .vision-mission div#mission p {
  width: 100%;
  margin: auto;
  font-size: 1.5em;
  box-sizing: border-box;
  padding: 5px 0 0px 0;
  color: whitesmoke;
  text-align: center;
}
.core-values {
  padding-bottom: 90px;
  padding-top: 30px;
  padding-left: 5%;
  padding-right: 5%;
  background-image: url('images/mesh.jpg');
  background-size: cover;
}
.core-values h2 {
  font-size: 1.6em;
	color: purple;
}
.core-values div p {
  font-size: 1.5em;
  text-align: center;
  padding-bottom: 20px;
  padding-left: 5%;
  padding-right: 5%;
}
.core-values h3 {
  font-size: 1.8em;
  font-weight: bold;
	font-family: "Teko Semibold";
  color: white;
  text-shadow:  -0.02em -0.02em 0.04em black;
  margin-top: 10px;
  margin-bottom: 20px;
  width: 100%;
  text-align: center;
  width: 220px;
  height: 220px;
  padding-top: 70px;
  border-radius: 50%;
  margin-left: auto;
  margin-right: auto;
  background-size: cover;
  text-transform: uppercase;
  box-shadow: 1px 2px 5px rgba(120, 120, 120, 1); 
  background-image: linear-gradient(to right, purple, teal);
  background-size: cover;
}
.core-values div:nth-child(5) h3 {
  padding-top: 60px;
}
.core-values div:nth-child(6) h3 {
  padding-top: 60px;
}
.core-values div:nth-child(9) h3 {
  padding-top: 80px;
}
.core-values div.value {
  
}
.our-clients {
  background-color: whitesmoke;
  background-size: cover;
  padding-left: 5%;
  padding-right: 5%;
  padding-top: 30px;
  padding-bottom: 90px;
  background-image: linear-gradient(to right, rgba(97, 3, 126, 1), rgba(181, 75, 214, 1));
}
.our-clients h2 {
  text-align: center;
  font-size: 1.6em;
  padding: 0px 0 5px 0;
  color: white;
  text-transform: uppercase;
}
.our-clients hr {
  margin-bottom: 30px;
}
.client div {
  border-radius: 10px;
  padding-top: 25px;
  padding-bottom: 25px;
  background-color: white;
  margin-bottom: 20px;
  box-shadow: 1px 2px 5px rgba(120, 120, 120, 1);
}
.client img {
  height: 120px;
  width: 120px;
  margin-left: auto;
  margin-right: auto;
}
.our-clients div:nth-child(5) img {
  width: 200px;
}
#testimonials {
  padding-top: 30px;
  padding-bottom: 90px;
  background-image: url('images/office.jpg');
  background-size: cover;
  padding-left: 5%;
  padding-right: 5%;
}
#testimonials hr {
  margin-bottom: 30px;
}
#testimonials h2 {
  font-family: Impact, impactreg;
  font-size: 1.6em;
  color: white;
  text-shadow:  -0.02em -0.02em 0.04em black;
  text-transform: uppercase;
}
#testimonials-carousel .carousel-inner {
  border-radius: 20px;
  background-color: rgba(0, 0, 0, 0.6);
  padding-bottom: 40px;
  padding-left: 10px;
  padding-right: 10px;
  border-top: 20px solid whitesmoke;
  height: 450px;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
}
#testimonials .carousel-item {
  height: 100%;
}
#testimonials .carousel-caption {
  color: white;
  top: -12px;
}
#testimonials .carousel-caption .testimony {
  font-size: 1.2em;
}
#testimonials .carousel-caption .ceo-name {
  font-size: 0.8em;
}
#content-services .our-services {
  padding-bottom: 40px;
  margin-top: -17px;
  background-image: url('images/mesh.jpg');
  background-size: cover;
}
#content-services h2 {
  text-align: center;
  font-size: 1.6em;
  padding: 10px 0 10px 0;
  color: rgba(0, 192, 192, 1);
  font-family: Impact, impactreg, "Segoe UI";
  color: purple;
  text-transform: uppercase;
  margin-bottom: 15px;
}
#content-services div.service-description {
  margin-bottom: 25px;
}
#content-services div.service-description p {
  font-size: 1.2em;
  width: 95%;
  margin-left: auto;
  margin-right: auto;
  text-align: left;
}
#content-services hr {
  margin-bottom: 20px;
}
#content-services .our-services div {
	margin-bottom: 10px;
}
#content-services .our-services .wrapper{
  background-color: white;
  margin-bottom: 20px;
  border-radius: 15px;
  height: 92%;
  box-shadow: 1px 2px 5px rgba(120, 120, 120, 1);
}
#content-services .our-services img {
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
  height: 200px;
}
#content-services .our-services .wrapper:hover {
  background-color: rgba(255, 174, 201, 1);
}
#content-services .wrapper a {
  color: purple;
  height: 100%;
  display: block;
  padding-bottom: 5px;
}
#content-services .wrapper a:hover {
  text-decoration: none;
}
#content-services h3 {
  font-size: 1.2em;
  font-weight: bold;
  color: black;
}
.technologies-container {
  padding-left: 5%;
  padding-right: 5%;
  background-color: whitesmoke;
  padding-top: 20px;
  padding-bottom: 60px;
	border-top: 1px solid lightgray;
}
.technologies div.tech-intro p {
  font-size: 1.2em;
  width: 90%;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}
.technologies h2 {
  text-align: center;
  font-size: 1.5em;
  padding: 0px 0 5px 0;
  color: rgba(0, 192, 192, 1);
}
.technologies hr {
  margin-bottom: 30px;
}
.technology div {
  border-radius: 10px;
  padding-top: 25px;
  padding-bottom: 25px;
  background-color: rgba(255, 255, 255, 0.7);
  margin-bottom: 20px;
  box-shadow: 1px 2px 5px rgba(120, 120, 120, 1);
}
.technology img {
  height: 120px;
  width: 120px;
  margin-left: auto;
  margin-right: auto;
}
#content-products {
  margin-top: -17px;
}
.our-products-container {
  padding-bottom: 30px;
  background-image: none;
  background-color: whitesmoke;
}
.our-products h3 {
  text-transform: uppercase;
  margin-top: 20px;
}
.our-products hr {
  margin-bottom: 20px;
}
.our-products .products-intro {
  font-size: 1.2em;
  text-align: left;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
}
#content-projects {
  margin-top: -17px;
}
.dev .nav-item  .fas, .dev .nav-item  .fab {
  font-size: 3em;
  margin-top: 15px;
  margin-bottom: 10px;
}
.webp .our-projects-container, .no-webp .our-projects-container {
  padding-bottom: 30px;
  background-image: none;
  padding-top: 20px;
  background-color: whitesmoke;
}
#content-projects .our-projects-container  {
	padding-bottom: 80px;
}
#content-projects .our-projects > h3 {
  margin-top: 0px;
  margin-bottom:  20px;
  text-transform: uppercase;
  font-family: Impact, impactreg, "Segoe UI";
	color: purple;
}
#content-projects .our-projects hr {
  margin-bottom: 20px;
}
#content-projects .our-projects .projects-intro {
  font-size: 1.2em;
  width: 90%;
  text-align: left;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 40px;
}
#content-projects .our-projects .nav-item a:not(.active) .fab {
	color: purple;
}
#content-projects .our-projects .nav-item a:not(.active) .fas {
	color: purple;
}
#content-projects .our-projects .nav-item a:not(.active) span {
	color: purple;
}
#content-projects .get-quote-container {
  padding-top: 60px;
  padding-bottom: 80px;
  background-image: url('images/mesh.jpg');
  background-size: cover;
}
#content-projects .get-quote {
  background-color: black;
  border-top: 20px solid rgba(255, 174, 87, 1);
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  padding: 30px 5% 30px 5%;
  border-radius: 20px;
  box-shadow: 1px 2px 5px rgba(120, 120, 120, 1);
  background-image: url('images/energy-form.jpg');
  background-size: cover;
}
#content-projects div.get-quote-container h2 {
  text-align: center;
  font-weight: bold;
  margin-bottom: 20px;
  font-size: 1.6em;
  font-family: Impact, impactreg, "Segoe UI";
	color: purple;
}
#content-projects .get-quote-container > p {
  font-size: 1.5em;
  text-align: left;
  width: 95%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 40px;
  margin-top: 20px;
}
#content-projects .get-quote-container > p#ajax-server-response {
  background-color: rgba(0, 230, 230, 1);
  border-left: 8px solid rgba(255, 174, 87, 1);
  padding: 10px;
  width: 85%;
  font-size: 1em;
  text-align: left;
}
#content-projects .get-quote-container > p#ajax-server-response > i {
  background-color: teal;
  width: 25px;
  height: 25px;
  line-height: 25px;
  text-align: center;
  border-radius: 50%;
  color: whitesmoke;
}
#content-projects .get-quote-container > p#ajax-error-response {
  background-color: rgba(0, 230, 230, 1);
  border-left: 8px solid rgba(255, 174, 87, 1);
  padding: 10px;
  width: 85%;
  font-size: 1em;
  text-align: left;
}
#content-projects .get-quote-container > p#ajax-error-response > i {
  background-color: rgba(200, 0, 0, 1);
  width: 30px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  border-radius: 50%;
  color: whitesmoke;
}
#content-projects .get-quote h3 {
  font-family: Impact, impactreg;
  margin-bottom: 15px;
  color: whitesmoke;
  font-size: 1.5em;
}
#content-projects .get-quote p {
  font-size: 1.1em;
  color: whitesmoke;
}
#content-projects .get-quote .form-group label {
  font-weight: bold;
  color: whitesmoke;
}
#content-projects .get-quote .form-group label sup {
  font-size: 1em;
  margin-left: 3px;
  vertical-align: text-bottom;
  display: inline-block;
  padding-bottom: 3px;
}
#content-projects .get-quote .form-group input {
  background-color: whitesmoke;
} 
#content-projects .get-quote .form-group .invalid-feedback {
  color: rgba(255, 150, 150, 1);
  font-weight: bold;
}
#content-projects .get-quote .label-checkboxes {
  font-weight: bold;
  margin-bottom: 10px;
  color: whitesmoke;
}
#content-projects .get-quote #pricing-label {
  margin-top: 15px;
}
#content-projects .get-quote .form-check-label {
  color: whitesmoke;  
}
#content-projects .get-quote .form-check {
  padding-top: 4px;
  padding-bottom: 4px;
  color: whitesmoke;
}
#content-projects .get-quote .text-message {
  margin-top: 10px;
}
#content-projects .get-quote textarea {
  height: 200px;
  background-color: whitesmoke;
}
#content-projects .get-quote .btn {
  width: 180px;
  font-weight: bold;
  margin-top: 10px;
  height: 50px;
  font-size: 1.2em;
  background-color: rgba(23, 162, 184, 1);
  border: 1px solid rgba(23, 162, 184, 1);
}
#content-projects .get-quote .btn:hover {
  background-color: rgba(23, 162, 184, 0);
  border: 3px solid rgba(23, 162, 184, 1);
}
#content-projects .get-quote .btn .fa-paper-plane {
  padding-right: 5px;
}

#content-contact .contact-container {
  padding-top: 30px;
  padding-bottom: 60px;
  background-image: url('images/mesh.jpg');
  background-size: cover;
  margin-top: -17px;
}
#content-contact .contact {
  background-image: linear-gradient(to bottom right, purple, teal);
  border-top: 20px solid whitesmoke;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  padding: 30px 5% 30px 5%;
  border-radius: 20px;
  box-shadow: 1px 2px 5px rgba(120, 120, 120, 1);
}
#content-contact .contact-container h2 {
  text-align: center;
  font-weight: bold;
  margin-bottom: 20px;
  font-size: 1.6em;
  font-family: Impact, impactreg, "Segoe UI";
	color: purple;
}
#content-contact .contact-container > p {
  font-size: 1.5em;
  text-align: left;
  width: 95%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 20px;
  margin-top: 20px;
} 
#content-contact .contact-container > p#ajax-server-response {
  background-color: rgba(0, 230, 230, 1);
  border-left: 8px solid rgba(255, 174, 87, 1);
  padding: 10px;
  width: 100%;
  font-size: 1em;
  text-align: left;
  position: relative;
  padding-right: 35px;
}
#content-contact .contact-container > p#ajax-server-response > i.fa-check {
  background-color: teal;
  width: 25px;
  height: 25px;
  line-height: 25px;
  text-align: center;
  border-radius: 50%;
  color: whitesmoke;
}
#content-contact .contact-container > p#ajax-server-response > i.fa-times {
  width: 22px;
  height: 22px;
  line-height: 22px;
  text-align: center;
  border-radius: 50%;
  color: teal;
  font-size: 1em;
 cursor: pointer;
 position: absolute;
 right: 10px;
 top: 13px;
 background-color: teal;
 color: white;
}
#content-contact .contact-container > p#ajax-server-response > i.fa-times:hover {
background-color: rgba(200, 0, 0, 1);
}
#content-contact .contact-container > p#ajax-error-response {
  background-color: rgba(0, 230, 230, 1);
  border-left: 8px solid rgba(255, 174, 87, 1);
  padding: 10px;
  width: 100%;
  font-size: 1em;
  text-align: left;
  position: relative;
  padding-right: 35px;
}
#content-contact .contact-container > p#ajax-error-response > i {
  background-color: rgba(200, 0, 0);
  width: 30px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  border-radius: 50%;
  color: whitesmoke;
}
#content-contact .contact-container > p#ajax-error-response > i.fa-times {
  width: 22px;
  height: 22px;
  line-height: 22px;
  text-align: center;
  border-radius: 50%;
  color: teal;
  font-size: 1em;
 cursor: pointer;
 position: absolute;
 right: 10px;
 top: 13px;
 background-color: teal;
 color: white;
}
#content-contact .contact-container > p#ajax-error-response > i.fa-times:hover {
background-color: rgba(200, 0, 0, 1);
}
#content-contact .contact h3 {
  font-family: Impact, impactreg;
  margin-bottom: 15px;
  color: whitesmoke;
  font-size: 1.5em;
}
#content-contact .contact p {
  font-size: 1.1em;
  color: whitesmoke;
}
#content-contact .contact .form-group label {
  font-weight: bold;
  color: whitesmoke;
}
#content-contact .contact .form-group label sup {
  font-size: 1em;
  margin-left: 3px;
  vertical-align: text-bottom;
  display: inline-block;
  padding-bottom: 3px;
}
#content-contact .contact .form-group input {
  background-color: whitesmoke;
} 
#content-contact .contact .form-group .invalid-feedback {
  color: rgba(255, 150, 150, 1);
  font-weight: bold;
}
#content-contact .contact .label-checkboxes {
  font-weight: bold;
  margin-bottom: 10px;
  color: rgba(130, 130, 130, 1);
}
#content-contact .contact .form-check {
  padding-top: 4px;
  padding-bottom: 4px;
}
#content-contact .contact .text-message {
  margin-top: 10px;
}
#content-contact .contact textarea {
  height: 200px;
  background-color: whitesmoke;
}
#content-contact .contact .btn {
  width: 180px;
  font-weight: bold;
  margin-top: 10px;
  height: 50px;
  background-color: rgba(23, 162, 184, 1);
  border: 1px solid rgba(23, 162, 184, 1);
}
#content-contact form div.g-recaptcha {
  
}
#content-contact .contact .btn:hover {
  background-color: rgba(255, 174, 87, 1);
  border: 3px solid rgba(255, 174, 87, 1);
}
#content-contact .contact .btn .fa-paper-plane {
  padding-right: 5px;
}
#content-contact .contacts-container {
  padding-top: 4em;
  padding-bottom: 6em;
  background-image: url('images/office.jpg');
  background-size: cover;
}
#content-contact #contacts {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  background-color: rgba(0, 0, 0, 0.5);
  padding-bottom: 70px;
  padding-top: 30px;
  border-radius: 30px;
  border-top: 30px solid rgba(255, 174, 87, 1);
}
#content-contact div#contacts > div {
  padding: 0px 0 0px 0;
  height: 150px;
  margin: auto;
}
#content-contact div#contacts div#contact-one {
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  padding-bottom: 10px;
}
#content-contact div#contacts div#contact-five {
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}
#content-contact div#contacts > div h3 {
  text-align: center;
  font-family: Impact, impactreg, "Arial Black", Helvetica, sans-serif;
  font-weight: 900;
  padding-bottom: 5px;
  color: rgba(255, 174, 87, 1);
  font-size: 1.3em;
}
#content-contact div#contacts > div > p {
  text-align: left;
  width: 100%;
  float: left; 
  text-align: center;
  box-sizing: border-box;
}
#content-contact div#contacts > div div.contact-heading-description {
  width: 100%;
  float: left;
  font-family: Arial;
  font-size: 1em;
  text-align: center;
}
#content-contact div#contacts > div > div p {
  color: whitesmoke;
  font-size: 0.9em;
}
#content-contact div#contacts > div > p i {
  background-color: whitesmoke;
  color: rgba(0, 0, 0, 0.7);
  width: 50px;
  height: 50px;
  line-height: 50px;
  border-radius: 50%;
  font-size: 1.5em;
  text-align: center;
}
#content-contact + footer {
  clear: left;
}
#content-contact .google-map-container h3 {
  text-align: center;
  margin-top: 0px;
  text-transform: uppercase;
  font-weight: bold;
  margin-bottom: 20px;
	color: purple;
	padding-top: 10px;
  font-size: 1.6em;
  font-family: Impact, impactreg, "Segoe UI";
}
#content-contact .google-map-container hr {
  margin-bottom: 30px;
}
#content-contact .google-map-container {
  padding-top: 40px;
  padding-bottom: 40px;
  background-color: whitesmoke;
}
#content-contact .google-map-container iframe {
  width: 95%;
  display: block;
  height: 150px;
  margin-left: auto;
  margin-right: auto;
  box-shadow: 1px 2px 5px rgba(120, 120, 120, 1);
	margin-bottom: 40px;
}
#content-contact .google-map-container iframe {
  width: 95%;
  height: 150px;
  margin-left: auto;
  margin-right: auto;
  box-shadow: 1px 2px 5px rgba(120, 120, 120, 1);
}
#content-blog {
  margin-top: -17px;
}
.blog-content .tab-content {
  background-color: white;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}
.blog-content-container {
  background-color: whitesmoke;
  padding-bottom: 60px;
  padding-left: 5%;
  padding-right: 5%;
	padding-top: 10px;
}
.blog-content .section-title {
   color: purple;
   font-family: Impact, impactreg, "Segoe UI";
   font-size: 1.6em;
   width: 80%;
   margin-left: auto;
   margin-right: auto;
}
.blog-content hr {
  margin-bottom: 40px;
}
.blog-content .fas, .blog-content .fab {
  font-size: 1.5em; 
}
.blog-content .tab-content .row  {
  padding-top: 15px;
  padding-bottom: 15px;
  padding-left: 5%;
  padding-right: 5%;
}
.blog-content .tab-content .row > div {
  padding-left: 0;
  padding-right: 0;
}
.blog-content .tab-content .row > div > div {
  padding-left: 0px;
  padding-right: 0px;
  padding-bottom: 20px;
  margin-bottom: 20px;
	margin-top: 20px;
  background-color: white;
  border-radius: 20px;
  box-shadow: 1px 2px 5px rgba(120, 120, 120, 1);
}
.blog-content .tab-content .row > div > div a {
  color: black;
	display: flex;
	flex-direction: column;
	height: 100%;
	margin-bottom: -20px;
}
.blog-content .tab-content .row > div > div a:hover {
  text-decoration: none;
}
.blog-content .tab-content .row div div:hover {
  background-color: lightblue;
}
.blog-content .tab-content .row div .image-container img {
  height: 200px;
  width: 100%;
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
}
.blog-content .tab-content .row div .sub-title {
  font-size: 1.2em;
  text-align: left;
  width: 100%;
  margin-bottom: 20px;
  font-family: "Teko Semibold", Impact, impactreg;
  padding-left: 15px;
  padding-right: 15px;
	color: purple;
}
.post-excerpt {
  padding-left: 15px;
  padding-right: 15px;
	flex: auto;
}
.post-excerpt + p {
  padding-left: 15px;
}
.blog-content .post-author-image {
   width: 50px;
   height: 50px;
   border-radius: 50%;
   margin-bottom: 10px;
   margin-right: 10px;
   float: left;
}
.blog-content .post-meta {
  display: inline-block;
  font-size: 0.8em;
  width: 75%;
}
#content-service {
  margin-top: -17px;
  overflow: clip;
}
#content-service .service-content-container {
  padding-top: 20px;
  background-color: unset;
  padding-bottom: 0px;
  padding-left: 0;
  padding-right: 0;
  margin-top: -40px;
}
#content-service .overview-container {
  padding-left: 30px;
  padding-right: 30px;
  padding-top: 40px;
  background-size: cover;
  background-color: whitesmoke;
  background-image: url('images/mesh.jpg');
  background-size: cover;
  margin-top: -10px;
  padding-bottom: 20px;
}
#content-service .overview-container h2 {
  font-family: Impact, impactreg;
  text-transform: uppercase;
  text-align: center;
  font-size: 1.6em;
  margin-bottom: 20px;
  width: 100%;
	color: purple;
}
#content-service .overview-container .overview {
  width: 100%;
}
#content-service .overview-container .overview-image img {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  height: 200px;
  display: block;
  border: 5px solid white;
  box-shadow: 1px 2px 5px rgba(120, 120, 120, 1);
}
#content-service .overview-intro {
  font-size: 1em;
  margin-bottom: 30px;
}
#content-service .indepth-description {
  padding-left: 30px;
  padding-right: 30px;
  padding-top: 30px;
  background-color: whitesmoke;
  padding-bottom: 30px;
}
#content-service .indepth-description div  {
  margin-bottom: 20px;
}
#content-service .indepth-description p  {
  margin-bottom: 20px;
}
#content-service .work-flow {
  padding-bottom: 80px;
  margin-top: -15px;
  padding-left: 30px;
  padding-right: 30px;
  padding-top: 30px;
  background-image: url('images/mesh.jpg');
  background-size: cover;
}
#content-service .work-flow >  [class*='col-'] {
  display: flex;
  padding-left: 0;
  padding-right: 0;
}
#content-service .work-flow > div > div {
  padding-left: 0;
  padding-right: 0;
}
#content-service .work-flow div div  {
  margin-top: 20px;
  border-radius: 10px;
  border-top: 10px solid rgba(255, 174, 87, 1);
  background-color: purple; 
}
#content-service .work-flow .section-title {
  font-family: Impact, impactreg;
  font-size: 1.5em;
  color: purple;
  text-transform: capitalize;
  text-align: left;
}
#content-service .work-flow .section-description {
  color: white;
  font-size: 1em;
  text-align: left;
  margin-bottom: 0px;
}
#content-service .work-flow div div p {
  text-align: center;
}
#content-service .work-flow .sub-title {
  color: rgba(210, 210, 210, 1);
  font-weight: bold;
}
#content-service .work-flow .excerpt {
  color: rgba(210, 210, 210, 1);
}
#content-service .work-flow .section-description {
  color: black;
}
#content-service .work-flow .fas {
  font-size: 3em;
  background-color: rgba(255, 174, 87, 1);
  color: white;
  width: 90px;
  height: 90px;
  line-height: 90px;
  border-radius: 50%;
  margin-top: 30px;
  text-align: center;
}
.testimonials .testimony span {
  font-family: "Trebuchet MS", Helvetica, Arial;
  font-size: 1.5em;
  padding-right: 5px;
}
#content-service .testimonials, #content-services .testimonials {
  background-image: linear-gradient(to bottom right, purple, teal);
  padding-left: 5%;
  padding-right: 5%;
  text-align: center;
  padding-top: 20px;
  padding-bottom: 30px;
}
#content-service .testimonial-container, #content-services .testimonial-container {
  padding-bottom: 30px;
  width: 75%;
  margin-left: auto;
  margin-right: auto;
}
#content-service .testimonials h2, #content-services .testimonials h2 {
  text-transform: uppercase;
  color: black;
}
#content-services .testimonials hr {
  margin-top: -20px;
}
#content-services .testimonials p {
  width: 100%;
}
#content-service .testimonials .testimony, #content-services .testimonials .testimony {
  font-size: 1.5em;
  color: whitesmoke;
  font-weight: bold;
} 
#content-service .testimonials .ceo-name, #content-services .testimonials .ceo-name  {
  font-size: 0.9em;
  color: whitesmoke;
  font-weight: bold;
}
#content-service .faqs, #content-services .faqs {
  padding-top: 30px;
	padding-bottom: 20px;
  padding-left: 15px;
  padding-right: 15px;
}
#content-service .faqs h2, #content-services .faqs h2 {
  font-family: Impact, impactreg;
  font-size: 1.6em;
  text-align: center;
  margin-bottom: 20px;
  width: 100%;
}
#content-service .faqs-intro, #content-services .faqs-intro {
  font-size: 1.2em;
  text-align: center;
  width: 100%;
}
#content-services .faqs .question-container {
  height: 100%;
}
#content-service .faqs .wrapper, #content-services .faqs .wrapper {
  padding-left: 0;
  padding-right: 0;
  height: 100%;
  margin-bottom: 30px;
}
#content-service .question-container:last-child, #content-services .question-container:last-child {
  margin-bottom: 30px;
}
#content-service .question, #content-services .question {
  padding: 10px;
  background-color: purple;
	background-image: linear-gradient(to right, purple, teal);
  color: whitesmoke;
  font-weight: bold;
  overflow: auto;
  margin-bottom: 0px;
  height: 75px;
}
#content-services .answer a {
  display: inline-block;
}
#content-service .question span:nth-child(1), #content-services .question span:nth-child(1) {
  float: left;
  width: 90%;
  padding-left: 7px;
}
#content-service .question span:nth-child(2), #content-services .question span:nth-child(2) {
  float: left;
  width: 10%;
  text-align: center;
  font-size: 1.3em;
  cursor: pointer;
}
#content-service .answer, #content-services .answer {
  padding: 15px 15px 25px 15px;
  clear: left; 
  display: none;
  background-color: whitesmoke;
  height: 100%;
  border-bottom-left-radius: 30px;
  border-bottom-right-radius: 30px;
  box-shadow: 1px 2px 5px rgba(120, 120, 120, 1);
}
#content-service .quote-question {
  background-color: teal;
  padding: 60px 5% 60px 5%;
  text-align: center;
}
#content-service .quote-question h2, #content-services .quote-question h2 {
  font-size: 2.2em;
  text-align: center;
  width: 100%;
}
#content-service .quote-question h2 span:nth-child(1) {
  font-weight: bold;
  color: rgba(255, 174, 87, 1);
  text-align: center;
  display: block;
  margin-bottom: -20px;
  width: 60%;
  margin-left: auto;
  margin-right: auto;
}
#content-service .quote-question h2 span:nth-child(3) {
  color: whitesmoke;
  display: block;
  margin-bottom: 20px;
  font-size: 0.7em;
  text-align: center;
  width: 70%;
  margin-left: auto;
  margin-right: auto;
}
#content-service .quote-question p {
  text-align: center;
  width: 100%;
}
#content-service .quote-question .btn-info {
  font-size: 1.2em;
  height: 50px;
  font-weight: bold;
  width: 180px;
  background-color: purple;
  border: 1px solid purple;
}
#content-service .quote-question .btn-info:hover {
  background-color: teal;
  border: 3px solid purple;
}
#content-service .our-services {
  padding-left: 15px;
  padding-right: 15px;
  background-image: url('images/mesh.jpg');
  background-size: cover;
	padding-top: 30px;
	padding-bottom: 60px;
}
#content-service .our-services h2 {
  text-align: center;
  font-size: 1.6em;
  padding: 0px 0 10px 0;
  color: rgba(0, 192, 192, 1);
  font-family: Impact, impactreg, "Segoe UI";
  color: purple;
  text-transform: uppercase;
  margin-bottom: 10px;
}
#content-services .our-services hr {
  margin-bottom: 20px;
}
#content-service .our-services .service {
	margin-top: 10px;
}
#content-service .our-services .wrapper {
  background-color: white;
  margin-bottom: 20px;
  border-radius: 15px;
  height: 92%;
  box-shadow: 1px 2px 5px rgba(120, 120, 120, 1);
}
#content-service .our-services img {
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
  height: 200px;
}
#content-service .our-services .wrapper:hover {
  background-color: rgba(255, 174, 201, 1);
}
#content-service .wrapper h3 {
  color: black;
  font-size: 1.2em;
  font-weight: bold;
}
#content-service .wrapper a {
  height: 100%;
  display: block;
  padding-bottom: 5px;
}
#content-service .wrapper a:hover {
  text-decoration: none;
}
#content-project {
  margin-top: -17px;
  overflow: clip;
}
#content-project .project-content-container {
  padding-top: 20px;
  background-color: unset;
  padding-bottom: 0px;
  padding-left: 0;
  padding-right: 0;
  margin-top: -40px;
}
#content-project .overview-container {
  padding-left: 5%;
  padding-right: 5%;
  padding-top: 40px;
  background-size: cover;
  background-color: whitesmoke;
  background-image: url('images/mesh.jpg');
  background-size: cover;
  margin-top: -10px;
  padding-bottom: 20px;
}
#content-project .overview-container h2 {
  font-family: Impact, impactreg;
  text-transform: uppercase;
  text-align: center;
  font-size: 1.6em;
  margin-bottom: 20px;
  width: 100%;
}
#content-project .overview-container .overview-image img {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  height: auto;
  display: block;
  border: 5px solid white;
  box-shadow: 1px 2px 5px rgba(120, 120, 120, 1);
}
#content-project .overview-intro {
  font-size: 1em;
  margin-bottom: 30px;
}
#content-project .indepth-description {
  padding-left: 5%;
  padding-right: 5%;
  padding-top: 30px;
  background-color: whitesmoke;
  padding-bottom: 30px;
}
#content-project .indepth-description h3 {
  font-family: Impact, impactreg;
  font-size: 1.6em;
  color: teal;
}
#content-project .project-meta {
  width: 100%;
}
#content-project .project-meta #pcu-logo img {
  height: auto;
  width: 150px;
}
#content-project .project-meta #goshen-logo img {
  height: auto;
  width: 230px;
}
#content-project .project-meta ul {
  padding-top: 10px;
  list-style-type: none;
  padding-left: 0;
  width: 100%;
  display: block;
}
#content-project .project-meta ul li {
  line-height: 25px;
  overflow: auto;
  width: 100%;
}
#content-project .project-meta ul .name {
  font-size: 1em;
  font-weight: bold;
  float: left;
  display: inline-block;
  width: 35%;
}
#content-project .project-meta ul .value {
  float: left;
  display: inline-block;
  width: 65%;
}
#content-project .project-main {
  clear: left;
  margin-top: 15px;
}
#content-project .project-photos {
  background-image: url('images/mesh.jpg');
  background-size: cover;
  padding-top: 30px;
  padding-bottom: 20px;
  padding-left: 5%;
  padding-right: 5%;
}
#content-project .project-photos p {
  height: 150px;
}
#content-project .project-photos p img {
  height: 100%;
  width: 100%;
  box-shadow: 1px 2px 5px rgba(120, 120, 120, 1);
}

#content-project .testimonials {
  background-color: teal;
  padding-left: 5%;
  padding-right: 5%;
  text-align: center;
  padding-top: 20px;
  padding-bottom: 30px;
}
#content-project .testimonial-container {
  padding-bottom: 30px;
  width: 75%;
  margin-left: auto;
  margin-right: auto;
}
#content-project .testimonials h2.section-title {
  text-transform: uppercase;
  color: black;
}
#content-project .testimonials .testimony {
  font-size: 1.5em;
  color: whitesmoke;
  font-weight: bold;
} 
#content-project .testimonials .ceo-name {
  font-size: 0.9em;
  color: whitesmoke;
  font-weight: bold;
}
#content-project .faqs {
  padding-top: 30px;
  padding-left: 5%;
  padding-right: 5%;
  background-image: url('images/mesh.jpg');
  background-size: cover;
}
#content-project .faqs h2 {
  font-family: Impact, impactreg;
  font-size: 1.6em;
  text-align: center;
  margin-bottom: 20px;
  width: 100%;
}
#content-project .faqs-intro {
  font-size: 1.2em;
  text-align: center;
  width: 100%;
}
#content-project .faqs .wrapper {
  border-bottom-left-radius: 30px;
  border-bottom-right-radius: 30px;
  box-shadow: 1px 2px 5px rgba(120, 120, 120, 1);
  background-color: white;
  margin-bottom: 20px;
  padding-left: 0;
  padding-right: 0;
}
#content-project .question-container:last-child {
  margin-bottom: 30px;
}
#content-project .question {
  padding: 10px;
  background-color: purple;
  color: whitesmoke;
  font-weight: bold;
  overflow: auto;
}
#content-project .question span:nth-child(1) {
  float: left;
  width: 90%;
  padding-left: 7px;
}
#content-project .question span:nth-child(2) {
  float: left;
  width: 10%;
  text-align: center;
  font-size: 1.3em;
  cursor: pointer;
}
#content-project .answer {
  padding: 0px 15px 25px 15px;
  clear: left;
  display: none;
}
#content-project .quote-question {
  background-color: teal;
  padding: 20px 5% 10px 5%;
  text-align: center;
}
#content-project .quote-question h2 {
  font-size: 2.2em;
  text-align: center;
  width: 100%;
}
#content-project .quote-question h2 span:nth-child(1) {
  font-weight: bold;
  color: rgba(255, 174, 87, 1);
  text-align: center;
  display: block;
  margin-bottom: -20px;
  width: 60%;
  margin-left: auto;
  margin-right: auto;
}
#content-project .quote-question h2 span:nth-child(3) {
  color: whitesmoke;
  display: block;
  margin-bottom: 20px;
  font-size: 0.7em;
  text-align: center;
  width: 70%;
  margin-left: auto;
  margin-right: auto;
}
#content-project .quote-question p {
  text-align: center;
  width: 100%;
}
#content-project .quote-question .btn-info {
  font-size: 1.2em;
  height: 50px;
  font-weight: bold;
  width: 180px;
  background-color: purple;
  border: 1px solid purple;
}
#content-project .quote-question .btn-info:hover {
  background-color: teal;
  border: 3px solid purple;
}
.related-projects {
 padding-bottom: 30px;
 padding-left: 5%;
 padding-right: 5%;
 background-image: url('images/mesh.jpg');
 background-size: cover;
}
.related-projects .section-title {
  color: rgba(0, 192, 192, 1);
  color: black;
  font-family: Impact, impactreg, "Segoe UI";
  font-size: 1.6em;
  margin-bottom: 20px;
  text-transform: uppercase;
}
.related-projects hr {
  margin-bottom: 30px;
}
.related-projects .fas, .related-projects .fab {
  font-size: 1.5em; 
}
.related-projects .project {
  position: relative;
  height: auto;
  padding-left: 0px;
  padding-right: 0px;
  margin-bottom: 20px;
}
.related-projects div img {
  height: 100%;
  width: 100%;
}
.related-projects div .sub-title {
  font-size: 1em;
  position: absolute;
  text-align: center;
  left: 0px;
  bottom: 0px;
  height: 40px;
  line-height: 40px;
  width: 100%;
  color: white;
  background-color: rgba(0, 0, 0, 0.5);
  margin-bottom: 0px;
  font-family: Impact, impactreg;
  text-transform: uppercase;
}
.related-projects .sub-title .fas, .related-projects .sub-title .fab {
  margin-right: 10px;
}
.related-projects p#blur-on {
  text-align: center;
  background-color: rgba(135, 206, 235, 0.5);
  height: 100%;
  position: absolute;
  width: 100%;
  z-index: 1;
  color: white;
  box-sizing: border-box;
  padding-top: 50px;
}
.related-projects p#blur-on span#description {
  font-family: Impact, impactreg;
  font-size: 1.5em;
}
.related-projects p#blur-on span#more {
  font-family: Impact, impactreg;
  font-size: 1.8em;
  text-transform: uppercase;
  display: inline-block;
  margin-top: 30px;
}
#content-post .post-content-container {
  margin-top: -17px;
  padding-top: 10px;
  background-color: white;
  padding-left: 0;
  padding-right: 0;
  padding-bottom: 0;
  overflow: clip;
}
#content-post .post-content {
  padding-left: 5%;
  padding-right: 5%;
}
#content-post h2 {
  font-family: Arial, sans-serif;
  font-size: 1.6em;
  text-align: left;
  margin-bottom: 20px;
  width: 100%;
  font-weight: bold;
	color: purple;
}
#content-post .post-content .post-main strong {
	font-family: consolas;
}
#content-post .post-content .post-main h4 {
	font-weight: 650;
}
#content-post .post-content .post-footer h4 {
	font-weight: 650;
}
#content-post .post-content code:not(pre code) {
	color: black;
	background-color: rgba(243, 230, 243);
	padding: 2px 10px 2px 10px;
	border-radius: 5px;
}
#content-post .post-meta {
  font-size: 1em;
  width: 100%;
  margin-top: -10px;
}
#content-post .stripes {
  margin-bottom: 30px;
}
#content-post .post-meta small {
  font-weight: bold;
}
#content-post .stripe-1 {
  height: 5px;
  background-color: purple;
}
#content-post .stripe-2 {
  height: 5px;
  background-color: rgba(189, 122, 87, 1);
}
#content-post .stripe-3 {
  height: 5px;
  background-color: rgba(112, 146, 190, 1);
}
#content-post .post-image-container {
  margin-bottom: 20px;
  margin-top: 20px;
}
#content-post .post-summary {
  background-color: rgba(243, 230, 243);
  border-bottom-left-radius: 30px;
  border-bottom-right-radius: 30px;
  margin-bottom: 40px;
}
#content-post .post-summary h3 {
  font-family: Impact, impactreg;
  text-align: left;
  color: whitesmoke;
  background-color: purple;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 25px;
}
#content-post .post-summary ol {
  padding-top: 10px;
  padding-bottom: 20px;
  padding-right: 15px;
}
#content-post .post-summary ol li {
  margin-bottom: 10px;
}
#content-post .post-summary ol li a {
  color: purple;
}
#content-post .main-post-content {
  font-size: 1.08em;
}
#content-post .main-post-content a {
	color: blueviolet;
}
#content-post .post-summary a {
	color: teal;
}
#content-post .post-summary a:hover {
	color: teal;
	text-decoration: none;
}
#content-post .main-post-content strong {
	color: teal;
}
#content-post .main-post-content li:not(.post-summary li) {
	margin-bottom: 5px;
}
#content-post .main-post-content li img  {
	margin-top: 20px;
	margin-bottom: 20px;
}
#content-post .main-post-content pre {
	font-size: 0.8em;
}
#content-post .toolbar .copy-to-clipboard-button span {
  display: inline-block;
  height: 30px;
  line-height: 30px;
  width: 50px;
  font-size: 1em;
  font-family: Arial;
}
#content-post .main-post-content p.code-image-wrapper {
  overflow: auto;
}
#content-post .main-post-content p {
  margin-top: 15px;
  margin-bottom: 15px;
  font-size: 1em;
}
#content-post .main-post-content h3 {
  font-weight: bold;
  font-size: 1.5em;
  margin-top: 35px;
}
#content-post .main-post-content h3:not(#content-post .post-summary h3) {
	color: purple;
}
#content-post .post-conclusion {
  font-size: 1em;
}
#content-post .share-post {
  text-align: left;
  margin-bottom: 30px;
}
#content-post .share-post h4 {
  font-size: 1.6em;
  font-family: Impact, impactreg;
  margin-bottom: 20px;
}
#content-post .share-post .fab {
  background-color: teal;
  color: white;
  width: 40px;
  height: 40px;
  line-height: 40px;
  font-size: 1.5em;
  border-radius: 10px;
  text-align: center;
}
#content-post .share-post i.fa-facebook-f {
	background-color: purple;
}
#content-post .share-post i.fa-linkedin-in {
	background-color: rgba(189, 122, 87, 1);
}
#content-post .share-post i.fa-twitter {
	background-color: rgba(100, 124, 178, 1);
}
#content-post .share-post i.fa-whatsapp {
	background-color: teal;
}
#content-post .share-post i.fa-youtube {
	background-color: rgba(200, 0, 0, 1);
}
#content-post .post-author > p {
  text-align: center;
}
#content-post .post-author div {
  background-color: whitesmoke;
  margin-bottom: 30px;
  border-bottom-left-radius: 20px;
  border-bottom-right-radius: 20px;
  box-shadow: 1px 2px 5px rgba(120, 120, 120, 1);
}
#content-post .post-author div h4 {
  text-align: center;
  background-color: teal;
  padding-top: 5px;
  padding-bottom: 5px;
  color: whitesmoke;
}
#content-post .post-author div p {
  padding: 10px 20px 20px 20px;
}
#content-post .post-author h4 {
  font-family: Impact, impactreg;
  font-size: 1.3em;
}
#content-post .post-author > p img {
  width: 80px;
  height: 80px;
}
#content-post .post-comments {
  padding-bottom: 50px;
  margin-top: 40px;
}
#content-post #comments h2.comments-title {
  font-size: 1.4em;
}
#content-post .post-comments h3 {
  font-family: Impact, impactreg;
  font-size: 1.4em;
	color: purple;
} 
#content-post .post-comments .comment-list {
  padding-left: 0;
}
#content-post .post-comments li.comment {
  list-style-type: none;
}
#content-post .post-comments li.comment:last-child {
  margin-bottom: 40px;
}
#content-post .post-comments .comment-body {
  margin-bottom: 20px;
  position: relative;
  border: 5px solid whitesmoke;
  padding-bottom: 10px;
}
#content-post .post-comments .comment-author {
 background-color: purple;
 padding-top: 8px;
 padding-bottom: 10px;
 padding-left: 10px;
 color: whitesmoke;
}
#content-post .post-comments .comment-author img {
  border-radius: 50%;
}
#content-post .post-comments .comment-author cite {
  font-style: normal;
  margin-left: 20px;
}
#content-post .post-comments .comment-author cite a {
  color: rgba(0, 230, 230, 1);
}
#content-post .post-comments .comment-meta {
  font-size: 0.7em;
  position: absolute;
  top: 35px;
  left: 75px;
}
#content-post .post-comments .comment-meta a {
   color: rgba(0, 230, 230, 1);
}
#content-post .post-comments .comment-meta + p {
  padding-top: 20px;
  padding-left: 10px;
  padding-right: 10px;
  font-size: 0.85em;
}
#content-post .post-comments .comment-meta ~ p {
  padding-left: 10px;
  padding-right: 10px;
  font-size: 0.85em;
}
#content-post .post-comments .comment-awaiting-moderation {
  font-size: 0.85em;
  padding: 10px;
}
#content-post .post-comments .reply {
  margin-top: 0
}
#content-post .post-comments .reply .comment-reply-link {
  padding-left: 10px;
  color: gray;
}
#content-post .post-comments p {
  font-size: 1.1em; 
}
#content-post .post-comments .form-group label {
  color: purple;
  font-weight: bold;
}
#content-post .post-comments .form-group span {
  color: purple;
  font-weight: bold;
}
#content-post .post-comments .form-group input {
  width: 100%;
}
#content-post .post-comments .form-group textarea {
  width: 100%;
  height: 150px;
} 
#content-post .post-comments .btn-info {
  width: 180px;
  height: 50px;
  background-color: purple;
  font-weight: bold;
  margin-top: 10px;
  border: 1px solid purple;
}
#content-post .post-comments .btn-info:hover {
  background-color: teal;
  border: 1px solid teal;
}
#content-post .post-comments #submit {
  width: 180px;
  height: 50px;
  background-color: purple;
  font-weight: bold;
  margin-top: 10px;
  border: 1px solid purple;
  color: whitesmoke;
  border-radius: 5px;
}
#content-post .post-comments #submit:hover {
  background-color: teal;
  border: 1px solid teal;
}
#content-post .related-articles {
  background-color: whitesmoke;
  padding-top: 30px;
  padding-left: 5%;
  padding-right: 5%;
  padding-bottom: 60px;
}
#content-post .related-articles h2.section-title {
  text-transform: uppercase;
  margin-bottom: 20px;
  color: purple;
  text-align: center;
  font-family: Impact, impactreg;
}
#content-post .related-articles hr {
  margin-bottom: 30px;
}
#content-post .related-articles .wrapper {
  padding-left: 0px;
  padding-right: 0px;
  padding-bottom: 0px;
  margin-bottom: 40px;
  background-color: white;
  border-radius: 20px;
  box-shadow: 1px 2px 5px rgba(120, 120, 120, 1);
}
#content-post .related-articles > div > div a {
  color: black;
  display: flex;
  flex-direction: column;
  padding-bottom: 20px;
}
#content-post .related-articles > div > div a:hover {
  text-decoration: none;
}
#content-post .related-articles div div:hover {
  background-color: lightblue;
}
#content-post .related-articles div .image-container img {
  height: 200px;
  width: 100%;
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
}
#content-post .related-articles div .sub-title {
  font-size: 1.2em;
  text-align: left;
  width: 100%;
  margin-bottom: 15px;
  font-family: "Teko Semibold",Impact, impactreg;
  padding-left: 5%;
  padding-right: 5%;
	color: purple;
}
#content-post .post-excerpt {
  padding-left: 15px;
  padding-right: 15px;
  margin-bottom: 30px;
  flex: 1 1 auto;
}
#content-post .post-excerpt + p {
  padding-left: 15px;
}
#content-post .related-articles .post-author-image {
   width: 50px;
   height: 50px;
   border-radius: 50%;
   margin-bottom: 10px;
   margin-right: 10px;
   float: left;
}
#content-post .related-articles .post-meta {
  display: inline-block;
  font-size: 0.8em;
  width: 75%;
}
.follow-up {  
  padding-top: 40px;
  background-color: rgba(30, 30, 30,  1);
  background-size: cover;
  padding-left: 3%;
  padding-right: 3%;
	padding-bottom: 40px;
}
.no-webp .follow-up {
  background-image: url('images/energy.jpg');  
}
.webp .follow-up {
  background-image: url('images/energy.webp');  
}
.follow-up h3 {
  font-weight: bold;
  margin-bottom: 30px;
  color: rgb(220, 220, 220, 1);
  font-size: 1.6em;
	font-family: "Teko Semibold"
}
#subscribe-add-on {
  background-color: teal;
  border: 1px solid teal;
  color: white;
  font-weight: bold;
}
.follow-up .search-form {
  margin-bottom: 30px;
}
.follow-up .social-media {
  margin-bottom: 30px;
  display: inline-block;
  text-align: center;
}
.follow-up .fab {
  font-size: 1.5em;
  background-color: teal;
  color: white;
  width: 37px;
  height: 37px;
  line-height: 37px;
  text-align: center;
  border-radius: 50%;
}
.follow-up .btn {
  background-color: teal;
  border: 1px solid teal;
  font-weight: bold;
}
.follow-up .btn:hover {
  background-color: rgba(0, 128, 128, 0.8);
  border: 1px solid rgba(0, 128, 128, 0.8);
}
.g-recaptcha {
  position: relative;
  z-index: 2;
}
.grecaptcha-badge {
  visibility: hidden;
}
.follow-up #subscribe-response {
  background-color: teal;
  margin-top: 20px;
  padding-left: 10px;
  height: 25px;
  line-height: 25px;
  width: 240px;
  border-left: 5px solid rgba(255, 174, 87, 1);
  color: whitesmoke;
  font-weight: bold;
  position: relative;
}
.follow-up #subscribe-response .fa-times {
  font-size: 1em;
  width: 22px;
  height: 22px;
  line-height: 22px;
  top: 2px;
  right: 2px;
  position: absolute;
  text-align: center;
  cursor: pointer;
}
.follow-up #error-response {
  background-color: maroon;
  margin-top: 20px;
  padding-left: 10px;
  height: 25px;
  line-height: 25px;
  width: 255px;
  border-left: 5px solid rgba(255, 174, 87, 1);
  color: whitesmoke;
  font-weight: bold;
  position: relative;
}
.follow-up #error-response .fa-times {
  font-size: 1em;
  width: 22px;
  height: 22px;
  line-height: 22px;
  top: 2px;
  right: 2px;
  position: absolute;
  text-align: center;
  cursor: pointer;
}
.business-info {
  padding-bottom: 60px;
  padding-top: 60px;
  background-size: cover;
  color: white;
	background-color: purple;
  padding-left: 3%;
  padding-right: 3%;
	background-image: linear-gradient(to bottom, teal, purple);
}
.footer-branding {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}
.footer-branding a {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.footer-branding .codtronic-logo img {
  width: 130px;
  height: 130px;
  margin-right: 20px;
}
.footer-branding .company-name {
  font-family: Impact, impactreg;
  font-size: 1.7em;
  padding-top: 10px;
  color: rgba(255, 174, 87, 1);
  text-transform: uppercase;
}
.footer-branding .slogan {
  font-family: Impact, impactreg;
  font-size: 1.5em;
  margin-top: -20px;
  color: rgba(255, 174, 87, 1);
}

.business-info .mission {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  font-size: 1.1em;
  font-family: Arial;
}
.business-info .contacts .fas {
  display: block;
}
.business-info .contacts {
  margin-left: 0px;
}
.business-info .contacts .fas, .business-info .contacts .fab {
  font-size: 1.5em;
  background-color: rgba(23, 162, 184, 1);
  color: white;
  width: 50px;
  height: 50px;
  line-height: 50px;
  text-align: center;
  border-radius: 50%;
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 10px;
}
.contacts p {
  padding-bottom: 10px;
  font-size: 0.91em;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}
.services-provided h3 {
  font-weight: bold;
  margin-bottom: 20px;
  margin-top: 10px;
  color: skyblue;
  font-size: 1.5em;
	font-family: "Teko Semibold";
}
.footer-links ul {
  list-style: none;
  padding-left: 20px;
  line-height: 28px;
}
.footer-links ul#menu-important-links-navigation li:nth-child(4) {
  display: none;
}
.footer-links ul a {
  color: white;
}
.footer-links ul a:hover {
  text-decoration: none;
  color: rgba(255, 174, 87, 1);
}
.footer-links .fa-caret-right {
  margin-right: 10px;
}
.send-message-container {
  padding-bottom: 30px;
}
.send-us-message {
  margin-right: auto;
  margin-left: auto;
}
.send-us-message h3 {
  font-weight: bold;
  margin-bottom: 20px;
  color: skyblue;
  font-size: 1.5em;
	font-family: "Teko Semibold";
}
.send-us-message .form-group input {
  border-radius: 30px;
}
.send-us-message .form-group .invalid-feedback {
  color: rgba(255, 174, 7, 1);
}
.send-us-message textarea {
  height: 150px;
  border-radius: 15px;
}
.send-us-message .btn {
  width: 100%;
}
.send-us-message .btn {
  font-weight: bold;
  width: 100%;
  height: 50px;
  font-size: 1.2em;
}
.send-us-message .btn:hover {
  background-color: rgba(255, 174, 87, 1);
  border: 1px solid rgba(255, 174, 87, 1);
}
.send-us-message #subscribe-response {
  background-color: teal;
  margin-top: 20px;
  padding-left: 10px;
  height: 35px;
  line-height: 35px;
  width: 240px;
  border-left: 5px solid rgba(255, 174, 87, 1);
  color: whitesmoke;
  font-weight: bold;
  position: relative;
}
.send-us-message #subscribe-response .fa-times {
  font-size: 1em;
  width: 22px;
  height: 22px;
  line-height: 22px;
  top: 7px;
  right: 5px;
  position: absolute;
} 
.send-us-message #error-response {
  background-color: maroon;
  margin-top: 20px;
  padding-left: 10px;
  height: 35px;
  line-height: 35px;
  width: 260px;
  border-left: 5px solid rgba(255, 174, 87, 1);
  color: whitesmoke;
  font-weight: bold;
  position: relative;
}
.send-us-message #error-response .fa-times {
  font-size: 1em;
  width: 22px;
  height: 22px;
  line-height: 22px;
  top: 7px;
  right: 5px;
  position: absolute;
}
.copyright {
  background-color: rgba(53, 2, 77, 1);
  background-image: url("images/footer_background.jpg");
  padding-bottom: 0px;
  padding-left: 10px;
  padding-right: 10px;
}
.copyright p {
  text-align: center;
}
.copyright p:first-child {
  margin-top: 10px;
  color: white;
}
.copyright p:first-child a {
  color: white;
	font-weight: bold;
}
.copyright p:nth-child(2) {
  color: white;
  width: 100%;
	margin-top: -10px;
  margin-bottom: 10px;
}
.copyright p:nth-child(2) small span:last-child {
	display: none;
}
.copyright .developer {
  font-size: 0.98em;
}
.copyright .fa-heart {
  color: gold;
  font-size: 1.2em;
}

.cta-buttons .fa-arrow-up {
  background-color: rgba(0, 0, 0, 0.5);
  width: 50px;
  height: 50px;
  line-height: 50px;
  font-size: 1.8em;
  color: white;
  text-align: center;
  border-radius: 50%;
  position: absolute;
  right: 15px;
  bottom: 130px;
  position: fixed;
  z-index: 10;
  display: none;
}
.cta-buttons .fa-envelope  {
  background-color: purple;
  width: 50px;
  height: 50px;
  line-height: 50px;
  font-size: 1.8em;
  color: white;
  text-align: center;
  border-radius: 50%;
  position: absolute;
  right: 15px;
  bottom: 250px;
  position: fixed;
  z-index: 10;
}
.cta-buttons .fa-whatsapp {
  background-color: teal;
  width: 60px;
  height: 60px;
  line-height: 60px;
  font-size: 2.3em;
  color: white;
  text-align: center;
  border-radius: 50%;
  position: absolute;
  right: 15px;
  bottom: 50px;
  position: fixed;
  z-index: 10;
}
.cta-buttons .fa-phone {
  background-color: purple;
  width: 50px;
  height: 50px;
  line-height: 50px;
  font-size: 1.8em;
  color: white;
  text-align: center;
  border-radius: 50%;
  position: absolute;
  right: 15px;
  bottom: 190px;
  position: fixed;
  z-index: 10;
}
@media only screen and (min-width: 300px) {
.header-image-wrapper div.page-intro {
  top: 150px;  
}
.header-image-wrapper div .left {
  font-size: 1.7em;
 }
.header-image-wrapper div .right {
  font-size: 1em;
  }
#content-about .expert-services div.service {
    height: 200px;
}
  #content-about .core-values h3 {
    width: 260px;
    height: 260px;
    padding-top: 85px;
  }
  #testimonials .carousel-inner {
    height: 400px;
    padding-top: 10px;
  }
  .our-clients div.client:nth-child(5) img {
    width: 250px;
  }
.webp .carousel-item {
    height: 460px;
  }
.no-webp .carousel-item {
    height: 460px;
  }
  .follow-up .fab {
    width: 40px;
    height: 40px;
    line-height: 40px;
  }
.services-provided h3 {
   font-size: 1.6em; 
}
.send-us-message h3 {
    font-size: 1.6em;
  }
#content-project .project-photos p {
  height: 200px;
}
}
@media only screen and (min-width: 340px) {
#testimonials-carousel .carousel-inner {
   height: 350px; 
}
#content-contact #contacts {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  background-color: rgba(0, 0, 0, 0.5);
  padding-bottom: 70px;
  padding-top: 30px;
  border-radius: 30px;
  border-top: 30px solid rgba(255, 174, 87, 1);
}
#content-contact div#contacts > div {
  padding: 0px 0 0px 0;
  height: 150px;
  margin: auto;
}
#content-contact div#contacts div#contact-one {
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  padding-bottom: 10px;
}
#content-contact div#contacts div#contact-five {
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}
#content-contact div#contacts > div h3 {
  text-align: center;
  font-family: Impact, impactreg, "Arial Black", Helvetica, sans-serif;
  font-weight: 900;
  padding-bottom: 5px;
  color: rgba(255, 174, 87, 1);
  font-size: 1.5em;
}
#content-contact div#contacts > div > p {
  width: 100%;
  float: left; 
  text-align: center;
  box-sizing: border-box;
}
#content-contact div#contacts > div div.contact-heading-description {
  width: 100%;
  float: left;
  font-family: Arial;
  font-size: 1em;
  text-align: center;
}
#content-contact div#contacts > div > div p {
  color: whitesmoke;
  font-size: 1em;
}
#content-contact div#contacts > div > p i {
  background-color: whitesmoke;
  color: rgba(0, 0, 0, 0.7);
  width: 50px;
  height: 50px;
  line-height: 50px;
  border-radius: 50%;
  font-size: 1.5em;
  text-align: center;
}
#content-contact + footer {
  clear: left;
}
#content-contact .google-map-container h3 {
  text-align: center;
  margin-top: 0px;
  text-transform: uppercase;
  font-weight: bold;
  margin-bottom: 20px;
  font-size: 1.6em;
}
#content-contact .google-map-container hr {
  margin-bottom: 30px;
}
#content-contact .google-map-container {
  padding-top: 40px;
  padding-bottom: 40px;
  background-color: whitesmoke;
}
#content-contact .google-map-container iframe {
  width: 95%;
  height: 200px;
  margin-left: auto;
  margin-right: auto;
}
}
@media only screen and (min-width: 385px) {
  .carousel-caption {
    top: 130px;
  }
.webp  .carousel-item {
    height: 420px;
  }
.no-webp .carousel-item {
    height: 420px;
  }
  #content-about .core-values h3 {
    width: 300px;
    height: 300px;
    padding-top: 110px;
  }
  #content-about .expert-services div.service {
    height: 190px;
}
#content-project .project-meta ul .name {
  font-size: 1em;
  font-weight: bold;
  float: left;
  display: inline-block;
  width: 30%;
}
#content-project .project-meta ul .value {
  float: left;
  display: inline-block;
  width: 70%;
}

}
@media only screen and (min-width: 480px) {
#testimonials-carousel .carousel-inner {
   height: 300px; 
}
.webp .carousel-item {
    height: 400px;
}
.no-webp .carousel-item {
    height: 400px;
}
.recent-projects .tab-content .row div .sub-title {
  font-size: 1.4em;
  height: 60px;
  line-height: 60px;
}
.recent-projects p#blur-on {
  text-align: center;
  background-color: rgba(135, 206, 235, 0.5);
  position: absolute;
  width: 100%;
  z-index: 1;
  color: white;
  box-sizing: border-box;
  padding-top: 50px;
}
.recent-projects p#blur-on span#description {
  font-family: Impact, impactreg;
  font-size: 1.7em;
}
.recent-projects p#blur-on span#more {
  font-family: Impact, impactreg;
  font-size: 1.8em;
  text-transform: uppercase;
  display: inline-block;
  margin-top: 40px;
}
.recent-posts .tab-content .row div .image-container img {
  height: 300px;
}
.recent-posts .tab-content .row div .sub-title {
   font-size: 1.4em; 
}
#content-contact #contacts {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  background-color: rgba(0, 0, 0, 0.5);
  padding-bottom: 50px;
  padding-top: 40px;
  padding-left: 20px;
  border-radius: 30px;
  border-top: 30px solid rgba(255, 174, 87, 1);
}
#content-contact div#contacts > div {
  padding: 0px 0 0px 0;
  height: 100px;
  margin: auto;
}
#content-contact div#contacts div#contact-one {
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  padding-bottom: 10px;
}
#content-contact div#contacts div#contact-five {
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}
#content-contact div#contacts > div h3 {
  text-align: left;
  font-family: Impact, impactreg, "Arial Black", Helvetica, sans-serif;
  font-weight: 900;
  padding-bottom: 5px;
  color: rgba(255, 174, 87, 1);
  font-size: 1.3em;
}
#content-contact div#contacts > div > p {
  text-align: left;
  width: 20%;
  float: left; 
  text-align: center;
  box-sizing: border-box;
}
#content-contact div#contacts > div div.contact-heading-description {
  width: 80%;
  float: left;
  font-family: Arial;
  font-size: 1em;
  text-align: left;
}
#content-contact div#contacts > div > div p {
  color: whitesmoke;
  font-size: 0.9em;
}
#content-contact div#contacts > div > p i {
  background-color: whitesmoke;
  color: rgba(0, 0, 0, 0.7);
  width: 50px;
  height: 50px;
  line-height: 50px;
  border-radius: 50%;
  font-size: 1.5em;
  text-align: center;
}
#content-contact + footer {
  clear: left;
}
#content-contact .google-map-container h3 {
  text-align: center;
  margin-top: 0px;
  text-transform: uppercase;
  font-weight: bold;
  margin-bottom: 20px;
  font-size: 1.6em;
}
#content-contact .google-map-container hr {
  margin-bottom: 30px;
}
#content-contact .google-map-container {
  padding-top: 40px;
  padding-bottom: 40px;
  background-color: whitesmoke;
}
#content-contact .google-map-container iframe {
  width: 93%;
  height: 300px;
  margin-left: auto;
  margin-right: auto;
}
#content-service .overview-container .overview-image img {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  height: 250px;
  display: block;
}
#content-project .overview-container .overview-image img {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  height: auto;
  display: block;
  border: 5px solid white;
  box-shadow: 1px 2px 5px rgba(120, 120, 120, 1);
}
#content-project .project-meta ul .name {
  font-size: 1.1em;
  font-weight: bold;
  float: left;
  display: inline-block;
  width: 120px;
}
#content-project .project-meta ul .value {
  float: left;
  display: inline-block;
  width: 70%;
  font-size: 1em;
}
#content-project .project-photos p {
  height: 250px;
}
  .related-projects .project {
  position: relative;
  height: auto;
  padding-left: 0px;
  padding-right: 0px;
  margin-bottom: 20px;
}
.related-projects div img {
  height: 100%;
  width: 100%;
}
.related-projects div .sub-title {
  font-size: 1.2em;
  position: absolute;
  text-align: center;
  left: 0px;
  bottom: 0px;
  height: 50px;
  line-height: 50px;
  width: 100%;
  color: white;
  background-color: rgba(0, 0, 0, 0.5);
  margin-bottom: 0px;
  font-family: Impact, impactreg;
}
.related-projects p#blur-on {
  text-align: center;
  background-color: rgba(135, 206, 235, 0.5);
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 1;
  color: white;
  box-sizing: border-box;
  padding-top: 30px;
}
.related-projects p#blur-on span#description {
  font-family: Impact, impactreg;
  font-size: 1.5em;
}
.related-projects p#blur-on span#more {
  font-family: Impact, impactreg;
  font-size: 1.8em;
  text-transform: uppercase;
  display: inline-block;
  margin-top: 30px;
}
#content-service .our-services img {
  height: 250px;
}
#content-post .post-author > p {
  float: left;  
  width: 100px; 
  text-align: left;
}
#content-post .post-author div {
  float: left;
  width: 75%;
}
  #content-post .post-comments {
    clear: left;
  }
}
@media only screen and (min-width: 576px) and (max-width: 768px) {
.add-sm-left-margin {
  margin-left: 8px;
}
.add-sm-right-margin {
  margin-right: 8px;
}
}
@media only screen and (min-width: 576px) {
#content-search .page-title {
	margin-top: 20px;	
}
  .main-branding {
    height: 110px;
    padding-left: 21px;
}
.main-branding .hire-us button {
   position: absolute;
   width: 150px;
   left: 50%;
   margin-left: -75px;
   height: 40px;
   top: 50%;
   margin-top: -20px;
   background-color: rgba(255, 174, 87, 1);
   border: 2px solid rgba(255, 174, 87, 1);
   font-weight: bold;
}
.main-branding .hire-us button:hover {
    background-color: rgba(0, 128, 128, 0);
	  border: 2px solid white;
}
.main-branding .codtronic-logo img {
  width: 75px;
  height: 75px;
}
.mobile-tablet-nav-section {
   top: 110px; 
}
.slogan {
  font-size: 0.95em;
  font-weight: bold;
  color: rgba(255, 174, 201, 1);
  font-family: Impact, impactreg;
}
.fa-bars, .fa-times {
 position: absolute;
  right: 15px;
  top: 32px;
  color: rgba(255, 174, 201, 1);
  cursor: pointer;
  height: 50px;
  width: 50px;
  line-height: 50px;
  text-align: center;
  border-radius: 5px;  
  font-size: 2.5em;
}
.menu-caption {
  position: absolute;
  top: 82px;
  right: 21px;
  color: rgba(255, 174, 201, 1);
  font-family: Impact, impactreg;
  text-transform: lowercase;
  font-size: 0.95em;
}
.header-image-wrapper p.header-image-container img {
  height: 550px; 
}
section.header-image-wrapper div.page-intro {
    top: 230px;
}
.service-excerpts .service-one  {
		border-right: none;
}
.service-excerpts .service-two  {
		border-left: none;
}
.service-excerpts .service-three  {
		border-right: none;
}
.service-excerpts .service-four  {
		border-left: none;
}
.service-excerpts .image-container img {
   height: 200px;   
}
.reasons {
    display: flex;
    flex-wrap: wrap;
}
.reasons > [class*='col-'] {
    display: flex;
}
.reasons .button {
   margin-top: 30px; 
}
.recent-projects .tab-content .row {
   padding-top: 25px; 
   padding-bottom: 25px;
   padding-left: 25px;
   padding-right: 25px;
}
 .recent-projects .tab-content .row div {
  
  margin-bottom: 0px;
}
.recent-projects .tab-content .row div img {
  
  width: 100%;
}
.recent-projects .tab-content .row div .sub-title {
  font-size: 1.1em;
  height: 60px;
  line-height: 60px;
}
.recent-projects p#blur-on {
  text-align: center;
  background-color: rgba(135, 206, 235, 0.5);
  position: absolute;
  width: 100%;
  z-index: 1;
  color: white;
  box-sizing: border-box;
  padding-top: 30px;
}
.recent-projects p#blur-on span#description {
  font-family: Impact, impactreg;
  font-size: 1em;
}
.recent-projects p#blur-on span#more {
  font-family: Impact, impactreg;
  font-size: 1.3em;
  text-transform: uppercase;
  display: inline-block;
  margin-top: 15px;
}
.recent-posts .tab-content .row  {
  padding-top: 25px;
  padding-bottom: 25px;
}
.recent-posts .tab-content .row div .image-container img {
  height: 200px;
}
.service-excerpts .service-one {
  border-bottom-right-radius: 0;
}
.service-excerpts .service-two {
  border-bottom-left-radius: 0;
}
.service-excerpts .service-three {
  border-bottom-right-radius: 0;
}
.service-excerpts .service-four {
  border-bottom-left-radius: 0;
}
#content-about #services ul {
  padding-left: 10%; 
}
.core-values ul {
  padding-left: 10%;  
}
.header-image-wrapper div.page-intro {
  top: 175px; 
}
.header-image-wrapper p.right {
    font-size: 1.3em;
}
#content-about .expert-services div.service {
    height: auto;
  }
#content-about div.who-we-are #who-we-are-intro {
   text-align: center; 
}
#content-about .expert-services div.service-description p {
    text-align: center;
 }
  #content-about .core-values h3 {
    width: 260px;
    height: 260px;
    padding-top: 95px;
  }
  #content-services .our-services  {
    padding-left: 1%;
    padding-right: 1%;
  }
  .related-projects .project {
  position: relative;
  padding-left: 0px;
  padding-right: 0px;
  margin-bottom: 0px;
}
.related-projects div img {
  width: 100%;
}
.related-projects div .sub-title {
  font-size: 1.2em;
  position: absolute;
  text-align: center;
  left: 0px;
  bottom: 0px;
  height: 50px;
  line-height: 50px;
  width: 100%;
  color: white;
  background-color: rgba(0, 0, 0, 0.5);
  margin-bottom: 0px;
  font-family: Impact, impactreg;
}
#content-service .our-services img {
  height: 200px;
}
#content-service .overview-container .overview-image img {
  height: 300px; 
}
#content-post .post-summary {
  margin-right: auto;
  margin-left: unset;
}
#content-post .post-summary ol {
  font-size: 1.1em;	
}
#content-post .post-comments .form-group textarea {
   width: 500px;
   height: 200px;
}
#content-post .main-post-content {
  font-size: 1.1em;
}
#content-post .related-articles > div[class^="col"] {
	margin-bottom: 20px;	
}
#content-post .related-articles .wrapper {
	height: 100%;	
}
#content-post .related-articles .wrapper a {
	height: 100%;
}
#content-post .related-articles .wrapper a .post-excerpt {
	margin-bottom: 0px;
}
#content-post .main-post-content pre {
	font-size: 0.85em;
}
#content-post .post-comments .form-group input {
   width: 500px;
}
#content-project .project-photos p {
  height: 200px;
}
}

@media only screen and (min-width: 680px) {
#content-notification .search-form {
	width: 80%;
	margin-left: 5%;
	box-shadow: 1px 2px 5px rgba(120, 120, 120, 1);
	margin-top: 40px;
	margin-bottom: 50px;
	border-radius: 5px;
}
#content-notification .search-form input {
	height: 50px;
	font-size: 1.1em;
}
#content-notification .search-form button {
	width: 80px;
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
}
#content-notification .search-form i {
	font-size: 1.5em;
}
#content-notification	div#container {
		margin-top: 50px;
	}
#content-notification	div#header p {
		text-align: left;
		padding-left: 5%;
	}
#content-notification	#company-name {
		text-align: left;
		padding-left: 3%;
		position: relative;
	}	
#content-notification	#company-slogan {
		display: inline;
		position: absolute;
		font-size: 1em;
		bottom: 0px;
		right: 0px;
	}
#content-notification	#content h2 {
		font-size: 1.6em;
		padding-top: 10px;
		padding-bottom: 10px;
	}
#content-notification	#content .p-info {
		font-size: 1em;
	}
#content-notification	#p-company-name {
		font-size: 1.4em;
	}
#content-notification	#p-company-slogan {
		font-size: 1.2em;
		margin-top: -18px;
	}
#content-notification	#copyright {
		font-size: small;
		padding-bottom: 40px;
		padding-top: 20px;
	}
#content-notification	#social-media i {
		font-size: 2em;
		height: 50px;
		line-height: 50px;
		width: 50px;
	}
#content-privacy-policy #wrapper header h1 {
	font-size: 2.2em;	
}
#content-privacy-policy header h3 {
	margin-top: 30px;
}

#content-privacy-policy main p {
	font-size: 1.2em;
}
#content-privacy-policy main ul {
		font-size: 1.2em;
}
#content-privacy-policy #wrapper main h2 {
	font-size: 1.7em;	
}
#content-privacy-policy #wrapper main h3 {
	font-size: 1.5em;	
}
#content-privacy-policy #wrapper main h4 {
	font-size: 1.3em;	
}
  #content-about .core-values h3 {
    width: 300px;
    height: 300px;
    padding-top: 110px;
  }
 #content-project .overview-container .overview-image img {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  height: auto;
  display: block;
  border: 5px solid white;
  box-shadow: 1px 2px 5px rgba(120, 120, 120, 1);
}
#content-service .overview-container .overview-image img {
  height: 380px; 
}
  #content-post .post-head .post-image-container img{
    width: 100%;
    height: 350px;
  }
}
@media screen and (min-width: 717px) {
#content-notification	#company-slogan {
		line-height: 46px;
		height: 46px;
	}
}
@media only screen and (min-width: 768px) {
#content-search .post-content-container {
  padding-top: 30px;
  padding-bottom: 0px;
}
#content-search .post-content {
	padding-right: 15px;
}
#content-search .post-content > div:first-child {
  padding-top: 0;
  padding-bottom: 30px;
}
#content-search .side-bar {
  margin-bottom: 50px;
	margin-top: 30px;
	box-shadow: 1px 1px 3px #aaa;
}
  #content-search .side-bar h2 {
    font-size: 1.5em;
    padding-top: 20px;
    padding-bottom: 10px;
    font-weight: bold;
    text-align: left;
    font-family: arial;
  }
  #content-search .recent-projects {
    width: 100%;
    margin-left: 0;
  }
#content-search .recent-projects p#blur-on {
  text-align: center;
  background-color: rgba(135, 206, 235, 0.5);
  height: 100%;
  position: absolute;
  width: 100%;
  z-index: 1;
  color: white;
  box-sizing: border-box;
  padding-top: 10px;
}
#content-search .recent-projects p#blur-on span#more {
  font-family: Impact, impactreg;
  font-size: 1em;
  text-transform: uppercase;
  display: inline-block;
  margin-top: 10px;
}
  #content-search .recent-projects .project {
    position: relative;
    margin-bottom: 6px;
  }
  #content-search .recent-projects .project:nth-child(2) {
    border-right: 3px solid white; 
  }
   #content-search .recent-projects .project:nth-child(3) {
    border-left: 3px solid white;
  }
   #content-search .recent-projects .project:nth-child(4) {
    border-right: 3px solid white; 
  }
   #content-search .recent-projects .project:nth-child(5) {
    border-left: 3px solid white; 
  }
  #content-search .recent-projects .project-heading {
    position: absolute;
    background-color: rgba(0, 0, 0, 0.5);
    color: whitesmoke;
    text-align: center;
    font-size: 0.9em;
    width: 100%;
    font-family: Impact, impactreg;
    text-transform: uppercase;
    bottom: -8px;
    padding-top: 5px;
    padding-bottom: 5px;
  }
#content-search .recent-projects .project-image-container {
    width: 100%;
}
#content-search .recent-projects .project-image-container img {
   width: 100%;
   display: block;
}
#content-search .search-posts {
 padding-left: 15px;
 padding-right: 15px;
 padding-top: 15px;
}
#content-search .search-posts form {
 width: 100%;
}
#content-search .search-posts .fa-search {
  font-size: 1.3em;
}
#content-search .categories {
 padding-left: 15px;
 padding-right: 15px;
}
#content-search div ul {
  list-style-type: none;
  padding-left: 0;
  font-size: 1em;
}
#content-search .popular-posts {
 padding-left: 15px;
 padding-right: 15px;
}
#content-search .recent-posts {
 padding-left: 15px;
 padding-right: 15px;
}
  #content-search .related-articles {
    padding-bottom: 80px;
  }
#content-search .no-search-result {
	box-shadow: 1px 1px 3px #aaa;
	margin-top: 30px;
	padding-left: 20px;
	padding-right: 20px;
	padding-bottom: 60px;
	padding-top: 5px;
	margin-bottom: 30px;
}
#content-search .no-search-result p {
	margin-bottom: 40px;
	font-size: 1.2em;
}
.mobile-tablet-nav-section {
  background-size: cover;
  border-top: 5px solid rgba(255, 174, 87, 1);
   width: 100%;
   margin-left: auto;
   margin-right: auto;
   z-index: 15;
   left: -100%;
   position: fixed;
   overflow-y: auto;
   bottom: unset;
   height: 876.5px;
}
.no-webp .mobile-tablet-nav-section {
   background-image: url('images/maroon.jpg');
}
.webp .mobile-tablet-nav-section {
   background-image: url('images/maroon.webp'); 
}
.mobile-tablet-nav-section .search-form {
  height: 100px;
  padding-left: 15px;
  padding-right: 15px;
  background-color: teal;
  padding-top: 30px;
  padding-bottom: 30px;
}
.mobile-tablet-nav-section .media-features {
  text-align: center;
  height: 100px;
  line-height: 55px;
  background-color: rgba(60, 60, 60, 1);
  padding-bottom: 10px;
  margin-top: -6px;
}
.mobile-tablet-nav-section .media-features .fab {
  background-color: teal;
  color: white;
  width: 35px;
  height: 35px;
  line-height: 35px;
  border-radius: 10px;
  font-size: 1.3em;
}
.mobile-tablet-nav-section .media-features .fas {
  font-size: 1.3em;
}
.mobile-tablet-nav-section .more-features {
  display: block;
  overflow: auto;
}
.mobile-tablet-nav-section .more-features a {
  display: inline-block;
  background-color: teal;
  float: left;
  width: calc(92%/3);
  height: 35px;
  line-height: 35px;
  color: white;
  border-radius: 4px;
}
.mobile-tablet-nav-section .more-features .login {
  margin-left: 2%;
}
.mobile-tablet-nav-section .more-features .login:hover {
  text-decoration: none;
}
.mobile-tablet-nav-section .more-features .shop {
  margin-left: 2%;
  margin-right: 2%;
}
.mobile-tablet-nav-section .more-features .cog {
  margin-right: 2%;
}
.mobile-tablet-nav {
  clear: left;
}
.mobile-tablet-nav ul {
  list-style-type: none;
  position: relative;
}
.mobile-tablet-nav > ul {
  margin: auto;
  width: 80%;
  padding: 20px 0;
}
.mobile-tablet-nav ul a {
  display: block;
  text-decoration: none;
  font-weight: bold;
  width: 100%;
  height: 60px;
  line-height: 80px;
}
.mobile-tablet-nav > ul > li > a {
  color: white;
  border-bottom: 1px solid white;
  font-size: 1.1em;
}
.mobile-tablet-nav > ul > li > a:hover {
  color: rgba(255, 174, 87, 1);
  border-bottom-color: rgba(255, 174, 87, 1);
}
.mobile-tablet-nav > ul > li {
  position: relative;    
}
.mobile-tablet-nav > ul > li:first-child > a {
    margin-bottom: -3px;    
}
.mobile-tablet-nav > ul > li > i.fa-plus, .mobile-tablet-nav > ul > li > i.fa-minus {
  background-color: teal;
  color: white;
  width: 20px;
  height: 20px;
  line-height: 20px;
  text-align: center;
  display: block;
  border-radius: 1px;
  font-size: 0.9em;
  cursor: pointer;
  position: absolute;
  right: 0px;
  top: 28px;
}
.mobile-tablet-nav ul li ul {
  display: none;
  padding-left: 30px;
}
.mobile-tablet-nav ul li ul li a {
  font-size: 0.95em;
  font-family: Impact, impactreg;
  font-weight: normal;
  color: white;
  height: 35px;
}
.mobile-tablet-nav ul li ul li:first-child a {
   margin-top: 0px;
}
.mobile-tablet-nav ul li ul li:last-child a {
  margin-bottom: 10px;  
}
.mobile-tablet-nav p {
  padding: 20px 2px;
}
.mobile-tablet-nav p {
  padding-bottom: 20px;
}
.mobile-tablet-nav > ul > li > a.active-page {
  color: rgba(255, 174, 87, 1);
  border-color: rgba(255, 174, 87, 1);
}
.mobile-tablet-nav a.active-page {
  color: rgba(255, 102, 0, 255);
}
.menu-branding a {
  display: block;
  width: 150px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 40px;
}
.menu-branding a:hover {
  text-decoration: none;
}
.menu-branding .company-name {
  text-align: center;
  font-family: Impact, impactreg;
  font-size: 2em;
  margin-top: 30px;
  color: rgba(255, 174, 201, 1)
}
.menu-branding .slogan {
  text-align: center;
  margin-top: -20px;
  font-size: 1.1em;
  color: rgba(255, 174, 87, 1);
  font-family: Impact, impactreg;
}
.menu-footer {
  text-align: center;
  color: rgba(200, 200, 200, 1);
  background-color: rgba(30, 30, 30, 1);
  padding: 0px 10px 0px 10px;
  width: 100%;
  height: 80px;
  line-height: 70px;
}
.design-values h3.section-title {
    font-size: 2em;
}
.design-values p.section-description {
    font-size: 1.5em;
    margin-bottom: 30px;
 }
.reasons h3.section-title {
    font-size: 2em;
}
  .reasons p.section-description {
    font-size: 1.5em;
  }
 .work-flow h3.section-title {
   font-size: 2em; 
 }
.work-flow p.section-description {
   font-size: 1.5em; 
 }
.recent-projects p#blur-on {
  text-align: center;
  background-color: rgba(135, 206, 235, 0.5);
  position: absolute;
  width: 100%;
  z-index: 1;
  color: white;
  box-sizing: border-box;
  padding-top: 30px;
}
.recent-projects p#blur-on span#description {
  font-family: Impact, impactreg;
  font-size: 1.5em;
}
.recent-projects p#blur-on span#more {
  font-family: Impact, impactreg;
  font-size: 1.8em;
  text-transform: uppercase;
  display: inline-block;
  margin-top: 15px;
}
 .recent-projects h3.section-title {
    font-size: 2em;
}
  .recent-posts h3.section-title {
    font-size: 2em;
  }
.recent-posts .row > div > div > a {
	padding-bottom: 20px;
}
.send-us-message {
  margin-left: 0;
  margin-right: 0;
  width: 90%;
}
#content-about div.who-we-are h2 {
  text-align: center;
  font-size: 1.8em;
  padding: 0px 5px 5px 5px;
  color: black;
}
#content-about div.who-we-are > hr {
  color: rgba(255, 174, 87, 1);
  background-color: rgba(255, 174, 87, 1);
  width: 80px;
  border: none;
  height: 3px;
  margin-bottom: 20px;
}
#content-about .who-we-are p#who-we-are-intro {
  margin-bottom: 20px;
  font-size: 1.1em;
  color: black;
  width: 100%;
  padding-left: 5%;
  padding-right: 5%;
}
#content-about .who-we-are p#phrase span:first-child {
  color: purple;
  font-size: 2.5em;
  font-weight: bold;
}
#content-about .who-we-are p#phrase span:nth-child(3) {
  color: teal;
  font-size: 2.2em;
  font-weight: bold;
}
#content-about .who-we-are p#phrase span:last-child {
  color: teal;
  font-size: 1.8em;
  font-weight: bold;
  
}
#content-about .expert-services h2 {
  font-size: 1.8em; 
}
#content-about .who-we-are div#vision {
  width: 100%;
  height: auto;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 20px;
}
#content-about .who-we-are div#vision h3 {
  font-size: 1.6em;
  font-weight: bold;
  color: rgba(0, 192, 192, 1);
  font-family: Impact, impactreg;
  text-shadow:  -0.02em -0.02em 0.04em black;
}
#content-about .who-we-are div#vision p {
  width: 100%;
  margin: auto;
  font-size: 1.1em;
  box-sizing: border-box;
  padding: 5px 15% 0 0;
}
#content-about .vision-mission h2 {
  font-size: 1.8em; 
}
.core-values h2 {
  font-size: 1.8em;
}
.our-clients h2 {
  font-size: 2em; 
}
#testimonials {
  padding-left: 15%;
  padding-right: 15%;
}
#testimonials h2 {
    font-size: 1.8em;
}
.our-clients h2 {
   font-size: 1.8em; 
}
#content-services .our-services h2.section-title {
   font-size: 2em;
}
  #content-services .technologies h2 {
    font-size: 2em;
  }
  #content-projects .our-projects > p {
    text-align: center;
  }
#content-projects div.get-quote-container h2 {
   font-size: 2em; 
}
#content-projects div.get-quote-container > p {
   font-size: 1.8em;
  text-align: center;
}
#content-contact .contact-container {
  padding-top: 30px;
  padding-bottom: 60px;
  background-image: url('images/mesh.jpg');
  background-size: cover;
  margin-top: -17px;
}
#content-contact .contact {
  border-top: 20px solid whitesmoke;
  margin-left: auto;
  margin-right: auto;
  width: 85%;
  padding: 30px 50px 50px 50px;
  border-radius: 20px;
  box-shadow: 1px 2px 5px rgba(120, 120, 120, 1);
}
#content-contact .contact-container h2 {
  text-align: center;
  font-weight: bold;
  margin-bottom: 20px;
  font-size: 2em;
}
#content-contact .contact-container > p {
  font-size: 1.6em;
  text-align: center;
  width: 80%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 30px;
  margin-top: 10px;
}
#content-contact .contact-container > p#ajax-server-response {
  background-color: rgba(0, 230, 230, 1);
  border-left: 8px solid rgba(255, 174, 87, 1);
  padding: 10px;
  width: 85%;
  font-size: 1em;
  text-align: left;
  position: relative;
  padding-right: 35px;
}
#content-contact .contact-container > p#ajax-server-response > i.fa-check {
  background-color: teal;
  width: 25px;
  height: 25px;
  line-height: 25px;
  text-align: center;
  border-radius: 50%;
  color: whitesmoke;
}
#content-contact .contact-container > p#ajax-server-response > i.fa-times {
  width: 22px;
  height: 22px;
  line-height: 22px;
  text-align: center;
  border-radius: 50%;
  color: teal;
  font-size: 1em;
 cursor: pointer;
 position: absolute;
 right: 10px;
 top: 12px;
 background-color: teal;
 color: white;
}
#content-contact .contact-container > p#ajax-server-response > i.fa-times:hover {
background-color: rgba(200, 0, 0, 1);
}
#content-contact .contact-container > p#ajax-error-response {
  background-color: rgba(0, 230, 230, 1);
  border-left: 8px solid rgba(255, 174, 87, 1);
  padding: 10px;
  width: 85%;
  font-size: 1em;
  text-align: left;
  padding-right: 35px;
}
#content-contact .contact-container > p#ajax-error-response > i {
  background-color: rgba(200, 0, 0);
  width: 30px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  border-radius: 50%;
  color: whitesmoke;
}
#content-contact .contact-container > p#ajax-error-response > i.fa-times {
  width: 22px;
  height: 22px;
  line-height: 22px;
  text-align: center;
  border-radius: 50%;
  color: teal;
  font-size: 1em;
 cursor: pointer;
 position: absolute;
 right: 10px;
 top: 12px;
 background-color: teal;
 color: white;
}
#content-contact .contact-container > p#ajax-error-response > i.fa-times:hover {
background-color: rgba(200, 0, 0, 1);
}
#content-contact .contact h3 {
  font-family: Impact, impactreg;
  margin-bottom: 15px;
  color: whitesmoke;
}
#content-contact .contact p {
  font-size: 1.1em;
}
#content-contact .contact .form-group label {
  font-weight: bold;
  color: whitesmoke;
}
#content-contact .contact .form-group label sup {
  font-size: 1em;
  margin-left: 3px;
  vertical-align: text-bottom;
  display: inline-block;
  padding-bottom: 3px;
}
#content-contact .contact .form-group input {
  background-color: whitesmoke;
} 
#content-contact .contact .label-checkboxes {
  font-weight: bold;
  margin-bottom: 10px;
  color: rgba(130, 130, 130, 1);
}
#content-contact .contact .form-check {
  padding-top: 4px;
  padding-bottom: 4px;
}
#content-contact .contact .text-message {
  margin-top: 10px;
}
#content-contact .contact textarea {
  height: 250px;
  
  background-color: whitesmoke;
}
#content-contact .contact .btn {
  width: 180px;
  font-weight: bold;
  margin-top: 10px;
  height: 50px;
  font-size: 1.2em;
}
#content-contact .contact .btn:hover {
  background-color: teal;
  border: 3px solid purple;
}
#content-contact .contact .btn .fa-paper-plane {
  padding-right: 5px;
}
#content-contact .contacts-container {
  padding-top: 5em;
  padding-bottom: 5em;
  background-image: url('images/office.jpg');
  background-size: cover;
}
#content-contact #contacts {
  width: 80%;
  margin-left: auto;
  margin-right: auto;
  background-color: rgba(0, 0, 0, 0.5);
  padding-bottom: 30px;
  padding-top: 50px;
  padding-left: 20px;
  border-radius: 30px;
  border-top: 30px solid rgba(255, 174, 87, 1);
}
#content-contact div#contacts > div {
  padding: 0px 1% 0px 1%;
  height: 150px;
  margin: auto;
}
#content-contact div#contacts div#contact-one {
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  padding-bottom: 10px;
}
#content-contact div#contacts div#contact-five {
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}
#content-contact div#contacts > div h3 {
  text-align: left;
  font-family: Impact, impactreg, "Arial Black", Helvetica, sans-serif;
  font-weight: 900;
  padding-bottom: 5px;
  color: rgba(255, 174, 87, 1);
  font-size: 1.5em;
}
#content-contact div#contacts > div > p {
  text-align: left;
  width: 25%;
  float: left; 
  text-align: center;
  box-sizing: border-box;
}
#content-contact div#contacts > div div.contact-heading-description {
  width: 75%;
  float: left;
  font-family: Arial;
  font-size: 1.1em;
}
#content-contact div#contacts > div div p {
  color: whitesmoke;
}
#content-contact div#contacts > div > p i {
  background-color: whitesmoke;
  color: rgba(0, 0, 0, 0.7);
  width: 80px;
  height: 80px;
  line-height: 80px;
  border-radius: 50%;
  font-size: 2em;
  text-align: center;
}
#content-contact + footer {
  clear: left;
}
#content-contact .google-map-container h3 {
  text-align: center;
  margin-top: 0px;
  text-transform: uppercase;
  font-weight: bold;
  margin-bottom: 20px;
  font-size: 2em;
}
#content-contact .google-map-container hr {
  margin-bottom: 30px;
}
#content-contact .google-map-container {
  padding-top: 40px;
  padding-bottom: 60px;
  background-color: whitesmoke;
}
#content-contact .google-map-container iframe {
  width: 95%;
  height: 400px;
  margin-left: auto;
  margin-right: auto;
  display: block;
}
#content-blog .blog-content .section-title {
   color: black;
   font-family: "Segoe UI";
   font-size: 2em;
}
.blog-content .tab-content .row > div {
   margin-bottom: 30px;	
}
.blog-content .tab-content .row > div > div {
	height: 100%;
}
.post-excerpt + p {
	margin-bottom: -15px;	
}
#content-service {
  margin-top: -17px;
  padding-top: 30px;
}
#content-service .service-content-container {
  padding-top: 20px;
  background-color: unset;
  padding-bottom: 0px;
  padding-left: 0;
  padding-right: 0;
}
#content-service .overview-container {
  padding-left: 50px;
  padding-right: 50px;
}
#content-service .overview-container h2 {
  font-family: Impact, impactreg;
  text-transform: uppercase;
  text-align: center;
  font-size: 2em;
  margin-bottom: 20px;
  width: 100%;
}
#content-service .overview-container .overview-image img {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  height: 380px;
  display: block;
}
#content-service .overview-intro {
  font-size: 1.2em;
}
#content-service .indepth-description {
  padding-left: 50px;
  padding-right: 50px;
  font-size: 1.2em;
}
#content-service .work-flow {
  padding-bottom: 80px;
  margin-top: -15px;
  padding-left: 50px;
  padding-right: 50px;
}
#content-service .work-flow >  [class*='col-'] {
  display: flex;
  padding-left: 0;
  padding-right: 0;
}
#content-service .work-flow > div > div {
  padding-left: 0;
  padding-right: 0;
}
#content-service .work-flow div div  {
  margin-top: 20px;
  border-radius: 10px;
  border-top: 10px solid rgba(255, 174, 87, 1);
  background-color: purple; 
}
#content-service .work-flow .section-title {
  font-family: Impact, impactreg;
  font-size: 1.8em;
  color: teal;
  text-transform: capitalize;
  text-align: left;
}
#content-service .work-flow .section-description {
  color: white;
  font-size: 1.2em;
  text-align: left;
  margin-bottom: 0px;
}
#content-service .work-flow div div p {
  text-align: center;
}
#content-service .work-flow .sub-title {
  color: rgba(210, 210, 210, 1);
  font-weight: bold;
}
#content-service .work-flow .excerpt {
  color: rgba(210, 210, 210, 1);
}
#content-service .work-flow .section-description {
  color: black;
}
#content-service .work-flow .fas {
  font-size: 3em;
  background-color: rgba(255, 174, 87, 1);
  color: white;
  width: 90px;
  height: 90px;
  line-height: 90px;
  border-radius: 50%;
  margin-top: 30px;
  text-align: center;
}
#content-service .testimonials, #content-services .testimonials{
  background-color: teal;
  padding-left: 5%;
  padding-right: 5%;
  text-align: center;
  padding-top: 30px;
  padding-bottom: 60px;
}
#content-service .testimonials .testimonial-container, #content-services .testimonials .testimonial-container {
  padding-bottom: 30px;
  width: 75%;
  margin-left: auto;
  margin-right: auto;
}
#content-service .testimonials .testimony, #content-services .testimonials .testimony{
  font-size: 2em;
  color: whitesmoke;
  font-weight: bold;
  padding-left: 10%;
  padding-right: 10%;
} 
#content-service .testimonials .ceo-name, #content-services .testimonials .ceo-name {
  font-size: 1em;
  color: whitesmoke;
  font-weight: bold;
}
#content-service .faqs, #content-services .faqs {
  padding-top: 30px;
  padding-bottom: 30px;
  padding-left: 35px;
  padding-right: 35px;
}
#content-service .faqs h2, #content-services .faqs h2 {
  font-family: Impact, impactreg;
  font-size: 2em;
  text-align: center;
  margin-bottom: 20px;
  width: 100%;
}
#content-service .faqs-intro, #content-services .faqs-intro{
  font-size: 1.8em;
  text-align: center;
  width: 100%;
  margin-bottom: 30px;
}
#content-service .faqs .wrapper, #content-services .faqs .wrapper{
  margin-bottom: 20px;
  padding-left: 0;
  padding-right: 0;
  margin-bottom: 30px;
}
#content-service .question-container:last-child, #content-services .question-container:last-child  {
  margin-bottom: 30px;
}
#content-service .question, #content-services .question{
  padding: 10px;
  background-color: blueviolet;
  color: whitesmoke;
  font-weight: bold;
  overflow: auto;
}
#content-service .question span:nth-child(1), #content-services .question span:nth-child(1) {
  float: left;
  width: 90%;
  padding-left: 7px;
}
#content-service .question span:nth-child(2), #content-service .question span:nth-child(2) {
  float: left;
  width: 10%;
  text-align: center;
  font-size: 1.3em;
  cursor: pointer;
}
#content-service .answer, #content-services .answer {
  padding: 0px 15px 25px 15px;
  clear: left;
}
#content-service .quote-question {
  background-color: teal;
  padding: 40px 5% 40px 5%;
  text-align: center;
}
#content-service .quote-question h2 {
  font-size: 2.8em;
  text-align: center;
  width: 100%;
}
#content-service .quote-question h2 span:nth-child(1) {
  font-weight: bold;
  color: rgba(255, 174, 87, 1);
  text-align: center;
  display: block;
  margin-bottom: -20px;
  width: 60%;
  margin-left: auto;
  margin-right: auto;
}
#content-service .quote-question h2 span:nth-child(3) {
  color: whitesmoke;
  display: block;
  margin-bottom: 20px;
  font-size: 0.7em;
  text-align: center;
  width: 70%;
  margin-left: auto;
  margin-right: auto;
}
#content-service .quote-question p {
  text-align: center;
  width: 100%;
}
#content-service .quote-question .btn-info {
  font-size: 1.2em;
  height: 50px;
  font-weight: bold;
  width: 180px;
  background-color: purple;
  border: 1px solid purple;
}
#content-service .our-services {
  padding-left: 35px;
  padding-right: 35px;
  padding-top: 20px;
  padding-bottom: 60px;
}
#content-service .our-services hr {
  margin-bottom: 40px;  
}
#content-service .our-services h2 {
  text-align: center;
  font-size: 2em;
  padding: 0px 0 10px 0;
  color: rgba(0, 192, 192, 1);
  font-family: Impact, impactreg, "Segoe UI";
  color: black;
  text-transform: uppercase;
  margin-bottom: 10px;
}
#content-services hr {
  margin-bottom: 20px;
}
#content-service .our-services .wrapper{
  background-color: white;
  margin-bottom: 20px;
  border-radius: 15px;
  height: 92%;
  box-shadow: 1px 2px 5px rgba(120, 120, 120, 1);
}
#content-service .our-services img {
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
}
#content-service .our-services .wrapper:hover {
  background-color: rgba(255, 174, 201, 1);
}
#content-service .wrapper a {
  color: purple;
  height: 100%;
  display: block;
  padding-bottom: 5px;
}
#content-service .wrapper h3 {
  font-weight: bold; 
  font-size: 1.3em;
}
#content-service .wrapper a:hover {
  text-decoration: none;
}
#content-project {
  margin-top: -17px;
}
#content-project .project-content-container {
  padding-top: 20px;
  background-color: unset;
  padding-bottom: 0px;
  padding-left: 0;
  padding-right: 0;
  margin-top: -40px;
}
#content-project .overview-container {
  padding-left: 5%;
  padding-right: 5%;
  padding-top: 40px;
  background-size: cover;
  background-color: whitesmoke;
  background-image: url('images/mesh.jpg');
  background-size: cover;
  margin-top: -10px;
  padding-bottom: 20px;
}
#content-project .overview-container h2 {
  font-family: Impact, impactreg;
  text-transform: uppercase;
  text-align: center;
  font-size: 2em;
  margin-bottom: 20px;
  width: 100%;
}
#content-project .overview-container .overview-image img {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  height: auto;
  display: block;
  border: 5px solid white;
  box-shadow: 1px 2px 5px rgba(120, 120, 120, 1);
}
#content-project .overview-intro {
  font-size: 1.2em;
  margin-bottom: 30px;
}
#content-project .indepth-description {
  padding-left: 5%;
  padding-right: 5%;
  padding-top: 30px;
  background-color: whitesmoke;
  padding-bottom: 30px;
}
#content-project .indepth-description h3 {
  font-family: Impact, impactreg;
  font-size: 1.6em;
  margin-bottom: 20px;
}
#content-project .indepth-description p {
  font-size: 1.2em; 
  margin-bottom: 25px;
}
#content-project .project-main ul {
  font-size: 1.2em;  
}
#content-project .project-meta ul {
  padding-top: 10px;
  list-style-type: none;
  padding-left: 0;
  width: 100%;
  display: block;
}
#content-project .project-meta ul li {
  line-height: 32px;
  overflow: auto;
  width: 100%;
}
#content-project .project-meta ul .name {
  font-size: 1.2em;
  font-weight: bold;
  float: left;
  display: inline-block;
  width: 120px;
}
#content-project .project-meta ul .value {
  float: left;
  display: inline-block;
  width: 70%;
  font-size: 1.1em;
}
#content-project .project-main {
  clear: left;
  margin-top: 15px;
}
#content-project .project-photos {
  background-image: url('images/mesh.jpg');
  background-size: cover;
  padding-top: 30px;
  padding-bottom: 20px;
  padding-left: 5%;
  padding-right: 5%;
}
#content-project .project-photos .image-container {
  margin-bottom: 20px;
}
#content-project .project-photos p {
  height: 100%;
}
#content-project .project-photos p img {
  height: 100%;
}

#content-project .testimonials {
  background-color: teal;
  padding-left: 5%;
  padding-right: 5%;
  text-align: center;
  padding-top: 30px;
  padding-bottom: 30px;
}
#content-project .testimonial-container {
  padding-bottom: 30px;
  width: 75%;
  margin-left: auto;
  margin-right: auto;
}
#content-project .testimonials .testimony {
  font-size: 1.5em;
  color: whitesmoke;
  font-weight: bold;
} 
#content-project .testimonials .ceo-name {
  font-size: 0.9em;
  color: whitesmoke;
  font-weight: bold;
}
#content-project .faqs {
  padding-top: 30px;
  padding-left: 5%;
  padding-right: 5%;
  background-image: url('images/mesh.jpg');
  background-size: cover;
}
#content-project .faqs h2 {
  font-family: Impact, impactreg;
  font-size: 2em;
  text-align: center;
  margin-bottom: 20px;
  width: 100%;
}
#content-project .faqs-intro {
  font-size: 1.6em;
  text-align: center;
  width: 100%;
}
#content-project .faqs .wrapper {
  border-bottom-left-radius: 30px;
  border-bottom-right-radius: 30px;
  box-shadow: 1px 2px 5px rgba(120, 120, 120, 1);
  background-color: whitesmoke;
  margin-bottom: 20px;
  padding-left: 0;
  padding-right: 0;
}
#content-project .question-container:last-child {
  margin-bottom: 30px;
}
#content-project .question {
  padding: 10px;
  background-color: purple;
  color: whitesmoke;
  font-weight: bold;
  overflow: auto;
}
#content-project .question span:nth-child(1) {
  float: left;
  width: 90%;
  padding-left: 7px;
}
#content-project .question span:nth-child(2) {
  float: left;
  width: 10%;
  text-align: center;
  font-size: 1.3em;
  cursor: pointer;
}
#content-project .answer {
  padding: 0px 15px 25px 15px;
  clear: left;
  display: none;
}
#content-project .quote-question {
  background-color: teal;
  padding: 20px 5% 10px 5%;
  text-align: center;
}
#content-project .quote-question h2 {
  font-size: 2.2em;
  text-align: center;
  width: 100%;
}
#content-project .quote-question h2 span:nth-child(1) {
  font-weight: bold;
  color: rgba(255, 174, 87, 1);
  text-align: center;
  display: block;
  margin-bottom: -20px;
  width: 60%;
  margin-left: auto;
  margin-right: auto;
}
#content-project .quote-question h2 span:nth-child(3) {
  color: whitesmoke;
  display: block;
  margin-bottom: 20px;
  font-size: 0.7em;
  text-align: center;
  width: 70%;
  margin-left: auto;
  margin-right: auto;
}
#content-project .quote-question p {
  text-align: center;
  width: 100%;
}
#content-project .quote-question .btn-info {
  font-size: 1.2em;
  height: 50px;
  font-weight: bold;
  width: 180px;
  background-color: purple;
  border: 1px solid purple;
}
#content-project .quote-question .btn-info:hover {
  background-color: teal;
  border: 3px solid purple;
}
.related-projects {
 padding-bottom: 30px;
 padding-left: 5%;
 padding-right: 5%;
 background-image: url('images/mesh.jpg');
 background-size: cover;
}
.related-projects .section-title {
  color: rgba(0, 192, 192, 1);
  color: black;
  font-family: Impact, impactreg, "Segoe UI";
  font-size: 1.6em;
  margin-bottom: 20px;
  text-transform: uppercase;
}
.related-projects hr {
  margin-bottom: 30px;
}
.related-projects .fas, .related-projects .fab {
  font-size: 1.5em; 
}
.related-projects .project {
  position: relative;
  padding-left: 0px;
  padding-right: 0px;
}
.related-projects div img {
  width: 100%;
}
.related-projects div .sub-title {
  font-size: 1.3em;
  position: absolute;
  text-align: center;
  left: 0px;
  bottom: 0px;
  height: 40px;
  line-height: 40px;
  width: 100%;
  color: white;
  background-color: rgba(0, 0, 0, 0.5);
  margin-bottom: 0px;
  font-family: Impact, impactreg;
}
.related-projects .sub-title .fas, .related-projects .sub-title .fab {
  margin-right: 10px;
}
.related-projects p#blur-on {
  text-align: center;
  background-color: rgba(135, 206, 235, 0.5);
  position: absolute;
  width: 100%;
  z-index: 1;
  color: white;
  box-sizing: border-box;
  padding-top: 70px;
}
.related-projects p#blur-on span#description {
  font-family: Impact, impactreg;
  font-size: 1.5em;
}
.related-projects p#blur-on span#more {
  font-family: Impact, impactreg;
  font-size: 1.8em;
  text-transform: uppercase;
  display: inline-block;
  margin-top: 30px;
}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .add-md-left-margin {
  margin-left: 8px;
}
.add-md-right-margin {
  margin-right: 8px;
}
}
@media only screen and (min-width: 850px) {
.service-excerpts .image-container img {
   height: 250px;   
}
.recent-projects .tab-content .row div {

}
.recent-projects .tab-content .row div img {
 
  width: 100%;
}
.recent-projects .tab-content .row div .sub-title {
  font-size: 1.4em;
  height: 60px;
  line-height: 60px;
}
.recent-projects p#blur-on {
  text-align: center;
  background-color: rgba(135, 206, 235, 0.5);
  position: absolute;
  width: 100%;
  z-index: 1;
  color: white;
  box-sizing: border-box;
  padding-top: 60px;
}
.recent-projects p#blur-on span#description {
  font-family: Impact, impactreg;
  font-size: 1.5em;
}
.recent-projects p#blur-on span#more {
  font-family: Impact, impactreg;
  font-size: 1.8em;
  text-transform: uppercase;
  display: inline-block;
  margin-top: 20px;
}
#content-service .overview-container .overview-image img {
  height: 420px; 
}
} 

@media only screen and (min-width: 992px) {
#content-search .post-content {
	width: 90%;
	margin-left: auto;
	margin-right: auto;
}
#content-search .search-results-container p {
	font-size: 1.1em;	
}
#content-search .recent-projects p#blur-on span#more {
	margin-top: 20px;
	font-size: 1.3em;
}
 .top-bar {
  background-color: rgba(0, 0, 0, 0.5);
  color: rgba(0, 192, 192, 1);
  height: 35px;
  line-height: 26px;
  position: relative;
  z-index: 16;
  border-bottom: 1px solid white;
}
.contacts .fas {
  color: white;
  font-size: 1.1em;
  margin-left: 10px;
  margin-right: 5px;
  background-color: rgba(128, 0, 128, 0);
  width: 25px;
  height: 25px;
  line-height: 35px;
  text-align: center;
  border-radius: 50%;
	}
.contacts small {
	color: rgba(0, 192, 192, 1);	
}
.media-features {
  position: absolute;
  right: 0px;
  height: 35px;
  line-height: 35px;
}
.media-features .social-media .fab {
  color: rgba(0, 192, 192, 1);
  font-size: 1.1em;
  width: 25px;
  height: 25px;
  line-height: 25px;
  text-align: center;
  border-radius: 50%;
}
.more-features a:hover {
  background-color: rgba(255, 255, 255, 0.4);  
}
.login a {
  color: white;
  display: inline-block;
  padding: 0 15px 0 15px;
  height: 34px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.5);
}
.login a:hover {
 text-decoration: none; 
}
.cart a {
  color: white;
  display: inline-block;
  padding: 0 15px 0 15px;
  height: 34px;
  margin-left: -5px;
  margin-right: -4px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.5);
}
.settings a {
  color: white;
  display: inline-block;
  padding: 0 15px 0 15px;
  height: 34px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.5);
}
.bottom-bar {
  padding-right: 0;
}
.bottom-bar .first-row {
   position: relative;
   z-index: 16;
}
.main-branding {
  position: unset;
  text-align: center;
  height: 130px;
  background-color: rgba(0, 0, 0, 0.5);
  padding-left: 0;
}
.right-bar {
  padding-right: 0;
  width: 100%;
}
.main-branding .codtronic-logo {
  width: 130px;
  height: 130px;
  display: inline-block;
}
.main-branding .slogan {
  font-size: 1.1em;
}
.main-branding .codtronic-logo img {
  width: 80px;
  height: 80px;
}
.more-info {
  height: 65px;
  background-color: rgba(0, 0, 0, 0.5);
  color: white;
  padding-top: 12px;
}
.more-info .working-hrs {
  display: block;
  text-align: left;
  font-size: 0.95em;
} 
.more-info .fas {
    font-size: 2em;
    float: left;
    padding: 10px;
    color: rgba(0, 192, 192, 1);
}
.more-info .title {
    font-size: 1em;
    font-weight: bold;
    color: rgba(0, 192, 192, 1);
}
.more-info .send-email {
 display: block;
 text-align: left;
 font-size: 0.95em;
}
.more-info .hire-us {
 display: block;
}
.more-info .des {
  font-size: 0.95em; 
}
.more-info .hire-us button {
 font-weight: bold;
 width: 100%;
 margin-top: 5px;
 background-color: rgba(255, 174, 87, 1);
 border: 2px solid rgba(255, 174, 87, 1);
}
.more-info .hire-us button:hover {
 background-color: rgba(255, 174, 87, 0);
 border: 2px solid white;
}
.show-search-widget {
   color: pink;
   position: absolute;
   top: 73px;
   right: 4%;
   font-size: 1.4em;
   z-index: 2;
}
.fa-times {
   position: unset; 
}
.header-image-wrapper {
   margin-top: -165px;  
}
.header-image-wrapper p.header-image-container img {
   width: 100%; 
   height: 450px;
}
section.header-image-wrapper div.page-intro {
    top: 280px;
}
.header-image-wrapper div .left {
  font-size: 1.8em;
}
.header-image-wrapper div .right {
  font-size: 1.3em;
}
.show-search-widget .fa-search, .show-search-widget .fa-times {
   width: 45px;
   height: 45px;
   line-height: 45px;
   text-align: center;
   cursor: pointer;
   border-radius: 50%;
   font-size: 1em;
}
.show-search-widget .fa-search:hover {
   background-color: rgba(255, 255, 255, 0.4);
  }
.show-search-widget .fa-times:hover {
   background-color: rgba(255, 255, 255, 0.4); 
}
.main-nav-section .search-form {
    height: 60px;
    background-color: purple;
    width: 350px;
    position: absolute;
    right: 0;
    top: 130px;
    padding-top: 10px;
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 10px;
    z-index: 0;
    display: none;
}
.main-nav-section .search-form .btn {
   background-color: rgba(0, 192, 192, 1);
}
.main-nav-section {
}
.main-nav-section .main-nav {
  background-color: rgba(0, 0, 0, 0.5);
  width: 100%;
  height: 65px;
  position: relative;
  padding-left: 70px;
}
.main-nav-section .main-nav ul {
  list-style-type: none;
}
.main-nav-section .main-nav > ul {
  overflow: auto;
  height: auto;
  padding-left: 0;
  padding-top: 0px;
  padding-bottom: 5px;
  margin-top: 5px;
}
.main-nav-section .main-nav > ul > li:nth-child(5) {
  display: none;
}
.main-nav-section .main-nav a {
  display: block;
  text-decoration: none;
  font-weight: bold;
  height: 50px;
  line-height: 40px;
}
.main-nav-section .main-nav > ul > li > a {
  color: white;
  height: 60px;
  font-size: 1em;
  font-weight: bold;
}
.main-nav-section .main-nav > ul > li {
  float: left;
  width: calc(100%/6.8);
  text-align: center;
}
.main-nav-section .main-nav ul li ul {
  display: none;
  color: black;
}
.main-nav-section .main-nav ul li ul li {
  width: 300px;
  margin-left: -110px;
}
.main-nav-section .main-nav ul li ul li a {
  font-size: 0.9em;
  background-color: white;
  font-family: Arial;
  font-weight: normal;
  color: purple;
  text-align: left;
  padding-left: 20px;
  text-transform: uppercase;
  font-weight: bold;
}
.main-nav-section .main-nav > ul > li:hover > a {
  color: rgba(255, 174, 87, 1);
}
.main-nav-section .main-nav ul li:hover a + ul {
  display: block;  
}
.main-nav-section .main-nav ul li a:hover + ul {
  display: block; 
}
.main-nav-section .main-nav ul li ul li a:hover {
    color: white;
    background-color: purple;
}
.main-nav-section .main-nav ul li ul li:first-child a {
   border-top: 4px solid rgba(255, 174, 87, 1);
}
.main-nav-section .main-nav > ul > li > a.active-page {
  color: rgba(255, 174, 87, 1);
}
.carousel-inner {
  margin-top: -165px;
}
.webp .carousel-item {
  height: 550px;
}
.no-webp .carousel-item {
    height: 550px;
}
.carousel-caption {
  top: 230px;  
}
.capture {
  font-size: 3em;
}
.motivation {
  font-size: 1.8em;  
}
.dev-category {
  font-size: 1.2em; 
  color: rgba(255, 174, 87, 1);
}

.services-provided h3 {
  margin-top: 25px;  
}
.follow-up .fab {
  font-size: 1.8em;
  width: 50px;
  height: 50px;
  line-height: 50px;
}
.service-excerpts-container {
  padding-bottom: 100px;
  padding-top: 40px;
}
.service-excerpts {
  border-radius: 30px; 
}
.service-excerpts div {
  margin-bottom: 0px;
}
.service-excerpts .service-one {
  border-bottom-right-radius: 0;
}
.service-excerpts .service-two {
  border-bottom-right-radius: 0;
	border-right: none
}
.service-excerpts .service-three {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
	border-left: none;
}
  .service-excerpts .image-container img {
    height: 200px;
  }
.services-provided h3 {
  font-weight: bold;
  margin-bottom: 20px;
  margin-top: 0px;
  color: white;
}
.design-main-container {
  padding-top: 80px;
  padding-bottom: 160px;
}
.why-us {
  padding-top: 80px;
  padding-bottom: 160px;
}
.work-flow-container {
  padding-top: 80px;
  padding-bottom: 120px;
}
.recent-projects-container {
  padding-top: 60px; 
  padding-bottom: 140px;
}
  .recent-posts-container {
    padding-top: 60px;
    padding-bottom: 100px;
  }
	.recent-posts .row > div:nth-child(odd) > div {
		margin-right: 20px;
	}
	.recent-posts .row > div:nth-child(even) > div {
		margin-left: 20px;
	}
.who-container {
  width: 100%; 
}
  #content-about div.who-we-are {
    padding-top: 10px;
    padding-bottom: 60px;
  }
#content-about div.who-we-are h2 {
  text-align: center;
  font-family: Impact, impactreg, "Segoe UI";
  font-size: 2em;
  padding: 0px 0 5px 0;
  color: purple;
}
#content-about div.who-we-are > hr {
  color: rgba(255, 174, 87, 1);
  background-color: rgba(255, 174, 87, 1);
  width: 80px;
  border: none;
  height: 3px;
  margin-bottom: 20px;
}
#content-about .who-we-are p#who-we-are-intro {
  margin-bottom: 20px;
  font-size: 1.5em;
  color: black;
  width: 100%;
  padding-left: 5%;
  padding-right: 5%;
  text-align: center;
}
#content-about .expert-services h2 {
  font-size: 2em; 
}
  #content-about .expert-services {
    padding-bottom: 120px;
		padding-top: 60px;
  }
  #content-about .expert-services div.service-description p {
    font-size: 1.2em;
  }
 #content-about .vision-mission {
    padding-bottom: 120px;
	  padding-top: 60px;
  }
  #content-about .vision-mission h2 {
    font-size: 2em;
  }
  #content-about div.vision-mission #vision h3 {
    font-size: 1.8em;
  }
  #content-about div.vision-mission #mission h3 {
    font-size: 1.8em;
  }
  #content-about div.vision-mission #vision p {
    font-size: 1.8em;
  }
  #content-about div.vision-mission #mission p {
    font-size: 1.8em;
  }
  .core-values {
    padding-bottom: 120px;
		padding-top: 60px;
  }
.core-values h2 {
   font-size: 2em; 
}
.core-values div p {
   font-size: 1.8em;
}
.our-clients {
    padding-bottom: 60px;
  }
.our-clients h2 {
  font-size: 2em;
}
#testimonials h2 {
  font-size: 2em;
  text-shadow:  -0.02em -0.02em 0.04em black;
}
#testimonials {
  padding-left: 10%;
  padding-right: 10%;
  padding-bottom: 120px;
	padding-top: 60px;
}
#testimonials .carousel-inner {
   margin-top: 0; 
   height: 400px;
}
#testimonials .carousel-caption {
    width: 80%;
    margin-left: auto;
    margin-right: auto;
    font-size: 1.5em;
    top: 0px;
}
.our-clients {
		padding-top: 60px;
	  padding-bottom: 120px;
}
#content-services .our-services {
  padding-left: 5%;
  padding-right: 5%;
  padding-bottom: 60px;
  margin-top: -17px;
  background-image: url('images/mesh.jpg');
  background-size: cover;
}
#content-services h2 {
  text-align: center;
  font-size: 2em;
  padding: 10px 0 10px 0;
  color: rgba(0, 192, 192, 1);
  font-family: Impact, impactreg, "Segoe UI";
  color: purple;
  text-transform: uppercase;
}
#content-services div.service-description {
  margin-bottom: 25px;
}
#content-services div.service-description p {
  font-size: 1.2em;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}
#content-services hr {
  margin-bottom: 30px;
}
#content-services .our-services .wrapper {
  background-color: white;
  padding-bottom: 2px;
  margin-bottom: 20px;
  border-radius: 15px;
  box-shadow: 1px 2px 5px rgba(120, 120, 120, 1);
}
#content-services .our-services img {
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
  height: 250px;
}
#content-services .our-services .wrapper:hover {
  background-color: rgba(255, 174, 201, 1);
}
#content-services .wrapper a {
  color: purple;
  height: 100%;
  display: block;
}
#content-services .wrapper a:hover {
  text-decoration: none;
}
#content-services h3 {
  font-size: 1.2em;
  font-weight: bold;
  color: black;
}
#content-services .technologies-container {
	padding-bottom: 90px;	
}
#content-projects {
  margin-top: -17px;
}
#content-projects .our-projects-container {
  padding-bottom: 100px;
  background-image: none;
  padding-top: 30px;
}
#content-projects .our-projects h3 {
  margin-top: 0px;
  margin-bottom: 20px;
  text-transform: uppercase;
}
#content-projects .our-projects hr {
  margin-bottom: 20px;
}
#content-projects .our-projects .projects-intro {
  font-size: 1.2em;
  width: 90%;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 40px;
}
#content-projects .get-quote-container {
  padding-top: 70px;
  padding-bottom: 150px;
  background-image: url('images/mesh.jpg');
  background-size: cover;
}
#content-projects .get-quote {
  background-color: black;
  border-top: 20px solid rgba(255, 174, 87, 1);
  margin-left: auto;
  margin-right: auto;
  width: 85%;
  padding: 30px 50px 50px 50px;
  border-radius: 20px;
  box-shadow: 1px 2px 5px rgba(120, 120, 120, 1);
}
#content-projects .get-quote-container h2 {
  text-align: center;
  font-weight: bold;
  margin-bottom: 20px;
}
#content-projects .get-quote-container > p {
  font-size: 1.8em;
  text-align: center;
  width: 80%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 40px;
  margin-top: 20px;
}
#content-projects .get-quote h3 {
  font-family: Impact, impactreg;
  margin-bottom: 15px;
  color: whitesmoke;
}
#content-projects .get-quote p {
  font-size: 1.1em;
  color: whitesmoke;
}
#content-projects .get-quote .form-group label {
  font-weight: bold;
  color: whitesmoke;
}
#content-projects .get-quote .form-group label sup {
  font-size: 1em;
  margin-left: 3px;
  vertical-align: text-bottom;
  display: inline-block;
  padding-bottom: 3px;
}
#content-projects .get-quote .form-group input {
  
} 
#content-projects .get-quote .label-checkboxes {
  font-weight: bold;
  margin-bottom: 10px;
  color: whitesmoke;
}
#content-projects .get-quote .form-check-label {
  color: whitesmoke;  
}
#content-projects .get-quote .form-check {
  padding-top: 4px;
  padding-bottom: 4px;
}
#content-projects .get-quote .text-message {
  margin-top: 10px;
}
#content-projects .get-quote textarea {
  height: 250px;
  margin-top: 15px;
}
#content-projects .get-quote .btn {
  width: 180px;
  font-weight: bold;
  margin-top: 10px;
  height: 50px;
  font-size: 1.2em;
  background-color: rgba(23, 162, 184, 1);
  border: 1px solid rgba(23, 162, 184, 1);
}
#content-projects .get-quote .btn:hover {
  background-color: rgba(0, 128, 128, 0);
  border: 3px solid rgba(23, 162, 184, 1);
}
#content-projects .get-quote .btn .fa-paper-plane {
  padding-right: 5px;
}
#content-contact .contact-container {
  padding-top: 30px;
  padding-bottom: 120px;
  background-image: url('images/mesh.jpg');
  background-size: cover;
  margin-top: -17px;
}
#content-contact .contact {
  background-color: teal;
  border-top: 20px solid whitesmoke;
  margin-left: auto;
  margin-right: auto;
  width: 85%;
  padding: 30px 50px 50px 50px;
  border-radius: 20px;
  box-shadow: 1px 2px 5px rgba(120, 120, 120, 1);
}
#content-contact .contact-container h2 {
  text-align: center;
  font-weight: bold;
  margin-bottom: 20px;
}
#content-contact .contact-container > p {
  font-size: 1.8em;
  text-align: center;
  width: 80%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 40px;
  margin-top: 20px;
}
#content-contact .contact h3 {
  font-family: Impact, impactreg;
  margin-bottom: 15px;
  color: whitesmoke;
}
#content-contact .contact p {
  font-size: 1.1em;
  color: whitesmoke;
}
#content-contact .contact .form-group label {
  font-weight: bold;
  color: whitesmoke;
}
#content-contact .contact .form-group label sup {
  font-size: 1em;
  margin-left: 3px;
  vertical-align: text-bottom;
  display: inline-block;
  padding-bottom: 3px;
}
#content-contact .contact .form-group input {
  background-color: whitesmoke;
} 
#content-contact .contact .form-group .invalid-feedback {
  color: rgba(255, 150, 150, 1);
  font-weight: bold;
}
#content-contact .contact .label-checkboxes {
  font-weight: bold;
  margin-bottom: 10px;
  color: rgba(130, 130, 130, 1);
}
#content-contact .contact .form-check {
  padding-top: 4px;
  padding-bottom: 4px;
}
#content-contact .contact .text-message {
  margin-top: 10px;
}
#content-contact .contact textarea {
  height: 250px;
  background-color: whitesmoke;
}
#content-contact .contact .btn {
  width: 180px;
  font-weight: bold;
  margin-top: 10px;
  height: 50px;
  font-size: 1.2em;
  background-color: rgba(23, 162, 184, 1);
  border: 1px solid rgba(23, 162, 184, 1);
}
#content-contact .contact .btn:hover {
  background-color: rgba(255, 174, 87, 1);
  border: 3px solid rgba(255, 174, 87, 1);
}
#content-contact .contact .btn .fa-paper-plane {
  padding-right: 5px;
}
#content-contact .contacts-container {
  padding-top: 6em;
  padding-bottom: 8em;
}
#content-contact #contacts {
  width: 80%;
  margin-left: auto;
  margin-right: auto;
  background-color: rgba(0, 0, 0, 0.7);
  padding-bottom: 30px;
  padding-top: 50px;
  padding-left: 20px;
  border-radius: 30px;
  border-top: 30px solid rgba(255, 174, 87, 1);
}
#content-contact div#contacts > div {
  padding: 0px 1% 0px 1%;
  height: 150px;
  margin: auto;
}
#content-contact div#contacts div#contact-one {
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  padding-bottom: 10px;
}
#content-contact div#contacts div#contact-five {
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}
#content-contact div#contacts > div h3 {
  text-align: left;
  font-family: Impact, impactreg, "Arial Black", Helvetica, sans-serif;
  font-weight: 900;
  padding-bottom: 5px;
  color: rgba(255, 174, 87, 1);
  font-size: 1.5em;
}
#content-contact div#contacts > div > p {
  text-align: left;
  width: 15%;
  float: left; 
  text-align: center;
  box-sizing: border-box;
}
#content-contact div#contacts > div div.contact-heading-description {
  width: 85%;
  float: left;
  font-family: Arial;
  font-size: 1.1em;
}
#content-contact div#contacts > div div p {
  color: whitesmoke;
}
#content-contact div#contacts > div > p i {
  background-color: whitesmoke;
  color: rgba(0, 0, 0, 0.7);
  width: 80px;
  height: 80px;
  line-height: 80px;
  border-radius: 50%;
  font-size: 2em;
  text-align: center;
}
#content-contact + footer {
  clear: left;
}
#content-contact .google-map-container h3 {
  text-align: center;
  margin-top: 0px;
  text-transform: uppercase;
  font-weight: bold;
  margin-bottom: 20px;
  font-size: 2em;
}
#content-contact .google-map-container hr {
  margin-bottom: 30px;
}
#content-contact .google-map-container {
  padding-top: 60px;
  padding-bottom: 100px;
  background-color: whitesmoke;
}
#content-contact .google-map-container iframe {
  width: 80%;
  height: 500px;
  margin-left: auto;
  margin-right: auto;
}
.blog-content .side-bar {
    height: 520px;
    position: sticky;
    top: 35px;
}
.blog-content > div:nth-child(1) {
	 padding-right: 40px;
}
.blog-content > div:nth-child(2) {
	
}
.blog-content .tab-content {
  background-color: white;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
  padding-top: 15px;
	padding-bottom: 20px;
	border-bottom: 1px solid lightgray;
	border-left: 1px solid lightgray;
	border-right: 1px solid lightgray;
}
.blog-content-container {
  background-color: whitesmoke;
  padding-bottom: 90px;
  padding-left: 5%;
  padding-right: 6%;
}
#content-blog .blog-content .section-title {
   color: purple;
   font-family: Impact, impactreg, "Segoe UI";
   font-size: 2em;
}
.blog-content hr {
  margin-bottom: 40px;
}
.blog-content .fas, .blog-content .fab {
  font-size: 1.5em; 
}
.blog-content .tab-content .row  {
  padding-top: 15px;
  padding-bottom: 15px;
  padding-left: 30px;
  padding-right: 30px;
}
.blog-content .tab-content .row > div {
  padding-left: 0;
  padding-right: 0;
	margin-bottom: 35px;
}
.blog-content .tab-content .row > div > div {
  padding-left: 0px;
  padding-right: 0px;
  margin-bottom: 10px;
  background-color: white;
  border-radius: 20px;
  box-shadow: 1px 2px 5px rgba(120, 120, 120, 1);
}
.blog-content .tab-content .row > div:nth-child(odd) > div {
	margin-right: 15px;
}
.blog-content .tab-content .row > div:nth-child(even) > div {
	margin-left: 15px;
}
.blog-content .tab-content .row > div > div a {
  color: black;
	display: flex;
	height: 100%;
}
.blog-content .tab-content .row > div > div a:hover {
  text-decoration: none;
}
.blog-content .tab-content .row div div:hover {
  background-color: lightblue;
}
.blog-content .tab-content .row div .image-container img {
  height: 200px;
  width: 100%;
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
}
.blog-content .tab-content .row div .sub-title {
  font-size: 1.2em;
  text-align: left;
  width: 100%;
  margin-bottom: 20px;
  font-family: "Teko Semibold", Impact, impactreg;
  padding-left: 15px;
  padding-right: 15px;
}
.post-excerpt {
  padding-left: 15px;
  padding-right: 15px;
}
.post-excerpt + p {
  padding-left: 15px;
	margin-bottom: -10px;
}
.blog-content .post-author-image {
   width: 50px;
   height: 50px;
   border-radius: 50%;
   margin-bottom: 10px;
   margin-right: 10px;
   float: left;
}
.blog-content .post-meta {
  display: inline-block;
  font-size: 0.8em;
  width: 75%;
}
#content-blog .side-bar {
  background-color: white;
  margin-top: 115px;
	padding-left: 20px;
	padding-right: 20px;
	padding-bottom: 20px;
	border: 1px solid lightgray;
}
  #content-blog .side-bar h2 {
    font-size: 1.5em;
    padding-top: 5px;
    padding-bottom: 10px;
		color: purple;
		font-family: "Teko Semibold";
  }
  #content-blog .recent-projects {
    width: 100%;
    margin-left: 0;
		padding-top: 20px;
  }
#content-blog .recent-projects p#blur-on {
  text-align: center;
  background-color: rgba(135, 206, 235, 0.5);
  height: 100%;
  position: absolute;
  width: 100%;
  z-index: 1;
  color: white;
  box-sizing: border-box;
  padding-top: 10px;
}
#content-blog .recent-projects p#blur-on span#more {
  font-family: Impact, impactreg;
  font-size: 1em;
  text-transform: uppercase;
  display: inline-block;
  margin-top: 30px;
}
  #content-blog .recent-projects .project {
    position: relative;
    margin-bottom: 6px;
  }
  #content-blog .recent-projects .project:nth-child(2) {
    border-right: 3px solid white; 
  }
   #content-blog .recent-projects .project:nth-child(3) {
    border-left: 3px solid white;
  }
   #content-blog .recent-projects .project:nth-child(4) {
    border-right: 3px solid white; 
  }
   #content-blog .recent-projects .project:nth-child(5) {
    border-left: 3px solid white; 
  }
  #content-blog .recent-projects .project-heading {
    position: absolute;
    background-color: rgba(0, 0, 0, 0.5);
    color: whitesmoke;
    text-align: center;
    font-size: 0.85em;
    width: 100%;
    font-family: Impact, impactreg;
    text-transform: capitalize;
    bottom: -8px;
    padding-top: 5px;
    padding-bottom: 5px;
  }
  #content-blog .recent-projects .project-image-container {
    width: 100%;
  }
#content-blog .recent-projects .project-image-container img {
   width: 100%;
   display: block;
}
#content-blog .search-posts {
 padding-left: 15px;
 padding-right: 15px;
 padding-top: 15px;
}
#content-blog .search-posts form {
 width: 100%;  
}
#content-blog .search-posts .fa-search {
  font-size: 1.3em;
}
#content-blog .categories {
 padding-left: 15px;
 padding-right: 15px;
}
#content-blog div ul {
  list-style-type: none;
  padding-left: 0;
  font-size: 1em;
}
  
#content-blog .popular-posts {
 padding-left: 15px;
 padding-right: 15px;
}
#content-blog .recent-posts {
 padding-left: 15px;
 padding-right: 15px;
}
#content-blog .categories {
 padding-left: 15px;
 padding-right: 15px;
 background-color: whitesmoke;
 margin-left: 1px;
 margin-right: 1px;
 border-radius: 10px;
 box-shadow: 0px 0px 2px rgba(120, 120, 120, 1);
}
#content-blog .categories h2 {
 padding-top: 10px;
 margin-bottom: 0px;
}
#content-blog .side-bar ul {
  list-style-type: none;
  padding-left: 0;
  font-size: 1em;
}
#content-blog .side-bar ul li a {
	color: black;	
}
#content-blog .popular-posts {
 padding-left: 15px;
 padding-right: 15px;
}
#content-blog .recent-posts {
 padding-left: 15px;
 padding-right: 15px;
  background-color: whitesmoke;
 margin-left: 1px;
 margin-right: 1px;
 margin-top: 20px;
 border-radius: 10px;
 box-shadow: 0px 0px 2px rgba(120, 120, 120, 1);
}
#content-blog .recent-posts h2 {
	padding-top: 10px;
	margin-bottom: 0px;
}
#content-blog .recent-posts ul li {
	margin-bottom: 10px;
}
#content-service {
  margin-top: -17px;
  overflow: clip;
}
#content-service .service-content-container {
  padding-top: 20px;
  background-color: unset;
  padding-bottom: 0px;
  padding-left: 0;
  padding-right: 0;
}
#content-service .overview-container {
  padding-left: 10%;
  padding-right: 10%;
  padding-bottom: 20px;
}
#content-service .overview-container h2 {
  font-family: Impact, impactreg;
  text-transform: uppercase;
  text-align: center;
  font-size: 2em;
  margin-bottom: 20px;
  width: 100%;
}
#content-service .overview-container .overview-image img {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  height: 425px;
  display: block;
  border: 10px solid whitesmoke;
  margin-top: 30px;
  margin-bottom: 30px;
  box-shadow: 1px 2px 5px rgba(120, 120, 120, 1);
}
#content-service .overview-intro {
  font-size: 1.2em;
  margin-top: 20px;
}
#content-service #service-main {
  background-color: whitesmoke;
  padding-top: 40px;
  padding-bottom: 60px;
}
#content-service .indepth-description {
  font-size: 1.2em;
  background-color: white;
  width: 80%;
  margin-left: auto;
  margin-right: auto;
  
}
#content-service .work-flow {
  padding-bottom: 80px;
  margin-top: -15px;
  padding-left: 10%;
  padding-right: 10%;
}
#content-service .work-flow >  [class*='col-'] {
  display: flex;
  padding-left: 0;
  padding-right: 0;
}
#content-service .work-flow > div > div {
  padding-left: 0;
  padding-right: 0;
}
#content-service .work-flow div div  {
  margin-top: 20px;
  border-radius: 10px;
  border-top: 10px solid rgba(255, 174, 87, 1);
  background-color: purple; 
}
#content-service .work-flow .section-title {
  font-family: Impact, impactreg;
  font-size: 1.8em;
  color: purple;
  text-transform: capitalize;
  text-align: left;
  margin-bottom: 10px;
}
#content-service .work-flow .section-description {
  color: white;
  font-size: 1.2em;
  text-align: left;
  margin-bottom: 10px;
}
#content-service .work-flow div div p {
  text-align: center;
}
#content-service .work-flow .sub-title {
  color: rgba(210, 210, 210, 1);
  font-weight: bold;
}
#content-service .work-flow .excerpt {
  color: rgba(210, 210, 210, 1);
}
#content-service .work-flow .section-description {
  color: black;
}
#content-service .work-flow .fas {
  font-size: 3em;
  background-color: rgba(255, 174, 87, 1);
  color: white;
  width: 90px;
  height: 90px;
  line-height: 90px;
  border-radius: 50%;
  margin-top: 30px;
  text-align: center;
}
#content-service .testimonials, #content-services .testimonials  {
  background-color: teal;
  padding-left: 5%;
  padding-right: 5%;
  text-align: center;
  padding-top: 30px;
  padding-bottom: 60px;
}
#content-service .testimonials p, #content-services .testimonials p {
  width: 100%;
}
#content-service .testimonials .testimonial-container, #content-services .testimonials .testimonial-container  {
  padding-bottom: 30px;
  width: 70%;
  margin-left: auto;
  margin-right: auto;
}
#content-service .testimonials .testimony, #content-services .testimonials .testimony {
  font-size: 1.5em;
  color: whitesmoke;
  font-weight: bold;
  padding: 10px;
} 
#content-service .testimonials .ceo-name, #content-services .testimonials .ceo-name{
  font-size: 1em;
  color: whitesmoke;
  font-weight: bold;
  padding: 10px;
}
#content-service .faqs, #content-services .faqs {
  padding-top: 60px;
  padding-bottom: 40px;
  padding-left: 35px;
  padding-right: 35px;
  background-image: url('images/mesh.jpg');
  background-size: cover;
}
#content-service .faqs h2, #content-services .faqs h2 {
  font-family: Impact, impactreg;
  font-size: 2em;
  text-align: center;
  margin-bottom: 20px;
  width: 100%;
}
#content-service .faqs-intro, #content-services .faqs-intro {
  font-size: 1.8em;
  text-align: center;
  width: 100%;
  margin-bottom: 30px;
}
#content-service .faqs .wrapper, #content-services .faqs .wrapper {
  padding-left: 0;
  padding-right: 0;
}
#content-service .question-container:last-child, #content-services .question-container:last-child {
  margin-bottom: 30px;
}
#content-service .question, #content-services .question {
  padding: 10px;
  background-color: blueviolet;
  color: whitesmoke;
  font-weight: bold;
  overflow: auto;
  font-size: 1.1em;
}
#content-service .question span:nth-child(1), #content-services .question span:nth-child(1) {
  float: left;
  width: 90%;
  padding-left: 7px;
}
#content-service .question span:nth-child(2), #content-services .question span:nth-child(2) {
  float: left;
  width: 10%;
  text-align: center;
  font-size: 1.3em;
  cursor: pointer;
}
#content-service .answer, #content-services .answer{
  padding: 15px 15px 25px 15px;
  clear: left;
  font-size: 1.1em;
}
#content-services .answer a {
  display: inline-block;
}
#content-service .quote-question {
  background-color: teal;
  padding: 90px 5% 90px 5%;
  text-align: center;
}
#content-service .quote-question h2 {
  font-size: 2.8em;
  text-align: center;
  width: 100%;
}
#content-service .quote-question h2 span:nth-child(1) {
  font-weight: bold;
  color: rgba(255, 174, 87, 1);
  text-align: center;
  display: block;
  margin-bottom: -20px;
  width: 60%;
  margin-left: auto;
  margin-right: auto;
}
#content-service .quote-question h2 span:nth-child(3) {
  color: whitesmoke;
  display: block;
  margin-bottom: 20px;
  font-size: 0.7em;
  text-align: center;
  width: 70%;
  margin-left: auto;
  margin-right: auto;
}
#content-service .quote-question p {
  text-align: center;
  width: 100%;
}
#content-service .quote-question .btn-info {
  font-size: 1.2em;
  height: 50px;
  font-weight: bold;
  width: 180px;
  background-color: purple;
  border: 1px solid purple;
}
#content-service .our-services {
  padding-left: 35px;
  padding-right: 35px;
  padding-top: 40px;
  padding-bottom: 100px;
}
#content-service .our-services hr {
  margin-bottom: 40px;  
}
#content-service .our-services h2 {
  text-align: center;
  font-size: 2em;
  padding: 0px 0 10px 0;
  color: rgba(0, 192, 192, 1);
  font-family: Impact, impactreg, "Segoe UI";
  color: purple;
  text-transform: uppercase;
  margin-bottom: 10px;
}
#content-services hr {
  margin-bottom: 20px;
}
#content-service .our-services .wrapper{
  background-color: white;
  margin-bottom: 20px;
  border-radius: 15px;
  height: 92%;
  box-shadow: 1px 2px 5px rgba(120, 120, 120, 1);
}
#content-service .our-services img {
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
  height: 250px;
}
#content-service .our-services .wrapper:hover {
  background-color: rgba(255, 174, 201, 1);
}
#content-service .wrapper a {
  color: purple;
  height: 100%;
  display: block;
  padding-bottom: 5px;
}
#content-service .wrapper h3 {
  font-weight: bold; 
  font-size: 1.3em;
}
#content-service .wrapper a:hover {
  text-decoration: none;
}
#content-project {
  margin-top: -17px;
  overflow: clip;
  background-color: whitesmoke;
}
#content-project .project-content-container {
  padding-top: 30px;
  background-color: unset;
  padding-bottom: 0px;
  padding-left: 0;
  padding-right: 0;
  margin-top: -40px;
}
#content-project .overview-container {
  padding-left: 8%;
  padding-right: 8%;
  padding-top: 40px;
  background-size: cover;
  background-color: whitesmoke;
  background-image: url('images/mesh.jpg');
  background-size: cover;
  margin-top: -10px;
  padding-bottom: 30px;
}
#content-project .overview-container h2 {
  font-family: Impact, impactreg;
  text-transform: uppercase;
  text-align: center;
  font-size: 2em;
  margin-bottom: 20px;
  width: 100%;
}
  #content-project .overview-container .overview {
    width: 100%;
  }  
#content-project .overview-container .overview-image img {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  height: auto;
  display: block;
  border: 5px solid white;
  box-shadow: 1px 2px 5px rgba(120, 120, 120, 1);
}
#content-project .overview-intro {
  font-size: 1.2em;
  margin-bottom: 30px;
  margin-top: 20px;
}
#content-project #project-meta-main {
  background-color: whitesmoke;
  padding-top: 40px;
}
#content-project .indepth-description {
  padding-top: 30px;
  background-color: white;
  padding-bottom: 30px;
  width: 84%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 40px;
}
#content-project .indepth-description h3 {
  font-family: Impact, impactreg;
  font-size: 1.6em;
  margin-bottom: 20px;
}
#content-project .indepth-description p {
  font-size: 1.2em; 
  margin-bottom: 25px;
}
#content-project .project-meta {
  position: relative; 
}
#content-project .project-meta p.client-logo {
  position: absolute;
  right: 50px;
  top: 20px;
}
#content-project .project-meta #pcu-logo img {
  height: unset;
  width: unset;
}
#content-project .project-meta #goshen-logo img {
  height: unset;
  width: unset;
}
#content-project .project-meta ul {
  padding-top: 10px;
  list-style-type: none;
  padding-left: 0;
  width: 100%; 
  display: block;
}
#content-project .project-meta ul li {
  line-height: 32px;
  overflow: auto;
  width: 100%;
}
#content-project .project-meta ul .name {
  font-size: 1.2em;
  font-weight: bold;
  float: left;
  display: inline-block;
  width: 15%;
}
#content-project .project-meta ul .value {
  float: left;
  display: inline-block;
  width: 85%;
  font-size: 1.1em;
}

#content-project .project-main {
  clear: left;
  margin-top: 15px;
}
#content-project .project-photos {
  background-image: url('images/mesh.jpg');
  background-size: cover;
  padding-top: 50px;
  padding-bottom: 80px;
  padding-left: 5%;
  padding-right: 5%;
}
#content-project .project-photos .image-container {
  margin-bottom: 20px;
}
#content-project .project-photos p {
  height: 300px;
}
#content-project .project-photos p img {
  height: 100%;
}

#content-project .testimonials {
  background-color: teal;
  padding-left: 5%;
  padding-right: 5%;
  text-align: center;
  padding-top: 20px;
  padding-bottom: 60px;
}
#content-project .testimonials h2.section-title {
  text-transform: uppercase;
  color: black;
}
#content-project .testimonials p {
  width: 100%;
}
#content-project .testimonial-container {
  padding-bottom: 30px;
  width: 75%;
  margin-left: auto;
  margin-right: auto;
}
#content-project .testimonials .testimony {
  font-size: 1.8em;
  color: whitesmoke;
  font-weight: bold;
  padding: 15px;
} 
#content-project .testimonials .ceo-name {
  font-size: 1em;
  color: whitesmoke;
  font-weight: bold;
  padding: 15px;
}
#content-project .faqs {
  padding-top: 40px;
  padding-left: 5%;
  padding-right: 5%;
  background-image: url('images/mesh.jpg');
  background-size: cover;
  padding-bottom: 30px;
}
#content-project .faqs h2 {
  font-family: Impact, impactreg;
  font-size: 2em;
  text-align: center;
  margin-bottom: 20px;
  width: 100%;
}
#content-project .faqs-intro {
  font-size: 1.8em;
  text-align: center;
  width: 100%;
  margin-bottom: 30px;
}
#content-project .faqs .wrapper {
  border-bottom-left-radius: 30px;
  border-bottom-right-radius: 30px;
  box-shadow: 1px 2px 5px rgba(120, 120, 120, 1);
  background-color: whitesmoke;
  margin-bottom: 40px;
  padding-left: 0;
  padding-right: 0;
}
#content-project .question-container:last-child {
  margin-bottom: 30px;
}
#content-project .question {
  padding: 10px;
  background-color: purple;
  color: whitesmoke;
  font-weight: bold;
  overflow: auto;
}
#content-project .question span:nth-child(1) {
  float: left;
  width: 90%;
  padding-left: 7px;
}
#content-project .question span:nth-child(2) {
  float: left;
  width: 10%;
  text-align: center;
  font-size: 1.3em;
  cursor: pointer;
}
#content-project .answer {
  padding: 0px 15px 25px 15px;
  clear: left;
  display: none;
}
#content-project .quote-question {
  background-color: teal;
  padding: 40px 5% 50px 5%;
  text-align: center;
}
#content-project .quote-question h2 {
  text-align: center;
  width: 100%;
}
#content-project .quote-question h2 span:nth-child(1) {
  font-weight: bold;
  color: rgba(255, 174, 87, 1);
  text-align: center;
  display: block;
  margin-bottom: -20px;
  width: 60%;
  margin-left: auto;
  margin-right: auto;
  font-size: 1.3em;
}
#content-project .quote-question h2 span:nth-child(3) {
  color: whitesmoke;
  display: block;
  margin-bottom: 20px;
  font-size: 1em;
  text-align: center;
  width: 70%;
  margin-left: auto;
  margin-right: auto;
}
#content-project .quote-question p {
  text-align: center;
  width: 100%;
}
#content-project .quote-question .btn-info {
  font-size: 1.2em;
  height: 50px;
  font-weight: bold;
  width: 180px;
  background-color: purple;
  border: 1px solid purple;
}
#content-project .quote-question .btn-info:hover {
  background-color: teal;
  border: 3px solid purple;
}
.related-projects {
 padding-top: 30px;
 padding-bottom: 80px;
 padding-left: 5%;
 padding-right: 5%;
 background-image: url('images/mesh.jpg');
 background-size: cover;
}
.related-projects .section-title {
  color: rgba(0, 192, 192, 1);
  color: black;
  font-family: Impact, impactreg, "Segoe UI";
  font-size: 2em;
  margin-bottom: 20px;
  text-transform: uppercase;
}
.related-projects hr {
  margin-bottom: 40px;
}
.related-projects .fas, .related-projects .fab {
  font-size: 1.5em; 
}
.related-projects .project {
  position: relative;
  padding-left: 0px;
  padding-right: 0px;
}
.related-projects div img {
  width: 100%;
}
.related-projects div .sub-title {
  font-size: 1.4em;
  position: absolute;
  text-align: center;
  left: 0px;
  bottom: 0px;
  height: 50px;
  line-height: 50px;
  width: 100%;
  color: white;
  background-color: rgba(0, 0, 0, 0.5);
  margin-bottom: 0px;
  font-family: Impact, impactreg;
}
.related-projects .sub-title .fas, .related-projects .sub-title .fab {
  margin-right: 10px;
}
.related-projects p#blur-on {
  text-align: center;
  background-color: rgba(135, 206, 235, 0.5);
  position: absolute;
  width: 100%;
  z-index: 1;
  color: white;
  box-sizing: border-box;
  padding-top: 70px;
}
.related-projects p#blur-on span#description {
  font-family: Impact, impactreg;
  font-size: 1.5em;
}
.related-projects p#blur-on span#more {
  font-family: Impact, impactreg;
  font-size: 1.8em;
  text-transform: uppercase;
  display: inline-block;
  margin-top: 30px;
}
#content-post .post-content-container {
  padding-top: 30px;
  padding-bottom: 0px;
}
#content-post {
  margin-top: -17px;
}
#content-post .post-content-container .post-content {
  padding-left: 6%;
  padding-right: 7%;
}
#content-post .post-content-container .post-content > div:first-child {
  padding-left: 10px;
  padding-right: 40px;
  padding-top: 0;
  padding-bottom: 40px;
}
#content-post .post-content .post-main {
	font-size:	1.1em;
}

#content-post .post-content .post-footer {
	font-size:	1.1em;
}
#content-post .post-content > div:first-child h2 {
  text-transform: capitalize;
  font-size: 2.8em;
  text-align: left;
  width: 100%;
}
#content-post .post-content > div:last-child {
  margin-top: 20px;
}
#content-post h2 {
  font-size: 2em;
  font-family: Arial, sans-serif;
  text-align: left;
  margin-bottom: 20px;
  font-weight: bold;
}
#content-post .post-head .post-meta small {
  font-weight: bold;
}
#content-post .side-bar {
  background-color: rgba(243, 230, 243);
  height: 510px;
  border: 1px solid lightgray;
  position: sticky;
  top: 35px;
  margin-bottom: 50px;
}
  #content-post .side-bar h2 {
    font-size: 1.5em;
    padding-top: 20px;
    padding-bottom: 0px;
    text-align: left;
    font-family: "Teko Semibold";
  }
  #content-post .recent-projects {
    width: 100%;
    margin-left: 0;
  }
#content-post .recent-projects p#blur-on {
  text-align: center;
  background-color: rgba(135, 206, 235, 0.5);
  height: 100%;
  position: absolute;
  width: 100%;
  z-index: 1;
  color: white;
  box-sizing: border-box;
  padding-top: 10px;
}
#content-post .recent-projects p#blur-on span#more {
  font-family: Impact, impactreg;
  font-size: 1em;
  text-transform: uppercase;
  display: inline-block;
  margin-top: 30px;
}
  #content-post .recent-projects .project {
    position: relative;
    margin-bottom: 6px;
  }
  #content-post .recent-projects .project:nth-child(2) {
    border-right: 3px solid white; 
  }
   #content-post .recent-projects .project:nth-child(3) {
    border-left: 3px solid white;
  }
   #content-post .recent-projects .project:nth-child(4) {
    border-right: 3px solid white; 
  }
   #content-post .recent-projects .project:nth-child(5) {
    border-left: 3px solid white; 
  }
  #content-post .recent-projects .project-heading {
    position: absolute;
    background-color: rgba(0, 0, 0, 0.5);
    color: whitesmoke;
    text-align: center;
    font-size: 0.9em;
    width: 100%;
    font-family: Impact, impactreg;
    text-transform: uppercase;
    bottom: -8px;
    padding-top: 5px;
    padding-bottom: 5px;
  }
#content-post .recent-projects .project-image-container {
    width: 100%;
}
#content-post .recent-projects .project-image-container img {
   width: 100%;
   display: block;
}
#content-post .search-posts {
 padding-left: 15px;
 padding-right: 15px;
 padding-top: 15px;
}
#content-post .search-posts form {
 width: 100%;   
}
#content-post .search-posts .fa-search {
  font-size: 1.3em;
}
#content-post .categories {
 padding-left: 15px;
 padding-right: 15px;
 background-color: white;
 margin-left: 1px;
 margin-right: 1px;
 border-radius: 10px;
 box-shadow: 0px 0px 2px rgba(120, 120, 120, 1);
}
#content-post .categories h2 {
 padding-top: 10px;
 margin-bottom: 0px;
}
#content-post .side-bar ul {
  list-style-type: none;
  padding-left: 0;
  font-size: 1em;
}
#content-post .side-bar ul li a {
	color: black;	
}
#content-post .popular-posts {
 padding-left: 15px;
 padding-right: 15px;
}
#content-post .recent-posts {
 padding-left: 15px;
 padding-right: 15px;
  background-color: white;
 margin-left: 1px;
 margin-right: 1px;
 margin-top: 20px;
 border-radius: 10px;
 box-shadow: 0px 0px 2px rgba(120, 120, 120, 1);
}
#content-post .recent-posts h2 {
	padding-top: 10px;
	margin-bottom: 0px;
}
#content-post .recent-posts li {
	margin-bottom: 10px;
}
  #content-post .related-articles {
    padding-bottom: 80px;
  }
#content-post .related-articles > div[class^="col"] {
	margin-bottom: 40px;
}
.business-info .services-provided h3 {
		color: skyblue;
}
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.add-lg-left-margin {
  margin-left: 8px;
}
.add-lg-right-margin {
  margin-right: 8px;
 }
}
@media only screen and (min-width: 1100px) {
  .recent-posts .tab-content .row div .image-container img {
  height: 280px;
}
}

@media only screen and (min-width: 1200px) {
#content-privacy-policy div#design-stripes {
	width: 75%;
}
#content-privacy-policy #wrapper {
	width: 75%;
	margin-bottom: 60px;
}
.add-xl-left-margin {
  margin-left: 8px;
}
.add-xl-right-margin {
  margin-right: 8px;
 }
 .recent-projects .tab-content .row div {
 
}
.recent-projects .tab-content .row div img {
  
  width: 100%;
}
.recent-projects .tab-content .row div .sub-title {
  font-size: 1.4em;
  height: 60px;
  line-height: 60px;
}
#content-service .overview-container {
   padding-left: 15%;
   padding-right: 15%;
}
#content-service #service-main {
}
#content-service .indepth-description {
   width: 70%; 
}
  #content-service .work-flow {
    padding-left: 15%;
    padding-right: 15%;
  }
#content-service .overview-container .overview-image img {
    height: 480px;
  }
#content-service .testimonials .testimony, #content-services .testimonials .testimony  {
  font-size: 1.8em;
  color: whitesmoke;
  font-weight: bold;
  padding: 15px;
} 
#content-service .testimonials .ceo-name, #content-services .testimonials .ceo-name {
  padding: 15px;
  }
#content-project .overview-container {
  padding-left: 15%;
  padding-right: 15%;
  padding-top: 40px;
  background-size: cover;
  background-color: whitesmoke;
  background-image: url('images/mesh.jpg');
  background-size: cover;
  margin-top: -10px;
  padding-bottom: 30px;
}
#content-project .overview-container h2 {
  font-family: Impact, impactreg;
  text-transform: uppercase;
  text-align: center;
  font-size: 2em;
  margin-bottom: 20px;
  width: 100%;
}
#content-project #project-meta-main {
    
}
#content-project .indepth-description {
  padding-top: 30px;
  background-color: white;
  padding-bottom: 30px;
  width: 70%;
} 
#content-project .project-photos p {
  height: 370px;  
}
#content-post .post-content {
  padding-left: 3.5%;
  padding-right: 3.5%;
}
#content-post .post-content .post-image-container img {
  height: 450px; 
 }
#content-post .post-content > div:first-child {
  padding-left: 50px;
  padding-right: 70px;
  padding-top: 0;
  padding-bottom: 40px;
}
}
