*
{
    margin: 0;
    padding: 0;
    font-family: 'Roboto', sans-serif;
}

div.header
{
    background: linear-gradient(to bottom, #006fa7 0%, #005782 100%);
    padding: 0;
    color: #fff;
    text-align: center;
    box-shadow: 0 0 4px 1px #024769;
    z-index: 1;
}

div.header div.title
{
    margin: 35px 0;
    padding-left: 70px;
}

div.header div.title h1
{
    font-weight: normal;
    font-size: 30px;
    text-align: left;
    color: #f0ffff;
    margin:0;
}

div.header img.img-header
{
    position: absolute;
    max-width: 170px;
    float: right;
    right: 15%;
}

div.content
{
    padding: 0;
}

div.bg-content
{
    background-image: url("../img/Background_Top.jpg");
    background-repeat: no-repeat;
    background-position: center;
    height: 255px;
    position: absolute;
}

div.content h3
{
    color: #666;
    text-align: center;
    margin: 10px 0 20px 0;
}

div.content .left
{
    padding: 0 15px 35px 60px;
    color: #4c4c4c;
    text-align: center;
}

div.content .left .lef-header
{
    height: 257px;
    padding-top: 30px;
}

div.content .left .left-header img
{
    text-align: center;
    width: auto;
    max-height: 227px;
}

div.content .left .left-content
{
    text-align: justify;
    font-size: 16px;
    color: #5e5e5e;
}

div.content .left .left-content .table-responsive
{
  margin: 20px 0 0 0;
  padding: 0;
}

div.content .left .left-content .table-schedule
{
  margin-top: 15px;
  border: 1px solid #ccc;
}

div.content .left .left-content .table-schedule tr:nth-child(even)
{
  background: #e6e6e6;
}

div.content .left .left-content .table-schedule tr th,
div.content .left .left-content .table-schedule tr td
{
  padding: 7px 35px;
  font-size: 17px;
}

div.content .left .left-content .table-schedule tr th img
{
  width: 50px;
}

div.content .left .left-content .table-schedule tr th span
{
  font-size: 25px;
  font-weight: bold;
  color: #006191;
  position: relative;
  top: 9px;
}

div.content .left .left-content .table-schedule tr td:nth-child(1),
div.content .left .left-content .table-schedule tr td:nth-child(2)
{
  font-weight: bold;
}

div.content .left .left-foot
{
    margin-top: 30px;
}

div.content .left .left-foot img
{
    width: 100%;
    max-width: 683px;
}

div.content .right
{
    padding: 3% 5%;
}

div.content .right div.sub-form
{
    background: #ebeff2;
    padding: 15px 25px 25px 25px;
    margin-bottom: 20px;
    border-radius: 5px;
}

div.content .right form.form-horizontal div.form-group
{
    margin-top: 12px;
    margin-left: 0;
    margin-right: 0;
}

div.form-group label
{
    color: #229ac1;
    font-weight: 500;
    font-size: 15px;
}

div.form-group input.form-control,
div.form-group select.form-control
{
    border: 2px solid #ced5db;
}

div.form-group select.form-control option
{
    margin-bottom: 5px;
}

div.form-group select.form-control option:first-child
{
    color: #939393;
}

div.breakout-session
{
    padding: 10px 0;
}

div.breakout-session input[type="checkbox"]
{
    display: none;
}

div.breakout-session div.checkbox-wrapper
{
  padding: 0;
  margin: 10px 0;
}

div.breakout-session div
{
  padding: 0 10px;
}

div.breakout-session label
{
  margin: 0;
  padding: 0;
  text-align: center;
  width: 100%;
}

div.breakout-session label:hover
{
  cursor: pointer;
}

div.breakout-session label div
{
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0);
  position: absolute;
  border-radius: 10px;
  transition: ease all 1s;
}

div.breakout-session label:hover div,
div.breakout-session input[type="checkbox"]:checked + label div,
div.breakout-session input.full_booked + label div
{
  background: rgba(0, 0, 0, .5);
}

div.breakout-session label i,
div.breakout-session label span
{
  color: #fff;
  position: relative;
  font-size: 20px;
  top: 100%;
  transform: translateY(0);
  opacity: 0;
  transition: ease all .6s;
}

div.breakout-session label:hover div i,
div.breakout-session input[type="checkbox"]:checked + label div i
{
  top: 55%;
  transform: translateY(-50%);
  opacity: 1;
}

div.breakout-session input[type="checkbox"]:checked + label:hover div i
{
  color: #ccc;
}

div.breakout-session label span
{
  font-size: 16px;
}

div.breakout-session input.full_booked + label div span
{
  top: 41%;
  transform: translateY(-50%);
  opacity: 1;
}

div.breakout-session label img
{
  width: 100%;
}

div.solution .wrapper
{
    margin: 7px 0;
    vertical-align: baseline;
}

div.solution label:hover

{
    cursor: pointer;
}

div.solution label.wrapper:hover .checkmark span
{
    color:  #c5c5c5;
}

div.solution input[type="checkbox"]
{
    display: none;
}

div.solution input[type="checkbox"]:checked + .checkmark
{
    background: #229ac1;
    border-color: #229ac1;
}

div.solution label.checkmark
{
    border: 1px solid #c5c5c5;
    padding: 0.5px 2px;
    margin-bottom: 0;
    height: 20px;
    width: 20px;
    font-size: 13px;
    transition: all .3s ease-in;
}

div.solution label.checkmark span
{
    color: #fff;
    top: 1px;
    position: relative;
}

div.form-group div#alert-email,
div.form-group div#alert-session
{
    background: #d9534f;
    color: #fff;
    font-weight: 500;
    padding: 5px 10px;
    border-radius: 4px;
    margin-top: 5px;
    font-size: 12px;
}

div.form-group button
{
    background: #227390;
    border: none;
    width: 70%;
    padding: 10px 15px;
    font-size: 18px;
}
div.form-group button:hover
{
    background: #378ead;
}

div.login
{
    border: 1px solid #c6c6c6;
    margin-left: 29.165%;
    padding: 1% 5%;
    margin-top: 5%;
    background: #ebeff2;
    border-radius: 5px;
}

div.login div.form-group
{
    margin: 20px 0;
}

div.logout-wrapper
{
    text-align: right;
    margin: 30px 0;
}

div.logout-wrapper a
{
    background: transparent;
    color: #fff;
    outline: none;
    font-size: 16px;
    padding: 8px 20px;
}

div.logout-wrapper a:hover,
div.logout-wrapper a:active,
div.logout-wrapper a:focus
{
    background: #009ad7;
    color: #fff;
}

/*==== SEMINAR UKSW ====*/

div.content.uksw .left
{
    padding: 3% 5px 35px 30px;
}

div.content.uksw .left .left-content
{
    font-size: 14px;
}

div.content.uksw .left .left-content div:nth-child(1)
{
    padding-top: 5%;
    text-align: center;
}

div.content.uksw .left .left-content div:nth-child(2)
{
    text-align: left;
    padding: 0;
}

div.content.uksw .left .left-content div:nth-child(3)
{
    margin-top: 30px;
}

div.reg-message
{
    left: 29.16%;
    margin-top: 3%;
    padding: 3% 0 0 0;
    color: #fff;
}

div.reg-message.success
{
    background: #00bb9c;
}

div.reg-message.failed
{
    background: #f56064;
}

div.reg-message div.header-msg
{
    text-align: center;
}

div.reg-message div.body-msg
{
    padding: 3% 12%;
    font-size: 12px;
}

div.reg-message div.footer-msg
{
    padding: 0;
    margin-top: 10%;
}

div.reg-message div.footer-msg a.btn
{
    width: 100%;
    font-size: 15px;
    padding: 3.5% 0;
    font-weight: bold;
    color: #fff;
    border: none;
    outline: none;
    border-radius: 0;
}

div.reg-message.success div.footer-msg a.btn
{
    background: #049079;
}

div.reg-message.failed div.footer-msg a.btn
{
    background: #cc2f35;
}

div.reg-message.success div.footer-msg a.btn:hover
{
    background: #01806b;
}

div.reg-message.failed div.footer-msg a.btn:hover
{
    background: #bb282e;
}

div.reg-message h3
{
    margin: 5% 0 8% 0;
}

/*=====PARTNER CIRCLE=====*/
div.partner-circle
{
    background: #525252;
}

div.partner-circle .left
{
    background: #fff;
    margin: 0 7.5%;
    padding: 40px 0;
}

div.partner-circle .left.custom
{
    margin: 0 4%;
}

div.partner-circle .note
{
    background: #006191;
    color: #fff;
    padding: 30px 0;
    margin: 25px 0;
}

div.partner-circle .note strong
{
    font-size: 17px;
}

div.partner-circle .note p
{
    margin: 0;
    font-size: 16px;
}

div.partner-circle .session
{
   padding: 0;
    z-index: 1;
    margin-bottom: 6.8%;
    margin-top: 2%;
}

div.partner-circle .session .profile
{
    margin-bottom: 40px;
    padding: 0;
    text-align: left;
}

div.partner-circle .session .profile img
{
    position: absolute;
    width: 85px;
}

div.partner-circle .session .profile .description
{
    background: #e6e6e6;
    margin: 5px 0px 3px 30px;
    padding-left: 55px;
    padding-top: 10px;
    height: 76px;
    border-radius: 0 50px 50px 0;
}

div.partner-circle .session .profile .description p
{
    width: 90%;
    text-align: center;
}

div.partner-circle .session .profile .description p:nth-child(1)
{
    color: #006191;
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 0;
}

div.partner-circle .session .profile .description p:nth-child(2)
{
    font-size: 12px;
}

div.partner-circle .session .profile .schedule
{
    text-align: center;
    margin-top: 13px;
}

div.partner-circle .session .profile .schedule button,
div.partner-circle .session .profile .schedule label
{
    background: #019dda;
    color: #fff;
    width: 80%;
    font-size: 17px;
    font-weight: bold;
    border: 2px solid #1893bd;
    border-radius: 50px;
    padding: 6px 0;
    margin: 9px 0;
    box-shadow: 0px 4px 20px 0px #827b7b;;
}

div.partner-circle .session .profile .schedule label:nth-child(2)
{
    background: #0086c6;
    border-color: #26789e;
}

div.partner-circle .session .profile .schedule label:nth-child(3)
{
    background: #0077b0;
    border-color: #26789e;
}

div.partner-circle .session .profile .schedule label:nth-child(4)
{
    background: #0086c6;
    border-color: #0974aa;
}

div.partner-circle .session .profile .schedule label:hover
{
    cursor: pointer;
    background: #4CAF50;
    border-color: #409843;
}

div.partner-circle .session .profile .schedule .session-option
{
    display: none;
}

div.partner-circle .session .profile .schedule .session-option:checked + label
{
    outline: none;
    background: #4CAF50;
    border-color: #409843;
}

div.partner-circle .session .btn
{
    background: #006191;
    color: #fff;
    font-size: 17px;
    width: 18%;
    padding: 7px;
    margin: 45px 0 0 0;
}

div.partner-circle .session .btn:hover
{
    background: #0988c7;
}

div.partner-circle .bg-bottom
{
    position: absolute;
    padding: 0;
    bottom: 0;
}

div.partner-circle .bg-bottom img
{
    float: right;
}

@media (max-width: 450px)
{
   div.option div:not(:last-child)
   {
    padding-left: 5px;
    padding-right: 5px;
   }

   div.option div:nth-child(2),
   div.option div:nth-child(5),
   div.option div:nth-child(8)
   {
    /*width: 49%;*/
    padding-left: 0;
    padding-right: 0;
   }

   div.option div label
   {
        word-wrap: break-word;
        height: 110px;
   }
}

@media (max-width: 530px)
{
    div.bg-content
    {
        display: none;
    }

    div.header div.title
    {
        margin: 130px 0 20px 0;
        padding-left: 15px;
        width: 100%;
    }

    div.header div.title h1
    {
        text-align: center;
    }

    div.header img.img-header
    {
        left: 50%;
        transform: translate(-50%,0);
        max-width: 121px;
    }

    div.content .left
    {
        padding-left: 15px;
    }

    div.content.uksw .left
    {
        padding-left: 5px;
    }
}

@media (min-width: 531px) AND (max-width: 767px)
{
    div.header div.title
    {
        margin: 20px 0;
        padding-left: 15px;
    }

    div.header img.img-header
    {
        right: 2%;
    }

    div.content .left
    {
        padding-left: 15px;
    }

    div.content .right
    {
        margin: 10% 0 10% 0;
        padding: 5% 10%;
    }

    div.reg-message
    {
        left: 0;
    }
}

@media (max-width: 767px)
{
    div.header.scan_qrcode div.title
    {
        text-align: center !important;
        margin: 20px 0;
    }

    div.header.scan_qrcode div.logout-wrapper
    {
        text-align: center;
        margin-top: 0;
    }

    div.reg-message
    {
        left: unset;
    }

    div.title.login
    {
        margin-top: 20px !important;
    }

    div.login
    {
        margin: 0;
        border-radius: 0;
    }

    div.content.uksw .left
    {
        padding-bottom: 0;
    }

    div.content.uksw .left .left-content div:nth-child(2)
    {
        margin-top: 20px;
    }

    div.content.uksw .left .left-content div:nth-child(3)
    {
        padding: 0;
    }
}

@media (max-width: 991px)
{
    div.partner-circle .left,
    div.partner-circle .left.custom
    {
        margin: 0;
        padding: 40px 0 !important;
    }
}

@media (min-width: 768px) AND (max-width: 991px)
{
    div.header img.img-header
    {
        right: 10%;
    }

    div.content .left
    {
        padding-left: 15px;
    }
}

@media (min-width: 1180px)
{
    div.partner-circle .session .col-5
    {
        width: 20%;
    }

    div.partner-circle .session .col-5 .profile .description
    {
        margin: 1px 0px 3px 30px;
        height: 84px;
    }

    div.partner-circle .session .col-5 .profile .description p:nth-child(1)
    {
        font-size: 15px;
    }

    div.partner-circle .session .col-5 .profile .description p:nth-child(2)
    {
        font-size: 11px;
    }
}