@import url("iconfont.css");
/*@import url(https://fonts.googleapis.com/css?family=Roboto:400,500,700);*/
/* RESET */
html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, menu, nav, section, time, mark, audio, video, details, summary {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font-weight: normal;
	vertical-align: baseline;
	background: transparent;
}
article, aside, figure, footer, header, nav, section, details, summary {display: block;}
html {
	box-sizing: border-box;
	height:100%;
	width:100%;
}

*,
*:before,
*:after {
	box-sizing: inherit;
}
img,
object,
embed {max-width: 100%;}
html {overflow-y: auto;}
ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before,
blockquote:after,
q:before,
q:after {content: ''; content: none;}
a {margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent;}
del {text-decoration: line-through;}
abbr[title], dfn[title] {border-bottom: 1px dotted #000; cursor: help;}
table {border-collapse: collapse; border-spacing: 0;}
th {font-weight: bold; vertical-align: bottom;}
td {font-weight: normal; vertical-align: top;}
hr {display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0;}
input, select {vertical-align: middle;}
pre {
    white-space: pre; /* CSS2 */
    white-space: pre-wrap; /* CSS 2.1 */
    white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */
    word-wrap: break-word; /* IE */
}
input[type="radio"] {vertical-align: text-bottom;}
input[type="checkbox"] {vertical-align: bottom;}
.ie7 input[type="checkbox"] {vertical-align: baseline;}
.ie6 input {vertical-align: text-bottom;}
select, input, textarea {font: 99% sans-serif;}
table {font-size: inherit; font: 100%;}
small {font-size: 85%;}
strong {font-weight: bold;}
td, td img {vertical-align: top;}
sub, sup {font-size: 75%; line-height: 0; position: relative;}
sup {top: -0.5em;}
sub {bottom: -0.25em;}
pre, code, kbd, samp {font-family: monospace, sans-serif;}
.clickable,
label,
input[type=button],
input[type=submit],
input[type=file],
button {cursor: pointer;}
button, input, select, textarea {margin: 0;}
button,
input[type=button] {width: auto; overflow: visible;}

.ie7 img {-ms-interpolation-mode: bicubic;}
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }
/* END RESET */
/*COMMON*/
/* A Linux- and Windows-friendly sans-serif font stack: http://prospects.mhurrell.co.uk/post/updating-the-helvetica-font-stack */
body {font: 13px Verdana, sans-serif;}

/* Using local fonts? Check out Font Squirrel's webfont generator: http://www.fontsquirrel.com/tools/webfont-generator */

/* We like off-black for text. */
body, select, input, textarea {color: #6d6c6c;}

a {color: #6d6c6c; text-decoration: none; outline:0;}
a:hover {text-decoration: none;}


/* Custom text-selection colors (remove any text shadows: http://twitter.com/miketaylr/status/12228805301) */
::-moz-selection{background: #5b5b5b; color: #fff; text-shadow: none;}
::selection {background: #5b5b5b; color: #fff; text-shadow: none;}

/*  j.mp/webkit-tap-highlight-color */
a:link {-webkit-tap-highlight-color: #fcd700;}

ins {background-color: #5b5b5b; color: #fff; text-decoration: none;}
mark {background-color: #5b5b5b; color: #fff; font-style: italic; font-weight: bold;}

/* Mozilla dosen't style place holders by default */
input:-moz-placeholder { color:#a9a9a9; }
textarea:-moz-placeholder { color:#a9a9a9; }
/* Helpers */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    border: 0;
}

.caret {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 2px;
    vertical-align: middle;
    border-top: 4px dashed;
    border-right: 4px solid transparent;
    border-left: 4px solid transparent;
}
.img-circle {
    border-radius: 50%;
}
/*  CONTAINER */
.container {
    width: 100%;
    padding: 0
}
.container-fluid {
    padding-right: 10px;
    padding-left: 10px;
    margin-right: auto;
    margin-left: auto;
}
.wrapper {
    padding:20px 20px 20px 80px;
}



.nav {
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
}
.nav > li {
    position: relative;
    display: block;
    float: left;
}
.nav > li > a {
    position: relative;
    display: block;
    padding: 10px 10px;
}
.navbar-nav {
    float: left;
    margin: 0;
}
.navbar-right {
    float: right!important;
}
/* CONTENT */
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6{
    font-family: inherit;
    font-weight: 500;
    line-height: 1.1;
    color: inherit;
}
.h1 .small, .h1 small, .h2 .small, .h2 small, .h3 .small, .h3 small, h1 .small, h1 small, h2 .small, h2 small, h3 .small, h3 small{
    font-size: 65%;
}
.h1, .h2, .h3, h1, h2, h3 {
    margin-top: 20px;
    margin-bottom: 10px;
}
.h1,h1{font-size:36px}
.h2,h2{font-size:30px}
.h3,h3{font-size:24px}
.h4,h4{font-size:18px}
.h5,h5{font-size:14px}
.h6,h6{font-size:12px}
p{margin:0 0 10px}
/* sections */
.page-header {
    padding-bottom: 10px;
    margin: 0 0 10px;
}
.header-actions h1,
.header-actions .h1 {
    margin: 0;
    float: left;
    font-size: 18px;
    line-height: 30px;
}
.header-actions .nav > li > a {
    font-size: 30px;
    padding: 0;
    text-decoration: none;
}
.header-actions .dropdown-menu li > a .iconfont {
    font-size: 30px;
    vertical-align: middle;
}
/*END COMMON*/
/* FORMS */

label {
  display: inline-block;
  max-width: 100%;
  margin-bottom: 5px;
  font-weight: 700;
}
input[type=radio] {
  margin: 4px 0 0;
  margin-top: 1px \9;
  line-height: normal;
}
input[type=checkbox] {
  margin: 4px 0 0;
  margin-top: 1px \9;
  line-height: normal;
  -webkit-appearance: none;
  -moz-appearance: none;
  border: solid 2px #d0d0d0;
  border-radius: 2px;
  display: inline-block;
  width: 20px;
  height: 20px;
  background-color: #ffffff;
  position:relative;
	cursor:hand;
	cursor:pointer;
}
input[type=checkbox]:checked:before {
  font-family: 'iconfont';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
	color:#0066a1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
	content:"\e621";
	display: block;
	width: 20px;
	height: 13px;
	position:absolute;
	text-align:center;
	margin-left: -2px;
	margin-top: 2px;
}
.form-group {
    margin-bottom: 15px;
}
.form-inline .form-group {
    display: inline-block;
    margin-bottom: 0;
    vertical-align: middle;
}


.top-bar-form {
    float: left;
    padding: 10px 10px;
}

.top-bar-form .form-control {
    display: inline-block;
    width: auto;
    vertical-align: middle;
}

.checkbox, .radio {
  position: relative;
  display: block;
  margin-top: 10px;
  margin-bottom: 10px;
}

.checkbox label, .radio label {
  min-height: 20px;
  padding-left: 20px;
  margin-bottom: 0;
  font-weight: 400;
  cursor: pointer;
}

.form-inline .checkbox,
.form-inline .radio {
  display: inline-block;
  margin-top: 0;
  margin-bottom: 0;
  vertical-align: middle;
}
.form-inline .checkbox label,
.form-inline .radio label {
  padding-left: 0;
}

.checkbox input[type=checkbox],
.checkbox-inline input[type=checkbox],
.radio input[type=radio],
.radio-inline input[type=radio] {
  position: absolute;
  margin-top: 4px \9;
  margin-left: -20px;
}

.form-inline .checkbox input[type=checkbox],
.form-inline .radio input[type=radio] {
  position: relative;
  margin-left: 0;
}




::-webkit-input-placeholder {
   font-weight:normal;
}
:-moz-placeholder { /* Firefox 18- */
   font-weight:normal;
}
::-moz-placeholder {  /* Firefox 19+ */
   font-weight:normal;
}
:-ms-input-placeholder {  
   font-weight:normal;
}

.wrapper[role="main"] .actions {
	padding:5px 10px 20px 10px;
	}
/* END FORMS */

/* SSO module */
body
{
    background: #f0f1f5;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    font-family: 'at_Roboto-Light' , sans-serif;
    height: 100%;
    width: 100%;
}
.top-bar {
    position: relative;
    min-height: 50px;
	 margin-top: 10px;
    border: none;;
    background: transparent;
	 text-align:center;
}
 .contentsso {	 
    width: 246px;
    display: block;
	 margin:0 auto 0 auto;
	 
	}
.error {
    width: 570px!important;
}
.top-bar-brand {
    float: none;
}
.top-bar-brand > img {
    display: inline-block;
    height: 58px;
}
nav.top-bar.clearfix span.atosIconFont {
    display: inline-block;
    font-size: 10em;
    line-height: .5em;
    color: #ffffff;
    font-weight: normal;
    padding: 0;
    vertical-align: top;
    margin-left: 0;
    border-left: none;
}

nav.top-bar.clearfix span {
    display: inline-block;
    font-size: 2em;
    color: #ffffff;
    font-weight: normal;
    padding: 12px 0 12px 12px;
    vertical-align: top;
    margin-left: 5px;
    border-left: 2px solid #ffffff;
}
.container.sso {
    min-width: 320px;
}
.sso {
	min-width: auto;
}
.sso .wrapper {
	padding: 20px;
}
.sso-box {
	border-radius: 4px; 
	-moz-border-radius: 4px; 
	-webkit-border-radius: 4px; 
	-webkit-box-shadow: 0px 16px 20px 0px rgba(0,0,0,0.25);
	-moz-box-shadow: 0px 16px 20px 0px rgba(0,0,0,0.25);
	box-shadow: 0px 16px 20px 0px rgba(0,0,0,0.25);
	background-color:#fff;
	display: block;
	margin: 8px auto 30px auto;
	padding: 25px;
	
}
.sso h2 {
	 font-weight: 400;
    font-size: 16px;
    color: #ffffff;
    display: block;
    margin: 0 auto;
    text-align: center;
}
.sso h3 {
	 font-family: 'at_Roboto-Light', sans-serif;
    font-size: 18px;
    font-weight: normal;
    color: #0066a1;
    display: block;
    width: 100%;
    text-align: center;
    margin: 10px auto 0 auto;
}
.sso legend {
	 text-align: center;
    margin: 0 0 9px 0;
    padding-top: 12px;
    width: 100%;
	 font-size:15px;
}
.sso [class^="wg-"],
.sso [class*=" wg-"] {
	display: block;
	padding: 0;
	box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
}

.sso [class^="wg-"]:first-of-type, .sso [class*=" wg-"]:first-of-type {

}
.sso [class^="wg-"]:last-of-type, .sso [class*=" wg-"]:last-of-type {

}
.sso form {
	display: inline-block;
	width: 100%;
	padding: 0;
	box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    position: relative;
	min-height:140px;
}
.sso .alternative form {
	min-height:0!important;
}

.sso input[type=submit].btn {
	font-weight:400;
	background-color:#0066a1;
	border:2px solid #0066a1;
	color:#FFF;
	width:100%;
	min-height:30px;
	padding:4px;
	border-radius: 0;
	margin: 16px 0 13px 0;
	outline: 0;
}
.sso input[type=submit].btn:hover {
	cursor: pointer;
    color: #0066a1;
    border-color: #0066a1;
    background-color: #ffffff;
    -webkit-transition: all 150ms ease-in-out;
    transition: all 150ms ease-in-out;
}
.wg-pki input.btn.btn-block {
  margin-top: 96px;
}
.sso span.atosIconFont {
	 font-size: 24px;
    color: #0066a1;
    height: auto;
    margin-right: 6px;
    display: inline-block;
    text-align: center;
    vertical-align: middle;
}

;
  dthh:auto;
  margin: 0 10px;
}
.sso footer nav ul li a {
  text-decoration:underline;
  color: #fff;
}
.sso footer nav ul 
li
.sso .page-header {
	display:none;
}
.sso .msg-error {
  margin-bottom: -64px;
}
.sso footer {
  padding:0 8px 8px 8px;
  margin:0 auto;
  font-size: 10px;
  color: #000;
}
.sso footer p {
  display:block;
  margin:6px 0 0 0;
  position: absolute;
  bottom: 32px;
  left:0;
  right:0;
  top:auto;
  width: 100%;
  padding: 0 24px;
}
.sso footer nav {
  display:block;
  margin-top:6px;
  text-align:center;
  position: absolute;
  bottom: 12px;
  left:0;
  right:0;
  top:auto;
  width: 100%;
}
.sso footer nav ul li {
  display:inline-block;
  width:auto;
  margin: 0 10px;
}
.sso footer nav ul li a {
  text-decoration:underline;
  color: #fff;
}
.sso footer nav ul li a:hover {
  color:#fff;
}
.sso-error {
	padding:14px;
  border:1px solid #990000;
  background-color:#ffeded;
	}
.sso .sso-error form {
  min-height: 200px;
  border:none;
}
.sso .sso-error form p {
  color:#990000;
}
.sso-error input[type=submit] {
  width:300px;
  margin:60px auto 60px auto;
  display:block;
}
.wg-password input.btn.btn-block {
	width:164px;
	position: absolute;
	bottom: 10px;
	}
.wg-otp input.btn.btn-block {
	width:170px;
	position: absolute;
	bottom: 10px;
	white-space: normal;
	}
.wg-pki input.btn.btn-block {
	/*position: absolute;*/
	padding:10px;
	border-radius: 3px 3px 3px 3px;
	-moz-border-radius: 3px 3px 3px 3px;
	-webkit-border-radius: 3px 3px 3px 3px;
	width: 100%;
    margin: 24px auto 0 auto;
    display: block;
	 font-weight: 400;
    text-transform: uppercase;
    font-family: 'at_Roboto-Light', sans-serif;
}
.error .wg-pki input.btn.btn-block {
    width: 235px;
	 max-width:100%;
}
.loginOption {
	font-family:Verdana, Geneva, sans-serif;
	color:#aea400;
	font-size:13px;
	font-weight:normal;
	display: block;
}
.green-dark {
	color:#63b0a8;
}
.decommissioned {
	font-family:Verdana, Geneva, sans-serif;
	color:#e06224;
	font-size:9px;
	line-height:10px;
	text-align:left;
	display:block;
	margin-top: 4px;
}
.icoInfo {
    background-color: #777777;
    color: #ffffff;
    display: block;
    width: 18px;
    height: 18px;
    text-align: center;
    padding-top: 5px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    font-size: 11px;
    border-radius: 50%;
    font-weight: bold;
    overflow: hidden;
	font-family: Verdana, Geneva, at_Roboto-Light;
}
.tooltipInfo:hover .icoInfo {
    background-color: #5b5b5b;
}
.tooltipInfo {
    width: 30px;
    height: 30px;
    display: inline-block;
    overflow: visible;
    margin: 0;
    padding: 4px 0 0 10px;
    cursor: help;
    position: relative;
    line-height: 10px;
    vertical-align: middle;
}
.tooltipInfo div {
    position: absolute;
    bottom: 15px;
    display: none;
    background-color: transparent;
    padding: 0 0 19px 0;
    width: 190px;
    margin-left: -100px;
    z-index: 1;
	 cursor:default;
}
.tooltipInfo div p {
    font-weight: 400;
    font-size: 12px;
    color: #ffffff;
    text-align: left;
    line-height: 12px;
	font-weight:100;
    display: block;
    width: 100%;
    padding: 8px;
    background-color: #4c4c4c;
    margin: 0;
	 border-radius: 3px 3px 3px 3px;
    -moz-border-radius: 3px 3px 3px 3px;
    -webkit-border-radius: 3px 3px 3px 3px;
	     -webkit-box-shadow: 2px 2px 4px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 2px 2px 4px 0px rgba(0,0,0,0.25);
    box-shadow: 2px 2px 4px 0px rgba(0,0,0,0.25);
}
.tooltipInfo div p br {
    font-size: 13px;
}
.tooltipInfo:hover div {
    display:block;
}
.tooltipInfo div:after, .tooltipInfo div:before {
    border: solid transparent;
    content: ' ';
    height: 0;
    right: 75px;
    position: absolute;
    width: 0;
}

.tooltipInfo div:after {
    border-width: 6px;
    border-top-color: #4c4c4c;
    bottom: 8px;
}

.tooltipInfo div:before {
    border-width: 6px;
    bottom: 7px;
}
.tooltipInfo div a {
    color:#ffffff;
	 text-decoration:underline;
	 font-weight:bold;
}
.tooltipInfo div a:hover {
    color:#ffffff;
}
.modal-sso {
    min-width: 80%;
    max-width: none;
	 left:0;
	 right:0;
	 bottom:0;
	 top:0;
}
.modal-sso .modal-header {
    border: 1px solid #e5e5e5;
	 background-color:#0066a1;
}
.modal-sso .modal-title {
    color:#ffffff;
	 font-weight:normal;
	 font-family: 'Stag-Book';
	 font-size: 16px;
}
.modal-sso .close {
    color: #ffffff;
    filter: alpha(opacity=100);
    opacity: 1;
}
.modal-sso .modal-dialog {
	width:80%;
    max-width: 514px;
}
.modal-sso .modal-body strong {
	color:#0066a1;
}
.orange-button {
color:#fff;
background-color:#e06224;
border-radius: 0;	
font-weight:normal;
font-family:Verdana, Geneva, sans-serif;
font-size:12px;
padding:6px 40px;
	}
.orange-button:hover {
background-color:#5b5b5b;
	}
.modal-footer {
    padding: 9px 15px;
    border: 1px solid #d0d0d0;
	 background-color:#f9f9f9;
}
.sso.pki-box h2 {
    max-width: 408px;
}
.pki-box .sso-box {
    background-color: #fff;
    display: block;
    margin: 8px auto 30px auto;
    max-width: 408px;
}

.sso.pki-box [class^="wg-"], .sso.pki-box [class*=" wg-"] {
    width: 50%;
}
.sso.pki-box .wg-pki {
    padding-left: 14px;
}
.sso-box .msg {	
	border:none;
	padding:10px;
	margin: 14px 14px 0 14px;
	}
.sso-box .msg-announcement {
	background-color:#e5eff5;
	color:#0066a1;
	}
.sso-box .msg-announcement a {
	text-decoration:underline;
	color:#0066a1;
	}
.sso-box .msg-announcement a:hover {
	text-decoration:underline;
	color:#000000;
	}
.sso-box .msg-error {
	background-color:#fcefe9;
	color:#ff6319;
	}
.sso-box .btn-column .btn-block {
    border-radius: 0;
    background-color: #0066a1;
    color: #ffffff;
    font-weight: normal;
    font-size: 100%;
    padding: 8px 12px;
    display: block;
    width: 100%;
    margin-top: 8px;
	font-weight:normal;
}
.btn-column {
    padding: 0 14px;
}

.sso.otp-box h2 {
    text-align:center;
}
.sso.otp-box .sso-box {
   max-width: 220px;
}
.sso.otp-box .wg-otp {
    width:100%;
}
.sso.otp-box .wg-otp input.btn.btn-block {
    width: 170px;
    position: relative;
    bottom: auto;
    margin: 0 0 6px 0;
}
.sso .alternative span.atosIconFont {
	 color: #999999;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    background-color: #ffffff;
    padding: 10px;
    display: block;
    width: 44px;
    height: 44px;
    overflow: hidden;
    font-size: 24px;
	 margin:0 auto 8px auto;
	}
.sso .alternative button {
	 display:block;
	 color: #ffffff;
	 border:none;
	 padding:0;
	 margin:0;
	 background-color:transparent;
	 font-size: 16px;
    font-weight: 100;
	outline: 0;
	}
.sso .alternative ul li button:hover {
	color:#ffffff;
	}
.sso .alternative button:hover span.atosIconFont {
	color: #0066a1;
	}
.sso .alternative ul {
	text-align:center;
	}
.sso .alternative ul li {
	display:inline-block;
	text-align:center;
	margin: 18px 10px 0 10px;
	}
.sso label {
    font-size: 14px;
    font-weight: 400;
    color: #929292;
    margin-bottom: 0;
}
.sms_message {
    color: #000000;
    text-align: center;
    font-size: 15px;
    margin-bottom: 12px;
    margin-top: -5px;
}
.sms_message span {
    font-size: 15px;
    display:block;
	 font-weight:700;
}
.error_message {
    font-size: 15px;
    color: #6d6c6c;
    margin: 19px 0;
}
.error_message a {
    text-decoration:underline;
	 font-weight:700;
}

.ie8 .iconfont-logo:before {
  content: "";
}
.ie8 .top-bar-brand {
  background: url(../images/sso/iconfont-logo.png) no-repeat center center;
  display: block;
  min-width: 120px;
}
.ie8 .top-bar-brand img {
  display: none;
}

.ie8 h2,
.ie8 .sso-box {
    position: relative;
}

.ie8 .sso span.atosIconFont {
    width: 60px;
    height: 50px;
}
.ie8 .iconfont-login_password {
  content: "";
  background: transparent url(../images/sso/iconfont-login_password.png) no-repeat;
}
.ie8 .iconfont-login_otp {
  content: "";
  background: transparent url(../images/sso/iconfont-login_otp.png) no-repeat;
}
.ie8 .iconfont-login_pki {
  content: "";
  background: transparent url(../images/sso/iconfont-login_pki.png) no-repeat;
}

.ie8 .sso {
    height: 100%;
    min-width: 640px;
    background: none;
    position: relative;
    overflow: hidden;
}
.ie8 .sso.shortSSO {
    height: auto;
}
.ie8 .sso footer {
    height: 70px;
    position: relative;
    z-index: 2;
}
.ie8 .sso.shortSSO footer {
    height: auto;
    margin-top: 30px;
}
.ie8 body.sso {
		background:#f0f1f5;
		}
.sso .alternative ul li {
	margin: 18px 8px 0 8px;
	vertical-align:top;
	}
.sso .separator {
    border-top: 1px solid #D8D8D8;
    margin-top: 10px;
    padding-top: 10px
}
	
.sso footer 
{
    border-top: 1px solid #D8D8D8;
    position: relative;
    padding: 15px 20px 8px 20px;
    left: auto;
    margin: 0 auto;
	 width:100%;
	 text-align:center;
	/* background: url(../images/backgrounds/background-sso_footer.png) no-repeat top center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;*/
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    top: auto;
    width: 100%;
    height: 83px;
	margin-top:20px;
	 color:#929292 #fff;
	 display:block;
	 /*min-height: 194px;*/
	 font-size: 12px;

}

.footer_fixed footer {
    position: fixed;
    left: 0px;
    bottom: 0px;
    width: 100%
}

body {
	 overflow: hidden;
}
/*
@media screen and ( min-width: 1600px ) and ( min-height: 850px ){
    .sso footer {
    	left:50%;
    	margin-left:-800px;
		 }
	}
*/
@media screen and (max-width: 1200px) {
    .sso footer p {
        display:block;
        width:100%;
        float:none;
    }
    .sso footer nav {
        display:block;
        float:none;
        text-align:right;
    }
    .sso footer nav ul {
        width:auto;
		  text-align: center;
    }
    .sso footer nav ul li {
        width:auto;
        margin:0 10px;
    }
}

@media screen and (min-height: 970px) and (min-width: 700px) {
	
    .sso {
    	/*position: absolute;
    	width: 100%;
    	min-height: 100%;
    	top: 0;*/
    }
    .sso footer {
    bottom: 0;
    z-index: 2;
    width: 100%;
    left: 0;
    right: 0;
    text-align: center;
    }
    .sso footer nav {
        display:block;
        float:none;
        text-align:center;
    }
    .sso footer nav ul {
        width:auto;
    }
    .sso footer nav ul li {
        width:auto;
        margin:0 10px;
    }
	 .contentsso {
    margin-left: -123px!important;
    left: 50%;
    position: absolute;
    display: block;
	 top: 40%;
	}
	.error {
    margin-left: -285px!important;
	}
	.contentsso.pki {
    margin-top: -224px;
	}
	.top-bar {
    margin-top: 2%;
	}	
	.contentsso {
    width: 246px;
    display: block;
    margin: 0 auto 0 auto;
    /*margin-bottom: 21%;*/
	}
	.error {
    max-width: 80%;
	}
}
@media screen and (max-height: 970px) {	
    footer {
    position: relative!important;
	 /*height: 171px!important;*/
    }
	.contentsso {
    width: 246px;
    display: block;
    margin: 0 auto 0 auto;
	}
	body {
	overflow: auto;
	}
}

@media screen and (max-width: 700px) {
	.error {
    max-width: 80%;

    width: 80%!important;
    
	}
	.btn { 
	white-space:normal;
	}
	nav.top-bar.clearfix span.atosIconFont {
    font-size: 5em;
    line-height: .9em;
	}
}

@media screen and (max-width: 700px) and (max-height: 700px) {
	
	body {
		background:#f0f1f5;
		}
		
	.top-bar {
    margin-top: 5px;
    margin-bottom: 16px;
	}
    .sso {
    	position: relative;
    	background-position: 0px top;
    }
	 .top-bar-brand > img {
    height: 40px;
		}
	 footer {
      position: relative!important;
		min-height:0!important;
		color:#000!important;
		background:none!important;
		height: auto!important;
    }
	 .sso footer p,
	 .sso footer nav { 
        position: relative;
		  bottom:auto;
    }
	 .sso footer nav ul li a,
	  .sso footer nav ul li a:hover{
    color: #000;
	 }
	 .contentsso {
    width: 270px;
    display: block;
    margin: 0 auto;
		}
	 .sso footer ul {
        text-align:center;
    }
	 .sso footer p {
    display: block;
    margin: 10px 10px 5px 10px;
	}
    .sso [class^="wg-"], 
	 .sso [class*=" wg-"],
    .sso.pki-box [class^="wg-"], 
	 .sso.pki-box [class*=" wg-"]	 
	  {
        display: block;
        width: 100%;
        padding: 7px 14px;
        float: none;
    }
    .sso [class^="wg-"]:first-of-type, .sso [class*=" wg-"]:first-of-type {
        padding-top: 14px;
    }
    .sso [class^="wg-"]:last-of-type, .sso [class*=" wg-"]:last-of-type {
        padding-bottom: 0;
    }
    .sso h2, .sso.pki-box h2 {
        margin-top:-13px;
        max-width: 240px;
		  margin-bottom: -8px;
    }
	  .sso .sso-box {
		 padding: 0px 6px 20px 6px;
	 }
    .sso .msg-error {
        margin-bottom: 0;
    }
	 
    .sso input[type=submit], .sso input[type=text], .sso input[type=password] {
        width:100%;
        height: 38px;
    	  padding-top: 7px;
    }
    .wg-password input.btn.btn-block {
    	width:100%;
    	position: relative;
    	bottom: auto;
	}
    .wg-otp input.btn.btn-block {
    	width:100%;
    	position: relative;
    	bottom: auto;
	}
    .wg-pki input.btn.btn-block {
    	position: relative;
    	bottom: auto;
		width: 100%!important;
      white-space: normal;
      height: auto;
      padding: 8px;
	}
	.modal-sso .orange-button {
	width:100%;
	}
	
	.contentsso {
    width: 246px;
    display: block;
    margin: 0 auto 0 auto;
	 position: relative;
	}
	nav.top-bar.clearfix span {
    padding: 7px 0 12px 12px;
	}
	nav.top-bar.clearfix span {
    color: #0066A4;
    border-left: 2px solid #0066A4;
	}
	.sso h2 {
    color: #0066a1;
	}
	.sso .alternative span.atosIconFont {
    color: #ffffff;
    background-color: #777777;
	}
	.sso .alternative button {
	 color: #777777;
	}
	.sso .alternative ul li button:hover {
    color: #3a3a3a;
	}
	.sso .alternative button:hover span.atosIconFont {
    color: #ffffff;
	background-color: #3a3a3a;
	}
	nav.top-bar.clearfix span.atosIconFont {
    color:#0066a1;
	}
}