/*   
Theme Name: dtwise login page
Description: dtwise - turning noise into insights
Author: dtwise
Author URI: http://www.dtwise.com/
Version: 1.0
*/
.success{text-align: center;}

.link-container{
    text-align: center;
    height: 200px !important;
    width: 90% !important;
    
}
.link-container > p {
    margin-top: 12%;
}
.link-button{
    width: 50%;
    clear: both;
    background: #25B0E5 none repeat scroll 0% 0%;
    color: #FFF;
    line-height: 100%;
    font-size: 1.444em;
    font-family: inherit;
    padding: 10px 20px;
    margin: 10% 10% 10% 10%;
    border: 0px solid #FFF;
    border-radius: 4px;
}

html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, hgroup, menu, nav, section, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	background: transparent;
	font-weight:normal;
}									

img, object, embed { max-width:100%; }

html { height:100%; min-height:100%; overflow: hidden; }

ol, ul, li {
	margin:0; padding:0; border:0; list-style: none;
}

a { background:transparent; font-size: 100%; text-decoration:none; margin: 0; padding: 0;}
a:hover, a:active {outline: none;}

input, select {vertical-align:middle;}

input[type="radio"] {vertical-align:middle;}
input[type="checkbox"] {vertical-align:middle; *vertical-align:middle;}

.clickable, input[type=button], input[type=submit], button {cursor: pointer;}

.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }  
.clearfix:after { clear: both; }  
.clearfix { zoom: 1; }  

/* Ok, this is where the fun starts.
-------------------------------------------------------------------------------*/

/* Global Styles */
body {
    height:100%; min-height:100%; background:#303030; font-size:18px; font-family:OpenSans-Light, "Trebuchet MS", Arial, Helvetica, sans-serif; 
    font-weight:normal; text-rendering:optimizelegibility; color:#FFFFFF; -webkit-touch-callout:none; -webkit-text-size-adjust:none; -webkit-user-select:none; 
    -webkit-highlight:none; -webkit-tap-highlight-color:rgba(0,0,0,0); padding:0; margin:0; overflow: hidden; overflow-y: auto;
}

select, input, textarea { color:#dddbd6; }

a, .content-right p a .icon32, .content-right-hide-button a .icon32 { color:#25b0e5; }
a:hover, .content-right p a:hover .icon32, .content-right-hide-button a:hover .icon32 { color:#c8c8c8; }

p { line-height:100%; padding-top:0.7%; padding-bottom:0.7%; margin:0px; }

::-moz-selection{ background:#25b0e5; color:#fff; text-shadow:none; }
::selection { background:#25b0e5; color:#fff; text-shadow:none; } 

a:link { -webkit-tap-highlight-color:#25b0e5; } 

#page-wrap { 
    position:relative; max-width:100%; height:100%; min-height:100%; padding:4%; margin:0%; overflow: hidden; overflow-y: auto; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}

/* Font Control */
h1 {
    font-family:OpenSans-Light, "Trebuchet MS", Arial, Helvetica, sans-serif; font-size:2.667em; font-weight:normal; text-rendering:optimizelegibility; /* 48px */
}

h2 {
    font-family:OpenSans-Light, "Trebuchet MS", Arial, Helvetica, sans-serif; font-size:1.556em; font-weight:normal; text-rendering:optimizelegibility; /* 28px */
}

h3 {
    font-family:OpenSans-Light, "Trebuchet MS", Arial, Helvetica, sans-serif; font-size:1.500em; font-weight:normal; text-rendering:optimizelegibility; /* 27px */
}

h4 {
    font-family:OpenSans-Light, "Trebuchet MS", Arial, Helvetica, sans-serif; font-size:1.333em; font-weight:normal; text-rendering:optimizelegibility; /* 24px */
}

h5, .login-form-textfield input {
    font-family:OpenSans-Light, "Trebuchet MS", Arial, Helvetica, sans-serif; font-size:1em; font-weight:normal; text-rendering:optimizelegibility; /* 18px */
}

h6 {
    font-family:OpenSans-Light, "Trebuchet MS", Arial, Helvetica, sans-serif; font-size:0.889em; font-weight:normal; text-rendering:optimizelegibility; /* 16px */
}

/* Special Use Fonts */

.text1 {
    font-family: 'vagrounded-bold', Helvetica, Arial, sans-serif; font-size: 6.222em; font-weight:normal; /* 112px */
}

.text2 {
    font-family:OpenSans-Light, "Trebuchet MS", Arial, Helvetica, sans-serif; font-size:1.111em; font-weight:normal; text-rendering:optimizelegibility; /* 20px */
}

h4.login-form-error-title {
    font-family:OpenSans-Regular, "Trebuchet MS", Arial, Helvetica, sans-serif; font-weight:normal; text-rendering:optimizelegibility;
}

/* Global Font Styles */
.textn {
	font-weight:normal;
}

strong, .textb {
	font-family:OpenSans-Semibold, "Trebuchet MS", Arial, Helvetica, sans-serif; font-weight:normal; text-rendering:optimizelegibility;
}

em, em a, .texti, .login-form-textfield input {
	font-family:OpenSans-Light-Italic, "Trebuchet MS", Arial, Helvetica, sans-serif; font-weight:normal; text-rendering:optimizelegibility;
}

.textb.texti {
	font-family:OpenSans-SemiboldItalic, "Trebuchet MS", Arial, Helvetica, sans-serif; font-weight:normal; text-rendering:optimizelegibility;
}

.textc {
	text-align:center;
}

.textr {
	text-align:right;
}

.textl {
	text-align:left;
}

.textu {
	text-decoration:underline;
}

/* Login Page Left Styles */
.content-left {
    float:left; position:relative; width: 28.4%; height:100%; padding:0; margin:0% 6%; margin-right:9.6%; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}

.logo-large {
    clear:both; position:relative; top:0px; left:0px; width:100%; line-height: 100%; color:#25b0e5; padding:0; margin:0%; margin-top:16%; margin-bottom: -14px;
}

.strap-line {
    clear:both; position:relative; top:0px; left:0px; width:100%; line-height: 100%; padding:0; margin:0%;
}

/* Login Form */
.login-form-container {
    clear:both; position:relative; top:0px; left:0px; width:100%; margin-top:30%;
}

.login-form-title {
    color:#c8c8c8;
}

.login-form-textfield {
    clear:both; position:relative; top:0px; left:0px; background: #626262; margin:8% 0%; -webkit-border-radius: 8px; border-radius: 8px; 
    -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}

.login-form-textfield-spacer-remove {
    margin-bottom:0;
}

.login-form-textfield .icon32 {
    position:absolute; right:20px; color:#c8c8c8; padding-top:18px;
}

.login-form-textfield input {
    position:relative; top:0px; left:0px; width:100%; line-height: 100%; color: #FFFFFF; padding:20px; padding-right:65px; background: transparent; border:0px solid #FFFFFF;
    -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}
::-webkit-input-placeholder { color:#dddbd6; }
:-moz-placeholder { color:#dddbd6; }
::-moz-placeholder { color:#dddbd6; }
:-ms-input-placeholder { color:#dddbd6; }
.login-form-textfield input:-webkit-autofill { -webkit-box-shadow: 0 0 0px 1000px #626262 inset; -webkit-border-radius: 8px; }

.forgot a {
    line-height:300%; margin-right:10px;
}

.checker {
    position:relative; display: inline;
}

.has-js .label_check { padding-left: 34px; }
.has-js .label_check { background: url(../images/check-off.png) no-repeat; }
.has-js label.c_on { background: url(../images/check-on.png) no-repeat; }
.has-js .label_check input { position: absolute; left: -9999px; }

label {
    color:#c8c8c8; cursor: pointer; padding-bottom:10px; vertical-align: text-top;
}

label:hover {
    color:#FFFFFF;
}

.login-form-submit-button button {
    background: #25b0e5; color: #FFFFFF; line-height: 100%; font-size:1.444em; font-family: inherit; padding:10px 20px; margin:8% 0%; margin-bottom: 0px; margin-left: 20px; border: 0px solid #FFFFFF; -webkit-border-radius: 4px; border-radius: 4px; 
}

.login-form-submit-button input {
    background: #25b0e5; color: #FFFFFF; line-height: 100%; font-size:1.444em; font-family: inherit; padding:10px 20px; margin:8% 0%; margin-bottom: 0px; margin-left: 20px; border: 0px solid #FFFFFF; -webkit-border-radius: 4px; border-radius: 4px; 
}

.login-form-submit-button button img {
    margin-right:10px; vertical-align: middle;
}

.login-form-submit-button input img {
    margin-right:10px; vertical-align: middle;
}


/* Login Page Right Styles */
.content-right.active {
    display:none;
}
.content-right, .content-right.hidden {
    float:left; display:block; position:relative; width: 56%; height:auto; background:#545454 url(../images/login-interface-arrow.png) no-repeat 0% 12%; padding:5%; margin:0; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}

.content-right h1 {
    margin-bottom:4%;
}

.content-right h2 {
    margin-bottom:8%;
}

.content-right ul li {
    position:relative; line-height: 32px; padding-left:4%; margin:3% 0%; margin-left: 3%; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}

.content-right ul li .icon32 {
    position:absolute; color:#25b0e5; margin-left: -4%; margin-right: 4%;
}

.content-right ul li span.content-right-item-text {
    position:relative; left:4%; width:auto; line-height: 100%; padding-left:3%; margin-left:-3%; margin-right: -4%;
}

/* Login Error Message */
h4.login-form-error-title, .login-form-error-message {
    color:#ffc043;
}

h4.login-form-error-title {
    margin-top:4%;
}

/* Content Right Show / Hide Button */
.mobile-container, .overlay-container, .content-right-show-button, .content-right-show-button.hidden, .content-right-show-button.visible, .content-right-hide-button {
    display:none;
}
@media only screen and (max-width: 2500px) {
    @media only screen and (max-height: 1210px) {
        body { font-size:100%; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
        .content-right { padding-top:3.5%; padding-bottom:4% }
        .content-right h1 { margin-bottom: 4%; }
        .content-right h2 { margin-bottom: 8%; }
    }
    @media only screen and (max-height: 1100px) {
        body { font-size:95%; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
    }
}

@media only screen and (max-width: 1910px) {
    body { font-size:95%; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
    @media only screen and (max-height: 900px) {
        body { font-size:80%; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
    }
    @media only screen and (max-height: 900px) {
        body { font-size:70%; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
        .content-right { padding-top:3%; padding-bottom:3% }
        .content-right h1 { margin-bottom: 3%; }
        .content-right h2 { margin-bottom: 6%; }
        .content-right ul li { line-height: 26px; padding-left:4%; margin-left: 3%; }
        .content-right ul li span.content-right-item-text { left:4%; padding-left:3%; margin-left:-3%; margin-right: -5%; }
        .content-right ul li .icon32 { font-size:26px; margin-left: -5%; margin-right: 5%; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
        .login-form-textfield .icon32 { font-size:26px; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
        .has-js .label_check { padding-left: 24px; }
        .has-js .label_check { background: url(../images/check-off-mobile.png) no-repeat; }
        .has-js label.c_on { background: url(../images/check-on-mobile.png) no-repeat; }
    }
    @media only screen and (max-height: 800px) {
        body { font-size:60%; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
        .content-right { padding-top:3%; padding-bottom:3% }
        .content-right h1 { margin-bottom: 3%; }
        .content-right h2 { margin-bottom: 6%; }
        .content-right ul li { line-height: 24px; padding-left:4%; margin-left: 3%; }
        .content-right ul li span.content-right-item-text { left:4%; padding-left:3%; margin-left:-3%; margin-right: -5%; }
        .content-right ul li .icon32 { font-size:24px; margin-left: -5%; margin-right: 5%; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
        .login-form-textfield .icon32 { font-size:24px; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
        .has-js .label_check { padding-left: 23px; }
        .has-js .label_check { background: url(../images/check-off-mobile.png) no-repeat; }
        .has-js label.c_on { background: url(../images/check-on-mobile.png) no-repeat; }
    }
    @media only screen and (max-height: 700px) {
        .content-right { padding-top:2.5%; padding-bottom:2.5% }
        .content-right h1 { margin-bottom: 2%; }
        .content-right h2 { margin-bottom: 5%; }
        body { font-size:50%; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
        .content-right ul li { line-height: 22px; padding-left:4%; margin-left: 3%; }
        .content-right ul li span.content-right-item-text { left:4%; padding-left:3%; margin-left:-3%; margin-right: -5%; }
        .content-right ul li .icon32 { font-size:22px; margin-left: -5%; margin-right: 5%; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
        .login-form-textfield .icon32 { font-size:22px; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
        .has-js .label_check { padding-left: 20px; }
        .has-js .label_check { background: url(../images/check-off-mobile.png) no-repeat; }
        .has-js label.c_on { background: url(../images/check-on-mobile.png) no-repeat; }
    }
    @media only screen and (max-height: 600px) {
        .content-right { padding-top:2.5%; padding-bottom:2.5% }
        .content-right h1 { margin-bottom: 2%; }
        .content-right h2 { margin-bottom: 5%; }
        body { font-size:40%; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
        .content-right ul li { line-height: 22px; padding-left:4%; margin-left: 3%; }
        .content-right ul li span.content-right-item-text { left:4%; padding-left:3%; margin-left:-3%; margin-right: -5%; }
        .content-right ul li .icon32 { font-size:22px; margin-left: -5%; margin-right: 5%; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
        .login-form-textfield .icon32 { font-size:22px; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
        .has-js .label_check { padding-left: 20px; }
        .has-js .label_check { background: url(../images/check-off-mobile.png) no-repeat; }
        .has-js label.c_on { background: url(../images/check-on-mobile.png) no-repeat; }
    }
}

@media only screen and (max-width: 1700px) {
    body { font-size:80%; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
    .content-right ul li { line-height: 26px; padding-left:4%; margin-left: 3%; }
    .content-right ul li span.content-right-item-text { left:4%; padding-left:3%; margin-left:-3%; margin-right: -5%; }
    .content-right ul li .icon32 { font-size:26px; margin-left: -5%; margin-right: 5%; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
    .login-form-textfield .icon32 { font-size:26px; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
    .has-js .label_check { padding-left: 24px; }
    .has-js .label_check { background: url(../images/check-off-mobile.png) no-repeat; }
    .has-js label.c_on { background: url(../images/check-on-mobile.png) no-repeat; }
}

@media only screen and (max-width: 1520px) {
    body { font-size:78%; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
    .content-right ul li { line-height: 26px; padding-left:4%; margin-left: 3%; }
    .content-right ul li span.content-right-item-text { left:4%; padding-left:3%; margin-left:-3%; margin-right: -5%; }
    .content-right ul li .icon32 { font-size:26px; margin-left: -5%; margin-right: 5%; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
    .login-form-textfield .icon32 { font-size:26px; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
    .has-js .label_check { padding-left: 24px; }
    .has-js .label_check { background: url(../images/check-off-mobile.png) no-repeat; }
    .has-js label.c_on { background: url(../images/check-on-mobile.png) no-repeat; }
}

@media only screen and (max-width: 1450px) {
    body { font-size:75%; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
    .content-right ul li .icon32 { font-size:24px; margin-left: -5%; margin-right: 5%; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
    .login-form-textfield .icon32 { font-size:24px; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
    .content-right p a .icon32 { font-size:24px; margin:0px -5px; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
    .login-form-submit-button img { width:auto; height:16px; }
}

@media only screen and (max-width: 1023px) {
    body { font-size:70%; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
    .content-right ul li { line-height: 24px; padding-left:5%; margin-left: 3%; }
    .content-right ul li span.content-right-item-text { left:5%; padding-left:3%; margin-left:-3%; margin-right: -5%; }
}

/* Mobile */
@media handheld, only screen and (max-width: 990px) {
    body { font-size:100%; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
    .content-left { width: 88%; padding:0; margin:0% 6%; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
    .logo-large { margin-top:16%; }
    .login-form-container { margin-top:12%; }
    .content-right ul li { position:relative; line-height: 32px; padding-left:4%; margin:3% 0%; margin-left: 3%; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
    .content-right ul li span.content-right-item-text { position:relative; left:4%; width:auto; line-height: 100%; padding-left:3%; margin-left:-3%; margin-right: -4%; }
    .content-right ul li .icon32 { font-size:32px; margin-left: -5%; margin-right: 5%; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
    .login-form-textfield .icon32 { font-size:32px; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
    .content-right, .content-right.hidden, .content-right.active p { display:none; }
    /* Content Right Show / Hide Button */
    .content-right-show-button, .content-right-show-button.visible { display:block; }
    .content-right-show-button a, .content-right-show-button.visible a { display:block; position:fixed; top:0px; right:0px; width:67px; height:66px; background:url(../images/about-button-ipad.png) no-repeat top right; text-indent:-9999px; padding:0; margin:0; overflow: hidden; }
    .overlay-container { position:fixed; top:0px; left:0px; width:100%; height:100%; background-color: rgba(48, 48, 48, 0.8); overflow: hidden; }
    .content-right.active { float:none; display:block; position:fixed; width:88%; height:88%; background:#545454; padding:5%; margin:0; margin-left:2%; margin-top:2%; overflow-x: hidden; overflow-y:auto; }
    .content-right-hide-button, .content-right-hide-button a { position:fixed; top:60px; right:65px; width:32px; height:32px; padding:10px; margin:0; }
    .mobile-container { position:fixed; bottom:0px; left:0px; width:100%; height:auto; background: #242424; color:white; padding:2%; margin:0; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
    .mobile-container a:first-child, .mobile-container a:first-child:hover { color:#c8c8c8; cursor:text; }
    .mobile-container a .icon32 { color:#25b0e5; }
    .mobile-container a:hover .icon32 { color:#c8c8c8; }
    .content-right h1, .content-right h2 { text-align:left; }
    .has-js .label_check { padding-left: 34px; }
    .has-js .label_check { background: url(../images/check-off.png) no-repeat; }
    .has-js label.c_on { background: url(../images/check-on.png) no-repeat; }
}

@media handheld, only screen and (max-width: 800px) {
    .content-right-hide-button, .content-right-hide-button a { position:fixed; top:50px; right:55px; width:32px; height:32px; padding:10px; margin:0; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
}

@media handheld, only screen and (max-width: 700px) {
    .content-right.active { font-size:90%; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
    .content-right-hide-button, .content-right-hide-button a { position:fixed; top:40px; right:45px; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
    .content-right.active ul li { width:90%; }
    .content-right.active ul li span.content-right-item-text { position:relative; left:9%; width:auto; padding-left:9%; margin-left:-9%; }
}

@media handheld, only screen and (max-width: 570px) {
    .mobile-container { padding-top:15px; }
    .mobile-container a:first-child, .mobile-container a:last-child { float:right; padding:0px; line-height: 20px; }
    .mobile-container a:first-child { padding-right: 45px; margin-bottom:0px; }
    .mobile-container a:last-child { padding-right:0px; margin-bottom: 15px; }
    .mobile-container a .icon32 { float:right; margin-top: -15px; }
}

@media handheld, only screen and (max-width: 500px) {
    body { font-size:90%; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
    #page-wrap { padding:1%; }
    .content-right-show-button a { width:40px; height:39px; background:url(../images/about-button.png) no-repeat top right; }
    .content-right.active { float:none; display:block; position:fixed; width:96%; height:96%; background:#545454; padding:3%; margin:0; margin-left:1%; margin-top:1%; overflow-x: hidden; overflow-y:auto; }
    .content-right-hide-button, .content-right-hide-button a { position:fixed; top:10px; right:15px; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear;  }
}

@media handheld, only screen and (max-width: 400px) {
    body { font-size:80%; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
    .has-js .label_check { padding-left: 24px; }
    .has-js .label_check { background: url(../images/check-off-mobile.png) no-repeat; }
    .has-js label.c_on { background: url(../images/check-on-mobile.png) no-repeat; }
}

@media handheld, only screen and (max-width: 340px) {
    body { font-size:75%; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
    .logo-large { margin-top:12%; }
    .login-form-container { margin-top:8%; }
    .content-right.active ul li { line-height: 22px; }
    .content-right.active ul li span.content-right-item-text { position:relative; left:7%; width:auto; padding-left:7%; margin-left:-7%; }
    .content-right.active ul li .icon32 { font-size:22px; margin-left: -5%; margin-right: 5%; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
    .login-form-textfield .icon32 { right:0px; font-size:22px; padding-top:14px; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
    .mobile-container a .icon32 { font-size:22px; transition:all .4s linear; -o-transition:all .4s linear; -moz-transition:all .4s linear; -webkit-transition:all .4s linear; }
    .login-form-textfield input { padding:14px; padding-right:40px; }
    .login-form-submit-button button { padding:8px 15px; margin:2% 0%; margin-bottom: 0px; margin-left: 10px; }
    .login-form-submit-button input { padding:8px 15px; margin:2% 0%; margin-bottom: 0px; margin-left: 10px; }
    .mobile-container { padding-top:10px; }
    .mobile-container a:first-child, .mobile-container a:last-child { float:right; padding:0px; line-height: 20px; }
    .mobile-container a:first-child { padding-right: 30px; margin-bottom:0px; }
    .mobile-container a:last-child { padding-right:0px; margin-right:0px; margin-bottom: 10px; }
    .mobile-container a .icon32 { float:right; margin:0px; margin-top: -10px; }
}