/*
Main site shared styles (homepage, interior pages, blog, etc)

This is where we put any styles for anything we've added outside of what got sliced by the 3rd party slicer dudes.
*/

* { margin: 0px; padding: 0px; }

body
{
	font-family: Arial, sans-serif;
	font-size: 13px;
	background: rgb(238,238,238);
}
body.dark
{
	background:#5b5b5b url(/i/v3/body_bg.gif) top repeat-x;
}

a 
{ 
	cursor: pointer; 
	color: #478f8f;
}

a:hover
{
	color: #478f8f;
	text-decoration: underline;
}

input[type="submit"]:hover 
{
	cursor: pointer;
}

.clear
{
	clear: both;
}

#content h2 {
	position: relative;	
	margin-bottom: 25px;
	font-size: 30px;
	font-weight: normal;
	color: #5dcfca;
	font-family: ProximaNova, Arial, sans-serif;
}
#content h2 small {
	position: absolute;
	top: 5px;
	right: 0px;
	font-size: 12px;
}
#content h3 {
	font-size: 18px;
	font-weight: normal;
	margin: 35px 0px 15px 0px;
}
#content h4 {
	font-size: 14px;
	font-weight: bold;
	margin-bottom: 10px;
	padding-top: 5px;
}
#content h4.subSection {
	padding-top: 15px;
	border-bottom: 1px solid #CCCCCC;
}
#content h5 {
	font-size: 12px;
	font-weight: normal;
	margin: 0px;
}

h3 small,
h4 small,
h3 small a,
h4 small a {
	color: #999999;
	font-size: 11px;
	font-weight: normal;
}

#content p {
	margin-bottom: 14px;
}
.form_sec input {	
	width: 150px;
	border: 1px solid #784c22;
	background: #FFFFFF;
}
.form_sec input.btn {
	background: #a3c334;
	font-weight: bold;
	font-size: 11px;
	color: #5a5a5a;
	border: 1px solid #dea303;
	background: url(/i/btn_bg.png) repeat-x;
}

.index h2 {
	border: 0px;
}
.index h3 {	
	margin-bottom: 10px;
	font-size: 18px;
	font-weight: normal;
	font-family: Arial, Helvetica, sans-serif;
	border: 0px;
}

ul.content
{
	margin: 0px 0px 20px 18px;
}
ul.content li
{
	margin-bottom: 3px;
}

.float_right, .alignright {
	float: right;
	margin: 0px 0px 15px 30px;
}
#content ul.spaced {
	margin-bottom: 20px;
}
ul.spaced li {
	margin-bottom:4px;
}

.bordered
{
	border: 1px solid #CCCCCC;
}

.screen
{
	margin-top: 30px;
}


/* --- */

.clear { clear: both; }

/* --- */

#header
{
	position: relative;
	height: 71px;
	text-align: center;
	background: white;
	z-index: 10000;
	border-bottom: 1px solid #c8c8c8;
	box-shadow: 0px 0px 5px rgba(0,0,0,0.25);
}

#header h1 a
{
	display: block;
	width: 200px;
	height: 71px;
	background: url(/i/v3/pocket_logo.png) left center no-repeat;
	text-indent: -789em;
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-resolution: 144dpi) {
	#header h1 a 
	{
		background-image: url(/i/v3/pocket_logo@2x.png);
		background-size: 189px 47px;
	}
}

#header #nav
{
	list-style: none;
	position: absolute;
	top: 0px;
	right: 0px;
}

#header #nav li
{
	float: left;
}
#header #nav li a
{
	display: block;
	line-height: 67px;
	border-top: 4px solid white;
	height: 67px;
	padding: 0px 15px;
	font-size: 12px;
	color: #777777;
	font-weight: bold;
	font-family: HelveticaNeue, Helvetica, Arial, sans-serif;
	text-decoration: none;
}

#header #nav li a:hover,
#header #nav li.selected
{
	color: #5dcfca;
	border-color: #5dcfca;
	text-decoration: none;
}

.login
{
	margin-left: 16px;
}

.login span a 
{ 
	position: relative;
	top: 17px;
	width:67px; 
	height:29px !important; 
	line-height: 29px !important;
	padding: 0px !important;
	float:left;
	text-align:center; 
	font-weight: normal;
	background:url(/i/v3/login_btn.png) 0 0 no-repeat; 
	font:12px/29px 'ProximaNovaBold', arial; 
	color:#2e2e2e !important; 
	text-transform:uppercase; 
}
.login span a:hover 
{ 
	border-color: white !important;
	color:#2e2e2e !important;
	background-position:0 -29px; 
}

/* ------------------ Old base styles from RIL/v2 --------------------------- */

.wrapper
{
	position: relative;
	width: 950px;
	margin: 0px auto 0px auto;
	text-align: left;
}

.index footer .wrapper 
{
	width: auto;
}

/* --- */

#content,
.content_section
{
	/* margin-top and bottom set in rule below */
	margin-left: auto;
	margin-right: auto;
	padding: 32px 38px 50px 38px;
	background: #FFFFFF;
	border: 1px solid #cacaca;
	border-radius: 10px;
	box-shadow: 0px 1px 0px 0px white;
}
#content
{
	min-height: 330px;
}
#content,
.content_section:first-child
{
	margin-top: 37px;
}
#content,
.content_section:last-child
{
	margin-bottom: 40px;
}
.content_section
{
	margin-top: 0px;
	margin-bottom: 13px;
}
#content.wrapper
{
	width: 870px;
}

.split_column .content_section
{
	float: left;
	margin-top: 37px;
	margin-right: 20px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.split_column .content_section:last-child
{
	margin-right: 0px;
}

.sidebar_content #sidebar
{
	float: left;
	width: 205px;
	padding-top: 39px;
}

.sidebar_content #content_wrapper,
.sidebar_content #content
{
	float: left;
}
.sidebar_content #content,
.sidebar_content .content_section
{
	width: 665px;
}

/* --- */

#sidebar h3
{
	margin-bottom: 30px;
}
#sidebar h3,
#sidebar h3 a
{
	color: black;
	text-shadow: 0px 1px white;
	text-transform: uppercase;
	font-family: ProximaNova, Arial, sans-serif;
	font-size: 18px;
	font-weight: bold;
	text-decoration: none;	
}

#sidebar a:hover
{
	text-decoration: underline;
	color: #478f8f;
}

#sidebar h5
{
	margin-bottom: 9px;
	color: #888888;
	font-weight: bold;
	font-size: 16px;
	color: black;
	text-shadow: 0px 1px white;
	text-transform: uppercase;
	font-family: ProximaNova, Arial, sans-serif;
}
#sidebar ul
{
	list-style: none;
	margin: 0px 0px 57px 0px;
}
#sidebar ul li
{
	margin-bottom: 6px;
}
#sidebar ul li a
{
	color: #666666;
	font-size: 13px;
	text-decoration: none;	
}
#sidebar h5 a 
{
	color: black;
	text-decoration: none;
}

/* --- */

#container footer
{
    border-top: 1px solid #cacaca;
    border-bottom: 1px solid #cacaca;
    background: white;    
}


/*******************footer css starts here****************************/
footer { width:100%; float:left; padding:61px 0;color: #777; }
footer nav { width:auto; float:left; padding-right:10px; }
footer nav ul { width:auto; float:left; list-style:none; }
footer nav ul li { float:left; font: 12px/12px 'Conv_HelveticaNeueLTStd-Bd', Arial, Helvetica, sans-serif; padding-left:30px; }
footer nav ul li a { color:#777777; text-decoration: none; }
footer nav ul li a:hover { text-decoration: none; }
footer nav ul li:first-child { padding-left: 0px; }
footer p { float:left; font:12px/12px 'Conv_HelveticaNeueLTStd-Roman', Arial, Helvetica, sans-serif; position: absolute; opacity: 0.7; top: 40px; right: 0px; font-size:10.5px; }
.index footer p { right: 70px; }
.footer_social_link { float:right; }
.footer_social_link strong { float:left; font:normal 12px/12px 'Conv_HelveticaNeueLTStd-Bd', Arial, Helvetica, sans-serif; padding-right:5px; color:#777;}
.footer_social_link ul { float:left; list-style:none; }
.footer_social_link ul li { float:left; padding-left:15px; }
.footer_social_link ul li a { width:19px; height:18px; float:left; display:inline; margin-top:-4px; position:relative; overflow: hidden; text-indent: -9999px; }
.footer_social_link ul li a.twitter { background:url(/i/v4/footer_socialicons@1x.png) 0 1px no-repeat; width: 22px; height: 21px;}
.footer_social_link ul li a.twitter:hover { background-position: -200px 1px; }
.footer_social_link ul li a.facebook { background:url(/i/v4/footer_socialicons@1x.png) 0 -80px no-repeat; width: 9px; height: 21px; }
.footer_social_link ul li a.facebook:hover { background-position: -200px -80px; }
.footer_social_link ul li a.googleplus { background:url(/i/v4/footer_socialicons@1x.png) 0 -159px no-repeat; width: 22px; height: 21px; }
.footer_social_link ul li a.googleplus:hover { background-position: -200px -159px; }
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-resolution: 144dpi) {
	.footer_social_link ul li a.twitter,
	.footer_social_link ul li a.facebook { background-image: url(/i/v4/footer_socialicons@2x.png); background-size: 240px 400px; }
	.footer_social_link ul li a.googleplus { background-image: url(/i/v4/footer_socialicons@2x.png); background-size: 240px 400px; }
}
/*******************footer css ends here****************************/

/* --- */

.feature_list {
	margin: 0px 0px 21px 15px;
}
.feature_list li {
	margin-bottom: 8px;
}

/* --- */

#content form .row {
	display: block;
	position: relative;
	padding-left: 145px;
	margin-bottom: 7px;
}
#content form label {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 130px;
	text-align: right;
}
*html #content form label { left: -145px; }
#content form input {
	width: 150px;
	margin-right: 10px;
}

/* --- */

.code {
	margin: 0px 0px 10px 0px;
	padding: 10px;
	border: 1px dashed #5A311E;
	background: #F0F0F0;
	color: #333333;
	font-family: "Courier New", Courier, monospace;
}

/* --- */

.update_list {
	position: relative;
	margin: 0px 0px 20px 0px;
	padding: 20px 20px 50px 20px;
	border: 2px dotted #FFD739;
	background: #FFFFCC;
}
#update_list img {
	position: absolute;
	top: 20px;
	right: 10px;
}

.update_list h3 {
	font-size: 22px;
	font-weight: normal;
	margin: 0px;
	border: 0px;
}
.update_list h4 {
	margin: 20px 0px 5px 0px;
	font-size: 18px;
	font-weight: normal;
}
.update_list h5 {
	font-size: 13px;
	font-weight: bold;
	font-style: normal;
}
.update_list ul {
	margin-left: 22px;
}

/* --- */

.screensSimple {
	text-align: center;
}
.screensSimple img {
	margin: 0px 3px 0px 3px;
}

.screens {
	text-align: center;	
}
.screens span {
	float: left;
	display: block;
	width: 256px;
	margin: 0px 9px 0px 9px;
}
.screens cite {
	margin: 5px 0px 15px 0px;
	display: block;
	font-weight: bold;
	font-size: 14px;
	font-style: normal;
}
*html .screens span { margin: 0px 6px 0px 6px; }
 
/* --- */

.float_box {
	float: right;
	margin: 0px 0px 10px 30px;
	width:350px;
	padding:13px;
	border: 1px dotted #CCCCCC; 
	background: #FCF493 url(/i/orange_grad.png) bottom repeat-x; 
}

.let
{
	font-weight: bold;
}
.let:hover
{
	text-decoration: none;
}
