/*Abbreviated Names - container=cont, facebook=fb, footer=ftr, header=hdr, login=lgn, main=mn, password=pw, signin=sgn*/

body {
    width: 891px !important;
}

/* Login Header Styles */

.icrumz-lgn-hdr {
    position: relative;
    top: 0;
    right: 0;
    left: 0;
    height: 114px;
}

.icrumz-lgn-hdr-logo {
    position: absolute;
    top: 14px;
    left: 50%;
    margin-left: -140px;
    z-index: 1;
    height: 99px;
    width: 279px;

    background-image: url(../img/login/logo-login.png);
    background-repeat: no-repeat;
    display: block;
}

/* Login Main Styles */

.icrumz-lgn-mn {
    position: relative;
    top: 20px;
    left: 0;
    right: 0;
    height: 440px;
}

.icrumz-lgn-mn-title {
    position: absolute;
    top: 35px;
    left: 50%;
    margin-left: -288px;
    height: 20px;
    width: 577px;

    font-family: 'Noto Sans', sans-serif;
    font-size: 24px;
    font-weight: normal;
    line-height: 18px;
    letter-spacing: 1px;
    word-spacing: -1px;

    display: block;
    color: #646464;
}

/* Login Main Video Styles */

#icrumz-lgn-intro-video {
    position: absolute;
    top: 30px;
    left: 50%;
    margin-left: -393px;
    height: 350px;
    width: 489px;
    border: 1px solid black;
    z-index: 1;
    cursor: pointer;

    background-image: url(../img/login/video.png);
    background-repeat: no-repeat;
    display: block;
}

#icrumz-lgn-intro-video-shadow {
    position: absolute;
    top: 379px;
    left: 50%;
    margin-left: -393px;
    height: 43px;
    width: 489px;
    z-index: 1;

    background-image: url(../img/login/video-shadow.png);
    background-repeat: no-repeat;

    display: block;
}

/* Login Main Sign-in Styles */

.icrumz-lgn-mn-sgn {
    position: absolute;
    top: 32px;
    left: 50%;
    margin-left: 152px;
    height: 364px;
    width: 300px;
    z-index: 1;

    display: block;
}

.icrumz-lgn-mn-sgn-hdr {
    position: absolute;
    top: 24px;
    left: 50%;
    margin-left: -124px;
    width: 300px;
    color: #666666;
    font-family: 'Noto Sans', sans-serif;
    font-size: 18px;
    font-weight: normal;
    line-height: 29%;
}

/* Login Main Sign-in Facebook Styles*/

.icrumz-lgn-mn-sgn-fb {
    position: absolute;
    top: 50px;
    left: 0;
    height: 35px;
    width: 254px;
}

#lgnFbFrm {
    top: 70px;
}

.icrumz-lgn-mn-sgn-fb-base {
    position: absolute;
    top: 0;
    left: 0;
    height: 33px;
    width: 251px;

    color: #ffffff;
    font-family: 'Noto Sans', sans-serif;
    font-size: 16px;
    font-weight: normal;
    line-height: 29%;
    text-indent: 21px;

    background-color: #007AAD;
    background: linear-gradient(to bottom, #007AAD 5%, #005578 100%);
    /*TODO webkit-linear-gradient required on Safari until 6.1.*/
    /*background: -webkit-linear-gradient(top, #007AAD 5%, #005578 100%);*/
    /*TODO filter required on IE until 10. */
    /*filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#007AAD', endColorstr='#005578', GradientType=0);*/
    border: 1px solid #364B76;
    border-radius: 5px;
    box-shadow: 0 1px 1px #A8C9D6 inset;
    padding: 0 0 0 0;

    cursor: pointer;
}

.icrumz-lgn-mn-sgn-fb-base:hover {
    background-color: #005578;
    background: linear-gradient(to bottom, #005578 5%, #007AAD 100%);
    /*TODO webkit-linear-gradient required on Safari until 6.1.*/
    /*background: -webkit-linear-gradient(top, #005578 5%, #007AAD 100%);*/
    /*TODO filter required on IE until 10. */
    /*filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#005578', endColorstr='#007AAD', GradientType=0);*/

    cursor: pointer;
}

.icrumz-lgn-mn-sgn-fb-groove {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 36px;

    border: 1px solid #4794B4;
    border-right-color: #A8C9D6;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    background-color: #ffffff;
    background-image: url("../img/login/f.png");
    background-position: 10px 5px;
    background-repeat: no-repeat;
    bottom: 0;
    box-shadow: -1px 0 0 0 #364B76 inset;
    padding: 0 0.75em 0 1em;
    white-space: nowrap;

    text-align: center;
    display: block;
}

/* Login Main Sign-in Password Styles */

.icrumz-lgn-mn-sgn-pw {
    position: absolute;
    top: 96px;
    left: 0;
    height: 283px;
    width: 254px;
}

.icrumz-lgn-mn-pw-instruct {
    position: absolute;
    top: 6px;
    left: 0;
    line-height: 1.4em;
    width: 100%;

    color: #999999;
    font-size: 1.2em;
    font-weight: normal;

    text-align: center;
    display: block;
}

.icrumz-lgn-mn-pw-instruct div {
    width: 100px;
    border-bottom: 1px solid black;
    margin: 0 5px 5px 5px;
    border-bottom-color: #999999;
    display: inline-block;
}

.attention {
    color: #2b82a5;
    font-weight: normal;
}

.icrumz-lgn-mn-sgn-pw label[for=lgnTypeN] {
    position: absolute;
    top: 35px;
    left: 30px;
    cursor: pointer;

    color: #999999;
    font-size: 14px;
    font-weight: normal;
}

.icrumz-lgn-mn-sgn-pw #lgnTypeN {
    position: absolute;
    top: 38px;
    left: 9px;
    cursor: pointer;

}

.icrumz-lgn-mn-sgn-pw label[for=lgnTypeE] {
    position: absolute;
    top: 35px;
    left: 159px;
    cursor: pointer;

    color: #999999;
    font-size: 14px;
    font-weight: normal;
}

.icrumz-lgn-mn-sgn-pw #lgnTypeE {
    position: absolute;
    top: 38px;
    left: 138px;
    cursor: pointer;
}

.icrumz-lgn-mn-sgn-pw #lgnEmail, .icrumz-lgn-mn-sgn-pw #lgnPswd {
    width: 251px;
    height: 33px;

    border: 1px solid #CCCCCC;
    border-radius: 5px;
    margin: 0 0 7px 0 !important;
    padding: 0 0 0 7px;

    font-family: 'Noto Sans', sans-serif;
    color: #646464;
    font-size: 1.0em;
    font-weight: normal;

    display: block;
}

.icrumz-lgn-mn-sgn-pw label span {
    color: #999999;
    font-size: 15px;
    font-style: italic;
    font-weight: normal;
    padding: 0 0 0 7px;
}

.icrumz-lgn-mn-sgn-pw label[for=lgnEmail] {
    position: absolute;
    top: 77px;
    left: 0;
}

.icrumz-lgn-mn-sgn-pw #lgnEmail {
    position: absolute;
    top: 43px;
    left: 0;
}

.icrumz-lgn-mn-sgn-pw a {
    position: absolute;
    top: 99px;
    left: 152px;
    color: #999999;
    font-style: italic;
    font-size: 12px;
}

.icrumz-lgn-mn-sgn-pw label[for=lgnPswd] {
    position: absolute;
    top: 152px;
    left: 0;
}

.icrumz-lgn-mn-sgn-pw #lgnPswd {
    position: absolute;
    top: 118px;
    left: 0;
}

.icrumz-lgn-mn-sgn-pw label[for=lgnKeepSignChk] {
    position: absolute;
    top: 266px;
    left: 31px;
    cursor: pointer;

    color: #999999;
    font-size: 14px;
    font-weight: normal;
}

.icrumz-lgn-mn-sgn-pw #lgnKeepSignChk {
    position: absolute;
    top: 270px;
    left: 9px;
    cursor: pointer;
}

.icrumz-lgn-mn-sgn-pw-base {
    position: absolute;
    top: 190px;
    left: 0;
    height: 33px;
    width: 251px;

    color: #ffffff;
    font-family: 'Noto Sans', sans-serif;
    font-size: 16px;
    font-weight: normal;
    line-height: 29%;
    text-indent: 21px;

    background-color: #007AAD;
    background: linear-gradient(to bottom, #007AAD 5%, #005578 100%);
    /*TODO webkit-linear-gradient required on Safari until 6.1.*/
    /*background: -webkit-linear-gradient(top, #007AAD 5%, #005578 100%);*/
    /*TODO filter required on IE until 10. */
    /*filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#007AAD', endColorstr='#005578', GradientType=0);*/
    border: 1px solid #364B76;
    border-radius: 5px;
    box-shadow: 0 1px 1px #A8C9D6 inset;
    padding: 0 0 0 0;

    cursor: pointer;
}

.icrumz-lgn-mn-sgn-pw-base:hover {
    background-color: #005578;
    background: linear-gradient(to bottom, #005578 5%, #007AAD 100%);
    /*TODO webkit-linear-gradient required on Safari until 6.1.*/
    /*background: -webkit-linear-gradient(top, #005578 5%, #007AAD 100%);*/
    /*TODO filter required on IE until 10. */
    /*filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#005578', endColorstr='#007AAD', GradientType=0);*/

    cursor: pointer;
}

.icrumz-lgn-mn-sgn-pw-groove {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 36px;

    border: 1px solid #4794B4;
    border-right-color: #A8C9D6;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    background-color: #ff9900;
    background-image: url("../img/login/ic.png");
    background-position: 0 0;
    background-repeat: no-repeat;
    bottom: 0;
    box-shadow: -1px 0 0 0 #364B76 inset;
    padding: 0 0.75em 0 1em;
    white-space: nowrap;

    text-align: center;
    display: block;
}

/* Footer Styles on icrumz.base.css */

/* Media Queries*/

/* Responsive Design Second Screen*/

@media screen and (max-width: 890px) {

    body {
        width: 640px !important;
    }

    .icrumz-lgn-cont {
        min-height: 940px !important;
        min-width: 640px !important;
    }

    .icrumz-lgn-mn {
        position: relative;
        top: 0;
        left: 0;
        right: 0;
        height: 750px;
    }

    #icrumz-lgn-intro-video {
        margin-left: -244px;
    }

    #icrumz-lgn-intro-video-shadow {
        margin-left: -244px;
    }

    .icrumz-lgn-mn-sgn-hdr {
        position: absolute;
        top: 24px;
        left: 50%;
        margin-left: -100px;
        width: 300px;
        color: #666666;
        font-family: 'Noto Sans', sans-serif;
        font-size: 18px;
        font-weight: normal;
        line-height: 29%;
    }

    .icrumz-lgn-mn-sgn {
        top: 406px;
        margin-left: -126px;
        height: 342px;
        width: 252px;
    }
}

/* Responsive Design Third Screen*/

@media screen and (max-width: 650px) {

    body {
        width: 280px !important;
    }

    .icrumz-lgn-hdr-logo {
        position: absolute;
        top: 14px;
        left: 50%;
        margin-left: -98px;
        z-index: 1;
        height: 69px;
        width: 195px;

        background-image: url(../img/login/logo-login-sml.png);
        background-repeat: no-repeat;
        display: block;
    }

    .icrumz-lgn-cont {
        min-height: 710px !important;
        min-width: 280px !important;
    }

    .icrumz-lgn-mn {
        position: relative;
        top: 0;
        left: 0;
        right: 0;
        height: 520px;
    }

    .icrumz-lgn-mn-title {
        top: 27px;
        margin-left: -150px;
        height: 57px;
        width: 300px;

        line-height: 27px;
        text-align: center;
    }

    #icrumz-lgn-intro-video {
        top: -10px;
        left: 50%;
        margin-left: -126px;
        height: 182px;
        width: 252px;

        background-image: url(../img/login/video-sml.png);
    }

    #icrumz-lgn-intro-video-shadow {
        top: 171px;
        left: 50%;
        margin-left: -126px;
        height: 23px;
        width: 251px;

        background-image: url(../img/login/video-shadow-sml.png);
    }

    .icrumz-lgn-mn-sgn {
        top: 190px;
        margin-left: -126px;
        height: 347px;
        width: 252px;
    }
}