dentalvisitactivity-pack/static/css/dentalvisit.css

Interactive to recreate a pediatric dental visit

.interactive-container {
    min-width: 680px;
}

.activity-completed {
    display: inline;
    margin-left: -15px;
}

.steps {
    margin: 10px 0 5px 0;
}

.counseling-session {
    margin-top: 20px;
}

.info-header {
    margin: 0 0 10px 0;
    padding: 0;
}

.info-header h3 {
    margin: 0;
    padding: 0;
    line-height: 44px;
    margin-left: -15px;
    font-size: 20px;
}

.row-nopadding {
    margin: 0;
    padding: 0;
}

.counseling-session-container {
    background-color: #e6f2ff;
    border: 1px solid #b5daff;
    padding: 8px;
    -webkit-border-radius: 5px;
     -moz-border-radius: 5px;
    border-radius: 5px;
}

.counseling-session .instructions {
    margin: 0 -15px 20px -15px;
}

.counseling-session .alert {
    border-radius: 0;
    padding: 2px 5px;
    font-size: 18px;
    font-weight: bold;
}

.counseling-session .available_time {
    border: 1px solid #999;
    text-align: center;
    width: 210px;
    margin-bottom: 5px;
    padding: 0;
    background: #fff url('../img/icon_stopwatch.jpg') 76px 22px no-repeat;
    box-shadow: none;
}


.counseling-session .time-status {
    filter: alpha(opacity=70); /*older IE*/
    filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70); /* IE */
    -moz-opacity: .7; /*older Mozilla*/
    -khtml-opacity: 0.7;   /*older Safari*/
    opacity: 0.7;   /*supported by current Mozilla, Safari, and Opera*/
    color:#fff;
    text-align: center;
    padding: 0;
    margin: 0 -15px 10px -15px;
    min-height: 50px;
    vertical-align: middle;
    display: block;
}

.counseling-session .time-status.out-of-time {
    background-color: #cc0000;
}

.counseling-session .time-status.in-time {
    background-color: #009900;
}

.counseling-session .time-status h1 {
    margin: 0;
    padding: 5px 0 0 0;
    font-size: 18px;
    font-weight: bold;
    line-height: 20px;
}

.counseling-session  .time_remaining {
    font-weight: bold;
    height: 24px;
    line-height: 24px;
    margin-bottom: 21px
}

.counseling-session .time_minutes {
    font-weight: bold;
    padding-top: 6px;
    height: 26px;
    line-height: 24px;
}

.counseling-session span.display_time_text {
    display: block;
    height: 40px;
    width: 40px;
    text-align: center;
    font-weight: bold;
    font-size: 24px;
    line-height: 40px;
}

.counseling-session .patient-chart {
    padding: 80px 0 0 0;
    border: 0;
    background: transparent url('../img/clipboard.png') 0 0 no-repeat;
    width: 210px;
    height: 321px;
    margin-top: 40px;
}

.counseling-session .patient-chart-text {
    padding: 0 2px 0 5px;
    background-color: #fff;
    margin-left: 5px;
    margin-right: 5px;
    height: 220px;
    overflow: auto;
    font-size: 11px;
    line-height: 12px;
}

.counseling-session .session-segment {
    margin: 0 0 5px 0;
    padding: 5px;
    background-color: transparent;
    border: 0;
    box-shadow: none;
}

.counseling-session .session-chart-topic {
    font-weight: bold;
}

.counseling-session .session-chart-reply {
    margin-top: 2px;
    margin-bottom: 10px;
}

.counseling-session .panel-group {
    margin-left: -15px;
    margin-right: -15px;
}

.counseling-session .panel-default {
    margin-bottom: 6px;
    vertical-align: middle;
    background-color: #F9F9F9;
}

.counseling-session .panel-default.selected,
.counseling-session .panel-default.selected:hover {
    border: 2px black solid;
    background-color: #fff;
}

.counseling-session .panel-default:hover {
    background-color: #f5f5f5;
}

.counseling-session .panel-heading {
    min-height: 3.5em;
}
.counseling-session .panel-title {
    font-size: 14px;
}

.counseling-session .panel-collapse h3 {
    font-size: 16px;
}

.counseling-session .display_time {
    border: 1px solid transparent;
    width: 42px;
    height: 42px;
    display: block;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    background-color: #fff;
    -webkit-border-top-left-radius: 20px;
    -webkit-border-top-right-radius: 20px;
    -moz-border-radius-topleft: 20px;
    -moz-border-radius-topright: 20px;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    -webkit-border-bottom-left-radius: 20px;
    -webkit-border-bottom-right-radius: 20px;
    -moz-border-radius-bottomleft: 20px;
    -moz-border-radius-bottomright: 20px;
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
}

.counseling-session .display_time h1 {
    margin-top: .2em;
}

.counseling-session .referral-form-prescription {
    background: url('../img/bg_prescription.png');
    max-width: 500px;
    padding: 15px;
    -webkit-box-shadow: 2px 2px 12px rgba(50, 50, 50, 0.75);
    -moz-box-shadow: 2px 2px 12px rgba(50, 50, 50, 0.75);
    box-shadow: 2px 2px 12px rgba(50, 50, 50, 0.75);
}

.counseling-session .referral-form-prescription .practice-logo {
    background: url('../img/pediatric_dentistry.png') center 0 no-repeat;
    height: 30px;
    font-weight: bold;
    padding-top: 90px;
    text-align: center;
    font-family: palatino, serif;
    color: #003399;
    text-transform: uppercase;
    font-size: 12px;
    line-height: 12px;
}

.counseling-session .referral-form-prescription label {
    text-align: right;
}

.counseling-session .patient-chart.referral {
    padding: 80px 0 0 0;
    border: 0;
    background: transparent url('../img/clipboard.png') 0 0 no-repeat;
    width: 210px;
    height: 321px;
    margin-top: 0;
}

.counseling-session .rx_patient {
    font-size: 12px;
    line-height: 13px;
}

.counseling-session .referral_success {
    width: 300px;
    min-height: 20px;
    padding: 10px;
    margin-left: 0;
    margin-top: 80px;
    vertical-align: middle;
    padding-left: 60px;
    background-image: url('../img/icon_check.png');
    background-repeat: no-repeat;
    background-position: 10px center;
}

.counseling-session .dietitian_letter
{
    margin-left: 30px;
    margin-right: 30px;
    background-color: #f6ece4;
    padding: 20px 40px;
    font-family:  palatino;
    font-style: italic;
    font-size: 15px;
    -webkit-box-shadow: 2px 2px 12px rgba(50, 50, 50, 0.75);
    -moz-box-shadow:    2px 2px 12px rgba(50, 50, 50, 0.75);
    box-shadow:         2px 2px 12px rgba(50, 50, 50, 0.75);
    margin-bottom: 30px;
}

.counseling-session .dietitian_letter .letterhead
{
    font-family: palatino;
    text-align: center;
    color: #003399;
}

.counseling-session .dietitian_letter .letterhead .name
{
    font-weight: bold;
    text-transform: uppercase;
}

.counseling-session .find-a-dietician {
    padding: 10px;
    margin-bottom: 10px;
}

.counseling-session .find-a-dietician ol {
    padding-left: 14px;
} 
.counseling-session .find-a-dietician ol li {
    margin-bottom: 5px;
}
.counseling-session .referral-stamp {
    width: 131px;
    height: 37px;
    background: transparent url('../img/referral-completed.png') 0 0 no-repeat;
    display: inline-block;
    float: right;
}


/* Special fix */

.meet-nick-intro {
    width: 300px;
    height: 200px;
    background-image: url('../img/meet_nick.jpg');
    background-repeat: no-repeat;
    background-position: center center;
}