/*
Theme Name:     Karma 4.9.2 Child Theme
Theme URI:      http://themeforest.net/item/karma-clean-and-modern-wordpress-theme/168737?ref=TrueThemes
Description:    Child theme for the Karma theme 
Author:         TrueThemes
Author URI:     http://themeforest.net/user/TrueThemes?ref=TrueThemes
Template:       karma
Version:        2.0
*/



/* ------- Insert custom styles below this line ------- */


/* ------ import the shared WSG styles (same for all the sites) ------- */

@import url("styles-wsg-shared.css");

/*----------------------------*/
/* Main Nav Adjustments
/*----------------------------*/
#menu-main-nav {
	margin: 20px -12px 0px 0px;
}


body.karma-body-mega-menu #menu-main-nav li {
	padding: 5px 12px;
}



a .navi-description {
	color: #ffe0a3;
}

/* color for the links on the main header menu */

#header #menu-main-nav.sf-menu li .sub-menu li a {
	color: #fff!important;
}
/* color for the sub menus */

#wrapper #menu-main-nav.sf-menu li ul ul  {
    background-color: #537c00;
}

/*----------------------------*/
/* Main Nav!
/* For drop down width have to change in three places
/* then also chage on the a width - 8pxs
/*----------------------------*/

#menu-main-nav .drop {
	width: 260px;
}
#menu-main-nav .drop .c {
	width: 260px;
	padding: 10px 0;
}

#wrapper #menu-main-nav.sf-menu li ul ul {
	top: 24px;
}

/*----------------------------*/
/* styles to fix secondary dropdown flyout main menu */
/*----------------------------*/
/* environmental hazards menu */
#wrapper #menu-main-nav.sf-menu li ul li#menu-item-9295 ul {
    top: 200px;
}
/* award management */
#wrapper #menu-main-nav.sf-menu li ul li#menu-item-9306 ul {
    margin-top: 75px;
}
/* press */
#wrapper #menu-main-nav.sf-menu li ul li#menu-item-9369 ul {
    margin-top: 100px;
}
/* seabird bycatch */
#wrapper #menu-main-nav.sf-menu li ul li#menu-item-9294 ul {
    margin-top: 50px;
}

/* king tides */
#wrapper #menu-main-nav.sf-menu li ul li#menu-item-9324 ul {
    margin-top: 85px;
}

/* flyers */
#wrapper #menu-main-nav.sf-menu li ul li#menu-item-9356 ul {
    margin-top: 55px;
}


#menu-main-nav .drop ul {
	width: 260px;
}
#menu-main-nav .drop ul a {
	display: block;
	height: 1%;
	width: 252px;
}

/*----------------------------*/
/* styles to fix mobile menu background color */
/*----------------------------*/



#tt-mobile-menu-button {
	background: #fff;
}

#header #tt-mobile-menu-button span {
	color: #2e4219;
}

#tt-mobile-menu-wrap #tt-mobile-menu-list {
    background: #f7f4e8;
    padding: 0 0 20px 10px;
}


/*----------------------------*/
/* Custom style to lower bird logo in circle icon at top of certain columns/on certain pages */
/*----------------------------*/
.page-id-17671 #content .karma-custom-icon-img { 

}

/*---------------------------*/
/* Potentially redundant style for H1 heading spacing under the 3 column images on homepage, which no longer works in original child-theme style.css file */
/*---------------------------*/
.parent-page-id-4758 #content h1 {
        margin-top: -10px !important;
        margin-bottom: -8px;
}  

/*--------------------------*/
/* Homepage style updates to minimize post-content editing code adjustments */
/*--------------------------*/

.page-id-18294 #content h6 {
	font-size: 15px !important;

}
/*--------------------------*/
/* Homepage style specifically for the box of blogs on WSG homepage */
/*--------------------------*/

.true-image-box-2.homepage-blogs-box .true-text-wrap .icon-circ-wrap {
    display: none;
}
/*----------------------------*/
/* Calendar Widget in Sidebar
/*----------------------------*/

.sidebar-widget .tribe-mini-calendar-event h2 {
	font-size: 13px!important;
}

.sidebar-widget .tribe-mini-calendar-event .list-date {
	width: 25%;
	background: none repeat scroll 0% 0% #374a23;
}

.sidebar-widget .tribe-mini-calendar-event .list-info {
	width: 70%;
}

.sidebar-widget .tribe-mini-calendar-event div.duration {
	margin-bottom: 3px;
}

.tribe-mini-calendar .tribe-events-has-events div[id*="daynum-"] {
	font-weight: normal;
}

.tribe-mini-calendar th {
	font-weight: normal;
}

.tribe-mini-calendar thead, .tribe-mini-calendar .tribe-events-present, .tribe-mini-calendar .tribe-mini-calendar-today {
	background: none repeat scroll 0% 0% #374a23;
}

.tribe-mini-calendar {
	font-size: 11px;
}

.tribe-mini-calendar thead {
	font-size: 13px;
}

#sidebar .tribe-mini-calendar-event .list-date .list-dayname {
	padding: 3px 0;
	line-height: 12px;
}

/*   Removing the line at the bottom of widget */
#sidebar .tribe-mini-calendar-event {
	border-bottom: none;
}

#sidebar .vevent {
	border-bottom: 1px dotted #2F2F2F;
}

#sidebar .vevent:last-of-type {
	border-bottom: none;
}

/*----------------------------*/
/* Custom styles for typography
/*----------------------------*/

/* style the video widget title to be smaller */
.wpb_heading.wpb_video_heading {
    font-size: 14px !important;
}

/* fix the rows in the visual composer so they don't overlap */
.vc_row {
    overflow: hidden;
}

.vc_separator .vc_sep_holder .vc_sep_line {
    top: 0;
}

/* space below the elements */
.wpb_content_element {
	margin-bottom: 15px;
}

/* fix so the controls of visual composer show up */
.vc_editor.compose-mode .vc_row {
	overflow: visible;
}

.wsg-center {
	text-align: center;
}

.no-bottom-margin {
	margin-bottom: 0;
	padding-bottom: 0;
}

.no-top-margin {
	margin-top: 0;
	padding-top: 0;
}


/*----------------------------*/
/* Custom styles for specific pages
/*----------------------------*/

/* Staff */
.page-id-5133 #content.content-left-nav .one_fourth .modern_img_frame, #content.content-left-nav .one_fourth_last .modern_img_frame {
	margin-bottom: 0;
}

.page-id-5133 #content h6 {
	font-size: 17px !important;		
	font-weight: normal;
	letter-spacing: 0;
	text-transform: none;
	font-family: "Times New Roman",Georgia,serif;
	color: #800 !important;
}

.page-id-5133 #content h6 a {
	font-size: 17px !important;		
	font-weight: normal;
	letter-spacing: 0;
	text-decoration: none;
}

.page-id-5133 #content h6 a:hover {
	font-size: 17px !important;		
	font-weight: normal;
	letter-spacing: 0;
	text-decoration: underline;
}

.page-id-5133 h6 + p {
	margin-top: 0.6em;
}

/* WSG in the News: make sub-lists margin-bottom less than main lists */
.page-id-6569 #content li li {
	margin-bottom: 4px;
	line-height: 130%;
}


/* post content */
.post_content {
	min-height: 0;
	padding-bottom: 0;
	margin-bottom: 15px;
}

.blog_wrap, .single_blog_wrap {
	margin-bottom: 5px;
}

/*----------------------------*/
/* Post Styles for showing outreach programs
/*----------------------------*/

#content .tt-blog-no-feature .post_content p, #content .tt-blog-no-feature .post_content h1, #content .tt-blog-no-feature .post_content h2, #content .tt-blog-no-feature .post_content h3, #content .tt-blog-no-feature .post_content h4, #content .tt-blog-no-feature .post_content h5, #content .tt-blog-no-feature .post_content h6 {
    padding-right: 0;
}

/*----------------------------*/
/* Research excerpt styles
/*----------------------------*/


.pi {
	width: 30%;
	float: left;
	line-height: 22px!important;
	margin-bottom: 8px;
	font-size: 17px;
	font-family: "Times New Roman",Arial,sans-serif;
	text-shadow: 1px 1px 1px #FFF;
}

.excerpt {
	width: 60%;
	float: right;
}

.edit-page-button {
	clear: both;
}

/* put italics in when it's the title of a research project or any other page */
#content.research .post_content h6 a em {
	font-style: italic;
}

/* style for the excerpts of the research projects */

#wrapper #content h6 {
	font-weight: 700;
}


/* styles for research pages */
#wrapper #content.research .post_content h6 a {
	color: #000!important;
}

#wrapper #content.research h2 {
	margin-bottom: 12px;
}
/* more margin for entry titles on the research page */

.parent-pageid-5097 .entry-title {
	margin-bottom: 6px;
}

/*----------------------------*/
/* H5 for research projects "excerpt" (aka summary) */
/*----------------------------*/

#content h5 {
	margin-top: 10px;
	margin-bottom: 0;
}

/*----------------------------*/
/* Title links on Outreach and Ocean Learning (training and volunteer) pages */
/*----------------------------*/
.parent-pageid-5099 #wrapper #content article h6 a:hover, .parent-pageid-5101 #wrapper #content article h6 a:hover {
	color: #800!important;
}

.parent-pageid-5099 #wrapper #content article h6 a, .parent-pageid-5101 #wrapper #content article h6 a, .parent-pageid-5099 #wrapper #content article h6, .parent-pageid-5101 #wrapper #content article h6 {
	color: #000!important;
}

/*
====================================================================
Table code for pages like Retail Boat Sales and Crabber/Towboat Lane
====================================================================
*/

#content th {
    margin:     0;
    padding: 0 7px 0 0;
    font-size: 80%;
        font-weight: normal;
        line-height: 170%;
        text-align: center;
        vertical-align: bottom;
}

#content td, .page-id-9259 #content table td.overview {
	margin: 0;
        padding: 0 7px 0 0;
        font-size: 80%;
        text-align: left;
	line-height: 170%;
}

/* make the rsvp table look right */
#content .tribe-events-tickets td {
	padding: 8px 10px;
}

#content th.year {
        font-size: 120%;
        text-align: left;
}

#content caption {
        font-size: 90%;
        font-weight: bold;
        border-bottom: 1px solid #929292;
}

/* bottom-border style for table */

#content .bottomborder {
        border-bottom: 1px solid #929292 !important;
}

.page-id-9259 #content td {
        text-align: center;
}

.page-id-9259 #content table td.overview {
        text-align: left;
        padding-left: 36px;
        padding-bottom: 7px;
}

.page-id-9259 #content table td.overview ul {
	line-height: 100%;
}

/* class to force padding between columns */
#content .column-padright { padding-right: 15px !important; }

.type-post .vc_col-has-fill > .vc_column-inner, .type-post .vc_row-has-fill > .vc_column_container > .vc_column-inner {
	padding-top: 0;
}

.post_content .wpb_content_element {
	margin-bottom: 0;
}
/*
====================================================
Styles for the ticket & checkout forms WooCommerce
====================================================
*/

#content #buy-tickets .tribe-events-tickets td {
	padding: 10px;
	font-size: 14px;
}

/* Cart Styles */


#content .cart .cart_item td {
	text-align: center;
	padding: 5px 0;
}

#content .cart td button {
	margin: 5px 0;
}

#content .woocommerce a.button:hover, #content button#place_order:hover {
	background-color: #99cc00;
	color: #fff !important;
}

#content .woocommerce a.button, #content button#place_order {
	background-color: #374a23;
	color: #fff !important;
}

#content .place-order {
	margin-bottom: 24px;
}

#content .woocommerce-info, #content .woocommerce-error, #content .woocommerce-message {
	border-top-color: #374a23;
}

#content .woocommerce-info::before {
	color: #374a23;
}

#content .cart_item .product-name, #content .order_details .product-name {
	padding: 5px;
}

#content .cart-subtotal th, #content .order-total th, #content .order_details tfoot th {
	text-align: right;
}

#content .woocommerce ul.order_details li {
	border-right: none;
}

/* remove thumbnail */
#content .cart .product-thumbnail {
	display: none;
}

#content .woocommerce-error::before, #content .woocommerce-info::before, #content .woocommerce-message::before {
	top: 0;
	left: 0;
}
	
#content .button.wc-backward {
	display: none;
}

/*
====================================================================
Tab styles for green crab news, plus non-purple link
====================================================================
*/
/* The line-height controls the spacing around the text because of the br's */
#content .ult_tabmenu.style3 > li.ult_tab_li a {
    color: #fff !important;
	font-style: normal;
	line-height: 3px;
}

#content ul.ult_tabmenu {
	margin: 40px 0 8px 15px;
}

.page-id-19467 .ult_tabmenu.style3 > li.ult_tab_li {
    width: 25%;
}

/* change non-active tab text color */
.page-id-19467 .vc_tta-title-text {
	font-weight: bold;
	color: #ffffff;
}

/* to change color of non-current background tabs */
.page-id-19467 #content .vc_tta.vc_tta-tabs.vc_tta-color-green.vc_tta-style-classic ul.vc_tta-tabs-list li.vc_tta-tab > a {
	background-color: #374a23 !important;
}

/* change color of current background tab */
.page-id-19467 #content .vc_tta.vc_tta-tabs.vc_tta-color-green.vc_tta-style-classic ul.vc_tta-tabs-list li.vc_tta-tab.vc_active > a {
        background-color: #ffffff !important;
}

/* change active tab text color */
.page-id-19467 li.vc_tta-tab.vc_active .vc_tta-title-text {
	color: #880000 !important;
}

/* change inactive tab text color on hover */
.page-id-19467 li.vc_tta-tab a:hover .vc_tta-title-text {
        color: #b7a57a !important;
}

.ult_tabmenu.style3 > li.ult_tab_li p {
    display: none;
}

.page-id-18896 #wrapper #content .wpb_wrapper h4 a {
    color: #76150a !important;
}

.page-id-18896 #wrapper #content .wpb_wrapper h4 a:hover {
    text-decoration: underline;
}
/* makes the bit after the tab name disappear */
.aio-icon.none.ult_tab_iconright {
    display: none;
}
/*
==========================================================================
Style for News Blog to change dark-gray background for "Read more" button,
heading spacing, hide "WSG News Blog" link, etc.
Added to new news blog on 3/10/16
==========================================================================
*/
/* added styles for archive pages to match wsg blog  */

.page-id-19916 #wrapper #content .ka_button, .page-id-13075 #wrapper #content .ka_button, .archive #wrapper #content .ka_button, .archive #wrapper #content .ka_button {
     background-color: transparent;
     margin-top: -5px;
     margin-left: -13px;
}

.page-id-13075 #wrapper #content .post_footer {
	display: none;
}

.page-id-13075 #wrapper #content h6, .archive #wrapper #content h2 {
	font-size: 16px !important;
}

.page-id-19916 #wrapper #content .post_title, .archive #wrapper #content .post_title {
     margin-bottom: 10px !important;
}

.page-id-19916 #wrapper #content h6 {
     font-size: 120% !important;
}

.page-id-19916 #wrapper #content .post_footer {
     display: none;
}



/* 
====================================================================
Trying to fix stubborn superscript element (behaving like subscript)
and may as well set subscript similarly, neh?
====================================================================
*/

#content sup {
	font-size: x-small;
	vertical-align: 15%;
        line-height: 100%;
}

#content sub {
	font-size: x-small;
        vertical-align: -20%;
	line-height: 100%;
}

/*
=====================================================================
Homepage style updates, 3/18/16, to obviate inline coding necessary 
due to first-child issues following New, Events, and Funding headings
=====================================================================
*/

.page-id-18294 #content h1 {
        font-size: 15px !important;
        font-weight: bold;
        font-family: "Open Sans",Helvetica,Arial,Verdana,sans-serif;
        color: #334703 !important;
        letter-spacing: 1px;
        text-transform: uppercase;
        margin-top: -26px !important;
        margin-bottom: 3px !important;
}

.page-id-18294 #content h1 a:link, .page-id-18294 #content h1 a:visited {
        color: #334703 !important;
        text-decoration: none;
}

.page-id-18294 #content h1 a:active, .page-id-18294 #content h1 a:hover {
        color: #334703 !important;
        text-decoration: underline;
}

.page-id-18294 #content h1+h2 {
        margin-top: -18px;
}

.page-id-18294 #content h2 {
        font-size: 14px !important;
        font-family: "Open Sans",Helvetica,Arial,Verdana,sans-serif;
        font-weight: 600;
        letter-spacing: -03.px;
        margin-bottom: 0px;
        line-height: 20px !important;
}

.page-id-18294 #content h2 a:link, .page-id-18294 #content h2 a:visited, .page-id-18294 #content #eventscol h3 a:link, .page-id-18294 #cont$
        text-decoration: none;
}

.page-id-18294 #content h2 a:hover, .page-id-18294 #content h2 a:active, .page-id-18294 #content #eventscol h3 a:hover, .page-id-18294 #con$
        text-decoration: underline !important;
}

.page-id-18294 #content p, .page-id-18294 #content #eventscol p {
        line-height: 20px !important;
}

.page-id-18294 #content .bloghead {
        padding-top: 29px !important;
}

.page-id-18294 #content .blogsubhead {
        padding-top: 19px !important;
}

/*--------------------------*/
/* Homepage style updates, 3/24/16 to resolve Events column issue where we have two different types of styles called for the */
/* <p> tag; fix was to change one <p> style to an <h2> (dates) depite using <h> for dates not being recommended by accessibility wonk */
/* NOTE: probably all irrelevant owing to design changes */
/*--------------------------*/

#eventscol {
	margin: 0;
        padding: 0;
}

.page-id-18294 #content #eventscol h1 {
        margin-top: -34px;
        margin-bottom: -25px !important;
}

.page-id-18294 #content #eventscol h2 {
        color: #000000 !important;
        margin-top: 10px !important;
        margin-bottom: 0px;
        line-height: 20px !important;
}

.page-id-18294 #content #eventscol h3 {
        font-size: 14px !important;
        font-family: "Open Sans",Helvetica,Arial,Verdana,sans-serif;
        font-weight: 600;
        margin-bottom: -1px;
        line-height: 20px !important;
}

/* Raffle checkbox text vertical alignment fix */
.page-id-23283 #content label {
	margin-top: -15px;
}

/*
=====================================================================
Blog styles to make archives & blog pages match the other pages & now to make them wide again
=====================================================================
*/
#content.content_blog {
    width: 610px;
    padding: 0 0 20px 160px;
}

.tax-wsg-news-post #content.content_blog, .category-wsg-news-blog #content.content_blog {
	padding: 0 0 20px 0;
	width: 770px;
}

#content.content_sidebar.content_right_sidebar.wide_single_post {
	width: 770px;
}

#sidebar.sidebar_blog, #sidebar.left_sidebar_blog {
    width: 160px;
}

.archive .sidebar-widget h3 {
	font-size: 17px !important;
	color: #880000 !important;
	font-family:"Times New Roman", Times, serif !important;
}

.archive #wrapper #content h2.entry-title {
    font-size: 120% !important;
    font-weight: 700;
    margin-bottom: 5px;
}

.archive .post_footer {
    display: none;
}


/* fixing callout leading */

/* have to do this for fine tuning, Karma doesn't let this be changed */
#content .true-text-wrap .callout-details-wrap p, vc_column-inner .wpb_wrapper .callout-details-wrap p, .wpb_wrapper .callout-details-wrap li {
    line-height: 1.6;
} 


/* smalltext class for span of text */
.smalltext {
	line-height: 1.4;
}

/*
===========================================================
Make sidebar h4 for Upcoming Events same as h3 for sidebar
===========================================================
*/
.sidebar-widget h4 {
	font-family: "Merriweather-light", Arial, sans-serif !important;
	font-size: 17px !important;
	}

/*
=====================================================
Indent photo caption so left margin is flush to photo
=====================================================
*/

#content .wp-caption-text {
	margin-right: 3px;
	margin-left: 5px;
	}

/*
====================================================
2-col divs for forms to fix shortcode css issues
====================================================
*/

#formwrapper
	width: 90%;
	position: relative;
	height: 1000px;
}

.float { }
.left {float: left; width:350px;}
.right {float:right; width:400px;}

/*
===========================================================
Keep floated images in content elements
===========================================================
*/
.wpb_content_element {
    overflow: hidden;
}

/*
===========================================================
Fix margin below thumbnails on the crab team page
===========================================================
*/
.wpb_content_element.thumbnail_custom {
    margin-bottom: 5px;
}

/*
 *
===========================================================
Responsive styles for mobile
===========================================================
*
*/

@media screen and (max-width: 1023px) {
	nav#sub_nav {
		/* display: none; */
		width: 80%;
		box-shadow: none;
	}
	
	.content-custom-bg #sub_nav {

    background: none;
    background-color: rgba(247, 244, 232, 0.3); 

	}
	
/* to test getting the styles in mobile
		.main-area {
		background: blue;
	}
*/
}

@media screen and (max-width: 980px) {
	.uw-brand div {
		width: 100%;
		position: absolute;
		top: 0;
		background: #fff;
}

#tt-mobile-menu-button {
    margin-top: 30px;
}

	}
}