@media print {
    #pageContent {
        visibility:hidden;
        height: 0px; 
    }

    #framework-footer {
        visibility:hidden;
        height: 0px; 
    }

    #printableSection{
        height: 100%;
        visibility:visible;
        position:absolute;
        left:0;
        top:100px;
    }
}

@media screen{
    #printableSection{
        position:absolute;
        left:0;
        top:0;
        height: 0px;
        visibility:hidden;
    }
}

@media all{
    * {
        font: 12px Arial, Helvetica, sans-serif;
        color: #525252;
    }


    h1{
        font-size: 20px;
        font-weight: bold;
        color: #444444;
    }

    h2{
        font-size: 16px;
        color: #444444;
        margin: 0px;
        padding: 12px 0 6px 0;
    }

    h3{
	    font-size: 14px;
	    font-weight: bold;
	    margin: 0;
	    padding: 12px 0 10px 0;
	    color: #444444;
    }

    h4{
	    font-weight: bold;
        display: inline;
    }
        
    a{
        color: #2970a6 !important;
        text-decoration: none; 
        outline: none;
    }
    a:hover{
        text-decoration: underline !important; 
    }
        li {
            margin-bottom: 6px;
        }
	
    form div {
        border:0;
        clear: both;
    }

    form fieldset {
        border: 0px;
        padding: 0px;
    }

    form fieldset label{
        float: left;
        padding: 8px 10px 10px 0px;
        text-align: left;
    }

    form fieldset input, form fieldset button{
        float: right;
        border:1px solid #899caa;
        color:#3a454d;
        font-weight:bold;
        padding:6px 6px;
        margin-right: 200px;
        box-shadow:inset 0px 1px 3px #bbb; -webkit-box-shadow:inset 0px 1px 3px #bbb; -moz-box-shadow:inset 0px 1px 3px #bbb;
    }

    /** Forms **/
    form .required {
        font-weight: bold;
    }

    form .required label:after {
        color: #e32;
        content: '*';
        display:inline;
    }

    #pageContent{
	    width: 750px;
    }		

    #pageBanner {
	    height: 73px;
	    position: relative;
	    margin: 0 15px 0 0;
    }

    #pageBanner img {
	    position: absolute;
	    border: none;
    }

    #pageBanner h1, #pageBanner h2  {
	    display: block;
	    position: absolute;
	    bottom: 12px;
	    margin: 0;
	    font-weight: bold;
	    font-size: 20px;
	    color: #666;
	    padding-left: 110px;
    }

    #framework-footer {
	    width: 750px;
	    font-family: arial, sans-serif;
	    font-size: 86%;
	    color: #333;
	    clear: both;
    }

    #framework-footer a {
	    color: #366;
	    text-decoration: none;
    }

    .leftButton{
    display: inline-block;
    height: 24px;
    padding: 7px 10px 0 10px;
	    margin-right: 10px;
	    border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px;
    }

    .selected{
	    background: #258dc8;
	    color: white;
    padding: 7px 10px 0 10px;
	    font-weight: bold;
	    border: 1px solid #7db9e8;
    }

    .complete:before {
	    color: #258dc8;
	    margin-right: 8px;
	    content: url('../images/checked.png');
	    display:inline;
    }

    .answer {
    }

    .question {
	    font-size: 18px;
	    color: grey;
	    margin: 0 0 8px 0;
    color: #444444;
    }

    .homeHeader {
        height: 80px;
        background: #00213d; 
        background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwMjEzZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMzYzc5OTYiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+) no-repeat;
        background-size: 100%;
    }
    
    
    label.error {
            height:20px;
            background-color:#FFFE36;
            border:1px solid #E1E16D;
            font-size:11px;position: absolute; left: 600px;
            color:black;
            padding:3px 10px;
            margin-left:2px;
            float: right;
            -moz-border-radius:4px; -webkit-border-radius:4px;
            -moz-box-shadow:0 0 6px #ddd; -webkit-box-shadow:0 0 6px #ddd;
    }
    
    
    .statusBar {
            height:30px;
        font-weight: bold;
            width: 50%;
            color:red;
            padding:3px 0 12px 6px;
        vertical-align: middle;
    }
    
    /*	CSS for customized radio buttons and check boxes */

    /* page styles */
    body {
            font-size: 62.5%;
    }

    fieldset { 
            padding: 0 15px 3em;
            border: 0;
    }

    legend {
            font-size: 1.4em;
            font-weight: bold;
            padding: .2em 5px;
    }


    /*	wrapper divs */
    .custom-checkbox, .custom-radio { 
        position: relative;
            height: 22px;
            outline: none;
    }

    /* input, label positioning */
    .custom-checkbox input, 
    .custom-radio input {
            position: absolute;
            left: 2px;
            top: 3px;
            margin: 0;
            padding: 0;
            z-index: 0;
    }

    .custom-checkbox input, .custom-radio input, x:-moz-any-link, x:default{

        visibility: hidden;
    }
    
    .custom-checkbox label, 
    .custom-radio label {
            position: relative;
            z-index: 1;
            font-size: 12px;
            padding-right: 1em;
            line-height: 1;
            padding: 8px 0 2px 30px;
            cursor: pointer;
    }


    /* states */
    .custom-checkbox label { background: url(../images/checkbox.gif) no-repeat; }

    .custom-radio label { background: url(../images/radiobutton.gif) no-repeat; }

    .custom-checkbox label, .custom-radio label {
            background-position: -10px -14px;
    }

    .custom-checkbox label.hover,
    .custom-checkbox label.focus,
    .custom-radio label.hover,
    .custom-radio label.focus {
            background-position: -10px -114px;
    }

    .custom-checkbox label.checked, 
    .custom-radio label.checked {
            background-position: -10px -214px;
    }

    .custom-checkbox label.checkedHover, 
    .custom-checkbox label.checkedFocus {
            background-position: -10px -314px;
    }

    .custom-checkbox label.focus, 
    .custom-radio label.focus {
           
    }

    .challengeBox{
        height: 70px; 
        width: 82px;
        margin: 0 4px 0 4px;
    }

    .challengeBoxLabel{
        width: 82px;
        margin: 0 4px 0 4px;
        vertical-align: top;
        text-align: center;
    }

    .grapheLabel{
        display: inline-block;
        width: 118px;  
        vertical-align: top; 
        text-align: center;
    }


    #q-graph {position: relative; width: 600px; height: 100px; padding: 0;
      border: 2px solid gray; list-style: none;
      font: 9px Helvetica, Geneva, sans-serif;}
    #q-graph ul {margin: 0; padding: 0; list-style: none;}
    #q-graph li {position: absolute; bottom: 0; width: 120px; z-index: 2;
      margin: 0; padding: 0;
      text-align: center; list-style: none;}
    #q-graph li.qtr {height: 100px; padding-top: 2px;
      border-right: 1px dotted #C4C4C4; color: #AAA;}
    #q-graph li.bar {width: 60px; border: 1px solid; border-bottom: none; color: #000;}
    #q-graph li.bar p {margin: 0; padding: 0; color: #99DD99;}
    #q-graph li.paid {left: 30px; background: #9D9 repeat-x;
      border-color: #CDC #9B9 #000 #BFB;}
    #q-graph #q1 {left: 0;}
    #q-graph #q2 {left: 120px;}
    #q-graph #q3 {left: 240px;}
    #q-graph #q4 {left: 360px;}
    #q-graph #q5 {left: 480px; border-right: none;}

    #q-graph #ticks {width: 600px; height: 100px; z-index: 1;}
    #q-graph #ticks .tick {position: relative; border-bottom: 1px solid #BBB; width: 600px;}
    #q-graph #ticks .tick p {position: absolute; left: 100%; top: -0.67em; margin: 0 0 0 0.5em; }

    .ui-button { margin-left: -1px; }
    .ui-button-icon-only .ui-button-text { padding: 0.35em; } 
    .ui-autocomplete-input { margin: 0; padding: 0.48em 0 0.47em 0.45em; }

    .ui-autocomplete {
        background: white;
        border: 1px solid #DDDDDD;
        color: #333333;
    }

    .ui-menu-widget-content {
        background: url("../images/ui-bg_flat_75_ffffff_40x100.png") repeat-x scroll 50% 50% #FFFFFF;
        border: 1px solid #AAAAAA;
        color: #222222;
    }

    .ui-widget {
        font-family: Verdana,Arial,sans-serif;
        font-size: 1.1em;
    }

    .ui-menu {
        display: block;
        float: left;
        list-style: none outside none;
        margin: 0;
        padding: 2px;
    }

    .ui-state-hover{
        cursor: hand;
    }            
    ul#contactUs {
      list-style:none;
    }
    
    #contactUscontainer {
        margin:0 auto;
        position: relative;
    }

    #topnav {
        padding: 70px 15px 12px;
        font-size:11px;
        line-height:23px;
        text-align:right;
    }

    #topnav a.signin {
        background:#D2D2D2;
        padding:4px 6px 6px;
        text-decoration:none;
        font-weight:bold;
        color:#fff;
        -webkit-border-radius:4px;
        -moz-border-radius:4px;
        border-radius:4px;
        *background:transparent url("../images/signin-nav-bg-ie.png") no-repeat 0 0;
        *padding:4px 12px 6px;
    }
    #topnav a.signin:hover {
        background:#59B;
        *background:transparent url("../images/signin-nav-bg-hover-ie.png") no-repeat 0 0;
        *padding:4px 12px 6px;
    }
    #topnav a.signin, #topnav a.signin:hover {
        *background-position:0 3px!important;
    }

    a.signin {
        position:relative;
        margin-left:3px;
    }
    a.signin span {
        background-image:url("../images/toggle_down_light.png");
        background-repeat:no-repeat;
        background-position:100% 50%;
        padding:4px 16px 6px 0;
    }
    #topnav a.menu-open {
        box-shadow: 5px 5px 5px #888; -moz-box-shadow: 5px 5px 5px #888; -webkit-box-shadow: 5px 5px 5px #888;
        background:#F0F0F0 !important;
        color:#666!important;
        outline:none;
        border: 1px solid #cccccc;
    }
    a.signin.menu-open span {
        background-image:url("../images/toggle_up_dark.png");
        color:#525252;
    }

    #signin_menu {
        -moz-border-radius-topleft:5px;
        -moz-border-radius-bottomleft:5px;
        -moz-border-radius-bottomright:5px;
        -webkit-border-top-left-radius:5px;
        -webkit-border-bottom-left-radius:5px;
        -webkit-border-bottom-right-radius:5px;
        box-shadow: 5px 5px 5px #888; -moz-box-shadow: 5px 5px 5px #888; -webkit-box-shadow: 5px 5px 5px #888;
        display:none;
        background-color:#F0F0F0;
        position:absolute;
        width:340px;
        z-index:100;
        border:1px transparent;
        text-align:left;
        padding:12px;
        top: 24.5px; 
        right: 0px; 
        margin-top:68px;
        margin-right: 15px;
        color:#789;
        font-size:11px;
        border: 1px solid #cccccc;
    }

    .callIcon {
        background-position: -34px 0;
    }
    .chatIcon {
        background: url("../images/chat_now_icons_sprite.png") no-repeat scroll 0 0 transparent;
        height: 36px;
        left: 14px;
        top: 11px;
        width: 33px;
    }
    .boldFont{
        font-weight: bold;
    }
    
    #learn2 span{
        color: white;
    }
}