/* latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 100;
  src: local('Roboto Thin'), local('Roboto-Thin'), url(/static/fonts/Roboto/Roboto-Thin.ttf) format('truetype');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}
/* latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  src: local('Roboto Light'), local('Roboto-Light'), url(/static/fonts/Roboto/Roboto-Light.ttf) format('truetype');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}
/* latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: local('Roboto'), local('Roboto-Regular'), url(/static/fonts/Roboto/Roboto-Regular.ttf) format('truetype');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}

html{
  -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
  margin:0; padding:0;
}

*, *:before, *:after {
  -webkit-box-sizing: inherit; -moz-box-sizing: inherit; box-sizing: inherit;
  font-weight:inherit;
}
body{
	margin:0; box-sizing:border-box;
	font-family: 'Roboto', sans-serif;
	font-weight:300;
	font-size:16px;
	margin:0px;
	padding:0px;
	height:100%;
	width:100%;
}
table{border-collapse: collapse;margin:0;}
div{margin:0;}
select, input{font-size:16px; padding:5px; font-family: 'Roboto', sans-serif;}
textarea{font-size:16px; padding:3px;}
p, h1, h2, h3, h4{text-align:inherit;}
h1, h2, h3, h4 {font-family: 'Roboto', sans-serif;}
table td p, table td p.fa, p.fa{font-family:'Roboto'; font-weight:300; line-height:150%;}
table{width:100%;}
p{margin-top:0px; line-height:150%;}
h2{margin-bottom:10px; margin-top:40px;}
h1{margin-bottom:30px; margin-top:30px;}
a{ text-decoration:none; color:#2272B3;}
a:hover{color:#4292D3; cursor:pointer;}

input[type="submit"], button{cursor:pointer;}
b{font-weight:400;}
pre{
	text-align:left;
	border-top:1px solid #A0A0A0;
	border-bottom:1px solid #A0A0A0;
	background:#F0F0F0;
	padding:20px 10px;
}
.FLOW{float:left;}
.NEWLINE{float:left; clear:left;}
.COVER{position:fixed; z-index:20000; width:100%; height:100vh; top:0; left:0;}
.NOWRAP{ white-space:nowrap;}
.CONTENT_WIDTH{max-width:1200px;}
.BOOST{font-size:150%;}
.FULLWIDTH{width:100%;display:block; float:left;}
.W100{width:100%;max-width:100%;}
.AUTOWIDTH{width:initial;display:inline-block; float:none;}
.CAP100{max-width:100px;}
.CAP200{max-width:200px;}
.CAP300{max-width:300px;}
.CAP400{max-width:400px;}
.CAP500{max-width:500px;}
.CAP600{max-width:600px;}
.CAP800{max-width:800px;}
.CAP1000{max-width:1000px;}
.H100VH{height:100vh;}
.FULLHEIGHT{height:80vh;}
.MIDHEIGHT{height:70vh;}
.HALFHEIGHT{height:50vh;}
.THIRDHEIGHT{height:33vh;}
.W-ADJUST{width:0.1%;}
.BFRAMED{border:1px solid #000000;}
.SPACE-3{margin-top:30px; margin-bottom:0;}
.SPACE-2{margin-top:20px; margin-bottom:0;}
.SPACE-1{margin-top:10px; margin-bottom:0;}
.HL-2{line-height:150%;}
.HL-3{line-height:300%;}
.NOMARGIN{margin:0;}
.NOPADDING{padding:0;}
.CROPCIRCLE{border-radius:200px;}
.C-ROW{width:100%; display:block;}
.INLINE{float:none; display:inline-block; }
.C-LEFT{float:left; clear:both; margin-right:40px;}
.C-RIGHT{float:right; clear:both;}
.C-CENTER{float:none; display:inline-block; max-width:100%; width:1200px;}
.C-CENTER_PLUS{float:none; display:inline-block; max-width:100%; width:1220px;}
.C-BLOG{float:none; display:inline-block; max-width:100%; width:1000px; padding-left:15px; padding-right:15px;}
.C-TITLE{float:none; display:inline-block; max-width:100%; width:800px;}
.OFFSET150{margin-top:150px;}
.OFFSET50{margin-top:50px;}
.SMALL_SPACING{margin-top:10px;margin-bottom:10px;}
.BOOST_SPACING{margin-top:30px;margin-bottom:30px;}
.BOOST_SPACING_MORE{margin-top:60px;margin-bottom:60px;}
.FULLPAD10{padding:10px;}
.FULLPAD20{padding:20px;}
.PAD10{padding-left:10px; padding-right:10px;}
.PAD20{padding-left:20px; padding-right:20px;}
.PAD40{padding-left:50px; padding-right:0px;}
.PAD-RIGHT{padding-right:50px;}
.PERCENT75{width:75%;height:75%;}
.PERCENT66{width:66%;height:66%;}
.PERCENT50{width:50%;height:50%;}
.L-MENU{border:1px solid #D0A0A0; padding:20px 5px; color:#AAAAAA; display:inline-block;}
.ALIGN-L{text-align: left;}
.ALIGN-C{text-align: center;}
.ALIGN-R{text-align: right;}
.ALIGN-J{text-align: justify;}
.OPACITY75{opacity:0.75;}
.OPACITY66{opacity:0.66;}
.OPACITY33{opacity:0.33;}
.NODISPLAY{display:none;}
.OVERCAST{
	background:rgba(0, 0, 0, 0.6);
}
.DARK{
	background-color:#404040;
	background-image: url('/static/img/abstract-background.jpg');
	background-position:center center;
	background-repeat: no-repeat;
	background-size:cover;
}
.emphasized{
	color:#000000;
	font-size:20px;
	font-weight:300;
	padding:0.75em 0.75em;
	color:#404040;
	background:rgba(0, 0, 0, 0.03);
}

div.HR{width:100%; display:block; height:1px; border-bottom:1px solid rgba(0, 0, 0, 0.1); float:left;}
div.separator{width:50px; display:inline-block; height:20px; margin:0px; border-top:1px solid rgba(0, 0, 0, 0.5);}

.H100{height:100px;}
.H200{height:200px;}
.H300{height:300px;}
.H400{height:400px;}
@media screen and (max-width: 600px){
	.H200{height:initial;}
	.H300{height:initial;}
	.H400{height:initial;}
	.PAD20{padding-left:5px; padding-right:5px;}
	.PAD40{padding-left:10px; padding-right:10px;}
}

.W200{height:200px;}
.W250{height:250px;}
.W300{height:300px;}
.W400{height:400px;}


/*** layout styles ***/ 
ul.cards, ul.ltr_cards{
    box-sizing:border-box;
    width:100%;
    margin:0; 
    list-style-type: none;
    padding:0;
}
ul.cards li{
	float:left;
	vertical-align:middle;
}
ul.ltr_cards li{
	float:right;
	vertical-align:middle;
}

.PAGE_TITLE{
	margin-top:15vh;
}

ul.n5 li{width:20%;}
@media only screen and (max-width: 1300px){ul.n5 li{ width:25%;}}
@media only screen and (max-width: 1000px){ul.n5 li{ width:33.33%;}}
@media only screen and (max-width: 800px){ul.n5 li{ width:50%;}}
@media only screen and (max-width: 600px){ul.n5 li{ width:100%; display:block;}}

ul.n4 li{width:25%;}
@media only screen and (max-width: 1000px){ul.n4 li{ width:33.33%;}}
@media only screen and (max-width: 800px){ul.n4 li{ width:50%;}}
@media only screen and (max-width: 600px){ul.n4 li{ width:100%; display:block;}}

ul.n3 li{ width:33.33%;}
@media only screen and (max-width: 1000px){ul.n3 li{ width:50%;}}
@media only screen and (max-width: 500px){ul.n3 li{ width:100%; display:block;}}

ul.n2 li{ width:50%;}
ul.n2 li.icon{ width:34%;}
ul.n2 li.content{ width:66%;}
@media only screen and (max-width: 1000px){
	ul.n2 li{ width:100%; display:block;}
	ul.n2 li.icon{ width:100%;}
	ul.n2 li.content{ width:100%;}
}

@media only screen and (max-width: 1000px){ul.n2 li{ width:100%; display:block;}}

ul.n1 li{ width:100%; display:block;}

div.widget_s{
    box-sizing:border-box;
    height:130px;
    float:left;
    width:100%;
    padding:0px 30px 0px 10px;
    background-size:cover;
    vertical-align:middle;
    overflow:hidden;
}
@media only screen and (max-width: 1000px){	div.widget_s{height:auto;}}
@media only screen and (max-width: 500px){	div.widget_s{width:100%; padding:0px;}}
div.widget{
    box-sizing:border-box;
    width:100%;
    padding:20px;
    background-size:cover;
    vertical-align:middle;
    overflow:hidden;
}
div.widget img{
    vertical-align:middle;
    display:inline-block;
    line-height:normal;
}
div.widget h2{
	padding-bottom:2px;
	margin-bottom:3px;
	margin-top:30px;
}
div.widget h3, div.widget_s h3{
	padding-bottom:2px;
	margin-bottom:3px;
	font-size:20px;
	font-weight:400;
}
@media only screen and (max-width: 500px){div.widget h3, div.widget_s h3{ font-size:18px;			}}
div.widget p{
	line-height: 150%;
	opacity:1;
}
div.widget_s p{
	opacity:1;
}
div.widget_s:hover p{
	opacity:1;
}
.inv{
	color:#FFFFFF;
	padding-bottom:2px;
	margin-bottom:3px;
}
.bullet{
	padding-left:20px;
}
.bullet:before{
	content: '+';
	font-weight:400;
	margin-left:-20px;
	margin-right:10px;
}

@media only screen and (max-width: 1000px){ul.n2 li div.widget, ul.n3 li div.widget, ul.n4 li div.widget{ height:initial;}}

.anim_underline{
    border-bottom:1px solid rgba(255, 255, 255, 0);      
    -webkit-transition: border-color 0.5s ease-in;
    transition: border-color 0.5s ease-in;      
}
anim_underline:hover{
    border-bottom:1px solid rgba(255, 255, 255, 1);            
}

/*** look styles ***/ 

ul.n1 li div{}
ul.n1 li h1{ font-size:35px;}
ul.n1 li p{ font-size:20px;}
@media only screen and (max-width: 1200px){
	h1, ul.n1 li h1{ font-size:30px;}
	ul.n1 li p{ font-size:18px;}
}
@media only screen and (max-width: 1000px){
	h1, ul.n1 li h1{ font-size:27px;}
	ul.n1 li p{ font-size:18px;}
}
@media screen and (max-width: 600px){
	h1, ul.n1 li h1{ font-size:22px;}
	ul.n1 li p{ font-size:16px;}
}


/*** animation styles ***/ 

.glide_in{
    opacity: 0;
    position: relative;
    transition-duration: 0.7s, 0.5s;
    transition-timing-function: ease-out, ease-out;
}
.glide_in_up{ top: 100px; transition-property: opacity, top;}
.glide_in_up_done{ opacity: 1; top: 0px;}

.glide_in_right{ right: 100px; transition-property: opacity, right;}
.glide_in_right_done{ opacity: 1; right: 0px;}

.glide_in_down{ bottom: 100px; transition-property: opacity, bottom;}
.glide_in_down_done{ opacity: 1; bottom: 0px;}

.glide_in_left{ left: 100px; transition-property: opacity, left;}
.glide_in_left_done{ opacity: 1; left: 0px;}

.delay_in{transition-delay:2s;}

.zoom_in{
	position:relative;
    transition-duration: .3s, .3s, .3s, .3s;
    transition-timing-function: ease-out, ease-out, ease-out, ease-out;
    opacity:0;
	width: 64px; height:64px; transition-property: opacity, top, width, height;
}


/*** backgrounds ***/
.GRAY_2{background-color:#202020;}
.GRAY_3{background-color:#303030;}
.GRAY_5{background-color:#505050;}
.GRAY_7{background-color:#707070;}
.GRAY_D{background-color:#D0D0D0;}
.GRAY_E{background-color:#E0E0E0;}
.GRAY_E7{background-color:#E7E7E7;}
.GRAY_F{background-color:#F0F0F0;}
.GRAY_F7{background-color:#FAFAFA;}
.GRAY_FE{background-color:#FEFEFE;}

.fp_0{background:#F7F7F7; padding:50px 10px 50px 10px; border-bottom:50px solid #F7F7F7;}
.fp_2{background:#303030; padding:50px 10px 50px 10px; border-bottom:50px solid #F0F0F0;}
.fp_3{background:#4292D3; padding:50px 10px 50px 10px;}
.fp_3 .widget img{margin-top:16px;}
@media only screen and (max-width: 500px){.fp_3 .widget img{margin-top:16px; width:40px;	}}
.fp_4{background:#F0F0F0; padding:50px 10px 50px 10px;}
.fp_5{padding:0px 10px 50px 10px; margin-top:100px; background:#FFFFFF}
@media only screen and (max-width: 1000px){.fp_6{height:400px;} .fp_6 table{height:400px;}}
@media only screen and (max-width: 500px){.fp_6{height:300px;} .fp_6 table{height:300px;}}
.fp_7{background:#91C23D; padding:50px 10px 50px 10px;}
.fp_8{background:#F7F7F7; padding:50px 10px 50px 10px;}

.fp-team{border-radius:220px; border-width:10px; border-style:solid; border-color:rgba(0, 0, 0, 0.1); width:220px;}
.fp-team-small{border-radius:128px; border-width:7px; border-style:solid; border-color:rgba(0, 0, 0, 0.1); width:128px;}

@media only screen and (max-height: 720px){
	.BOOST_SPACING{margin-top:10px;margin-bottom:10px;}
}
@media only screen and (max-width: 720px){
	.OFFSET150{margin-top:100px;}
	.fp_5{margin-top:0px;}
	.fp_9{height:400px; margin-bottom:0px;}
	.fp_9 table{height:400px;}
	.fp_9 table td{vertical-align:top;}
}
.fp_12{background:#4292D3; padding:50px 10px 50px 10px;}
.fp_12 td, .fp_12 th{vertical-align:bottom;}
.fp_12 th{padding-right:50px;}
.fp_12 div.widget h2{margin-top:0px; font-size:30px;}
.fp_13{background:#FFFFFF; padding:40px 10px 40px 10px;}

td.icon{
	width:60px;
}
td.icon img{
	width:60px;
	margin-right:40px;
}
@media only screen and (max-width: 720px){
	td.icon{
		width:48px;
		vertical-align:top;
		padding-top:20px;
	}
	td.icon img{
		width:48px;
		margin-right:10px;
	}
}
	
.shield{background: #FFFFFF;}
.shield p, .shield h1, .shield h2, .shield h3, .shield h4 {color:#202020;}
.feature{
	max-width:400px;
	margin:0px 25px;
}

.feature h2{color:#FFFFFF; border-bottom:1px solid rgba(255, 255, 255, 0.3); font-size:24px;width:100%; text-align:center;padding-bottom:10px; margin-bottom:10px;}
.comment{color:rgba(0, 0, 0, 0.6); font-size:18px}

.uppercase{text-transform: uppercase;}
.shield p .with_border{border:1px solid #137aA2; padding:10px 30px; border-radius:6px;}
.shield img{width:80%;}


a.logo{
    padding:0;
    margin:0;
	float:left;
	margin-top:8px;    
}
a.logo img{
    -webkit-transition: height 0.2s linear;
    transition: height 0.2s linear;
}
a.logo-title{
	background:url('/static/img/logo.svg') no-repeat center left;
	background-size: 95%;
	padding-left	:180px;
	height:30px;
	border-right:1px solid #AFAFAF;
	margin-right:10px;
}
a.darka{color:#2272B3;}
a.darka:hover{color:#4292D3;}


.HEADER_BAR a.darka{float:right;}
.HEADER_BAR .HEADER-INNER-THIN a.darka{margin-top:2px;}

.branding{
	text-decoration:none;
	margin:0.05em 0px 0px 0px;
	background-size:auto 100%;
	background-repeat:no-repeat;
	background-position:right 0% center;
	color:#000000;
}
.branding span{
	color:#4292D3;
	font-weight:400;
	margin-left:0.05em;
}
.brand:before, .branding:before{
	content: '/';
	color:#4292D3;
	font-weight:600;
	margin-right:0.1em;
}
.brand:after{
	color:#4292D3;
	font-weight:400;
	margin-left:0.15em;
}
.shadow-branding{
	text-decoration:none;
	margin:0.05em 0px 0px 0px;
	background-size:auto 100%;
	background-repeat:no-repeat;
	background-position:right 0% center;
	color:#000000;
}
.shadow-branding:after{
	color:#4292D3;
	font-weight:400;
	margin-left:0.05em;
}
.inv .branding{
	color:#FFFFFF;
}


.FOOTER div{
	float:left; padding:0px 50px 5px 5px;
	min-height:130px;
}
.FOOTER div.copyright{
	float:right; margin-right:0px; padding-right:30px; border-right:0px;
}
.FOOTER .fa-warning:before{
	background-color:#E0E0E0;
	border:0px solid #202020;
}
.FOOTER .fa-check:before{
	background-color:#E0E0E0;
	border:0px solid #202020;
}

div.FOOTER{
	padding:40px 30px 70px 30px;
	background:#303740;
	border-top:1px solid #101010;
	width:100%;
	float:left;
	box-shadow: inset 0px 13px 15px -5px rgba(0,0,0,0.26);
}

div.FOOTER p{
	color:rgba(255, 255, 255, 0.9);
	margin:5px 10px 0px 0px;
	float:left;
	line-height:180%;
	font-size:16px;
	clear:left;
}
div.FOOTER p.copy{
	font-size:14px;
	margin:20px 0px 0px 0px;
	color:rgba(255, 255, 255, 0.7);
	line-height:180%;
	text-align:left;
}
div.FOOTER h4{
	color:rgba(220, 240, 255, 0.4);
	font-weight:400;
	text-transform:uppercase;
	margin:0px 10px 0px 0px;
	float:left;
	line-height:180%;
	font-size:14px;
	border-bottom:1px solid rgba(255, 255, 255, .1);
	width:100%;
	text-align:left;
	padding-bottom:5px;
}

div.FOOTER a{
	color:rgba(255, 255, 255, 0.7);
	font-weight:300;
	margin:5px 10px 0px 0px;
	float:left;
	clear:left;
	text-align:left;
	line-height:180%;
	font-size:16px;
}
div.FOOTER .social a{
	clear:none;
}
	
div.FOOTER a img{
	width:40px;
	border:0;
	opacity:0.7;
}

div.FOOTER a:hover{
	color:rgba(255, 255, 255, 0.8);
}

.FOOTER .branding{
	color:rgba(255, 255, 255, 0.7);
}
.FOOTER .branding:after{
	content:'';
}
.FOOTER .branding:before{
	background:#4292D3;
	content:'id+';
	color:#FFFFFF;
	border:1px solid #FFFFFF;
	padding:2px 1px 1px 2px;
	padding:0.15em 0.1em 0.15em 0.1em;
	margin-right:5px;
}
.FOOTER .no-branding:before{
	content:'id+';
	color:#D35220;
	border:1px solid #D35220;
	padding:2px 1px 1px 2px;
	margin-right:5px;
}

.HEADER_BAR{
	position:fixed;
	top:0px;
	vertical-align:middle;
	z-index:90;
    width:100%;
}
.HEADER-INNER{
	padding:5px 20px 5px 20px;
	float:left;
	text-align:center;
	width:100%;
	background: rgba(255, 255, 255, 0.0);
    -webkit-transition: background 0.2s linear, height 0.2s linear;
    transition: background 0.2s linear, height 0.2s linear; 
    height:64px;     
}
.HEADER-INNER a.logo img{
	height:48px;
}
@media screen and (max-width: 600px){
	.HEADER-INNER a.logo img{
		height:50px;
	}
}
.HEADER-INNER-THIN{
	padding:2px 5px 2px 20px;
	float:left;
	text-align:center;
	width:100%;
    height:48px;
	background: rgba(255, 255, 255, .96);
    -webkit-transition: background 0.2s linear, height 0.2s linear;
    transition: background 0.2s linear, height 0.2s linear;
}
.HEADER-INNER-THIN a.logo img{
	height:32px;
}
.HEADER-INNER-THIN a.branding:after{
	border-width:1px;
	border-color:#404040;
}
.PLUS_HEADER{
	padding-top:120px;
}
.C404{
	color:#505050;
	font-size:300px;	
	margin-right:40px;
}
h1.C404{
	color:#808080;
	font-size:40px;	
	margin-right:40px;
}
.HEADER-INNER-THIN .mobile-menu-button a{
	top:4px;
	width:29px; 
}

.button-o{
	font-weight:300;
	background-color:#f97243;
	border:0px solid #f97243;
	color:#FFFFFF;
	border-radius:9px;
	font-size:20px;
	padding:15px 40px 15px 40px;
	cursor:pointer;
	outline:none;
	font-weight:400;
}


@media screen and (max-width: 1200px){
	.mobile-menu-button, .mobile-menu-button a{
		display:block;
		border:0;
	}
	a.mobile-menu-icon{
		display:block;
		border:0;
	 	background:url('/static/img/mobile-menu.svg') no-repeat center center;
	 	background-size:90%;
	 	width:38px;
	 	height:38px;
	}
	.c-css-menu{
		display:none;
	}
	.compact-css-menu{
		display:initial;	
	}
	div.FOOTER{
		text-align:center;
	}
	.FOOTER div{
		display:inline-block;
		border:none;
		padding:10px 20px 30px 20px;
		float:none;
		margin:0px;
	}
	.FOOTER div.copyright{
		float:none;
		padding:20px;
		text-align:left;
	}
	.back-end td.menu-panel-top{
		display:table-cell;
	}
	.back-end td.menu{
		display:none;
	}
}
@media screen and (max-width: 700px){
	.c-css-menu{
		display:none;
	}
	.compact-css-menu{
		display:initial;	
	}
	.mobile-menu div .even, .mobile-menu div .odd{
		float:none;
	}
	.form_data p.simple{
		padding-right:2%;
		padding-left:2%;
		min-width:0;
		width:65%;
	}
	.form_data p.double{
		padding-right:2%;
		padding-left:2%;
		min-width:0;
		width:95%;
	}
	.form_data p.tripple{
		padding-right:2%;
		padding-left:2%;
		min-width:0;
		width:95%;
	}
	.thin{
		margin-right:0;
	}
	.form_data .button-a, .form_data .button-ab{
		margin-left:0px;
	}
	.back-end .float-panel td, .back-end .float-panel th{
		padding-right:10px;
	}
	.slider-track{
		width:100px;
	}
	.HEADER-INNER .branding {
		font-size:40px;
	}
	.HEADER-INNER-THIN a.branding{
		font-size:30px;
	}
	#all{
		padding:0px;		
	}
}



form p, form select, form input, form textarea, form p{
	font-weight:300;
}
a.dark_next{
	background-image:url('/static/img/next.svg');
	background-size:100% 100%;
	background-repeat:no-repeat;
	background-color:#8CC63F;
	background-position:top left;
	color:rgba(0, 0, 0, 0);
	width:92px;
	height:92px;
	border-radius:46px;
	border:0px;
	opacity:1;
	margin:0px;
	margin-top:20px;
	display:inline-block;
}
a.dark_download{
	background-image:url('/static/img/download.svg');
	background-size:100% 100%;
	background-repeat:no-repeat;
	background-color:#8CC63F;
	background-position:top left;
	color:rgba(0, 0, 0, 0);
	width:92px;
	height:92px;
	border-radius:46px;
	border:0px;
	opacity:1;
	margin:0px;
	margin-top:20px;
	display:inline-block;
}

.indent {width:100%; display:inline-block;}
.indent a{ float:left; clear:left;}

.USER-MSG{	
	float:left; width:100%; background-color:rgba(0, 0, 0, 0.8); text-align:center; overflow:hidden; padding:8px 10px 5px 10px; bottom:0px; z-index:5000; position:fixed;
}
.USER-MSG a{
	font-weight:300;
	background-color:#8AAC1A;
	border:1px solid #000000;
	color:#FFFFFF;
	border-radius:3px;
	padding:5px 10px 5px 20px;
	cursor:pointer;
	margin:10px 20px 10px 0px;
	outline:none;
	display:inline-block;
	text-transform: uppercase;
	line-height:100%;
}
.USER-MSG p {color: #FFFFFF; display:inline-block;}
.USER-MSG a:hover{	color:#FFFFFF;	}


/* carousel styles */

ul.carousel{
  position:relative;
  padding:0;
  margin:0;
  list-style-type: none;
  border-collapse: collapse;
  overflow:hidden;
}

ul.carousel li.slide{
  position:absolute;
  width:100%;
  height:100%;
  margin:0px;
  overflow:hidden;
  border:0;
  left:0;
  transition: left 0.8s ease-out;
  border:0;
}
ul.carousel li.left{
  left:-100%;
}
ul.carousel li.right{
  left:100%;
}

ul.carousel li table{
  width:100%;
  height:100%;
}
ul.carousel li table td{
  vertical-align: middle;
}
ul.carousel a.nav{
  position:absolute;
  transition: opacity 0.5s ease-out;
  top:50%;
  transform: translateY(-50%);
  opacity:0.2;
}
ul.carousel:hover a.nav{
  opacity:1;
}
ul.carousel a.right{
  right:10px;
}
ul.carousel a.left{
  left:10px;
}

ul.carousel{
  position:relative;
  width:100%;
  height:400px;
}

ul.carousel a.nav{
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.3);
  width:48px;
  height:48px;
  padding:15px;
  text-decoration:none;
}

ul.carousel li.slide h1{
	font-size:40px;
}

ul.carousel li.slide p{
	font-size:18px;
	opacity:0.8;
}

.DOWNSHIFT15{position:relative; top:15px;}
.UPSHIFT20{position:relative; bottom:0.3em;}
.star:before{
	content:'*';
	position:relative;
	top:0.27em;
	font-size:150%;
	line-height:100%;
	padding:0 0.5em 0 0em;
	opacity:0.3;
}

div.countdown{text-align:center;}
span.countdown{
	display:inline-block;
	font-size:70px;
	color:#808080;
	border:5px solid #808080;
	border-radius:90px;
	width:90px;
	height:90px;
	line-height:initial;
	text-align:center;
}
p.countdown{
	display:block;
	text-align:center;
}
@media only screen and (max-width: 1000px){
	ul.carousel img{margin-bottom:50px;}
	ul.carousel a img{margin-bottom:0px;}
	ul.carousel{height:700px;}
	ul.carousel li.slide h1{font-size:33px; margin-top:10px;}
	p.countdown{display:inline-block; text-align:left;}
	span.countdown{
		margin-right:20px;
		font-size:50px;
		width:70px;
		height:70px;
	}
	div.countdown{text-align:left;}
	ul.carousel li table td{
  		vertical-align: top;
	}
	ul.carousel a.nav{opacity:0.2;}
	ul.carousel:hover a.nav{opacity:0.7;}
}
.shade_1{background-color:rgba(0, 0, 0, 0.1);}
.shade_2{background-color:rgba(0, 0, 0, 0.2);}
.shade_3{background-color:rgba(0, 0, 0, 0.3);}
.shade_4{background-color:rgba(0, 0, 0, 0.4);}
.shade_5{background-color:rgba(0, 0, 0, 0.5);}
.shade_6{background-color:rgba(0, 0, 0, 0.6);}
.shade_7{background-color:rgba(0, 0, 0, 0.7);}
.shade_8{background-color:rgba(0, 0, 0, 0.8);}

.highlight_1{background-color:rgba(255, 255, 255, 0.1);}
.highlight_2{background-color:rgba(255, 255, 255, 0.2);}
.highlight_3{background-color:rgba(255, 255, 255, 0.3);}
.highlight_4{background-color:rgba(255, 255, 255, 0.4);}
.highlight_5{background-color:rgba(255, 255, 255, 0.5);}
.highlight_6{background-color:rgba(255, 255, 255, 0.6);}

table.bubble{
	position:fixed;
	z-index:1000;
	border-collapse:separate;
	max-width:450px;
    transition: opacity 0.5s ease-out, bottom 0.5s ease-out;
}
table.bubble th{
	border:1px solid #cdb52e;
	background:#ffe972;
	border-radius:3px;
	padding:20px;
	font-size:18px;
	text-align:left;
	box-shadow: 0 1px 5px rgba(3, 3, 0,.2);
}
table.bubble th p{
	margin:0px 0px 5px 0px;
}
table.bubble td{
	text-align:left;
	padding-left:50px;
}
table.bubble td img{
	position:relative;
	top:-4px;
	z-index:1200;
	border:0;
}
.horizf_10{ left:10%; }
.horizf_5{ left:5%; }
.hiddenzf{
	opacity:0;
	bottom:-150px;
}
.shownzf{
	opacity:1;
	bottom:0px;
}	
	
	
	
form.dark input{
	background:none;
	display:inline-block;
	float:none;
	margin:5px;
}
form.dark input[type="text"]{
	color:#FFFFFF;
	border: 1px solid #43AaD2;
	padding:7px;
	border-radius:3px;
	text-align:center;
	color:rgba(0, 0, 0, 0.8);
	width:300px;
	background:#FFFFFF;
	margin-left:0;
	background:rgba(67,170,210,0.1)
}
form.dark input[type="text"]:focus{
	color:rgba(0, 0, 0, 0.70);
	border: 1px solid #43AaD2;
	background:rgba(67,170,210,0.15)
}
form.dark input[type="submit"], form.dark a.button-ab{
	cursor:pointer;
	font-weight:300;
	background-color:#4292D3;
	border:1px solid #4292D3;
	color:#FFFFFF;
	border-radius:3px;
	padding:7px 20px 7px 20px;
	cursor:pointer;
	outline:none;
	margin:5px 5px 5px 0px;
	white-space:nowrap;
}

.pale, form.dark input[type="submit"].pale{
	background:rgba(0,0,0,0.6);
	background-image:url('/static/img/prev.svg');
	background-position: 5px center;
	background-size:22px 22px;
	background-repeat:no-repeat;
	border:0;
	padding:9px 20px 9px 30px;
	font-size:14px;
	color:#FFFFFF;
	margin:0;
	border-radius:3px;
	font-weight:400;
	transition:background-color 1s;
	margin-right:20px;
}
.pale:hover, form.dark input[type="submit"].pale:hover{
	color:#FFFFFF;
	background-color:rgba(0,0,0,0.8);
}

a.authentications-hollow{
	cursor:pointer;
	font-weight:300;
	background-color:#FFFFFF;
	border:1px solid #4292D3;
	color:#4292D3;
	line-height:50px;
	white-space:nowrap;
	border-radius:3px;
	padding:7px 20px 7px 20px;
	cursor:pointer;
	outline:none;
	text-transform:uppercase;
}
form.dark input[type="submit"]:active{
	background-color:#3282C3;
	color:rgba(255, 255, 255, 1);
	opacity:1;
	border:1px;
}
.circular_progress{
	transform: rotate(-90deg);
	display:inline-block;
	position:relative;
	top:18px;
}
form.dark input[type="submit"]:disabled, a.authentications:disabled, form.dark a.button-ab:disabled{
	background-color:#94bad9;
	background-image:url('/static/img/button-progress-bg.png');
	background-repeat:no-repeat;
	background-size:0% 100%;
	background-position:top left;
	color:rgba(255, 255, 255, 0.8);
	cursor:wait;
}
form.dark p, form.dark select, form.dark input, form.dark textarea, form.dark p{
	float:none; clear:none;
}

a span.branding, a.branding{
	color:#000000;
}
.comment{
	font-size:16px;
}
#videos iframe.video{
	width:960px;
	height:540px;
	max-width:100%;
}
#videos ul.carousel{
  position:relative;
  width:100%;
  height:700px;
}
#videos ul.carousel a.nav{
  top:30px;
  transform: translateY(0%);
  opacity:0.5;
}

.smaller{
	font-size:75%;
}
.tiny{
	font-size:50%;
	overflow-wrap:anywhere;
}
.plus:before{
	content:'+';
	position:relative;
	top:0.25em;
	font-size:150%;
	line-height:100%;
	padding:0 0em 0 0em;
	height:0.5em;
	color:#4292D3;
}
ul.n2 li.with{
	background-repeat:no-repeat;
	background-position:left center;
	background-size:64px;
	width:66%;	
	text-align:left;		
}
ul.n2 li.with table{
	border-left:1px solid rgba(0, 0, 0, 0.1);
}

.tp-qrcode, .tp-response{
		overflow:hidden;
		margin:0px 10px;
		text-align:justify;
}
.tp-qrcode div.top, .tp-response div.top{
	width:100%;
	padding:30px 40px 30px 40px;
	float:left;
}
.tp-qrcode div.bottom, .tp-response div.bottom{
	width:100%;
	background: rgba(0,0,0, 0.08);
	border-top:1px solid rgba(0,0,0,0.3);
	box-shadow: inset 0px 4px 12px -6px rgba(0,0,0,0.51);
	display:flex;
	justify-content:space-between;
	padding:10px;
	float:left;
}
.tp-qrcode div.config-header, .tp-response div.config-header{
	width:100%;
	background: #4292D3;
	border-top:1px solid rgba(0,0,0,0.3);
	box-shadow: inset 0px -4px 12px -6px rgba(0,0,0,0.51);
	display:flex;
	justify-content:space-between;
	padding:10px;
	float:left;
	color:#FFFFFF;
	font-weight:400;
	font-size:18px;
}
.tp-qrcode div.config-header table{
	display:table;
}
.tp-qrcode div.config-header table td{
	width:30%;
}
.tp-qrcode div.config-header table td a.webapp{
	margin:0;
}
.tp-qrcode div.config-header table td p{
	font-weight:400;
}
.tp-qrcode div.bottom table, .tp-response div.bottom table{
	display:table;
	float:none;
	min-height:48px;
}
.tp-qrcode div.bottom table.machine_id, .tp-response div.bottom table.machine_id{
	max-width:270px;
	border-left:1px solid rgba(0,0,0,0.2);
}
.tp-qrcode div.bottom table.cancel{
	max-width:120px;
}
.tp-qrcode div.bottom table.separator, .tp-response div.bottom table.separator{
	max-width:3px;
	border-left:1px solid rgba(0,0,0,0.2);
}
.tp-qrcode div.bottom table td, .tp-response div.bottom table td{
	padding: 0px 0px 0px 10px;
	vertical-align:bottom;
	width:50%;
}
.tp-qrcode div.bottom table.machine_id td img, .tp-response div.bottom table.machine_id td img{
	width:48px;
	opacity:0.7;
	float:none;
	margin:0px 10px 5px 0px;
}
.tp-qrcode div.bottom table.machine_id td h4, .tp-response div.bottom table td h4{
	width:140px;
	margin-right:0;
}
.tp-qrcode div.bottom table td h4, .tp-response div.bottom table td h4{
	margin:0px 20px 8px 0px;
	width:240px;
	font-size:14px;
}
.tp-qrcode h2{
	color:#606060;
	font-size:28px;
	margin:10px 0px 20px 0px;
	text-align:center;
}
.tp-qrcode h3{
	color:#303030;
	font-size:16px;
	margin:0px 0px 0px 0px;
	text-align:center;
}
.webapps{
	float:none;
	margin-bottom:20px;
}
	
.tp-qrcode img.webapp{
	width:120px;
	margin-right:5px;
}
.tp-qrcode a.webapp{
	margin-right:5px;
	margin-bottom:9px;
	padding:6px 10px 5px 10px;
	background:#000000;
	color: #FFFFFF;
	font-size:14px;
	font-weight:400;
	border-radius:4px;
}

ul.n2 li.tp-qrcode{
	width:33%;
	text-align:center;
}
.tp-qrcode img{
	display:inline-block;
	border-radius:5px;
}
.tp-qrcode ol{
	margin:10px 0px 5px 0px;
	counter-reset: item;
	list-style-type: none;
}
.tp-qrcode ol li{
	line-height:150%;
	font-size:18px;
	margin-bottom:15px;
	color:#303030;
}
.tp-qrcode ol li:before{
	content: counter(item);
    counter-increment: item;
    position:relative;
    margin-left:-40px;
    background:rgba(0,0,0,0.1);
    color:#808080;
    border-radius:30px;
    padding:1px 9px 0px 9px;
    display:inline-block;
    margin-right:8px;
    height:32px;
    width:32px;
    text-align:center;
}


ul.n2 li.tp-logo{
	width:33%;
	text-align:center;
}
.tp-logo img{
	display:inline-block;
	width:128px;
	height:128px;
	border-radius:5px;
}
@media only screen and (max-width: 600px){
	ul.n2 li.with{
		width:100%;	
		text-align:center;
		margin-top:20px;
	}
	ul.n2 li.with table{
		border-left:0px solid rgba(0, 0, 0, 0.1);
		border-top:1px solid rgba(0, 0, 0, 0.1);
	}
	ul.n2 li.tp-logo{
		width:100%;
		text-align:center;		
	}
	.tp-logo img{
		width:128px;
		height:128px;
		margin-top:30px;
	}
}
.countup{
	border-collapse:separate;
	border-spacing:20px;
}
.countup td{
	font-size:4px;
	color:rgba(0, 0, 0, 0.2);
	font-weight:400;
	text-align:center;
	vertical-align:middle;
}
.countup td span{
	display:inline-block;
	font-size:4px;
	color:rgba(0, 0, 0, 0.2);
	background-color:rgba(0, 0, 0, 0.1);
	border:1px solid rgba(0, 0, 0, 0.1);
	border-radius:13px;
	width:13px;
	height:13px;
}
.countup td.separator{
	width:150px;
}
.countup td.separator-s{
	width:50px;
}
.countup td.active{
	border:1px solid #4292D3;
	color: #4292D3;
	font-size:15px;
	border-radius:25px;
	width:25px;
	min-width:25px;
	height:25px;
	background:#FFFFFF;
}
.countup td.active span{
	color: #4292D3;
	font-size:15px;
	border:0px;
	background:#FFFFFF;
	width:initial;
	height:initial;
}
.countup td.almost-active span{
	border-radius:17px;
	width:17px;
	height:17px
}

.warning{
	color:#A03333;
}

.cert_installed{
	opacity:0.8;
	width:64px;
	height:64px;
}

.borders{
	border:1px solid #A0A0A0;
}
.so-top{
	padding-bottom:50px;
	vertical-align:top;
	text-align:center;
}
p.tiny{
	font-size:10px;
}
.TOP_NOTE{
	background:#4292D3;
	padding:0px 10px 0px 10px;
	box-shadow: inset 0px -14px 21px -11px rgba(0,0,0,0.15);
	border-bottom:1px solid rgba(0, 0, 0, 0.6);
}
.TOP_NOTE .comment{
	color:rgba(255, 255, 255, 0.9);
	text-align:left;
}
.TOP_NOTE .branding{
	color:#FFFFFF;
}
.TOP_NOTE .branding:after{
	color:rgba(255, 255, 255, .7);
}
	
table.hint-block, table.warn-block, table.ok-block{
	float:left;
	clear:both;
}
table.hint-block th, table.warn-block th, table.ok-block th{
	width:48px;
	vertical-align:top;
	text-align:left;
	font-size:16px;
}
table.hint-block td, table.warn-block td, table.ok-block td{
	font-size:16px;
}
table.hint-block th:before{
	content:'i';
	color:rgba(255, 255, 255, 1);
	font-size:28px;
	vertical-align:top;
	background:rgba(20,100,160,0.7);
	border-radius:50px;
	padding:3px 17px 3px 17px;
	margin-right:10px;
	display:inline-block;
	width:46px;
	height:46px;
	text-align:center;
}
table.warn-block th:before{
	content:'!';
	color:rgba(255, 255, 255, 1);
	font-size:28px;
	vertical-align:top;
	background:rgba(230, 100, 10, 0.8);
	border-radius:50px;
	padding:3px 17px 3px 17px;
	margin-right:10px;
	display:inline-block;
	width:46px;
	height:46px;
	text-align:center;
}
.log-in p, .log-in-wait p, .configure p{
	font-size:18px;
	color:#707070;
}
.log-in p:before{
	background:url('/static/img/padlock.svg') center no-repeat;
	background-size:contain;
	padding:10px;
	width:32px;
	height:24px;
	display:block;
	float:left;
	position:relative;
	bottom: 1px;
	content:' ';
}
.log-in-wait p:before{
	background:url('/static/img/ring-wait-t.svg') center no-repeat;
	background-size:contain;
	padding:10px;
	width:32px;
	height:32px;
	display:block;
	float:left;
	position:relative;
	bottom: 2px;
	content:' ';
}
.configure p:before{
	background:url('/static/img/configure.svg') center no-repeat;
	background-size:contain;
	padding:10px;
	margin-right:3px;
	width:32px;
	height:26px;
	display:block;
	float:left;
	position:relative;
	bottom: 3px;
	content:' ';
}
div.authorization{
	width:100%;
	padding:30px 40px 30px 40px;
	margin:0;
}
div.authorization table td{
	padding:10px;
	vertical-align:middle;
}
@media only screen and (max-width: 600px){
	div.authorization td{ display:inline-block; text-align:center; width:100%;}
	div.authorization h2{ font-size:22px; font-weight:400; margin-bottom:10px;}
	div.authorization p{ font-size:14px;}
}

.tp-qrcode .tutorial img{
	font-size:18px;
	text-align:left;
	margin:0px 0px 0px 35px;
	color:#101010;
	text-align:left;
}
div.domain-pic-avatar {
	width:96px;
	height:96px;
	border-radius:52px;
	display:inline-block;
	float:none;
	margin:0px;
	border: 5px solid #E0E0E0;
	background-size:cover;
	background-repeat:no-repeat;
	background-position:center;
}

.install-img:before{
	background:url('/static/img/configure.svg') center no-repeat;
	background-size:contain;
	padding:10px;
	width:32px;
	height:32px;
	display:block;
	float:left;
	position:relative;
	bottom: 0px;
	margin-right:10px;
	content:' ';
}

.cfg{
	background-image:url('/static/img/configure-tag.svg');
	background-position:top left;
	background-repeat:no-repeat;
	background-size:100px;
}










div.my-apps{
	overflow-y:auto;
	min-height:50vh;
	max-height:50vh;
	display:flex;
	align-content:safe center;
	justify-content:safe center;
	align-items:safe center;
	flex-flow: row wrap;
}
.so-top div.container table.my-app{
	border-collapse:separate;
	border-spacing:5px;
	margin:10px;
	border-radius:3px;
	transition:background 0.2s ease-in;
	border:1px solid rgba(0,0,0,0.00);
	display:inline-block;
	width:auto;
	background:rgba(255, 255, 255, 0);
}
table.my-app td{
	padding:0px 10px 2px 10px;
}
.so-top div.container table.my-app:hover{
	background:rgba(255, 255, 255, 0.2);
	border:1px solid rgba(255,255,255,0.1);
}
table.my-app td.icon{
	text-align:center;
	vertical-align:middle;
	padding:5px 10px 5px 10px;
	min-width:120px;
}
table.my-app td.icon a{
	display:inline-block;
	width:74px;
	height:74px;
	border-radius:53px;
	background:rgba(255, 255, 255, 0.6);
	padding:5px;
	text-align:center;
	vertical-align:middle;
	font-weight:400;
}
table.my-app td.icon a span{
	display:inline-block;
	width:64px;
	height:64px;
	line-height:64px;
	border-radius:48px;
	font-size:35px;
}
table.my-app td.icon a:hover{
	color:#FFFFFF;
}
table.my-app td.icon a img{
	width:64px;
	height:64px;
	border-radius:48px;
}

table.my-app td.text{
	font-size:14px;
	white-space:nowrap;
	text-align:center;
	overflow:hidden;
	font-weight:400;
}
table.my-app td.text a{
	color:rgba(0, 0, 0, 0.9);
	background:rgba(255, 255, 255, 0.7);
	padding:3px 10px;
	border-radius:3px;
	display:inline-block;
	font-weight:400;
}

.letter-label-a {background:#cc0000; color: rgba(255, 255, 255, 0.8);}
.letter-label-b {background:#cc2c00; color: rgba(255, 255, 255, 0.8);}
.letter-label-c {background:#cc5800; color: rgba(255, 255, 255, 0.8);}
.letter-label-d {background:#cc8400; color: rgba(255, 255, 255, 0.8);}
.letter-label-e {background:#ccb000; color: rgba(255, 255, 255, 0.8);}
.letter-label-f {background:#bccc00; color: rgba(255, 255, 255, 0.8);}
.letter-label-g {background:#90cc00; color: rgba(255, 255, 255, 0.8);}
.letter-label-h {background:#64cc00; color: rgba(255, 255, 255, 0.8);}
.letter-label-i {background:#37cc00; color: rgba(255, 255, 255, 0.8);}
.letter-label-j {background:#0bcc00; color: rgba(255, 255, 255, 0.8);}
.letter-label-k {background:#00cc21; color: rgba(255, 255, 255, 0.8);}
.letter-label-l {background:#00cc4d; color: rgba(255, 255, 255, 0.8);}
.letter-label-m {background:#00cc79; color: rgba(255, 255, 255, 0.8);}
.letter-label-n {background:#00cca5; color: rgba(255, 255, 255, 0.8);}
.letter-label-o {background:#00c7cc; color: rgba(255, 255, 255, 0.8);}
.letter-label-p {background:#009bcc; color: rgba(255, 255, 255, 0.8);}
.letter-label-q {background:#006fcc; color: rgba(255, 255, 255, 0.8);}
.letter-label-r {background:#0043cc; color: rgba(255, 255, 255, 0.8);}
.letter-label-s {background:#0017cc; color: rgba(255, 255, 255, 0.8);}
.letter-label-t {background:#1500cc; color: rgba(255, 255, 255, 0.8);}
.letter-label-u {background:#4100cc; color: rgba(255, 255, 255, 0.8);}
.letter-label-v {background:#6d00cc; color: rgba(255, 255, 255, 0.8);}
.letter-label-w {background:#9900cc; color: rgba(255, 255, 255, 0.8);}
.letter-label-x {background:#c500cc; color: rgba(255, 255, 255, 0.8);}
.letter-label-y {background:#cc00a6; color: rgba(255, 255, 255, 0.8);}
.letter-label-z {background:#cc007a; color: rgba(255, 255, 255, 0.8);}






.ssso{
	font-weight:300;
	border:1px solid rgba(0,0,0,0.2);
	border-radius:20px;
	background:rgba(0,0,0,0.8);
	padding:5px 15px 6px 15px;
	margin-left:10px;
	font-size:16px;
	color:#AFAFAF;
	max-width:240px
}

.half{
	width:50%;
}

.so-top div.container{
	text-align:center;
	padding:20px;
}

.so-top .login{
	text-align:center;
}
.so-top .login p{
	font-size:14px;
	margin-bottom:5px;
}
.so-top .login p.tip{
	background:url('/static/img/blue-check.svg') 0px 2px no-repeat;
	background-size:16px 16px;
	padding-left:24px; 
	margin-bottom:5px;
	text-align:left;
}
.so-top .login p.hint{
	font-size:12px;
	color:rgba(0,0,0,0.8);
}
.so-top .login p.hint span.ref{
	font-size:10px;
	color:rgba(0,0,0,0.8);
}
.so-top .login p.error{
	font-size:14px;
	color:rgba(128,30,20,1);
	font-weight:400;
}
.so-top .login h2{
	font-size:24px;
	margin-top:0px;
}
.so-top .login h3{
	font-size:18px;
	opacity:0.8;
}
.so-top .login h4{
	font-size:16px;
	opacity:0.8;
	font-weight:400;
	margin-top:15px;
}
.so-top .brand-panel{
	text-align:center;
	display:flex;
	flex-direction: row;
	justify-content: center;
	align-items: stretch;
	flex-wrap: wrap;
	width:100%;
	background:rgba(0,0,0,0.03);
	padding:60px;
}
.so-top .brand-panel img.hint{
	opacity:0.6;
	max-width:128px;
}
.so-top .brand-panel table, .so-top .brand-panel td, .so-top .brand-panel table th{
	width:initial;
}
.so-top .brand-panel th .branding{
	font-size:28px;
	color:#000000;
	border-left:0;
	font-weight:400;
	float:right;
	vertical-align:middle;
	margin:0;
	padding-right:18px;
}
.so-top .brand-panel th .branding span:after{
	color:#808080;
	content:'TM';
	font-size:33%;
	position:relative;
	bottom:16px;
	font-weight:400;
}
.so-top .brand-panel td{
	color:#404040;
	font-size:15px;
	border-left:1px solid #A0A0A0;
	margin-left:0;
	padding-left:10px;
	text-align:left;
	line-height:125%;
	margin-right:50px;
	padding:0px 20px;
}
.so-top .form-panel{
	max-width:400px;
	display:inline-block;
}
.so-top .brand-panel img.extra-hint{
	width:48px;
	opacity:0.8;
	margin:0px;
}
.so-top .form-panel img.hint{
	width:48px;
	opacity:0.3;
	margin:0px;
}
.login-table td{
	padding:20px;
	padding:40px;
}
.login-table td.separator{
	max-width:10px;
	border-left:1px solid rgba(0,0,0,0.1);
	padding:0px;
}
.login-table .separator p{
	position:relative;
	background:rgba(255, 255, 255, 1);
	padding:10px;
	left:-17px;
	display:inline-block;
}
.login-table form{
	margin-bottom:15px;
}

@media only screen and (max-width: 600px){
	.login-table td{
		float:left;
		width:100%;
		text-align:center;
	}
	.login-table td.separator{
		max-height:10px;
		border-top:1px solid rgba(0,0,0,0.1);
		border-left:0px solid rgba(0,0,0,0.1);
		max-width:100%;
	}
	.login-table .separator p{
		top:-22px;
		left:0px;
	}
}

img.help{
	width:100%;
	max-width:400px;
	margin:20px 0px;
}
.so-top .form-panel img.webapp{
	width:100px;
	opacity:1;
}
.so-top .login .form-panel h3{
	font-size:18px;
	margin:0px;
	font-weight:400;
	color:rgba(0,0,0,0.8);
}
.verify-panel{
	max-width:100%;
	text-align:center;
}
.verify-panel a.pale{
	background:rgba(0,0,0,0.4);
	border:0;
	padding:9px 20px 9px 20px;
	font-size:14px;
	color:#FFFFFF;
	margin:0;
	border-radius:3px;
	font-weight:400;
	font-size:16px;
	transition:background-color 0.5s;
}
.so-top .brand-panel .pale, .so-top .brand-panel input[type="submit"].pale{
	background:rgba(0,0,0,0.4);
	background-image:url('/static/img/prev.svg');
	background-position: 5px center;
	background-size:22px 22px;
	background-repeat:no-repeat;
	border:0;
	padding:6px 10px 5px 30px;
	font-size:14px;
	color:#FFFFFF;
	margin:0;
	border-radius:3px;
	font-weight:400;
	transition:background-color 0.5s;
}
.so-top .brand-panel .pale:hover, .so-top .brand-panel input[type="submit"].pale:hover{
	color:#FFFFFF;
	background-color:rgba(0,0,0,0.6);
}





.so-top .login .form-panel form *{
	background:none;
	display:inline-block;
	margin:5px 0px;
	outline:none;
	border-radius:3px;
}
.so-top .login .form-panel input[type="text"]{
	padding:7px 14px;
	text-align:left;
	width:100%;

	border: 1px solid rgba(0, 0, 0, 0.2);
	background: rgba(0, 0, 0, 0.1);
	color:rgba(0, 0, 0, 0.8);
}
.so-top .login .form-panel input[type="text"]:focus{
	color:rgba(0, 0, 0, 0.70);
	border: 1px solid #43AaD2;
	background:rgba(67,170,210,0.15);
}

.so-top .login .form-panel input[type="submit"], a.authentications{
	cursor:pointer;
	font-weight:300;
	padding:7px 20px 7px 20px;
	border-radius:3px;
	display:inline-block;
	margin:5px 0px 0px 0px;
	
	background-color:#4292D3;
	border:1px solid #4292D3;
	color:#FFFFFF;
}
.so-top .login .form-panel input[type="submit"]:disabled{
	cursor:wait;
	background-color:#4292D3AF;
	border:1px solid #4292D3AF;
	color:#FFFFFF;
	border-radius:3px;
}
form.dark input[type="submit"].next{
	background-image:url('/static/img/next.svg');
	background-position:right 5px center;
	background-size:28px 28px;
	background-repeat:no-repeat;
	padding-right: 40px;
	background-color:#4292D3;
	border:1px solid #4292D3;
}
.so-top .login .form-panel input[type="submit"].download, .so-top .login .form-panel a.download{
	background-image:url('/static/img/download.svg');
	background-position:5px center;
	background-size:28px 28px;
	background-repeat:no-repeat;
	padding-left: 40px;
	margin-top:5px;
}
.so-top .login fieldset{
	padding: 5px 20px 0px 20px;
	border:1px solid rgba(0,0,0,0.1);
	border-radius:2px;
	margin:5px 0px;
}

.so-top .login fieldset input[type="radio"]{
	margin-right:10px;
}
	
.so-top .login .form-panel ol{
	margin:0;
	padding:16px;
	list-style: none;
	counter-reset: li;
}

.so-top .login .form-panel ol li{
	margin:0px 0px 5px 0px;
	counter-increment: li;
}

.so-top .login .form-panel ol li::before{
	content: counter(li);
	font-weight:600;
	color:#4292D3;
	width: 1em;
  	margin-left: -1em;
  	margin-right: 0.5em;
}

.so-top .login-table .passbox{
	border: 1px solid #43AaD2;
	border-radius:3px;
	color:rgba(0, 0, 0, 0.8);
	padding:2px 1px 2px 6px;
	text-align:left;
	width:initial;
	display:inline-block;
	background: rgba(67,170,210,0.15);
}
.so-top .login-table .passbox span{
	font-size:12px;
}
.so-top .login-table .passbox a{
	margin:0px 1px 0px 10px;
	background:rgba(0,0,0,0.6);
	color:#FFFFFF;
	padding: 3px 8px;
	border-radius:2px;
	font-size:14px;
	font-weight:400;
	display:inline-block;
}

.so-top .validation-frame{
	display:block;
	border:0px;
	background:none;
	width:100%;
	flex-grow:4;
}




.so-bottom{
	vertical-align: top;
	text-align:center;
	position:fixed;
	left:0;
	bottom:0;
	BACKGROUND:rgba(0,0,0,0.9);
	width:100%;
}
.so-bottom div.container{
	display:flex;
	flex-flow:row wrap;
	justify-content: center;
}
.so-bottom div.container > *{
	flex:initial;
}
.so-bottom .so-menu-icon{
	max-width:240px;
	margin:20px 40px;
	text-align:center;
	width:auto;
}
.so-bottom .so-menu-icon td{
	display:table-cell;
	vertical-align:middle;
}
.so-bottom .so-menu-icon p{
	margin:0;
	color:#FFFFFF;
}
.so-bottom .so-menu-icon a{
	opacity:0.6;
	font-size:14px;
	font-weight:400;
	transition:opacity 0.5s;
	color:#FFFFFF;
}
.so-bottom .so-menu-icon a img{
	opacity:0.7;
}
.so-bottom .so-menu-icon:hover a{
	opacity:1;
}
.so-bottom p.powb{
	opacity:1;
	text-align:left;
	display:inline-block;
	font-size:14px;
}
.so-bottom p.powb a{
	font-weight:400;
	opacity:0.9;
}
.so-bottom .so-menu-icon img {
	width:96px;
}

.so-bottom p.ssso{
	margin:0;
	font-weight:400;
	font-size:14px;
	display:inline-block;
	position:relative;
	bottom:45px;
	border-radius:30px;
	padding:7px 20px 6px 20px;
	background:rgba(0,0,0,0.7);
	border:1px solid rgba(0,0,0,0.2);
}

@media only screen and (max-width: 600px){
	.so-bottom .so-menu-icon{
		margin:10px 10px;
		max-width:96px;
	}
}


.so-dark{
	background:rgba(0,0,0,0.8);
}

.so-dark p{
	color:rgba(255, 255, 255, 0.8);
}

.so-dark .so-menu-icon a{
	color:rgba(255, 255, 255, 0.8);
}
.so-dark p.powb a{
	color:rgba(255, 255, 255, 0.9);
}	

.so-dark p.powb a span{
	color:#4292D3;
}	


.so-light{
	background:rgba(255, 255, 255, 0.9);
}

.so-light p{
	color:rgba(0, 0, 0, 0.8);
}

.so-light .so-menu-icon a{
	color:rgba(0, 0, 0, 0.8);
}
.so-light p.powb a{
	color:rgba(0, 0, 0, 0.9);
}	

.so-light p.powb a span{
	color:#4292D3;
}