/*//////////////////////////////////////////////////////////////////////////////
|| Grid Snippet
//////////////////////////////////////////////////////////////////////////////*/
.line:before, .line:after{ content:" "; display:table; }
.line:after{ clear: both; }
[class*="unit--"]{ float: left; }

.unit--1-2{ width: 50%; }
.unit--1-3{ width: 33.3%; }
.unit--1-4{ width: 25%; }
.unit--2-5{ width: 40%; }
.unit--3-5{ width: 60%; }

.line img, [class*="unit--"] img{ width: 100%; height: auto; }
.invert{ text-align: right; }
.revert{ text-align: left; }
.invert--block{ float: right; }
.revert--block{ float: left; }

[class*='hp-'], [class*='vp-']{}
.hp-10--left{ padding-left: 10px; }
.hp-10--right{ padding-right: 10px; }
.hp-20--right{ padding-right: 20px; }

.vg-10--top{ margin-top: 10px; }
.vg-10--bottom{ margin-bottom: 10px; }
.vg-20--top{ margin-top: 20px; }
.vg-20--bottom{ margin-bottom: 20px; }
.vg-30--top{ margin-top: 30px; }
.vg-40--bottom{ margin-bottom: 40px; }

/*//////////////////////////////////////////////////////////////////////////////
|| Flat Flag
//////////////////////////////////////////////////////////////////////////////*/
.flag, [class*='flag--']{
    display: table;
    width: 100%;
    box-sizing: border-box;
}
.flag__box, .flag__stub{
    display: table-cell;
    -dt-display: table-cell;
    vertical-align: middle;
}
.flag--fluid, .flag--fluid .flag__box{ width: auto; }
.flag--top .flag__stub, .flag--top .flag__box{ vertical-align: top; }
.flag--bottom .flag__stub, .flag--bottom .flag__box{ vertical-align: bottom; }
.flag__box { width: 100%; }


/*//////////////////////////////////////////////////////////////////////////////
|| Filters
//////////////////////////////////////////////////////////////////////////////*/

    #block-case_studies-embed_html_filters {
        padding-top: 20px;
    }
    #sidebar-first {
        margin-top: 0 !important;
    }

    /*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<
    || Listing
    >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>*/
    /*this hides the views filters on the listings page - nb this does not work for the html page!*/
    /*the html page has been altered in case_study.module*/

    /*hide sector & tehnology filter for PCS*/
    .division-division4 #views-exposed-form-case-study-listings-block-1 #edit-field-psd-sector-tid-wrapper,
    .division-division4 #views-exposed-form-case-study-listings-block-1 #edit-field-psd-capability-tid-wrapper{
        display: none;
    }

    /*hide technology filter for CPS*/
    .division-division1 #views-exposed-form-case-study-listings-block-1 #edit-field-psd-capability-tid-wrapper,
    .division-division8 #views-exposed-form-case-study-listings-block-1 #edit-field-psd-capability-tid-wrapper {
        display: none;
    }
    /*hide  countries for VSS*/
    .division-division3 #views-exposed-form-case-study-listings-block-1 #edit-field-psd-countries-tid-wrapper{
        display: none;
    }
    /*hide countries filter for CSS*/
    .division-division2 #views-exposed-form-case-study-listings-block-1 #edit-field-psd-countries-tid-wrapper{
        display: none;
    }
    #views-exposed-form-case-study-listings-block-1 .views-exposed-widgets {
        padding-top: 10px;
    }

    .case-study__item{
        border-bottom: 1px solid #1AA0C4;
        padding-bottom: 20px;
        margin-bottom: 20px;
        line-height: 1.3;
        color: #474747;
    }
    .views-row-last .case-study__item{
        margin-bottom: 0;
    }
    .case-study__item h2{
        font-family: 'Open Sans Condensed', sans-serif;
        line-height: 1; font-size: 16px;
        text-transform: uppercase;
        margin: 0;
        font-size: 17px;
        line-height: 1.5;
        color: #2C82C2;
        text-transform: uppercase;
    }
    .case-study__item h2 a{
        color: #2C82C2 !important;
        text-decoration: none;
    }

    .case-study__language-selector-ie-fix {
        position: relative;
    }
    .case-study__language-selector-ie-fix .case-study__language-selector {
        right: 0px;
    }

    .case-study__language-selector {
        z-index: 1;
    }

    .customSelect {
        /*width: 100%;*/
    }

    .customSelect.customSelectHover {
    }
    .customSelect.customSelectOpen {
    }
    .customSelect.customSelectFocus {
    }

    .customSelectInner {
        width: auto !important;
        color: #0068aa;
        font-size: 13px;
    }
    .customSelectInner:after {
        content: '›';
        margin-top: -1px;
        margin-left: 15px;
        font-size: 20px;
        display: inline-block;
        transform: rotate(90deg);
        vertical-align: middle;
    }

        /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
        || Buttons
        ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
        .case-study__button{
            background: #2C82C2;
            color: white !important;
            border: 0px;
            text-transform: uppercase;
            cursor: pointer;
            font-family: 'Open Sans Condensed', sans-serif;
            text-align: center;
            width: 120px !important;
            height: 30px;
        }

        .i18n-tr .case-study__button.read-more { width: 180px; }
        .i18n-fr .case-study__button.read-more { width: 145px; }
        .i18n-it .case-study__button.read-more { width: 195px; }
        .i18n-pl .case-study__button.read-more { width: 140px; }

        .case-study__button:hover{ text-decoration: none !important; }
        .case-study__button + .case-study__button{ margin-right: 5px;}
        .case-study__button .flag__stub{ background: #2073AC; padding: 5px 10px !important; font-size: 0px; }

            /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
            || Video
            ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
            .case-study__button .fl_playBtn_icon{
                width: 10px !important;
                height: auto !important;
                margin: 0px;
            }

            /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
            || Read More
            ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
            .case-study__button .fl_icon{
                width: 15px !important;
                height: auto !important;
                margin: 0px;
            }

            /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
            || PDF
            ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
            .case-study__button .cs_pdfBtn_icon{
                width: 15px !important;
                height: auto !important;
                margin: 0px;
            }


    .case-study__csv span + span{
        display: inline-block;
        margin-left: -4px;
    }
    /*.case-study__csv span + span:before{*/
        /*content: ',';*/
        /*margin-right: 5px;*/
        /*display: inline-block;*/
    /*}*/

    /*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<
    || Turning off styling
    >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>*/
    /*#block-side_menu-side_menu ul{ padding: 0; width: 100%; }
    #block-side_menu-side_menu{ width: 100%; }*/

    /*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<
    || Sidebar
    >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>*/
    .region-sidebar-first{
        box-sizing: border-box;
        padding-right: 20px;
    }
    .region-sidebar-first h2{
        color: white;
        background: #2180C1;
        overflow: hidden;
        padding: 12px 15px 12px;
        margin: 0px;
        font-size: 16px;
    }
    .region-sidebar-first form[id*="case-study"]{
        background: white;
    }
    form[id*="case-study"] .views-exposed-widgets{
        padding-bottom: 10px;
    }
    form[id*="case-study"] .views-exposed-widget{
        width: 100%;
        box-sizing: border-box;
        padding: 0px 10px 6px;
        background-color: white;
    }
    form[id*="case-study"] .views-exposed-widget.views-widget-per-page {
        display: none;
    }
    form[id*="case-study"] select{
        width: 100%;
        border: 0px;
    }
    form[id*="case-study"] label{
        color: #414141;
        padding-bottom: 10px;
        border-bottom: 1px solid #CCCCCC;
        cursor: pointer;
    }
    form[id*="case-study"] label:before{
        content: '›';
        margin-right: 10px;
        font-size: 20px;
        display: inline-block;
    }

    .case-study__applied-tags {
        width: 100%;
        float: left;
        margin-top: -10px;
    }
    .case-study__applied-tags h2{
        font-size: 14px;
        line-height: 1.5;
        margin-bottom: 12px;
    }
    .case-study__applied-tags span{
        display: block;
        background: #414141 url(../../../../themes/panasonic/images/tag-close-btn.png) center right 8px no-repeat !important;
        font-size: 12px;
        color: white;
        padding: 6px 8px;
        margin: 4px 6px 0;

    }


        /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
        || Expanders
        ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
        form[id*="case-study"] label + .views-widget{
            overflow: hidden;
            max-height: 0;
        }
        form[id*="case-study"] label.open + .views-widget{
            max-height: 400px;
        }
        form[id*="case-study"] .views-exposed-widget.open{
            border-bottom: 1px solid #2180C1; margin-bottom: 10px;
        }
        form[id*="case-study"] .views-widget select{
            padding: 10px 0px;
            outline: 0;
            border: 0;
        }
        form[id*="case-study"] .views-widget select option{
            color: #414141;
            font-size: 12px;
        }
        form[id*="case-study"] .views-widget select option:hover{
            color: #0E6AA8;
        }
        form[id*="case-study"] label.open:before{
            transform:rotate(90deg);
            -webkit-transform:rotate(90deg); /* Safari */
            -ms-transform:rotate(90deg); /* IE 9 */
            -webkit-transform-origin: 70% 70%;
            -moz-transform-origin: 70% 70%;
            -o-transform-origin: 70% 70%;
            transform-origin: 70% 70%;
        }

        /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
        || Buttons
        ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
        form[id*="case-study"] .views-exposed-widget[class*="-button"] input{
            margin-top: 0;
            width: 100%;
            border: 2px solid #2180C1; color: #2180C1;
            background: white;
            font-family: 'Open Sans Condensed', sans-serif;
            line-height: 1; font-size: 14px;
            text-transform: uppercase; text-align: center;
            padding: 10px;
            max-width: 160px;
            display: block;
            margin: 0 auto;
        }

        .i18n-pl form[id*="case-study"] .views-exposed-widget[class*="-button"] input {
            max-width: 180px;
        }
        .i18n-es form[id*="case-study"] .views-exposed-widget[class*="-button"] input {
            max-width: 190px;
        }

        form[id*="case-study"] .views-exposed-widget[class*="-button"].views-submit-button input{
            color: white;
            background: #2180C1;
        }

        form[id*="case-study"] .views-exposed-widget + .views-exposed-widget{
            padding-top: 0;
        }
        form[id*="case-study"] .views-exposed-widget.views-submit-button {
            padding-top: 10px;
        }
        form[id*="case-study"] .views-exposed-widget.views-submit-button input[type=submit]:disabled {
            opacity: 0.7;
            cursor: default;
        }

    /*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<
    || Body
    >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>*/
    #content-inner{ margin-top: 20px !important; }
    .field-name-field-include{
        border-top: 0px !important;
    }
    .node-body div.views-widget-per-page {
        padding: 20px 20px 0;
        background: white;
        border: 1px solid #CCCCCC;
        border-bottom: 0px;
        text-align: right;
        overflow: hidden;
        list-style: none;
    }
    .node-body ul#views-widget-per-page {
        border-bottom: 1px solid #2180C1;
        padding: 0 0 10px;
    }
    .node-body ul#views-widget-per-page li {
        font-size: 14px;
        font-weight: bold;
        color: #414141;
        cursor: pointer;
        display: inline-block;
        padding: 0 10px;
        border-right: 1px solid #414141;
    }
    .node-body ul#views-widget-per-page li:last-of-type {
        padding-right: 0;
        border-right: 0;
    }
    .node-body ul#views-widget-per-page li.selected {
        color: #2180C1;
    }
    .node-body .views-widget-per-page > .form-item {
        padding-bottom: 10px;
        border-bottom: 1px solid #2180C1;
        margin: 0;
    }
    .node-body .views-widget-per-page > .form-item label{
        display: inline-block;
    }
    body:not(.node-type-case-study) .node-body h1{
        padding: 15px 20px 0;
        background: white;
        border: 1px solid #CCCCCC;
        border-top: 0;
        border-bottom: 0px;
        font-size: 24px;
        line-height: 1;
        color: #2C82C2;
        text-transform: uppercase;
    }
    .node-body .field-name-body {
        padding: 0 20px;
        background: white;
        border: 1px solid #CCCCCC;
        border-top: 0;
        border-bottom: 0px;
        overflow: hidden;
        font-size: 13px;
        color: #434343;
    }
    .node-body .field-name-field-include{
        padding-top: 0;
    }
    .node-body .field-name-body p{
        font-size: 13px;
        line-height: 1.5;
        color: #434343;
    }


    .messages{ display: none; }


    /*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<
    || Pagination
    >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>*/
    .content .pager-container{
        padding: 0px !important; margin: 0px;
        position: relative;
        margin-top: 30px;
        height: 40px;

        background: #F6F6F6;
        border-radius: 3px;
    }
    .content ul.pager{
        margin: 0 auto !important;
        display: table;
        float: none !important;
        height: 40px;
    }
    .content ul.pager li{
        display: table-cell !important;
        float: none !important;
        vertical-align: middle;
        color: #434343 !important;
        border-bottom: 2px solid transparent;
        border-top: 2px solid transparent;
        font-size: 12px !important;
    }
    .content ul.pager li.pager-current{
        border-bottom: 2px solid #1AA0C4;
        color: #1AA0C4 !important;
        background: transparent !important;
    }
    .content ul.pager li .ajax-progress{ display: none !important; }

        /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
        || Previous
        ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
        .content ul.pager li.pager-previous{
            position: absolute;
            left: 0px; top: 5px;
            height: 30px;
            border: 0px !important;
            padding: 0 10px !important;

            border-right: 1px solid #E0E0E0 !important;
        }
        #content .content ul.pager li.pager-previous a{
            background: transparent !important;
            font-weight: bold;
            height: 30px; line-height: 30px;
            width: auto;
            color: #434343;

        }
        .content ul.pager li.pager-previous a:after{
            /*content: 'Prev page';*/
        }
        .content ul.pager li.pager-previous a:before{
            content: '‹';
            font-size: 16px;
            margin-right: 5px;
        }

        /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
        || Next
        ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
        .content ul.pager li.pager-next{
            position: absolute;
            right: 0px; top: 5px;
            height: 30px;
            border: 0px !important;
            padding: 0 10px !important;

            border-left: 1px solid #E0E0E0 !important;
        }
        #content .content ul.pager li.pager-next a{
            background: transparent !important;
            font-weight: bold;
            height: 30px; line-height: 30px;
            width: auto;
            color: #434343;

        }
        .content ul.pager li.pager-next a:before{
            /*content: 'Next page';*/
        }
        .content ul.pager li.pager-next a:after{
            content: '›';
            font-size: 16px;
            margin-left: 5px;
        }


        /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
        || swipeBox
        ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
        html.swipebox-html.swipebox-touch {
          overflow: hidden !important;
        }

        #swipebox-overlay img {
          border: none !important;
        }

        #swipebox-overlay {
          width: 100%;
          height: 100%;
          position: fixed;
          top: 0;
          left: 0;
          display: none;
          z-index: 99999 !important;
          overflow: hidden;
          -webkit-user-select: none;
             -moz-user-select: none;
              -ms-user-select: none;
                  user-select: none;
        }

        #swipebox-container {
          position: relative;
          width: 100%;
          height: 100%;
        }

        #swipebox-slider {
          -webkit-transition: -webkit-transform 0.4s ease;
                  transition: transform 0.4s ease;
          height: 100%;
          left: 0;
          top: 0;
          width: 100%;
          white-space: nowrap;
          position: absolute;
          display: none;
          cursor: pointer;
        }
        #swipebox-slider .slide {
          height: 100%;
          width: 100%;
          line-height: 1px;
          text-align: center;
          display: inline-block;
        }
        #swipebox-slider .slide:before {
          content: "";
          display: inline-block;
          height: 50%;
          width: 1px;
          margin-right: -1px;
        }
        #swipebox-slider .slide img,
        #swipebox-slider .slide .swipebox-video-container,
        #swipebox-slider .slide .swipebox-inline-container {
          display: inline-block;
          max-height: 100%;
          max-width: 100%;
          margin: 0;
          padding: 0;
          width: auto;
          height: auto;
          vertical-align: middle;
        }
        #swipebox-slider .slide .swipebox-video-container {
          background: none;
          max-width: 1140px;
          max-height: 100%;
          width: 100%;
          padding: 5%;
          -webkit-box-sizing: border-box;
                  box-sizing: border-box;
        }
        #swipebox-slider .slide .swipebox-video-container .swipebox-video {
          width: 100%;
          height: 0;
          padding-bottom: 56.25%;
          overflow: hidden;
          position: relative;
        }
        #swipebox-slider .slide .swipebox-video-container .swipebox-video iframe {
          width: 100% !important;
          height: 100% !important;
          position: absolute;
          top: 0;
          left: 0;
        }
        #swipebox-slider .slide-loading {
          background: url(../../../../themes/panasonic/images/loader.gif) no-repeat center center;
        }

        #swipebox-bottom-bar,
        #swipebox-top-bar {
          -webkit-transition: 0.5s;
                  transition: 0.5s;
          position: absolute;
          left: 0;
          z-index: 999;
          height: 50px;
          width: 100%;
        }

        #swipebox-bottom-bar {
          bottom: -50px;
        }
        #swipebox-bottom-bar.visible-bars {
          -webkit-transform: translate3d(0, -50px, 0);
                  transform: translate3d(0, -50px, 0);
        }

        #swipebox-top-bar {
          top: -50px;
        }
        #swipebox-top-bar.visible-bars {
          -webkit-transform: translate3d(0, 50px, 0);
                  transform: translate3d(0, 50px, 0);
        }

        #swipebox-title {
          display: block;
          width: 100%;
          text-align: center;
        }

        #swipebox-prev,
        #swipebox-next,
        #swipebox-close {
          background-image: url(../../../../themes/panasonic/images/icons.png);
          background-repeat: no-repeat;
          border: none !important;
          text-decoration: none !important;
          cursor: pointer;
          width: 50px;
          height: 50px;
          top: 0;
        }

        #swipebox-arrows {
          display: block;
          margin: 0 auto;
          width: 100%;
          height: 50px;
        }

        #swipebox-prev {
          background-position: -32px 13px;
          float: left;
        }

        #swipebox-next {
          background-position: -78px 13px;
          float: right;
        }

        #swipebox-close {
          top: 0;
          right: 0;
          position: absolute;
          z-index: 9999;
          background-position: 15px 12px;
        }

        .swipebox-no-close-button #swipebox-close {
          display: none;
        }

        #swipebox-prev.disabled,
        #swipebox-next.disabled {
          opacity: 0.3;
        }

        .swipebox-no-touch #swipebox-overlay.rightSpring #swipebox-slider {
          -webkit-animation: rightSpring 0.3s;
                  animation: rightSpring 0.3s;
        }
        .swipebox-no-touch #swipebox-overlay.leftSpring #swipebox-slider {
          -webkit-animation: leftSpring 0.3s;
                  animation: leftSpring 0.3s;
        }

        .swipebox-touch #swipebox-container:before, .swipebox-touch #swipebox-container:after {
          -webkit-backface-visibility: hidden;
                  backface-visibility: hidden;
          -webkit-transition: all .3s ease;
                  transition: all .3s ease;
          content: ' ';
          position: absolute;
          z-index: 999;
          top: 0;
          height: 100%;
          width: 20px;
          opacity: 0;
        }
        .swipebox-touch #swipebox-container:before {
          left: 0;
          -webkit-box-shadow: inset 10px 0px 10px -8px #656565;
                  box-shadow: inset 10px 0px 10px -8px #656565;
        }
        .swipebox-touch #swipebox-container:after {
          right: 0;
          -webkit-box-shadow: inset -10px 0px 10px -8px #656565;
                  box-shadow: inset -10px 0px 10px -8px #656565;
        }
        .swipebox-touch #swipebox-overlay.leftSpringTouch #swipebox-container:before {
          opacity: 1;
        }
        .swipebox-touch #swipebox-overlay.rightSpringTouch #swipebox-container:after {
          opacity: 1;
        }

        @-webkit-keyframes rightSpring {
          0% {
            left: 0;
          }

          50% {
            left: -30px;
          }

          100% {
            left: 0;
          }
        }

        @keyframes rightSpring {
          0% {
            left: 0;
          }

          50% {
            left: -30px;
          }

          100% {
            left: 0;
          }
        }
        @-webkit-keyframes leftSpring {
          0% {
            left: 0;
          }

          50% {
            left: 30px;
          }

          100% {
            left: 0;
          }
        }
        @keyframes leftSpring {
          0% {
            left: 0;
          }

          50% {
            left: 30px;
          }

          100% {
            left: 0;
          }
        }
        @media screen and (min-width: 800px) {
          #swipebox-close {
            right: 10px;
          }

          #swipebox-arrows {
            width: 92%;
            max-width: 800px;
          }
        }
        /* Skin
        --------------------------*/
        #swipebox-overlay {
          background: #0d0d0d;
        }

        #swipebox-bottom-bar,
        #swipebox-top-bar {
          text-shadow: 1px 1px 1px black;
          background: #000;
          opacity: 0.95;
        }

        #swipebox-top-bar {
          color: white !important;
          font-size: 15px;
          line-height: 43px;
          font-family: Helvetica, Arial, sans-serif;
        }


/*//////////////////////////////////////////////////////////////////////////////
|| Divisional Colours
//////////////////////////////////////////////////////////////////////////////*/

    /*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<
    || CPS - #616A73 - Division 1 / 8
    >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>*/
    .division-division1 form[id*="case-study"] .views-exposed-widget[class*="-button"].views-submit-button input,
    .division-division1 form[id*="case-study"] .views-exposed-widget[class*="-button"] input,
    .division-division1 .case-study__item,
    .division-division1 form[id*="case-study"] .views-exposed-widget.open,
    .division-division1 .node-body ul#views-widget-per-page,
    .division-division1 .gallery-carousels-thumbs ul li img.selected,
    .division-division8 form[id*="case-study"] .views-exposed-widget[class*="-button"].views-submit-button input,
    .division-division8 form[id*="case-study"] .views-exposed-widget[class*="-button"] input,
    .division-division8 .case-study__item,
    .division-division8 form[id*="case-study"] .views-exposed-widget.open,
    .division-division8 .node-body ul#views-widget-per-page,
    .division-division8 .gallery-carousels-thumbs ul li img.selected{
        border-color: #616A73 !important;
    }
    .division-division1 form[id*="case-study"] .views-exposed-widget[class*="-button"] input,
    .division-division1 .node-body h1, .division-division1 .case-study__item h2 a,
    .division-division1 .customSelectInner,
    .division-division1 form[id*="case-study"] .views-widget select option:hover,
    .division-division1 .node-body ul#views-widget-per-page li.selected, .division-division1 .details__quote, .division-division1 .details__quote,
    .division-division1 h2,
    .division-division1 #content .node-body a,
    .division-division8 form[id*="case-study"] .views-exposed-widget[class*="-button"] input,
    .division-division8 .node-body h1, .division-division1 .case-study__item h2 a,
    .division-division8 .customSelectInner,
    .division-division8 form[id*="case-study"] .views-widget select option:hover,
    .division-division8 .node-body ul#views-widget-per-page li.selected, .division-division1 .details__quote, .division-division1 .details__quote,
    .division-division8 h2,
    .division-division8 #content .node-body a{
        color: #616A73 !important;
    }
    .division-division1 .region-sidebar-first h2,
    .division-division1 form[id*="case-study"] .views-exposed-widget[class*="-button"].views-submit-button input,
    .division-division1 #content .node-body .case-study__button,
    .division-division8 .region-sidebar-first h2,
    .division-division8 form[id*="case-study"] .views-exposed-widget[class*="-button"].views-submit-button input,
    .division-division8 #content .node-body .case-study__button{
        background: #616A73 !important;
        color: white !important;
    }
    .division-division1 .case-study__button .flag__stub,
    .division-division8 .case-study__button .flag__stub{
        background: #525961;
    }
    /*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<
    || Comms - #4F4191 - Division 2
    >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>*/
    .division-division2 form[id*="case-study"] .views-exposed-widget[class*="-button"].views-submit-button input,
    .division-division2 form[id*="case-study"] .views-exposed-widget[class*="-button"] input,
    .division-division2 .case-study__item,
    .division-division2 form[id*="case-study"] .views-exposed-widget.open,
    .division-division2 .node-body ul#views-widget-per-page,
    .division-division2 .gallery-carousels-thumbs ul li img.selected,
    .division-division2 #main div#sidebar-fixed .contact-widget, .division-division2 #main div#sidebar-fixed .share-widget,
    .division-division2 #main div#sidebar-fixed .contact-widget .content-wrapper, .division-division2 #main div#sidebar-fixed .share-widget .content-wrapper {
        border-color: #4F4191 !important;
    }
    .division-division2 form[id*="case-study"] .views-exposed-widget[class*="-button"] input,
    .division-division2 .node-body h1, .division-division2 .case-study__item h2 a,
    .division-division2 .customSelectInner,
    .division-division2 form[id*="case-study"] .views-widget select option:hover,
    .division-division2 .node-body ul#views-widget-per-page li.selected, .division-division2 .details__quote,
    .division-division2 h2,
    .division-division2 #content .node-body a {
        color: #4F4191 !important;
    }
    .division-division2 .region-sidebar-first h2,
    .division-division2 form[id*="case-study"] .views-exposed-widget[class*="-button"].views-submit-button input,
    .division-division2 #content .node-body .case-study__button,
    .division-division2 #main div#sidebar-fixed .contact-widget .widget__bar, .division-division2 #main div#sidebar-fixed .share-widget .widget__bar {
        background: #4F4191 !important;
        color: white !important;
    }
    .division-division2 .case-study__button .flag__stub {
        background: #403575;
    }

    /*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<
    || Visual - #007B84 - Divison 3
    >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>*/
    .division-division3 form[id*="case-study"] .views-exposed-widget[class*="-button"].views-submit-button input,
    .division-division3 form[id*="case-study"] .views-exposed-widget[class*="-button"] input,
    .division-division3 .case-study__item,
    .division-division3 form[id*="case-study"] .views-exposed-widget.open,
    .division-division3 .node-body ul#views-widget-per-page,
    .division-division3 .gallery-carousels-thumbs ul li img.selected,
    .division-division3 #main div#sidebar-fixed .contact-widget, .division-division3 #main div#sidebar-fixed .share-widget,
    .division-division3 #main div#sidebar-fixed .contact-widget .content-wrapper, .division-division3 #main div#sidebar-fixed .share-widget .content-wrapper {
        border-color: #007B84 !important;
    }
    .division-division3 form[id*="case-study"] .views-exposed-widget[class*="-button"] input,
    .division-division3 .node-body h1, .division-division3 .case-study__item h2 a,
    .division-division3 .customSelectInner,
    .division-division3 form[id*="case-study"] .views-widget select option:hover,
    .division-division3 .node-body ul#views-widget-per-page li.selected, .division-division3 .details__quote,
    .division-division3 h2,
    .division-division3 #content .node-body a {
        color: #007B84 !important;
    }
    .division-division3 .region-sidebar-first h2,
    .division-division3 form[id*="case-study"] .views-exposed-widget[class*="-button"].views-submit-button input,
    .division-division3 #content .node-body .case-study__button,
    .division-division3 #main div#sidebar-fixed .contact-widget .widget__bar, .division-division3 #main div#sidebar-fixed .share-widget .widget__bar {
        background: #007B84 !important;
        color: white !important;
    }
    .division-division3 .case-study__button .flag__stub {
        background: #016971;
    }

    /*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<
    || Pro Cam - #0D4774 - Division 4
    >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>*/
    .division-division4 form[id*="case-study"] .views-exposed-widget[class*="-button"].views-submit-button input,
    .division-division4 form[id*="case-study"] .views-exposed-widget[class*="-button"] input,
    .division-division4 .case-study__item,
    .division-division4 form[id*="case-study"] .views-exposed-widget.open,
    .division-division4 .node-body ul#views-widget-per-page,
    .division-division4 .gallery-carousels-thumbs ul li img.selected,
    .division-division4 #main div#sidebar-fixed .contact-widget, .division-division4 #main div#sidebar-fixed .share-widget,
    .division-division4 #main div#sidebar-fixed .contact-widget .content-wrapper, .division-division4 #main div#sidebar-fixed .share-widget .content-wrapper {
        border-color: #0D4774 !important;
    }
    .division-division4 form[id*="case-study"] .views-exposed-widget[class*="-button"] input,
    .division-division4 .node-body h1, .division-division4 .case-study__item h2 a,
    .division-division4 .customSelectInner,
    .division-division4 form[id*="case-study"] .views-widget select option:hover,
    .division-division4 .node-body ul#views-widget-per-page li.selected, .division-division4 .details__quote,
    .division-division4 h2,
    .division-division4 #content .node-body a {
        color: #0D4774 !important;
    }
    .division-division4 .region-sidebar-first h2,
    .division-division4 form[id*="case-study"] .views-exposed-widget[class*="-button"].views-submit-button input,
    .division-division4 #content .node-body .case-study__button,
    .division-division4 #main div#sidebar-fixed .contact-widget .widget__bar, .division-division4 #main div#sidebar-fixed .share-widget .widget__bar {
        background: #0D4774 !important;
        color: white !important;
    }
    .division-division4 .case-study__button .flag__stub {
        background: #0c3d63;
    }

    /*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<
    || - Division 5
    >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>*/

    /*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<
    || Security - #651D32 - Division 6
    >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>*/
    .division-division6 form[id*="case-study"] .views-exposed-widget[class*="-button"].views-submit-button input,
    .division-division6 form[id*="case-study"] .views-exposed-widget[class*="-button"] input,
    .division-division6 .case-study__item,
    .division-division6 form[id*="case-study"] .views-exposed-widget.open,
    .division-division6 .node-body ul#views-widget-per-page,
    .division-division6 .gallery-carousels-thumbs ul li img.selected,
    .division-division6 #main div#sidebar-fixed .contact-widget, .division-division6 #main div#sidebar-fixed .share-widget,
    .division-division6 #main div#sidebar-fixed .contact-widget .content-wrapper, .division-division6 #main div#sidebar-fixed .share-widget .content-wrapper {
        border-color: #651D32 !important;
    }
    .division-division6 form[id*="case-study"] .views-exposed-widget[class*="-button"] input,
    .division-division6 .node-body h1, .division-division6 .case-study__item h2 a,
    .division-division6 .customSelectInner,
    .division-division6 form[id*="case-study"] .views-widget select option:hover,
    .division-division6 .node-body ul#views-widget-per-page li.selected, .division-division6 .details__quote,
    .division-division6 h2,
    .division-division6 #content .node-body a {
        color: #651D32 !important;
    }
    .division-division6 .region-sidebar-first h2,
    .division-division6 form[id*="case-study"] .views-exposed-widget[class*="-button"].views-submit-button input,
    .division-division6 #content .node-body .case-study__button,
    .division-division6 #main div#sidebar-fixed .contact-widget .widget__bar, .division-division6 #main div#sidebar-fixed .share-widget .widget__bar {
        background: #651D32 !important;
        color: white !important;
    }
    .division-division6 .case-study__button .flag__stub {
        background: #501828;
    }

    /*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<
    || Business Software Solutions - #006AB0 - Division 7
    >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>*/
    .division-division7 form[id*="case-study"] .views-exposed-widget[class*="-button"].views-submit-button input,
    .division-division7 form[id*="case-study"] .views-exposed-widget[class*="-button"] input,
    .division-division7 .case-study__item,
    .division-division7 form[id*="case-study"] .views-exposed-widget.open,
    .division-division7 .node-body ul#views-widget-per-page,
    .division-division7 .gallery-carousels-thumbs ul li img.selected,
    .division-division7 #main div#sidebar-fixed .contact-widget, .division-division7 #main div#sidebar-fixed .share-widget,
    .division-division7 #main div#sidebar-fixed .contact-widget .content-wrapper, .division-division7 #main div#sidebar-fixed .share-widget .content-wrapper {
        border-color: #006AB0 !important;
    }
    .division-division7 form[id*="case-study"] .views-exposed-widget[class*="-button"] input,
    .division-division7 .node-body h1, .division-division7 .case-study__item h2 a,
    .division-division7 .customSelectInner,
    .division-division7 form[id*="case-study"] .views-widget select option:hover,
    .division-division7 .node-body ul#views-widget-per-page li.selected, .division-division7 .details__quote,
    .division-division7 h2,
    .division-division7 #content .node-body a {
        color: #006AB0 !important;
    }
    .division-division7 .region-sidebar-first h2,
    .division-division7 form[id*="case-study"] .views-exposed-widget[class*="-button"].views-submit-button input,
    .division-division7 #content .node-body .case-study__button,
    .division-division7 #main div#sidebar-fixed .contact-widget .widget__bar, .division-division7 #main div#sidebar-fixed .share-widget .widget__bar {
        background: #006AB0 !important;
        color: white !important;
    }
    .division-division7 .case-study__button .flag__stub {
        background: #2073AC;
    }

    #content .content .pager li a {
        color: #333 !important;
    }

#node-body .view-case-study-listings{
    width: 682px;
}