/* Target mobile --------------- */
@media only screen and (max-width : 767px)
{
    .ppp .ppp-top header.col-sm-9, .ppp-top .options, .ppp-top .ppp-rebate, .ppp-top.topOptions, .ppp-build-own > .container
    {
        padding-right: 15px !important;
        padding-left: 15px !important;
    }
    .ppp-top
    {
        padding-bottom: 0;
    }
    .ppp-top header h1, .ppp-top header p
    {
        padding-right: 15px;
        padding-left: 15px;
        text-align: center;
        font-weight: normal;
        line-height: 30px;
    }
    .ppp-top .contact
    {
        display: none;
    }
    .ppp-top .options, .ppp-top .ppp-rebate
    {
        padding-top: 0px !important;
    }
    .ppp-top .options
    {
        margin-bottom: 0;
    }
    .ppp-top .options
    {
        display: none;
    }
    .ppp-top .options.open
    {
        border-bottom: 1px solid rgba(255, 255, 255, 0.25);
    }
    .ppp-top .options .excess
    {
        width: 100%;
        margin-bottom: 20px;
    }
    .ppp-top .options .excess table.ppp-inputs-styled
    {
        float: right;
        margin-right: -10px;
    }
    .ppp-top .options .excess p a.ppp-icon-question:after
    {
        font-size: 19px;
        width: 25px;
        height: 25px;
        position: absolute;
        top: 0;
        line-height: 25px;
        vertical-align: middle;
        right: -30px;
    }
    .ppp-top .ppp-rebate
    {
        margin-top: 0;
    }
    .ppp-top .ppp-rebate, .ppp-top .ppp-filters
    {
        font-size: 11px;
    }
    .ppp-top .ppp-rebate .apply dt, .ppp-top .ppp-rebate .apply p
    {
        margin-bottom: 10px;
    }
    .ppp-top .ppp-rebate .apply dt, .ppp-top .ppp-rebate .apply p, .ppp-top .ppp-rebate .apply a
    {
        width: 100%;
        float: none;
    }
    .ppp-top .ppp-rebate .income dd, .ppp-top .ppp-rebate .income td
    {
        width: 100%;
        margin-left: 0;
    }
    .ppp-top.ppp-colour-1 .ppp-filters, .ppp-top.ppp-colour-2 .ppp-filters, .ppp-top.ppp-colour-3 .ppp-filters, .ppp-top.ppp-colour-4 .ppp-filters
    {
        border-top: solid 1px #fff;
    }
    .ppp-top .m-options-strip p
    {
        max-width: 280px;
    }
    .ppp-top .m-options-strip.filter
    {
        display: block;
    }
    .ppp-top .ppp-filters
    {
        margin-top: 0;
        border-radius: 0;
    }
    .ppp-top .ppp-filters .inputs li, .ppp-top .ppp-filters .inputs td
    {
        width: 100%;
    }
    .ppp-top .ppp-filters h3
    {
        margin-bottom: 10px;
    }
    .ppp-build-own
    {
        padding-bottom: 20px;
    }
    .ppp-build-own .inputs .col-sm-6
    {
        display: none;
    }
    .ppp-build-own .icon-arrowRight_skinny:after
    {
        content: '';
    }
    .ppp-build-own .inputs .total-quote strong span
    {
        font-size: 25px;
    }
    .ppp-build-own .ctas .popover
    {
        min-width: 150px;
    }
    .ppp-build-own .ctas .popover-content ul
    {
        display: block;
    }
    .ppp-build-own .ctas .popover-content li
    {
        display: block;
    }
    .ppp-build-own .col-sm-5.icon-arrowRight_skinny
    {
        display: none;
    }
    .ppp-build-own .inputs .total-quote
    {
        margin: 0;
        padding-left: 15px;
    }
    .ppp-build-own .inputs .ctas
    {
        padding-right: 15px;
    }
    .ppp-build-own .inputs .total-quote strong span
    {
        line-height: normal;
    }
    .ppp-build-own .visible-xs .more-list-popover.on, .ppp-build-own .visible-xs .more-coverSummary-popover.on
    {
        display: block;
    }
    .ppp-tabs
    {
        margin-top: -13px;
        background: #ededed;
    }
    .ppp-tabs.row
    {
        margin-left: 0;
        margin-right: 0;
    }
    .ppp-tabs .col-xs-6
    {
        padding-left: 0;
        padding-right: 0;
    }
    .ppp-tabs li.hospital a
    {
        margin: 0 3px 0 15px;
    }
    .ppp-tabs li.extras a
    {
        margin: 0 15px 0 3px;
    }
    .ppp .panel-hcf h2.title
    {
        line-height: normal;
    }

    /** Carousel specific **/
    .ppp-carousel .carousel-cont
    {
        margin-top: 0;
    }

    .ppp-summary .reccomend
    {
        padding-top: 0;
    }
    .reccomend .ppp-carousel .carousel-cont
    {
        margin-top: 0px;
    }
    .ppp-packages.reccomend .carousel-control
    {
        display: block;
    }
    .ppp-summary .intro .text
    {
        margin-top: 20px;
        padding-right: 20px;
        position: relative;
        font-size: 1.2em;
    }

    .ppp-summary .intro h3
    {
        font-size: 2em;
        font-weight: 300;
        line-height: 1.4em;
    }

    .ppp-carousel .headline
    {
        /*padding: 5px 15px 0;*/
        min-height: 240px;
    }

    .ppp-carousel .headline h3
    {
        min-height: 58px;
    }

    .ppp .item-inner .table-hcf td
    {
        color: #222;
    }

    .table-hcf td .icon-checkmark
    {
        font-size: 1em;
    }
    .table-hcf td .icon-warning
    {
        font-size: 1.2em;
    }
    .table-hcf td .icon-cross
    {
        font-size: 1.2em;
    }
    .ppp-carousel .table-hcf .included
    {
        /*padding-top: 2px;*/
    }

    .panel-hcf .title
    {
        font-size: 1.5em;
        padding-bottom: 0;
    }
    .scalesList li
    {
        margin-bottom: 15px;
    }

    /** Some phones have white on white so this should get around this **/
    .ppp-top select
    {
        color: #000;
    }

    section.product-summary div.action
    {
        text-align: center;
    }

    .coversummaries.container > .row section .content
    {
        padding-bottom: 10px;
    }

    .ppp-carousel
    {
        margin-bottom: -50px;
    }
    
    .ppp .action .btn-primary.btn-join
    {
        margin-bottom: 10px;
    }

    .ppp .container.coversummaries {        
        margin-top: 0px;
    }
}

/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px)
{
    /* Styles */
    .ppp-packages .carousel-control .glyphicon
    {
        top: 38%;
    }

    section.ppp-top span.title
    {
        padding-left: 5px;
        float: left;
        padding-top: 10px;
    }


    section.ppp-top span.ppp-summary-product-name
    {
        float: left;
        text-align: left;
    }
    
    section.product-summary div.price-area
    {        
    margin-top: 10px;
    margin-bottom: 10px;
    min-height: 25px;
    font-size: .9em;
    }
    .ppp .coversummaries div#progressContainer
    {
        margin: 20px 0 20px 0;    
    }
}

/* Smartphones (landscape) ----------- */
@media only screen and (min-width : 321px)
{
    /* Styles */
}

/* Smartphones (portrait) ----------- */
@media only screen and (max-width : 320px)
{
    /* Styles */
    .ppp-carousel .item-inner .item-top
    {
        height: 462px;
    }

    .ppp-carousel .carousel-cont .item-details.open .notes-wrapper
    {
        display: none;
    }

    /*progressbar connectors*/
    #progressbar li:after
    {
        width: 66%;
        left: -34%;
    }

}



/* iPhone 4 ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio : 2)
{
    /* Styles */

    #progressbar li:after
    {
        width: 80% !important;
        left: -40% !important;
    }
    
    
    section.ppp-top span.title
    {
        padding-left: 5px;
        float: left;
        padding-top: 10px;
    }
    
    section.product-summary div.price-area {
        padding: 15px 15px;
        font-weight: bold;
        float: left;
        left: 15%;
        position: relative;
    }
}

@media only screen and (min-device-width : 320px) and (max-device-width : 480px) and (orientation : portrait) and (-webkit-min-device-pixel-ratio : 2)
{
    /* Styles */
}

/* iPhone 5 ----------- */
@media only screen and (min-device-width: 320px) and (max-device-height: 568px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 2)
{
    /* Styles */
    #progressbar li:after
    {
        width: 82% !important;
        left: -41% !important;
    }

    .ppp-packages .carousel-control .glyphicon
    {
        top: 38%;
    }
    .ppp-carousel .btn.skipLevel2, li.skipHospital2
    {
        display: none;
    }
    
    section.ppp-top span.title
    {
        padding-left: 5px;
        float: left;
        padding-top: 10px;
    }
    
    section.ppp-top span.ppp-summary-product-name
    {
        float: left;
        text-align: left;
        padding-top: 10px;
    }
    
    section.product-summary div.price-area {
        padding: 15px 15px;
        font-weight: bold;
        float: left;
        left: 20%;
        position: relative;
    }
}

@media only screen and (min-device-width: 320px) and (max-device-height: 568px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 2)
{
    /* Styles */
    #progressbar li:after
    {
        width: 68% !important;
        left: -34% !important;
    }
    .ppp-carousel .btn.skipLevel
    {
        margin-top: 10px;
        font-size: 0.9em;
    }
    .ppp-carousel .btn.skipLevel2, li.skipHospital2
    {
        display: none;
    }
}

/* iPhone 6 ----------- */
@media only screen and (min-device-width: 375px) and (max-device-height: 667px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 2)
{
    /* Styles */
    .ppp-carousel .btn.skipLevel2
    {
        margin-top: -16px;
    }
    .ppp-carousel .btn.skipLevel2, li.skipHospital2
    {
        display: none;
    }
}

@media only screen and (min-device-width: 375px) and (max-device-height: 667px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 2)
{
    /* Styles */


    .ppp-carousel .item-inner .item-top
    {
        height: 462px;
    }

    .ppp-carousel .carousel-cont .item-details.open .notes-wrapper
    {
        display: none;
    }
    .ppp-carousel .btn.skipLevel
    {
        margin-top: 10px;
        font-size: 0.9em;
    }
    .ppp-carousel .btn.skipLevel2, li.skipHospital2
    {
        display: none;
    }
}

/* iPhone 6+ ----------- */
@media only screen and (min-device-width: 414px) and (max-device-height: 736px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 3)
{
    /* Styles */

    #progressbar li:after
    {
        width: 84% !important;
        left: -42% !important;
    }
           
    section.ppp-top span.title
    {
        padding-left: 5px;
        float: left;
        padding-top: 10px;
    }

    section.ppp-top span.ppp-summary-product-name
    {
        opacity: 0.5;
        padding-left: 5px;
        float: left;
        padding-top: 10px;
    }
    .ppp-carousel .btn.skipLevel2, li.skipHospital2
    {
        display: none;
    }
    
    section.product-summary div.price-area {
        padding: 15px 15px;
        font-weight: bold;
        float: left;
        left: 20%;
        position: relative;
    }
}

@media only screen and (min-device-width: 414px) and (max-device-height: 736px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 3)
{
    /* Styles */


    .ppp-carousel .item-inner .item-top
    {
        height: 462px;
    }

    .ppp-carousel .carousel-cont .item-details.open .notes-wrapper
    {
        display: none;
    }

    section.ppp-top h1.byoc-header
    {
        font-size: 1.7em;
    }

    section.ppp-top span.ppp-summary-product-name
    {
        float: left;
        text-align: left;
        padding-top: 10px;
    }
    .ppp-carousel .btn.skipLevel
    {
        margin-top: 11px;
        font-size: 0.9em;
    }
    .ppp-carousel .btn.skipLevel2, li.skipHospital2
    {
        display: none;
    }
}

/* Samsung Galaxy S3 ----------- */
@media only screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 2)
{
    /* Styles */
    #progressbar li:after
    {
        width: 84%;
        left: -42%;
    }

    .ppp-carousel .carousel-cont .item-details.open .notes-wrapper
    {
        display: none;
    }


    section.ppp-top span.ppp-summary-product-name
    {
        float: left;
    }
    .ppp-carousel .btn.skipLevel2, li.skipHospital2
    {
        display: none;
    }
}

@media only screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 2)
{
    /* Styles */

    .ppp-carousel .carousel-cont .item-details.open .notes-wrapper
    {
        display: none;
    }

    #progressbar li:after
    {
        width: 70%;
    }


    section.ppp-top span.ppp-summary-product-name
    {
        float: left;
    }
    .ppp-carousel .btn.skipLevel
    {
        font-size: 0.9em;
    }
    .ppp-carousel .btn.skipLevel2, li.skipHospital2
    {
        display: none;
    }
}

/* Samsung Galaxy S4 ----------- */
@media only screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 3)
{
    /* Styles */


    .ppp-carousel .carousel-cont .item-details.open .notes-wrapper
    {
        display: none;
    }
    .ppp-carousel .btn.skipLevel2, li.skipHospital2
    {
        display: none;
    }
}

@media only screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 3)
{
    /* Styles */

    .ppp-carousel .carousel-cont .item-details.open .notes-wrapper
    {
        display: none;
    }
    .ppp-carousel .btn.skipLevel
    {
        font-size: 0.9em;
    }
    .ppp-carousel .btn.skipLevel2, li.skipHospital2
    {
        display: none;
    }
}

/* Samsung Galaxy S5 ----------- */
@media only screen and (min-device-width: 360px) and (max-device-height: 640px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 3)
{
    /* Styles */
    #progressbar li:after
    {
        width: 84%;
        left: -42%;
    }
}

@media only screen and (min-device-width: 360px) and (max-device-height: 640px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 3)
{
    /* Styles */
    .ppp-carousel .btn.skipLevel
    {
        font-size: 0.9em;
    }
    .ppp-carousel .btn.skipLevel2, li.skipHospital2
    {
        display: none;
    }
}
