/*
body {BACKGROUND: rgb(39,52,60); FONT-FAMILY: 'trebuchet ms', verdana, arial, sans-serif; MARGIN: 15px;}
*/
body {BACKGROUND: #FFF; FONT-FAMILY: 'trebuchet ms', verdana, arial, sans-serif; MARGIN: 0px; MARGIN-TOP: 0;}

h1 {FONT-FAMILY: helvetica, verdana, arial, sans-serif; COLOR: #FFF; FONT-SIZE: 30px; FONT-WEIGHT: bold; LINE-HEIGHT: 45px; MARGIN: 0px 15px; MARGIN-TOP: 5px; PADDING: 0; letter-spacing: -1px;}
h2 {MARGIN: 8px 0; FONT-SIZE: 22pt; COLOR: #000;}
h3 {MARGIN-BOTTOM: 0px;}
h3.mini_graph {FONT-WEIGHT: normal; FONT-SIZE: 12pt; COLOR: #FFF; BACKGROUND: #666; PADDING: 3px 5px; MARGIN-BOTTOM: 5px;}
h3.features {FONT-SIZE: 17pt; BORDER-BOTTOM: 1px solid #000;}

img {BORDER: none;}
a {COLOR: rgb(0,96,191);}
a:hover {TEXT-DECORATION: none; COLOR: #FFF; BACKGROUND: rgb(0,96,191);}
th {BACKGROUND: #CCC; FONT-WEIGHT: normal; PADDING: 7px; TEXT-ALIGN: left;}

fieldset.signup {BORDER: none; BORDER-TOP: 1px solid #666; MARGIN-BOTTOM: 20px; PADDING-TOP: 10px;}
fieldset.signup legend {FONT-SIZE: 11pt; COLOR: #000;}

input.big {FONT-SIZE: 1.4em; FLOAT: left;}
select.website, select.term {BACKGROUND: rgb(0,96,191); COLOR: #FFF; BORDER: none;}
select.website {BACKGROUND: rgb(0,96,191);}
select.term {BACKGROUND: #70A0FF;}
select.website option, select.term option {PADDING: 3px;}
select.timezone {FONT-SIZE: 0.7em;}

input.signup {BACKGROUND: rgb(0,96,191); COLOR: #FFF; BORDER: none; PADDING: 3px 20px; FONT-SIZE: 12pt; FONT-WEIGHT: normal;}
input.signup:hover {BACKGROUND: #46B02F; CURSOR: pointer;}

label {FONT-SIZE: 0.7em; COLOR: #333; MARGIN-BOTTOM: 0px;}
#UserLoginForm label {FONT-SIZE: 10pt;}

#container {WIDTH: 1024px; MARGIN: 0 auto; BACKGROUND: #FFF;}
#header {BACKGROUND: #0387ec; BACKGROUND: rgb(0,117,206); PADDING: 0px;}
#header a {COLOR: #FFF;}
#logo {FLOAT: left; WIDTH: 350px; MARGIN-TOP: 5px;}
a.logo:hover {BACKGROUND: none;}

#menu {FLOAT: right; PADDING-TOP: 10px; MARGIN-RIGHT: 15px; COLOR: #FFF;}
#menu a {COLOR: #FFF;}

#menu_bar {WIDTH: 100%; BACKGROUND: rgb(0,117,206); BACKGROUND: #0387ec;}
#main_menu {PADDING-LEFT: 15px; PADDING-TOP: 0px;}
#main_menu ul {LIST-STYLE-TYPE: none; MARGIN: 0; PADDING: 0;}
#main_menu li {FLOAT: left; BORDER-RIGHT: 2px solid rgb(0,117,206);}
#main_menu a {DISPLAY: block; PADDING: 5px 15px; COLOR: #FFF; FONT-WEIGHT: bold; TEXT-DECORATION: none; BACKGROUND: rgb(89,165,223);}
#main_menu a.current {BACKGROUND: #FFF; COLOR: #333; TEXT-DECORATION: none;}
#main_menu a:hover {BACKGROUND: #333; TEXT-DECORATION: none;}
#main_menu a.current:hover {BACKGROUND: #FFF; COLOR: #333; TEXT-DECORATION: none;}

.content {PADDING: 15px 0; PADDING-TOP: 0px;}
#footer {MARGIN: 15px; PADDING: 10px; BACKGROUND: #EFEFEF; COLOR: #999; FONT-SIZE: 0.9em;}

/*  components    */
#path {FLOAT: left; MARGIN-BOTTOM: 5px;}

#selectors {FLOAT: right; MARGIN-BOTTOM: 10px; MARGIN-TOP: 10px;}

/*
#intro {BACKGROUND: rgb(219,239,255); FONT-SIZE: 1.4em; PADDING: 15px; MARGIN: 15px 0;}
*/

/*
NEW VERSION
*/
#intro {BACKGROUND: rgb(219,239,255) url(../img/intro_bg.png) top left repeat-x; PADDING: 20px; PADDING-RIGHT: 12px; MARGIN: 15px 0;}
#intro ul {LIST-STYLE-IMAGE: url(../img/icons/accept.png); MARGIN: 0; PADDING: 0; MARGIN-LEFT: 25px;}
#slides {PADDING-RIGHT: 15px;}
#slides a {FLOAT: right; DISPLAY: block; BACKGROUND: rgb(74,142,210); PADDING: 2px 4px; MARGIN-LEFT: 5px; COLOR: #FFF; FONT-SIZE: 8pt; TEXT-DECORATION: none;}
#slides a:hover {BACKGROUND: #999;}
#testimonials {WIDTH: 700px; MARGIN: 15px auto; BACKGROUND: rgb(255,251,184); BORDER: 1px solid rgb(253,197,26); COLOR: #666; PADDING: 20px; TEXT-ALIGN: center; FONT-SIZE: 18pt;}

input.form-error {BORDER: 1px solid red; BACKGROUND: rgb(254,236,236);}
.error-message {FONT-SIZE: 9pt; COLOR: red;}



#left_column {FLOAT: left; WIDTH: 485px;}
#right_column {FLOAT: right; WIDTH: 485px;}

ul.features {MARGIN-LEFT: 0; PADDING-LEFT: 26px; list-style-image: url(../images/ok.gif);}
ul.features li {MARGIN-BOTTOM: 5px;}

table.plans {WIDTH: 100%; BORDER: 1px solid #CCC; BORDER-COLLAPSE: collapse; EMPTY-CELLS: show;}
table.plans td {WIDTH: 25%; TEXT-ALIGN: center;  BORDER: 1px solid #CCC; PADDING: 5px;}
table.plans td ul {LIST-STYLE-TYPE: none; PADDING: 0;}
table.plans td li {MARGIN-BOTTOM: 8px;}

table.signup td {PADDING: 0 5px; PADDING-BOTTOM: 20px;}

table.listing {WIDTH: 100%; BORDER-COLLAPSE: collapse; EMPTY-CELLS: show;}
table.listing td {PADDING: 8px; TEXT-ALIGN: left;}
table td.left {TEXT-ALIGN: left;}
table td.right {TEXT-ALIGN: right;}
table td.center {TEXT-ALIGN: center;}
table.listing.g {BACKGROUND: rgb(243,255,208);}
table.listing tr {BORDER: 1px solid #FFF;}
table.listing tr.g {BACKGROUND: rgb(243,255,208); BACKGROUND: #f3f9fd;}
/*
table.listing tr:hover, table.listing tr:active {BORDER: 1px solid #CCC;}
table.websites td { BORDER-BOTTOM: 1px solid yellow;}
*/

table.details {WIDTH: 100%;}
table.details td {PADDING: 0px; BORDER: none; FONT-SIZE: 10pt;}

td.tdlabel {FONT-SIZE: 10pt; COLOR: #666;}

.listing_menu {MARGIN-TOP: 15px; DISPLAY: block;}
.listing_menu img {VERTICAL-ALIGN: middle;}
.listing_menu a {FONT-SIZE: 10pt; TEXT-DECORATION: none; MARGIN-RIGHT: 15px;}


fieldset.add_website {BACKGROUND: rgb(219,239,255); BORDER: 1px solid #dee7ef; PADDING: 8px;}

.clr {CLEAR: both;}
.green {COLOR: green;}
.grey {COLOR: grey;}
.red {COLOR: red;}
.orange {COLOR: orange;}

a.valid {FONT-SIZE: 0.8em; COLOR: green; TEXT-DECORATION: none;}
a.valid:hover {TEXT-DECORATION: underline; BACKGROUND: none;}
a.no_link {FONT-SIZE: 0.8em; COLOR: #999; TEXT-DECORATION: none;}
a.no_link:hover {TEXT-DECORATION: underline; BACKGROUND: none;}
a.invalid {FONT-SIZE: 0.8em; COLOR: red; TEXT-DECORATION: none;}
a.invalid:hover  {TEXT-DECORATION: underline; BACKGROUND: none;}
a.offline {FONT-SIZE: 0.8em; COLOR: orange; TEXT-DECORATION: none;}
a.offline:hover  {TEXT-DECORATION: underline; BACKGROUND: none;}
a.nofollow {FONT-SIZE: 0.8em; COLOR: rgb(255,153,102); TEXT-DECORATION: none;}
a.nofollow:hover  {TEXT-DECORATION: underline; BACKGROUND: none;}

.gc_grey {COLOR: rgb(128,102,121); FONT-SIZE: 10pt;}
.gc_black {COLOR: #000; FONT-SIZE: 10pt;}

.stats {FONT-SIZE: 0.9em;}
.screenshot {PADDING: 5px; BORDER: 1px solid #999;}
.price {FONT-SIZE: 1.3em;}
.big {FONT-SIZE: 1.3em;}

.label {WIDTH: 120px; TEXT-ALIGN: right; FONT-SIZE: 11pt;}
.bold {FONT-WEIGHT: bold;}
.asterisk {FONT-SIZE: 13pt; COLOR: rgb(61,134,206);}

.separator {WIDTH: 100%; HEIGHT: 1px; MARGIN: 5px 0; BACKGROUND: #CCC;}

/* status massages */
.message-good, .message-bad, .message-info  {
	padding: 10px 10px 10px 40px;
	margin-bottom: 20px;
	background-position: 7px 7px;
	background-repeat: no-repeat;
}

.message-good {
	border: 1px solid #cae49c;
	color: #516f1b;
	background-color: #f3ffd0;
	background-image: url(../img/icons/accept-big.png)
}

.message-good a {
	color: #516f1b;
}

.message-bad {
	border: 1px solid #ffdede;
	color: #ce0000;
	background-color: #fff1f1;
	background-image:  url(../img/icons/exclamation-big.png);
}

.message-bad a {
	color: #ce0000;
}

.message-info {
	border: 1px solid #ededb3;
	background-color: #ffffcc;
	background-image:  url(../img/icons/information-big.png);
}










/*    CakePHP   */
.input, .submit {DISPLAY: inline; MARGIN-LEFT: 10px;}
a.back  {FONT-SIZE: 0.8em; COLOR: #FFF; BACKGROUND: rgb(0,96,191); TEXT-DECORATION: none; PADDING: 2px;}
a.back:hover  {FONT-SIZE: 0.8em; COLOR: rgb(0,96,191); BACKGROUND: #FFF; TEXT-DECORATION: underline;}
.show_graph {CLEAR: both; FONT-SIZE: 0.8em;}
.term {}

#submenu {WIDTH: 100%; HEIGHT: 30px; MARGIN-BOTTOM: 10px;}
#submenu ul {WIDTH: 100%; LIST-STYLE-TYPE: none; MARGIN: 0; PADDING: 0; BACKGROUND: #EFEFEF;}
#submenu li {FLOAT: left; BACKGROUND: #EFEFEF; PADDING: 8px 21px;}
#submenu li.active {BACKGROUND: #CCC;}
#submenu li:hover, #submenu li:active {BACKGROUND: rgb(0,96,191); COLOR: #FFF; TEXT-DECORATION: underline;}
#submenu li a:hover {BACKGROUND: rgb(0,96,191); TEXT-DECORATION: underline; COLOR: #FFF;}


.help {BACKGROUND: rgb(255,251,184); BORDER: 1px solid rgb(253,197,26); PADDING: 5px; MARGIN-TOP: 10px;}
.help_arrow{POSITION: relative; LEFT: -39px; TOP: -55px; WIDTH: 40px; HEIGHT: 41px; BACKGROUND: transparent url(../img/arrow_transp.png) no-repeat;}

.feature {MARGIN-BOTTOM: 20px;}
.feature img {BORDER: 1px solid #CCC; PADDING: 3px;}

a#signup_link {COLOR: #BCFC3D;}




/*  PAGINATION    */
.pagination {FLOAT: right; FONT-SIZE: 9pt;}
.pag_top {MARGIN-TOP: 0px; MARGIN-BOTTOM: 3px;}
.pag_bottom {MARGIN-TOP: 3px; MARGIN-BOTTOM: 12px;}
.pagination div {DISPLAY: inline;}
.pagination a {PADDING: 0px 4px; FONT-SIZE: 9pt; BORDER: 1px solid rgb(0,96,191); TEXT-DECORATION: none; MARGIN: 0 1px;}
.pagination div.disabled, .pagination span.disabled {PADDING: 0px 4px; BORDER: 1px solid #999; COLOR: #999; MARGIN: 0 1px;}
.pagination span.current {PADDING: 0px 4px; BORDER: 1px solid rgb(0,96,191); BACKGROUND: rgb(0,96,191); COLOR: #FFF; MARGIN: 0 1px;}


/*    Slider    */
.clearfix {clear:both;}
.floatl {float:left;} .floatr {float:right;} .inline{display:inline;}
.fontbold{font-weight:bold;}  .fontwhite {color:#ffffff !important;} .fontblack {color:#333333 !important;} .fontgreen {color:#1ABE07 !important;} .fontblue {color:#0198D1 !important;} .fontgrey {color:#9d9d9d !important;} .fontred {color:#A30004 !important;}

/* Slider Style */

.slider_outer{margin: 10px; border:1px solid rgb(253,197,26); padding:5px; padding-top: 10px; background: rgb(255,251,184);}
.slider_gutter {float: left;width: 100%;display: block;position: relative; }
.slider_gutter_item{position: relative;	float: left; left: 100%;}
#slider_minmax_gutter_l, .slider_gutter_l{width: 10px;margin-left:-100%; height:20px;background:url(../img/slider/slider_l.gif) no-repeat; }
#slider_minmax_gutter_m{width: 360px;margin-left:-370px;	height:20px; background:url(../img/slider/slider_rptr.gif) repeat-x;}
#slider_minmax_gutter_r,.slider_gutter_r{width: 10px;margin-left:-15px;height:20px; 	background:url(../img/slider/slider_r.gif) no-repeat; border:1px }
#minmax_slider{ width:380px; margin:0px 10px;}

.slider_gutter{width:150px; margin:10px 0px 0px 0px; }
.slider_gutter_m{width:140px;margin-left:-150px;	height:20px; background:url(../img/slider/slider_rptr.gif) repeat-x;}

/*.slider_gutter_bkg{ position: absolute; background:url(../images/bkg_slider.gif) repeat-x; height:8px; margin:6px 0px 0px -10px; width:374px; clip:rect(0, 20px, 0, 20px)}
*/
.knob {	position: absolute;	height: 20px;width: 20px;background: url(../img/slider/slider_knob.gif) no-repeat;cursor: pointer;}

/* For Clip */

#slider_bkg_img{position: absolute; height:8px; margin:6px 0px 0px -10px; width:374px;}
#slider_bkg_img_1{position: absolute; height:8px; margin:6px 0px 0px 0px; width:200px;}



/* for Slider C */
.slide_container .slider {float:left; display: block;position: relative;}
.slide_container #slider_C{width:270px; margin:0px 0px 0px 10px; border:0px solid red; }
.slide_container  .slider_gutter_C{width:250px;margin-left:-260px;	height:20px; background:url(../img/slider/slider_rptr.gif) repeat-x;}
.slide_container  #slider_bkg_img_C{position: absolute; height:8px; margin:6px 0px 0px 0px; width:430px;}
.slide_container  .slider_gutter_r{width: 10px;margin-left:-10px;height:20px; 	background:url(../img/slider/slider_r.gif) no-repeat; border:1px }

/*  Percentage bar   */
img.percentage_bar {
 background: white url(../img/perc_bar_bg.png) top left no-repeat;
 padding: 0;
 margin: 5px 0 0 0;
 background-position: 1px 0;
}

a.grey_index {COLOR: rgb(128,102,121); TEXT-DECORATION: none; BACKGROUND: none;}
a.grey_index:hover {COLOR: rgb(128,102,121); TEXT-DECORATION: underline; BACKGROUND: none;}