/*--------Stylesheet for DUSTECH 2019 >> UPDATED 2023--------*/



html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}



/*--------HTML5 display-role reset for older browsers--------*/

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}


body {
line-height: 1;
}


ol, ul {
list-style: none;
}


blockquote, q {
quotes: none;
}


blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}


table {
border-collapse: collapse;
border-spacing: 0;
}




/*----------------BASIC STYLES----------------*/

body {
font: 13px/23px "Open Sans", sans-serif;
-webkit-font-smoothing: antialiased;
word-wrap: break-word;
color: #1a1a1a; /*-----overall font color 777777 med gray original value-----*/
}


a {
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-ms-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}



input::-moz-focus-inner {
border: 0;
}


a:hover, a:active, a:focus {
text-decoration: none;
outline: none;
}



h1, h2, h3, h4, h5, h6 {
font-family: "Open Sans", sans-serif;
color: #0d3774; /*-----dk blue // orig value 444444-----*/
}


.top-header .right-header ul.social-icons, .main-header .menu ul {
padding: 0;
margin: 0;
list-style: none;
}


#portfolio, #about, #contact {
padding-top: 170px; /*-----orig value 120px-----*/
}




/*----------------HEADER SECTION----------------*/


/*--------Top Header Contact Info SocMedia Icons--------*/

.top-header {
color: #000000;
padding: 10px 0;
background: #f6ba00;  /*----yelOrange for Dustech original orange e3722e----*/
}


.top-header .left-header span {
display: inline-block;
margin: 8px 30px 0 0;
}


.top-header .left-header span i {
margin-right: 10px;
}


.top-header .right-header ul.social-icons li {
display: inline-block;
}


.top-header .right-header ul.social-icons li a {
width: 32px;
height: 32px;
color: white;
text-align: center;
line-height: 30px;

border: 1px solid white;
-webkit-border-radius: 16px;
border-radius: 16px;
margin: 0 5px;
}


.top-header .right-header ul.social-icons li a:hover {
color: #f6ba00; /*--------make same color as top header bg--------*/
background: white;
}




/*----------------MAIN HEADER LOGO and MENUS----------------*/


.main-header {
position: fixed;
width: 100%;
z-index: 9999;
padding: 40px 0;
background: #0d3774; /*-----dark blue-----*/

-webkit-box-shadow: 0 2px 4px rgba(1, 1, 1, 0.15) ;
-moz-box-shadow: 0 2px 4px rgba(1, 1, 1, 0.15) ;

box-shadow: 0 2px 4px rgba(1, 1, 1, 0.15) ;
-webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-ms-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
}




/*----------------LOGO----------------*/


/*----DUSTECH Logo----*/

.dtLogo {
width: 90%;
height: auto;
margin-top: -10px; /*----adjust value if logo image size is changed----*/
}


.main-header .logo {
margin-top: 0;
}


.main-header .logo h1 a {
color: #444444; /*----original / use if logo is text / unused for Dustech----*/
}



/*--------MENUS--------*/


.main-header .menu {
margin-top: 20px;
}


.main-header .menu ul li {
display: inline-block;
margin-left: 15px;
}


.main-header .menu ul li a {
color: #fff;
text-transform: uppercase;
font-size: 15px;
padding: 8px 15px;
-webkit-border-radius: 3px;
border-radius: 3px;
}


.main-header .menu ul li a.current {
color: #fff;
background: #e3722e;
}


.main-header-shrink {
padding: 25px 0;
top: 0;
}




/*----menu properties for hover effect / not in original css / added for Dustech----*/

a.menuBtn:link {
color: #fff;
text-decoration: none;
text-transform: uppercase;
font-size: 15px;

padding: 8px 15px;
}

a.menuBtn:visited {
color: #fff;
font-weight: normal;
}


a.menuBtn:hover {
color: #fff;
background: #6695cf; /*----light skyblue----*/
}


a.menuBtn:active {
color: #fff;
}



.main-header .menu ul li a.current {
color: #fff;
background: #f6ba00; /*----yel Orange same as top header bg----*/
}






/*----------------MENUS RESPONSIVE Styles for MOBILE DEVICES----------------*/

.responsive-menu {
position: relative;
top: -20px;
}


.responsive-menu .toggle-menu {
font-size: 24px;
color: #fff; /*-----horiz bars menu icon color-----*/
}


.responsive-menu .menu {
width: 100%;
display: none;
position: absolute;
top: 52px;

background: #e3722e; /*-----modify bg color here // orig value e3722e orange-----*/
}


.responsive-menu .menu ul li {
display: block;
text-align: left;
border-bottom: 1px solid #fff;
margin: 0;
}


.responsive-menu .menu ul li:last-child {
border-bottom: 0;
}


.responsive-menu .menu ul li a {
color: white;
padding: 15px 20px;
display: block;
-webkit-border-radius: 0;
border-radius: 0;
}


.responsive-menu .menu ul li a.current {
background: #f6ba00; /*-----current page-----*/
}




/*--------------------Text link styles for Sitemap Button in header / not in original / added for Dustech--------------------*/


a.txLink01:link {
color: #000;
text-decoration: none;
font-size: 13px;
padding: 8px 10px;
}

a.txLink01:visited {
color: #000;
font-weight: normal;
}


a.txLink01:hover {
color: #fff;
-webkit-border-radius: 3px;
border-radius: 3px;
background: #6695cf; /*----light skyblue----*/
}


a.txLink01:active {
color: #fff;
}



/*--------------------UPDATED 2023 Sitemap Text Link Button in FOOTER / not in original / added for Dustech--------------------*/


a.txLink02:link {
color: #fff;
font-size: 13px;
line-height: 20px;
text-align: left;
text-decoration: underline;

padding: 0;
}

a.txLink02:visited {
color: #fff;
font-weight: normal;
}


a.txLink02:hover {
color: #fff;
text-decoration: none;
}


a.txLink02:active {
color: #fff;
}





/*--------------------UPDATED 2023 Text Link Properties Products in Header / not in original / added for Dustech--------------------*/


a.txLink03:link {
color: #fff;
line-height: 20px;
text-align: left;
text-decoration: underline;
}

a.txLink03:visited {
color: #fff;
font-weight: normal;
}


a.txLink03:hover {
color: #fff;
text-decoration: none;
}


a.txLink03:active {
color: #fff;
}



/*-----Text Link Properties Quick Links Slide Gallery Current Page-----*/

.txlinkCurrent {
color: #333;
font-weight: bold;
line-height: 20px;
text-align: left;
text-decoration: none;
text-transform: uppercase;
}



/*-----Font properties for Text Links in Slide section-----*/

.textSlide {
color: #;
font-size: 15px;
font-weight: normal;
text-align: center; 
height: auto; 
margin: 25px 0 0 0; 
padding: 25px 0; 
background: #ababab;
}


.flexBox {
padding-top: 0; 
background: #ababab;
}


.black {
color: #000;
font-weight: strong;
}


.prodTitleSect {
color: #333;
font-weight: bold;
line-height: 30px;
text-decoration: underline;
}











/*--------------------Basic Layout Styles--------------------*/


.title-section {
margin-bottom: 80px;
}


.title-section h2 {
font-size: 24px;
font-weight: normal;
text-transform: uppercase;
display: block;
margin-bottom: 20px;
}


.title-section span { /*-----underline below section title-----*/
display: block;
width: 20%;
height: 4px;
background: #f6ba00;
margin: 0 auto;
}


.widget-title {
font-size: 18px;
font-weight: 600;
margin-bottom: 30px;
}



.mainBtn {
display: inline-block;

font-weight: 600;
font-size: 14px;
color: white;
text-transform: uppercase;


-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-ms-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;

padding: 10px 15px;
background-color: #e3722e;
}



.mainBtn:hover {
background: #444444;
}





/*----------SERVICES Section // UNUSED for DUSTECH----------*/


#services .service-item .service-header {
padding-bottom: 20px;
clear: both;
}


#services .service-item .service-header i {
color: #e3722e;
font-size: 24px;
float: left;
margin-right: 25px;
}


#services .service-item .service-header h3 {
font-size: 18px;
text-transform: uppercase;
font-weight: 600;
}





/*--------------------Portfolio PRODUCTS GALLERY Section for Home page--------------------*/


#portfolio {
padding-bottom: 80px;
margin-top: 1px;
background: #3d3f3f; /*-----dk gray-----*/
}


#portfolio .title-section h2 {
color: white;
}


#portfolio .portfolio-thumb {
overflow: hidden;
position: relative;
margin-bottom: 30px; /*-----spacing for thumbs-----*/
}


#portfolio .portfolio-thumb img {
width: 100%;
height: auto;
}



#portfolio .portfolio-thumb .overlay {
width: 100%;
height: 100%;

position: absolute;
top: 0;
left: 0;

opacity: 0;
visibility: visible;
background: rgba(227, 114, 46, 0.9);

-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-ms-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}


#portfolio .portfolio-thumb .overlay .inner {
position: absolute;
padding: 20px;
width: 100%;
bottom: 0;
left: 0;
text-align: center;
}


#portfolio .portfolio-thumb .overlay .inner h4 {
font-size: 18px;
margin-bottom: 25%; /*-----modify text distance from bottom of overlay box-----*/
}


#portfolio .portfolio-thumb .overlay .inner h4 a {
color: white;
}


#portfolio .portfolio-thumb .overlay .inner span {
font-weight: 300;
color: white;
}


#portfolio .portfolio-thumb:hover .overlay {
opacity: 1;
visibility: visible;
}




#portfolio .products {
margin: 0;
}




/*--------------------ABOUT SECTION--------------------*/


#about {
padding: 200px 0 100px 0; /*-----added not in original // used to modify top spacing of footer for products page-----*/
}


#about .progess-bars li .progress {
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
-webkit-border-radius: 0;
border-radius: 0;
background: #e6e6e6;
height: 30px;
margin-bottom: 15px;
}


#about .progess-bars li .progress-bar {
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
line-height: 30px;
background: #e3722e;
text-transform: uppercase;
}

#about .our-team {
margin-top: 80px;
}


#about .our-team .team-member {
overflow: hidden;
}


#about .our-team .team-member .member-img {
width: 100%;
position: relative;
}


#about .our-team .team-member .member-img img {
width: 100%;
height: auto;
}


#about .our-team .team-member .member-img .overlay {
top: 0;
left: 0;
position: absolute;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.6);
opacity: 0;
visibility: hidden;
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-ms-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}


#about .our-team .team-member .member-img .overlay .social {
position: absolute;
top: 0;
left: 0;
}


#about .our-team .team-member .member-img .overlay .social li {
display: inline-block;
float: left;
margin-right: 1px;
}


#about .our-team .team-member .member-img .overlay .social li a {
display: block;
color: white;
background-color: rgba(255, 255, 255, 0.2);
width: 40px;
height: 40px;
text-align: center;
line-height: 40px;
}


#about .our-team .team-member .member-img .overlay .social li a:hover {
background-color: rgba(255, 255, 255, 0.4);
}


#about .our-team .team-member .member-img:hover .overlay {
opacity: 1;
visibility: visible;
}


#about .our-team .team-member .inner-content {
background: whitesmoke;
border: 1px solid #d6d6d6;
border-top: 0;
padding: 20px;
}


#about .our-team .team-member .inner-content h5 {
font-size: 18px;
font-weight: 600;
color: #e3722e;
margin-bottom: 10px;
}


#about .our-team .team-member .inner-content span {
color: #9d9d9d;
margin-bottom: 15px;
display: block;
}




/*-----for MISSION statement title-----*/

.about_Title02 {
color: #0d3774;
font-weight: bold; 
font-size: 15px;
}





/*--------------------CONTACT SECTION--------------------*/

#contact .contact-form .full-row {
width: 100%;
margin-bottom: 20px;
}


#contact .contact-form input, #contact .contact-form textarea {
outline: 0;
display: block;
border: 1px solid #cccccc;
width: 100%;
max-width: 100%;
padding: 8px 10px;
color: #777777;
}


#contact .contact-form label {
display: block;
margin-bottom: 5px;
}


#contact .contact-form input.mainBtn {
display: inline-block;
width: auto;
border: 0;
padding: 10px 15px;
color: white;
}


#contact .map-holder {
padding: 5px;
background-color: white;
border: 1px solid #d6d6d6;
}


#contact .contact-info {
margin-top: 30px;
}


#contact .contact-info span {
margin-top: 20px;
display: block;
font-size: 14px;
}


#contact .contact-info span i {
color: #e3722e;
font-size: 16px;
margin-right: 12px;
}





/*--------------------SITEMAP PAGE TEXT LINKS--------------------*/


a.sitemapMain01:link {
color: #0d3774;
text-decoration: none;
text-transform: uppercase;
font-size: 15px;
font-weight: bold;
padding: 8px 10px;
}

a.sitemapMain01:visited {
color: #0d3774;
font-weight: normal;
}


a.sitemapMain01:hover {
color: #fff;
-webkit-border-radius: 3px;
border-radius: 3px;
background: #6695cf; /*----light skyblue----*/
}


a.sitemapMain01:active {
color: #0d3774;
}




/*----Headings Only // No Link Properties----*/ 

.sitemapMainTx {
color: #0d3774;
text-decoration: none;
text-transform: uppercase;
font-size: 15px;
font-weight: bold;
margin: 15px 0 -15px 0;
cursor: default;
}




/*----Prod Category Text No Link // SITEMAP 2023----*/

.sitemapProdCategory {
color: #000;
text-decoration: underline;
text-transform: uppercase;
font-size: 13px;
font-weight: bold;
padding: 5px 10px;
line-height: 35px;
}



/*----Product Category Button----*/

a.sitemapSub01:link {
color: #000;
text-decoration: underline;
text-transform: uppercase;
font-size: 13px;
font-weight: bold;
padding: 5px 10px;
line-height: 35px;
}

a.sitemapSub01:visited {
color: #000;
font-weight: normal;
}


a.sitemapSub01:hover {
color: #fff;
text-decoration: none;
-webkit-border-radius: 3px;
border-radius: 3px;
background: #6695cf; /*----light skyblue----*/
}


a.sitemapSub01:active {
color: #000;
}




/*----2023 Specific Product Page Text Link Properties // Sitemap----*/

a.sitemapSub02:link {
color: #000;
font-size: 13px;
padding: 5px 10px;
text-decoration: underline;
}

a.sitemapSub02:visited {
color: #000;
font-weight: normal;
}


a.sitemapSub02:hover {
color: #000;
text-decoration: none;
}


a.sitemapSub02:active {
color: #000;
}




/*--------------------SLIDESHOW--------------------*/

.flexslider {
margin-top: 114px; /*-----orig value 114px-----*/
width: 100%;
max-width: 100%;
min-width: 100%;
overflow: hidden;
}



/*----------Directional Arrows Left Right----------*/

.flex-direction-nav a {
color: #444444;
width: 35px;
height: 35px;
background-color: white;

-webkit-border-radius: 3px;
border-radius: 3px;
margin: -20px 0 0 0;
text-align: center;
line-height: 35px;
}




/*-----BUTTON used for view location map after address update 2023-----*/


a.buttn:link {
color: #fff;
text-decoration: none;
text-transform: uppercase;
font-size: 13px;

padding: 8px 15px;

background: #ff9900; /*----orange----*/
}

a.buttn:visited {
color: #fff;
font-weight: normal;
}


a.buttn:hover {
color: #fff;
background: #6695cf; /*----light skyblue----*/
}


a.buttn:active {
color: #fff;
}




/*----------TEXT CAPTION Properties for slideshow images / unused----------*/


.flex-caption {
position: absolute;
top: 39%;
width: 100%;
text-align: center;
z-index: 999;
color: white;
}


.flex-caption h2 {
font-size: 50px;
text-transform: uppercase;
font-weight: 700;
color: white;
margin-bottom: 45px;
}


.flex-caption p {
font-size: 18px;
font-family: 'Droid Serif', serif;
line-height: 28px;
}


.flex-caption span {
background: url(../images/slider-dec.png) no-repeat;
width: 60px;
height: 9px;
display: block;
margin: 30px auto;
}





/*------------------FOOTER SECTION------------------*/


.site-footer {
margin-top: 0; /*-----orig value 100px-----*/
color: white;
padding: 25px 0;
background: #e3722e;
}


.site-footer p {
margin-top: 10px;
}


.site-footer a {
color: white;
text-align: center;
display: block;
}


.site-footer .go-top {
float: right;
text-transform: uppercase;
}


.site-footer .go-top i {
display: block;
}




/********************************IPAD LANDSCAPE (1024x768)********************************/

/********************************IPAD PORTRAIT (768x1024)********************************/


@media only screen and (max-width: 960px) {

.main-header {
padding: 15px 0; 
}


.main-header .logo {
margin-top: 5px; /*----original value 20px----*/
}


/*----Dustech Logo properties----*/

.dtLogo {
width: 220px;
height: auto;
margin: 15px 0 0 0; /*----modify values in tandem with responsive menu properties for aligning in main header----*/
}




/*----responsive menu properties added not in original----*/

.responsive-menu {
position: relative;
top: -29px; /*----value determines distance of menu boxes from main header----*/
}



.service-item, .team-member {
margin-bottom: 50px;
}


.our-skills {
margin-top: 60px;
}


.flex-caption {
top: 20%;
}


.flex-caption h2 {
font-size: 24px;
margin-bottom: 20px;
}


.flex-caption p {
font-size: 14px;
width: 70%;
margin: 0 auto;
}


.left-header, .right-header {
text-align: center;
}

}





/********************************IPHONE 4-4S-5 LANDSCAPE (568x320)********************************/

@media only screen and (max-width: 760px) {

.contact-form {
margin-bottom: 60px;
}


.main-header {
padding: 15px 0 5px 0;
}


.main-header .logo {
margin: 10px 0 0 0;
}



.flexslider {
margin-top: 132px; /*-----orig value 60px-----*/
}


.flex-caption {
display: none !important;
}


.responsive-menu {
position: relative;
top: -39px;
}


#portfolio {
padding: 90px 0 0 0;
}


.title-section span { /*-----underline below section title-----*/
display: block;
width: 40%;
height: 4px;
background: #f6ba00;
margin: 0 auto;
}


}



/********************************IPHONE 4-4S-5 PORTRAIT (320x568)********************************/






/*-----BORDER PROPERTIES // For elements that require border // 2023-----*/


.boxOutline {
border: 1px solid #ababab;
}


/*-----Arrow Cursor / Text Properties for Current Page Text Link on Right Hand Side of Header-----*/

.arrCursor {
color: #000;
cursor: default;
font-weight: bold;
text-transform: uppercase;
padding: 8px 10px;
}