/*
 * Runaroo stylesheet
 * (c) 2010
 *
 * http://blendfresh.net
* */

@font-face {
    font-family: 'Deja Vu Sans';
    src:url(../fonts/DejaVuSans.eot);
    src:local('Deja Vu Sans'), url(../fonts/DejaVuSans.ttf) format('truetype');
}

@font-face {
    font-family: 'Candela';
    src:url(../fonts/CandelaBook.eot);
    src:local('Deja Vu Sans'), url(../fonts/CandelaBook.ttf) format('truetype');
}

@font-face {
    font-family: 'Puritan Regular';
    src:url(../fonts/Puritan_Regular.eot);
    src:local('Puritan Regular'), url(../fonts/Puritan_Regular.ttf) format('truetype');
}

@font-face {
    font-family: 'Colaborate';
    src:url(../fonts/ColabReg.eot);
    src:local('Puritan Regular'), url(../fonts/ColabReg.ttf) format('truetype');
}



html				{font-family:'Deja Vu Sans', Sans, Arial; font-size:12px}

h1				{font-family:'Candela', Sans, Verdana; font-size:33px; color:#E3E148}
h1#slogan			{padding-bottom:10px; width:100%}

h2				{font-family:'Colaborate', Sans, Verdana; font-size:19px; color:#1B5C81; margin:30px 0 10px 0}

h3				{font-family:'Candela', Sans, Verdana; font-size:40px; color:#1B5C81}
h4				{color:#106F10; font-size:16px}
h5				{font-size:26px; font-family:Arial, Helvetica, Sans, Verdana; color:#666; font-weight:bold}

h6				{font-size:25px; font-family:'Colaborate', Sans, Verdana; color:#811519}

a           {color:inherit; text-decoration:none}
a.feature:hover   {text-decoration:underline}

.container			{width:900px; margin:0 auto; clear:both}
.clear				{clear:both}
.bold				{font-weight:bold}

.container > p				{line-height:20px}

#header				{padding-bottom:10px; color:#F2F2F2; clear:both; background:#196C9B url(../images/headingbg.png) top center no-repeat; min-height:55px; border-bottom:2px solid #D3D3D3}
#header > .container		{padding-top:25px}
#header a#logo			{float:left; display:block; width:119px; height:20px; background:url(../images/logo.png) center}
#header ul#nav			{font-size:13px; float:right}
#header ul#nav li		{float:left; height:15px}
#header ul#nav li a		{text-decoration:none; color:#F2F2F2; padding:5px; margin-left:20px}
#header ul#nav li a#current,
#header ul#nav li a:hover	{background:#1B5C81}

#intro				{}
#intro #left			{padding-top:30px; width:450px; float:left; font-size:16px; line-height:40px}
#intro #right			{float:right; width:449px; padding:0}
#intro #right #panel		{padding:10px; margin:20px 0; width:429px; height:118px; background:url(../images/intropanel.png)}
#intro #right #panel p#heading	{font-family:'Puritan Regular', Sans; font-weight:bold; font-size:24px; color:#666}

/* panel form */
#panel form			{}
#panel form #clubname		{width:97%; margin:10px 0; padding:5px; height:30px; border:1px solid #E0E0E0; font-size:24px; color:#E0E0E0}
#panel form #build		{border:none; cursor:pointer; width:200px; height:35px; font-size:16px; color:#F2F2F2; background:url(../images/buildbutton.png) no-repeat}
#panel a#pricing		{padding:5px; text-decoration:none; position:relative; top:-30px; float:right; color:#666; font-size:13px;}
#panel a#pricing:hover		{background:#E0E0E0}

#content			{margin-top:20px}

/* feature styles */
.feature-row			{margin-bottom:10px}

.feature-column			{width:260px; padding:20px; float:left}
.feature-column img		{float:left; margin-right:10px}
.feature-column h3		{font-size:16px; color:#811519; margin:15px 0 0 0}
.feature-column p		{display:block; margin-top:20px; font-size:12px; line-height:18px}


/* pricing graph */

#graphpanel			{margin:20px 0; height:431px; background:url(../images/pricing_panel.png)}
#graphpanel #gr #graph		{margin:20px; float:left}

#beta				{float:right; width:275px; margin-top:70px; padding-right:5px}
#beta p				{color:#811519; margin:10px 0; line-height:20px}
#beta #signup			{display:block; width:250px; height:50px; color:#FFF; font-size:25px; background:url(../images/pricing_go.png); text-decoration:none; line-height:50px; text-align:center; margin-top:10px}

#benefits			{padding-left:50px; clear:both; width:100%}
#benefits ul			{float:left; margin:10px 20px; list-style-image:url(../images/sizcon/accept.png)}

#bytheway			{list-style-image:url(../images/sizcon/arrow_right_blue_round.png)}
#bytheway li			{margin:20px 0 0 30px}

ul#differences			{list-style-image:url(../images/sizcon/arrow_right_blue_round.png); margin:20px}
ul#differences li		{margin-bottom:10px; margin-left:20px;}

#footer				{border-top:1px solid #E0E0E0; padding:10px 0; margin-bottom:20px; margin-top:50px; color:#1B5C81}
#footer #copyright		{float:left}
#footer #links			{float:right}
#footer #links a		{color:#1B5C81}