/*!
 * Start Bootstrap - Full Width Pics HTML Template (http://startbootstrap.com)
 * Code licensed under the Apache License v2.0.
 * For details, see http://www.apache.org/licenses/LICENSE-2.0.
 */

@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700,300);

body {
    font-family: 'Source Sans Pro', sans-serif;
    margin-top: 0px; /* Required margin for .navbar-fixed-top. Remove if using .navbar-static-top. Change if height of navigation changes. */
}
h1{
    font-family: 'Source Sans Pro', sans-serif;
    font-weight:700;
    line-height:1.1em;
    color:#333;
    margin-bottom: 20px;
    margin-top: 0;
}
h2{
    font-family: 'Source Sans Pro', sans-serif;
    font-weight:700;
    line-height:1.1em;
    color:#333;
    margin-bottom: 20px;
    font-size: 18px;
}

a {
    color: #EE8100;
    text-decoration: none;
}

a:focus, a:hover {
    color: #CB6E00;
    text-decoration: underline;
}

blockquote {
    border-left: 5px solid #EE8100;
}

/*readmore*/
.btn-warning {
    color: #fff;
    background-color: #EE8100;
    border-color: #eea236;
}

/*no gutter space between box*/
.no-gutter > [class*='col-'] {
    padding-right:0;
    padding-left:0;
}


.image-bg-fluid-height,
.image-bg-fixed-height {
    text-align: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}

.image-banner-home {
    max-width: 1170px;
    height: 400px;
    padding: 0px;
    margin: 0px auto;
}

.image-banner-home > h2 {


}

.image-banner-sub {
    background-size: cover;
        -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
    padding: 0;
    max-width: 1170px;
    margin: 0 auto;
    height: 300px;
}
.image-banner-sub >img {
    position: relative; 
    width: 100%; /* for IE 6 */
    padding: 0;
    max-width: 1170px;
    margin: 0 auto;
}
.image-banner-sub > h2 { 
    position: relative;
    background: rgba(0, 0, 0, 0.31);
    color: white;
    font-size: 36px;
    text-transform: uppercase;
    padding: 12px 20px;
    display: block;
    top: 237px;
}



.image-bg-fluid-height {
	background: url('http://lorempixel.com/g/1920/500/') no-repeat center center scroll;
    padding: 0;
    max-width: 1170px;
    margin: 0 auto;
    height: 400px;
}

.image-bg-fixed-height {
	background: url('http://lorempixel.com/g/1920/500/') no-repeat center center scroll;
    height: 450px;
}

.img-center {
	margin: 0 auto;
}

section {
    /*padding: 75px 0;*/
}

.section-heading {
    margin: 30px 0;
    font-size: 4em;
}

.section-lead {
    margin: 30px 0;
}

.section-paragraph {
    margin: 30px 0;
}

@media(max-width:768px) { 
    /*less than 768px//mobileversion below than tab*/

/*    section {
        padding-top: 25px;
        padding-bottom: 25px;
    }

    .section-heading {
        font-size: 2em;
    }*/

    ul.link-list {
        -moz-column-count: 1;
        -moz-column-gap: 20px;
        -webkit-column-count: 1;
        -webkit-column-gap: 7px;
        column-count: 1;
        column-gap: 20px;
    }


    ul.link-list li {
        float: left;
        width: 44.9%;
    }

    .designed {
    text-align: left !important;
    }


}
.navbar-default {
    border-color: transparent;
}


/*section*/

section#content {
    padding: 40px 0;
}

#featured {
    width: 100%;
    background: #fcfcfc;
    position: relative;
    margin: 0;
    padding: 40px 0;
}


#bannerwrap {
    width: 100%;
    background: #fcfcfc;
    position: relative;
    margin: 0;
    padding: 10px 0 0 0;
    margin-top: -20px;
}

section.callaction {
    background: #f9f9f9;
    padding: 30px 0;
    /*margin: 50px 0;*/
}


.cta-text {
    text-align: center;
    margin-top:10px;
}


.big-cta .cta {
    margin-top:10px;
}

.cta-text h2 span {
    color: #EE8100;

}

.cta-text h2
{
        font-size: 30px;
}

.solidline {
    border-top: 1px solid #f5f5f5;
        margin: 30px 0;
}


h4.heading {
    font-weight: 700;
    /* position: relative; */
    margin-bottom: 30px;
    margin-left: 16px;
        font-size: 22px;
/*    display: inline-table;
    text-align: center;*/
}

@media (min-width: 1199px){

    .col-xs-12.col-sm-6.boxright {
        padding-left: 0;
        margin-left: -13px;
    }
    .col-xs-12.col-sm-6.boxleft {
        padding-right: 0;
        margin-right: -13px;
    }
}

/*header*/


header .navbar {
    min-height: 160px;
}
header .navbar-default {
    background-color: #fff;
}
/* footer */
footer{
    background:#EE8100;
}
#sub-footer{
    background:#EE8100;
}


/*home*/
.homebox {
    text-align: center;
}

.homebox > .img-thumb-box {
    margin: 0 10px;
}

.home.img-thumb-box-overlay span{
    padding: 50px 27px;
    font-size: 18px;
}


/*slide*/



/*menu*/
.dropdown-menu .divider {
    height: 1px;
    margin: 9px 0;
    overflow: hidden;
    background-color: #FFC076;
}
.dropdown-header {
    display: block;
    padding: 3px 20px;
    font-size: 16px;
    line-height: 1.42857143;
    color: #FFF;
    white-space: nowrap;
    padding-left: 7px !important;
}

ul.dropdown-menu li ul {
    padding-left: 15px;
}

ul.dropdown-menu li ul li a {
    color: white;
}

ul.dropdown-menu li ul li { 
    list-style:none 
    }

ul.dropdown-menu li ul li:before { 
content: "\003E \0020";
}

li.ca_mobilex.dropdown a span.caret {
    float: right;
}

ul.dropdown-menu li a {
    padding-left: 7px !important;
    font-size: 16px;
}

.navbar-toggle {
    margin-top: 140px;
    }

.navbar-default .navbar-toggle {
    border-color: transparent;
}
.navbar-default .navbar-toggle .icon-bar {
    background-color: #191818;
}
.navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover {
    background-color: #F7941E;
}
.navbar-default .navbar-nav>li>a {
    text-transform: uppercase;
}
.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:focus, .navbar-default .navbar-nav>.active>a:hover {
    color: #F7941E;
     background-color: transparent; 
}

.nav>li>a {
    padding: 10px 7px;
    font-weight: bold;
}
.navbar-default .navbar-nav>li>a {
    color: #000;
}

.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover {
    color: #F79456;
    background-color: transparent;
}
.navbar-default .navbar-brand {
    width: 85%;
}
a.navbar-brand img {
    width: auto;
    margin: 0 auto;
}
@media (max-width: 410px){
    .navbar-default .navbar-brand {
        width: 75%;
    }
}


@media (max-width: 991px){

    .navbar-nav .open .dropdown-menu {
        background-color: #F7941E;
    }
    .navbar-default .navbar-nav .open .dropdown-menu>li>a {
        color: #FFF;
            background-color: transparent;
    }
    .navbar-default .navbar-nav .open .dropdown-menu>li>a:hover{
        color: #FFF;
            background-color: transparent;
    }
    .containerheader {
    width: 100% !important;

    }



}
@media (min-width: 768px){

    .navbar-nav {
   /*     padding: 70px 0;*/
      /*  margin: 7.5px -15px;*/

    }


}
@media (min-width: 768px)and (max-width: 1115px){


}


@media (min-width: 992px){

     .navbar-nav {
        padding: 0;
        float: right;
        margin-top: 80px;
    }
    li.dropdown span.caret {
    display: none;
    }
    li.ca_mobile {
        display: none;
    }
    li.ca_desktop  {
        display: visible;
    }


}
@media (min-width: 991px) and (max-width: 1200px){
    .navbar-brand {
        padding: 0;
    }
    .navbar-nav {
        /*padding: 71px 0;*/
    }
    a.navbar-brand img {
        width: 177px;
        padding: 40px 0;
    }
    .navbar-nav>li {
    font-size: 12px;
    }

}


@media (max-width: 991px){
    .navbar-header {
        float: none;
    }
    .navbar-toggle {
        display: block;
    }
    .navbar-collapse {
        border-top: 1px solid transparent;
        box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
    }
    .navbar-collapse.collapse {
        display: none!important;
    }
    .navbar-nav {
        float: none!important;
        margin: 7.5px -15px;
        /*padding: 0px 15px;*/
    }
    .navbar-nav>li {
        float: none;
    }
    .navbar-nav>li>a {
        padding-top: 10px;
        padding-bottom: 10px;
    }
    .navbar-text {
        float: none;
        margin: 15px 0;
    }
    /* since 3.1.0 */
    .navbar-collapse.collapse.in { 
        display: block!important;
    }
    .collapsing {
        overflow: hidden!important;
    }
    .nav>li {
    position: relative;
    display: block;
    border-bottom: 1px solid #E7E7E7;
    }
    li.ca_desktop {
    display: none;
    }
}


@media (min-width: 991px){
    ul.dropdown-menu {
        display: none !important;
    }

}

/* ===============================
sidebar menu 
================================ */
ul.side_menu_list_header {
    list-style-type: none;
    padding: 0;
}

ul.side_menu_list_header li:first-child {
    border-top:none;
}
ul.side_menu_list_header li:last-child {
        border-bottom: 1px solid #F4F4F4;
}


ul.side_menu_list_header li {
    /*padding: 0 10px;*/
    padding: 10px 10px;
    border-top: 1px solid #F4F4F4;

}
ul.side_menu_list_header li a {
    color: black;
}
ul.side_menu_list_header li.active {
    background: #EE8100;
}
ul.side_menu_list_header li.active a {
    color: white;
}
ul.side_menu_list_header li.active a.active {
    color: #EAE9E9;
}

ul.side_menu_list_header li ul {
    padding: 0;
    list-style-type: none;
}
ul.side_menu_list_header li ul li {
    padding: 2px 20px;
    border-bottom: none;
    border-top: none;
}
ul.side_menu_list_header li ul li:last-child {
        border-bottom: none;
}

ul.side_menu_list_header li >a > i{
    float:right;
}

ul.side_menu_list_header li.active ul li >a > i{
    float:left;
    padding-right: 4px;
    padding-top: 2px;
}

/* ===============================
Subpage 
================================ */
.row.content {
    margin-top: 50px;
}


h1 span {
    color: #EE8100;
}

/* ===============================
text on image thumbnail
================================ */


.image_text {
  display: inline-block;
  /*margin-top: 25px;*/
  position: relative;  
}

.image_text img {
  display: block;
  max-width:100%;
}

.image_text .overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    /* height: 34px; */
    background-color: rgba(0,0,0,0.62);
    /* color: white; */
}

div.overlay > h2 {
    color: white;
    font-size: 14px;
    /* margin-bottom: 20px; */
    padding: 0 17px;
    font-weight: 400;
    margin: 10px 0;
}

/* ===============================
Home : box grid
================================ */



.box1 {
    width: 32%;
    /* display: inline-block; */
    margin-left: 52px;
}

.box2 {
    width: 32%;
    display: inline-block;
}
.box3 {
    width: 32%;
    display: inline-block;
}


.square.o{
 background-color: #EE8100;
}
.square.g{
 background-color: #F9F9F9;
}
.square.b{
 background-color: #000;
}


.square {
    float: left;
    position: relative;
    width: 48%;
    padding-bottom: 45%;
    margin: 0;
   
    overflow: hidden;
}

div.square> .content {
    position:absolute;
    height:90%; /* = 100% - 2*5% padding */
    width:96%; /* = 100% - 2*5% padding */
    color: #f9f9f9;
    font-size: 21px;
    text-transform: uppercase;
    text-align: left;
    padding: 10px;
    
}
div.square> .content a {
    text-transform: capitalize;
    font-size: 19px;
    color: #f9f9f9;
    line-height: 1.8;
    display: block;
    
}

.rs {
    width: auto;
    height: auto;
    /* max-height: 90%; */
    /* max-width: 100%; */

}

img.rs {
    margin: 0 auto;
    padding: 5%;
}

.arrow-right-o {
    width: 0;
    height: 0;
    border-top: 15px solid transparent;
    border-bottom: 15px solid transparent;
    border-left: 20px solid #EE8100;
    position: absolute;
    margin-left: -6%;
    margin-top: 30%;
}


.arrow-right-b {
    width: 0;
    height: 0;
    border-top: 15px solid transparent;
    border-bottom: 15px solid transparent;
    border-left: 20px solid #000;
    position: absolute;
    margin-left: -6%;
    margin-top: 30%;
}

.arrow-left-o {
    width: 0;
    height: 0;
    border-top: 15px solid transparent;
    border-bottom: 15px solid transparent;
    border-right: 20px solid #EE8100;
    position: absolute;
    margin-right: -6%;
    margin-top: 30%;
    right: 0;
}


.arrow-left-b {
    width: 0;
    height: 0;
    border-top: 15px solid transparent;
    border-bottom: 15px solid transparent;
    border-right: 20px solid #000;
    position: absolute;
    margin-right: -6%;
    margin-top: 30%;
    right: 0;
}
    .mf.heading-hide-desktop > h4.heading{
        display: none;
    }
    .mf.heading-hide-tabletmobile > h4.heading{
        display: block;
    }

@media(min-width:1200px) { 


    .en h4{
        margin-left: 37px;
    }
    .mf h4{
        margin-left: 93px;
    }
}


@media(max-width:1200px) { 

    .mf.heading-hide-desktop > h4.heading{
        display: block;
    }
    .mf.heading-hide-tabletmobile > h4.heading{
            display: none;
    }
    
    .box1 {
        width: 46%;
        /* display: inline-block; */
        margin-left: 52px;
    }

    .box2 {
        width: 46%;
        display: inline-block;
    }
    .box3 {
        width: 46%;
            display: block;
                margin-left: 50px;
    }
        .arrow-right-o {
        margin-left: -7%;
    }

}

@media(max-width:715px) { 

    .box1 {
        width: 300px;
        margin: 6px;
        display: inline-block;
    }

    .box2 {
        width: 300px;
        display: inline-block;
        margin: 10px;
    }
    .box3 {
        width: 300px;
        display: inline-block;
        margin: 10px;
    }
   .arrow-right-o {
        margin-left: -8%;
    }
    .arrow-right-b {
        margin-left: -8%;
    }
    img.rs {
        margin: 0 auto;
        padding: 8px;
        width: 105%;
    }
    .content {
        font-size: 17px;

}




}

/* ===============================
Home : image hover icon
================================ */

.row.imghovergrid {
    margin: 0 auto;
    text-align: center;
}


.img-thumb-box
{
display:inline-block !important;
position:relative !important; 
overflow: hidden;

}
.img-thumb-box-overlay {
   
  visibility:hidden;
  opacity:0;
  transition:visibility 0s linear 0.5s,opacity 0.5s linear;

}
.img-thumb-box a{

    color:transparent;
}
.img-thumb-box a:hover .img-thumb-box-overlay {
    visibility:visible;
    opacity:1;
    transition-delay:0s;
    text-align:center;
    position: absolute;
    background-color: rgba(238, 129, 0, 0.49);;
    color: #fff;
    width:100%;
    height:100%;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .6);
    
}
.img-thumb-box-overlay span {
margin: auto;
position: absolute;
top: 0; left: 0; bottom: 0; right: 0
}

.img_caption {
    text-align: center;
    font-weight: 600;
    padding: 0 0 20px 0;
}

.img-thumb-box a.readmore{
        color: #000;
        display: none;
    }
.homebox > .img-thumb-box img {
    width: 248px;
    height: 190px;
}

@media(max-width:768px) { 
    .gallery_with_thumbnail .thumbnail_gallery .thumb {
        float: left;
            width: 100% !important;
        /*height: 100%;*/
        margin: 0 5px 0 0;
        cursor: pointer;
    }

    div#gallery-kkb > .img-thumb-box.content > img  {
        width: 98% !important;
    }

}

/*smallscreen*/


@media (max-width: 991px){

    .homebox > .img-thumb-box {
        margin: 0 10px;
        width: 99%;
        /*background: red;*/
    }

    .img-thumb-box a:hover .img-thumb-box-overlay, .img-thumb-box a .img-thumb-box-overlay {
        visibility: visible;
        opacity: 1;
        transition-delay: 0s;
        text-align: center;
        position: absolute;
        background-color: transparent;
        color: #000;
        width: 100%;
        height: 100%;
        text-shadow: 0 1px 2px rgba(0, 0, 0, .6);
    }
    .img-thumb-box a.readmore{
        color: #EE8100;
        display: inline-block;
        text-align: center;
        position: absolute;
        left: 0px;
        background: transparent;
        margin-left: 50%;
        top: 50%;
        font-size: 20px;
    }

    .home.img-thumb-box-overlay span {
        padding: 0px 0px 0px 2px;
        font-size: 18px;
        display: inline-block;
        width: 50%;
        margin-left: 50%;
        text-align: left;
        text-shadow: none;
        height: 38%;
        margin-top: 3%;
            color: black;
    }

    .homebox > .img-thumb-box img {
        display: inline-block;
        margin-right: 50%;
    }
    .img-thumb-box a.desktopmore {
        pointer-events: none;
    } 

/*thumbgallery*/
    .img-thumb-box-overlay span {
        margin: auto;
        position: absolute;
        top: 5px;
        left: inherit;
        bottom: inherit;
        right: 5px;
        font-size: 9px;
        color: rgb(255, 255, 255);
        /* background: rgba(12, 12, 12, 0.4); */
        border-radius: 6px;
    
    }
    div#gallery-kkb > .img-thumb-box a .img-thumb-box-overlay {
        width: 98%;
    }

}
@media (max-width: 560px){
    .homebox > .img-thumb-box {
        margin: 0;
        width: 99%;
        height: 320px;
    }
    .homebox > .img-thumb-box img {
        display: inline-block;
        /* margin-right: 50%; */
        margin-top: 0;
    }
    .home.img-thumb-box-overlay span {
        padding: 4px;
        margin-left: 0;
        height: 22%;
        margin-top: 196px;
        width: 100%;
    }
    .img-thumb-box a.readmore {
        left: 0px;
        margin-left: 5px;
        top: 90%;
    }


}




/* ===============================
main pic with thumbnail paginations
================================ */

/*flyer*/
.gallery_with_thumbnail .thumbnail_gallery .thumb.flyer {
    width: 20%;
        text-align: center;
}
.thumb.flyer> .img-thumb-box a {
    color: #000000;
    text-decoration: none;
    font-weight: bold;
    font-size: 18px;
}

.thumb.flyer> .img-thumb-box {

        width: 100%;
}

.thumb.flyer> .img-thumb-box > a .img-thumb-box-overlay {
    transition: none
}

/*pdf*/

.awardpadding {
    margin-bottom: 19px;
        text-align: center;
        height: 360px;
}
.awardpadding .captions {
    font-weight: bold;
    text-align: center;
}

.pdf-thumb-box
{
display:inline-block !important;
position:relative !important; 
overflow: hidden;

}
.pdf-thumb-box-overlay {
   
  visibility:hidden;
  opacity:0;
  transition:visibility 0s linear 0.5s,opacity 0.5s linear;

}
.pdf-thumb-box a{

    color:transparent;
}
.pdf-thumb-box a:hover .pdf-thumb-box-overlay {
    visibility: visible;
    opacity: 1;
    transition-delay: 0s;
    text-align: center;
    position: absolute;
    background-color: rgba(238, 129, 0, 0.5);
    color: #FFF;
    width: 100%;
    height: 100%;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .6);
    
}
.pdf-thumb-box-overlay span {
margin: auto;
position: absolute;
top: 0; left: 0; bottom: 0; right: 0
}


/*gallery*/

div#gallery-kkb {
    text-align: center;
}
.gallery_with_thumbnail .thumbnail_gallery { margin-top: 5px; }

.gallery_with_thumbnail .thumbnail_gallery .thumb {
    float: left;
    width: 30%;
    /* height: 100%; */
    margin: 0 11px 18px 0;
  cursor: pointer;
}

.gallery_with_thumbnail .thumbnail_gallery .thumb img {
  border: 1px solid #9c9c9c;
  width: 100%;
}

.gallery_with_thumbnail .thumbnail_gallery .last { margin: 0; }

.clear { clear: both; }


div#gallery-kkb > .content > img  {
    width: 95% !important;
    }


div#gallery-kkb > .img-thumb-box.content, img.gallery_main {
    width: 98%;
    }

div#gallery-kkb > .img-thumb-box a:hover .img-thumb-box-overlay {
    width:98%; 
}

/*sidecaption second line indent*/
div.gallery_with_thumbnail >p{
    padding-left: 45px;
    text-indent: -45px;
}


@media (max-width: 560px){
    .gallery_with_thumbnail .thumbnail_gallery .thumb.flyer {
        width: 100%;
        text-align: center;
    }

    .media.certificate .media-body {
        display: block;
            width: 100%;

    }

}

/* ===============================
corporate Info
================================ */

table.corp_info {
        width: 103%;/* as to make all inline and no break in civil*/
    border: 1px #ccc solid;
}
table.corp_info th {
    background: #EE8100;
    color: white;
    padding: 10px;
    text-transform: uppercase;
    border: 1px #ccc solid;
}
table.corp_info td {
    padding: 10px;
    border: 1px #ccc solid;
}




/* ===============================
Footer
================================ */

footer{
    padding:50px 0 0 0;
    color:#f8f8f8;
        margin-top: 50px;
}

footer a {
    color:#fff;
}

footer a:hover {
    color:#eee;
}

footer h1, footer h2, footer h3, footer h4, footer h5, footer h6{
    color:#fff;
}

footer address {
    line-height: 16px;
}

footer h5 a:hover, footer a:hover {
    text-decoration:none;
}

ul.social-network {
    list-style:none;
    margin:0;
}

ul.social-network li {
    display:inline;
    margin: 0 5px;
}

#sub-footer{
    text-shadow:none;
    color:#f5f5f5;
    padding:0;
    padding-top:30px;
    margin:20px 0 0 0;
}

#sub-footer p{
    margin:0;
    padding:0;
}

#sub-footer span{
        color: #f5f5f5;
    font-size: 15px;
    font-weight: 300;
}

.copyright {
    text-align:left;

}
.copyright a, .designed a{
     color:#E4E4E4;

}


#sub-footer ul.social-network {
    float:right;
}


ul.link-list{
    margin:0;
    padding:0;
    list-style:none;
}

ul.link-list li{
    margin:0;
    padding:2px 0 2px 0;
    list-style:none;
}

footer ul.link-list li a{
    color:#fff;
}
footer ul.link-list li a:hover {
    color:#eee;
}


#sub-footer ul.social-network {
    float:right;
}

ul.social-network {
    list-style:none;
    margin:0;
}

ul.social-network li {
    display:inline;
    margin: 0 5px;
}

.designed {
    text-align: right;
     font-size: 12px;
}

div.designed p span {
}


/*core activities*/
.row.gridimage,.row.hdg {
    text-align: center;
}

/*hot-dip-galvanising image grid*/


.row.hdg img {
    width: 150px;
    height: 120px;
    padding: 5px;
}


/*thumbnail page*/
/*certificate*/

.certificate img.media-object {
    width: 220px;
}

/*award*/

.awardpadding img.img-responsive {
    width: 160px;
    height: 230px;
}


ul.sitemap li {
    color: #FABDA1;
    list-style-type: initial;
}

ul.sitemap li a {
    color: #000;

}

/*rev 01032016*/
table.corp_info.splitA {
    max-width: 30%;
    display: inline-block;
}
table.corp_info.splitB {
    max-width: 60%;
    display: inline-block;
}
p.noindent {
    padding-left: 0 !important;
    text-indent: 0 !important;
}


