body {
  margin: 0px;
}

* {
  font-family: Calibri, Verdana, Garamond, Arial; 
  color: #333; 
  font-size: 10pt;
}

a {
  text-decoration: none;
}

a.inlineLink {
  color: #a00; 
  font-weight: bold; 
  font-size: 12pt;
}

h1 {
  font-weight: bold; 
  height: 25px; 
  line-height: 25px; 
  font-size: 18pt; 
}

h2 {
  height: 25px; 
  line-height: 25px; 
  font-size: 14pt; 
  color: #333; 
}
            
            li {margin-left: -15px;}

            .bullets li {font-size: 12pt;}

            .outer-wrapper{
                width:100%; min-width: 960px;
                
            }                        
            .wrapper{
                width:950px;
                margin:0 auto; 
                box-sizing: border-box;               
            }   
            
            


.logoDiv {
    background-image: url('../img/logo.png'); 
    background-size: auto 60px; 
    background-repeat: no-repeat; 
    height: 100px; 
    background-position-y: center; 
    float: left; 
    width: 33%;
    box-sizing: border-box;
  }
            
.telDiv {
  height: 100px; 
  line-height: 100px; 
  float: right; 
  width: 67%; 
  text-align: right;
  box-sizing: border-box;
  }

  .telDiv div {
    width: 30%;
    height: 100px;
    line-height: 100px;
    float: right;
    text-align: right;
  }

  .topRowBtn {
    width: 80%;
    color: #fff;
    font-size: 12pt;
    height: 30px;
    line-height: 30px;
    border-radius: 4px;
  }

  .btnOne {
    background: #94256d;
    border: 1px solid #94256d;
  }
            
  .btnTwo {
    background: #e9ba7b;
    border: 1px solid #e9ba7b;
  }
            
  .btnThree {
    background: #a8d198;
    border: 1px solid #a8d198;
    font-weight: bold;
  }
            
.emailDiv {/*background-image: url('../img/emailIcon1.png');*/ background-size: auto 60px; background-repeat: no-repeat; /*height: 70px; line-height: 70px;*/ 
          background-position-y: center; width: 420px; text-align: right; /*font-size: 20px;*/ color: #607d8b; margin-top: 15px;}
            
            
            .menuBar {padding-top: 5px; width: 100%;}
            .menuBar div {float: left; height: 30px; line-height: 30px; text-align: center;}
            .topMenu {background: #94256d;}
            .topMenuSelected {background: #29b1ab;}
            .menuBar div a {color: #fff; text-decoration: none; font-size: 11pt;}
            
            .menuBar div:nth-child(1) {width: calc(20% - 4px);} 
            .menuBar div:nth-child(n+2) {width: 20%; border-left: 1px solid #fff;} 
            
                
                
            
            .clearer {clear: both;}     
            .bottomShadow {box-shadow: 0 10px 6px -6px #ddd; /*box-shadow: 0px 6px 6px #ddd;*/}
            
            .indexBanner {background-image: url(../gallery/jobs.jpg); background-repeat: no-repeat; background-size: 100% auto; background-position-x: center; height: 350px;}
            .servicesBanner {background-image: url(../img/banner_domcare.jpg); background-repeat: no-repeat; background-size: 950px auto; background-position-x: center; height: 150px;}
            .aboutusBanner {background-image: url(../img/banner_supply.jpg); background-repeat: no-repeat; background-size: 950px auto; background-position-x: center; height: 150px;}
            .recruitmentBanner {background-image: url(../img/banner_staff.jpg); background-repeat: no-repeat; background-size: 950px auto; background-position-x: center; height: 150px;}
            .contactusBanner {background-image: url(../img/banner_contactus1.jpg); background-repeat: no-repeat; background-size: 950px auto; background-position-x: center; height: 150px;}
            .topRowInnerContainer {background-image: url(../img/overlay1.png); height: 100%;}
            
            .cAlign {text-align: center;}
            .lAlign {text-align: left;}
            .rAlign {text-align: right;}
            .lFloat {float: left;}
            .rFloat {float: right;}
            
            .indexHeader { height: 50px; line-height: 50px; font-size: 30pt; color: #444;}
            
            .frontBoxContainer {width: 100%;}
            .frontBoxContainerLeft {width: 650px; float: left;}
            .frontBoxContainerRight {width: 250px; float: right; height: 450px;}
            .frontBox {float: left; width: 300px;}
            .frontBoxHdr {font-size: 11pt; font-weight: bold; color: #fff; text-align: center; height: 30px; line-height: 30px;}
            .frontBoxHdrR {font-size: 13pt; font-weight: bold; color: #fff; height: 30px; line-height: 30px; text-indent: 15px;}
            .frontBoxFiller {float: left; width: 50px;}            
            .frontBox .textDiv {text-align: justify; height: 150px; padding: 15px; 
                                /*box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.19);*/}
            .frontBoxSplash {color: #29b1ab; font-size: 12pt; border: 1px solid #ccc; width: 240px; padding: 4px; font-weight: bold; text-align: center;}
            .dc {background: #d00;}
            .ch {background: #29b1ab;}
            .hr {background: #ff9800;}
            .qa {background: #3f51b5;}
            .ql {background: #607d8b;}
            
            .sideButton{background: #a00; color: #fff; border: 1px solid #a00; height: 30px; line-height: 30px; width: 100%; font-size: 14pt;}

            
            .bulletPointDiv {float: left; width: 30px; height: 20px; padding: 5px 0 0 10px; /*background-image: url('../img/red_dot.png'); background-size: 10px auto; background-position: center; background-repeat: no-repeat;*/ }
            .bulletPoint {height: 10px; width: 10px; background: #ff9800;}
            .bulletText {float: left; color: #fff; height: 20px; line-height: 20px; font-size: 10pt;}
            
            

.innerShadow {
   -moz-box-shadow:    inset 0 0 10px #000000;
   -webkit-box-shadow: inset 0 0 10px #000000;
   box-shadow:         inset 0 0 10px #000000;
}            


.grad_dc {
    background: -webkit-linear-gradient(#d00, #fee); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(red, yellow); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(red, yellow); /* For Firefox 3.6 to 15 */
    background: linear-gradient(red, white); /* Standard syntax */
}


            

            .bottom_outer {                
                padding: 10px 5px 5px 5px;
                color: #fff;
            }
            
            .ftr_outer {background: #94256d; /*border-top: 3px solid #600;*/}
           

            .wrapper_bottom {width: 100%;}       
            .bottom_div {
              vertical-align: top; 
              width: 33%; 
              color: #29b1ab; 
              padding: 3px; 
              font-size: 9pt;
              box-sizing: border-box;
            }
            .headerText {font-weight: bold; color: #fff; height: 13px; line-height: 13px;}
            .headerTextSub {font-weight: bold; color: #f88; height: 13px; line-height: 13px;}
            .ftrHeader {color: #29b1ab; height: 20px; line-height: 20px; font-size: 16px; font-weight: bold;}



.b1 {
    border-width: 0 1px 0 0;
    border-style: solid;
    -webkit-border-image: 
      -webkit-gradient(linear, 0 100%, 0 0, from(rgba(0, 0, 0, 0), to(white))) 1 100%;
    -webkit-border-image: 
      -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0), white) 1 100%;
    -moz-border-image:
      -moz-linear-gradient(bottom, rgba(0, 0, 0, 0), white) 1 100%;
    -o-border-image:
      -o-linear-gradient(bottom, rgba(0, 0, 0, 0), white) 1 100%;
    border-image:
      linear-gradient(to top, rgba(0, 0, 0, 0), white) 1 100%;
}


.social_divs_bottom {height: 40px; padding-left: 40px; line-height: 20px;}
.fb_b {background: url('../img/b_facebook.png') no-repeat; background-position: left top; background-size: auto 20px;}            
.li_b {background: url('../img/b_linkedin.png') no-repeat; background-position: left top; background-size: auto 20px;}            
.go_b {background: url('../img/b_google.png') no-repeat; background-position: left top; background-size: auto 20px;}            
.tw_b {background: url('../img/b_twitter.png') no-repeat; background-position: left top; background-size: auto 20px;} 


.links_ftr {color: #29b1ab; font-size: 10pt;}
            

.ftr, .ftr * {color: #f0f0f0; font-size: 16pt; height: 50px; line-height: 50px;}


            .tableDiv {display: table;}
            .tableCell {display: table-cell; vertical-align: top;}
            .leftSection {width: 70%;}
            .rightSection {width: 30%;}
            .fullWidth {width: 100%;}


.servicesTxt .imgdiv {/*box-shadow: 3px 3px 3px #444;*/ float: left; margin: 0; height: 100px; padding-right: 10px;}
.servicesTxt .imgdiv img {/*box-shadow: 3px 3px 3px #444;*/ height: 98px; border: 1px solid #fafafa; border-radius: 4px;}
.servicesTxt  div {font-size: 12pt; line-height: 20px;}
.servicesTxtList li {/*font-size: 12pt; line-height: 20px;*/}
            

            .staffShortCutsContainer {/*border: 2px solid #29b1ab;*/ float: right; width: 80%; padding: 5px;}
            .contactInfoBox {}
            .contactInfoBox .heading {line-height: 30px; background: #29b1ab; color: #fff; font-size: 12pt; height: 30px;  
                                      padding: 3px 0 3px 0; font-weight: bold; width: 100%; text-indent: 3px;}

            .linksPlain a {font-size: 12pt;}
            .linksPlain {color: #333; padding: 1px 2px 1px 3px; font-size: 12pt; line-height: 25px; height: 25px; }

            .links a {color: #a00;}
            .links {color: #333; padding: 1px 2px 1px 3px; font-size: 12pt; line-height: 25px; height: 25px; }
            .linksContainer {background: #fafafa; padding: 0 5px 0 5px;}
            .linksContainer div:nth-child(n+2) {border-top: 1px dotted #ccc;}
            
            
            links:hover a  {background: #a00; color: #fff; }            




        .normalShadow {box-shadow: 3px 3px 3px #444;}
        .sideShadow {box-shadow: -60px 0px 100px -90px #000000, 60px 0px 100px -90px #000000;}


            .formShort {width: 50%; height: 25px; line-height: 25px; font-size: 12pt;}
            
            .formShort input[type='text'], input[type='email'] {width: 95%; background: #fffcfc; font-size: 12pt; height: 23px;}
            .inputBorder {border: 1px solid #ccc;}                                  

            .formLong {width: 100%;}
            .formLong textarea {width: 97%; height: 200px; background: #fffcfc; font-size: 12pt;}
            
            .standardBtns {background: #a00; color: #fff; border: 1px solid #a00; padding: 5px; font-size: 11pt;}
            .downloadBtns {background: #29b1ab; color: #fff; border: 1px solid #29b1ab; padding: 5px; font-size: 11pt; min-width: 100px; text-align: center;}



.errorInputBorder {border: 1px solid #a00;}
.errorInputBorder:focus {border: 2px solid #a00; }
            
            .thankYouDiv {font-size: 12pt;}
            
            .asideSpan {font-style: italic; font-size: 9pt;}
                




.effect2
{
  position: relative;
}
.effect2:before, .effect2:after
{
  z-index: -1;
  position: absolute;
  content: "";
  bottom: 15px;
  left: 10px;
  width: 50%;
  top: 80%;
  max-width:300px;
  background: #777;
  box-shadow: 0 15px 10px #777;
  transform: rotate(-3deg);
}
.effect2:after
{
  transform: rotate(3deg);
  right: 10px;
  left: auto;
}
            
            

.circleEmpty {width: 10px; height: 10px; border: 2px solid #29b1ab; border-radius: 10px; margin: 0 auto; display: inline-block;}
.circleFull {width: 10px; height: 10px; border: 2px solid #29b1ab; border-radius: 10px; margin: 0 auto; display: inline-block; background: #29b1ab;}                   
            

#filelist {display: inline; font-size: 12pt;} 


.errorAttachment {color: #c00;}            



.overlayDiv {display: none; width: 100%; height: 100%; position: fixed; bottom: 0; background: url('../img/overlay.png'); z-index: 1000;}
.overlayDetailsDiv {width: 300px; top: 50%; margin-top: -100px; left: 50%; margin-left: -150px; background: #fff; border: 1px solid #a00; 
                    position: relative; z-index: 1100; padding: 20px;}

            .qualityHeader {color: #29b1ab; font-weight: bold; font-size: 14pt; border-bottom: 2px solid #29b1ab; height: 30px; line-height: 30px; padding-left: 5px;}
            .supplyHeader {color: #ff9800; font-weight: bold; font-size: 14pt; border-bottom: 2px solid #ff9800; height: 30px; line-height: 30px; padding-left: 5px;}
            .hrHeader {color: #607d8b; font-weight: bold; font-size: 14pt; border-bottom: 2px solid #607d8b; height: 30px; line-height: 30px; padding-left: 5px;}
            .dcHeader {color: #607d8b; font-weight: bold; font-size: 14pt; border-bottom: 2px solid #607d8b; height: 30px; line-height: 30px; padding-left: 5px;}
            
            .indexDetail {padding: 5px 5px 5px 0; font-size: 11pt;}


            .boxImg {border: 1px solid #fafafa; border-radius: 10px;}
            .boxImgDiv {border: 1px solid #fafafa; border-radius: 10px;}
            .boxImgDivMarginR {margin-right: 15px;}
            .boxImgDivMarginL {margin-left: 15px;}
            .boxTxt {background: #fafafa; border: 1px solid #fafafa; border-radius: 10px; padding: 15px; color: #888; font-size: 12pt; line-height: 22px;}
            .boxTxt ul li {color: #888; font-size: 12pt; line-height: 22px}
            




/*==================================================
 * Effect 7
 * ===============================================*/
 .effect7
 {
     position:relative;
     -webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
        -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
             box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
 }
 .effect7:before, .effect7:after
 {
     content:"";
     position:absolute;
     z-index:-1;
     -webkit-box-shadow:0 0 20px rgba(0,0,0,0.8);
     -moz-box-shadow:0 0 20px rgba(0,0,0,0.8);
     box-shadow:0 0 20px rgba(0,0,0,0.8);
     top:0;
     bottom:0;
     left:10px;
     right:10px;
     -moz-border-radius:100px / 10px;
     border-radius:100px / 10px;
 }
 .effect7:after
 {
     right:10px;
     left:auto;
     -webkit-transform:skew(8deg) rotate(3deg);
        -moz-transform:skew(8deg) rotate(3deg);
         -ms-transform:skew(8deg) rotate(3deg);
          -o-transform:skew(8deg) rotate(3deg);
             transform:skew(8deg) rotate(3deg);
 }            



 .effect1{
  -webkit-box-shadow: 0 10px 6px -6px #777;
     -moz-box-shadow: 0 10px 6px -6px #777;
          box-shadow: 0 10px 6px -6px #777;
}


.purpleFlashBox {background: #94256d; text-align: center; color: #fff; padding: 5px; border: 1px solid #94256d; border-radius: 10px; float: right; width: 90%;}
.purpleFlashBox p {color: #fff; font-size: 11pt;}
.purpleFlashBox button {color: #94256d;}

.greenFlashBox {background: #29b1ab; text-align: center; color: #fff; padding: 5px; border: 1px solid #29b1ab; border-radius: 10px; float: right; width: 90%;}
.greenFlashBox p {color: #fff; font-size: 11pt;}
.greenFlashBox button {color: #29b1ab;}

button {background: #fff; font-size: 12pt; padding: 5px; border: 1px solid #fff; border-radius: 5px; font-weight: bold;}


.purpleFlashBox ul, .greenFlashBox ul {color: #fff; text-align: left; list-style-type: square; font-size: 11pt; padding-left: 50px;}
.purpleFlashBox ul li, .greenFlashBox ul li, .purpleFlashBox ul li a, .greenFlashBox ul li a {color: #fff; font-size: 11pt; height: 23px; line-height: 23px;}
.greenFlashBox div, .purpleFlashBox div {height: 25px; line-height: 25px; border-bottom: 1px solid #fff; color: #fff !important; text-align: left !important; font-size: 14pt; text-align: left;}