/* ==|== login page specific ========== */

html { height: 100%; }
html.lt-ie9 { height: auto; }

body { background: #fff; padding-bottom: 80px; min-height: 100%; position: relative; }
.lt-ie9 body { min-height: inherit; }

#wrapper, #wrapper.fixed, #wrapper.capped { width: auto; max-width: 1200px; }

#header { background: #fff; min-height: 120px; }
#header h1#logo { margin: 60px 0 0 50px; }
#header h1#logo, #header h1#logo a { color: #002d74; font-weight: bold; font-size: 30px; line-height: 50px; }
#logo a sup { top: -1.2em; font-size: 40%; }

.branding { float: right; margin-right: 25px; }
.branding img { margin-top: 60px; }

#container { border: none!important; padding-bottom: 0; background: #ccc; display: table; width: 100%; height: 420px; max-height: 420px; }

#content, html[dir="rtl"] #content { padding: 20px 0; display: table-row; border: none!important; }

#contentMain, #contentSub { float: none!important; display: table-cell; vertical-align: middle; }
#contentMain { width: 310px; background: #002d74; height: 420px!important; }
#contentSub { position: relative;
background: url("http://placehold.it/809x593") no-repeat top right; /* update with your image */
-webkit-background-size: cover;
  -moz-background-size: cover;
    -o-background-size: cover;
        background-size: cover; }
#contentSub:before { content: ""; display: block; padding-top: 66.66%; /* 3:2 ratio */ }

.lt-ie9 #contentSub { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://placehold.it/809x593',sizingMethod='scale');
-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://placehold.it/809x593',sizingMethod='scale')"; } /* update with your image */

.lt-ie8 #wrapper, .lt-ie8 #wrapper.fixed, .lt-ie8 #wrapper.capped { width: 960px; }
.lt-ie8 #container { overflow: hidden; padding: 0; background: transparent; height: 433px; max-height: 433px; }
.lt-ie8 #container, .lt-ie8 #content, .lt-ie8 #contentMain, .lt-ie8 #contentSub { display: block; }
.lt-ie8 #contentMain, .lt-ie8 #contentSub { float: left!important; height: 433px!important; }
.lt-ie8 #contentMain { width: 310px; }
.lt-ie8 #contentSub { width: 650px; position: static; }
.lt-ie8 form { padding-top: 20px; }

#contentMain label, #contentMain a { color: #fff; }
#contentMain a { opacity: .75; }
#contentMain a:hover { opacity: 1; }

#footer { color: #999; border-top: none!important; background: #fff; padding: 20px 50px; position: absolute; bottom: 0; }
#footer a, #footer a:hover { color: #999; text-decoration: underline; } 
#footer a:hover { text-decoration: none; } 

form { padding: 0 40px; }
.formRow { margin: 0 auto; }
label, .formLabel { float: none; width: 100%; text-align: left; }
fieldset { margin-bottom: 12px; padding-top: 0; }
fieldset legend, fieldset .legend { display: none; }
.input { margin-left: 0; }
.actions { padding: 0; }
.button { padding: 6px 15px 7px 15px; font-size: 14px; }
.button.positive { text-transform: uppercase; }


/* ==|== right to left ========== */

html[dir="rtl"] #header h1#logo { margin: 60px 50px 0 0; }
html[dir="rtl"] label { float: none!important; text-align: right!important; }
html[dir="rtl"] .input { margin-right: 0!important; }
html[dir="rtl"] .actions { padding: 0!important; }



@media screen and (max-width: 48em) { /* 768px */
/* ==|== layouts ========== */

#header { min-height: 120px!important; }

}

@media screen and (max-width: 30em) { /* 480px */

#header { text-align: center; background-color: #fff!important; }
#header h1#logo, html[dir="rtl"] #header h1#logo { margin: 0 auto; height: auto; }

.branding { float: none; margin-right: 0; }
.branding img { margin-top: 20px; }

#container, #content, #contentMain,
html[dir="rtl"] #container, html[dir="rtl"] #content, html[dir="rtl"] #contentMain { display: block; width: 100%; max-height: none; height: auto; }
#contentSub, html[dir="rtl"] #contentSub  { display: none!important; }
form { padding-top: 60px; }
#footer { position: static; padding: 10px; width: 100%; }

}

@media screen and (max-width: 20em) { /* 320px */

input[type="submit"], label, .formLabel { margin-bottom: 5px; }

}