/*
   Theme Name: Zerif Lite Child
   Template: zerif-lite
   Version: 0.1 
*/

@import url(../zerif-lite/style.css);	

/* Gold color = #cfb53b */

/* Line 25 -- "Focus" box on home page -- this is not currently fixed*/
h2.widgettitle { 
	/* max-width: 720px; */
	/* margin-left: 20%; */
	/* margin-right: 20%; */
}

/* Line 131 -- Selection colors */
/* Currently these are orange */
/* Not sure how to set these to the browser's default */
::selection {
	background: #FC6D6D;
	color: #FFF;
}
::-moz-selection {
	background: #FC6D6D;
	color: #FFF;
}



/* Line 683 -- Links */
a, 
a:hover,
a:focus,
a:active,
a:visited {
	color: #cfb53b;
	outline: none;
}

/*  NOTE: Making a:visited _always_ black poses some problems (e.g., with PDF links)
	If it's not specified here, it defaults to orange...
	For PDF links, want to make "visited" be gold.
	So... need to customize ".entry-title a:visited" to be black, not gold
*/


/* Line 697 -- Menus */
.nav-links a {
	color: #cfb53b;
}


/* Line 879 -- widget title before */
.widget .widget-title:before{
	position: absolute;
	margin: auto;
	z-index: 1;
	content: "";
	width: 35%;
	height: 2px;
	/* background: #e96656; */
	background: #cfb53b;
	bottom: -9px;
	left: 0;
}

/* Line 962 */
.widget li a:hover {
	color: #cfb53b;
}


/* Line 1181 */
/* Section header h1 -- newly created */
.section-header h1 {
	text-align: left;
	font-weight: 300;
	font-size: 2em;
	/* font-family: Lato; */
}

.section-header h3 {
	text-align: left;
}

.entry-header {
	text-align: left;
	margin-bottom: 20px;
}

/* Line 1345 */
.focus {
	padding-top: 0px;
	padding-bottom: 0px;
}

/* Line 1352 -- Section header text (e.g., "Recent News") */
.section-header h2 {    
    text-transform: none;
}


/*---------------------------------------
 **   Navbar and Home Page -- Line 1405
-----------------------------------------*/

/* Line 1414 -- background of top section of home page */
.header-content-wrap {
	/* background: rgba(0, 0, 0, 0.5); */
	background: transparent;
	position: relative;
	-webkit-box-shadow: 0px 5px 11px 0px rgba(50, 50, 50, 0.08);
	box-shadow: 0px 5px 11px 0px rgba(50, 50, 50, 0.08);
	padding: 285px 0 210px;
}

/* Line 1449 -- navbar color*/
.navbar {
	background: #000;
}

/* Custom navbar for home page */
.navbar-home {
	background: transparent; 
}

/* Makes navbar-home container semi-transparent on home page */
.navbar-home .container {
	background: linear-gradient(to top,rgba(69,69,69,0.75),rgba(51,51,51,0.75));
}

/* Line 1478 */
.navbar-inverse .navbar-nav>li>a {
    color: #FFF;
}

/* Line 1520 */
.navbar-inverse .navbar-nav ul.sub-menu li:hover > a,
.navbar-inverse .navbar-nav ul.sub-menu li.link-focus > a {
	color:#cfb53b;
}

/* Line 1540 -- navbar-brand = top left logo */
.navbar-brand {
	height: 76px;
	position: relative;
	line-height: 60px;
	padding: 7px 15px;
	display: inline-block;
}
.navbar-brand > img {
	max-height: 100%;
}
.navbar-brand:focus {
	border:1px dotted black;
}

/* Line 1553 */
.navbar-inverse .navbar-nav>li>a:hover, 
.navbar-inverse .navbar-nav>li>a.link-focus {
	color: #cfb53b;
	outline: none;
}

/* Line 1566 */
.navbar-inverse .navbar-toggle:hover,.navbar-inverse .navbar-toggle:focus {
	background-color: #cfb53b;
	filter: alpha(opacity=100);
	opacity: 1;
	box-shadow: none;
}

/* Line 1563 -- navbar-toggle is rounded rectangle around the three-line menu */
.navbar-toggle:focus {
	border: none;
}
/* Line 1572 */
.navbar-toggle.active {
    background-color: transparent !important;
}
/* Line 1575 */
.navbar-toggle.collapsed {
	background-color: transparent !important;
}

/* Line 1607 */
.navbar-inverse .navbar-nav>li>a:hover, 
.navbar-inverse .navbar-nav>li>a:focus {
	color: #cfb53b;
}

/* Line 1611 */
.navbar-inverse .navbar-nav>li.current>a {
	color: #cfb53b;
	position: relative;
	outline: none;
}

/* Line 1620 */
li.current>a:before {
	background: #cfb53b;
}

/* Line 1631 */
ul.nav > li.current_page_item > a:before {
	background: #cfb53b;
}

/* Line 1647 */
ul.nav > li.current_page_item.current > a:before {
	background: #cfb53b;
}

/* Line 1672 -- Text on top of the photo on home page */
.intro-text {
	text-transform: none;
}


/*---------------------------------------
 **   Recent News Section -- Line ????
-----------------------------------------*/

/* 
#carousel-homepage-latestnews .item{
	height: 90px;
}
 */

/* Lines 1740-1754 -- Change lines below Recent News items to gold */
#carousel-homepage-latestnews .item .latestnews-box:nth-child(4n+1) .latestnews-title a:before {
	background: #cfb53b;
}
#carousel-homepage-latestnews .item .latestnews-box:nth-child(4n+2) .latestnews-title a:before {
	background: #cfb53b;
}
#carousel-homepage-latestnews .item .latestnews-box:nth-child(4n+3) .latestnews-title a:before {
	background: #cfb53b;
}
#carousel-homepage-latestnews .item .latestnews-box:nth-child(4n) .latestnews-title a:before {
	background: #cfb53b;
}


/* Line 1788 -- Focus box */
.focus-box .service-icon .pixeden {
    border-radius: 0;
}

/* custom -- trying this? */
i {
	background-size: contain !important;
}

/* Line 1808 -- Focus box (adjust size of person image) */
.focus-box .service-icon {
	margin-bottom: 30px;
	width: 174px;
	height: 217px;
	margin: auto;
	border-radius: 0;
	border: 0;
	margin-bottom: 20px;
	position: relative;
}

/* Line 1838 -- make lines below each name on People page gold */
.focus-box:nth-child(4n+1) .red-border-bottom:before {
	background: #cfb53b;
}
.focus-box:nth-child(4n+2) .red-border-bottom:before {
	background: #cfb53b;
}
.focus-box:nth-child(4n+3) .red-border-bottom:before {
	background: #cfb53b;
}
.focus-box:nth-child(4n+4) .red-border-bottom:before {
	background: #cfb53b;
}

/* Line 1850 -- Remove extra padding within this focus box */
.focus-box h3 {
	margin-bottom: 15px;
}


.focus-box:nth-child(4n+1) .service-icon:hover {
	border: 0;
}
.focus-box:nth-child(4n+2) .service-icon:hover{
	border: 0;
}
.focus-box:nth-child(4n+3) .service-icon:hover {
	border: 0;
}
.focus-box:nth-child(4n+4) .service-icon:hover{
	border: 0;
}


/*---------------------------------------
 **   Our Team Section -- Line 2346
-----------------------------------------*/

.our-team {
	padding-bottom: 66px;
	padding-top: 0px;
	background: #FFFFFF;
}
.team-member {
	border-radius: 4px;
	overflow: hidden;
	position: relative;
	margin-bottom: 35px;
}
.team-member .details {
	text-align: left;
	font-size: 13px;
	line-height: 20px;
	position: absolute;
	padding: 15px;
	top: -200px;
	left: 0;
	width: 100%;
	height: 190px;
	-webkit-transition: all 500ms;
	transition: all 500ms;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: alpha(opacity=0);
	opacity: 0;
}
.team-member .member-details {
	position: relative;
	display: inline-block;
	padding-bottom: 5px;
}
.team-member:hover .details {
	top: 0;
	background: #333;
	color: white;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	opacity: 1;
}
.team-member.team-member-open .details {
	display: block;
	top: 0;
	background: #333;
	color: white;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	opacity: 1;
	-webkit-transition: none;
	-moz-transition: none;
	-o-transition: none;
	transition: none;
}
.team-member .profile-pic {
	/* border-radius: 50%; */
	border-radius: 0;
	width: 174px;
	height: 217px;
	margin: auto;
	overflow: hidden;
	margin-bottom: 25px;
}
.team-member .profile-pic img {
	width: 100%;
	height: 100%;
}
.team-member h3 {
	text-transform: uppercase;
	color: #404040;
	font-weight: 700;
	font-size: 17px;
	position: relative;
	margin-top: 15px;
}
.team-member .position {
	font-size: 13px;
}
.team-member .social-icons {
	margin-bottom: 25px;
}
.team-member .social-icons ul {
	margin: 0 0 1.5em 0;
}
.team-member .social-icons ul li {
	display: inline-block;
	line-height: 32px;
	margin: 6px;
}
.team-member .social-icons ul li a {
	background: #FFF;
	font-size: 18px;
	border-radius: 50%;
	color: #808080;
}
.team-member .social-icons ul li a:hover {
	color: #e96656;
}
.our-team .row > div:nth-child(4n+1) .red-border-bottom:before{
    background: #cfb53b;
}
.our-team .row > div:nth-child(4n+2) .red-border-bottom:before{
    background: #cfb53b;
}
.our-team .row > div:nth-child(4n+3) .red-border-bottom:before{
    background: #cfb53b;
}
.our-team .row > div:nth-child(4n+4) .red-border-bottom:before{
    background: #cfb53b;
}



/*---------------------------------------
 **   Footer -- Line 2923
-----------------------------------------*/

/* Line 2925 -- Footer */
#footer {
	background: #000;
	line-height: 20px;
}

/* Line 2946 -- Copyright */
.copyright {
	padding-top: 68px;
	padding-bottom: 68px;
	background: #000;
	color: #939393;
}

/* Custom to remove Zerif copyright box */
.zerif-copyright-box {
	display: none;
}


/*---------------------------------------
 **   Blog Entries -- Line 3006
-----------------------------------------*/

article .posted-on a:hover{
	color: #cfb53b;
}

/* Lines 3072-3089 */
/* Make entry-footer, entry-title, and widget-title black, then gold when hovered */
.entry-footer,
.entry-footer a,
.entry-footer a:visited,
.entry-title,
.entry-title a,
.entry-title a:visited,
.widget-title,
.widget-title a,
.widget-title a:visited {
	color: #404040;
}

.entry-footer a:hover,
.entry-title a:hover,
.widget-title a:hover {
	color: #cfb53b;
}

/* Line 3115 -- draws line below the entry title */
.entry-title:after {
    position: absolute;
    margin: auto;
    z-index: 1;
    content: "";
    width: 10%;
    height: 2px;
    /* background: #e96656; */
    background: #cfb53b;
    bottom: -9px;
    left: 0;
}

/* Line 3025 -- blog post images */
/* This sets the size of the wrapper for the image */
.post-img-wrap {
	width: 200px;
	height: 250px; 
}

/* This makes the image its default size */
.post-img-wrap a img {
	width: auto;
	height: auto;
}


/* Line 4992 -- Permalink */
.bbp-body a.bbp-topic-permalink:hover {
	color: #cfb53b;
}

/* Line 5820 */
.navbar-inverse .navbar-nav > li > a:hover {
	color: #cfb53b !important;
}

/* Line 5823 -- deleted the lines on the mobile menu bar */
.navbar-inverse .navbar-nav > li {
	border-bottom: 0px;
}



/*---------------------------------------
 **   Not sure what stuff is below this -- maybe custom CSS for the Profile Template?
-----------------------------------------*/

.containerPeople > .people-image {
	height: 220px;
}

.containerPeople{
	max-width: 1020px;
	margin: 0 auto;
	background: #fff;
}

.people-image {
	position: absolute;
	margin: 10px auto;
	width: 182px;
	height: 182px;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
}

.containerPeople > .people-image {
	height: 220px;
}

.description {
	height: 200px;
	text-align: left;
	margin-left: 195px; 
	padding-top: 10px;
	line-height: 2em;
}

.people-block[selected] > .description {
	font-size: 1.5em;
	color: #333;
}

.description > h3 {
	margin: 0px;
}

.description a {
	color: #cfb53b;
	text-decoration: none;
}

.people-block > .content {
	display: none;
}
.people-block[selected] > .content {
	display: block;
	text-align: left;
	padding: 2em;
	line-height: 1.5em;
	color: #444;
}
.content {
	padding-top: 50px;
}
.content > h1 {
	font-size: 1.3em;
	text-align: left;
}
.content a {
	color: #cfb53b;
	text-decoration: none;
}
.content > p {
	padding-left: 1em;
    text-indent: -0.5em;
}
.content > p::before {
	content: '•';
	font-size: 0.7em;
}
.content > h1::after {
	content: '';
	display: inherit;
	width: 100px;
	height: 1px;
	margin: 1em 0em;
	background: #000;
}
.content > h2 {
	text-align: left;
	font-size: 1.1em;
}




/*---------------------------------------
 **   @media queries
-----------------------------------------*/

@media (max-width: 992px) {
	.focus {
		padding-top: 0px;
		padding-bottom: 0px;
	}
}

@media (max-width: 480px) {
	.navbar-brand {
		width: 270px;
	}
}


/* Fixes homepage header (navbar) -- goes back to full width when page shrinks */
@media (max-width: 1200px) {
	/* Full navbar */
	.navbar-home {
		background: linear-gradient(to top,rgba(69,69,69,0.75),rgba(51,51,51,0.75));
	}
	/* Container with text */
	.navbar-home .container {
		background: transparent;
	}
}


/* trying to fix our team alignment */
@media (max-width: 992px)
.col-sm-3 {
    width: 100% !important;
}