/*
Theme Name: Social Media Mate
Theme URI: http://www.socialmediamate.com/
Description: Another fine template built for WordPress by <a href="http://socialmediamate.com">Social Media Mate</a>.
Version: 2.9.2
Author: Social Media Mate
Author URI: http://socialmediamate.com/

Tags: Admin Panel, Options Panel, Fixed Width, CSS Grid Theme, Meyers RESET, Multi Widget, Custom Navigation, Commercial
	This theme was designed - developed using the Rapid Template Design Kit.
	License: This theme is a custom commercial product for use by "" http://www.childerssothebysrealty.com/license/

#### HOW THIS CSS FILE IS STRUCTURED ####
@ This CSS File is based on the guides project at http://www.jaredritchey.com/xhtml-css-standards/ "See Rules of Specificity and Guides"
@ The CSS is organized by .selector, #selector{position, size, margin, padding, background, alignment, color, font, all else}
@ For WordPress, the theme hierarchy was followed for styling individual template files as you can see they are identified below.
@	1) Basic Element Typography Styling
@ 	2) Image Styling
@	3) Template Layout Styling
@ 		3a) Area Specific Typography
@ 	4) Navigation Elements
@ 	5) WordPress Hierarchy
@ 		5a) Area Specific Typography
#### Compressed CSS Structure Guide ####
*/
body{font-family:Verdana, Geneva, sans-serif; background: url(images/tile.jpg); color:#333; font-size:62.5%/1.3;}
/*html>body selectorname{}*/

/* (1)=-=-=-[Basic Element Typography]-=-=-=*/
table, address, fieldset{}
p, dl, hr, h1, h2, h3, h4, h5, h6, ol, ul, pre{}
	a{text-decoration: none; font-size:12px; color:#2c4b6a;}
	a:hover{text-decoration: none;}
	a:visited{}
	p{font-size:12px; text-align:justify; color:#444; line-height:150%; margin:10px 0px;}
	p.blockstyle{margin: 18px 60px 18px 60px; line-height:20px; text-align:justify; font-size:12px;}
	p.notice{}
	p.emphasis{}
	p,ul,ol{}
	hr {border:0 #ccc solid; border-top-width:1px; clear:both; height:0}	
	strong{font-weight:700;}

/*--// [List Elements] */
li ul,li ol{margin: 0;}
ul{list-style-type:square; font-size:12px;}
ol{list-style: outside decimal;}
li{margin-bottom:8px;}
dl{}
dd{padding-left: 1.5em;}
p.h4{margin: 0px 60px 24px 60px; line-height:20px; text-align:justify; font-size:19px;}

/*--// [Header Tag Elements] */
h1{font-size:22px}
h2{font-size:22px}
h3{font-size:18px}
h4{font-size:14px}
h5{font-size:12px}
h6{font-size:12px}

blockquote{padding: 0 1.5em;}
pre{}
address,cite,em,i,caption,dfn,var{font-style: italic;}
tt,code,kbd,samp{font-size: 1em;}
cite{}
abbr,acronym{border-bottom: 1px dotted; cursor: help;}
del{text-decoration: line-through;}
ins{text-decoration: overline;}
sub{font-size: .834em; line-height: 1em; vertical-align: sub;}
sup{font-size: .834em; line-height: 1em; vertical-align: super;}
	
/*--// [XHTML Table Elements] */
table{border-collapse: collapse; border-spacing: 0;}
caption{text-align: left;}
thead{}
th, td{padding: .25em .5em;}
tbody td, tbody th{}
tfoot{}

/*--// [Forms and Fieldset Elements] */
fieldset{clear: both;}
fieldset legend{padding: 0 0 1.5em; font-size: 1em;}
legend{padding: 0 0 1.286em; font-size: 1.167em; font-weight: 700;}
form .field, form .button{clear: both; margin: 0 0 1.5em;}
form .field label{display: block;}
form ul.fields li{list-style-type: none; margin: 0;}
form ul.inline li, form ul.inline label{display: inline;}
form ul.inline li{padding: 0 .75em 0 0;}
label, button, input.submit, input.image{cursor: pointer;}
input.radio, input.checkbox{vertical-align: top;}
textarea{overflow: auto;}
input.text, input.password, textarea, select{margin: 0; font: 1em/1.3 Helvetica, Arial, "Liberation Sans", "Bitstream Vera Sans", sans-serif; vertical-align: baseline;}
input.text, input.password, textarea{border: 1px solid #444; border-bottom-color: #666; border-right-color: #666; padding: 2px;}

/* (2)=-=-=-[Image Styles - Used in TinyMCE Editor WordPress]-=-=-=*/
img.aligncenter{display:block; margin-left:auto; margin-right:auto; border:1px solid #ccc;}
img.alignright{padding:0px; border:1px solid #ccc; float:right; margin:0px 0px 12px 12px;}
img.alignleft{padding:4px; border:1px solid #ccc; float:left; margin:0px 6px 6px 0px;}
img, img a{border:none;}
img.noborder{border:none;}
div.thecaptions{margin-top:50px;}
div.wp-caption{padding:0px; display:inline-block; float:left; margin-right:20px; margin-bottom:10px;}
p.wp-caption-text{margin:5px 0 0 0; line-height:14px; font-size:11px; font-style:italic; color:#666; text-align:left;}

/* Used on the portfolio page */
.portfolio{padding:5px; margin-bottom:12px; border-bottom:1px solid #ccc; min-height:150px; height:auto !important; height:150px;}
h2.portfoliotitle{margin:0px !Important; padding:0px; font-size:18px; color:#444;}
div.pagednav{height:26px; width:200px; border:1px solid #6db0d1; background:#4986a5; line-height:26px; padding:5px; text-align:center; font-weight:700;}
div.pagednav a{color:#fff;}

/* (3)=-=-=-[Template Layout]-=-=-=*/
#maxouter{width:100%;}
.page{width:960px !Important; margin-left:auto; margin-right:auto;}
.full_width{width: 100%; clear: both; margin:0px;}

/*-=-=-=[Custom Header Layout Styling]=-=-=-*/
#header_area{height:100px; background: url(images/headerback.jpg) top center;}
	#logoarea{position:absolute; top:4px; left:30px; width:260px; height:60px;}

#content_area{position:relative; background: url(images/pageshadow.jpg) top center repeat-y; padding-top:1px;}
	#content{position:relative; width:560px; float:left;}
	#content h1 a{font-size:26px;}
	ul#features{list-style-type:none;}
	ul#features li{padding-left:34px; background: url(http://socialmediamate.com/wp-content/themes/ssm-wp/images/checkmark.jpg) top left no-repeat;}
	ul#features h4{margin:12px 0px 12px 0px; font-weight:700;}

/*-=-=-=[Subheader Styling]=-=-=-*/
.topsection{margin-bottom:8px !Important; border-bottom: 1px dotted #ccc; padding-bottom:5px;}
#productslider{position:relative; width:560px; float:left; height:300px;}
#video{position:relative; width:390px; padding:0px; margin:0px; display:inline; float:right; height:300px; background:url(images/videobezzel.png);}
#video h3{color:#fff; line-height:28px; text-transform:none !Important; margin:0 0 6px 6px; text-indent:8px; font-family: Arial, Helvetica, sans-serif; text-transform:uppercase; font-size:14px; font-weight:700;}
#video .wordtubeit{position:absolute; top:39px; left:6px; width:378px; height:254px;}

/*---------Banner Portion Starts--------------*/
#headerslider{width:540px; height:300px; margin:0 auto; position:relative; overflow:hidden; background: url(images/sliderbackground.jpg) no-repeat;}
#mask-gallery{overflow:hidden;}
#gallery{/* Clear the list style */list-style:none; margin:0 auto; padding:0; z-index:0; /* width = total items multiply with #mask gallery width */width:540px; overflow:hidden}
#gallery li{/* float left,so that the items are arrangged horizontally */float:left}
#matterwrap{/* Set the position */position:absolute; top:0; left:0; z-index:500; /* width should be lesser than #slider width */width:200px; overflow:hidden}
#matter{list-style:none !Important; margin:0; padding:0px; /* Set the position */z-index:10; position:absolute; top:0; left:0; /* Set the style */width:180px; overflow:hidden; color:#444; font:normal 12px/20px Verdana,Arial,Helvetica,sans-serif; padding-left:10px;}
#matter span{display:block; width:180px; text-indent:16px; font-size:11px; background: url(images/bullet_go.gif) left no-repeat;}
#matter h1{color:#21406c; font:bold 13px/20px Verdana,Arial,Helvetica,sans-serif; display:block; margin-top:2px; padding-top:18px; text-align:center; text-transform:uppercase;}
#matter ul{}
#matter ul li{padding:5px 5px 5px 5px; background: none !Important;}
#buttons{position:relative; width:560px; margin:0 auto; padding:0 0 0 0}
#buttons #btn-prev{position:absolute; left:0; top:-300px}
#buttons #btn-next{position:absolute; left:550px; top:-300px}
/*---------Banner Portion Ends--------------*/

/*-=-=-=[Custom Sidebar Styling]=-=-=-*/
	#sidebars{position:relative; width:390px; padding:0px; margin:0px; display:inline; float:right;}
	#sidebars ul{list-style-type:none;}
	#sidebars ul li{text-indent:12px; background: url(images/bullet.gif) left no-repeat;}
	#sidebar_l, #sidebar_r{width:190px;}
		#sidebar_l{float:left;}
		#sidebar_r{float:right;}	
	#sidebar_l h2, #sidebar_r h2{color:#34647c; height:24px !important; line-height:20px; margin:0 0 6px; text-indent:6px; font-family: Arial, Helvetica, sans-serif; text-transform:uppercase; font-size:14px; font-weight:700;}
	#sidebar_l div.widget_box{background:transparent url(images/h3.gif) no-repeat; border:1px solid #e6e5e1; margin-bottom:12px; padding:5px;}
	#sidebar_r div.widget_box{background:transparent url(images/h3.gif) no-repeat; border:1px solid #e6e5e1; margin-bottom:12px; padding:5px;}
	#fmp-jw-widget-2{background: url(images/podcast.jpg) no-repeat !Important; border:none !Important;}
	#fmp-jw-widget-2 h2.widgettitle{color:#fff; padding-top:2px; text-transform:none;}

/*-=-=-=[Custom Footer Layout Styling]=-=-=-*/
#footer_area{height:434px; background: url(images/bottomback.gif) top center no-repeat;}
	#bottomwrap{height:360px; background: url(images/bottomwrap.jpg) repeat-x; font-family:Arial, Helvetica, sans-serif;}
	#bottomwrap h3{font-size:12px; font-weight:700; padding-bottom:10px; text-transform:uppercase; word-spacing:2px; color:#F0F0F0}

#footer{height:74px; background: url(images/footer.jpg) repeat-x;}
	#footerleft{height:50px; width:400px; float:left; color:#f5f5f5; font-family:Arial, Helvetica, sans-serif; font-size:10px; padding-top:1px;}
	#footerleft a{color:#88bbee; text-decoration:none; border-bottom:1px dotted #88bbee;}
	#footerleft a:hover{color:#ccc;}
	#footerright{height:50px; width:400px; float:right; color:#f5f5f5; font-family:Arial, Helvetica, sans-serif; font-size:10px;}
	#footerright ul{padding-top:12px;}
	#footerright ul li{list-style-type:none;}
	#footerright ul li a{text-transform:uppercase; color:#88bbee;}
		p.validation{text-align:left; color:#f5f5f5; }
		p.copyright{text-align:left; color:#f5f5f5;}

div#boxa, div#boxb, div#boxc, div#boxd{height:300px; border:1px solid #6db0d1; background:#579bbd; float:left; margin-top:20px; padding:10px; color:#f5f5f5;}
div#boxa ul, div#boxb ul, div#boxc ul, div#boxd ul{list-style-type:none;}
div#boxa a, div#boxb a, div#boxc a, div#boxd a{color:#88bbee;}
div#boxb, div#boxc, div#boxd{margin-left:22px;}
div#boxa{width:200px;}
div#boxb{width:200px;}
	div#boxb span{display:block; text-transform:uppercase;}
	div#boxb li{display:block; border-bottom: 1px dotted #ccc; line-height:120%;}
	div#boxb li a{display:block; text-align:right; color:#fff; font-size:11px; padding:3px 0px;}

div#boxc{width:200px;}
	div#boxc img {padding:3px; border:1px solid #ccc; margin-bottom:4px;}
	div#boxc a{}
div#boxd{width:200px; line-height:120%;}
div#boxd h4{font-size:18px; text-transform:uppercase; margin:0 0 6px 0;}
div#boxd span{font-size:12px; line-height:120%;}

/*-=-=-=[ ]=-=-=-*/


/*-=-=-=[Home Page Quad Box Styling]=-=-=-*/
#belowcontent{margin:12px 0px 0px 0px;}
#homepageleft, #homepagebottomleft{margin:0px 8px 20px 0px; float:left;}
#homepageright, #homepagebottomright{margin:0px 0px 20px 0px; float:right;}
	#belowcontent a, #belowcontent a:visited{color:#A91B33; text-decoration:none; font-size:12px;}
	#belowcontent hr{border-style:none none dotted; border-width:medium medium 1px; clear:both; margin:0 0 10px; padding:0 0 10px;}
	#belowcontent .hpfeatured{background:#fff url(images/featuredtop.gif) top no-repeat; float:left; width:248px; height:368px; margin:0px; padding:10px 10px 10px 10px; border:1px solid #ddd}
	#belowcontent h3{background: url(images/headline.jpg); color:#FFF; font-size:11px; font-family: Arial,Tahoma,Verdana; font-weight:bold; text-transform:uppercase; margin:0px 0px 10px 0px; padding:3px 0px 3px 7px}
	#belowcontent p{line-height:16px; color:#333333; font-family:Arial,Tahoma,Verdana; font-size:12px; margin-top:4px;}

/* (4)-=-=-=[ Styling WP Menu Creator ]=-=-=-*/
#navcontainer {background: url(images/navcontainer.jpg) repeat-x; height: 100px; padding: 0px 0px 0px 15px; overflow: hidden; position:relative;}
#menuwrapper {position: absolute; left:290px; top:4px; width:630px; height:68px; padding-left: 2px; font: normal 12px Arial, Helvetica, sans-serif;}

ul#mc_menu_1{margin: 2px 0 0 0; padding: 0; float: left; font-weight:700; font-family: arial; font-size:12px; color:#e5f2f2; text-transform:uppercase;}
ul#mc_menu_1 ul ul {display:none;}
ul#mc_menu_1 ul li a {font-weight:700;}

ul#mc_menu_1 li a:hover {background: url(images/navline.jpg) top right no-repeat; color:#e5f2f2;}
ul#mc_menu_1 ul li a:hover {background:none; color:#99ccff;}
#mc_menu_1 li.mainlevel_current {}

#mc_menu_1 a {color: #e5f2f2; text-decoration: none; cursor: pointer;}
#mc_menu_1 a:hover {color: #ccc;}

#mc_menu_1 li {padding: 0; margin: 0; float: left; display: block;}
#mc_menu_1 li li {background:none;}
#mc_menu_1 li ul {position: absolute; top:38px; height: 38px; left:0; width: 100% !important; width:630px; display: none; margin: 0; padding: 4px 0 0 0;}

#mc_menu_1 li a {display: block; float: left; padding: 0 15px; height: 36px; line-height: 36px; background: url(images/navline.jpg) top right no-repeat; color:#e5f2f2;}
#mc_menu_1 li:hover a, #menuwrapper li.over a {}

#mc_menu_1 li ul a:hover, #menuwrapper li.mainlevel_current ul a:hover{color: #000;}
#mc_menu_1 li:hover ul, #menuwrapper li.sfhover ul {display: block; z-index: 6000;}

#mc_menu_1 ul li {border-right: 0;}
#mc_menu_1 li ul a, #mc_menu_1 li.mainlevel_current-navmenu ul a{display: block; float: left; color: #e5f2f2; font-weight: normal; padding: 0 10px; background: none; height: 25px; line-height: 25px;}

/*=-=-=-//
// (5) Begin the WordPress Hierarchy Styling
// In this area I list the name of the template hierarchy file
//=-=-=-*/

/*=-=-=-[WP sidebar.php]-=-=-=*/
#sidebar{}

/*=-=-=-[WP index.php or blog.tpl.php]-=-=-=*/
.article{padding-right:1px;} /* <div class="index" id="post-<?php the_ID(); ?>"> */
span.wpreadmore{} /* <span class="wpreadmore">Read the full article</span> */
a.more-link{}
.post{}
.post-ID{}/*<div id="single" class="post-<?php the_ID(); ?>">*/

/*=-=-=-[WP archives.php]-=-=-=*/
#archivepage{}

/*=-=-=-[WP attachment.php]-=-=-=*/
#attachmentpage{}

/*=-=-=-[WP author.php]-=-=-=*/
#authorpage{}

/*=-=-=-[WP category.php]-=-=-=*/
#categoryepage{}

/*=-=-=-[WP page.php]-=-=-=*/
#postpage{padding:8px 12px;}

/*=-=-=-[WP single.php]-=-=-=*/
#blogsingle{}

/*=-=-=-[WP 404.php]-=-=-=*/
#errorpage{}

/*-=-=-=[ Styling comments.php ]=-=-=-*/
#comments{width:560px; margin:10px 0px 0px 10px;}
#comments p{margin: 5px 0px; padding:5px;}
#comments > div{border:1px solid #eee; margin-top:8px;}
.notice{position:relative; height:40px; background:#f5f5f5; border-top:1px solid #ddd; border-bottom:1px solid #ddd; margin: 8px 0px;}
.commentmetadata{height:24px; display:block; border-bottom:1px solid #333; line-height:24px;}
.commentmetadata, .commentmetadata a{color:#333; text-transform:uppercase;}
.alt{background-color: #f8f8f8; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd;}

/*=-=-=-[WordPress Calendar Styling - WordPress Calendar is a TABLE -- Mapping Jared Ritchey]-=-=-=*/
#wp-calendar{width:200px} /* The WordPress table ID is wp-calendar */
#wp-calendar caption{font-weight:bold; color: purple; text-align:left;} /*The caption tag describes the nature of the table.*/
#wp-calendar colgroup{} /*tag creates and defines an explicit column group in a table*/
#wp-calendar col{}/*tag defines and controls the appearance of a column within a column group*/
#wp-calendar th{background: orange;} /* The <th> element defines table header cells. */
#wp-calendar tr{} /* defines the table row */
#wp-calendar td{border:1px solid #ccc; color:#369; font-weight:bold;} /* The <td> element defines table cells. */
#wp-calendar thead{background:#CCCCCC;} /* The <thead> element defines the rows that are part of the head of the table. */
#wp-calendar tfoot{background:#000;} /* The <tfoot> element defines the rows that are part of the foot of the table. */
#wp-calendar tbody{background:#f5f5f5;} /* The <tbody> element defines table bodies */
#wp-calendar td a{display:block; background:#66fffF; color:#ff0000;}
#wp-calendar td a:hover{background-color:#ccc;}
.pad{background:#369;} /* this is used to style specific empty TD cells used for calendar structure */
#next, #prev{background:#369;}
#next .pad{}
#prev .pad{}
#today{background:#369;} /* This styles "Today" which is a TD Cell */
