@charset "utf-8";
/* CSS Document */

@charset "UTF-8";
/* CSS Document */


/*
===========================================
    Reset
===========================================
*/
/*
body {
    line-height: 1;
}
*/
  
ol, ul {
    list-style: none; 
}
/* tables still need 'cellspacing="0"' in the markup */
table {
    border-collapse: separate;
    border-spacing: 0;
	text-align:left; /*Required for Proper Alignment in IE - Otherwise Alignment inside table celss is right justified or center */
}

/*
td {
text-align: left;	
}
*/

/*
caption, th, td {
	text-align: center;
	font-weight: normal;
}
*/

blockquote:before, blockquote:after, q:before, q:after {
    content: "";
}
blockquote, q {
    quotes: "" "";
}

/* Causes ColorBox to hide Title and Close Button -- Y.O. 10/19/2011
div {overflow: hidden;}
*/

/*
===========================================
*/

body {
    background-color: #fff;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 15px;
    color: #000;
    /* line-height: 20px; */
	/* -webkit-text-size-adjust: 100%; */ /* Do Not Adjust Text Size in Retina Devices */
}


/*
===========================================
    Typography
===========================================
*/
p {
	margin-bottom: 20px;
}
strong { font-weight: bold; }
em { font-style: italic; }


/* main links */

a:link, a:active, a:visited {
    color:#06F;
    text-decoration: underline;
}


a:hover {
    /*background-color: #00f;*/
    text-decoration: none;
}


.bluetext {color: #0d83dd;}
.greentext { color: #65920f;}
.redtext { color: #CA0000;}


/*
===========================================
    PunchStation Styles
===========================================
*/

.greytitle {
	font: bold 15px Arial, Helvetica, sans-serif;
	color: #999;
	margin-bottom: 4px;
	font-size: 24px;
}

.darkGreyTitleMedium {
	font: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #333;
	font-size: 18px;
}

.dataTableEmptyTitle {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 14px;
	color:#AAA;
}

.pageEmptyTitle {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	/* font-weight: bold; */
	font-size: 24px;
	color:#AAA;
}

.featureTitle {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 14px;
	color:#000000;
}

.featureDescription {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	/* font-weight: bold; */
	font-size: 13px;
	color:#666
}


.bannerTitle {
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 38px;
	color:#FFFFFF;
	/* padding:10px;
	padding-left:15px; */
}


.howItWorksTitle {
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 34px;
	color:#FFFFFF;
}

.stepTitle {
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 32px;
	color:#FFFFFF;
}

.stepSubTitle {
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 16px;
	color:#FFFFFF;
}




.blacktitle {
	font: bold 15px Arial, Helvetica, sans-serif;
	color: #000000;
	margin-bottom: 4px;
	font-size: 24px;
}
.greynote {
	font: bold 15px Arial, Helvetica, sans-serif;
	color: #999;
	margin-bottom: 4px;
	font-size: 12px;
}

.darkGreyNote {
	font: bold 15px Arial, Helvetica, sans-serif;
	color: #333;
	margin-bottom: 4px;
	font-size: 12px;
}



.formOptionalLine {
	font: bold 30px Arial, Helvetica, sans-serif;
	color: #CCC;
	line-height:15px;
}

.formOptionalLine td.title {
	font: bold 15px Arial, Helvetica, sans-serif;
	color: #CCC;

}

.dataTable {
	/* font: 15px Verdana, Arial, Helvetica, sans-serif; */
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 13px;
}

/*
.dataTable td.small {
	font-size: 10px;
}
*/

.dataTable tr.header {
	font-weight: bold;

} 

.dataTable tr.alternateRow {
	
	background-color:#EBEBEB;
}

.dataTable_Print {
	/* font: 15px Verdana, Arial, Helvetica, sans-serif; */
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
}

.dataTable_Print .header {
	font-weight: bold;

}

.headerCompanyName {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	/* font-weight: bold; */
	color: #999;
	font-size: 20px;
}


.headerUserProfile {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	/* font-weight: bold; */
	color: #666;
	font-size: 14px;
}


.faq_Question {
	list-style: disc; 
	line-height: 22px;
	/* font-size: 20px; */
	/*font-weight: bold;*/
}

.faq_Answer_Question {
	/* font-size: 20px; */
	color:#06F;
	font-weight: bold;
}

.cardPreview {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 18px;
	color:#666;
	font-weight: bold;
}

.cardPreview .poweredBy {
	font-size: 9px;
}


.employeeCard {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 17px;
	color:#666;
	font-weight: bold;
}

.employeeCard .poweredBy {
	font-size: 7px;
}


.whatsNew {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
}

.whatsNew .date{
	font-weight: bold;
}


.pricingTable .plans { font-size:20px;
	color:#3E3E3E;
	font-weight:normal;
		
}

.pricingTable td.planHeader { white-space:nowrap;

/*
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
*/

text-shadow:0px 0px 0px #444444;
-moz-box-shadow: 0px 0px 0px 0px #444444;
-webkit-box-shadow: 0px 0px 0px 0px #444444;
box-shadow: 0px 0px 0px 0px #444444;
color: #ffffff;

/* background: #87B320 ; */


background: #94c723 ;
background-image: -webkit-gradient(linear, left top, left bottom, from(#94c723), to(#6ab119));
background-image: -moz-linear-gradient(top,  #94c723,  #6ab119);
background-image:     -ms-linear-gradient(top, #94c723,  #6ab119);
background-image:      -o-linear-gradient(top, #94c723,  #6ab119);
background-image:         linear-gradient(top, #94c723,  #6ab119);
filter:  progid:DXImaGETransform.Microsoft.gradient(startColorstr='#94c723', endColorstr='#6ab119');


}

.pricingTable td.headerLeft {

	border-top-left-radius: 8px; 
	-webkit-border-top-left-radius: 8px; 
	-moz-border-radius-topleft: 8px; 
	
	border-bottom-left-radius: 8px; 
	-webkit-border-bottom-left-radius: 8px; 
	-moz-border-radius-bottomleft: 8px; 
		
}

.pricingTable td.headerRight {

	border-top-right-radius: 8px; 
	-webkit-border-top-right-radius: 8px; 
	-moz-border-radius-topright: 8px; 
	
	border-bottom-right-radius: 8px; 
	-webkit-border-bottom-right-radius: 8px; 
	-moz-border-radius-bottomright: 8px; 
		
}

.pricingTable td.selected {

	background: #6CF;
}

.pricingTable .plans .dollarSign { 

font-size:16px;
vertical-align:top;
margin-right:2px;
line-height:20px;
		
}

.pricingTable .plans .cents { font-size:16px;
vertical-align:top;
margin-left:2px;
/* line-height:28px; */
		
}

.pricingTable .perMonth {
	font-weight:normal;
	/* color: #999; */
	color:#E1E1E1;
	font-size: 14px;
		
}


.pricingTable .upTo {
	font-weight:normal;
	color: #999;
	font-size: 12px;
		
}

/*
===========================================
    PunchStation Button Styles
===========================================
*/
.ButtonGreen {
display: inline-block;
border: 1px solid #4a7603;
cursor: pointer;
text-align: center;
text-decoration: none;
font: 16px Arial;
font-weight: bold;
padding: 6px 22px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
text-shadow:0px 0px 0px #444444;
-moz-box-shadow: 0px 0px 0px 0px #444444;
-webkit-box-shadow: 0px 0px 0px 0px #444444;
box-shadow: 0px 0px 0px 0px #444444;
color: #ffffff;
background: #94c723;
background-image: -webkit-gradient(linear, left top, left bottom, from(#94c723), to(#6ab119));
background-image: -moz-linear-gradient(top,  #94c723,  #6ab119);
background-image:     -ms-linear-gradient(top, #94c723,  #6ab119);
background-image:      -o-linear-gradient(top, #94c723,  #6ab119);
background-image:         linear-gradient(top, #94c723,  #6ab119);
filter:  progid:DXImaGETransform.Microsoft.gradient(startColorstr='#94c723', endColorstr='#6ab119');
/*
overflow: hidden;
*/
}

.ButtonGreen:hover {
background: #94c723;
background-image: -webkit-gradient(linear, left top, left bottom, from(#6ab119), to(#94c723));
background-image: -moz-linear-gradient(top,  #6ab119,  #94c723);
background-image:     -ms-linear-gradient(top, #6ab119,  #94c723);
background-image:      -o-linear-gradient(top, #6ab119,  #94c723);
background-image:         linear-gradient(top, #6ab119,  #94c723);
filter:  progid:DXImaGETransform.Microsoft.gradient(startColorstr='#6ab119', endColorstr='#94c723');
text-decoration: none;
color: #ffffff;
}

.ButtonGreen:active, .ButtonGreen:visited, .ButtonGreen:link  {
color: #ffffff;
position: relative;
text-decoration: none;
/* top: 1px; */
}





/* Red Button */
.ButtonRed {
display: inline-block;
border: 1px solid #800000;
cursor: pointer;
text-align: center;
text-decoration: none;
font: 16px Arial;
font-weight: bold;
padding: 6px 22px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
text-shadow:0px 0px 0px #444444;
-moz-box-shadow: 0px 0px 0px 0px #444444;
-webkit-box-shadow: 0px 0px 0px 0px #444444;
box-shadow: 0px 0px 0px 0px #444444;
color: #ffffff;
background: #E80000;
background-image: -webkit-gradient(linear, left top, left bottom, from(#E80000), to(#B00000));
background-image: -moz-linear-gradient(top,  #E80000,  #B00000);
background-image:     -ms-linear-gradient(top, #E80000,  #B00000);
background-image:      -o-linear-gradient(top, #E80000,  #B00000);
background-image:         linear-gradient(top, #E80000,  #B00000);
filter:  progid:DXImaGETransform.Microsoft.gradient(startColorstr='#E80000', endColorstr='#B00000');
/*
overflow: hidden;
*/
}

.ButtonRed:hover {
background: #E80000;
background-image: -webkit-gradient(linear, left top, left bottom, from(#B00000), to(#E80000));
background-image: -moz-linear-gradient(top,  #B00000,  #E80000);
background-image:     -ms-linear-gradient(top, #B00000,  #E80000);
background-image:      -o-linear-gradient(top, #B00000,  #E80000);
background-image:         linear-gradient(top, #B00000,  #E80000);
filter:  progid:DXImaGETransform.Microsoft.gradient(startColorstr='#B00000', endColorstr='#E80000');
text-decoration: none;
color: #ffffff;
}

.ButtonRed:active, .ButtonRed:visited, .ButtonRed:link  {
color: #ffffff;
position: relative;
text-decoration: none;
/* top: 1px; */
}



/* Disabled Button */
.ButtonDisabled {
display: inline-block;
border: 1px solid #606060;
cursor: default;
text-align: center;
text-decoration: none;
font: 16px Arial;
font-weight: bold;
padding: 6px 22px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
text-shadow:0px 0px 0px #444444;
-moz-box-shadow: 0px 0px 0px 0px #444444;
-webkit-box-shadow: 0px 0px 0px 0px #444444;
box-shadow: 0px 0px 0px 0px #444444;
color: #FFFFFF;
background: #909090;
background-image: -webkit-gradient(linear, left top, left bottom, from(#909090), to(#C0C0C0));
background-image: -moz-linear-gradient(top,  #909090,  #C0C0C0);
background-image:     -ms-linear-gradient(top, #909090,  #C0C0C0);
background-image:      -o-linear-gradient(top, #909090,  #C0C0C0);
background-image:         linear-gradient(top, #909090,  #C0C0C0);
filter:  progid:DXImaGETransform.Microsoft.gradient(startColorstr='#909090', endColorstr='#C0C0C0');
/*
overflow: hidden;
*/
}

/*
.ButtonDisabled:hover {
background: #E80000;
background-image: -webkit-gradient(linear, left top, left bottom, from(#B00000), to(#E80000));
background-image: -moz-linear-gradient(top,  #B00000,  #E80000);
background-image:     -ms-linear-gradient(top, #B00000,  #E80000);
background-image:      -o-linear-gradient(top, #B00000,  #E80000);
background-image:         linear-gradient(top, #B00000,  #E80000);
filter:  progid:DXImaGETransform.Microsoft.gradient(startColorstr='#B00000', endColorstr='#E80000');
text-decoration: none;
color: #ffffff;
}

.ButtonDisabled:active, .ButtonRed:visited, .ButtonRed:link  {
color: #ffffff;
position: relative;
text-decoration: none;
}
*/

/*
===========================================
    PunchStation Glossy Menu
===========================================
*/

.glossymenu{
list-style-type: none;
margin: 5px 0;
padding: 0;
width: 180px;
border: 0px solid #9A9A9A;
border-bottom-width: 0;
border-radius: 8px;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
overflow:hidden;
}

.glossymenu li a{
background: white url(images/glossyback.gif) repeat-x bottom left;
font: bold 13px "Lucida Grande", "Trebuchet MS", Verdana, Helvetica, sans-serif;
color: white;
display: block;
width: auto;
padding: 3px 0;
padding-left: 10px;
text-decoration: none;

}


* html .glossymenu li a{ /*IE only. Actual menu width minus left padding of A element (10px) */
width: 170px;
}


.glossymenu li a:visited, .glossymenu li a:active{
color: white;
}



.glossymenu li a:hover, .glossymenu li a.active, .glossymenu li a.active:hover{
background-image: url(images/glossyback2.gif);
}


/*
===========================================
    PunchStation Box Container
===========================================
*/

.boxContainer {

	border: 1px solid #0d83dd;
	/* border-top: 20px solid #9A9A9A; */
	border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px; 
	overflow:hidden;
	display:inline-block;
	/* float:left; */
	
	
}

.redBorder {
	border-color:#F00;
	
}



.boxContainer div.header { 

	background-color:#0d83dd; 
	/* height: 20px; */
	font-size:14px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-weight:bold;
	padding:5px;
	/* padding-left:10px; */
	/* width:100%; */
	color:#ffffff;
	text-align:left;
	
	
	border: 0px solid #0d83dd;
	border-radius: 6px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px; 

	border-bottom-right-radius: 0px; 
	-webkit-border-bottom-right-radius: 0px; 
	-moz-border-radius-bottomright: 0px; 
	
	border-bottom-left-radius: 0px; 
	-webkit-border-bottom-left-radius: 0px; 
	-moz-border-radius-bottomleft: 0px; 

	overflow:hidden;
	

}


.boxContainer div.redHeader {
	background-color:#F00;
	
}



.boxContainer div.content { padding:5px;
text-align:left;
}

/*
===========================================
    PunchStation Forms
===========================================
*/

.formContainer {

	border: 1px solid #dedede;
	background-color: #f2faff;
	/* border-top: 20px solid #9A9A9A; */
	padding:30px;
	border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px; 
	/* overflow:hidden; */
	display:inline-block;
	/* float:left; */
	overflow: visible; /* Y.O. 2/10/2016 Added for jQuery Chosen support to avoid drop boxes fromn being cut-off by container */
	
	
}

.formContainer *.formLabel {
    font-weight: bold;
	white-space: nowrap;
    
	/*
	float: left;
    width: 180px;
    height: 35px;
    margin-right: 10px;
    text-align: right;
    display: block;
    clear: both;
    line-height: 31px;
	*/
}

.formContainer *.formError, .formError {
    font-weight: bold;
	color:#FF0000;
    
}

.boxContainer .formError
{
    font-weight: bold;
	color:#FF0000;
    
}

.formErrorContainer {

	font: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #333;
	font-size: 16px;

	background-color:#FAA;
	/* color:#474747; */
	border:solid 1px #ddd;
	margin-bottom:4px;
	line-height:24px;
	vertical-align:middle;
	padding:10px;
	/* font-size:16px; */
	-moz-border-radius:7px;
	-webkit-border-radius:7px;
	border-radius:7px;
	clear:both;
	text-shadow:1px 1px 0 #fff
	
	
	}
	
.formContainer *.formSuccess {
    font-weight: bold;
	color:#9C0;
    
}


.formContainer *.formConfirmation {
	font-weight: bold;
	font-size: 18px;
	color: #535353;
}

/*
===========================================
    PunchStation Welcome Screen
===========================================
*/

.welcomeStepContainer {

	border: 2px solid #dedede;
	background-color: #f2faff;
	/* border-top: 20px solid #9A9A9A; */
	padding:20px;
	padding-bottom:10px;
	padding-top:10px;
	border-radius: 20px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px; 
	overflow:hidden;
	display:inline-block;
	/* float:left; */
	
	
}


.welcomeStepLabel {
	font: Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 14px;
	line-height:10px;
	color: #0d83dd;
}

.welcomeStepNumber {
	font: Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 54px;
	color: #0d83dd;
}


.bluetitle {
	font: bold 15px Arial, Helvetica, sans-serif;
	color: #0d83dd;
	margin-bottom: 4px;
	font-size: 24px;
}

.blueTitleMedium {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #0d83dd;
	font-size: 18px;
}

.section-header {

	font: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #333;
	font-size: 16px;

	background-color:#e8e8e8;
	/* color:#474747; */
	border:solid 1px #ddd;
	margin-bottom:4px;
	line-height:24px;
	vertical-align:middle;
	padding:0 10px;
	/* font-size:16px; */
	-moz-border-radius:7px;
	-webkit-border-radius:7px;
	border-radius:7px;
	clear:both;
	text-shadow:1px 1px 0 #fff;
	
    /* -webkit-text-size-adjust: 100%; */
	
	}
	
@media screen and (max-device-width: 480px){

	/*fix for larger text size for signup hint */
	#signupHint
	{
		-webkit-text-size-adjust:140%; 
	}  

} 
	
	

.pricing-side-bar .commentContainer {

	background-color:#e8e8e8;
	/* color:#474747; */
	border:solid 2px #ddd;
	margin-bottom:4px;
	/* vertical-align:middle; */
	padding:0 5px;
	font-size:12px;
	-moz-border-radius:7px;
	-webkit-border-radius:7px;
	border-radius:7px;
	clear:both;
	
	}
	
.pricing-side-bar .commentContainer .title {

	font: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #333;
	font-size: 14px;
	text-shadow:1px 1px 0 #fff
	/* line-height:24px; */
	
	}

.pricing-side-bar .commentContainer .author {

	font: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #333;
	font-size: 11px;
	
	}
	
.cloudContainer {
	
	position: absolute; 
	top: 0px; 
	left: 0px; 
	width: 180px; 
	height: 122px; 
	vertical-align:middle; 
	text-align:center;
	
	font: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #FFFFFF;
	font-size: 14px;
	/* text-shadow:1px 1px 0 #fff	 */
	
}

.pricingDetails select, input {
	margin-left:0px;
	
}



.site-alert {

	font: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #333;
	font-size: 14px;

	background-color: #FAA;
	/* color:#474747; */
	border:solid 1px #ddd;
	margin-bottom:4px;
	line-height:24px;
	vertical-align:middle;
	padding:0 10px;
	/* font-size:16px; */
	-moz-border-radius:7px;
	-webkit-border-radius:7px;
	border-radius:7px;
	clear:both;
	/* text-shadow:1px 1px 0 #fff */
	
	
	}

.site-alert.warning {

	/*
	font: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #333;
	font-size: 16px;
	*/
	background-color: #FF9;
	
	}


.web-punch-status{

	font: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #333;
	font-size: 18px;

	background-color: #FF8080;
	border:solid 1px #ddd;
	margin-bottom:4px;
	line-height:24px;
	vertical-align:middle;
	padding:0 10px;
	-moz-border-radius:7px;
	-webkit-border-radius:7px;
	border-radius:7px;
	clear:both;
	text-shadow:1px 1px 0 #fff 
	
	
	}

.web-punch-status.in {


	/* background-color: #BDFF5B; */
	background-color: #ADE254;
	
	}


.info-round-box {

	font: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #fff;
	font-size: 14px;

	background-color:#0d83dd;
	/* color:#474747; */
	/* border:solid 1px #ddd; */
	/*margin-bottom:4px;*/
	padding: 7px 12px;
	/*line-height:30px;*
	vertical-align:middle;
	/*padding:0 10px;*/
	/* font-size:16px; */
	-moz-border-radius:15px;
	-webkit-border-radius:15px;
	border-radius:15px;
	clear:both;
	text-shadow:1px 1px 0 #333
	/* text-shadow:0px -1px 1px #333 */
	
	
	}
	


.api-codeblock {
	background-color: #EEE; 
	padding: 5px;
	font-family: Monaco,Consolas,"Lucida Console",monospace;
	display:inline-block;
	
}

.api-parameter {
	/* background-color: #EEE; */
	/* padding: 5px;  */
	font-family: Monaco,Consolas,"Lucida Console",monospace;
	font-style: italic;
}

.mediaKit {
	border-bottom:2px solid #CCC;
	padding-bottom:30px;
	padding-top:30px;
}

.mediaKit .darkGreyTitleMedium {
	margin-left:8px;
}


/*

Twitter Button

*/

/*
div.navigation div.signin.twitter a{background:#015e94;background:transparent;background:-webkit-linear-gradient(#28a0e5, #015e94);background:-moz-linear-gradient(#28a0e5, #015e94);background:-ms-linear-gradient(#28a0e5, #015e94);background:-o-linear-gradient(#28a0e5, #015e94);background:linear-gradient(#28a0e5, #015e94);-webkit-transition:-webkit-box-shadow 0.2s ease-in-out;-moz-transition:-moz-box-shadow 0.2s ease;-webkit-box-shadow:0 1px 1px rgba(0,0,0,0.15);-moz-box-shadow:0 1px 1px rgba(0,0,0,0.15);-ms-box-shadow:0 1px 1px rgba(0,0,0,0.15);-o-box-shadow:0 1px 1px rgba(0,0,0,0.15);box-shadow:0 1px 1px rgba(0,0,0,0.15)}

div.navigation div.signin.twitter a em{display:block;position:absolute;right:11px;top:7px;width:16px;height:14px;background:url(/images/TwitterButton/twitter.png);background-size:100% 100%}

div.navigation div.signin.twitter span{padding-right:36px;position:relative;color:#fff;background:#017aff;text-shadow:0 -1px 0 rgba(0,0,0,0.33);background:transparent;background:-webkit-linear-gradient(#7dc5ee, #008cdd 85%, #30a2e4);background:-moz-linear-gradient(#7dc5ee, #008cdd 85%, #30a2e4);background:-ms-linear-gradient(#7dc5ee, #008cdd 85%, #30a2e4);background:-o-linear-gradient(#7dc5ee, #008cdd 85%, #30a2e4);background:linear-gradient(#7dc5ee, #008cdd 85%, #30a2e4);-webkit-box-shadow:inset 0 1px 0 rgba(255,255,255,0.25);-moz-box-shadow:inset 0 1px 0 rgba(255,255,255,0.25);-ms-box-shadow:inset 0 1px 0 rgba(255,255,255,0.25);-o-box-shadow:inset 0 1px 0 rgba(255,255,255,0.25);box-shadow:inset 0 1px 0 rgba(255,255,255,0.25)}

div.navigation div.signin.twitter a:hover{box-shadow:0px 1px 0 rgba(0,0,0,0.15),0 0 6px #5695db;-webkit-box-shadow:0px 1px 0 rgba(0,0,0,0.15),0 0 6px #5695db;-moz-box-shadow:0px 1px 0 rgba(0,0,0,0.15),0 0 6px #5695db}

div.navigation div.signin.twitter a:active{background:#005d93}

div.navigation div.signin.twitter a:active span{color:#eee;background:#008cdd;background:transparent;background:-webkit-linear-gradient(#008cdd, #008cdd 85%, #239adf);background:-moz-linear-gradient(#008cdd, #008cdd 85%, #239adf);background:-ms-linear-gradient(#008cdd, #008cdd 85%, #239adf);background:-o-linear-gradient(#008cdd, #008cdd 85%, #239adf);background:linear-gradient(#008cdd, #008cdd 85%, #239adf);-webkit-box-shadow:inset 0 1px 0 rgba(0,0,0,0.1);-moz-box-shadow:inset 0 1px 0 rgba(0,0,0,0.1);-ms-box-shadow:inset 0 1px 0 rgba(0,0,0,0.1);-o-box-shadow:inset 0 1px 0 rgba(0,0,0,0.1);box-shadow:inset 0 1px 0 rgba(0,0,0,0.1)}


div.navigation div.signin.twitter a em{background-image:url(/images/TwitterButton/twitter@2x.png)}

*/

/* ===========================================
	Lists
============================================== */
ul, ol {
	margin: 0 0 20px 35px;
	padding: 0;
}
ul li {
	list-style: disc;
	padding: 2px 0;
}
ol li {
	list-style: decimal;
}




/*
===========================================
    Forms
===========================================
*/
input, textarea, select {
    font: 15px/20px Arial, Helvetica, sans-serif;
    color: #000;
    padding: 4px;
}
    
/*
===========================================
    jQuery Chosen
===========================================
*/
.chosen-select {
	padding-right:10px;
}


/*
===========================================
    Header Menu Section
===========================================
*/

#menu {
    background: url(images/header/menu-bg.png) no-repeat left top;
    height: 47px;
    overflow: hidden;
    text-align: left;   
}
#menu a {
    color: #fff;
    text-decoration: none;
}
/*#menu a:hover {
    background-color: none;
    color: #fff;
    text-decoration: underline;
}*/

#menu ul {
    color: #fff;
    font-weight: 500;
    
}
#menu li {
    float: left;
    list-style: none;
}

#menu ul.menu-main {
    font-size: 16px;
    float: left;
    width: 700px;       
    height: 47px;   
    margin: 0px;
}

#menu ul.menu-main li { height: 47px; padding: 0px;}
#menu ul.menu-main li.menuend {
        background: url(images/header/menu-sep.png) repeat-y left top;
        padding: 13px 18px 14px 18px;   
        display: block;
}
#menu ul.menu-main li a {
        background: url(images/header/menu-sep.png) repeat-y left top;
        padding: 13px 18px 14px 18px;   
        display: block;
        font-weight: 600;
}
#menu ul.menu-main li a:hover {
    background: #0877cb url(images/header/menu-sep.png) repeat-y left top;
}
#menu ul.menu-main li a.homemenu {
    background: none;   
}

#menu ul.menu-main li a.homemenu:hover { 
    /* background: #0877cb url(images/header/home-active-bg.png) no-repeat left top; */
    background: #0877cb url(images/header/home-active-bg.gif) no-repeat left top;
    }

    
/*----Active Menu State -------*/

.homepage #menu ul.menu-main li a.homemenu {
    background: #0877cb url(images/header/home-active-bg.gif) no-repeat left top;
}   
.tourpage #menu ul.menu-main li a.tourmenu {
    background: #0877cb url(images/header/menu-sep2.gif) repeat-y left top;
}
.pricepage #menu ul.menu-main li a.pricemenu {
    background: #0877cb url(images/header/menu-sep2.gif) repeat-y left top;
}
.aboutpage #menu ul.menu-main li a.aboutmenu {
    background: #0877cb url(images/header/menu-sep2.gif) repeat-y left top;
}
.blogpage .menu-main2 li a.blogmenu {
    background: #0067b7;    
    text-decoration:none;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px; 
}
.apipage .menu-main2 li a.apimenu {
    background: #0067b7;    
    text-decoration:none;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px; 
}
.addonspage .menu-main2 li a.addonsmenu {
    background: #0067b7;    
    text-decoration:none;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px; 
}   
.supportpage .menu-main2 li a.hover-drop {
    background: #0067b7 url(images/header/arrow-down2.gif) no-repeat 61px center;  
    text-decoration:none;
    padding-right: 20px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px; 
    border-radius: 2px; 
}
/*----End Active Menu State -------*/


.menu-main2 {
    border:none;
    border:0px;
    margin:1px 0px 0px;
    padding:0px;
    float: right;
    width: 100px;
    }
    
.menu-main2 ul{
    background:none;
    list-style:none;
    margin:0;
    padding:0;
    }
    .menu-main2 li {
        float:right;
        padding: 8px 2px;
        font-size: 13px;
        
        }
        .menu-main2 li a.hover-drop {
            background: url(images/header/arrow-down.gif) no-repeat 61px center;   
            padding-right: 20px;
            }
    .menu-main2 li a{
        background: none;
        color:#fff;
        display:block;
        font-weight:normal;
        margin:0px;
        padding:5px 5px;
        text-align:center;
        text-decoration:none;
        -moz-border-radius: 3px;
        -webkit-border-radius: 3px;
        border-radius: 3px;     
        }
        .menu-main2 li a:hover, .menu-main2 ul li:hover a {
            background: #0067b7;        
            color:#FFFFFF;
            text-decoration:none;
            -moz-border-radius: 2px;
            -webkit-border-radius: 2px;
            border-radius: 2px;         
            }
    .menu-main2 li a:hover.hover-drop {
        background: #0067b7  url(images/header/arrow-down2.gif) no-repeat 61px center;
    }           
    .menu-main2 li ul{
        background: #0067b7;
        display:none;
        height:auto;
        padding:0px;
        margin:1px 0 0 0;
        border:0px;
        position:absolute;
        width:85px;
        z-index:200;
        -moz-border-radius: 2px;
        -webkit-border-radius: 2px;
        border-radius: 2px;
        /*top:1em;
        /*left:0;*/
        }
    .menu-main2 li:hover ul{
        display:block;
        
        }
    .menu-main2 li li {
        display:block;
        float:none;
        margin:0px;
        padding:0px;
        width:85px;
        }
    .menu-main2 li:hover li a {
        background:none;
        
        }
    .menu-main2 li ul a{
        display:block;
        font-size:12px;
        font-style:normal;
        margin:1px;
        padding:2px 10px 2px 10px;
        text-align:left;
        }
        .menu-main2 li ul a:hover, .menu-main2 li ul li:hover a{
            background:#3fa9f5;
            border:0px;
            color:#ffffff;
            text-decoration:none;
            
            }
    .menu-main2 p{
        clear:left;
        }   
    .menu-main2 li.login-main {
/*      background: url(images/header/button-login.png) no-repeat left center;*/
        width: 62px;
        height: 26px;
        color:  #628e0e;
    }
    #menu   .menu-main2 li a.login-main {
        color:  #628e0e;
        margin-top: 1px;
        margin-left: 15px;
        padding: 4px 15px;
/*      background: url(images/header/button-login.png) no-repeat left center;*/
        background: #fff;
        -moz-border-radius: 2px;
        -webkit-border-radius: 2px;
        border-radius: 2px; 
        }
#menu   .menu-main2 li a:hover.login-main {
    background:  #6cc00e;
    color:  #fff;
}





/*
===========================================
    Forms
===========================================
*/

input, textarea, select {
    font: 15px/normal Arial, Helvetica, sans-serif;
    color: #000;
    padding: 4px;
}


/*
===========================================
    Home Banner Section
===========================================
*/

#banner {
    background:  url(images/banners-bg-divider.png) no-repeat left 10px;
    height: 338px;  
    margin-bottom: 20px;
    overflow: hidden;
    width: 
}

#banner-no-divider {
    background:  url(images/banners-bg.png) no-repeat left 10px;
    height: 338px;  
    margin-bottom: 20px;
    overflow: hidden;
    width: 
}

