/*
----------------------------------------------------------------------------------------------------------------------
Theme Name: De Base Responsive Framework
Theme URI: http://esquaredent.com/demos/debase-framework
Description: The De Base Responsive Framework theme is an awesome, fully responsive theme that any Wordpress website can start with. It is clean, simple and easily editable. It is fully responsive and mobile-friendly! It can also easily convert to be a fixed width theme. The CSS and HTML is easy to understand, easy to customize and is well-commented. This theme is a perfect starting point for any website!
Author: Cortney Westbrook
Author URI: http://cortneywestbrook.com
Version: 2.1
Tags: light, dark, two-columns, right-sidebar 
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-3.0.txt
Text Domain: debase
----------------------------------------------------------------------------------------------------------------------
*/


/*
----------------------------------------------------------------------------------------------------------------------
******** Structure ********
----------------------------------------------------------------------------------------------------------------------
*/
body,  button,  input,  select,  textarea {
	margin: 0;
	background: #fff;
    font-family: 'Raleway', Arial, Sans-serif;
}

body {
	-ms-word-wrap: break-word;
	word-wrap: break-word;
	color: #444;
}

/************ Header Structure ************/
#header-container { 
    width: 100%;
	background-color: #000;
}

#header-content {
	max-width: 960px;
	margin: auto;
	padding: 0;
}

#site-name {
	float: left;
	margin: 40px 0;
	padding: 0 0 0 10px;
	color: #fff;
}

#site-name a {
	color: #fff;
}

#site-name a:hover {
	color: #78cdd2;
}

#site-name h1 {
	margin: 0;
	line-height: 33px;
	font-size: 40px;
	font-family: Rokkitt, inherit;
}

#site-name h2 {
	margin: 0;
	font-size: 20px;
	font-style: italic;
}

#logo-container {
	width: 50%;
	float: left;
	margin: 30px 0;
}

#logo-container img {
    width: 100%;
}

/********** Page Structure **********/
#page-container {
    max-width: 940px;
    margin: auto;
	margin-top: 25px;
	margin-bottom: 25px;
	padding: 10px;
}

#main-content {
	width: 64%;
	float: left;
}

.full-width {
}

.site-content {
	max-width: 585px;
	float: left;
	margin-right: 0;
	margin: 0;
}

#main-sidebar #left {
	float: left;
}

#main-sidebar {
    width: 31.9%;
	float: right;
	margin: 0;
    padding: 0;
    background-color: transparent;
	clear: none;
	border-top: 0;
	border-bottom: 0;
	color: #000;
	padding-top:0;
}


/******** link colors and theme styles ********/
a {
    color: #78cdd2;
    text-decoration: none;
}
 
a:active {
    color: #78cdd2;
}
a:hover {
    color: #78cdd2;
}

p {
    margin-bottom: 15px;
	margin-top: 0;
}

::selection {
    background: #74c0fb;
    color: #000;
    text-shadow: none;
}
 
::-moz-selection {
	background: #74c0fb;
	color: #000;
	text-shadow: none;
}

.clearfloat {
	clear: both;
}

.spacer1 {
	height: 45px;
}

input {
	width: 90%;
	border: 1px solid #CCC;
	padding: 8px 5px;
	font-size: 14px;
	box-shadow: inset 1px 1px 4px #DDD;
}

input[type="submit"] {
	border: 1px solid #CCC;
	padding: 5px;
	font-size: 14px;
	box-shadow: inset 1px 1px 4px #DDD;
}

textarea {
	width: 90%;
}

.gallery-caption { }
.sticky { }
.bypostauthor { }

/********** Post Navigation (delete?) **********/
.post-navigation {
    clear: both;
    margin: 30px 0 10px 0;
    font-size: 16px;
    padding-top: 10px;
}

.post-navigation a {
    color: #78cdd2;
}

.post-navigation a:hover {
    color: #000;
}

.paging-navigation {
    clear: both;
}

.paging-navigation .loop-pagination {
	clear: both;
}

.paging-navigation .page-numbers.current {
    border-top: 5px solid #78cdd2;
}

.paging-navigation a:hover {
    border-top: 5px solid #78cdd2;
}
/*
----------------------------------------------------------------------------------------------------------------------
*/

/*
----------------------------------------------------------------------------------------------------------------------
******** Content Styles ********
----------------------------------------------------------------------------------------------------------------------
*/
.post-header {
	min-width: 100%;
	position: relative;
	z-index: 1;
	margin: 0 0 15px 0;
}

/********** Post Title **********/
.post-title {
	font-size: 33px;
	font-weight: 300;
	line-height: 1.0909090909;
	margin-bottom: 12px;
	margin: 0 0 12px 0;
	text-transform: uppercase;
}

.post-title a {
	color: #2b2b2b;
}

.post-title a:hover {
    color: #78cdd2;
}

h3.post-title {
	margin-bottom: 0;
	margin: auto;
	line-height: 30px;
	font-size: 28px;
	text-transform: capitalize;
	text-decoration: underline;
	text-align: left;
}

h3.post-title a {
	font-weight: 400;
	color: #000;
}

h3.post-title a:hover {
	color: #78cdd2;
}

.featured-post {
	margin: 0 5px 0 0;
	padding: 2px;
	background: #ddd;
	font-size: 12px;
	text-transform: uppercase;
	color: #000;
}

/********** Post Content **********/
article {
	border-bottom: 1px dashed #CCC;
	padding-bottom: 25px;
	margin-bottom: 25px;
}

.post-container {
	max-width: 100%;
	margin: 0 0 25px 0;
}

.post-content {
	min-width: 100%;
	margin: 0;
}

.post-content > div {
	max-width: 100%;
}

.alignleft {
	margin: 10px 10px 10px 0;
	float: left;
}

.alignright {
	margin: 10px 0 10px 10px;
	float: right;
}

.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

/********** Edit Link **********/
.edit-link {
	clear: both;
	display: block;
	font-size: 12px;
	text-transform: uppercase;
}

.edit-link a {
	color: #767676;
	text-decoration: none;
}

.edit-link a:hover {
	color: #78cdd2;
	text-decoration: underline;
}

/********** Post Meta **********/
.post-meta {
	font-size: 14px;
	clear: both;
	color: #000;
	line-height: 1.3333333333;
	text-transform: capitalize;
}

.post-meta a {
    color: #000;
	font-weight: bold;
}

.post-meta a:hover {
    color: #78cdd2;
}

.tags {
	margin: 10px 0 0 0;
	display: block;
}

.post-meta .tags a {
    background-color: #fff;
	color: #000;
	margin: 0 4px;
}

.post-meta .tags a:hover {
    background-color: #000;
	color: #fff;
}

a.readmore {
	color: #444;
	text-decoration: underline;
}

a.readmore:hover {
	color: #78cdd2;
}

/********** Post Image Styles **********/
.post-thumbnail {
	display: block;
	position: relative;
	width: 100%;
	z-index: 0;
}

.post-thumbnail img {
	max-width: 100%;
	height: auto;
}

.full-width .post-thumbnail img {
	display: block;
	margin: 0 auto;
}

.post-content img {
	max-width: 100%;
	height: auto;
}

#main-content img {
	max-width: 100%;
	height: auto;
}
/*---*/

.wp-caption-text {
	padding: 0;
	margin: 0 0 10px 0;
	font-size: 14px;
	font-style: italic;
}

/********** Comments Styles **********/
#comments {
	max-width: 100%;
	padding: 10px;
	background: #eee;
	margin-top: 25px;
}

.comments-title {
	margin: 0;
}

.comment-body {
	padding-bottom: 20px;
	border-bottom: 1px solid #fff;
	margin-bottom: 20px;
}

.comment-list ul li {
	margin: 15px 0;
}
/*---*/

/********** Calendar Styles **********/
#calendar_wrap table {
	width: 100%;
	text-align: center;
}
/*---*/



/*
----------------------------------------------------------------------------------------------------------------------
******** Column Content Feature ********
----------------------------------------------------------------------------------------------------------------------
*/
.colfeat {
}

h1.colfeat {
	margin: 0 0 10px 0;
	font-size: 24px;
	font-family: Sans-serif;
	text-transform: uppercase;
	text-decoration: underline;
}

.colfeat h2 {
	margin: 10px 0 0;
	line-height: 24px;
	border-bottom: 0;
	font-size: 24px;
	font-weight: bold;
	color: #444;
}

.colfeat h2 a {
    color: #444;
}

.colfeat h2 a:hover {
    color: #78cdd2;
	text-decoration: underline;
}

.colfeat h3 {
    margin: 0;
    line-height: 17px;
	font-size: 20px;
    color: #444;
}

/********** Column Feature Meta **********/
.colfeat-meta {
	font-size: 12px;
}

.colfeat-meta a {
	color: #000;
	text-decoration: underline;
}

.colfeat-meta a:hover {
	color: #78cdd2;
}

.colfeat-excerpt {
	line-height: 17px;
    font-size: 14px;
}

.colfeat-excerpt p {
    margin: 0;
}

.colfeat-readmore {
	margin: 0 3px;
}

a.colfeat-readmore {
	font-weight: bold;
}

/*---*/


/********** One Half Column and First Post **********/
.onehalf-col {
	width: 430px;
	float: left;
	margin: 0 10px;
	margin-bottom: 15px;
	padding: 10px;
	box-shadow: inset 0 0 14px #ccc;
	background: #eee;
}

.onehalf-col-firstpost {
	margin-bottom: 10px;
	padding-bottom: 10px;
	border-bottom: 1px solid #ddd;
}

.onehalf-col-firstpost-thumb {
	width: 430px;
	height: 200px;
	overflow: hidden;
	border: 1px solid #ccc;
}

.onehalf-col-firstpost-thumb img {
	width: 430px;
	height: 200px;
}

.colfeat-firstpost-meta {
	margin: 0 0 5px 0;
	display: block;
	line-height: 17px;
	padding-bottom: 5px;
    font-size: 12px;
}

.colfeat-firstpost-meta a {
	color: #000;
	text-decoration: underline;
}

.colfeat-firstpost-meta a:hover {
	color: #78cdd2;
	text-decoration: underline;
}

/** One Half Column List **/
.onehalf-col-list {
    list-style: none;
	background: #eee;
	padding: 10px 0;
	border-bottom: 1px solid #DDD;
}

.onehalf-col-list a {
	color: #444;
}

.onehalf-col-list a:hover {
	color: #78cdd2;
	text-decoration: underline;
}

.onehalf-col-list-thumb {
	display: none;
	width: 75px;
	height: 42px;
	display: inline;
    float: left;
    margin-right: 10px;
	overflow: hidden;
}

.onehalf-col-list-thumb img {
    width: 75px;
	height: 42px;
}
 
.onehalf-col-list-excerpt {
    font-size: 14px;
    margin-bottom: 25px;
}

.onehalf-col-list-excerpt p {
    margin: 0;
    line-height: 16px;
    font-family: Arial, Sans-serif;
}
/*---*/


/********** One Third Column and First Post **********/
.onethird-col {
	width: 273px;
	float: left;
	margin: 0 10px;
	margin-bottom: 15px;
	padding: 10px;
	box-shadow: inset 0 0 14px #ccc;
	background: #eee;
}

.onethird-col-firstpost {
	margin-bottom: 10px;
	padding-bottom: 10px;
	border-bottom: 1px solid #ddd;
}

.onethird-col-firstpost-thumb {
	width: 273px;
	height: 127px;
	overflow: hidden;
	border: 1px solid #ccc;
}

.onethird-col-firstpost-thumb img {
	width: 273px;
	height: 127px;
}

.colfeat-firstpost-meta {
	margin: 0 0 5px 0;
	display: block;
	line-height: 17px;
	padding-bottom: 5px;
    font-size: 12px;
}

.colfeat-firstpost-meta a {
	color: #000;
	text-decoration: underline;
}

.colfeat-firstpost-meta a:hover {
	color: #78cdd2;
	text-decoration: underline;
}

/** One Third Column List **/
.onethird-col-list {
    list-style: none;
	background: #eee;
	padding: 10px 0;
	border-bottom: 1px solid #DDD;
}

.onethird-col-list a {
	color: #444;
}

.onethird-col-list a:hover {
	color: #78cdd2;
	text-decoration: underline;
}

.onethird-col-list-thumb {
	display: none;
	width: 75px;
	height: 42px;
	display: inline;
    float: left;
    margin-right: 10px;
	overflow: hidden;
}

.onethird-col-list-thumb img {
    width: 75px;
	height: 42px;
}
 
.onethird-col-list-excerpt {
    font-size: 14px;
    margin-bottom: 25px;
}

.onethird-col-list-excerpt p {
    margin: 0;
    line-height: 16px;
    font-family: Arial, Sans-serif;
}
/*---*/

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


/*
----------------------------------------------------------------------------------------------------------------------
******** Sidebar Styles ********
----------------------------------------------------------------------------------------------------------------------
*/
.sidebar-widget {
	color: #000;
    margin-bottom: 20px;
	border-bottom: 1px dashed #CCC;
	padding-bottom: 20px;
}

.sidebar-widget:last-child {
	border-bottom: 0;
	padding-bottom:0;
}

.sidebar-widget a {
    color: #000;
	text-decoration: underline;
}

.sidebar-widget a:hover {
    color: #78cdd2;
}

.widget-title {
	color: #000;
	margin: 0 0 10px 0;
	font-size: 22px;
	font-weight: normal;
}

.widget-title a:hover {
	color: #78cdd2;
}
/*
----------------------------------------------------------------------------------------------------------------------
*/


/********** Buttons **********/
.button, input[type="submit"] {
	width: 100px;
	display: block;
	margin: 5px 0;
	-moz-border-radius: 0;
	-webkit-border-radius: 0;
	border-radius: 0;
	padding: 10px;
	background: #78cdd2;
	font-weight: bold;
	font-size: 14px;
	text-transform: capitalize;
	text-align: center;
	color: #fff;
}

.button:hover, input:hover[type="submit"]  {
	background: #6BB8BD;
	-webkit-transition: background 0.2s; /* For Safari 3.1 to 6.0 */
	transition: background 0.2s;
	-webkit-transition-timing-function:linear;
	transition-timing-function:linear;
}

a.button {
	text-decoration: none;
	color: #000;
}

a.button:hover {
	color: #fff !important;
	cursor: pointer;
	-webkit-transition: color 0.2s ; /* For Safari 3.1 to 6.0 */
	transition: color 0.2s;
	-webkit-transition-timing-function:linear;
	transition-timing-function:linear;
}

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


/*
----------------------------------------------------------------------------------------------------------------------
******** Footer Styles ********
----------------------------------------------------------------------------------------------------------------------
*/
#footer {
	background-color: #000;
    margin: auto;
	font-size: 12px;
	color: #fff;
}
#footer-info {
	max-width: 960px;
	margin: auto;
	padding: 5px 10px;
}
#footer-info a {
    color: #78cdd2;
}
#footer-info a:hover {
    color: #fff;
}
#footer-info-left {
	float: left;
}
#footer-info-right {
	float: right;
}
/*
----------------------------------------------------------------------------------------------------------------------
*/


/*
----------------------------------------------------------------------------------------------------------------------
******** Navigation ********
----------------------------------------------------------------------------------------------------------------------
*/
/* Use these styles to customize the active menu item. */
.current-menu-item {
}
.current-menu-item a {
	color: #000 !important;
}

.main-navigation-container {
	background: #78cdd2;
	width: 100%;
}

.main-navigation-container {
	width: 100%;
	background: #78cdd2;
}

.main-navigation {
	max-width: 960px;
	height: auto;
	margin: auto;
	padding: 0;
    font-size: 16px;
	font-weight: bold;
}

.sub-menu {
	position: relative;
	line-height: 18px;
	padding: 0;
	background: #78cdd2;
}

.sub-menu.toggled-on {
	background-color: #78cdd2;
}

.sub-menu ul li {
	line-height: 18px;
}

.children {
	position: relative;
	line-height: 18px;
	padding: 0;
	background: #78cdd2;
}

.children.toggled-on {
	background-color: #78cdd2;
}

.children ul li {
	line-height: 18px;
}

/* These are the styles for when the mobile menu is toggled on (active). */
.main-navigation.toggled-on {
	padding: 0;
}

.main-navigation .nav-menu {
	display: none;
	border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.main-navigation.toggled-on .nav-menu {
	display: block;
	margin: 0;
	padding: 0;
}

.main-navigation.toggled-on .nav-menu ul {
	margin: 0;
	padding: 0;
}

.main-navigation.toggled-on .nav-menu a {
	display: block;
	padding: 0 12px;
	white-space: nowrap;
    color: #fff;
	text-decoration: none;
}

.main-navigation.toggled-on .nav-menu a:hover {
	color: #000;
}

.main-navigation.toggled-on .nav-menu li {
	position: relative;
	list-style: none;	
	display: block;
	line-height: 38px;
	border: none;
	text-transform: uppercase;
	border-top: 1px solid #61b0b5;
}

.main-navigation.toggled-on .nav-menu .sub-menu {
	padding: 0;
	font-size: 14px;
}

.main-navigation.toggled-on .nav-menu .sub-menu li a {
	padding-left: 25px;
}

.main-navigation.toggled-on .nav-menu .children {
	padding: 0;
	font-size: 14px;
}

.main-navigation.toggled-on .nav-menu .children li a {
	padding-left: 25px;
}

.main-navigation.toggled-on .nav-menu .menu-main-menu-container {
	border-top: 1px solid #61b0b5;
}

.main-navigation.toggled-on .nav-menu ul ul a:hover, .main-navigation ul ul li.focus > a {
	color: #000 !important;
	-webkit-transition: color 0.2s; /* For Safari 3.1 to 6.0 */
	transition: color 0.2s;
}

.main-navigation.toggled-on .nav-menu li:hover > a, .main-navigation li.focus > a {
	color: #000 !important;
	-webkit-transition: color 0.2s; /* For Safari 3.1 to 6.0 */
	transition: color 0.2s;
}
/*----*/



/*
----------------------------------------------------------------------------------------------------------------------
******** Media Queries ********
----------------------------------------------------------------------------------------------------------------------
*/
/* These styles are needed in order for the mobile menu to work. Be very careful when editing these styles!! */
@media screen and (max-width: 750px) {
.menu-toggle {
	width: 48px;
	height: 38px;
	margin: 0;
	position: relative;
	top: 0;
	right: 0;
	cursor: pointer;
	overflow: hidden;
	font-size: 0;
	text-align: center;
	display: inline-block;
	background: url(images/menu-toggle.png) no-repeat 15px 15px;
}
}

@media screen and (min-width: 750px) {
.main-navigation .menu-toggle {
	display: none;
	padding: 0;
}

.main-navigation .nav-menu {
	display: block;
	margin: 0;
	padding: 0;
	border-bottom: 0;
}

.main-navigation.toggled-on {
	border-bottom: 0;
	margin: 0;
	padding: 0;
}

.main-navigation a {
	display: inline-block;
	padding: 0 12px;
	white-space: nowrap;
    color: #fff;
	text-decoration: none;
}

.main-navigation li {
	position: relative;
	list-style: none;	
	display: inline-block;
	line-height: 38px;
	border: none;
	text-transform: uppercase;
}

.main-navigation li li {
	height: auto;
	display: block;
	line-height: 1.0909090909;
	border: 0;
}

.main-navigation ul ul {
	top: 38px;
	left: -999em;
	z-index: 99999;
	position: absolute;
	margin: 0;
	margin-left: 15px;
	float: left;
}

.main-navigation ul ul a {
	width: 150px;
	padding: 8px;
	padding-left: 15px;
	white-space: normal;
	border-top: 1px solid #61b0b5;
	font-size: 14px;
	color: #FFF !important;
}

.main-navigation ul ul ul {
	left: -999em;
	top: 32px;
}

.main-navigation ul li:hover > ul, .main-navigation ul li.focus > ul {
	left: auto;
}

.main-navigation ul ul a:hover, .main-navigation ul ul li.focus > a {
	color: #000 !important;
	-webkit-transition: color 0.2s; /* For Safari 3.1 to 6.0 */
	transition: color 0.2s;
}

.main-navigation li:hover > a, .main-navigation li.focus > a {
	color: #000 !important;
	-webkit-transition: color 0.2s; /* For Safari 3.1 to 6.0 */
	transition: color 0.2s;
}

ul ul ul {
	top: 32px !important;
	border: 1px solid #61b0b5;
	border-top: 0;
	background: #61b0b5;
}
}
/*----*/


@media screen and (max-width: 750px) {
#main-sidebar {
	display: none;
}

#main-content {
	width: 100%;
}

#footer-info-left {
	float: none;
	margin-bottom: 8px;
	text-align: center;
}

#footer-info-right {
	float: none;
	text-align: center;
}
}