/*MAIN*/

body {font-family: 'Open Sans', "微软雅黑", STXihei, sans-serif; font-size: 13px; color: #000; line-height: 21px;} /* Changes the main body texts. */

#header {padding: 20px 0 40px; background: rgba(38,43,60,0.8); z-index: 99; position: relative;}

p:empty {display: none}

#container {}

.left {width: 15%; display: inline-block; margin-top: 20px; vertical-align: top;}

.right {float: right; text-align: right; width: 85%;}

.alignleft {float: left; margin-right: 15px;}

.alignright {float: right; margin-left: 15px;}

.aligncenter {text-align: center;}

.content {width: 100%; max-width: 1170px; margin: auto;}

.content p {margin-bottom:10px;}

.slider {margin-top: 0px;}

.cta {color: #fff; display: none; font-size: 19px; font-family: 'Oswald', sans-serif;}

.cta i {font-size: 21px; display: inline-flex; vertical-align: middle; color: #43a0ff;}

.cta strong {font-weight: normal; color: #fff;}

a,span {text-decoration-color: -moz-use-text-color; text-decoration-line: none; text-decoration-style: solid; transition-delay: 0s; transition-duration: 0.3s; transition-property: all; transition-timing-function: ease; color: #095da6;}

a:hover {color: #f15000; text-decoration: none;}

h1,h2,h3 {font-family: 'Oswald', sans-serif; font-weight: 700; color: #2698c4;}

h1 {font-weight: 300; letter-spacing: 0.2em; font-size: 40px; margin: 50px auto; color: #363c50;}

h2 {margin: 30px 0; font-size: 30px;}

h3 {margin: 20px 0; font-size: 22px; color: #000;}

h4 {font-size: 16px; margin-bottom: 30px; height: 35px;}

a.link::before {content: "» "; display: inline-block; padding-top: 10px; font-size: 18px;}

a.btn, .wpcf7-submit, a.pdf-btn {padding: 5px 30px; background: #2698c4; color: #fff; text-transform: uppercase; border: 1px solid #2698c4; letter-spacing: 0.1em; display: inline-block;}

a.btn:hover, .wpcf7-submit:hover {background: #fff; color: #2698c4;}

a.whbtn {padding: 5px 5%; background: translate; color: #fff; text-transform: uppercase; border: 1px solid #fff; letter-spacing: 2px;}

a.whbtn:hover {background: #fff; color: #000;}

.cycloneslider-template-standard {margin-bottom: 0 !important;}

.page-title {text-align: center;}

.about {padding: 35px 45px; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,0.4);}

ul#sresult li {padding: 10px; border-bottom: 1px dotted #ccc; margin-bottom: 12px;}

ul#sresult li h3 {margin: 0; display: inline-block;}

ul#sresult li a.btn {float: right;}

.breadcrumbs {text-align: center; font-family: 'Oswald', sans-serif; font-size: 12px; letter-spacing: 0.2em;}

.breadcrumbs span { color: #43a0ff;}

fieldset {

border: 1px solid #ccc;

margin: 0 0 15px 0;

padding: 15px;

}

fieldset legend {

background: #fff;

font-weight: 400;

padding: 6px 14px;

font-size: 16px;

}



/*SEARCH*/

#searchform {display: inline-block;}

#searchform input {border: 0; padding: 4px 6px 4px 35px; color: #666; background: url("/wp-content/themes/locus-t/images/search-icon.png") 10px center no-repeat #ddd; margin: 0 10px 10px; border-radius: 25px; box-shadow: inset 1px 1px 3px rgba(0,0,0,0.5);}



/*toolsets*/

.home-content {background: url("/wp-content/uploads/2016/09/img-welcome.jpg") left no-repeat; padding: 65px 0; background-size: contain;}

.product {background: url("http://skyflow.com.my/wp-content/uploads/2017/03/banner1.jpg") center center; padding: 50px 0;}

.project {background: url("/wp-content/uploads/2016/09/bg-project.jpg") center center; padding: 50px 0;}

.enquiry {background: url("http://skyflow.com.my/wp-content/uploads/2017/03/banner2.jpg") center center; padding: 50px 0;}

.product,.project,.enquiry {background-size: cover;}

.product .content, .product h1, .project .content, .enquiry .content {color: #fff; text-align: center;}



/*blocks*/

ul[class*="-block"] li {display: inline-block; width: 19%; color: #000; text-align: center; margin: 0 0.3%; min-height: 250px; background: #fff; overflow: hidden; font-size: 13px;}

ul.product-block li h4 {padding: 0 10px;}

ul.product-block li img, ul.team-block li img {width: 100%;}

ul[class*="-block"] li a.btn {font-size: 13px; margin-top: 0;}

ul[class*="-block"] li p {padding: 0 10px;}

ul.project-block li {background: none; width: 24%;}

ul.project-block li h2, 
ul.project-block li h3 { 
    font-family: 'open sans', sans-serif !important; 
    color: #333333 !important; 
		font-size: 20px !important;
    font-weight: 450 !important;
    letter-spacing: 0.4px !important;
    text-transform: lowercase; 
    text-align: capitalize;
}

ul.team-block li {width: 24%; height: 580px;}

ul.team-block li small {font-size: 12px; color: #319be5;}

ul.system-block {margin: 30px auto;}

ul.system-block li {width: 44%; margin: 0; float: left; background-size: cover; padding: 30px 3% 15px; color: #fff; text-align: left; min-height: auto;}

ul.system-block li p {padding:0;}

ul.system-block li h3 {color: #fff; margin-bottom: 20px;}

a.pdf-btn {background: url("/wp-content/uploads/2016/09/ico-pdf.png") no-repeat 10px #2698c4; padding: 12px 30px 12px 50px;}

a.pdf-btn:hover {color: #000;}

ul.system-block li img {border: 1px solid #fff;}

ul.system-block li.even {background-image: url("/wp-content/uploads/2016/09/bg-even.jpg");}

ul.system-block li.odd {background-image: url("/wp-content/uploads/2016/09/bg-odd.jpg");}



/*MENU*/

.menuhead {display: inline-block; margin-top: 40px;}

.menu-header {width: auto; display: inline-block;}

#menu-primary {margin: 0 auto; display: inline-block;}

#menu-primary li a {
    padding: 30px 10px 18px;      /* Increased side padding from 18px to 30px */
    float: left; 
    font-size: 13px; 
    color: #fff; 
    font-weight: 400; 
    font-family: 'Oswald', sans-serif; 
    width: auto;               /* Changed from 80px to auto so text isn't cramped */
    min-width: 100px;          /* Optional: ensures all buttons have a minimum size */
    text-align: center; 
    letter-spacing: 1.5px;     /* Slightly increased spacing between letters */
    line-height: 12px;
}

#menu-primary li a:hover, #menu-primary li.current_page_item a, #menu-primary li.current-menu-item a, #menu-primary li.current-menu-ancestor a, #menu-primary li.menu-children-item-showing a {color: #43a0ff;}

#menu-primary li:last-child {background: none;}

#menu-primary li:last-child a {padding-right: 0}

#menu-primary ul.sub-menu {top: 32px; background: transparent; margin-left: 0; padding-top: 8px;}

#menu-primary ul.sub-menu li {}

#menu-primary ul.sub-menu li a {display: block; background-color: rgba(0,0,0,0.8); width: 200px; background-position: left center; color: #fff; padding: 10px; text-align: left;}

#menu-primary ul.sub-menu li a:hover, #menu-primary ul.sub-menu li.current-menu-item a {display: block; background: url("/wp-content/uploads/2016/05/li-arrow.png") no-repeat 15px center #175fa4;}

#menu-primary ul.sub-menu li:after {content: none}



/*SIDEBAR + SIDE CONTENT*/

.sidebar {float: left; width: 22%; margin: 0 auto; margin-top: 20px; letter-spacing: 3px;}

.sidebar h2.widget-title {background: #ff6600; padding: 15px 20px; color: #fff; margin-bottom: 0; border-bottom: 1px solid #fff; text-transform: uppercase;}

.menu-products-container {background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,0.4);}

.sidebar .menu li a {padding: 15px 20px; border-bottom: 1px solid #ddd; display: block; font-size: 15px; color: #414042; font-family: 'Oswald', sans-serif; background: #fff;}

.sidebar .menu li a:hover, .sidebar .menu .current-menu-item a {background: #095da6; color: #fff;}

.side-content {float: right; width: 76%; margin-top: 20px; font-size: 13px; line-height: 24px;}



/*Contact Form*/

.wpcf7-text, .wpcf7-quiz, .wpcf7-textarea { font-family: 'Open Sans', serif; background: #fff; font-size: 13px; border: none; }

.wpcf7-text, .wpcf7-quiz {padding: 8px; width: 26%; margin: 3px;}

.wpcf7-textarea {padding: 8px; margin: 3px; width: 82.4%;}

fieldset [class*="wpcf7-text"] {border: 1px solid #ccc; width: 94%;}



/*FOOTER*/

#footer {padding: 25px 0; width: 100%; background: #2a2a2a;}

#footer .content {max-width: 960px;}

#footer .widget-container a {color: #fff;}

#footer .widget-container {float: left; padding: 0 3.5%; width: 26%; color: #fff;}

#footer h2 {font-size: 15px; color: #fff; border-bottom: 1px solid #fff; font-family: 'Open Sans'; margin: 10px auto; padding-bottom: 10px;}

#footer .menu li {display: block; float: none;}

#footer .menu li a {color: #fff; font-size: 13px; text-transform: capitalize;}

.copyright {text-align: center; font-size: 12px; padding: 20px 0;}

#footer a .fa {margin-right: 10px; text-align: center; background: #fff; color: #2a2a2a; padding: 3%; border-radius: 50%; width: 10px; height: 10px;}

#footer a:hover .fa {background: #43a0ff;}

/* Change Radius Portfolio Red Hover to Grey */

.rt-portfolio-container .rt-holder .rt-overlay {

    background-color: rgba(82, 85, 98, 0.9) !important;

}



/* Ensure the icon/text on top stays white */

.rt-portfolio-container .rt-holder .rt-overlay .rt-icon-group a, 

.rt-portfolio-container .rt-holder .rt-overlay h3 a {

    color: #ffffff !important;

}
/* 1. Hide the original 'Project Url' text */
.rt-portfolio-info-label.url-label, 
.rt-portfolio-info-label.project_url-label {
    visibility: hidden;
    position: relative;
    white-space: nowrap;
}

/* 2. Inject the new label */
.rt-portfolio-info-label.url-label::after, 
.rt-portfolio-info-label.project_url-label::after {
    content: "Total Siphonic Drainage Area:";
    visibility: visible;
    position: absolute;
    left: 0;
    top: 0;
    font-weight: inherit; /* Keeps it matching your other labels */
}
/* Example code to move the metadata container */
.rt-portfolio-single-meta {
    order: -1 !important;
}

.rt-portfolio-details {
    display: flex;
    flex-direction: column;
}