:root {
    --primary: #333;
    --secondary: #e1dcdc;
    --white: #fff;
    --width: 300px;
    --left: -300px;
    --right: 300px;
    --height: 250px;
    --top: -250px;
    --bottom: 250px;
    --family: Arial, Helvetica, sans-serif;
    --base: 12px;
}

.banner {
    width: var(--width);
    height: var(--height);
    border: var(--primary) 1px solid;
    background: var(--white);
    overflow: hidden;
    box-sizing: border-box;
}

#loader-container {
    display: none;
}

#btn-exit {
    width: 100%;
    height: 100%;
    cursor: pointer;
    opacity: 0;
}

.size {
    top: -1px;
    left: -1px;
    width: var(--width);
    height: var(--height);
}

.retina {
    background-size: contain !important;
    background-repeat: no-repeat !important;
}
/* ///////////////////////////////////////////////////////////////////////////////////ASSETS///////////////////////////////////////////// */
#bg1 {
    background: url(../img/bg1.jpg);
}
#bg2 {
width: 300px;
height: 250px;
background-color: #000;
opacity: 0;
}
#copy1 {
    background: url(../img/copy1.png);
    opacity: 0;
}
#copy2 {
    background: url(../img/copy2.png);
    opacity: 0;
}
#copy3 {
    background: url(../img/copy3.png);
    opacity: 0;
}
#copy4 {
    background: url(../img/copy4.png);
    opacity: 0;
}
#cta {
    background: url(../img/cta.png);
    opacity: 0;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    cursor: pointer;
    width: 203px;
    height: 26px;
    top: 105px;
    left: 49px;
    display: none;
}
#image1 {
    width: 264px;
    height: 344px;
    background: url(../img/image1.png);
    transform:  scale(0.5);
    top: -100px;
    left: -80px;
}
#image2 {
    width: 411px;
    height: 415px;
    background: url(../img/image2.png);
    transform:  scale(0.5);
    top: -51px;
    left: -9px;
}
#image1_2 {
    background: url(../img/image1.png);
    width: 264px; height: 344px; /*
    background: url(../img/image1.png);
    */ transform:  scale(0.5); top: 34px; left: -197px;   opacity: 1; 
}
#image2_2 {
    /*! background: url(../img/image2.png); */
    width: 411px; height: 415px; background: url(../img/image2.png); transform:  scale(0.45); top: -302px; left: 185px;opacity: 1;
}
#logo1 {
    background: url(../img/logo1.png);
    opacity: 0;
}
#logo2 {
    background: url(../img/logo2.png);
    opacity: 0;
}
#logo3 {
    background: url(../img/logo3.png);
}
#logo4 {
    background: url(../img/logo4.png);
}
#logo5 {
    background: url(../img/logo5.png);
    opacity: 0;
}
#arrow{
    width: 11px;
    height: 6px;
    background-image: url(../img/arrow.png);
    background-size: contain !important;
    background-repeat: no-repeat !important;
    top: 5px;
    left: 266px;
}

#pi {
    background-image: url(../img/pi.png);
}

#pi_link {
    width: 10px;
    height: 11px;
    left: 26px;
    top: 144px;
    cursor: pointer;
}

#patient_information {
    width: 75px;
    height: 11px;
    left: 53px;
    top: 144px;
    cursor: pointer;
}
/* ///////////////////////////////////////////////////////////////////////////////////ISI///////////////////////////////////////////// */
#isi-container {
    top: 158px;
    width: var(--width);
    height: 90px;
    overflow: hidden;
    font-size: 9px;
    letter-spacing: 0.01em;
    background-color: #ffffff;
    line-height: 10px;
}

#isi {
    width: calc(var(--width) - 16%);
    height: 100%;
    overflow-x: hidden;
    padding: 3px 60px 0px 7px;
    font-family: var(--family);
}

.scroller-container {
    right: 0px;
    width: 14px;
    height: 38px;
}

.knob-arrange {
    right: 1px;
    width: 11px;
    height: 90px;
    background: #ffffff;
    border: black solid;
    border-width: 0 1px;
}

.knob {
    right: 3px;
    width: 8px;
    height: 54px;
 background-image: url(../img/scroll.png);
 background-size: contain !important;
 background-repeat: no-repeat !important;
    cursor: pointer;
}

#isi p {
    margin: 2px 0 0px 2px;
}

#isi .bold {
    font-weight: bold;
}
#isi .boldTittle {
    font-weight: bold;
    color: #e95e16;
    font-size: 12px;
    line-height: 12px;
}

#isi .link {
    text-decoration: underline;
    text-decoration-style: solid;
    font-weight: bold;
    cursor: pointer;
    color: #e95e16;
}
#isi .hand{
    cursor: pointer;
}

#isi .sup {
    vertical-align: text-top;
    font-size: 6.5px;
    letter-spacing: .10px;
    margin-left: 1px;
}

#isi .p_indent {
    margin-left: 9px;
}

.isi__list {
    list-style: none;
    margin-left:  10px !important;
    list-style: none;
    margin-bottom: 3px !important;
    margin-top: 0px !important;
}
.isi__list::before {
    position: absolute;
    content: '•';
    margin-left: -7px;
    font-size: 11px;
    margin-top: 0px;
}

/* ------------------------------------------ */
.isi__list li {
    list-style: none;
    margin-left: -30px;
    margin-bottom: 5px;
}
.isi__list__inset li {
    list-style: none;
    margin-left: 19px;
    margin-bottom: 5px;
    list-style: none;
}
.isi__list__inset li::before {
    position: absolute;
    content: 'o';
    margin-left: -9px;
    margin-top: -1px;
    font-size: 7px;
}

/* ------------------------------------------ */

#isi .nobr {
    white-space: nowrap;
}

.boxed_warning {
    position: relative;
    padding: 10px;
    border: var(--primary) 1px solid;
}

header {
    margin-bottom: 3px !important;
}

header * {
    line-height: 13px !important;
}

.pt1{
    padding-top: 1px;
}

.mb2 {
    margin-bottom: 2px !important;
}

.mb4 {
    margin-bottom: 4px !important;
}

.mb6 {
    margin-bottom: 6px !important;
}

.mb8 {
    margin-bottom: 8px !important;
}

.mb10 {
    margin-bottom: 10px !important;
}

.mb12 {
    margin-bottom: 12px !important;
}

.mb14 {
    margin-bottom: 14px !important;
}

.mb16 {
    margin-bottom: 16px !important;
}

.pc-all {
    width: calc(var(--width) - 13%) !important;
}
.centerTxt{
    align-content: center;
    text-align: center;
    margin-bottom: 17px !important;
}

.ie-11 {}

.ie-edge {}

.ff-mac {}

.chrome-mac {}

.safari {}

.ff-pc {}

.chrome-pc {}

.iphoneIpad {}

.android {}