html,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,hgroup,menu,nav,section,menu,time,mark,audio,video {margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;}
html, body 
{
	padding:0px;
	margin:0px;
	font-family: Helvetica, Verdana, Arial, "Arial Rounded MT Bold", sans-serif, monospace;
	height: 100%;
	color:#333333;
}
#header,#mcont { position: absolute; width: 100%; left: 0; }

#mcont { top:0px; bottom:0px; height:100%; display:table;background:#F0F0F0 url(../styleimage/comma5-crm-home-start.jpg) center center no-repeat; position:fixed; background-size:cover;  }
#head { top: 0; }
#foot { bottom: 0; }
#footer { width:100%; line-height:50px; margin-top:10px; }
#footer > #helpLink { float:left;margin:10px; }
#footer > #cancelLink { float:right;margin:10px; }

.alink { color:#1a73e8; text-decoration:none; cursor:pointer; font-size:100%;}
.alink:hover {color:#1a73e8; cursor:pointer;}
a:link {text-decoration: none} 
a:visited {text-decoration: none} 
a:active {text-decoration: none} 
a:hover {text-decoration: none;}
a.anchor { text-decoration:underline;}

input[type=text]:focus,
input[type=email]:focus,
input[type=url]:focus,
input[type=password]:focus,
textarea:focus {
  outline: 0;
  border-color: #rrrrrr;
}

.roundit {
	-moz-border-radius: 6px;
	border-radius: 6px;
	-webkit-border-radius:6px;
}
.fleft { float:left; }	
.fright { float:right; }
.center { clear:both; text-align:center;}	
.clear { clear:both; }

.shadow {
	-webkit-box-shadow: 0px 4px 6px #999999;
	-moz-box-shadow: 0px 4px 6px #999999;
	box-shadow: 0px 4px 6px #999999;
}
.gray {color:#939393;}
.green { color:#009900; }
.red { color:#FF0001; /*#D32152;*/ }
.blue { color:#4c8bf5; }
.anchor { text-decoration:underline; cursor:pointer;}
.smaller { font-size:smaller; }
.smallest { font-size:9px; }

.bold { font-weight: bold; }
#hash { color: #595959; }
.redtxt { color:#DE4F4F; }
.tabrow { clear:both; float:left; display:table-row; }
.tabcol { float:left; display:table-cell; }
.bgcolor { background: #D32152; }
.strength0{color:#FF0000}
.strength1{color:#800080}
.strength2{color:#FF00FF}
.strength3{color:#0000FF}
.strength4{color:#00FF00}
.strength5{color:#008000}

.svalidMsg {font-size: 13px; color: red; float: left; text-align: left; padding-bottom: 5px; width: 180px; margin-top: -15px; border: 0px solid green; }
.floatl{float:left;}
.floatr{float:right;}
.tick{height:25px;width:17;padding:2px 0px;position:relative;float:left;}
.tick img{width:100%; }

#header_container { background:#eee; height:75px; left:0; position:fixed; width:100%; top:0;z-index:888; }

#header
{
	height:75px;
	line-height:75px;
	width:100%;
	background-color:#F0F0F0;
	position:absolute;
	top:0px;
	left:0px;
	z-index:1000;
}

#headerTitle
{
	position:relative;
	height:65px;
	line-height:65px;
	max-width:300px;
	width:auto;
	float:left;
	padding-left:10px;
	font-size:26px;
}
.clogol {left:20px; position:relative; float:left; width:150px; height:75px; z-index:4; overflow:hidden; display:none;}
.clogol img { width:100%; }
.version { top:50px; height:35px; width:100%; position:absolute; text-align:center; font-size:14px; display:none; }
#bold { font-weight:bold; }
.hash,.bghash {	color:#595959; }
.white { color:#ffffff; }
.black { color:#000000; }
.red { color:#FF0000; }
.green { color:#00FF00; }
.text-shadow {text-shadow: 1px 1px 2px black;}

/*#contenttitle:after
{
content:" ::";	
color:#DE4F4F;
}*/

#control
{
	float:left;
}
.spacer
{	
	clear:both; height:5px;
}
.refreshImage{float:left;height:23px;width:25px;}
.listenAudio{float:left;height:23px;width:25px;}
.capimage{float:left;height:23px;width:100px;}

.staysign { float:left; height:35px; line-height:35px; margin:10px; }


#chkcntrl { float: left; padding: 3px; font-size: 15px; margin-top: -2px; }
.cntrl {
	font-size:11px;
	color:red;	
	float:left;	
	width:198px;	
	height:1px;
	line-height:11px;
}
.validMsg
{
	font-size:13px;
	color:red;
	float:right;
	text-align:right;
	padding:5px;
	margin-top:-15px;	
}
.bottomMsg
{
	font-size:10px;
	float:right;
	text-align:right;
	padding:5px 10px 10px 5px;
	width:auto;
	margin-top:-5px;
	color:#ACACAC;			
}

.cssbutton:disabled { background-color:#F70C0C;border:1px solid #c40606; }

.cssbutton
{
	border:1px solid #5EBE45/*c40606*/; 
	-webkit-border-radius: 3px; 
	-moz-border-radius: 3px;
	border-radius: 3px; 
	padding: 5px 15px; /*text-shadow: -1px -1px 0 rgba(0,0,0,0.3);font-weight:bold;*/
	font-size:13px;  
	text-align: center; 
	color: #FFFFFF; 
	background-color:#5EBE45/*F70C0C*/; 
	cursor:pointer;
	/*background-image: -webkit-gradient(linear, left top, left bottom, from(#F70C0C), to(#8C1519));
	background-image: -webkit-linear-gradient(top, #F70C0C, #8C1519);
	background-image: -moz-linear-gradient(top, #F70C0C, #8C1519);
	background-image: -ms-linear-gradient(top, #F70C0C, #8C1519);
	background-image: -o-linear-gradient(top, #F70C0C, #8C1519);
	background-image: linear-gradient(to bottom, #F70C0C, #8C1519);
	filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#F70C0C, endColorstr=#8C1519);*/
}
.hashbutton
{
	border:1px solid #BBBBBB; 
	-webkit-border-radius: 3px; 
	-moz-border-radius: 3px;
	border-radius: 3px; 
	padding:5px 10px; /*text-shadow: -1px -1px 0 rgba(0,0,0,0.3);font-weight:bold;*/ 
	font-size:13px; text-align: center; color:#666666; background-color:#F7F7F7; 
	cursor:pointer;
 	background-image: -webkit-gradient(linear, left top, left bottom, from(#F7F7F7), to(#BBBBBB));
 	background-image: -webkit-linear-gradient(top, #F7F7F7, #BBBBBB);
 	background-image: -moz-linear-gradient(top, #F7F7F7, #BBBBBB);
 	background-image: -ms-linear-gradient(top, #F7F7F7, #BBBBBB);
 	background-image: -o-linear-gradient(top, #F7F7F7, #BBBBBB);
 	background-image: linear-gradient(to bottom, #F7F7F7, #BBBBBB);
	filter:	progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#F7F7F7, endColorstr=#BBBBBB);
}

.cssbutton.spin
{
	background:url(../styleimage/redload.gif) no-repeat;
	background-position: center center;
	background-size:22px 22px;
	border:1px solid  #D1D1D1;
	color:#D84937;	
}
.spin::before{ content:'...loading...'; }

#logo { /*position:relative; width:300px; left : 50%; margin-left: -150px;*/ text-align:center; }
#logo img { width:70%; position:relative; /*left:50%; margin-left:-40%;*/ margin-bottom:5%; }
#containerbox { width:350px;height:auto;/* position: relative; margin-top:5%; left:50%; margin-left:-175px; z-index:1;*/ border:0px solid #000000; display:table;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}
#signupdiv { position:relative; z-index:2; height:auto; width:auto; margin:10px; padding:0px; left:0px;}
#valuecontainer { width:auto; height:auto; margin:10px;}
#formshade { width:100%; background:#ffffff; padding:0px; /*margin:5px;*/ font-size:15px; display:table; border:1px solid #B6B6B6; }
#formshade .inputbox, input#inputbox, textarea.inputbox,select.inputbox { width:91%; font-size:16px; padding:4px 5px; margin:0 0 5px 5px; clear:right; float:left; border-color:#CCC #E8EAEC #E8EAEC #CCCCCC; border-width:1px;border-style:solid; color:#666666;font-family: Helvetica, Verdana, Arial, "Arial Rounded MT Bold", sans-serif, monospace; }
#formshade .inputbox:focus, input#inputbox:focus {	border-color:#999999; }
#formshade .slabelbox{ height:20px;line-height:20px;display:block;text-align:left;width:auto;padding:2px;margin:2px 0 3px 10px;}
#formshade .labelbox {height:20px;line-height:20px;	display:block;	text-align:right;width:100%;padding:2px;margin:2px 0 5px 15px;	clear:right;float:left;}
#formshade select.inputbox { width: 95%;}

#footer > #helpLink { float:left;margin-top:0px;}
#footer > #cancelLink { float:right;margin-top:0px; }

/* very small phones */
@media screen  and (max-width:180px) {

}
/* small phones */
@media screen  and (max-width:243px) {
#logo img { margin-bottom:2%; }
/*#logo img { margin-bottom:2%; }
#containerbox { width:320px; margin-left: -160px; left : 50%;margin-top:2%;}
#signupdiv { margin:3px; }
#valuecontainer { margin:5px;}*/
}

/* small phones 243x320   Phone Portrait (320px) */

@media screen and (min-width:244px) and (max-width:320px) {
/*#logo img { margin-bottom:2%; }
#containerbox { width:320px; margin-left: -160px; left : 50%;margin-top:2%;}
#signupdiv { margin:3px; }
#valuecontainer { margin:5px;}*/
}
/* small phones  (380px)   can be added at the end   --- and (device-aspect-ratio: 2/3) */
@media screen and (min-width:321px) and (max-width:380px) {
/*#logo img { margin-bottom:2%; }
#containerbox { width:320px; margin-left: -160px; left : 50%;margin-top:2%;}
#signupdiv { margin:3px; }
#valuecontainer { margin:5px;}*/
}
/* Phone Landscape (480px) */
@media only screen and (min-width: 321px) and (max-width: 480px) and (orientation: landscape) {
/*#logo img { margin-bottom:2%; }
#containerbox { width:320px; margin-left: -160px; left : 50%;margin-top:2%;}
#signupdiv { margin:3px; }
#valuecontainer { margin:5px;}*/
}
/* Tablet Portrait (768px) */
@media only screen and (min-width: 321px) and (max-width: 1024px) and (orientation: portrait) {
/*#logo img { margin-bottom:2%; }
#containerbox { width:320px; margin-left: -160px; left : 50%;margin-top:2%;}
#signupdiv { margin:3px; }
#valuecontainer { margin:5px;}*/
}

/* Laptop/Tablet (1024px) */
@media only screen and (min-width: 481px) and (max-width: 1024px) and (orientation: landscape) {
/*#logo img { margin-bottom:2%; }
#containerbox { width:320px; margin-left: -160px; left : 50%;margin-top:2%;}
#signupdiv { margin:3px; }
#valuecontainer { margin:5px;}*/
}

/* iPad 3 & 4 Landscape */
@media only screen and (width: 481px) and (width: 1024px) and (orientation: landscape) {
/*#logo img { margin-bottom:2%; }
#containerbox { width:320px; margin-left: -160px; left : 50%;margin-top:2%;}
#signupdiv { margin:3px; }
#valuecontainer { margin:5px;}*/
}

/* iPad 3 & 4 Portrait */
@media only screen and (width: 481px) and (width: 1024px) and (orientation: portrait) {
/*#logo img { margin-bottom:2%; }
#containerbox { width:320px; margin-left: -160px; left : 50%;margin-top:2%;}
#signupdiv { margin:3px; }
#valuecontainer { margin:5px;}*/
}

/* iPhone 2G-3GS Landscape */
@media only screen and (width: 481px) and (width: 480px) and (orientation: landscape) {
/*#logo img { margin-bottom:2%; }
#containerbox { width:320px; margin-left: -160px; left : 50%;margin-top:2%;}
#signupdiv { margin:3px; }
#valuecontainer { margin:5px;}*/
}

/* iPhone 2G-3Gs Portrait */
@media only screen and (width: 481px) and (width: 480px) and (orientation: portrait) {
/*#logo img { margin-bottom:2%; }
#containerbox { width:320px; margin-left: -160px; left : 50%;margin-top:2%;}
#signupdiv { margin:3px; }
#valuecontainer { margin:5px;}*/
}

/* iPhone 4/4S Landscape */
@media only screen and (width: 569px) and (width: 480px) and (orientation: landscape) {
/*#logo img { margin-bottom:2%; }
#containerbox { width:320px; margin-left: -160px; left : 50%;margin-top:2%;}
#signupdiv { margin:3px; }
#valuecontainer { margin:5px;}*/
}

/* iPhone 4/4S Portrait */
@media only screen and (width: 569px) and (width: 480px) and (orientation: portrait) {
/*#logo img { margin-bottom:2%; }
#containerbox { width:320px; margin-left: -160px; left : 50%;margin-top:2%;}
#signupdiv { margin:3px; }
#valuecontainer { margin:5px;}*/
}

/* iPhone 5 Landscape */
@media only screen and (width: px) and (width: 568px) and (orientation: landscape) {
/*#logo img { margin-bottom:2%; }
#containerbox { width:320px; margin-left: -160px; left : 50%;margin-top:2%;}
#signupdiv { margin:3px; }
#valuecontainer { margin:5px;}*/
}

/* iPhone 5 Portrait */
@media only screen and (width: px) and (width: 568px) and (orientation: portrait) {
/*#logo img { margin-bottom:2%; }
#containerbox { width:320px; margin-left: -160px; left : 50%;margin-top:2%;}
#signupdiv { margin:3px; }
#valuecontainer { margin:5px;}*/
}