/*--A Design by W3layouts 
Author: W3layout
Author URL: http://w3layouts.com
License: Creative Commons Attribution 3.0 Unported
License URL: http://creativecommons.org/licenses/by/3.0/
--*/
body {
    font-family: 'Source Sans Pro', sans-serif;
    background: #fff;
}

    body a {
        transition: 0.5s all;
        -webkit-transition: 0.5s all;
        -o-transition: 0.5s all;
        -moz-transition: 0.5s all;
        -ms-transition: 0.5s all;
    }

@keyframes ex4 { /* CSS3 */
    0% {
        background-color: green;
    }

    50% {
        background-color: yellow;
    }

    100% {
        background-color: #efefef;
    }
}

@-moz-keyframes ex4 { /* Firefox */
    0% {
        background-color: green;
    }

    50% {
        background-color: yellow;
    }

    100% {
        background-color: #efefef;
    }
}

@-webkit-keyframes ex4 { /* Webkit */
    0% {
        background-color: green;
    }

    50% {
        background-color: yellow;
    }

    100% {
        background-color: #efefef;
    }
}

.contactFormSucess {
    animation: ex4 5s infinite; /* CSS3 */
    -moz-animation: ex4 5s infinite; /* Firefox */
    -webkit-animation: ex4 5s infinite; /* Webkit */
    border-radius: 10px 10px 10px 10px;
    -moz-border-radius: 10px 10px 10px 10px;
    -webkit-border-radius: 10px 10px 10px 10px;
}

.field-validation-error {
    color: red;
}

.errorMessage {
    color: red;
}

.successMessage {
    color: green;
}

ul {
    padding: 0;
    margin: 0;
}

h1, h2, h3, h4, h5, h6, p, label {
    margin: 0;
}

header-menu {
    background-color: #0071c5;
}



.header {
    background: url(../images/background02.jpg) no-repeat center;
    width: 100%;
    min-height: 600px;
    display: block;
    background-size: cover;
    position: relative;
}

.header-logo {
    display: none;
}
/*----*/
.top-menu ul li a {
    position: relative;
    display: inline-block;
    outline: none;
    color: #3b3b3b;
    text-decoration: none;
    font-size: 1.3em;
    padding: 0em 1em;
    vertical-align: middle;
    margin: 0 0.5em;
    font-weight: 500;
    font-family: "FontAwesome",Calibri,Candara,Arial,sans-serif;
}

    .top-menu ul li a:hover,
    .top-menu ul li a:focus {
        outline: none;
    }

/*Action Button*/
.top-button {
    background-color: #0071c5;
    padding: 0.5em;
    text-align: center;
    margin: auto;
    width: 250px;
}

    .top-button h4 {
        font-size: 2em;
        color: #fff;
        margin: 0;
        line-height: 1.5em;
    }


/*Scroll back button*/

#scrollBtn {
    display: none;
    position: fixed;
    bottom: 80px;
    right: 30px;
    z-index: 99;
    border: none;
    outline: none;
    background-color: #0071c5;
    background-image: url('../images/arrow.png');
    background-repeat: no-repeat;
    background-position: 8px 9px;
    cursor: pointer;
    padding: 23px;
    border-radius: 10px;
}

    #scrollBtn:hover {
        background-color: #555; /* Add a dark-grey background on hover */
    }

/* Effect 15: scale down, reveal */
/*----*/
.top-menu {
    margin-top: 1em;
    text-align: center;
    margin-bottom: 1em;
}

    .top-menu ul li {
        display: inline-block;
    }

        .top-menu ul li a:hover {
            color: #0071c5;
        }

        .top-menu ul li a.active {
            color: #ff5f8a;
        }
/*----*/
.top-nav span.menu:before {
    content: url(../images/menu.png)no-repeat 0px 0px;
    cursor: pointer;
    width: 100%;
}

.top-nav span.menu {
    display: none;
}
/*--banner--*/
.ban-top {
    margin: 0;
    width: 32%;
    text-align: left;
}

.standard-top1 {
    background-color: #0071c5;
    padding: 2em 2em;
}

.ban-top h4 {
    font-size: 2em;
    color: #fff;
    margin: 0;
    line-height: 1.5em;
}

.ban-top h5 {
    font-size: 2em;
    color: #fff;
    margin: 0.5em 0;
    font-family: 'Ubuntu', sans-serif;
}

.ban-top h6 {
    font-size: 2em;
    line-height: 1.4em;
    color: #fff;
    font-family: "FontAwesome",Calibri,Candara,Arial,sans-serif;
}

.video {
    width: 100%;
    height: 325px;
}

.screenshot {
    width: 100%;
}

.soc {
    margin-top: 2em;
}

    .soc ul li {
        padding: 0em;
        list-style: none;
        display: inline-block;
    }

        .soc ul li a span.fa {
            background-position: 0px -2px;
        }

        .soc ul li a span.tw {
            background-position: -41px -3px;
        }

        .soc ul li a span.g {
            background-position: -86px -4px;
        }

        .soc ul li a span.fa:hover {
            opacity: 0.5;
            transition: 0.5s all;
            -webkit-transition: 0.5s all;
            -moz-transition: 0.5s all;
            -o-transition: 0.5s all;
            -ms-transition: 0.5s all;
        }

        .soc ul li a span.tw:hover {
            opacity: 0.5;
            transition: 0.5s all;
            -webkit-transition: 0.5s all;
            -moz-transition: 0.5s all;
            -o-transition: 0.5s all;
            -ms-transition: 0.5s all;
        }

        .soc ul li a span.g:hover {
            opacity: 0.5;
            transition: 0.5s all;
            -webkit-transition: 0.5s all;
            -moz-transition: 0.5s all;
            -o-transition: 0.5s all;
            -ms-transition: 0.5s all;
        }

        .soc ul li span {
            background: url(../images/ftr-icons.png)no-repeat;
            width: 34px;
            height: 36px;
            display: block;
            transition: 0.5s all;
            -webkit-transition: 0.5s all;
            -moz-transition: 0.5s all;
            -o-transition: 0.5s all;
            -ms-transition: 0.5s all;
        }

.com {
    margin-top: 1em;
}

    .com ul li {
        padding: 0em;
        list-style: none;
        display: inline-block;
    }

        .com ul li a span.fa {
            background-position: 0px -2px;
            transition: 0.5s all;
            -webkit-transition: 0.5s all;
            -moz-transition: 0.5s all;
            -o-transition: 0.5s all;
            -ms-transition: 0.5s all;
        }

        .com ul li a span.tw {
            background-position: -41px -3px;
            transition: 0.5s all;
            -webkit-transition: 0.5s all;
            -moz-transition: 0.5s all;
            -o-transition: 0.5s all;
            -ms-transition: 0.5s all;
        }

        .com ul li a span.g {
            background-position: -86px -4px;
            transition: 0.5s all;
            -webkit-transition: 0.5s all;
            -moz-transition: 0.5s all;
            -o-transition: 0.5s all;
            -ms-transition: 0.5s all;
        }

        .com ul li a span.fa:hover {
            opacity: 0.5;
            transition: 0.5s all;
            -webkit-transition: 0.5s all;
            -moz-transition: 0.5s all;
            -o-transition: 0.5s all;
            -ms-transition: 0.5s all;
        }

        .com ul li a span.tw:hover {
            opacity: 0.5;
            transition: 0.5s all;
            -webkit-transition: 0.5s all;
            -moz-transition: 0.5s all;
            -o-transition: 0.5s all;
            -ms-transition: 0.5s all;
        }

        .com ul li a span.g:hover {
            opacity: 0.5;
            transition: 0.5s all;
            -webkit-transition: 0.5s all;
            -moz-transition: 0.5s all;
            -o-transition: 0.5s all;
            -ms-transition: 0.5s all;
        }

        .com ul li span {
            background: url(../images/com-icons.png)no-repeat;
            width: 34px;
            height: 36px;
            display: block;
        }

.banner-matter {
    text-align: center;
    padding: 6em 0 0;
    color: #0071c5;
}

    .banner-matter h1 {
        font-size: 4.5em;
        margin: 0;
        /*font-style: italic;*/
        line-height: 2.0em;
        font-family: "FontAwesome",Calibri,Candara,Arial,sans-serif;
        padding: 0.2em 1em;
    }
    /*-- w3layouts --*/
    .banner-matter h2 {
        font-size: 2em;
        line-height: 1.8em;
        width: 62%;
        margin: 0;
        color: #fff;
        background-color: rgba(183, 193, 216, 0.75);
        padding: 0.5em 2em;
        text-align: left;
    }
/*-- planning --*/
.plan-top {
    background-color: #fff;
    padding: 2em;
}

.plan-overview {
    background-color: #ECECEC;
    padding: 2em;
}

.w3l h3 {
    color: #0071c5;
    font-family: "FontAwesome",Calibri,Candara,Arial,sans-serif;
    font-size: 2.2em;
}

.w3l p {
    font-size: 1.2em;
    line-height: 1.7em;
    margin: 1em 0;
    color: #3b3b3b;
}

.w3l {
    padding: 5em 0;
}

.plan-top:hover {
    background: #fff;
}


span.glyphicon.glyphicon-edit, span.glyphicon.glyphicon-object-align-right, span.glyphicon.glyphicon-home, span.glyphicon.glyphicon-equalizer, span.glyphicon-comment, span.glyphicon-user {
    font-size: 3em;
    color: #131A2C;
    margin-bottom: 0.5em;
}
/*-- /planning --*/
/*-- wthree --*/
.wthree {
    padding: 2em 0;
}

    .wthree h3 {
        color: #131A2C;
        font-family: 'Ubuntu', sans-;
        font-size: 3em;
        margin-bottom: 1em;
    }

    .wthree p {
        /*
    font-size: 1.2em;
    line-height: 1.7em;
    margin: 1em 0;
    color: #999;
    */
        font-size: 1.5em;
        line-height: 1.7em;
        margin: 1em 0;
        color: #3b3b3b;
    }
/*-- agileits --*/
.news input[type="text"] {
    outline: none;
    border: 1px solid #131A2C;
    background: #fff;
    padding: 13px 10px;
    font-size: 14px;
    width: 80%;
    margin: 0 auto;
}

.news input[type="email"] {
    outline: none;
    border: 1px solid #131A2C;
    background: #fff;
    padding: 13px 10px;
    font-size: 14px;
    width: 80%;
    margin: 0 auto;
}

.news input[type="submit"] {
    outline: none;
    background: #0071c5;
    color: #fff;
    font-size: 16px;
    width: 18%;
    padding: 13px 0;
    border: none;
    transition: 0.5s all;
    -webkit-transition: 0.5s all;
    -moz-transition: 0.5s all;
    -o-transition: 0.5s all;
    -ms-transition: 0.5s all;
    position: relative;
    top: 20px;
    margin-bottom: 25px;
}

    .news input[type="submit"]:hover {
        background: #131A2C;
        transition: 0.5s all;
        -webkit-transition: 0.5s all;
        -moz-transition: 0.5s all;
        -o-transition: 0.5s all;
        -ms-transition: 0.5s all;
    }

.news {
    margin-top: 3em;
}
/*-- /wthree --*/
/*-- w3ls --*/
.w3ls {
    padding: 5em 0;
    background: #ECECEC;
}

    .w3ls h2, .w3ls h3 {
        color: #131A2C;
        font-family: "FontAwesome",Calibri,Candara,Arial,sans-serif;
        font-size: 2em;
        margin-bottom: 1em;
    }
    /*-- w3layouts --*/
    .w3ls h4 {
        color: #0071c5;
        font-family: "FontAwesome",Calibri,Candara,Arial,sans-serif;
        font-size: 1.8em;
        margin-bottom: 1em;
    }

    .w3ls h5 {
        color: #fff;
        font-family: "FontAwesome",Calibri,Candara,Arial,sans-serif;
        font-size: 1.9em;
        margin-bottom: 1em;
        line-height: 1.5em;
    }

    .w3ls h6 {
        color: #fff;
        font-family: "FontAwesome",Calibri,Candara,Arial,sans-serif;
        font-size: 1.9em;
        line-height: 1.5em;
    }

.standard-top span {
    color: #131A2C;
    font-size: 1.5em;
}

.w3ls p {
    font-size: 1.2em;
    line-height: 1.7em;
    margin: 1em 0;
    color: #3b3b3b;
}

.standard-top {
    background-color: #0071c5;
    padding: 2em;
}

.w3ls ul li a, .quality ul li a {
    color: #3b3b3b;
    font-size: 1.2em;
}

.w3ls ul li, .quality ul li {
    display: block;
    background: url(../images/dot.png)no-repeat 0px 5px;
    padding-left: 2em;
    margin: 1em 0 0;
    font-size: 1.5em;
}

#sub-list {
    background: url(../images/point.png)no-repeat 0px 5px;
    margin-left: 2em;
}

#agenda {
    color: #0071c5;
    font-family: "FontAwesome",Calibri,Candara,Arial,sans-serif;
    /*font-size: 1.8em;*/
    margin-bottom: 1em;
}


.wthree ul li, .quality ul li {
    display: block;
    background: url(../images/dot.png)no-repeat 0px 5px;
    padding-left: 2em;
    margin: 1em 0 0;
    font-size: 1.5em;
}

    .wthree ul li a, .quality ul li a {
        color: #3b3b3b;
        font-size: 1.2em;
    }

        .w3ls ul li a:hover, .quality ul li a:hover {
            color: #0071c5;
            padding-left: 10px;
        }
/*-- /w3ls --*/
/*-- agile --*/
/*-- agileits --*/
/* FIFTH EFFECTS */
.fifth-effect img {
    -moz-transition: all 0.3s ease-in;
    -webkit-transition: all 0.3s ease-in;
    -o-transition: all 0.3s ease-in;
    -ms-transition: all 0.3s ease-in;
    transition: all 0.3s ease-in;
}

.fifth-effect .mask1 {
    cursor: pointer;
    opacity: 1;
    visibility: visible;
    border: 20px solid rgba(200, 203, 209, 0.61);
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -moz-transition: all 0.4s cubic-bezier(0.940, 0.850, 0.100, 0.620);
    -webkit-transition: all 0.4s cubic-bezier(0.940, 0.850, 0.100, 0.620);
    -o-transition: all 0.4s cubic-bezier(0.940, 0.850, 0.100, 0.620);
    -ms-transition: all 0.4s cubic-bezier(0.940, 0.850, 0.100, 0.620);
    transition: all 0.4s cubic-bezier(0.940, 0.850, 0.100, 0.620);
}

.fifth-effect:hover .mask1 {
    border: 0px double rgba(0,0,0,0.7);
    opacity: 0;
    visibility: hidden;
}

.fifth-effect:hover img {
    opacity: 1;
}
/* CSS3 STYLE GENERIC */
.view1 {
    width: 255px;
    height: 255px;
    margin: 0 0px 20px 0px;
    float: left;
    overflow: hidden;
    position: relative;
    text-align: center;
    cursor: default;
}

    .view1 .mask1, .view1 .content1 {
        width: 255px;
        height: 255px;
        position: absolute;
        overflow: hidden;
        top: 0;
        left: 0;
    }

    .view1 img {
        display: block;
        position: relative;
    }

    .view1 a.info {
        background: url(../img/link.png) center no-repeat;
        display: inline-block;
        text-decoration: none;
        padding: 0;
        text-indent: -9999px;
        width: 20px;
        height: 20px;
    }

.agile h4 {
    color: #131A2C;
    font-family: "FontAwesome",Calibri,Candara,Arial,sans-serif;
    font-size: 2em;
}

.agile p {
    font-size: 1.2em;
    line-height: 1.7em;
    margin: 1em 0;
    color: #999;
}

.agile {
    padding: 5em 0;
}

.s-btm {
    text-align: center;
}
/*-- /agile --*/
.c-left {
    padding-left: 0;
}

.contact-left {
    padding-right: 0;
}

abbr[title], abbr[data-original-title] {
    cursor: help;
    border-bottom: none !important;
}
/*-- footer --*/
.footer {
    background-color: #303030;
    padding: 4em 0 0;
}

    .footer h3 {
        color: #fff;
        font-family: "FontAwesome",Calibri,Candara,Arial,sans-serif;
        font-size: 2.2em;
        margin: 0 0 1em;
    }

.location p {
    font-size: 1.1em;
    vertical-align: middle;
    display: inline-block;
    color: #C5C5C5;
}

address {
    font-style: normal;
    line-height: 1.8em;
    color: #C5C5C5;
    font-size: 1.1em;
    margin: 0em 0 2em;
    padding: 0 0 2em;
}

span.glyphicon.glyphicon-earphone, span.glyphicon.glyphicon-envelope, span.glyphicon.glyphicon-globe {
    color: #ffffff;
    font-size: 2em;
    padding-right: 0.5em;
    vertical-align: middle;
}

.cont h4 {
    font-size: 1.5em;
    color: #C5C5C5;
    display: inline-block;
    vertical-align: middle;
}

.cont p {
    font-size: 1.1em;
    color: #C5C5C5;
    margin: 1.5em 0em 0 0em;
}

.latest-proj li {
    display: inline-block;
    width: 26%;
    margin: 0 2% 0 0;
}

.latest-proj div.footerDiv {
    display: inline-block;
    width: 31%;
    margin: -1em 2% 0 0;
}

.latest-proj h5 {
    color: #fff;
    font-family: "FontAwesome",Calibri,Candara,Arial,sans-serif;
    font-size: 1.1em;
    margin: 0.5em 0;
}

.latest-proj p {
    font-size: 1.1em;
    color: #C5C5C5;
    text-align: center;
}

.copy-rights ul li {
    padding: 0em;
    list-style: none;
    display: inline-block;
}

    .copy-rights ul li a span.fa {
        background-position: 0px -2px;
        transition: 0.5s all;
        -webkit-transition: 0.5s all;
        -moz-transition: 0.5s all;
        -o-transition: 0.5s all;
        -ms-transition: 0.5s all;
    }

    .copy-rights ul li a span.tw {
        background-position: -41px -3px;
        transition: 0.5s all;
        -webkit-transition: 0.5s all;
        -moz-transition: 0.5s all;
        -o-transition: 0.5s all;
        -ms-transition: 0.5s all;
    }

    .copy-rights ul li a span.g {
        background-position: -86px -4px;
        transition: 0.5s all;
        -webkit-transition: 0.5s all;
        -moz-transition: 0.5s all;
        -o-transition: 0.5s all;
        -ms-transition: 0.5s all;
    }

    .copy-rights ul li a span.fa:hover {
        opacity: 0.5;
        transition: 0.5s all;
        -webkit-transition: 0.5s all;
        -moz-transition: 0.5s all;
        -o-transition: 0.5s all;
        -ms-transition: 0.5s all;
    }

    .copy-rights ul li a span.tw:hover {
        opacity: 0.5;
        transition: 0.5s all;
        -webkit-transition: 0.5s all;
        -moz-transition: 0.5s all;
        -o-transition: 0.5s all;
        -ms-transition: 0.5s all;
    }

    .copy-rights ul li a span.g:hover {
        opacity: 0.5;
        transition: 0.5s all;
        -webkit-transition: 0.5s all;
        -moz-transition: 0.5s all;
        -o-transition: 0.5s all;
        -ms-transition: 0.5s all;
    }

    .copy-rights ul li span {
        background: url(../images/ftr-icons.png)no-repeat;
        width: 34px;
        height: 36px;
        display: block;
    }

.copy-rights {
    margin: -2em 0 0 0em;
    padding: 2em 0;
}

p.mai a {
    color: #0071c5;
}

    p.mai a:hover {
        color: #0071c5;
    }

.foot-bt p {
    font-size: 1.1em;
    font-weight: 400;
    color: #C5C5C5;
}

    .foot-bt p a:hover {
        color: #C5C5C5;
        text-decoration: none;
        transition: 0.5s all;
        -webkit-transition: 0.5s all;
        -moz-transition: 0.5s all;
        -o-transition: 0.5s all;
        -ms-transition: 0.5s all;
    }

    .foot-bt p a {
        color: #0071c5;
    }

.foot-bt {
    text-align: center;
    padding: 3em 0;
    margin: -3em 0 0;
    border-top: 1px solid #797777;
}
/*-- /footer --*/

/*-- experts --*/
.experts {
    background-color: #ECECEC;
    padding: 4em 0 0;
    border-top: 1px solid #0071c5;
}

    .experts h3 {
        color: #fff;
        font-family: "FontAwesome",Calibri,Candara,Arial,sans-serif;
        font-size: 2.2em;
        margin: 0 0 1em;
    }

    .experts img {
        vertical-align: middle;
        padding-bottom: 2em;
    }

}
/*-- /experts --*/


.header-1 {
    background: url(../images/13.jpg) no-repeat 0px 0px;
    width: 100%;
    min-height: 250px;
    display: block;
    background-size: cover;
}
/*--company --*/
.company h1, .company h2, .services h1, .services h2, .quality h1, .quality h2, .projects h1, .contact h1, .contact h2 {
    color: #131A2C;
    font-family: "FontAwesome",Calibri,Candara,Arial,sans-serif;
    font-size: 3em;
    margin-bottom: 1em;
}

.company h3, .services h3, .quality h3, .projects h3, .contact h3 {
    color: #131A2C;
    font-family: "FontAwesome",Calibri,Candara,Arial,sans-serif;
    font-size: 3em;
}

.company p, .services p, .quality p, .projects p, .contact p {
    font-size: 1.2em;
    line-height: 1.7em;
    margin: 1em 0;
    color: #999;
}

.company h5, .quality h5 {
    color: #131A2C;
    font-family: "FontAwesome",Calibri,Candara,Arial,sans-serif;
    font-size: 1.7em;
    margin-bottom: 0em;
}

.company, .services, .typo, .projects, .contact, .quality {
    padding: 5em 0;
}

    .company h4 {
        font-size: 4.5em;
        color: #fff;
    }

.com-tp {
    background-color: #131A2C;
    padding: 2em;
}

.company-btm {
    margin-top: 5em;
}

.co-le {
    float: left;
    width: 40%;
}

.co-top {
    margin-bottom: 2em;
}

.co-rg {
    float: right;
    width: 60%;
    padding: 0 2em;
}
/*--company --*/
.com-left h3 {
    margin-bottom: 1em;
}

.services-left1 h3 {
    margin-bottom: 1em;
}
/*--srervices --*/
.ser-bt1 {
    border-bottom: 1px dashed #999;
    border-top: 1px dashed #999;
}

.services-left {
    float: left;
    width: 15%;
}

.services-right {
    float: right;
    width: 80%;
}

.services-left p {
    background: #ff5f8a;
    color: #ffffff;
    font-size: 20px;
    text-align: center;
    padding: 12px;
    margin: 0;
    font-weight: 800;
    border-radius: 60%;
    -webkit-border-radius: 60%;
    -o-border-radius: 60%;
    -ms-border-radius: 60%;
    -moz-border-radius: 60%;
}

    .services-left p:hover {
        background: #131A2C;
        border-radius: 0%;
        -webkit-border-radius: 0%;
        -o-border-radius: 0%;
        -ms-border-radius: 0%;
        -moz-border-radius: 0%;
        transition: .5s all;
        -webkit-transition: .5s all;
        -o-transition: .5s all;
        -ms-transition: .5s all;
        -moz-transition: .5s all;
    }

.services-right h4 {
    margin: 0px 0 0 0;
    font-size: 1.4em;
    font-weight: 700;
    color: #131A2C;
    line-height: 1.5em;
}

.services-grid:nth-child(4), .services-grid:nth-child(5), .services-grid:nth-child(6) {
    margin-top: 50px;
}

.serv-list-info h3 span {
    color: #F896A9;
}

.services-list {
    background: url(../images/banner2.jpg) fixed;
    background-size: cover;
    -webkit-background-size: cover;
    -o-background-size: cover;
    -ms-background-size: cover;
    -moz-background-size: cover;
    min-height: 515px;
    padding: 80px 0 0 0;
}

.serv-list-info p {
    margin: 0px auto 23px auto;
    font-size: 14px;
    color: #E6E6E6;
    line-height: 2em;
    width: 75%;
    text-align: center;
}

.serv-list-grid ul {
    margin: 0;
    padding: 0;
}

    .serv-list-grid ul li {
        list-style-type: none;
        line-height: 2em;
    }

        .serv-list-grid ul li a {
            color: #e6e6e6;
            font-size: 14px;
            background: url(../images/icon3.png) no-repeat 0px 2px;
            padding-left: 30px;
        }

            .serv-list-grid ul li a:hover {
                padding-left: 38px;
                color: #F896A9;
            }

.services-info {
    margin: 5em 0 0;
}
/*--srervices --*/
/*--quality --*/
.co-rg1 {
    float: right;
    width: 67%;
    padding: 0 2em;
}

.co-le1 {
    float: left;
    width: 33%;
}
/*--quality --*/
/*--Typography--*/
.show-grid [class^=col-] {
    background: #fff;
    text-align: center;
    margin-bottom: 10px;
    line-height: 2em;
    border: 10px solid #f0f0f0;
}

.show-grid [class*="col-"]:hover {
    background: #e0e0e0;
}

.grid_3 {
    margin-bottom: 2em;
}

.xs h3, h3.m_1 {
    color: #000;
    font-size: 1.7em;
    font-weight: 300;
    margin-bottom: 1em;
}

.grid_3 p {
    color: #999;
    font-size: 0.85em;
    margin-bottom: 1em;
    font-weight: 300;
}

.grid_4 {
    background: none;
    margin-top: 50px;
}

h3.title {
    color: #131A2C;
    font-size: 3em;
    font-family: "FontAwesome",Calibri,Candara,Arial,sans-serif;
}

.label {
    font-weight: 300 !important;
    border-radius: 4px;
}

.grid_5 {
    background: none;
    padding: 2em 0;
}

    .grid_5 h3, .grid_5 h2, .grid_5 h1, .grid_5 h4, .grid_5 h5, h3.hdg, h3.bars {
        margin-bottom: 1em;
        color: #ff5f8a;
    }

.table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td {
    border-top: none !important;
}

.tab-content > .active {
    display: block;
    visibility: visible;
}

.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {
    z-index: 0;
}

.badge-primary {
    background-color: #03a9f4;
}

.badge-success {
    background-color: #8bc34a;
}

.badge-warning {
    background-color: #ffc107;
}

.badge-danger {
    background-color: #e51c23;
}

.grid_3 p {
    line-height: 2em;
    color: #888;
    font-size: 0.9em;
    margin-bottom: 1em;
    font-weight: 300;
}

.bs-docs-example {
    margin: 1em 0;
}

section#tables p {
    margin-top: 1em;
}

.tab-container .tab-content {
    border-radius: 0 2px 2px 2px;
    border: 1px solid #e0e0e0;
    padding: 16px;
    background-color: #ffffff;
}

.table td, .table > tbody > tr > td, .table > tbody > tr > th, .table > tfoot > tr > td, .table > tfoot > tr > th, .table > thead > tr > td, .table > thead > tr > th {
    padding: 15px !important;
}

.table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td {
    font-size: 0.9em;
    color: #999;
    border-top: none !important;
}

.tab-content > .active {
    display: block;
    visibility: visible;
}

.label {
    font-weight: 300 !important;
}

.label {
    padding: 4px 6px;
    border: none;
    text-shadow: none;
}

.nav-tabs {
    margin-bottom: 1em;
}

.alert {
    font-size: 0.85em;
}

h1.t-button, h2.t-button, h3.t-button, h4.t-button, h5.t-button {
    line-height: 1.8em;
    margin-top: 0.5em;
    margin-bottom: 0.5em;
}

li.list-group-item1 {
    line-height: 2.5em;
}

.input-group {
    margin-bottom: 20px;
}

.in-gp-tl {
    padding: 0;
}

.in-gp-tb {
    padding-right: 0;
}

.list-group {
    margin-bottom: 48px;
}

ol {
    margin-bottom: 44px;
}

h2.typoh2 {
    margin: 0 0 10px;
}

@media (max-width:768px) {
    .grid_5 {
        padding: 0 0 1em;
    }

    .grid_3 {
        margin-bottom: 0em;
    }
}

@media (max-width:640px) {
    h1, .h1, h2, .h2, h3, .h3 {
        margin-top: 0px;
        margin-bottom: 0px;
    }

        .grid_5 h3, .grid_5 h2, .grid_5 h1, .grid_5 h4, .grid_5 h5, h3.hdg, h3.bars {
            margin-bottom: .5em;
        }

    .progress {
        height: 10px;
        margin-bottom: 10px;
    }

    ol.breadcrumb li, .grid_3 p, ul.list-group li, li.list-group-item1 {
        font-size: 14px;
    }

    .breadcrumb {
        margin-bottom: 10px;
    }

    .well {
        font-size: 14px;
        margin-bottom: 10px;
    }

    h2.typoh2 {
        font-size: 1.5em;
    }

    .label {
        font-size: 60%;
    }
}

@media (max-width:480px) {
    .table h1 {
        font-size: 26px;
    }

    .table h2 {
        font-size: 23px;
    }

    .table h3 {
        font-size: 20px;
    }

    .label {
        font-size: 53%;
    }

    .alert, p {
        font-size: 14px;
    }

    .pagination {
        margin: 20px 0 0px;
    }
}

@media (max-width: 320px) {
    .grid_4 {
        margin-top: 18px;
    }

    h3.title {
        font-size: 1.6em;
    }

    .alert, p, ol.breadcrumb li, .grid_3 p, .well, ul.list-group li, li.list-group-item1, a.list-group-item {
        font-size: 13px;
    }

    .alert {
        padding: 10px;
        margin-bottom: 10px;
    }

    ul.pagination li a {
        font-size: 14px;
        padding: 5px 11px;
    }

    .list-group {
        margin-bottom: 10px;
    }

    .well {
        padding: 10px;
    }

    .nav > li > a {
        font-size: 14px;
    }

    table.table.table-striped, .table-bordered, .bs-docs-example {
        display: none;
    }
}
/*--//Typography --*/
/*--contact-starts--*/
.contact {
    padding: 6em 0px;
}

.contact-top {
    text-align: center;
}

.map {
    margin-top: 4%;
}

    .map iframe {
        width: 100%;
        height: 350px;
    }

.contact-bottom {
    margin-top: 4%;
}

.c-left input[type="text"], .c-left textarea {
    width: 100%;
    margin-bottom: 10px;
    color: #999;
    background: none;
    padding: 10px 10px;
    outline: none;
    border: 1px solid #C7C5C5;
    font-size: 14px;
}

.c-left textarea {
    resize: none;
    height: 10.4em;
}

.contact-right {
    padding: 0;
}

.contact-input {
    margin-bottom: 1em !important;
}

.news textarea {
    outline: none;
    border: 1px solid #131A2C;
    background: #fff;
    padding: 13px 10px;
    font-size: 14px;
    width: 80%;
    margin: 0 auto;
}

.submit-btn input[type=submit] {
    color: #fff;
    padding: 7px 0px;
    font-size: 16px;
    cursor: pointer;
    font-weight: 400;
    margin-top: 10px;
    background: #131A2C;
    outline: none;
    width: 98%;
    border: none;
}

    .submit-btn input[type=submit]:hover {
        background: #ff5f8a;
        color: #fff;
        transition: 0.5s all ease;
        -webkit-transition: 0.5s all ease;
        -moz-transition: 0.5s all ease;
        -o-transition: 0.5s all ease;
        -ms-transition: 0.5s all ease;
    }

.add {
    margin-top: 11px;
}

    .add h5 {
        color: #131A2C;
        font-size: 1.8em;
        margin: 0 0 0.5em;
    }

    .add address {
        border-bottom: none;
    }
/*--contact-end--*/
/*---gallery----*/
.view {
    width: 360px;
    height: 245px;
    margin: 10px;
    float: left;
    border: 10px solid #fff;
    overflow: hidden;
    position: relative;
    text-align: center;
    -webkit-box-shadow: 1px 1px 2px #BCBCBC;
    -moz-box-shadow: 1px 1px 2px #BCBCBC;
    box-shadow: 1px 1px 2px #BCBCBC;
    cursor: default;
    padding: 0;
}

    .view .mask, .view .content {
        width: 341px;
        height: 225px;
        position: absolute;
        overflow: hidden;
        top: 0;
        left: 0;
    }

    .view img {
        display: block;
        position: relative;
    }

.mask {
    padding: 1em 2em;
}

.view h5 {
    font-size: 1.7em;
    position: relative;
    color: #fff;
    text-align: center;
    margin: 2em auto 0;
    width: 63%;
}

.view-fourth img {
    -webkit-transition: all 0.4s ease-in-out 0.2s;
    -moz-transition: all 0.4s ease-in-out 0.2s;
    -o-transition: all 0.4s ease-in-out 0.2s;
    -ms-transition: all 0.4s ease-in-out 0.2s;
    transition: all 0.4s ease-in-out 0.2s;
    -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    opacity: 1;
}

.view-fourth .mask {
    background-color: rgb(27, 45, 78);
    -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    opacity: 0;
    -webkit-transform: scale(0) rotate(-180deg);
    -moz-transform: scale(0) rotate(-180deg);
    -o-transform: scale(0) rotate(-180deg);
    -ms-transform: scale(0) rotate(-180deg);
    transform: scale(0) rotate(-180deg);
    -webkit-transition: all 0.4s ease-in;
    -moz-transition: all 0.4s ease-in;
    -o-transition: all 0.4s ease-in;
    -ms-transition: all 0.4s ease-in;
    transition: all 0.4s ease-in;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
}

.view-fourth h5 {
    -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    opacity: 0;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}

.view-fourth:hover .mask {
    -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    opacity: 1;
    -webkit-transform: scale(1) rotate(0deg);
    -moz-transform: scale(1) rotate(0deg);
    -o-transform: scale(1) rotate(0deg);
    -ms-transform: scale(1) rotate(0deg);
    transform: scale(1) rotate(0deg);
    -webkit-transition-delay: 0.2s;
    -moz-transition-delay: 0.2s;
    -o-transition-delay: 0.2s;
    -ms-transition-delay: 0.2s;
    transition-delay: 0.2s;
}

.view-fourth:hover img {
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -o-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
    -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    opacity: 0;
    -webkit-transition-delay: 0s;
    -moz-transition-delay: 0s;
    -o-transition-delay: 0s;
    -ms-transition-delay: 0s;
    transition-delay: 0s;
}

.view-fourth:hover h5 {
    -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    opacity: 1;
    -webkit-transition-delay: 0.5s;
    -moz-transition-delay: 0.5s;
    -o-transition-delay: 0.5s;
    -ms-transition-delay: 0.5s;
    transition-delay: 0.5s;
}
/*---//gallery----*/
.contact-left h2 {
    margin-bottom: 0.5em;
}

address-1 {
    color: #777;
    font-size: 1.2em;
    line-height: 1.7em;
}
/*---responsive-design---*/
@media (max-width: 1440px) {
}
/*---responsive-design---*/
@media (max-width: 1366px) {
}
/*---responsive-design---*/
@media (max-width: 1280px) {
    .view h5 {
        margin: 1.5em auto 0;
    }
}
/*---responsive-design---*/
@media (max-width: 1024px) {
    .top-menu ul li a {
        margin: 0em;
        padding: 0em 0.95em;
    }

    .company, .services, .typo, .projects, .contact, .quality {
        padding: 3em 0;
    }

        .company h1, .company h2, .services h1, .services h2, .quality h1, .quality h2, .projects h1, .contact h1, .contact h2 {
            font-size: 2.5em;
        }

        .company h3, .services h3, .quality h3, .projects h3, .contact h3 {
            font-size: 2.5em;
        }

    .company-btm {
        margin-top: 3em;
    }

    .cont p {
        margin: 0em 0em 0 2em;
    }

    .footer h3 {
        font-size: 2em;
    }

    .view {
        width: 293px;
        height: 219px;
    }

        .view .mask, .view .content {
            width: 273px;
            height: 205px;
        }

        .view h5 {
            margin: 1em auto 0;
        }

    .plan-top {
        padding: 1em;
    }

    .plan-overview {
        padding: 1em;
    }

    .w3l h3 {
        font-size: 1.7em;
    }

    .w3l {
        padding: 3em 0;
    }

    .w3ls {
        padding: 3em 0;
    }

        .w3ls h2, .w3ls h3 {
            font-size: 1.6em;
            line-height: 1.3em;
        }

    .standard-top {
        padding: 1em;
    }

    .w3ls h4 {
        font-size: 1.6em;
    }

    .w3ls h5 {
        font-size: 1.6em;
    }

    .standard-top span {
        font-size: 1.3em;
    }

    .w3ls h6 {
        font-size: 1.6em;
    }

    .wthree h3 {
        font-size: 2.5em;
    }

    .wthree {
        padding: 2em 0;
    }

    .news input[type="text"] {
        width: 80%;
    }

    .agile {
        padding: 3em 0;
    }

        .agile h4 {
            font-size: 1.7em;
        }

    .view1 {
        width: 205px;
        height: 205px;
    }

        .view1 .mask1, .view1 .content1 {
            width: 205px;
            height: 205px;
        }

    .ban-top h4 {
        font-size: 1.7em;
    }

    .ban-top h5 {
        font-size: 1.7em;
    }

    .ban-top h6 {
        font-size: 1.7em;
    }

    .ban-top {
        width: 34%;
    }

    .banner-matter h1 {
        font-size: 4em;
        padding: 0.6em 1em 0.5em;
    }

    .header {
        min-height: 600px;
    }

    .mask {
        padding: 0em 1em;
    }
}
/*---responsive-design---*/
@media (max-width: 991px) {
    .top-menu ul li a {
        font-size: 1.2em;
        padding: 0em 0.4em;
    }

    .company-left {
        float: left;
        width: 33.33%;
    }

    .company h4 {
        font-size: 4em;
    }

    .company p, .services p, .quality p, .projects p, .contact p {
        font-size: 1.1em;
    }

    .com-left {
        margin-top: 3em;
    }

    .co-rg {
        padding: 0 0em;
    }

    .company h5, .quality h5 {
        font-size: 1.5em;
    }

    .cont {
        float: left;
        width: 25%;
    }

    .location {
        float: left;
        width: 25%;
        padding: 0 5px;
    }

    .latest-proj {
        float: left;
        width: 50%;
    }

        .latest-proj h5 {
            font-size: 1em;
        }

    address {
        font-size: 1.1em;
        margin: 0em 0 1em;
    }

    .cont h4 {
        font-size: 1.2em;
    }

    .cont p {
        margin: 0em 0em 0 1em;
    }

    .cont p {
        font-size: 1.2em;
    }

    span.glyphicon.glyphicon-earphone, span.glyphicon.glyphicon-envelope {
        font-size: 1.5em;
    }

    .location p {
        font-size: 1.1em;
    }

    .copy-rights {
        margin: -2em 0 0;
        padding: 1em 0;
    }

    .foot-bt {
        margin: 0.3em 0 0;
    }

    .services-left1 {
        float: left;
        width: 50%;
    }

    .services-info {
        margin: 3em 0 0;
    }

    .services-left1 {
        float: left;
        width: 100%;
        margin-bottom: 2em;
    }

    .services-info {
        margin: 0;
    }

    .w3ls ul li a, .quality ul li a {
        font-size: 1.1em;
    }

    .contact-left {
        margin-top: 2em;
    }

    .view {
        width: 220px;
        height: 171px;
    }

        .view .mask, .view .content {
            width: 200px;
            height: 161px;
        }

        .view h5 {
            margin: 0.8em auto 0;
        }

    .projects p {
        font-size: 1em;
    }

    .plan-left {
        float: left;
        width: 50%;
    }

    .plan-security {
        float: left;
        width: 100%;
    }

    .w3l p {
        font-size: 1.3em;
    }

    .plan-top {
        padding: 2em;
        margin-bottom: 2em;
    }

    .plan-overview {
        padding: 3em;
        margin-bottom: 2em;
    }


    .standards-right {
        float: left;
        width: 50%;
    }

    .standards-middle {
        float: left;
        width: 50%;
    }

    .standards-left {
        margin-bottom: 2em;
    }

    .standard-top {
        padding: 2em;
        margin: 2em;
    }

    .services-left2 {
        float: left;
        width: 50%;
    }

    .view1 {
        width: 257px;
        height: 225px;
    }

        .view1 .mask1, .view1 .content1 {
            width: 257px;
            height: 225px;
        }

    .agile h4 {
        text-align: left;
    }

    .agile p {
        font-size: 1.1em;
        text-align: left;
    }

    .w3ls p {
        font-size: 1.1em;
    }

    .wthree p {
        font-size: 1.3em;
    }

    #agenda {
        font-size: 1.3em;
    }

    .wthree ul li {
        font-size: 1.3em;
    }

    .w3ls ul li {
        font-size: 1.3em;
    }


    .banner-matter {
        padding: 0 0 0;
    }

    .ban-top {
        width: 46%;
    }

    .banner-matter h1 {
        font-size: 3em;
        padding: 0.6em 1em 0.5em;
    }

    .header {
        min-height: 530px;
    }

    .c-left {
        padding: 0;
    }

    .submit-btn input[type="submit"] {
        width: 100%;
    }

    .foot-bt {
        padding: 1.5em 0;
    }

    .view h5 {
        font-size: 1.5em;
        width: 100%;
    }

    .mask {
        padding: 0em 0.3em;
    }

    .mask {
        padding: 0em 0.3em;
    }
}
/*---responsive-design---*/
@media (max-width: 767px) {
    .top-menu {
        display: none;
    }

    .header-logo {
        display: block;
        margin-top: 1em;
    }

    .logo {
        float: left;
    }

        .logo a {
            color: #3b3b3b;
        }


    .top-nav {
        float: right;
        margin-top: 0;
    }

        .top-nav ul {
            display: none;
            position: absolute;
            width: 100%;
            z-index: 9999;
            left: 0%;
            margin: 1em 0;
            background: #131A2C;
            padding: 1em 0;
        }

        .top-nav span.icon {
            display: block;
            width: 100%;
            position: relative;
            cursor: pointer;
        }

        .top-nav ul li, .top-nav ul li.active {
            display: block;
            padding: 0.5em 0;
            text-align: center;
        }

            .top-nav ul li a, .top-nav ul li.active a {
                color: #fff;
                border: none;
                padding: 0;
                background: none;
                margin: 0;
                text-decoration: none;
                font-size: 1.2em;
                display: block;
                padding: 0;
            }

                .top-nav ul li a:hover {
                    color: #ff5f8a;
                }

            .top-nav ul li.active a {
                color: #ff5f8a;
            }

    .view {
        width: 324px;
        height: 226px;
    }

        .view .mask, .view .content {
            width: 324px;
            height: 226px;
        }

        .view h5 {
            margin: 2.5em auto 0;
        }

    .mask {
        padding: 0em 3.3em;
    }
}

@media (max-width: 667px) {
    .view {
        width: 290px;
        height: 200px;
    }

        .view .mask, .view .content {
            width: 290px;
            height: 200px;
        }

        .view h5 {
            margin: 2em auto 0;
        }

    .ban-top {
        width: 52%;
    }

    .top-button {
        width: 52%;
    }

    .mask {
        padding: 0em 2.3em;
    }
}
/*---responsive-design---*/
@media (max-width: 640px) {
    .company h1, .company h2, .services h1, .services h2, .quality h1, .quality h2, .projects h1, .contact h1, .contact h2 {
        font-size: 2.2em;
    }

    .company-left {
        width: 100%;
        margin-bottom: 2em;
    }

    .company h3, .services h3, .quality h3, .projects h3, .contact h3 {
        font-size: 2.2em;
    }

    .company-btm {
        margin-top: 0em;
    }

    .co-rg {
        padding: 0 2em;
    }

    .location {
        float: left;
        width: 50%;
        padding: 0 16px;
    }

    .cont {
        float: left;
        width: 50%;
    }

    .latest-proj {
        float: left;
        width: 100%;
        margin-bottom: 2em;
    }

    .footer {
        padding: 2em 0 0;
    }

    .experts {
        padding: 2em 0 0;
    }

    .view {
        width: 276px;
        height: 171px;
    }

        .view .mask, .view .content {
            width: 256px;
            height: 161px;
        }

    .standard-top {
        margin: 1em;
    }

    .wthree h3 {
        font-size: 2.2em;
    }

    .agile h4 {
        font-size: 1.6em;
    }

    .w3l h3 {
        font-size: 1.6em;
    }

    .standard-top1 {
        padding: 1em 1em;
    }

    .banner-matter h1 {
        font-size: 2.7em;
        padding: 0.6em 0em 0.5em;
    }

    .header {
        min-height: 500px;
    }

    .view h5 {
        margin: 1em auto 0;
    }

    .mask {
        padding: 0em 0.5em;
    }

        .mask p {
            font-size: 1em;
            line-height: 1.5em;
        }
}

@media (max-width: 600px) {
    .view {
        width: 256px;
        height: 179px;
    }

        .view .mask, .view .content {
            width: 256px;
            height: 179px;
        }
}

@media (max-width: 568px) {
    .view {
        width: 240px;
        height: 168px;
    }

        .view .mask, .view .content {
            width: 240px;
            height: 168px;
        }

    .ban-top {
        width: 57%;
    }

    .top-button {
        width: 57%;
    }
}
/*---responsive-design---*/
@media (max-width: 480px) {
    .company h1, .company h2, .services h1, .services h2, .quality h1, .quality h2, .projects h1, .contact h1, .contact h2 {
        font-size: 2em;
    }

    .header-1 {
        min-height: 180px;
    }

    .company h3, .services h3, .quality h3, .projects h3, .contact h3 {
        font-size: 2em;
    }

    .company-left {
        margin-bottom: 1.5em;
    }

    .co-rg {
        padding: 0 1em;
    }

    .company h5, .quality h5 {
        font-size: 1.4em;
    }

    .footer h3 {
        font-size: 1.7em;
    }


    .experts h3 {
        font-size: 1.7em;
    }

    .latest-proj li {
        display: inline-block;
        width: 28%;
        margin: 0 2% 0 0;
    }

    .view {
        width: 196px;
        height: 151px;
    }

        .view .mask, .view .content {
            width: 180px;
            height: 149px;
        }

        .view h5 {
            margin: 0.5em auto 0;
        }

    .plan-left {
        width: 100%;
    }

    .plan-security {
        width: 100%;
    }

    .standards-middle {
        width: 100%;
        margin-bottom: 2em;
    }

    .standards-right {
        width: 100%;
    }

    .view1 {
        width: 194px;
        height: 194px;
    }

        .view1 .mask1, .view1 .content1 {
            width: 194px;
            height: 194px;
        }

    .ban-top {
        width: 67%;
    }

    .top-button {
        width: 67%;
    }

    .soc {
        margin-top: 1em;
    }

    .banner-matter h1 {
        font-size: 2.2em;
        padding: 0.6em 0em 0.5em;
    }

    .header {
        min-height: 430px;
    }

    .mask p {
        line-height: 1.5em;
        font-size: 0.9em;
    }
}
/*---responsive-design---*/
@media (max-width: 414px) {
    .view {
        width: 340px;
        height: 220px;
    }

        .view .mask, .view .content {
            width: 319px;
            height: 199px;
        }

        .view h5 {
            margin: 3em auto 0;
        }

    .services-left2 {
        width: 100%;
    }

    .view1 {
        width: 267px;
        height: 194px;
    }

        .view1 .mask1, .view1 .content1 {
            width: 267px;
            height: 194px;
        }

    .news input[type="text"] {
        width: 80%;
    }

    .news input[type="submit"] {
        width: 21%;
    }

    .location {
        float: left;
        width: 100%;
        padding: 0;
        margin: 0 0 2em;
    }

    .cont {
        float: left;
        width: 100%;
        padding: 0;
    }

    address {
        padding: 0 0 1em;
    }

    .copy-rights {
        margin: -2em 0 0;
        padding: 1em 0;
    }

    .ban-top {
        width: 79%;
    }

    .top-button {
        width: 79%;
    }

    .news input[type="text"] {
        padding: 10px 10px;
    }

    .news input[type="submit"] {
        font-size: 14px;
        padding: 11px 0;
    }

    .news {
        margin-top: 2em;
    }

    .agile {
        padding: 0em 0 1em;
    }
}
/*---responsive design----*/
@media (max-width:384px) {
    .view {
        width: 322px;
        height: 223px;
    }

        .view .mask, .view .content {
            width: 322px;
            height: 223px;
        }

    .ban-top {
        width: 86%;
    }

    .top-button {
        width: 86%;
    }


    .mask {
        padding: 0 2em;
    }
}
/*---responsive design----*/
@media (max-width:375px) {
    .view {
        width: 310px;
        height: 215px;
    }

        .view .mask, .view .content {
            width: 310px;
            height: 215px;
        }
}
/*---responsive-design---*/
@media (max-width: 320px) {
    .view {
        width: 273px;
        height: 196px;
        margin: 0 0 10px 0;
    }

        .view .mask, .view .content {
            width: 250px;
            height: 176px;
        }

        .view h5 {
            margin: 0.8em auto 0;
        }

    .logo img {
        width: 70%;
    }

    .top-nav {
        float: right;
        margin-top: 0px;
    }

    .company, .services, .typo, .projects, .contact, .quality {
        padding: 2em 0;
    }

        .company h1, .company h2, .services h1, .services h2, .quality h1, .quality h2, .projects h1, .contact h1, .contact h2 {
            font-size: 1.8em;
        }

    .company-left {
        padding: 0;
    }

    .com-tp {
        padding: 1.5em;
    }

    .com-left {
        margin-top: 1em;
    }

    .company h3, .services h3, .quality h3, .projects h3, .contact h3 {
        font-size: 1.8em;
    }

    .com-left {
        padding: 0;
    }

    .company h5, .quality h5 {
        font-size: 1.3em;
        margin-bottom: 0;
    }

    .co-top {
        margin-bottom: 1em;
    }

    .company p, .services p, .quality p, .projects p, .contact p {
        font-size: 1em;
    }

    .header-1 {
        min-height: 60px;
    }

    .services-left1 {
        padding: 0;
    }

    .services-right h4 {
        font-size: 1.3em;
    }

    .services-grid {
        padding: 0;
    }

    .latest-proj {
        padding: 0;
    }

        .latest-proj h5 {
            font-size: 1.1em;
        }

        .latest-proj p {
            font-size: 1em;
        }

    .cont {
        padding: 0;
    }

    .latest-proj li {
        width: 30%;
    }

    .copy-rights {
        margin: 1.5em 0 0;
    }

    .foot-bt p {
        font-size: 1.1em;
    }

    .foot-bt {
        margin: 0;
    }

    .footer h3 {
        font-size: 1.6em;
    }

    .experts h3 {
        font-size: 1.6em;
    }

    .quality-left {
        padding: 0;
    }

    .co-rg1 {
        padding: 0 1em;
    }

    .quality-right {
        padding: 0;
    }

    .standards ul li a, .quality ul li a {
        font-size: 1em;
    }

    .map iframe {
        width: 100%;
        height: 200px;
    }

    .c-left {
        padding: 0;
    }

    .contact-left {
        margin-top: 2em;
        padding: 0;
    }

    .plan-left {
        padding: 0;
    }

    .plan-security {
        padding: 0;
    }

    .w3l p {
        font-size: 1.3em;
    }

    .w3l {
        padding: 3em 0 1em;
    }

    .standards-left {
        padding: 0;
    }

    .w3ls h2, .w3ls h3 {
        font-size: 1.3em;
    }

    .w3ls {
        padding: 2em 0;
    }

        .w3ls p {
            font-size: 1em;
        }

    .standards-middle {
        padding: 0;
    }

    .standard-top {
        margin: 0em;
    }

    .wthree {
        padding: 2em 0;
    }

        .wthree h3 {
            font-size: 2em;
        }

    .welcome-left {
        padding: 0;
    }

    .wthree p {
        font-size: 1.3em;
    }

    .w3ls ul li {
        font-size: 1.3em;
    }

    .news input[type="text"] {
        width: 68%;
    }

    .news input[type="submit"] {
        width: 27%;
    }

    .services-left2 {
        padding: 0;
    }

    .ban-top {
        width: 84%;
    }

        .ban-top h4 {
            font-size: 1.3em;
        }

        .ban-top h5 {
            font-size: 1.3em;
        }

        .ban-top h6 {
            font-size: 1.3em;
        }

        .ban-top span {
            font-size: 1.3em;
        }

    .top-button {
        width: 84%;
    }

    .banner-matter h1 {
        font-size: 1.4em;
    }

    .header {
        min-height: 360px;
    }

    .agile {
        padding: 1em 0;
    }

    address-1 {
        font-size: 1em;
    }

    .add h5 {
        font-size: 1.5em;
    }

    .company h4 {
        font-size: 2.5em;
    }

    .foot-bt {
        padding: 1em 0.5em;
    }
}

.msg {
    margin-top: 5em;
}

.largeicon {
    font-size: 3em;
    padding-bottom: 10px;
}

.pricetext {
    font-size: 1.5em !important;
    font-weight: bold;
}