/* Global */

body { margin:0; padding:9px; font-family: 'Muli', sans-serif; }
    @media screen and (min-width: 1156px) { body { padding:29px; } }
sub, sup {
    vertical-align: baseline;
    position: relative;
    top: -0.4em;
}
sub { 
  top: 0.4em; 
}
    header { padding:10px 10px 4px; background:#000104; }
        @media screen and (min-width: 1156px) { header { width:1000px; margin:0 auto; padding:21px 50px; } }
        #logo { width:80px; height:20px; fill: #fff; }
            @media screen and (min-width: 1156px) { #logo { width:205px; height:49px; } }

    section { padding:10px 0; }        
        @media screen and (min-width: 1156px) { section { width:1100px; margin:0 auto; padding:30px 0; } }

        /* Home */

        .intro h1 { margin:0; padding:0; font-size:19.26px; font-weight:normal; color:#b73400; text-align:center; }
            @media screen and (min-width: 1156px) { .intro h1 { font-size:48px; line-height:56px; } }
        .intro h2 { margin:0; padding:0; font-size:16px; font-weight:normal; color:#259ce7; text-align:center; text-transform:uppercase; }
            @media screen and (min-width: 1156px) { .intro h2 { margin-bottom:10px; font-size:28px; line-height:38px; } }
        .frames { width:100%; margin:0 auto; display:block; } 
            @media screen and (min-width: 1156px) { .frames {  display:none; } }
        .intro h3 { display:none; }
            @media screen and (min-width: 1156px) { .intro h3 { margin:0; font-size:16px; font-weight:normal; color:#666; text-align:center; line-height:20px; display:block; } }

        ol { margin:0 0 21px; padding:14px 0 21px; list-style:none; border-bottom:#cccbcb 3px solid; overflow:hidden; }
            @media screen and (min-width: 1156px) { ol { padding:14px 0 41px 22px; border-bottom:#cccbcb 12px solid; } }
            ol li { clear:right; margin-bottom:70px; padding-left:7px; counter-increment: item; }
                @media screen and (min-width: 1156px) { ol li { margin-bottom:0; position:relative; } }
                ol li:before { width: 26px; height:26px; color: #fff; line-height:26px; text-align: center; vertical-align:top; background-color:#189efb; border-radius: 100%; display: inline-block; content: counter(item); }    
                    @media screen and (min-width: 1156px) { ol li:before { width:48px; height:48px; margin-top:20px; font-size:28px; line-height:48px; } }

                ol li img { display:none; }
                    @media screen and (min-width: 1156px) { ol li img { position:absolute; right:0; display:block; z-index: 2; } }
                    @media screen and (min-width: 1156px) { 
                        .home_improv img { top:0; }
                        .no_clue img { top:-42px; }
                        .love_doing img { top:-50px; }
                        .mood img { top:-96px; } 
                        .pay_the_pros img { top:-40px; }
                    }
                fieldset { float:right; width: calc(100% - 38px); margin:-14px 8px 49px 0; padding:0; border:none; border-top:#88888b 1px solid; display: inline-block; }
                    @media screen and (min-width: 1156px) { fieldset { width: calc(100% - 112px); margin:-14px 36px 50px 0; padding-top:20px; border-top:#88888b 4px solid; } }   
                    @media screen and (min-width: 1156px) { 
                        .home_improv fieldset { width: calc(100% - 296px); padding-right:185px; }
                        .no_clue fieldset { width: calc(100% - 256px); padding-right:145px; }
                        .some_brands fieldset { width: calc(100% - 136px); padding-right:25px; }
                        .love_doing fieldset { width: calc(100% - 317px); padding-right:205px; }
                        .environment fieldset { width: calc(100% - 136px); padding-right:25px; }
                        .mood fieldset { width: calc(100% - 256px); padding-right:145px; } 
                        .get_decorating fieldset { width: calc(100% - 331px); padding-right:220px; }
                        .pay_the_pros fieldset { width: calc(100% - 256px); padding-right:145px; } 
                    }
                li:last-child fieldset { margin-bottom:0; padding-bottom:35px; border-bottom:#88888b 1px solid; }
                @media screen and (min-width: 1156px) { li:last-child fieldset { border-bottom:#88888b 4px solid; } }
                    .error { margin-top:10px; font-size:12px; color:#ff0000; }
                        @media screen and (min-width: 1156px) { .error { font-size:24px; line-height:36px; } } 
                    legend { float:left; padding:8px 0 9px; font-size:17px; color:#666; line-height:18px; }         
                        @media screen and (min-width: 1156px) { legend { padding:0 0 5px; font-size:21px; line-height:40px; } }
                        input[type=radio] { display:none; }                        
                        label { float:left; width:25px; height:25px; margin-right:12px; font-size:14px; line-height:83px; background-image:url('/images/bg-radio-button-sm.png'); background-repeat:no-repeat; display:block; cursor:pointer; }
                            @media screen and (min-width: 1156px) { label { width:32px; margin-right:19px; height:30px; font-size:21px; line-height:31px; background-image:url('/images/bg-radio-button.png'); } }
                        input[type=radio]:checked + label { background-position:right 100%; }
                        label.agree { clear:left; color:#189efb; }
                            @media screen and (min-width: 1156px) { label.agree { width:151px; padding-left:56px; background-position:top right; } }
                        label.disagree { margin-right:0; color:#bb3500; text-indent:-32px; }
                            @media screen and (min-width: 1156px) { label.disagree { padding-left: 73px; text-indent:0; } }
                            @media screen and (min-width: 1156px) { input[type=radio]:checked + label.disagree { background-position:left 100%; } }
        
        input[type=submit] { margin:0 auto 23px; padding:4px 8px; font-size:14px; font-weight:bold; color:#fff; background:#de2a27; border:none; display:block; cursor:pointer; -webkit-appearance: none; -webkit-border-radius:0; border-radius:0; }
            @media screen and (min-width: 1156px) { input[type=submit] { padding:15px 30px; font-size:18px; line-height:21px; } }

        /* Painters */
        .painter { text-align:center; }
            @media screen and (min-width: 1156px) { .painter { padding-bottom: 33px; } }
            .painter img { margin-left:-16px; }
            .painter h1 { margin:0; padding:0 11px; font-size:19px; font-weight:normal; color:#1a6888; line-height:21px; }
                @media screen and (min-width: 1156px) { .painter h1 { font-size:48px; line-height:56px; } }
            .painter p { padding:0 11px; font-size:14px; color:#58595b; line-height:16px; }
                @media screen and (min-width: 1156px) { .painter p { margin-bottom:36px; font-size:21px; line-height:31px; } }

            p.share_results { font-weight:bold; }
                @media screen and (min-width: 1156px) { p.share_results { margin-bottom:37px; font-size:24px; display:inline-block; } }
            .share { margin:0 auto 25px; padding:0; list-style:none; display:inline-block; }   
                @media screen and (min-width: 1156px) { .share { margin-bottom:0; } }
                .share li { margin:0 8px; display:inline-block; }
                    .share li img { margin:0 !important; }  
            .retake { margin:0 auto 23px; padding:6px 8px; font-size:14px; font-weight:bold; color:#fff; text-decoration:none; background:#de2a27; display:table; }
                @media screen and (min-width: 1156px) { .retake { padding:15px 30px; font-size:18px; line-height:21px; } }

        .results { margin:0 -9px; padding:20px 10px 0; text-align:center; border-top:#cdcdcd 1px solid; }
            @media screen and (min-width: 1156px) { .results { margin: 0 -30px; padding:40px 40px 0; border-top:#cdcdcd 2px solid; overflow:hidden; } }
            .results h2 { margin:0 0 18px; font-size:14px; color:#58595b; }
                @media screen and (min-width: 1156px) { .results h2 { margin-bottom:30px; font-size:28px; } }
                @media screen and (min-width: 1156px) { .result { float:left; width:33.33%; } }     
                .result img { width:240px; }    
                @media screen and (min-width: 1156px) { .result img { width:320px; margin-bottom:15px; } }

                .result_img { width:240px; }
                @media screen and (min-width: 1156px) { .result_img { width:320px; } }

                .result h3 { margin:0 0 2px; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-size:16px; font-weight:normal; color:#666666; }
                    @media screen and (min-width: 1156px) { .result h3 { min-height:81px; font-size:21px; line-height:28px; } }
                .result a { margin-bottom:22px; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-size:14px; font-weight:bold; color:#bb3500; text-decoration:none; display:block; }
                    @media screen and (min-width: 1156px) { .result a { font-size:22.17px; line-height:33.26px; } }