﻿html,body {
    margin:0;
    padding:0;
}
label {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    text-align: right;
    display: block;
    float: left;
    width: 160px;
    background: #DDDDDD url(/content/images/registration/formInputArrow.gif) no-repeat right;
    padding: 6px 10px 6px 5px;
    _padding: 6px 5px 6px 5px;
    color: #1D2556;
    border: 1px solid #F2F2F2;
}
#Div4 {
    float: right;
width: auto;
}
#slider {
    float:left;
    height:100%;
}
#completebuttonDiv {
    float:right;
    width:auto;
}
#Div10 {
    height: auto;
    width: 32%;
    margin-bottom: 10px;
    padding-top: 0px;
    margin-left: 25%;
    margin-right: 25%;
}
#ContentPlaceHolder1_postcodeLookupButton {
    text-decoration:none;
    text-align:left;
}
.formContentSplash input {
    background: #FFFFFF;
    border: 1px solid #ccc;
    color: #000000;
    float: left;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    margin: 0 0 0 10px;
    padding: 7px;
    width: 295px;
    zoom: 1;
}
#Div2 {
    float:right;
    width:auto;
}
#ContentPlaceHolder1_SubmitOrder {
    text-decoration: none;
    text-align: left;
}
.nextButtonStyle {
    margin-left:auto;margin-right:auto;width: 48%;
}
#completeButton {
    width: auto;
}
   #dropContainer {
        display: none;
    }

    #LM_topNavigation {
        display: block;
    }

    #r-siteFooter {
        display: block;
    }

    #siteFooter {
        display: none;
    }
.regFormRow {
    float: left;
    margin-bottom: 8px;
}
.formContentSplash {
    border-top: solid 1px #CCCCCC;
    border-bottom: solid 1px #CCCCCC;

}
.formContentSplashsmall {
    margin-left: 10px;
    border-top: solid 1px #CCCCCC;
    border-bottom: solid 1px #CCCCCC;
    float:left;
    width:40%;
    height:auto;
    background:white;
}
#rightPanel {
    width: 48%;
    height:100%;
    float:left;
    margin-top:30px;
    margin-left:10px;
}
#leftPanel {
    width: 48%;
    height: 100%;
    float: left;
}
#staticPicture {
    /*background-image: url('https://images2.drct2u.com/content/images/FGN/140716AW_IHM_PW_sofa.jpg');*/
    width:510px;
    height:215px;
    margin-top: 15%;
    margin-bottom:auto;
    float:left;
}
#ContentPlaceHolder1_OutputTablediv {
    font-size:12px;
}
#buttonPanel {
    height:auto;
    width:100%;
    float:left;
}
.BlackOutBox {
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: rgba(0, 0, 0,0.5);
    z-index:10001;
    top:0;
    right:0;
}
.confirmationPopup {
text-align: center;
    border-radius: 2px;
    width: 450px;
    border-color: black;
    background-color: white;
    margin-left: 35%;
    margin-top: 200px;
    padding: 5px;
    z-index: 10002;
    float: left;
    top: 0px;
    left: 0px;
}
#ContentPlaceHolder2_popupButtonBar {
    margin-bottom:10px;
    float: left;
    width: 98%;
    margin-left:10px;
    margin-right:10px;
}
 select {
    background: #FFFFFF;
    color: #000000;
    float: left;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    height:30px;
    font-weight: bold;
    margin: 0px 0 0 10px;
    width: 320px;
}
.modalBackground {
    background-color: #8B8B8B;
    filter: alpha(opacity=70);
    opacity: 0.7;
}
input[type="text"][disabled] {
   color: red;
}
input[type="text"]{
    color:black;
    font-weight:bold;
}
input[type="text"]:disabled{
    color:rgb(153, 153, 153);

}
.help-tip{
    position: absolute;
    right: 10px;
    text-align: center;
    background-color: #BCDBEA;
    border-radius: 50%;
    width: 24px;
    height: 24px;
    font-size: 14px;
    line-height: 26px;
    cursor: default;
}

.help-tip:before{
    content:'?';
    font-weight: bold;
    color:#fff;
}

.help-tip:hover p{
    display:block;
    transform-origin: 100% 0%;

    -webkit-animation: fadeIn 0.3s ease-in-out;
    animation: fadeIn 0.3s ease-in-out;

}

.help-tip p{	/* The tooltip */
    display: none;
    text-align: left;
    background-color: #4a4944;
    padding: 20px;
    width: 300px;
    position: absolute;
    border-radius: 3px;
    box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
    right: -4px;
    color: #FFF;
    font-size: 13px;
    line-height: 1.4;
    z-index:2000;
}

.help-tip p:before{ /* The pointer of the tooltip */
    position: absolute;
    content: '';
    width:0;
    height: 0;
    border:6px solid transparent;
    border-bottom-color:#1E2021;
    right:10px;
    top:-12px;
}

.help-tip p:after{ /* Prevents the tooltip from being hidden */
    width:100%;
    height:40px;
    content:'';
    position: absolute;
    top:-40px;
    left:0;
}

/* CSS animation */

@-webkit-keyframes fadeIn {
    0% { 
        opacity:0; 
        transform: scale(0.6);
    }

    100% {
        opacity:100%;
        transform: scale(1);
    }
}

@keyframes fadeIn {
    0% { opacity:0; }
    100% { opacity:100%; }
}
#secondaryNav {
    display:none;
}

.greenButton {
    border-radius:8px;
    border:1px solid black;
    background-color: transparent;
    background-image: url(https://images.drct2u.com/content/images/modal/modalButtonContinueBg.gif);
    cursor: pointer;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 13px;
  height: 29px;
  margin: 0;
  padding-left:8px;
  min-width: 10px;
  width:60px;
}

.inputboxs {
      color: black;
  font-weight: bold;
  background: #FFFFFF;
  border: 1px solid #ccc;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  margin: 0 0 0 10px;
  padding: 7px;
  width: 295px;
  zoom: 1;
}
@media only screen and (min-device-width:320px) and (max-device-width:1000px) {
    #outerPageContainer {
        width: 100%;
    }

    #slider {
        width: 100%;
    }

    /*#r-hdAccountList {
        top: 0px;
        left: 0px;
        position: relative;
        padding: 10px 2px 10px 10px;
        margin-bottom: 10px;
        border-bottom: 1px solid black;
        background-color: black;
        z-index: 9999;
    }

        #r-hdAccountList li {
            font-size: 14px;
            line-height: 14px;
            display: inline-block;
            padding: 0 5px;
            margin: 4px 0 0;
            border-left: 1px solid #999;
        }

            #r-hdAccountList li:first-of-type {
                padding-left: 0;
                border: 0;
            }*/

    #r-siteHeader a, #r-siteHeader a:link, #r-siteHeader a:visited, #r-siteHeader a:active, #r-siteHeader a:focus {
        color: #f1f1f1;
        text-decoration: none;
    }

    .cf::after {
        clear: both;
    }

    .cf::before, .cf::after {
        content: "";
        display: table;
    }

    #r-siteHeader, #dropContainer, #r-hdAccountList li span {
        font-family: 'GibsonRegular',Arial,Helvetica,sans-serif;
        font-weight: normal;
    }

    #r-siteHeader {
        padding: 0 0 10px 0;
        background-color: #fff;
        height: 94px;
    }

    #r-hdBranding h1 {
        background: url('https://images.drct2u.com:443/repo/IHM/mobile/header/02-images/IHM_SS15_logo.gif') 0 4px no-repeat;
        background-size: 100% auto !important;
        position: absolute;
        left: 0;
        display: block;
        margin: 0px 0 0 8px;
        width: 100px;
        height: 44px;
    }

    #dropContainer {
        display: block;
        visibility: visible;
    }

    #LM_topNavigation {
        display: none;
        visibility: hidden;
    }

    #dropContainer .btnHolder > a::after {
        background-image: url('https://images.drct2u.com:443/repo/IHM/mobile/header/02-images/mobile-header-sprites-ihm@2x.png');
        background-size: 80px 20px;
    }

    .btnPullDown::after {
        content: '';
        left: 15px;
        top: 15px;
        height: 0px;
        width: 0px;
        display: block;
        position: relative;
        border-top: 5px solid white;
        border-left: 5px solid transparent;
        border-right: 5px solid transparent;
    }

    #dropContainer .btnHolder::after {
        content: ' ';
        display: block;
        position: absolute;
        top: 0;
        right: 0;
        width: 15px;
        height: 15px;
        margin: 15px 10px 15px 0;
        background-image: url('/repo/IHM/mobile/header/02-images/mobile-header-sprites-ihm.png');
        background-position: -20px 0;
        background-repeat: no-repeat;
    }

    #r-siteFooter {
        display: none;
    }

    #siteFooter {
        display: block;
    }
    #Links ul li label{
        background: none;
        text-align:left;
    }

        #siteFooter button, #siteFooter input, #siteFooter select, #siteFooter textarea {
            font-family: 'Futura-Reg', verdana, arial, helvetica, helve, sans-serif;
            color: #333;
        }

        #siteFooter a {
            cursor: pointer;
        }
        /*  TYPOGRAPHY  ============================================================================= */

        #siteFooter p, #siteFooter ol, #siteFooter ul, #siteFooter dl {
            margin-bottom: 1.5em;
            font-size: 1em; /* 16 / 16 = 1 */
        }

        #siteFooter ul, #siteFooter ol {
            margin: 0 0 1.5em 0;
            padding: 0 0 0 24px;
            -moz-box-sizing: border-box;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
        }

        #siteFooter li #siteFooter ul, #siteFooter li #siteFooter ol {
            margin: 0;
            font-size: 1em; /* 16 / 16 = 1 */
        }

        #siteFooter dl, #siteFooter dd {
            margin-bottom: 1.5em;
        }

        #siteFooter dt {
            font-weight: normal;
        }

        #siteFooter b, #siteFooter strong {
            font-weight: bold;
        }

        #siteFooter hr {
            display: block;
            margin: 1em 0;
            padding: 0;
            height: 1px;
            border: 0;
            border-top: 1px solid #ccc;
        }

        #siteFooter sub, #siteFooter sup {
            font-size: 75%;
            line-height: 0;
            position: relative;
            vertical-align: baseline;
        }

        #siteFooter sup {
            top: -.5em;
        }

        #siteFooter sub {
            bottom: -.25em;
        }
        /* IMAGES ============================================================================= */

        #siteFooter img {
            border: 0;
            width: 100%;
            max-width: 100%;
            height: auto;
            width: auto\9; /* ie8 */
        }

            #siteFooter img.floatleft {
                float: left;
                margin: 0 10px 0 0;
            }

            #siteFooter img.floatright {
                float: right;
                margin: 0 0 0 10px;
            }
        /*  SECTIONS  ============================================================================= */

        #siteFooter .section {
            clear: both;
            padding: 0px;
            margin: 0px;
        }

    #OtherBrands {
        padding: 0 0.4%;
    }

        #OtherBrands ul {
            padding: 0;
        }

            #OtherBrands ul li {
                list-style: none;
                padding: 4% 2% 0;
                margin: 2% 0;
                height: 30px;
                border: 1px solid #000;
                text-decoration: none;
                text-transform: uppercase;
                color: #000;
                font: 100%/1 'FranklinGothicLig', Arial, Helvetica, sans-serif;
            }

            #OtherBrands ul a {
                text-decoration: none;
            }

            #OtherBrands ul li:active {
                color: #ec2367;
            }

            #OtherBrands ul li span {
                position: relative;
                top: -5px;
            }

                #OtherBrands ul li span.logo {
                    display: block;
                    float: left;
                    width: 40px;
                    height: 24px;
                    margin: 0 10px;
                }


    #Links {
        background: #eee;
    }

        #Links ul {
            padding-right: 24px;
            margin: 0;
            -moz-box-sizing: border-box;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
        }

            #Links ul li {
                list-style: none;
                border-bottom: 1px solid #ccc;
                padding: 10px;
                -moz-box-sizing: border-box;
                -webkit-box-sizing: border-box;
                box-sizing: border-box;
            }

                #Links ul li.last {
                    border-bottom: none;
                }

                #Links ul li a {
                    font: 80%/1 'FranklinGothicLig', arial, helvetica, sans-serif;
                    text-decoration: none;
                    text-transform: uppercase;
                    color: #000;
                    display: inline-block;
                    width: 100%;
                    padding: 10px 0;
                }

                    #Links ul li a:active {
                        color: #666;
                    }

                #Links ul li input[type=checkbox] {
                    display: none;
                }

        #Links input[type=checkbox] ~ label {
            color: #000;
            text-decoration: none;
            text-transform: uppercase;
            font: 80%/1 'FranklinGothicLig', arial, helvetica, sans-serif;
            cursor: pointer;
            display: inline-block;
            width: 100%;
            padding: 10px 0;
        }

            #Links input[type=checkbox] ~ label:before {
                content: "+ ";
                display: inline-block;
                width: 15px;
            }

        #Links input[type=checkbox]:checked ~ label:before {
            content: "- ";
            display: inline-block;
            width: 15px;
        }

    ul.accordian {
        -webkit-transition: all 0.3s ease-out;
        -moz-transition: all 0.3s ease-out;
        transition: all 0.3s ease-out;
        -webkit-transform: translate(0%, 0%);
        -ms-transform: translate(0%, 0%);
        transform: translate(0%, 0%);
    }

    #Links input[type=checkbox] ~ label ~ ul.accordian {
        overflow: hidden;
        opacity: 0;
        min-height: 0;
        max-height: 0;
    }

    #Links input[type=checkbox]:checked ~ label ~ ul.accordian {
        overflow: hidden;
        opacity: 1;
        min-height: 100px;
        max-height: 200px;
    }

    #siteFooter #copyright {
        text-align: center;
        font: 70%/1 arial, helvetica, sans-serif;
        color: #666;
        margin-top: 10px;
    }

    @media only screen and (min-width: 630px) {

        nav.popout {
            top: 50px;
        }
    }

    /*  BROWSE CATEGORIES DROP DOWN MENU  ============================================================================= 

span.logo-DAL {
    background-size: 250px auto;
    background-position: -3px 3px;
    width: 110px !important;
    height: 35px !important;
    position: relative;
    left: -35px;
}

*/


    /*  SECTIONS  ============================================================================= */

    #siteFooter .section {
        clear: both;
        padding: 0px;
        margin: 0px;
    }

    /*  GROUPING  ============================================================================= */


    #siteFooter .group:before,
    #siteFooter .group:after {
        content: "";
        display: table;
    }

    #siteFooter .group:after {
        clear: both;
    }

    #siteFooter .group {
        zoom: 1; /* For IE 6/7 (trigger hasLayout) */
    }

    /*  GRID COLUMN SETUP   ========================== */

    #siteFooter .col {
        display: block;
        float: left;
        margin: 1% 0.4%;
    }

    #siteFooter .span_1_of_2 {
        width: 49.2%;
    }

    #siteFooter .span_1_of_6 {
        width: 15.33%;
    }

    #siteFooter .span_3_of_6 {
        width: 49.2%;
    }
    .browseCategories {
        display: none;
        position: absolute;
        z-index: 99999;
        width: 90%;
        margin-top: -7px;
        display: none;
        position: absolute;
        z-index: 99999;
        width: 95%;
        margin-top: -7px;
    }
    .nomobile {
        display:none;
}
    td ul {
        margin: 0;
    }
    #leftPanel {
        width:100%;
        height:auto;
    }
    #rightPanel {
        display:none;
    }
    body {
        background:none;
    }
    #slider {
        
        margin-left:auto;
        margin-right:auto;
        width:90%;
    }
    .nextButtonStyle {
        width: 100%;
        font-weight: bold;
        background: #4b9626;
        color: #fff;
        margin-top:10px;
        text-align:center;
    }
    .buttonCapLt {
        display: none;
    }
    .buttonCapRt {
        display:none;
    }
    .ContentPlaceHolder1_placeorderbutton {
        width: 90%;
        font-weight: bold;
        background: #4b9626;
        color: #fff;
        font-weight: bold;
        background: #4b9626;
        color: #fff;
    }
    .nextButtonStyle a, .nextButtonStyle a:link {
        background-image:none;
        width:100%;
        text-align:center;
        color:white;
        line-height:1.4;
    }
    #completeButton {
        width: 100%;
    }
    .formContentSplash {
        width:100%;

    }
    label {
        width:30%;
    }
    select {
        width:50%;
    }
    .regFormRow {
        width:100%;
    }
    .formContentSplash input {
        width:50%;
    }
    .labelFocus {
        width:30%;
    }
    #ContentPlaceHolder2_Div3 {
        margin-top:0;
    }
    .help-tip {
        right: 0px;
    }
    .formContentSplashsmall {
        margin-top:10px;
        margin-bottom: 10px;
        margin-right:10px;
        width:100%;
    }
    #Div1 {
        width:95%;
        margin-left:10px;
        margin-right:10px;
    }
    #ContentPlaceHolder1_SubmitOrder {
        width:100%;
        text-align:center;
    }
    #Div2 {
        width:100%;

    }
    #Div4 {
        width:100%;
        text-align:center;
    }
    #ContentPlaceHolder1_postcodeLookupButton {
        text-align:center;
        text-decoration:none;
    }
    .confirmationPopup {
        width:80%;
        margin-left: 10%;
        margin-top: 30%;
    }
    #completebuttonDiv {
        width:100%;
    }
    #Div10 {
        height: auto;
        width: 90%;
        margin-bottom: 10px;
        padding-top: 0px;
        margin-left: 10px;
        margin-right: auto;
        float:left;
    }
    #closeButtonmob {
        color:white;
    }
}




