﻿@font-face {
    font-family: 'openSans-bold';
    src: url('../../fonts/open-sans/OpenSans-Bold.woff2') format('woff2'), url('../../fonts/open-sans/OpenSans-Bold.woff') format('woff');
    font-display: swap;
}

@font-face {
    font-family: 'openSans-light';
    src: url('../../fonts/open-sans/OpenSans-Light.woff2') format('woff2'), url('../../fonts/open-sans/OpenSans-Light.woff') format('woff');
    font-display: swap;
}

@font-face {
    font-family: 'openSans-light-italic';
    src: url('../../fonts/open-sans/OpenSans-LightItalic.woff2') format('woff2'), url('../../fonts/open-sans/OpenSans-LightItalic.woff') format('woff');
    font-display: swap;
}

@font-face {
    font-family: 'openSans-regular';
    src: url('../../fonts/open-sans/OpenSans-Regular.woff2') format('woff2'), url('../../fonts/open-sans/OpenSans-Regular.woff') format('woff');
    font-display: swap;
}

@font-face {
    font-family: 'openSans-medium';
    src: url('../../fonts/open-sans/OpenSans-Medium.woff2') format('woff2'), url('../../fonts/open-sans/OpenSans-Medium.woff') format('woff');
    font-display: swap;
}

@font-face {
    font-family: 'openSans-regular-italic';
    src: url('../../fonts/open-sans/OpenSans-Italic.woff2') format('woff2'), url('../../fonts/open-sans/OpenSans-Italic.woff') format('woff');
    font-display: swap;
}

@font-face {
    font-family: 'openSans-semi-bold';
    src: url('../../fonts/open-sans/OpenSans-SemiBold.woff2') format('woff2'), url('../../fonts/open-sans/OpenSans-SemiBold.woff') format('woff');
    font-display: swap;
}

@font-face {
    font-family: 'openSans-extra-bold';
    src: url('../../fonts/open-sans/OpenSans-ExtraBold.woff2') format('woff2'), url('../../fonts/open-sans/OpenSans-ExtraBold.woff') format('woff');
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat-Bold';
    src: url('../../fonts/Montserrat/Montserrat-Bold.woff2') format('woff2'), url('../../fonts/Montserrat/Montserrat-Bold.ttf') format('woff');
    font-display: swap;
}


@font-face {
    font-family: 'Montserrat-Black';
    src: url('../../fonts/Montserrat/Montserrat-Black.woff2') format('woff2'),url('../../fonts/Montserrat/Montserrat-Black.woff') format('woff');
    font-display: swap;
}


@font-face {
    font-family: 'Montserrat-Medium';
    src: url('../../fonts/Montserrat/Montserrat-Medium.woff2') format('woff2'), url('../../fonts/Montserrat/Montserrat-Medium.woff') format('woff');
    font-display: swap;
}



.nomragin {margin:0px;}
.width-full {width:100%;min-height: 264.2px;}
.auditbg {background:#f5f5f5;}
div.auditbg-new {background: #fff;}
.auditlanding-wrapper {margin-top:70px;}
.auditheader-section {background:#fff;padding:15px 0px;text-align:center;}
.auditheader-section h1 {font-size:16px;color:#303030; font-family:openSans-regular;}
.dropdown-left-sec {
    text-align: center;
    padding-top: 15px;
    margin:0 auto;
    font-size:0;
}
.dropdown-left-sec span.logo-pill{
    border:1px solid #f36f25;
    color:#f36f25;
    display:inline-block;
    margin:0 10px;
    padding:6px 10px 4px 10px;
    border-radius:50px;
    line-height:1;
    cursor:pointer;
    font-size:16px;
}
.dropdown-left-sec span.logo-pill.active {
    background:#f36f25;
    color:#FFFFFF;
}
.dropdown-left-sec span.logo-pill:nth-child(1) {
    width:71px;
}
.dropdown-left-sec span.logo-pill:nth-child(2) {
    width:201px;
}
.dropdown-left-sec span.logo-pill:nth-child(3) {
    width:126px;
}
.dropdown-left-sec span.logo-pill:nth-child(4) {
    width:131px;
}
#userExperienceDesign, #usabilityTest, #usabilityAudit{
    display:none;
}
.audittop-panel {padding-top:20px;}
.boxes {background:#fff;margin-bottom:15px;position:relative}
div.boxes-new {background: #f5f5f5;}
div.boxbottom-content-new {padding-left: 15px; padding-right: 15px;}
.boxbottom-content .heading-cassestudy {padding:20px 5px 5px;text-align:center;}
.boxbottom-content .heading-cassestudy p {font-family:'openSans-medium';font-size:12px;line-height:18px; color:#8d8b8b;display:inline-block;}
.boxbottom-content .heading-cassestudy p span {color:#303030;font-weight:600;}
.boxbottom-content h2, .boxbottom-content .head2 {padding:0px 10px;font-family:openSans-bold;color:#303030;font-size:16px;line-height:20px; text-align:center;}
.mobillogo-images {padding-top:20px;text-align:center;padding-bottom:45px;}
.mobillogo-images img {display:inline-block; }
.boxes-hoverimg {display:none;position:absolute;bottom:0px;width:100%;}
.boxes-hoverimg img{width:100%;height:5px;}
.boxes:hover .boxes-hoverimg {display:block;}
.auditbottom-panel {background:#f5f5f5;padding:20px 0px; }
.auditbottom-panel-new {background: #fff;}
div.auditbottom-panel-new {padding: 0;}
/*.auditbottom-wrapper {background:red;}*/

.content-section {margin-bottom:20px;}
.content-section .bottomheading-cassestudy {padding:10px 5px 5px;text-align:center;}
.content-section .bottomheading-cassestudy p {font-family:'openSans-medium';font-size:11px;color:#8d8b8b;display:inline-block;}
.content-section .bottomheading-cassestudy p span {color:#303030; }
.content-section h2 {padding:0px;font-family:openSans-semi-bold;color:#303030;font-size:16px;text-align:center;}
.mobilelogo-images {padding-top:20px;text-align:center;padding-bottom:45px;}
.mobilelogo-images img {display:inline-block; }

.bottomleft-panel {position: relative;}
.bottomleft-panel:hover{box-shadow: 9.3px 3.6px 16px 4px rgba(0, 0, 0, 0.2)}
.bottomright-panel {background: url('../images/gradient-bg.jpg')repeat-y;display:inline-block;height:100%;width:100%;
                    padding:20px 15px;background-size:100%;}
.bottomright-panel h2 {font-family:openSans-regular;color:#fff; font-size:24px;padding:0px; }
.smallborder-bottom {border:1px solid #fff;width:58px;margin-top:15px;}
.bottomright-panel p {font-family:'openSans-regular';color:#fff;font-size:14px;line-height:2;padding:40px 0px;}
.bottomleft-panel .boxes-hoverimg {display:none;position:absolute;bottom:0px;width:100%;}
.bottomleft-panel .boxes-hoverimg img {width:100%;height:5px; }
.bottomleft-panel:hover .boxes-hoverimg {display:block;}
.auditbottom-wrapper {background:#fff;}

.auditlanding-wrapper .boxes:hover {
    box-shadow: 9.3px 3.6px 16px 4px rgba(0, 0, 0, 0.2);
}
/*div.auditbottom-wrapper-new {margin: 0 -15px;}*/
/*============Start of the media queries===============*/
@media(min-width:768px) {
    .auditlanding-wrapper {margin-top:75px;}
    .auditheader-section h1 {font-size:20px;color:#303030; }
    .boxes {min-height:335px;}
        .bottomright-panel{height: 335px;}
        div.bottomright-panel-new {height: auto;}
    .bottomright-panel h2 { font-size:18px; }
            .bottomright-panel p {
                padding: 20px 0px;
            }
}
/*===============End of the media 768px=================*/
@media(min-width:992px) {
    .auditlanding-wrapper {margin-top:110px;}
    .auditheader-section {padding:30px 0px 5px 0px;}
    .auditheader-section h1 {font-size:32px;color:#303030;text-transform:uppercase;line-height:42px; }
    .boxbottom-content .heading-cassestudy  {text-align:left;padding:20px 5px 5px 10px;display:table;width: 100%;}
        .boxbottom-content .heading-cassestudy p {position:relative;top:0px;font-size:12px;display: table-cell;  }
         .boxbottom-content .heading-cassestudy img{display:table-cell;}
    .boxbottom-content h2, .boxbottom-content .head2 {padding:25px 0px 15px 10px;font-family:openSans-semi-bold;color:#303030;font-size:20px;text-align:left;}
    .boxbottom-content p.category {padding:0 0px 25px 10px;color:#727272;font-size:14px;line-height:20px; text-align:left;}
     .boxes {min-height:455px;}
     .auditbottom-panel {padding:35px 0px; }
     .content-section {margin-bottom:0px;}
     .content-section .bottomheading-cassestudy  {text-align:left;padding:10px 5px 5px 10px;display:table;width: 100%;}
        .content-section .bottomheading-cassestudy p {position:relative;top:0px;font-size:12px;display: table-cell;   }
        .content-section .bottomheading-cassestudy img{display:table-cell;}
        .content-section h2 {padding:5px 130px 95px 10px;font-family:openSans-semi-bold;color:#303030;font-size:20px;text-align:left;}
        .content-section-new h2 {padding: 5px 130px 93px 10px;}
        .mobilelogo-images {padding-top:0px;padding-bottom:0px;}
        .mobillogo-images {padding-top:0px;padding-bottom:0px;}
    .bottomright-panel {height:455px;  }
    div.bottomright-panel-new {height: auto;}
        .bottomright-panel h2 { font-size:27px;padding-top:8px; }
            .bottomright-panel p {padding:10px 0px;font-size:18px;}
}
/*===============End of the media 992px=================*/
@media(min-width:1200px) {
        .boxbottom-content .heading-cassestudy  {text-align:left;}
        .boxbottom-content .heading-cassestudy p {font-size:14px;line-height:20px; }
        .boxbottom-content h2 , .boxbottom-content .head2{font-size:22px; line-height:30px;}
        .boxes {min-height:475px;}
        div.boxes_new {min-height:480px;}
        
        .content-section .bottomheading-cassestudy  {text-align:left;}
        .content-section .bottomheading-cassestudy p {font-size:14px; }
        .content-section h2 {font-size:24px;}
        .bottomright-panel h2 { font-size:33px; padding-top:55px;}
           .bottomright-panel{height: 530px;}
           div.bottomright-panel-new {height: auto;}
            .bottomright-panel p {    padding: 25px 106px 25px 0;
    font-size: 18px;
    }
}
/*===============End of the media 1200px=================*/
@media(min-width:1300px) {
}
/*===============End of the media 1300px=================*/

/*===============End of the media 1200px=================*/
@media(min-width:320px) and (max-width:760px) {
    .dropdown-left-sec span.logo-pill{
        margin:5px 5px;
    }
    .dropdown-left-sec span.logo-pill:nth-child(3) {
        width:136px;
    }
    .dropdown-left-sec span.logo-pill:nth-child(4) {
        width:136px;
    }
    .boxbottom-content p.category {
        padding: 15px 0px 0px 10px;
        color: #727272;
        font-size: 14px;
        line-height:20px;
        text-align: center;
    }
    .width-full {width:100%;min-height:inherit;}
}
/*===============End of the media 1300px=================*/

/*============End of the media queries===============*/

