/*

  Site Name: IHPBA
  Site URL: http://www.ihpba.org/
  Author: Peter F
  Version: 1.0 [10/2014]

*/

/* Defaults */

.mobile {
    display: none;
}

/* #Breakpoint 1 - 980px
================================================== */

    @media only screen and (min-width: 0px) and (max-width: 1000px) {

        /* Typography */
        h1 {
           line-height: 1em;
        }

        .block h2, .block h3.top {
           text-indent: 0;
           padding: 10px;
        }

        #leftCol.alt h1 {
            margin-top: 0;
        }

       /* Site wide */
        * {
            -moz-box-sizing: border-box;
            -webkit-box-sizing: border-box;
            -ms-box-sizing: border-box;
            box-sizing: border-box;
        }

        #responsive #admin-manage {
            padding: 0 10px;
        }

        /* Wrapper */

        #responsive #wrapper, #responsive .wrapper {
            width: 100%;
        }

        /* Header */

        #responsive #header .content {
            width: auto;
        }

        #responsive #header.myhpb {
            margin-bottom: 20px;
        }

        #responsive #header.myhpb .content {
            width: 80%;
        }

        #responsive #header .right {
            padding-right: 10px;
            width: 200px;
        }

        #responsive #profile,
        #responsive #content {
            padding: 0 20px;
        }

        /* -_- */
        #responsive #content #profile {
            padding: 0;
        }

        #responsive #header.myhpb .logo {
            max-width: 120px;
            margin: 0 0 0 20px;
            line-height: 91px;
        }

        #responsive #header.myhpb a.myhpb {
            margin-bottom: 15px;
        }

        #responsive #header.myhpb #google_translate_element {
            float: right;
            position: static;
            margin: 14px 0;
        }

        #responsive #header.myhpb .loggedin {
            width: 100%;
            max-width: 320px;
        }

        #responsive #homeLeft {
            width: 33%;
        }

            #responsive #homeLeft  .block .holder {
                width: 100%;
            }

        #responsive #homeRight {
            width: 66%;
        }

            #responsive #homeRight .social-bar,
            #responsive #homeRight .holder {
                width: 100%;
            }

            /* Home page news block */
            #responsive ul.newslist li {
                width: 100%;
                border: 0;
                padding: 0 0 20px 0;
            }

            #responsive ul.newslist li.last{
                padding: 0;
            }

            #responsive ul.newslist li .content {
                width: 80%;
            }


        #responsive #homeRight .social-bar form {
            width: 60%;
        }

        #responsive #homeRight .social-bar form > label {
            width: 20%;
            float: left;
            padding-right: 10px;
            text-align: right
        }

        #responsive #homeRight .social-bar form .bg {
            width: 80%;
            float: right;
        }

            #responsive #header.myhpb .left {
                width: 300px;
            }

                #responsive #header.myhpb #search-site {
                    width: 100%;
                    margin: 0;
                    float: right;
                }

                #responsive  #header.myhpb #search-site input#search {
                    width: 80%;
                }

                #responsive  #header.myhpb #search-site #search-submit {
                    width: 20%;
                }

            #responsive #header.myhpb .right {
                width: 56%
            }

            #responsive #header.myhpb .loggedin {
                float: right;

            }


        /* Nav */

        #responsive #nav ul {
            display: table;
            width: 95%;
            margin: 0 auto;
        }

        #responsive #nav ul li {
            display: table-cell;
            float: none;
        }

            #responsive #nav ul li ul li {
                display: block;
                float: left;
                clear: left;
                width: 100%;
                text-align: left;
            }

        #responsive #nav > ul li:first-child {
            display: none;
        }

        #responsive #nav ul li:nth-child(2) a {
            border: 0
        }

        #responsive #nav ul li a {
           padding: 0 4px;
           font-size: 0.9em;
           width: 100%;
           text-align: center;
            font-family: "proxima-nova", sans-serif;
            font-weight: 400;
       }

            #responsive #header.myhpb #nav {
                margin: 15px 0 0 0;
            }

            #responsive #header.myhpb #nav ul li a{
                padding: 0 5px;
            }

            #responsive #nav ul li ul li a {
                text-align: left;
                padding: 5px 0;
            }



       /* Banner */
       /*#responsive #banner img {
           max-width: 70%;
           margin-top: 50px;
       }*/

       #responsive #banner .slide {
           height: 420px;
       }

       #responsive #banner h2 {
        font-size: 32px;
       }

        /* Content */

        #responsive #leftCol {
            width: 70%;
            margin-right: 2%;
        }

            #responsive #leftCol .block .holder {
                width: 100%;
            }

        #responsive #rightCol {
            width: 28%;
        }

            #responsive #rightCol .block .holder.image,
            #responsive #rightCol .block .holder {
                width: 100%;
            }

        #responsive #leftCol.full {
            width: 100%;
            margin-right: 0;
        }

        /* My HPB Main page */
        #responsive .memberArea .heading,
        #responsive .memberArea .content {
           width: 100%;
        }

        #responsive .block .holder {
           width: 100%;
        }

        #responsive .homeRight {
            width: 70%;
            margin-left: 2%;
        }

        #responsive .homeLeft {
            width: 28%;
        }

        #responsive #homeSlider ul.slides li .image {
            width: 39%;
            max-width: 180px;
            margin-bottom: 10px;
        }

            #responsive #homeSlider ul.slides li .image img {
                height: auto;
            }

        #responsive #homeSlider ul.slides li .content {
            width: 59%;
        }

        #responsive #recent-discussions ul li .status, .recentList ul li .status {
            white-space: nowrap;
        }

        #responsive #leftCol .holder {
            width: 100%;
        }

        #responsive .memberArea .content .panel {
            width: 50%;
        }

        #responsive .memberArea .sponsor {
            width: 100%;
            height: 150px;
            font-size: 1em;
        }

        #responsive .memberArea .sponsor img {
            padding: 20px 30px;
        }

        #responsive .panels .panel,
        #responsive .panels .panel.two,
        #responsive .panels .panel.three {
            width: 100%;
            margin: 0;
            padding: 20px;
            height: auto;
        }

        #responsive .panels .panel.two {
            background: #9e1d53;
        }

        #responsive #how-it-works .panels .panel h2 {
            margin: 0;
            width: 32%;
            float: left;
            font-size: 18px;
        }

        #responsive #how-it-works .panels .panel hr {
            display: none;
        }

        #responsive #how-it-works .panels .panel p {
            margin: 0;
            width: 44%;
            float: left;
            padding: 0 1%;
        }

        #responsive #how-it-works .panels .panel a.btn {
            float: left;
            width: 24%;
            font-size: 15px;
            position: static;
            text-align: center;
        }

        #responsive #accordian .option .top {
            width: 100%;
        }

        #responsive #accordian .option .top .icon-angle-down, #responsive #accordian .option .top .icon-angle-up {
            top: 2px;
        }

        /* MyHPB Complete CPD Page */
        #responsive .cpd.right {
            width: 40%;
        }


        /* CPD Pages */
        #responsive #cpdTop .col_3 {
            width: 32%;
            margin-right: 2%;
        }

        #responsive #cpdTop .col_3.last {
            margin-right: 0;
        }

        #responsive #cpdTop .image {
            width: 25%;
        }

        #responsive #cpdTop .content {
            width: 38%;
        }

        #responsive #cpdTop .details {
            width: 100%;
        }

        #responsive #leftCol h2 {
            clear: both;
        }

        #responsive #cpdProgress li .number {
            left: -15%;
            top: 38%;
            height: 28px;
            width: 28px;
            line-height: 22px;
            font-size: 15px;
        }

        /* Holders */
        #responsive .holder-full {
            width: 100%;
            padding: 20px 4%;
        }

        /* Chapter List */
        #responsive #chapterList .block {
           width: 25%;
           margin-left:0;
        }
         #responsive .chapterList .block {
           width: 25%;
           margin-left:0;
        }
        /* Members Area */

        #responsive #member-blocks .content {
            margin-left: 20px;
        }

        #responsive #member-blocks .block strong {
            width: 150px;
        }

        #responsive #member-blocks .look-up i.icon-user {
            left: 33px;
        }

        /* News List */
        #responsive #newslist li .content {
            width: 65%;
        }

        /* Articles */

        #responsive #article #comments li .content {
            width: 88%;
        }

        #responsive #article #comments .summary {
            width: 100%;
            margin-top: 20px;
        }

        /* Meetings */
        #responsive #meetingComments .summary {
           width: 100%;
        }

        #responsive table.commitees .btn {
            white-space: nowrap;
        }

        #responsive table.commitees .btn i {
            padding-left: 10px;
        }

        /* Discussions */

        #responsive #discussions li .content h2 {
            clear: none;
        }

        #responsive #discussions li .content {
            padding-left: 10px;
        }

        #responsive #discussions li .image, #responsive .newsList li .image {
            max-width: 30%;
            margin: 0;
        }

        #responsive #discussions li .image img, #responsive .newsList li .image img {
            height: auto;
        }

        #responsive #discussions #case-of-month ul li .content,
        #responsive #discussions li .content {
            width: 77%;
            padding-left: 10px;
        }

        #responsive #pages .newsList li .content,
        #responsive #cpd .newsList li .content {
            width: 100%;
            clear: both;
            padding: 10px 0 0 0;
        }

        #responsive #cpd .newsList .points {
            top: 15px;
        }

        /* Footer */

        #responsive #footer .top {
            padding: 30px 20px;
        }

        #responsive #footer .col {
            min-height: 0;
        }

        #responsive #footer .btn, #responsive #footer a.readmore  {
            position: static;
            float: left;
        }

        #responsive #footer a.readmore  {
            float: right;
            left: auto;
            bottom: auto;
            text-align: right;
        }

        #responsive #footer .col li {
            width:  50%;
        }

        #responsive #footer .col.partners,
        #responsive #footer .col.benefits {
            width: 100%;
            border-bottom: 1px solid #d8d8d8;
            margin-bottom: 20px;
            padding-bottom: 20px;
        }

        #responsive #footer .col.journal,
        #responsive #footer .col.three {
            width: 50%;
            min-height: 320px;
        }

        #responsive #footer .col.journal {
            border-left: 0;
            padding-left: 0;
        }

        /* Profiles */
        #responsive #profile .profile-view .rightCol {
            width: 30%;
        }

        #responsive #profile .profile-view .leftCol {
            width: 68%;
        }

        #responsive #profile .profile-view dl.info dt,
        #responsive #profile .profile-view dl.info dd,
        #responsive #profile .profile-detail .details,
        #responsive #profile .activity .col_2,
        #responsive #profile .leftCol .block .holder {
            width: 100%;
        }

        #responsive #profile .profile-view {
            margin-bottom: 0;
        }

        #responsive #profile .profile-detail .details {
            text-align: center;
        }

        #responsive #profile .profile-view dl.info dt i {
            display: none;
        }

        #responsive #profile .activity {
            margin-top: 20px;
        }

        #responsive #quiz,
        #responsive #leftCol ul.moderate,
        #responsive .controls {
            width: 100% !important;
        }

        #responsive #quiz .submit-answer {
            margin-left: 0;
        }

        #responsive .cpdContent {
            clear: both;
        }

    }


    @media only screen and (min-width: 0px) and (max-width: 880px) {

        /* Header */

        #responsive #header .content {
            padding: 0 20px;
            width: 83%;
        }

            #responsive #header .content p.featured {
                display: none;
            }

        #responsive #header .left {
            width: 65%;
        }

        #responsive #header.myhpb .left {
           width: 44%;
        }

            #responsive #header .left label {
                display: none;
            }

        #responsive #newsletter-signup {
            float: left;
            padding: 14px 0;
        }

            #responsive #homeRight .social-bar form label span {
                display: none;
            }


        #responsive #header #search-site {
            clear: left;
            width: 100%;
            margin: 0;
        }

            #responsive #header #search-site input#search {
                width: 80%;
                background: #FFF;
            }

            #responsive #header #search-site input#search::-webkit-input-placeholder {
                color: #9a134b !important;
            }

            #responsive #header #search-site input#search:-moz-placeholder {
                color: #9a134b !important;
            }

            #responsive #header #search-site input#search::-moz-placeholder {
                color: #9a134b !important;
            }

            #responsive #header #search-site input#search:-ms-input-placeholder {
                color: #9a134b !important;
            }

            #responsive #header #search-site button {
                width: 20%;
            }

        /* Login */
        #responsive #login #login-form {
            width: 100%;
        }

        #responsive #login #login-form label {
            font-family: "proxima-nova", sans-serif;
            font-weight: 700;
        }

        /* Members Area */

        #responsive #member-blocks {
            margin-top: 0;
        }

        #responsive #member-blocks .block,
        #responsive #member-blocks .block.last {
            width: 48%;
            margin: 1% !important;
        }

        #responsive #member-blocks .content {
            margin-left: 35px;
        }

        #responsive #member-blocks .block strong {
            width: 100%;
            max-width: 170px;
        }

        #responsive #member-blocks .block.look-up .content i.icon-user {
            left: 48px;
        }

        /* My HPB Main page */


        /* Footer */

        #responsive #footer .btn, #responsive #footer a.readmore {
            position: relative;
        }

        #responsive #footer .col ul:after {
           display: block;
           width: 100%;
           clear: both;
           content: '';
        }

        #responsive #footer .col.three ul.sitemap {
            margin-bottom: 20px;
        }

        #responsive #footer .bottom {
            padding: 0 20px;
            clear: both;
        }

    }


    @media only screen and (min-width: 0px) and (max-width: 800px) {

       iframe {
           max-width: 100%;
       }

       form .row select {
           width: 100%;
       }

       form label.inline {
           width: 80%;
       }

       /* Typography */
       #responsive h1 {
           font-size: 26px;
       }

        /* Nav BG */
       #responsive .navBg {
           display: none;
       }

       /* Nav */

        #responsive #header #nav ul {
            display: block;
            width: 100%;
            float: none;
        }

        #responsive #header #nav > ul li:first-child {
            display: block;
        }

        #responsive #header #nav ul li {
            display: block;
            float: none;
        }

        #responsive #header #nav ul li a {
            display: block;
            padding: 10px 5px;
            text-align: left;
            float: none;
            }

            #responsive #header.myhpb #nav ul li a{
                padding: 10px 5px;
            }

            #responsive #header #nav ul li a i {
                float: right;
                display: block;
                -webkit-transition: all 300ms ease-in-out;
                -moz-transition: all 300ms ease-in-out;
                -o-transition: all 300ms ease-in-out;
                transition: all 300ms ease-in-out;
            }

            #responsive #header #nav ul li.open a i  {
                -webkit-transform: rotate(90deg);
                -moz-transform: rotate(90deg);
                -ms-transform: rotate(90deg);
                -o-transform: rotate(90deg);
                transform: rotate(90deg);
            }


            #responsive #header #nav ul li ul li a i {
                display: none;
            }

       #responsive #header.myhpb #nav {
           margin-top: 0;
       }

        /* Header */

       #responsive #admin-manage {
           float: none;
           overflow: hidden;
           padding: 0 10px;
       }

            #responsive #admin-manage .leftBar {
               display: none;
            }

        #responsive #header {
            border-bottom: 1px solid #e4e4e4;
            height: 94px;
        }

        #responsive #header .right a.myhpb {
            display: none;
        }

        #responsive #header a.myhpb.mobile,
        #responsive #header.myhpb .right a.myhpb {
            display: block;
            float: right;
            width: 135px;
            position: relative;
            top: 28px;
            right: 85px;
            border-radius: 10px;
            border-top: 1px solid #dfdfdf;
        }

        #responsive #header.myhpb .right a.myhpb {
            top: 5px;
            margin-bottom: 2px;
            width: 100%;
            left: 0;
            right: initial;
        }

        #responsive #header.myhpb .right a.myhpb img {
            display: inline;
        }

        #responsive #header a.myhpb.mobile img {
            float: left;
            padding: 7px 0 7px 5px;
        }

        #responsive #header .logo {
            margin: 0;
            padding: 10px;
        }

        #responsive #header.myhpb .logo {
            max-width: 180px;
            margin: 0 0 0 10px;
            line-height: 1;
        }

        #responsive #header .content {
            height: 94px;
            width: 100%;
            padding: 10px;
        }

            #responsive #header .loggedin .content {
                padding: 0;
                height: auto;
            }

            #header .loggedin .content a span.count {
                z-index: 12;
                top: -8px;
                right: -4px;
            }

            #responsive #header .content img {
                display: none;
            }

            #responsive #header.myhpb .content,
            #responsive #header.myhpb .right,
            #responsive #header.myhpb .left,
            #responsive #header .left,
            #responsive #header .right {
                width: 100%;
                float: none;
            }

            #responsive #header .right {
                padding-right: 0;
            }

            #responsive #header.myhpb .loggedin {
                max-width: 100%;
            }

            #responsive #header .right a.btn {
                float: left;
                width: 100%;
                margin-top: 8px;
                border-radius: 5px;
            }

                #responsive #header .right a.btn i {
                    padding: 0;
                    float: right;
                }

            #responsive #header #google_translate_element {
                display: none;
                right: 5px;
                top: 50px;
            }

            #responsive #header #newsletter-signup {
                display: none;
            }

            #responsive #header .loggedin {
                margin-top: 4px;
            }

            #responsive #header .loggedin strong {
                text-align: left;
                margin-bottom: 2px;
                display: none;
            }

            #responsive #header .loggedin a {
                margin: 5px  5px 5px 0;
                display: block;
                padding: 8px 10px;
                border-radius: 5px;
                background: #c0964c;
                background: -moz-linear-gradient(top,  #cea459 0%, #c0964c 100%);
                background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#cea459), color-stop(100%,#c0964c));
                background: -webkit-linear-gradient(top,  #cea459 0%,#c0964c 100%);
                background: -o-linear-gradient(top,  #cea459 0%,#c0964c 100%);
                background: -ms-linear-gradient(top,  #cea459 0%,#c0964c 100%);
                background: linear-gradient(to bottom,  #cea459 0%,#c0964c 100%);
                -pie-background: linear-gradient(to bottom, #cea459, #c0964c); /*ie 6-9 via PIE*/
                border-bottom: 2px solid #a07d3f !important;
                behavior: url(../htc/pie.htc);
                color: #FFF;
            }

            #responsive #header .loggedin a.logout {
                margin-right: 0;
                background: #98134a;
                background: -moz-linear-gradient(top,  #a33060 0%, #98134a 100%);
                background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#a33060), color-stop(100%,#98134a));
                background: -webkit-linear-gradient(top,  #a33060 0%,#98134a 100%);
                background: -o-linear-gradient(top,  #a33060 0%,#98134a 100%);
                background: -ms-linear-gradient(top,  #a33060 0%,#98134a 100%);
                background: linear-gradient(to bottom,  #a33060 0%,#98134a 100%);
                -pie-background: linear-gradient(to bottom, #a33060, #98134a); /*ie 6-9 via PIE*/
                border-bottom: 2px solid #7e103e !important;
                behavior: url(../htc/pie.htc);
            }


        /* Slider */
        #responsive #banner {
            margin: -20px 0 20px 0;
            padding: 0 0 20px 0;
        }

            #responsive #banner .slides, #responsive #banner .slide {
                height: auto;
                float: none;
                position: static;
            }

            #responsive #banner .slide {
                padding: 15px;
                background: #F9F9F9;
                width: 100% !important;
                margin-bottom: 20px;
            }


            #responsive #banner .controls {
                bottom: -20px;
                position: relative;
                width: 100%;
                overflow: hidden;
            }

            #responsive #banner .controls .bx-pager {
                left: 50%;
                float: left;
                position: relative;
            }

            #responsive #banner .controls .bx-pager-item {
                position: relative;
                right: 50%;
                display: block;
            }

            #responsive #banner .controls .bx-pager-item a {
                margin: 3px 0 0 3px;
                display: block;
            }

            #responsive #banner img {
                max-height: 100%;
                width: auto;
                max-width: 100%;
                margin-top: 0;
            }


            #responsive #banner .imageWrap {
                margin-top: 0;
            }


            #responsive  #banner .content {
                max-width: 55%;
                top: 30px;
                position: static;
            }

            #banner .content .button {
                width: auto;
                padding: 0;
            }

            #responsive #banner .content .button .btn {
                margin: 10px auto 15px auto;
                display: block;
                float: none;
                text-align: center;
                max-width: 220px;
            }

            #responsive #banner .content h2 {
                font-size: 22px;
            }

         /* Login */
        #responsive #login .left,
        #responsive #login .right {
            width: 100%;
            float: none;
            border: 0;
            padding: 0;
        }

        #responsive #login #login-form {
            margin: 0 0 20px 0;
        }


         /* Members */
         #responsive .member-details a {
            float: left !important;
            margin-bottom: 10px;
         }

         #responsive .member-details a.btn i {
            float: right;
            padding: 1px 0 0 10px;
         }

         #responsive .member-details strong {
            clear: both;
            display: block;
            width: 100%;
            content: '';
        }

        #responsive #leftCol .row select, #profile form .row select {
            width: 100%;
        }

        /* Home page content block */
        #responsive #homeRight,
        #responsive #homeLeft {
            width: 100%;
        }

            #responsive #homeLeft .block {
                background: #f9f7f7;
                border: 1px solid #e4e4e4;
                margin-bottom: 20px;
            }

            #responsive #homeLeft .block .holder {
                float: right;
                width: 70%;
                border: 0
            }

            #responsive #homeLeft .holder.image {
                float: left;
                width: 30%;
                border-right: 1px solid #e4e4e4;
            }

            #responsive #homeRight .holder {
                width: 100%;
            }


        /* Content */

        #responsive #leftCol,
        #responsive #rightCol {
            width: 100%;
        }

        #responsive #leftCol {
            padding-bottom: 20px;
        }

        #responsive #rightCol #subnav ul {
            margin: 0;
        }

        #responsive #rightCol #subnav ul li a {
            margin-left: 0;
            padding: 8px 15px;
            width: 100%;
            font-size: 15px;
        }

        #responsive #keyword-search .search-bar button, .search-bar button {
            border-bottom: 1px solid #e5e5e5;
        }

        #responsive #content .search-bar ul.tagit {
            width: 65%;
            overflow: hidden;
        }

        /* My HPB Home Page */
        #responsive .homeTop h1 {
           line-height: 1.3em;
        }

        #responsive #homeSlider .bx-prev, #responsive  #homeSlider .bx-next {
           width: 90%;
           left: 5%;
        }

        #responsive #how-it-works .panels .panel h2 {
            margin: 0;
            width: 100%;
            float: left;
            font-size: 22px;
        }

        #responsive #how-it-works .panels .panel hr {
            display: block;
        }

        #responsive #how-it-works .panels .panel p {
            width: 70%;
        }

        #responsive #how-it-works .panels .panel a.btn {
            width: 30%;
        }

        #responsive  #how-it-works a.close {
            top: 5px;
        }

        #responsive #how-it-works h1,
        #responsive #how-it-works p {
            text-align: left;
        }

        #responsive #recent-discussions ul li h3, #responsive .recentList ul li h3 {
            width: 70%;
        }

        /* CPD Pages */

        #responsive #cpdTop .image img {
            max-width: 100%;
            margin: 0;
        }

        #responsive #cpdTop .col_3 {
            margin: 20px 0 0 0;
            width: 100%;
        }

        #responsive #cpdTop .image  {
            margin-top: 0;
        }

        #responsive #cpdTop .details .points {
            margin: 0;
            padding: 10px 0;
            margin-bottom: 10px;
        }

        #responsive #leftCol ul.moderate {
            width: 100% !important;
        }

        #responsive #leftCol ul.events li img {
            max-width: 20%;
        }

        #responsive #leftCol #image-gallery li {
            width: 48%;
            margin: 1%;
        }

        #responsive #leftCol #image-gallery li img {
            min-width: 100%;
            min-height: 100%;
            max-width: initial;
        }

        #responsive #image-gallery ul {
            margin-bottom: 10px;
        }

        #responsive #cpdProgress li {
            text-align: center;
        }

        #responsive #cpdProgress li h3 {
            font-size: 18px;
        }

        #responsive #cpdProgress li img {
            float: none;
            margin: 0 auto 10px auto;
        }

        #responsive #cpdProgress li .number {
            top: 22%;
            left: -16%;
        }

        #responsive .cpdProgress-strip, #responsive .cpdProgress-strip-add {
            left: 14px;
        }

        #responsive .cpd-steps {
            top: 30px;
            left: 0px;
            font-size: 10px;
        }

        #responsive .articleWrap img {
            display: block;
            margin: 0 auto;
            float: none !important;
        }

        /* Messages */

       #responsive #messages li {
           width: 100%;
       }

        #responsive #messages li .details {
            position: static;
            width: 100%;
        }

        #responsive #messages li .details img {
            float: left;
            margin-right: 10px;
        }

        #responsive #messages li .content {
            width: 100%;
            margin-top: 10px;
        }

        #responsive #messages li .content .arrow {
            top: -13px;
            left: 10px;
            width: 19px;
            height: 13px;
            background: url(../comment-arrow-up.html) no-repeat -30px 0;
        }

        #responsive #messages #add-comment {
            width: 100%;
        }

        #responsive #profile .top-full a.btn.back span {
            display: none;
        }

        #responsive #profile .top-full a.btn.back {
            margin-right: 8px;
        }

        #responsive #profile .top-full a.btn.back i {
            padding: 0 5px 0 0 !important;
        }

        #responsive #profile .top-full h1 {
            margin-bottom: 10px;
            width: 100%;
        }

        #responsive #profile .top-full a.btn {
            margin-left: 0;
            height: 34px;
            float: left !important;
            margin-bottom: 10px;
            margin-right: 10px;
        }

        #responsive .add-attachment-wrap {
            width: 100%;
            margin: 10px 0;
        }

        #responsive .add-attachment-wrap .dropdown {
            width: 100%;
        }

        #responsive .add-attachment-wrap .btn {
            float: right
        }

        #responsive #profile #keyword-search .search-bar {
            width: 100%;
            margin-bottom: 10px;
        }

        #responsive #msgList li .from {
            width: 25%;
        }

        #responsive #msgList li .msg {
            width: 75%;
        }

        #responsive #profile #keyword-search p.msg-count {
            float: left;
        }

        /* Profiles */
        #responsive #profile .profile-view .rightCol,
        #responsive #profile .profile-view .leftCol,
        #responsive #profile .profile-view dl.info dt,
        #responsive #profile .profile-view dl.info dd,
        #responsive #profile .profile-detail .details,
        #responsive #profile .activity .col_2,
        #responsive #profile .leftCol .block .holder {
            width: 100%;
        }

        #responsive #profile .leftCol .block .holder h3 {
            clear: both;
            padding-top: 10px;
        }

        #responsive #profile .profile-view {
            margin-bottom: 0;
        }

        #responsive #profile .profile-detail .details {
            text-align: center;
        }

        #responsive #profile .profile-view dl.info dt i {
            display: none;
        }

        #responsive #profile .activity {
            margin-top: 20px;
        }

        /* Video Masterclass */
        #responsive #accordian .option .top,
        #responsive #accordian .option .content,
        #responsive #accordian .option .content ul,
        #responsive #accordian .option .content li {
            width: 100%;
        }

        #responsive .search-filter .filter-submit {
            width: 100%;
            margin: 20px 0;
        }

        /* Browse Pages */

        #responsive .msgBox {
            width: 100%;
            font-size: 14px;
            padding: 5%;
            font-family: "proxima-nova", sans-serif;
            font-weight: 400;
        }

        #responsive .featured-content .col {
            width: 48%;
            margin: 0 1%;
            height: auto;
        }

        #responsive .featured-content .col.last {
            margin: 0 auto !important;
            float: none;
            clear: both;
            text-align: center;
        }

        #responsive .featured-content .col img {
            margin: 0 auto;
        }

        #responsive .featured-content .col a {
            display: block;
            text-align: center;
            margin: 0 0 10px 0;
        }

        /* Articles */

        #responsive #article > h1,
        #responsive #article p.details {
           padding-right: 50px;
        }

        #responsive #article #comments .summary strong {
            font-size: 17px;
        }

        #responsive #article #comments .summary .btn i {
            padding-left: 5px;
        }

        #responsive #article #comments .summary .btn {
            padding: 5px 10px;
        }

        #responsive #content #wmd-preview {
            width: 100%;
        }

        #responsive #article #comments li .author {
            width: 66%;
        }

        #responsive #article #comments li .author span {
            width: 100%;
        }

        #responsive #article #comments li .author p {
            float: left;
            width: 63%;
        }

        #responsive #article #comments li .details {
            float: right;
            width: 34%;
            max-width: 95px;
        }

            #responsive #article #comments li .details p.vote-standing {
                width: 45px;
                float: right;
                margin-top: 8px;
            }

            #responsive #article #comments li .author img {
                margin-right: 10px;
            }

        #responsive #article #comments li .content .arrow {
            top: -13px;
            left: 10px;
            width: 19px;
            height: 13px;
            background: url(../comment-arrow-up.html) no-repeat -30px 0;
        }

        #responsive #article #comments li .content {
            width: 100%;
            margin-top: 10px;
        }


        /* Admin - edit */
        #responsive #leftCol .row select {
            height: auto !important;
        }

        #responsive #content .top-full  h1 {
            margin-bottom: 10px;
        }

        #responsive #content .top-full a.btn.back {
            float: left !important;
            margin-bottom: 10px;
        }

        /* Footer */
        #responsive #footer .el {
            padding: 10px 20px;
        }

        #responsive #footer .social.el {
            padding: 10px 0;
            margin: 0;
            border: 0;
        }

        #responsive #footer .col.three .social a {
            float: right;
        }

        #responsive #footer .col.three .social a.twitter {
            float: left;
        }

        #responsive #footer .hidden {
            display: none;
            font-size: 0.85em;
        }

        #responsive #footer .col.partners,
        #responsive #footer .col.benefits,
        #responsive #footer .col.journal,
        #responsive #footer .col.three {
            border: 0;
            padding: 10px 0;
            margin-bottom: 0;
            width: 100%;
            float: none;
            min-height: 0;
            clear: both;
        }


        /* Footer */
        #responsive #footer .col li {
           width:  100%;
        }

        #responsive #footer .col.three ul.sitemap li {
            width: 50%;
        }

        #responsive #footer h2 {
            cursor: pointer;
            padding-bottom: 5px;
            display: block;
            border-bottom: 1px solid #DDD;
        }

            #responsive #footer h2 i {
                display: none;
            }

            #responsive #footer h2:after {
                display: block;
                content: "\f055";
                font-family: 'FontAwesome';
                float: right;
                width: 20px;
                height: 20px;
                padding: 4px 0;
                font-size: 0.8em;
            }

            #responsive #footer h2.open:after {
                content: "\f056";
            }

        #responsive #footer .bottom {
            padding: 0 15px;
        }

    }

    @media only screen and (min-width: 0px) and (max-width: 690px) {

        /* Members Area */

        #responsive #member-blocks .content {
            margin-left: 4%;
        }

        #responsive #member-blocks .block.look-up .content i.icon-user {
            left: 9%;
        }

        /* Threads & Comments */

       #responsive #meetingComments li .details {
           width: 100%;
           margin-top: 10px;
       }

        #responsive #meetingComments li .content .arrow {
            top: -13px;
            left: 15px;
            width: 19px;
            height: 13px;
            background: url(../comment-arrow-up.html) no-repeat -30px 0;
        }

        #responsive #meetingComments li .content {
            width: 100%;
            margin-top: 5px;
        }

        #responsive #article #comments li .author span.moderator {
            margin-top: -5px;
            position: static;
            text-align: left;
        }

        /* My HPB Main page */
        #responsive .homeRight,
        #responsive .homeLeft,
        #responsive .col_2 {
            width: 100%;
            margin-right: 0;
        }

        #responsive .memberArea .heading h2 {
            font-size: 15px;
            padding-left: 10px;
        }

        /* My HPB Browse & Search page */

        #responsive ol#options li .count {
            width: 30px;
            height: 29px;
            line-height: 22px;
            font-size: 15px;
            left: -13%;
        }

        #responsive ol#options li h2 {
            margin-top: 3px;
        }

        #responsive .cpd-content {
            width: 100%;
        }

        #responsive .cpd.right {
            float: none !important;
            margin: 0 auto;
        }

        /* My HPB Complete your profile page */
        #responsive .browse-info.profile .btn {
           top: 0;
           margin-left: 20px;
        }

        /* Discussion */
        #responsive #cpd .newsList .points img {
            display: none;
        }

        /* News */
        #responsive .news-item img.feature {
            float: none;
            margin: 0 auto;
            padding: 0 20px;
            display: block;
        }

    }

    @media only screen and (min-width: 0px) and (max-width: 630px) {

        /* Button */
        #responsive .btn.clear {
            display: block;
        }

        /* Lists */
       #responsive #leftCol ul li,
       #responsive #leftCol .cms-content ul li,
       #responsive ul.styled li,
       #responsive#leftCol .wmd-preview ul li,
       #responsive #leftCol .cpdContent ul li,
       #responsive #leftCol #article #comments li .content li {
           word-break: break-word;
       }

        /* Slider */

        #responsive #banner .slide .imageWrap {
            position: relative;
            overflow: hidden;
            max-width: 100%;
            width: 100%;
            margin-bottom: 20px;
            border: 1px solid #EFEFEF;
        }

        #responsive #banner img {
           width: 116%;
           max-width: none;
           float: right;
        }

        #responsive  #banner .content {
            width: 100%;
            max-width: 100%;
            border-bottom: 1px solid #d9d9d9;
        }

            #responsive #banner .content p {
               width: 100%;
            }

            #responsive #banner .content .button {
               border-bottom: 0;
           }

           #responsive #banner .content h2 {
               font-size: 22px;
           }

        /* Home page news block */
        #responsive ul.newslist li {
            width: 100%;
            border: 0;
            float: none;
            display: block;
            padding: 0 0 30px 0;
        }

        #responsive ul.newslist li.last {
            padding: 0;
        }

        #responsive ul.newslist li .content {
            max-width: 78%;
        }

        #responsive ul.newslist li:after {
            display: block;
            content: '';
            width: 100%;
            clear: both;
        }

            #responsive ul.newslist li.last {
                padding-left: 0;
            }

            #responsive ul.newslist li > a {
                display: block;
                float: left;
                margin-top: 5px;
            }

        #responsive #homeRight .social-bar {
            height: auto;
        }

        #responsive #homeRight .social-bar form {
            border-top: 1px solid #d9d9d9;
            width: 100%;
            display: block;
            clear: both;
        }

            #responsive #homeRight .social-bar form .bg {
                height: 36px;
            }

            #responsive #homeRight .social-bar form label {
                padding-left: 10px;
                margin: 0;
                line-height: 36px;
                height: 36px;
                text-align: left;
            }

        /* News List */

        #responsive #newslist li .content {
            width: 100%;
            margin: 10px 0;
        }

        /* Members Area */

        #responsive #member-blocks .content {
            margin: 0;
            width: 100%;
            padding: 20px 15px;
            text-align: center;
        }

        #responsive #member-blocks .block .content i {
            float: none;
            margin: 0 auto;
            border: 0;
            padding: 10px 0;
            border-bottom: 1px solid #cecece;
        }

        #responsive #member-blocks .block.look-up .content i.icon-user {
            border: 0;
            left: 50%;
            width: 16px;
            margin-left: -11px;
            top: 34px;
        }

        #member-blocks .last img {
            margin: 0 auto;
            padding: 20px;

        }

        #responsive #member-blocks .block strong {
            text-align: center;
            max-width: 100%;
            padding: 10px 0;
            font-size: 0.9em;
        }

        /* Thread table */

        #responsive table.thread td {
           width: 100%;
           float: left;
            border-bottom: 0;
        }

        #responsive table.thread td:first-child {
           margin-top: 20px;
           font-weight: bold;
            border-bottom: 1px solid #f1f0f0;
        }

        #responsive #meetingComments .summary strong {
            font-size: 15px;
        }

        #meetingComments .summary a.btn {
            font-size: 0.75em;
        }

        /* MyHPB Home Page */

        #responsive .memberArea .content .panel {
            width: 100%;
            border: 0;
            border-top: 1px solid #EEE;
            padding: 10px 0;
        }

        #responsive .memberArea .content .panel:first-child {
            border: 0;
        }

        #responsive #how-it-works .panels .panel p {
            width: 100%;
        }

        #responsive #how-it-works .panels .panel a.btn {
            width: 220px;
            margin: 20px auto;
        }

        #responsive .memberArea .heading .logo {
            display: none;
        }

        /* Tables */

        table.styled {
            display: block;
            width: 100%;
            position: relative;
            background: #c99f54;
            background: -moz-linear-gradient(top,  #cea459 0%, #c0964c 100%);
            background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#cea459), color-stop(100%,#c0964c));
            background: -webkit-linear-gradient(top,  #cea459 0%,#c0964c 100%);
            background: -o-linear-gradient(top,  #cea459 0%,#c0964c 100%);
            background: -ms-linear-gradient(top,  #cea459 0%,#c0964c 100%);
            background: linear-gradient(to bottom,  #cea459 0%,#c0964c 100%);
        }

        table.styled thead {
            float: left;
            display: inline-block;
        }

            table.styled thead th {
                float: left;
                clear: left;
                background: transparent;
                border-top: 1px solid rgba(255,255,255,0.2);
                width: 100%;
                height: 40px;
            }

        table.styled tbody {
            display: block;
            width: auto;
            position: relative;
            overflow-x: scroll;
            white-space: nowrap;
            background: #FFF;
            font-size: 0; /* remove space between inline-block elements */
        }

            table.styled tbody tr {
                display: inline-block;
                vertical-align: top;
                border-top: 1px solid #EEE;
                border-right: 1px solid #EEE;
            }

                table.styled tbody tr td {
                    float: left;
                    clear: left;
                    height: 40px;
                    width: 157px;
                    font-size: 14px;
                    text-overflow: ellipsis;
                    overflow: hidden;
                    white-space: nowrap;
                }

            #leftCol table.styled tr.docs {
                border-right: 0;
                position: relative;
                top: 0;
            }

            #leftCol table.styled tr.docs td {
                padding: 0;
                position: absolute;
                top: 0;
                right: 100%;
                width: 157px;
                background: none;
                height: auto;
            }

                    #leftCol table.styled tr.docs ul {
                        padding: 0;
                        display: block;
                        display: none;
                        background: #f9f7f7;
                        height: 161px
                    }

                        #leftCol table.styled tr.docs li a {
                            display: block;
                            padding: 10px;
                        }

                            #leftCol table.styled tr.docs li a span {
                                float: left;
                                font-size: .8em;
                            }

        #responsive .cms-content table {
            display: block;
            width: 100%;
        }

        #responsive .cms-content table tbody {
            display: block;
            overflow-x: scroll;
            white-space: nowrap;
            position:relative;
        }

        #responsive .cms-content table:before  {
            display: block;
            content: "Swipe left and right to browse full table";
            padding: 5px;
            font-size: 0.8em;
            color: #257ca4;
            background: #f0fdff;
            border-radius: 5px;
            margin: 10px 0;
            text-align: center;
        }

        #responsive .cms-content table tr:nth-child(even) {
            background: #f9f9f9;
            border: 0;
        }

        #responsive .cms-content table tr td {
            border: 0;
        }

        /* Footer */

        #responsive #footer {
            padding-bottom: 20px
        }

        #responsive #footer #credits,
        #responsive #footer #copyright {
            width: 100%;
            text-align: center;
            float: none !important;
            line-height: 1.6;
        }

    }

    @media only screen and (min-width: 0px) and (max-width: 470px) {

        /* Chapter List */
        #responsive #chapterList .block {
           width: 50%;
        }

        /* Buttons */
        #responsive #login #login-form .btn {
            width: 100%;
            max-width: 160px;
            display: block;
            float: none;
        }

        #responsive #login #login-form .btn i {
            padding-left: 10px;
        }

        /* Brows BLocks */

         #responsive .featured-content .col {
            width: 100%;
            margin: 0;
            height: auto;
        }


    }

    @media only screen and (min-width: 0px) and (max-width: 420px) {

        /* Home page news block */
        #responsive ul.newslist li > a {
            display: none;
        }

        #responsive ul.newslist li .content {
            max-width: 100%;
            width: 100%;
        }

        /* MyHPB Home Page */

        #responsive #homeSlider ul.slides li .content {
            width: 100%;
        }

    }

    @media only screen and (min-width: 0px) and (max-width: 370px) {

        #responsive #homeRight .social-bar form label span {
            display: none;
        }

    }