/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : Nov 30, 2015, 12:56:55 PM
    Author     : Ping
*/

@media (max-width:1279px) {
    .joblist { margin-right: 0; }
}

@media (max-width:1023px) {
    .gridL0 { display: none; }
    .gridL1 { width: 8.333333%; }
    .gridL2 { width: 16.666666%; }
    .gridL3 { width: 25%; }
    .gridL4 { width: 33.333333%; }
    .gridL5 { width: 41.666666%; }
    .gridL6 { width: 50%; }
    .gridL7 { width: 58.333333%; }
    .gridL8 { width: 66.666666%; }
    .gridL9 { width: 75%; }
    .gridL10 { width: 83.333333%; }
    .gridL11 { width: 91.666666%; }
    .gridL12 { width: 100%; }

    .header .fa-bars { display: block; }

    .header, .fixed {
        top: 0;
        height: 65px;
        background: #fff;
    }

    .logo {
        top: 10px;
        padding: 5px 15px;
    }

    .logo img { height: 35px; }

    .nav {
        position: fixed;
        overflow-y: scroll;
        right: -255px;
        top: 0;
        bottom: 0;
        width: 255px;
        background: #fff;
        border-left: 1px #ddd solid;
        transition: .5s ease;
        -moz-transition: .5s ease;
        -o-transition: .5s ease;
        -webkit-transition: .5s ease;
    }

    .slideLeft .nav { right: 0; }

    .nav > span { display: none; }

    .nav > ul { margin: 0; }

    .nav > ul > li { float: none; }

    .nav > ul > li > a, .fixed .nav > ul > li > a { line-height: 63px; }

    .nav > ul > li+li { border-top: 1px #ddd solid; }

    .nav > ul > li.active > a, .nav > ul > li.hover > a { border-left: 5px #ddd solid; }

    .nav > ul > li > a > i { display: none; }
    .nav > ul > li > a > span { display: block; }

    .nav > ul > li > ul {
        position: static;
        display: none;
    }

    .nav > ul > li.hover > ul { display: block; }

    .nav > ul > li > ul a {
        background: #f1f1f1;
        color: #333;
    }

    .calldesc span { display: block; }
    .calldesc a { display: none; }
    .buildingdesc span { display: block; }
    .buildingdesc h5 { margin-left: 45px; }

    .buildingdescholder {
        background: #fff;
        overflow: hidden;
    }

    .buildingdesc {
        position: static;
        visibility: visible;
        opacity: 1;
        filter: Alpha(Opacity=100);
        text-align: left;
        margin-top: 0;
        box-shadow: none;
        -moz-box-shadow: none;
        -webkit-box-shadow: none;
    }

    .buildingdescholder p { display: block; }

    .sorting p { display: block; }

    .sorting ul {
        display: none;
        background: transparent;
    }

    .sorting.hover ul { display: block; }

    .sorting li {
        float: none;
        border: none;
        background: #fff;
        margin-top: 1px;
    }

    .sorting li a {
        width: auto;
        transform: scale(.5);
        -moz-transform: scale(.5);
        -ms-transform: scale(.5);
        -webkit-transform: scale(.5);
    }

    .sorting li:nth-child(0) a {
        transition: 0s ease;
        -moz-transition: 0s ease;
        -o-transition: 0s ease;
        -webkit-transition: 0s ease;
    }

    .sorting li:nth-child(1) a {
        transition: .1s ease;
        -moz-transition: .1s ease;
        -o-transition: .1s ease;
        -webkit-transition: .1s ease;
    }

    .sorting li:nth-child(2) a {
        transition: .2s ease;
        -moz-transition: .2s ease;
        -o-transition: .2s ease;
        -webkit-transition: .2s ease;
    }

    .sorting li:nth-child(3) a {
        transition: .3s ease;
        -moz-transition: .3s ease;
        -o-transition: .3s ease;
        -webkit-transition: .3s ease;
    }

    .sorting li:nth-child(4) a {
        transition: .4s ease;
        -moz-transition: .4s ease;
        -o-transition: .4s ease;
        -webkit-transition: .4s ease;
    }

    .sorting li:nth-child(5) a {
        transition: .5s ease;
        -moz-transition: .5s ease;
        -o-transition: .5s ease;
        -webkit-transition: .5s ease;
    }

    .sorting li:nth-child(6) a {
        transition: .6s ease;
        -moz-transition: .6s ease;
        -o-transition: .6s ease;
        -webkit-transition: .6s ease;
    }

    .sorting.hover li a {
        transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        -webkit-transform: scale(1);
        opacity: 1;
        filter: Alpha(Opacity=100);
        text-decoration: none;
    }

    .sorting li span { display: none; }

    .joblist { margin-right: 0; }

    .jobapplicationform {
        margin: 0 auto;
        max-width: 495px;
    }
    
    .about-joland img { display: block; }
    
    .mission-vision img { display: none; }
    
    .mission-vision h1 { display: none; }
    
    .mission-vision p { padding: 15px 0 0 0; }
    
    .valuelist { height: auto; }
    
    .valuelist > img { display: none; }
    
    .valuelist > div {
        float: none;
        overflow: hidden;
        width: auto;
        height: auto;
        margin-bottom: 15px;
    }
    
    .valuelist > div h5 {
        float: left;
        width: 120px;
        padding: 40px 0;
    }
    
    .valuelist > div p {
        position: relative;
        bottom: auto;
        left: auto;
        right: auto;
        visibility: visible;
        opacity: 1;
        filter: Alpha(Opacity=100);
        margin-left: 150px;
        min-height: 90px;
    }
    
    .valuelist > div.hover p { bottom: auto; }
    
    .valuelist > div p .fa-caret-left { display: block; }
    .valuelist > div p .fa-caret-down { display: none; }
}

@media (max-width:767px) {
    .gridM0 { display: none; }
    .gridM1 { width: 8.333333%; }
    .gridM2 { width: 16.666666%; }
    .gridM3 { width: 25%; }
    .gridM4 { width: 33.333333%; }
    .gridM5 { width: 41.666666%; }
    .gridM6 { width: 50%; }
    .gridM7 { width: 58.333333%; }
    .gridM8 { width: 66.666666%; }
    .gridM9 { width: 75%; }
    .gridM10 { width: 83.333333%; }
    .gridM11 { width: 91.666666%; }
    .gridM12 { width: 100%; }

    .footer .copyright { text-align: center; }
    
    .hotairballon { width: 100px; height: 100px; margin-top: 50px; }

    .projectdetail > .projectdesc {
        float: none;
        border: none;
        min-height: 0 !important;
        width: 100% !important;
    }

    .projectdetail > .projectinfo {
        float: left;
        margin-top: 60px;
    }
}

@media (max-width:567px) {
    .gridS0 { display: none; }
    .gridS1 { width: 8.333333%; }
    .gridS2 { width: 16.666666%; }
    .gridS3 { width: 25%; }
    .gridS4 { width: 33.333333%; }
    .gridS5 { width: 41.666666%; }
    .gridS6 { width: 50%; }
    .gridS7 { width: 58.333333%; }
    .gridS8 { width: 66.666666%; }
    .gridS9 { width: 75%; }
    .gridS10 { width: 83.333333%; }
    .gridS11 { width: 91.666666%; }
    .gridS12 { width: 100%; }

    .footer .copyright span { display: block; }

    .joblist {
        overflow-x: scroll;
        overflow-y: hidden;
    }

    .joblist table { min-width: 568px; }
    
    .mission-vision { padding: 0 0 60px; }
    
    .mission-vision h2 {
        background: none;
        height: auto;
        float: none;
        padding: 60px 0 0;
        line-height: 1.14;
    }
    
    .valuelist > div h5 {
        float: none;
        margin: 0 auto;
    }
    
    .valuelist > div p { margin: 20px 0; }
    
    .valuelist > div p .fa-caret-left { display: none; }
    .valuelist > div p .fa-caret-down {
        display: block;
        top: -55px;
    }
}