/* Header / Nav */
.logo-white { background: url('/wp-content/themes/tettra-2016/images/dark_logo.png') no-repeat; background-size: contain; }
.mobile-burger { display: none; color: #7b7b7b; }
.site-header-main { position: relative; }
.site-branding a { display: inline-block; }
.site-branding .logo { width: 113.5px; height: 36px; }
.site-branding { display: inline-block; vertical-align: middle; border-radius: 8px; }
div#site-header-menu { display: inline-block; float:right; vertical-align: middle; padding-right: 32px; }
ul#menu-main-navigation { margin: 0; padding: 0; list-style: none; }
ul#menu-main-navigation li a { line-height: 36px; position: relative; }
ul#menu-main-navigation li { display: inline-block; margin-right: 32px; }
ul#menu-main-navigation li:last-child { margin-right: 0; }
.login { float: right;}
.login .login-button { float: right; margin:0;}
.login .button-text { font-size: 17px; font-weight: 600; letter-spacing: 1.23px; text-transform: uppercase; }

ul#menu-main-navigation li a:hover, ul#menu-main-navigation li a:focus {
    text-decoration: none;
}

.site-header.fixed-header { width: 100% !important; position: fixed !important; background-color: white; }
.site-header.shadow ul#menu-main-navigation li a { color: #7B7B7B; }
.site-header.shadow .mobile-burger { color: #7B7B7B; }

.site-header .interior-page ul#menu-main-navigation li a { color: #7B7B7B; }
.site-header.interior-page { background-color: white; height: 80px; box-shadow: 0 2px 2px -2px gray; }

.site-header-menu ul.primary-menu button.dropdown-toggle { display: none; }

@media screen and (min-width:900px){

  ul#menu-main-navigation li:not(.menu-item-has-children) a:hover::after, ul#menu-main-navigation li:not(.menu-item-has-children) a:focus::after {
    opacity: 1;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    transform: translateY(0px);
  }
  ul#menu-main-navigation > li:not(.menu-item-has-children) a::after {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    height: 4px;
    background: #E11665;
    content: '';
    opacity: 0;
    -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
    -moz-transition: opacity 0.3s, -moz-transform 0.3s;
    transition: opacity 0.3s, transform 0.3s;
    -webkit-transform: translateY(10px);
    -moz-transform: translateY(10px);
    transform: translateY(10px);
  }

  .site-header-menu ul.primary-menu ul.sub-menu {  }

  .site-header-menu ul.primary-menu li.menu-item-has-children > a::after {
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid #3AA3E3;
    content: "";
    display: block;
    position: absolute;
    top: 8px;
    right: -14px;
  }

  .fixed-header .site-header-menu ul.primary-menu li.menu-item-has-children > a::after { border-top: 5px solid #7B7B7B; }

  .site-header-menu ul.primary-menu li.menu-item-has-children { padding-right: 16px; }

  .site-header-menu ul.primary-menu li.menu-item-has-children:hover { cursor: pointer; }

  .site-header-menu ul.primary-menu li.menu-item-has-children:hover > ul.sub-menu {
    display: block;
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    transform: translateY(0px);
  }

  .site-header-menu ul.primary-menu ul.sub-menu {
    position: absolute;
    margin-left: -15px;
    border-top: 4px solid #E11665;
    top: 100%;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
    -moz-transition: opacity 0.3s, -moz-transform 0.3s;
    transition: opacity 0.3s, transform 0.3s;
    -webkit-transform: translateY(10px);
    -moz-transform: translateY(10px);
    transform: translateY(10px);
  }

  .site-header-menu ul.primary-menu ul.sub-menu li.menu-item {
    display: block !important;
    margin-bottom: 4px;
  }

  .site-header-menu ul.primary-menu ul.sub-menu li.menu-item > a:hover {
    color: #E11665;
  }

}

@media screen and (max-width: 480px){
  .site-header .login { display:none; }
}
@media screen and (max-width:900px){
  .mobile-burger { float: left; font-size: 35px; cursor: pointer; display: inline-block; line-height: 1;}
  div#site-header-menu { display: none; padding: 0; width: 100%; box-sizing: border-box; position: absolute; top: 52px; }
  ul#menu-main-navigation li { display: inline-block; margin-right: 0; width: 100%; text-align: center; padding: 25px 0; background-color: white; border-bottom: 1px solid #dadada; }
  ul#menu-main-navigation li a { color: #333; }
  ul#menu-main-navigation li:first-child { border-top: 1px solid #dadada; }
  .site-header-menu ul.primary-menu ul.sub-menu { display: none; }
  .site-header-menu ul.primary-menu li.menu-item-has-children:hover > ul.sub-menu { display: none; }
}

/* Footer */
.page-bottom {  padding: 64px 32px 128px; }
.page-bottom .section-title { color: white; }
.site-footer { text-align: center;  color: #fff; }
.site-footer ul { list-style: none; margin: 0; display: inline-block; padding: 64px 0; }
.site-footer a {  color: #fff; }
.site-footer ul li { display: inline-block; margin-right: 32px; }
.site-footer ul li:last-child { margin-right: 0; }
.site-info { margin-top: 64px; font-family: 'Lato', sans-serif; line-height: 18px; }
.site-info a { font-family: 'Lato', sans-serif; font-size: 15px; letter-spacing: -0.15px; line-height: 18px; }
.site-info span { padding: 0 15px; border-right: 1px solid #fff; }
.site-info span:last-child { border: none; }

/* Front page */
.hero-section { padding: 100px 0 100px 0; background-color: #73b3d1; }
.hero-section .title { text-shadow: 0px 1px 2px rgba(0,0,0,.25) }
.hero-section h1 { margin: 0; }
.hero-section .hero-image { max-width: 750px; }
.hero-section .left, .hero-section .right { display: inline-block; vertical-align: middle; }
.hero-section .left { margin-left:-20px; width: 55%; }
.hero-section .right { width: 45%; padding: 0 25px; box-sizing: border-box; }
.hero-section .right .inner { max-width: 460px; margin: 0 auto; }
.hero-section .banner-sub-header { font-family: 'Lato', sans-serif; color: white; font-size: 20px; margin-bottom:0; font-weight: 400;}
.hero-section .illustration-left { float: left; }
.hero-section .illustration-right { float: right; }
.hero-break { height: 21px; }

.hero-help-text {display:inline-block; margin: 16px 0 0; width: 100%; max-width: 360px; text-align: center; font-weight: bold; color: white;}

/* One Column Page */
.one-column-page .body-content { margin: 64px auto 100px; max-width: 750px; }
.one-column-page .body-content h1 { color: #000; font-weight: 600; }
.one-column-page .body-content h3 { color: #000; font-weight: 600; }
.one-column-page .body-content strong { color: #000; }
.one-column-page .body-content time { color: #66A5B4; }
.one-column-page .body-content a { color: #66A5B4; }
.one-column-page .body-content a:hover { text-decoration: underline; }
.one-column-page .body-content, .one-column-page .body-content p { font-size: 18px; color: #333; line-height: 1.6em; }
.one-column-page .body-content .entry-meta { font-size: 14px; padding: 15px 0px; }

.about-avatar {
	width: 175px;
	height: 175px;
}

blockquote p { margin-bottom: 0; }


/* /blog */

.blog-submenu li.inline-block a:hover, .blog-submenu li.current-menu-item a {
	text-decoration: none;
	border-bottom: 3px solid #ee1165;
	padding-bottom: 3px;
}

@media (max-width: 52em) {

  .blog-submenu li.inline-block {
    width: 100%;
    padding-left: 25px;
    padding-bottom: 10px;
  }

}

.post-meta {
	opacity: 0.75;
}

.longform-text {
	font-family: 'Roboto Slab', Georgia, 'Times New Roman', Times, serif;
	line-height: 1.85em;
	font-size: 18px;
}
.longform-text p,
.longform-text ol,
.longform-text ul  {
	margin-bottom: 1.85em;
}
.longform-text .alignleft {
	float: left;
	margin-right: 1.85em;
}

.longform-text img {
	max-width: 100%;
	height: auto;
}

.longform-text blockquote p { margin-bottom: 0; }

.list-block {
	padding-left: 0px;
}

.list-block li {
	background: #f8f8f8;
	border-left: 6px solid #e7e7e7;
	padding: 15px 15px 15px 30px;
	margin: 0 0 15px 0;
	list-style: none;
}

div.smart-track-player, ul.player-list {
	margin: 0px 0 !important;
}

.podcast-player-list {
	background: #252525;
	padding: 15px 15px 0 15px;
	color: #fff;
}

.podcast-player-list img {
	max-height: 28px;
	max-width: 36px;
}

.podcast-player-list .review-link:hover, 
.podcast-player-list .review-link:focus,  {
	color: #ee1165;
	text-decoration: underline;
}

.wistia_responsive_padding {
	margin-bottom: 30px;
}

.download-icon {
	margin-top: -3px;
}

.templates-sidebar {
	padding-right: 25px;
}

.template-container {
  margin-top: -200px;
}

@media screen and (max-width:800px){
	.templates-categories {
		display: none !important;
	}
}