/*
Theme Name: VideoTube WWW
Description: A Video Hosted wordpress theme powered by Bootstrap, Youtube.com, Vimeo.com is supported.
Author: Toan Nguyen
GitLab Theme URI: http://gitlab.annenbergpublicpolicycenter.org/themes/videotube-child.git
GitLab CE: http://gitlab.annenbergpublicpolicycenter.org
Theme URI: http://themeforest.net/item/videotube-a-responsive-video-wordpress-theme/7214445?ref=phpface
Author URI: http://themeforest.net/user/phpface
Version: 1.3.1
Template: videotube 
License: GNU General Public License
License URI: license.txt
Text Domain: mars
Tags: fixed-layout, fluid-layout, responsive-layout, translation-ready, light, white, one-column, two-columns, right-sidebar,custom-menu, editor-style, featured-images,  sticky-post, theme-options, translation-ready
test*/
@import url("../videotube/style.css");
@import 'https://fonts.googleapis.com/css?family=Work+Sans:200,400';

body > .container {
  color: #123644;
  font-family: "Work Sans", sans-serif !important;
}

a {
  color: #123644;
}

.row {
  margin-right: -4px;
  margin-left: -4px;
}

.row > div {
  padding-right: 4px;
  padding-left: 4px;
}

.proportional-wrapper {
  width: 100%;
  position: relative;
  margin: 2px 0 2px 0;
  padding-bottom: 62.33%;
}

.focus-block-landscape > .row {
  margin-bottom: 22px;
}

.focus-block-landscape .proportional-wrapper:nth-last-child(2) {
  margin: 2px 0 5px 0;
}

.focus-block-portrait .col-md-12 .proportional-wrapper {
  padding-bottom: 97.125%;
}

.focus-block-portrait .focus-stack-secondary .proportional-wrapper {
  margin: 3px 0 0 0;
}

.focus-block-portrait > .row {
  margin-left: 22px;
}

.proportional-wrapper .link-card {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.home h2, h3 {
  padding-bottom: 8px;
  z-index: 1;
  letter-spacing: 0;
  padding-left: 8px;
}

.home h2 {
  font-size: 600%;
  font-weight: 200;
}

.home h3 {
  position: absolute;
  font-size: 88%;
  text-transform: uppercase;
  font-weight: 400;
  bottom: 0;
}

.politics h3 {
  right: 0;
  margin-top: 20px;
  margin-bottom: 10px;
  padding-right: 22px;
  text-align: right;
}

.focus-block-landscape, .focus-block-portrait {
  padding-right: 4px !important;
  padding-left: 4px !important;
}

.link-card {
  border-radius: 6px;
  padding: 12px;
}

.floating-button {
  border-radius: 500px;
  height: 10em;
  width: 10em;
  position: absolute;
  box-shadow: 0px 3px 22px rgba(0, 0, 0, 0.16);
  z-index: 55;
  margin-bottom: -15%;
  -webkit-transition: all 1s ease-in-out;
  transition: all 1s ease-in-out;
}

.floating-button svg {
  height: 6em;
  display: block;
  margin: 0 auto;
  -webkit-transform: translateY(35%);
  transform: translateY(35%);
  -webkit-transition: all 1s ease-in-out;
  transition: all 1s ease-in-out;
}

.floating-button:hover svg leftcircle {
  -webkit-transform: translateY(50%);
	transform: translateY(50%);
  }
  
  .floating-button:hover {
  box-shadow: 5px 12px 32px rgba(0, 0, 0, 0.3);
}

.floating-button.health {
  bottom: 0;
  right: 35%;
}

.floating-button.politics {
  bottom: 48%;
  right: -17%;
}

.floating-button.science {
  bottom: 48%;
  left: -17%;
}

.politics {
  background: #34BEDA;
}

.health {
  background: #FCDC85;
}

.science {
  background: #4CBEA2;
}

.politics h2 {
  position: absolute;
  bottom: 0;
}

.health h2 {
  position: absolute;
  top: 0;
  right: 0;
  padding-right: 24px;
}

.science h2 {
  position: absolute;
  bottom: 0;
  right: 0;
  padding-right: 24px;
}

.link-card img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: auto;
  opacity: 0.1;
  -webkit-transition: all 1s ease-in-out;
  transition: all 1s ease-in-out;
  border-radius: 6px;
  -webkit-filter: blur(2px);
  filter: blur(2px);
}

.link-card:hover img {
  opacity: 0.5;
  -webkit-filter: blur(0);
  filter: blur(0);
}

.link-card:hover h2,
.link-card:hover h3 {
  letter-spacing: 0.03em;
  color: #123644;
}

.link-card h2,
.link-card h3 {
  -webkit-transition: all 1s ease-in-out;
	transition: all 1s ease-in-out;
  }
  
  /* ******************* */
  /* SVG Scale Animation */
  /* ******************* */
  .floating-button.politics svg .arms {
	-webkit-transform-origin: 50% 50%;
	  transform-origin: 50% 50%;
	}
	
	.floating-button.politics:hover svg .rightbowl {
  -webkit-transform: translateY(34%);
	transform: translateY(34%);
  }
  
  .floating-button.politics:hover svg .leftbowl {
  -webkit-transform: translateY(-34%);
	transform: translateY(-34%);
  }
  
  .floating-button.politics:hover svg .arms {
  -webkit-transform-origin: 50% 50%;
	transform-origin: 50% 50%;
	-webkit-transform: rotateZ(25deg);
	transform: rotateZ(25deg);
  }
  
  .floating-button.politics svg .leftcircle,
.floating-button.politics svg .rightcircle,
.floating-button.politics svg .rightbowl,
.floating-button.politics svg .leftbowl,
.floating-button.politics svg .arms {
  -webkit-transition: all 1s ease-in-out;
	transition: all 1s ease-in-out;
  }
  
  /* ******************* */
  /* SVG Cube Animation */
  /* ******************* */
  .floating-button.science svg {
	-webkit-transform: translateY(34%);
	  transform: translateY(34%);
	}
	
	.floating-button.science svg .connectors {
  stroke-dasharray: 22;
  stroke-dashoffset: 0;
}

.floating-button.science:hover svg .connectors {
  stroke-dasharray: 22;
  stroke-dashoffset: 44;
}

.floating-button.science:hover svg .frontface {
  -webkit-transform: translateX(32%) translateY(-32%);
	transform: translateX(32%) translateY(-32%);
  }
  
  .floating-button.science:hover svg .backface {
  -webkit-transform: translateX(-32%) translateY(32%);
	transform: translateX(-32%) translateY(32%);
  }
  
  .floating-button.science svg .connectors,
.floating-button.science svg .frontface,
.floating-button.science svg .backface {
  -webkit-transition: all 1s ease-in-out;
	transition: all 1s ease-in-out;
  }
  
  /* ******************* */
  /* SVG Heart Animation */
  /* ******************* */
  .floating-button.health svg {
	height: 5em;
	display: block;
	margin: 0 auto;
	-webkit-transform: translateY(50%);
	transform: translateY(50%);
	-webkit-transition: all 1s ease-in-out;
	transition: all 1s ease-in-out;
  }
  
  .floating-button.health svg .ekg {
  stroke-dasharray: 400 40;
  stroke-dashoffset: 0;
}

.floating-button.health:hover svg .ekg {
  stroke-dasharray: 400 40;
  stroke-dashoffset: -440;
}

.floating-button.health:hover svg .dial {
  -webkit-transform: rotate(230deg);
	transform: rotate(230deg);
  }
  
  .floating-button.health svg .ekg,
.floating-button.health svg .dial {
  -webkit-transition: all 1s ease-in-out;
	transition: all 1s ease-in-out;
	-webkit-transform: rotate(0deg);
	transform: rotate(0deg);
	-webkit-transform-origin: 50% 50%;
	transform-origin: 50% 50%;
  }
  
  @media (max-width: 1199px){
  h2 {
	font-size: 420%;
  }
  .focus-block-portrait .col-md-12 .proportional-wrapper {
  padding-bottom: 99.75%;
}
.floating-button.health {
  bottom: -5%;
  right: 30%;
}
.floating-button.science {
  bottom: 45%;
  left: -20%;
}
.floating-button.politics {
  bottom: 45%;
  right: -20%;
}
}
@media (max-width: 991px){
	.home h2 {
		font-size: 500%;
	}
	.focus-stack-secondary, .floating-button {
		display:none;
	}
	.proportional-wrapper {
		width: 100%;
		position: relative;
		margin: 2px 0 2px 0;
    	padding-bottom: 16% !important;
	}
	.science h2,
	.health h2, 
	.politics h2 {
		position: absolute;
		bottom: 0;
		top:auto;
		right: 0;
		padding-right: 24px;
	}
	.link-card img {
		max-height: 50%;
		display: none;
	}
	.focus-block-portrait > .row {
		margin-left: -4px;
	}
	body > .container {
		padding-bottom: 22px;
	}
}
@media (max-width: 767px) {
	.home h2 {
		font-size: 150%;
	}
}
.incivility .alert {
	display:none;
}
.ubermenu.ubermenu-main {
	z-index: 999999;
}
.html5-video-player {
    z-index: -1;
}
.post-entry p {
    z-index: -1;
}

/* about page ribbon styles */
.cq-ribbon-content{
	padding-top:30px !important;
	
}
.cq-ribbon-container {
    box-shadow: 0 4px 0px 0 rgba(0, 0, 0, 0.1), 0 0px 8px 0 rgba(0, 0, 0, 0.05)!important;
    border: 1px solid #ddd;
}
.page-id-14240 .wpb_button, .wpb_content_element, ul.wpb_thumbnails-fluid>li {
    margin-bottom: 0;
}

.ubermenu-skin-blue-silver, .ubermenu, .ubermenu .ubermenu-target-text {
	font-size: 14px!important;
}
/* fix ubermenu garbage */
.ubermenu-skin-blue-silver.ubermenu-responsive-toggle {
	    display: none;
}
.navbar-collapse.in {
    overflow-y: visible;
}