/*
Theme Name: Firstcom Solutions
Author: Firstcom Solutions
Author URI: http://firstcom.com.sg/
Version: 1.0
*/
* {
  outline: none !important; }

body {
  background-color: #fff;
  font-family: 'PT Sans', sans-serif; }

html, body {
  max-width: 100%;
  overflow-x: hidden; }

/*Addational Custom CSS*/
#logo .img-responsive, .home-summary-item-image .img-responsive, .products-item .img-responsive {
  /* align image to center (by default will float to left)  */
  margin: 0 auto; }

.fa {
  font-size: 20px; }

/* Main Menu */
#main-list {
  height: 50px;
  /* set to the height you want your menu to be */
  margin: 20px 0 10px 50px;
  /* just to give some spacing */
  font-weight: 700;
  display: block; }

#main-list ul {
  margin: 0;
  padding: 0;
  /* only needed if you have not done a CSS reset */ }

#main-list li {
  display: block;
  float: left;
  line-height: 30px;
  /* this should be the same as your #main-list height */
  height: 30px;
  /* this should be the same as your #main-list height */
  margin: 0;
  padding: 0;
  /* only needed if you don't have a reset */
  position: relative;
  /* this is needed in order to position sub menus */ }

#main-list li a {
  display: block;
  height: 30px;
  line-height: 30px;
  padding: 0 15px;
  color: #000;
  text-decoration: none; }

/*#main-list .current-menu-item a, #main-list .current_page_item a, #main-list a:hover { */
#main-list a:hover {
  color: #fff;
  background: #0066ff; }

#main-list ul ul {
  /* this targets all sub menus */
  display: none;
  /* hide all sub menus from view */
  position: absolute;
  top: 100%;
  /*sets the top edge of the element above/below top edge of nearest ancestor*/
  left: 50%;
  transform: translateX(-50%);
  z-index: 99; }

#main-list ul ul li {
  /* this targets all submenu items */
  float: none;
  /* overwriting our float up above */
  width: 200px;
  /* set to the width you want your sub menus to be. This needs to match the value we set below */
  z-index: 99;
  background-color: #fff;
  text-align: center;
  border-bottom: 1px solid #F4F4F4; }

#main-list ul ul li a {
  /* target all sub menu item links */
  /* padding: 5px 10px; */
  /* give our sub menu links a nice button feel */
  text-decoration: none; }

#main-list ul li:hover > ul {
  display: block;
  /* show sub menus when hovering over a parent */ }

#toggle {
  display: none; }

@media screen and (max-width: 768px) {
  #toggle {
    display: block; }

  #main-list {
    display: none; }

  #main-list li {
    width: 100%;
    text-align: center; }

  #main-list ul li:hover > ul {
    display: none; } }
.slider {
  display: inline-block; }

.home-slider-title {
  font-family: 'Oswald', sans-serif;
  font-size: 30pt;
  line-height: 40px;
  text-transform: uppercase; }

.home-slider-content {
  font-size: 15pt; }

.home-slider-link {
  background-color: #FFFFFF;
  color: #0066ff;
  padding: 20px 25px;
  font-size: 13pt;
  font-weight: 700;
  text-transform: uppercase; }

.home-slider-link:hover {
  text-decoration: none; }

@media (max-width: 700px) {
  .home-slider-title {
    font-size: 18pt;
    line-height: 24px; }

  .home-slider-content {
    font-size: 13pt; }

  .home-slider-link {
    padding: 12px 17px;
    font-size: 14pt; } }
#home-summary {
  margin: 30px 20px;
  display: inline-table;
  min-height: 482px; }

#home-summary .row {
  display: none; }

.home-summary-item-image {
  text-align: center !important; }

.home-summary-item-title {
  font-size: 20pt;
  font-weight: 700;
  text-align: center; }

.home-summary-item-text {
  text-align: center; }

#home-enquiry-bar {
  width: 100%; }

#enquiry-form-banner {
  text-align: center; }

#home-enquiry-bar-image {
  height: 100px;
  padding-top: 30px; }

#enquiry-form-label {
  font-family: 'PT Sans', sans-serif;
  font-size: 22pt;
  color: #FFF;
  text-transform: uppercase;
  margin-right: 20px; }

#enquiry-form-toggle {
  background-color: #FFF;
  border-radius: 30px;
  width: 30px;
  height: 30px;
  padding-top: 5px;
  text-align: center;
  display: inline-block; }

#home-contact-enquiry-div {
  display: none;
  margin-top: 20px; }

.home-enquiry-bar-title {
  text-transform: uppercase;
  font-size: 16pt;
  font-weight: 700;
  margin-bottom: 10px; }

.home-enquiry-bar-content {
  width: 100%; }

.home-enquiry-bar-col1 {
  display: inline-block;
  width: 10%;
  vertical-align: top;
  margin-bottom: 10px; }

.home-enquiry-bar-col2 {
  display: inline-block;
  width: 90%;
  vertical-align: top;
  margin-bottom: 10px; }

#about-banner-image {
  /*height: 195px;*/ }
  #about-banner-image img {
    min-height: 120px; }

#about-banner-sub-menu {
  height: 70px; }

.sub-menu-bar {
  text-align: center !important; }

#sub-menu-list {
  height: 40px;
  /* set to the height you want your menu to be */
  margin: 20px 0 10px 0;
  /* just to give some spacing */
  text-align: center; }

#sub-menu-list ul {
  margin: 0;
  padding: 0;
  /* only needed if you have not done a CSS reset */ }

#sub-menu-list li {
  display: inline-block;
  /*float: left;*/
  line-height: 30px;
  /* this should be the same as your #main-list height */
  height: 30px;
  /* this should be the same as your #main-list height */
  margin: 0;
  padding: 0;
  /* only needed if you don't have a reset */
  position: relative;
  /* this is needed in order to position sub menus */ }

#sub-menu-list li a {
  display: block;
  height: 30px;
  line-height: 30px;
  padding: 0 15px;
  color: #000;
  text-decoration: none; }

#sub-menu-list a:hover, #sub-menu-list .current-menu-item a {
  font-weight: 700;
  color: #0066ff;
  padding-bottom: 50px;
  border-bottom: 2px solid #0066ff; }

#sub-menu-list ul ul {
  /* this targets all sub menus */
  display: none;
  /* hide all sub menus from view */
  position: absolute;
  top: 30px;
  /* this should be the same height as the top level menu -- height + padding + borders */ }

#sub-menu-list ul ul li {
  /* this targets all submenu items */
  float: none;
  /* overwriting our float up above */
  width: 200px;
  /* set to the width you want your sub menus to be. This needs to match the value we set below */
  z-index: 99;
  background-color: #fff;
  text-align: center;
  border-bottom: 1px solid #F4F4F4; }

#sub-menu-list ul ul li a {
  /* target all sub menu item links */
  /* padding: 5px 10px; */
  /* give our sub menu links a nice button feel */
  text-decoration: none; }

#sub-menu-list ul li:hover > ul {
  display: block;
  /* show sub menus when hovering over a parent */ }

#toggle-sub-menu {
  display: none; }

@media screen and (max-width: 768px) {
  #toggle-sub-menu {
    display: block; }

  #sub-menu-list {
    display: none;
    margin: 10px 0; }

  #sub-menu-list .menu-list {
    z-index: 999999;
    height: 200px;
    position: relative;
    background-color: #fff;
    border: 1px solid #d4d4d4;
    -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.15);
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.15); }

  #sub-menu-list li {
    width: 100%;
    text-align: center; }

  #sub-menu-list ul li:hover > ul {
    display: none; }

  #sub-menu-list a:hover, #sub-menu-list .current-menu-item a {
    color: #0066ff;
    border-bottom: 0; } }
.content1 {
  margin: 30px 0; }

.content2 {
  padding: 10px 0;
  color: #FFF; }

#company-profile-image {
  height: auto; }

#quality-wsh-image {
  height: auto; }

.content2-1 {
  display: inline-block;
  width: 50%;
  vertical-align: top;
  padding: 10px; }

.content2-2 {
  text-align: center;
  display: inline-block;
  width: 49%;
  vertical-align: top;
  padding: 10px; }

.content3 {
  margin: 30px 0; }

.content4 {
  padding: 10px 0;
  color: #FFF; }

.content4-title {
  font-size: 16pt;
  text-transform: uppercase; }

.content4-1-1 {
  display: inline-block;
  width: 50%;
  vertical-align: top;
  padding: 10px; }

.content4-1-2 {
  display: inline-block;
  width: 49%;
  vertical-align: top;
  padding: 10px; }

.quality-policy-quote {
  font-style: italic;
  font-size: 14pt; }

.content4-2-1 {
  display: inline-block;
  width: 50%;
  vertical-align: top;
  padding: 10px; }

.content4-2-2 {
  display: inline-block;
  width: 49%;
  vertical-align: top;
  padding: 10px; }

.content-title {
  font-family: 'Cardo', serif;
  font-size: 14pt;
  text-transform: uppercase;
  text-align: center;
  margin-bottom: 20px; }

.content-col1 {
  display: inline-block;
  width: 50%;
  vertical-align: top;
  padding: 10px; }

.content-col2 {
  display: inline-block;
  width: 49%;
  vertical-align: top;
  padding: 10px; }

.content-col-center {
  text-align: center; }

/****** Milestones ******/
.milestones-title {
  font-family: 'Cardo', serif;
  font-size: 14pt;
  text-transform: uppercase;
  text-align: center;
  margin-bottom: 20px; }

/** timeline box structure **/
.timeline {
  list-style: none;
  padding: 0 20px 0 20px;
  position: relative; }

.timeline:before {
  top: 0;
  bottom: 0;
  position: absolute;
  content: " ";
  width: 3px;
  background-color: #eee;
  left: 50%;
  margin-left: -1.5px; }

.timeline li {
  margin-bottom: 25px;
  position: relative; }

.timeline li:before, .timeline li:after {
  content: " ";
  display: table; }

.timeline li:after {
  clear: both; }

.timeline li:before, .timeline li:after {
  content: " ";
  display: table; }

/** timeline panels **/
.timeline li .timeline-panel {
  width: 48%;
  float: left;
  background: #f2f2f2;
  border: 1px solid #d4d4d4;
  padding: 10px;
  position: relative;
  -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.15);
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.15); }

.timeline li .timeline-panel.noarrow:before, .timeline li .timeline-panel.noarrow:after {
  top: 0;
  right: 0;
  display: none;
  border: 0; }

.timeline li.timeline-inverted .timeline-panel {
  float: right; }

.timeline li.timeline-inverted .timeline-panel:before {
  border-left-width: 0;
  border-right-width: 15px;
  left: -15px;
  right: auto; }

.timeline li.timeline-inverted .timeline-panel:after {
  border-left-width: 0;
  border-right-width: 14px;
  left: -14px;
  right: auto; }

/** timeline circle icons **/
.timeline li .tl-circ {
  position: absolute;
  left: 50%;
  text-align: center;
  background: #0066ff;
  width: 15px;
  height: 15px;
  line-height: 15px;
  margin-left: -7px;
  border-top-right-radius: 50%;
  border-top-left-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 50%;
  z-index: 99999; }

/** timeline content **/
.tl-heading {
  color: #0066ff;
  font-weight: 700; }

.tl-body p, .tl-body ul {
  color: #8f8f8f;
  margin-bottom: 0; }

.tl-body > p + p {
  /*margin-top: 5px;*/ }

/** media queries **/
@media (max-width: 991px) {
  .timeline li .timeline-panel {
    width: 46%; } }
@media (max-width: 700px) {
  .page-header h1 {
    font-size: 1.8em; }

  ul.timeline:before {
    left: 40px; }

  ul.timeline li .timeline-panel {
    width: calc(100% - 50px);
    width: -moz-calc(100% - 50px);
    width: -webkit-calc(100% - 50px); }

  ul.timeline li .tl-circ {
    left: 22px;
    margin-left: -8px; }

  ul.timeline > li > .timeline-panel {
    float: right; }

  ul.timeline > li > .timeline-panel:before {
    border-left-width: 0;
    border-right-width: 15px;
    left: -15px;
    right: auto; }

  ul.timeline > li > .timeline-panel:after {
    border-left-width: 0;
    border-right-width: 14px;
    left: -14px;
    right: auto; } }
/************/
#certifications {
  /*height: 400px;*/ }

.lSAction > a {
  background-image: none !important; }

.lSAction > .lSNext, .lSAction > .lSPrev {
  color: #000; }

.lSAction > .lSPrev {
  left: 0px; }

.lSGallery {
  display: none !important; }

.certifications-title {
  font-family: 'Cardo', serif;
  font-size: 14pt;
  text-transform: uppercase;
  text-align: center; }

.certifications-small-title {
  font-size: 10pt;
  font-style: italic;
  text-align: center;
  margin-bottom: 20px; }

.certifications-content {
  /*z-index: 9999 !important;*/ }

.our-clients-content-title {
  font-family: 'Cardo', serif;
  font-size: 14pt;
  text-transform: uppercase;
  text-align: center;
  margin-bottom: 20px;
  padding: 10px; }

.our-clients-content-col {
  font-size: 11pt;
  text-transform: uppercase;
  text-align: center;
  vertical-align: top;
  padding: 6px; }

.manufacuting-content-title {
  font-family: 'Cardo', serif;
  font-size: 16pt;
  text-transform: uppercase;
  text-align: center;
  margin-bottom: 20px;
  padding-top: 30px; }

.manufacuting-content-img {
  width: 100%; }

.manufacturing-enquiry-now-bar {
  border: 1px solid #f3f4f4;
  background-color: #f3f3f3;
  color: #8f8f8f;
  margin-bottom: 10px;
  padding-top: 20px;
  padding-bottom: 10px;
  /*height: 60px;*/ }

.manufacturing-enquiry-now-bar .row {
  margin-left: 0 !important;
  margin-right: 0 !important; }

@media (max-width: 700px) {
  .manufacturing-enquiry-now-bar {
    /*height: 80px;*/
    padding-bottom: 20px; } }
.contact-us-content-title {
  font-family: 'Cardo', serif;
  font-size: 16pt;
  text-transform: uppercase;
  text-align: center;
  margin-bottom: 20px;
  padding-top: 30px; }

/****** Products ******/
.products-item-img img {
  height: 209px;
  width: 184px; }

.products-item-name {
  text-align: center;
  padding: 5px;
  font-weight: 700; }

.products-item-content-title {
  font-size: 14pt;
  font-weight: 900;
  color: #0066ff; }

.item-link-area {
  padding-top: 20px; }

.item-enquiry-now-link, .item-download-pdf-link {
  width: 100%;
  height: 50px;
  text-transform: uppercase;
  color: #FFFFFF;
  font-size: 10pt;
  font-weight: 700;
  padding: 10px;
  background-color: #0066ff; }

.item-enquiry-now-link:hover, .item-download-pdf-link:hover {
  text-decoration: none; }

.back-link-area-1 a, .back-link-area-2 a {
  color: #000000;
  text-decoration: none; }

.back-link-area-1 a:hover, .back-link-area-2 a:hover {
  color: #0066ff; }

.item-img {
  margin-top: 50px; }

/**********************/
/********************************************/
/*remove list style (circles)*/
.news-events-browse-menu {
  list-style: none;
  margin-top: 20px;
  padding-left: 0;
  /*header line style and border*/
  /*set border for every line of menu nad remove top border becouse we dont want double border with header border. */
  /*remove decoration from text links and treat it as a block.*/
  /*we dont want text to be underline as regular link*/
  /*li a:hover {
    background: #F8F8F8;
    text-decoration: none;
  }*/
  /*remove list style (circles) for submenu*/
  /*remove border and set only bottom border for submenu*/
  /*remove bottom border from last element in submenu*/
  /*set padding for submenu to be inline with maimenu*/
  /*remove text decoration for links*/
  /*for menu witch have a submenu display some icom*/
  /*.dropdown > a {
    background: url(/images/arrowdown.png) no-repeat right center;
  }*/
  /*set some hover color on drop down menu*/
  /*.dropdown > a:hover {
    background: #F8F8F8 url(/images/arrowdown.png) no-repeat right center !important;
  }*/ }
  .news-events-browse-menu li.header {
    color: #666;
    padding: 4px 12px;
    border: 1px solid #bbb; }
  .news-events-browse-menu li {
    /*border: 1px solid #bbb;*/
    border-top: 0;
    margin: 0;
    /*background: #F0F0F0;*/ }
  .news-events-browse-menu li a {
    text-decoration: none;
    color: #000000;
    display: inline-block;
    padding: 8px 12px;
    width: 90%; }
  .news-events-browse-menu li ul {
    list-style: none;
    /*background: #d3d3d3;*/
    display: none;
    margin: 0;
    padding: 0; }
  .news-events-browse-menu li ul li {
    margin: 0;
    border: 0;
    /*border-bottom: 1px solid #bbb;*/ }
  .news-events-browse-menu li ul li:last-child {
    border-bottom: 0; }
  .news-events-browse-menu li ul li a {
    padding: 5px 10px;
    display: block;
    color: #bbb;
    font-weight: 700;
    /*background: #d3d3d3;*/ }
  .news-events-browse-menu li ul li a:hover {
    text-decoration: none;
    color: #0066ff;
    /*  background: #d9d9d9; */ }

/********************************************/
.new-events-toggle-bar {
  font-weight: 700; }

.new-events-toggle {
  font-size: 14pt;
  font-weight: 700;
  color: #666;
  display: inline-block;
  float: right;
  cursor: pointer;
  width: 10%; }

.news-events-title {
  font-family: 'Cardo', serif;
  font-size: 14pt;
  text-transform: uppercase;
  margin: 30px 0; }

.news-events-content-title {
  font-size: 14pt;
  font-weight: 900;
  margin-bottom: 20px; }

.news-events-item {
  margin-bottom: 30px; }

.news-events-date, .news-events-small-date {
  display: inline-block;
  width: 15%;
  height: 150px;
  padding: 20px;
  background-color: #0066ff;
  color: #FFF;
  text-align: center;
  -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.15);
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.15);
  padding-top: 50px;
  font-weight: 700; }

.news-events-date-day, .news-events-date-small-day {
  font-size: 16pt; }

.news-events-small-date {
  padding: 5px !important;
  width: 80% !important;
  height: 80px !important;
  margin-top: 25px; }

.news-events-short-content {
  display: inline-block;
  width: 84%;
  height: 150px;
  vertical-align: top;
  padding: 20px;
  -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.15);
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.15); }

.news-events-short-content-link {
  text-transform: uppercase;
  color: #0066ff;
  font-weight: 700; }

.news-events-short-content-link a {
  text-decoration: none; }

@media (max-width: 600px) {
  .news-events-date {
    height: 100px;
    width: 100%;
    padding-top: 20px; }

  .news-events-short-content {
    height: 180px;
    width: 100%; } }
@media (max-width: 430px) {
  .news-events-date {
    height: 100px;
    width: 100%;
    padding-top: 20px; }

  .news-events-short-content {
    height: 300px;
    width: 100%; } }
.overhaul-top-content, .overhaul-below-content {
  /*padding: 20px;*/ }

.overhaul-top-content .col-md-6 {
  padding-bottom: 10px; }

#marine {
  display: none; }

#industrial {
  display: none; }

#company-profile {
  display: none; }

#quality-wsh {
  display: none; }

#milestones {
  display: none;
  margin: 30px 0; }

#projects {
  display: none;
  margin: 30px 0; }

.projects-title {
  font-family: 'Cardo', serif;
  font-size: 14pt;
  text-transform: uppercase;
  text-align: center;
  margin-bottom: 20px; }

/*
.projects-small-title{
  font-size: 8pt;
  font-weight: 400;
}
*/
.projects-content {
  display: inline-block;
  text-align: center;
  margin-top: 10px; }

.projects-left-content {
  padding: 5px 10px;
  background-color: #cccccc;
  width: 40%; }

.projects-right-content {
  padding: 5px 10px;
  background-color: #f3f3f3;
  width: 60%;
  text-align: left; }

.marine-content-2-title {
  text-transform: uppercase;
  border-bottom: 1px solid #cccccc;
  padding: 5px 0; }

.marine-content-2-content {
  /*text-transform: uppercase;*/
  color: #7d7c7c;
  padding: 5px 0;
  display: none; }

.marine-content-2-title-arrow {
  float: right;
  cursor: pointer; }

#certifications {
  display: none;
  margin: 30px 0; }

#cert-images .item{
  cursor: pointer;	
}

/*
@media (min-width: 768px) {
  #cert-images .item{
    width: 0px !important;
    margin-right: 187.5px !important;
  }
}

@media (min-width: 992px) {
  #cert-images .item{
    width: 0px !important;
    margin-right: 242.5px !important;
  }
}

@media (min-width: 1200px) {
  #cert-images .item{
    width: 0px !important;
    margin-right: 292.5px !important;
  }
}
*/
/*
#cert-images .item{
  width: 0px !important;
  margin-right: 292.5px !important;
}
*/
#our-clients {
  display: none;
  margin: 30px 0; }

.pagination-links .page-numbers {
  font-weight: 700; }

.pagination-links a.page-numbers {
  color: #000000; }

.pagination-links a.page-numbers:hover {
  color: #0066ff; }

.pagination-links .current {
  color: #0066ff; }

.back-link {
  text-transform: uppercase;
  font-weight: 700;
  color: #0066ff; }

input[type="text"], input[type="tel"], input[type='email'] {
  width: 100%;
  padding: 15px 15px;
  border: 1px solid #DDD; }

input {
  margin-top: 15px; }

textarea {
  width: 100%;
  padding: 15px;
  border: 1px solid #DDD;
  resize: none; 
  margin-top: 15px; }

.btn {
  background-color: #000;
  color: #FFF;
  border-radius: 0px;
  padding: 10px 40px;
  margin-top: 20px; }

.blue-btn {
  background-color: #0066ff !important;
  font-weight: 700; }

.col1 {
  display: inline-block;
  width: 50%;
  vertical-align: top; }

.col2 {
  display: inline-block;
  width: 49%;
  vertical-align: top; }

@media (max-width: 555px) {
  .col1, .col2 {
    display: inline-block;
    width: 100%;
    vertical-align: top; } }
/* Header */
header {
  /*padding: 15px 0px;
  border-bottom: 1px solid #333;
  margin-bottom: 15px;*/ }

/* Footer * Copyright */
footer {
  /*
  background-color: #a8a8a8;
  padding: 20px 0;
  */
  /*height: 70px;*/
  padding: 10px 0;
  margin-top: 20px; }

#footer-banner {
  display: inline-table;
  width: 100%; }

#footer-bizsafe {
  display: inline-block;
  vertical-align: middle;
  width: 60%; }

.copyright {
  text-align: center;
  font-size: 12px;
  display: inline-block;
  vertical-align: middle;
  text-align: right;
  width: 40%; }

@media (max-width: 768px) {
  #footer-bizsafe {
    vertical-align: top; }

  .copyright {
    vertical-align: top; } }
.contact iframe {
  width: 100%;
  height: 300px;
  line-height: 0; }

/*# sourceMappingURL=style.css.map */
/*# sourceMappingURL=style.css.map */

/*# sourceMappingURL=style.css.map */