@charset "UTF-8";
/*--------------------------------------------------------
[Master Stylesheet] 

Project:			Future Hosting
Version:			1.0
Last Modified:		03/30/10 [created]
Primary Use:		Future Hosting Website

==========================================================
Table of Contents
==========================================================

1. Imported CSS
2. Body and Misc


--------------------------------------------------------*/

/*========================================================
1.0 - IMPORTED CSS
=========================================================*/

@import "reset.css";
@import "rotator.css";

/*========================================================
2.0 - BODY AND MISC
=========================================================*/

body {
	background: #d9d9d9 url(../images/background.jpg) repeat-x;
	font-family: Helvetica;
	font-size: 12px;
}
a {
	text-decoration:none;
}
a:hover {
	text-decoration:underline;
}
h1 {
	font-size:19px;
	font-weight:normal;
	color:#982116;
}

h2 {
	font-size:18px;
	font-weight:normal;
	color:#202229;
        padding: 15px 0px 5px 0px;
}

h3 {
	font-size:18px;
	font-weight:normal;
	color:#982116;
        padding: 25px 0px 5px 0px;
}

h5 {
	font-size:14px;
	font-weight:normal;
	color:#202229;
        padding: 15px 0px 5px 0px;
}


h4 {
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:13px;
	font-style:italic;
	color:#202229;
	font-weight:normal;
	padding-top:5px;
}
p {
 font-size:14px;
 line-height: 19px;
 color:#666666;
 padding: 10px 0px 10px 0px;
}

.bold {
	font-weight:bold;
}
.clear {
	clear:both;
}
.left {
	float: left;
}
.wrap {
	width: 100%;
	background: #fff url(../images/background_alt.png) repeat-x 50% 0;
}
.container, .footer {
	width:960px;
	margin-left:auto;
	margin-right:auto;
}
.content {
	float: left;
	width: 600px;
	padding: 0 112px 0 0;
	background-color: #fff;
}
.sidebar {
	float: right;
	width: 248px; height: 575px;
	background: url(../images/sidebar_bg.png) no-repeat top left;
}
.footer {
	font-size: 11px;
	padding: 24px 0 20px 0;
}
.footer-nav li {
	display: inline;
	margin: 0 5px 0 0; padding: 0 8px 0 0;
	border-right: 1px solid #3d414d;
}
.footer-nav li a {
	color: #3d414d;
}
.copyright {
	line-height: 1.7;
	color: #858585;
	margin: 28px 0 0 0;
}
.logo {
	padding-top:5px;
	float:left;
}
.quick-links {
	float:right;
	width:440px;
	padding-top:25px;
}
.quick-links ul li {
	display:block;
	float:left;
}
.quick-links ul li a {
	font-size:12px;
	color:#B4B4B4;
	padding-left:7px;
	padding-right:7px;
	padding-top:0px;
	padding-bottom:0px;
	border-right:1px solid #b4b4b4;
}
.navigation {
	float:right;
	width:1000px;
	display:inline;
	padding-top:3px;
	line-height:36px;
	font-family:Verdana, Geneva, sans-serif;
}



.navigation ul li {
	display: inline;
}
.navigation ul li a {
	font-size:13px;
	color:#fff;
	padding-left:12px;
	padding-right:12px;
	display:block;
	float:left;
	line-height:36px;
}
.navigation ul li a:hover {
	background-image:url(../images/nav-hover.jpg);
	background-repeat:repeat-x;
	text-decoration:none;
}
.navigation ul li.current_page_item a {
	background-image:url(../images/nav-hover.jpg);
	background-repeat:repeat-x;
	text-decoration:none;
}
.middle-section {
	background-color:#D9D9D9;
	padding-top:20px;
	padding-bottom:20px;
}
.middle-inside {
	width:960px;
	margin-left:auto;
	margin-right:auto;
}
.service {
	width:306px;
	float:left;
	display:inline;
	margin-right:30px;
}
.podsible {
	width:255px;
	float:left;
}
.cpanel-vps {
	background:url(../images/control-panel-vps.jpg) no-repeat;
	line-height:80px;
	padding-left:13px;
	margin-bottom:20px;
	margin-top:15px;
	width: 306px;
	height: 79px;
}
.cpanel-vps a {
	font-size:15px;
	color:#858585;
}
.cpanel-vps a:hover {
	text-decoration:none;
	color:#333D43;
}
.non-control {
	background:url(../images/non-control-panel-vps.jpg) no-repeat;
	line-height:80px;
	padding-left:13px;
	width: 306px;
	height: 79px;
}
.non-control a {
	font-size:15px;
	color:#858585;
}
.non-control a:hover {
	text-decoration:none;
	color:#333D43;
}
.single-core {
	background:url(../images/single-proc.jpg) no-repeat;
	line-height:80px;
	padding-left:13px;
	margin-bottom:20px;
	margin-top:15px;
	width: 306px;
	height: 79px;
}
.single-core a {
	font-size:15px;
	color:#858585;
}
.single-core a:hover {
	text-decoration:none;
	color:#333D43;
}
.dual-core {
	background:url(../images/dual-proc.jpg) no-repeat;
	line-height:80px;
	padding-left:13px;
	width: 306px;
	height: 79px;
}
.dual-core a {
	font-size:15px;
	color:#858585;
}
.dual-core a:hover {
	text-decoration:none;
	color:#333D43;
}
.pr {
	background-color:#F2F4F3;
}
.pr-inside {
	padding-top:10px;
	padding-bottom:10px;
	width:960px;
	margin-left:auto;
	margin-right:auto;
}
.twitter {
	border-right:1px dotted #ccc;
	width:226px;
	float:left;
}
.blog {
	width:434px;
	float:left;
	border-right:1px dotted #ccc;
	padding-left:15px;
}
.latest-twitter {
	background:url(../images/twitter-icon.jpg) no-repeat left;
	font-size:13px;
	color:#84878B;
	padding-left:60px;
	line-height:40px;
}
.the-tweet {
	font-size:11px;
	color:#666;
	line-height:19px;
	padding-top:20px;
	width: 202px;
}
.the-tweet a {
	font-weight:bold;
	color:#666;
}
.partners {
	width:247px;
	float:left;
	padding-left:15px;
}
.social {
	padding-top:25px;
}
.bottom-title {
	font-size:13px;
	color:#84878B;
	line-height:40px;
}

/**/
.sidebar ul {
	margin: 17px 0 13px 0; padding: 0 0 13px 0;
	background: url(../images/sidebar-ul.png) no-repeat bottom center;
}
.sidebar ul a {
	color: #4a4c55;
	padding: 13px 30px;
	height: 12px;
	display: block;
}
.sidebar ul a:hover {
	color: #a42618;
	text-decoration: none;
}
.sidebar ul a.current {
	color: #a42618;
	text-decoration: none;
	background-color: #fff;
	font-weight:bold;
}
.sidebar ul li.current_page_item a {
	color: #a42618;
	text-decoration: none;
	background-color: #fff;
	font-weight:bold;
}
.sidebar img { margin: 0 0 8px 29px; }
.leading {
	padding: 17px 0;
	background-color: #d9d9d9;
}
.leading h3 {
	font-size: 19px;
	font-weight: normal;
	color: #982116;
	padding: 10px 0 0 0;}
.leading h1 {
	color: #252830;
	font-size: 24px;
	font-weight:normal;
}
.leading img { float: right; }
.intro {
	font-size: 14px;
	line-height: 1.4;
	padding: 27px 0 10px 0;
	width: 600px;
}
.future-engineer-block {
	float: left;
	line-height: 1.4;
	width: 251px;
	padding: 0 55px 0 0; 
margin: 20px 0 0px 0;
	background: url(../images/dotted-div.png) repeat-y top right;
}
.future-protect-block {
	float: right;
	width: 251px;
	line-height: 1.4;
margin-top: 20px;
}
.future-engineer-block img, .future-protect-block img {
	float: left;
	display: block;
	margin: 0 10px 0 0;
}
.future-engineer-block h5, .future-protect-block h5 {
	font-size: 13px;
 	color: #902e29;
}
.future-engineer-block p, .future-protect-block p { font-size: 12px; }
.table-tab {
	text-transform: uppercase;
	color: #fff; font-size: 10px;
	width: 267px; height: 10px;
    margin-top: 30px;
	padding: 6px 0 0 20px;
	background: url(../images/table-tab.jpg) no-repeat;
}
.servers {
	font-size: 11px;
	width: 588px;
	margin: 0 0 15px 0; padding: 0;
	border: 7px solid #a22517;
	display: block;
	overflow: hidden;
}
.servers td {
	text-align: center;
	background: url(../images/table-div.png) repeat-y top right;
	font-weight: normal;
	color:#666;
	font-size:11px;
}
.servers td a {
	font-size:11px;
	font-weight: bold;
	color:#A22517;
}
.td {
	font-size: 15px;
	text-align: left !important;
	padding: 0 0 0 17px !important;
}
.tl { background: none !important; }
.tt td { padding: 8px 0 7px 0; }
.tb td { padding: 2px 0; }
.even td, .odd td { padding: 9px 0; }
.odd td { background-color: #f0f0f0 !important; }
.last {
	margin: 0;
	border: none !important;
}
div.list1 ul li {
	padding: 8px 0 0 0;
	color:#31333E;
	font-size:12px;
	font-weight:700;
}
.post_brd {
	border:5px solid #ccc;
	margin-top:20px;
	margin-bottom:20px;
	padding:15px;
}
.TabbedPanels {
	margin: 0px;
	padding: 0px;
	float: left;
	clear: none;
	width: 110%; /* IE Hack to force proper layout when preceded by a paragraph. (hasLayout Bug)*/
}

/* This is the selector for the TabGroup. The TabGroup container houses
 * all of the tab buttons for each tabbed panel in the widget. This container
 * does not contribute anything visually to the look of the widget for our
 * default style.
 *
 * The name of the class ("TabbedPanelsTabGroup") used in this selector is not
 * necessary to make the widget function. You can use any class name you
 * want to style the TabGroup container.
 */
.TabbedPanelsTabGroup {
	margin: 0px;
	padding: 0px;
}

/* This is the selector for the TabbedPanelsTab. This container houses
 * the title for the panel. This is also the tab "button" that the user clicks
 * on to activate the corresponding content panel so that it appears on top
 * of the other tabbed panels contained in the widget.
 *
 * For our default style, each tab is positioned relatively 1 pixel down from
 * where it wold normally render. This allows each tab to overlap the content
 * panel that renders below it. Each tab is rendered with a 1 pixel bottom
 * border that has a color that matches the top border of the current content
 * panel. This gives the appearance that the tab is being drawn behind the
 * content panel.
 *
 * The name of the class ("TabbedPanelsTab") used in this selector is not
 * necessary to make the widget function. You can use any class name you want
 * to style this tab container.
 */
.TabbedPanelsTab {
	position: relative;
	top: 1px;
	float: left;
	padding: 4px 10px;
	margin: 0px 1px 0px 0px;
	font: bold 0.9em sans-serif;
	background-color: #DDD;
	list-style: none;
	border-left: solid 1px #CCC;
	border-bottom: solid 1px #999;
	border-top: solid 1px #999;
	border-right: solid 1px #999;
	-moz-user-select: none;
	-khtml-user-select: none;
	cursor: pointer;
}

/* This selector is an example of how to change the appearnce of a tab button
 * container as the mouse enters it. The class "TabbedPanelsTabHover" is
 * programatically added and removed from the tab element as the mouse enters
 * and exits the container.
 */
.TabbedPanelsTabHover {
	background-color: #CCC;
}

/* This selector is an example of how to change the appearance of a tab button
 * container after the user has clicked on it to activate a content panel.
 * The class "TabbedPanelsTabSelected" is programatically added and removed
 * from the tab element as the user clicks on the tab button containers in
 * the widget.
 *
 * As mentioned above, for our default style, tab buttons are positioned
 * 1 pixel down from where it would normally render. When the tab button is
 * selected, we change its bottom border to match the background color of the
 * content panel so that it looks like the tab is part of the content panel.
 */
.TabbedPanelsTabSelected {
	background-color: #EEE;
	border-bottom: 1px solid #EEE;
}

/* This selector is an example of how to make a link inside of a tab button
 * look like normal text. Users may want to use links inside of a tab button
 * so that when it gets focus, the text *inside* the tab button gets a focus
 * ring around it, instead of the focus ring around the entire tab.
 */
.TabbedPanelsTab a {
	color: black;
	text-decoration: none;
}

/* This is the selector for the ContentGroup. The ContentGroup container houses
 * all of the content panels for each tabbed panel in the widget. For our
 * default style, this container provides the background color and borders that
 * surround the content.
 *
 * The name of the class ("TabbedPanelsContentGroup") used in this selector is
 * not necessary to make the widget function. You can use any class name you
 * want to style the ContentGroup container.
 */
.TabbedPanelsContentGroup {
	clear: both;
	border-left: solid 1px #CCC;
	border-bottom: solid 1px #CCC;
	border-top: solid 1px #999;
	border-right: solid 1px #999;
	background-color: #EEE;
}

/* This is the selector for the Content panel. The Content panel holds the
 * content for a single tabbed panel. For our default style, this container
 * provides some padding, so that the content is not pushed up against the
 * widget borders.
 *
 * The name of the class ("TabbedPanelsContent") used in this selector is
 * not necessary to make the widget function. You can use any class name you
 * want to style the Content container.
 */
.TabbedPanelsContent {
	padding: 4px;
}

/* This selector is an example of how to change the appearnce of the currently
 * active container panel. The class "TabbedPanelsContentVisible" is
 * programatically added and removed from the content element as the panel
 * is activated/deactivated.
 */
.TabbedPanelsContentVisible {
}

/* Vertical Tabbed Panels
 *
 * The following rules override some of the default rules above so that the
 * TabbedPanels widget renders with its tab buttons along the left side of
 * the currently active content panel.
 *
 * With the rules defined below, the only change that will have to be made
 * to switch a horizontal tabbed panels widget to a vertical tabbed panels
 * widget, is to use the "VTabbedPanels" class on the top-level widget
 * container element, instead of "TabbedPanels".
 */

/* This selector floats the TabGroup so that the tab buttons it contains
 * render to the left of the active content panel. A border is drawn around
 * the group container to make it look like a list container.
 */
.VTabbedPanels .TabbedPanelsTabGroup {
	float: left;
	width: 10em;
	height: 20em;
	background-color: #EEE;
	position: relative;
	border-top: solid 1px #999;
	border-right: solid 1px #999;
	border-left: solid 1px #CCC;
	border-bottom: solid 1px #CCC;
}

/* This selector disables the float property that is placed on each tab button
 * by the default TabbedPanelsTab selector rule above. It also draws a bottom
 * border for the tab. The tab button will get its left and right border from
 * the TabGroup, and its top border from the TabGroup or tab button above it.
 */
.VTabbedPanels .TabbedPanelsTab {
	float: none;
	margin: 0px;
	border-top: none;
	border-left: none;
	border-right: none;
}

/* This selector disables the float property that is placed on each tab button
 * by the default TabbedPanelsTab selector rule above. It also draws a bottom
 * border for the tab. The tab button will get its left and right border from
 * the TabGroup, and its top border from the TabGroup or tab button above it.
 */
.VTabbedPanels .TabbedPanelsTabSelected {
	background-color: #EEE;
	border-bottom: solid 1px #999;
}

/* This selector floats the content panels for the widget so that they
 * render to the right of the tabbed buttons.
 */
.VTabbedPanels .TabbedPanelsContentGroup {
	clear: none;
	float: left;
	padding: 0px;
	width: 30em;
	height: 20em;
}
/* SpryCollapsiblePanel.css - Revision: Spry Preview Release 1.4 */

/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */

/* This is the selector for the main CollapsiblePanel container. For our
 * default style, the CollapsiblePanel is responsible for drawing the borders
 * around the widget.
 *
 * If you want to constrain the width of the CollapsiblePanel widget, set a width on
 * the CollapsiblePanel container. By default, our CollapsiblePanel expands horizontally to fill
 * up available space.
 *
 * The name of the class ("CollapsiblePanel") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style the
 * CollapsiblePanel container.
 */
.CollapsiblePanel {
	margin: 0px;
	padding: 0px;
}

/* This is the selector for the CollapsiblePanelTab. This container houses
 * the title for the panel. This is also the container that the user clicks
 * on to open or close the panel.
 *
 * The name of the class ("CollapsiblePanelTab") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style an
 * CollapsiblePanel panel tab container.
 */
.CollapsiblePanelTab {
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	font-weight:bold;
	color:#A92A19;
	margin: 0px;
	padding: 2px;
	cursor: pointer;
	-moz-user-select: none;
	-khtml-user-select: none;
	text-decoration: underline;
}

/* This is the selector for a CollapsiblePanel's Content area. It's important to note that
 * you should never put any padding on the content area element if you plan to
 * use the CollapsiblePanel's open/close animations. Placing a non-zero padding on the content
 * element can cause the CollapsiblePanel to abruptly grow in height while the panels animate.
 *
 * The name of the class ("CollapsiblePanelContent") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style a
 * CollapsiblePanel content container.
 */
.CollapsiblePanelContent {
	margin: 0px;
	padding: 0px;
}


/* An anchor tag can be used inside of a CollapsiblePanelTab so that the
 * keyboard focus ring appears *inside* the tab instead of around the tab.
 * This is an example of how to make the text within the anchor tag look
 * like non-anchor (normal) text.
 */
.CollapsiblePanelTab a {
	text-decoration: none;
}

/* This is an example of how to change the appearance of the panel tab that is
 * currently open. The class "CollapsiblePanelOpen" is programatically added and removed
 * from panels as the user clicks on the tabs within the CollapsiblePanel.
 */
.CollapsiblePanelOpen .CollapsiblePanelTab {
	
}

/* This is an example of how to change the appearance of the panel tab as the
 * mouse hovers over it. The class "CollapsiblePanelTabHover" is programatically added
 * and removed from panel tab containers as the mouse enters and exits the tab container.
 */
.CollapsiblePanelTabHover,  .CollapsiblePanelOpen .CollapsiblePanelTabHover {
	
}

/* This is an example of how to change the appearance of all the panel tabs when the
 * CollapsiblePanel has focus. The "CollapsiblePanelFocused" class is programatically added and removed
 * whenever the CollapsiblePanel gains or loses keyboard focus.
 */
.CollapsiblePanelFocused .CollapsiblePanelTab {
	
}
.list2 {
float: left;
display: inline;
margin-left: 30px;
width: 350px;
margin-top:30px;
}
.server_doc_left {
	width:190px;
	float:left;
	padding-bottom:25px;
	margin-top:30px;
}
.list2 li {
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	font-weight:bold;
	color:#FFFFFF;
	padding-top:8px;
	padding-bottom:8px;
	margin-top:0px;
	width:500px;
}
.blog ul li {
	margin-bottom:25px;
}
.blog li a {
	font-size:12px;
	font-weight: bold;
	color:#333641;
}
.monitor_table tr td {
	font-family:Tahoma, Arial, Helvetica, sans-serif;
	font-size:14px;
	color:#333333;
	padding-top: 2px;
	padding-bottom: 2px;
}
.monitor_table #head{
	font-size:12px;
	font-weight:bold;
	background-color:#FFFFFF;
	color:#333333;
}
.description{
	background-color:#FFFFFF;
}
.statusup{
	font-size:14px;
	font-weight:bold;
	color:#127A1B;
}
.monitor_table #heading{
	font-size:12px;
	font-weight:bold;
	background-color:#B92D36;
	color:#FFFFFF;
}
.tabbers {
	padding-top:30px;
}
.the-title a {
	font-size:15px;
	font-weight: bold;
	color:#982116;
}
.the-time {
	font-family:Georgia;
	font-size:11px;
	color:#333;
	font-style: italic;
	padding-top:5px;
}
.tags a {
	color:#982116;
	padding-top:25px;
	padding-bottom:10px;
}
.more {
	font-size:12px;
	font-style: italic;
	color:#666;
}
p a {
	color:#666;
	font-weight: bold;
}
.sidebar2 ul {
	margin-left:20px;
}