/*
	Title:		BidMetrics
	Date:		Nov 10, 2014
-------------------------------------	
*/

/*=========== BEGIN COMMON ============*/
	
html,body { width: 100%; height: 100%;}
body, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, samp, small, sub, sup, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, object, iframe{
	margin:0;
	padding:0;
	border:0;
}
body {
	font-size: 18px;
	line-height: 30px;
	color: #333333;
	-webkit-text-size-adjust: 100%;
	-moz-text-size-adjust: 100%;
	font-family: 'Lato', sans-serif;
	font-weight: 400;
	background: #0f282f;
}

*{
   -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}	
input[type="checkbox"],
input[type="radio"] {
	box-sizing: border-box;
	padding: 0;
	margin: 0px 8px 0 0;
	line-height: normal;
	position: relative;
	top: 1px;
}

input[type="file"] {
  display: block;
}

article, aside, canvas, figure, figure img, figcaption, hgroup, footer, header, nav, section, summary, audio, video, details, address {
	display: block;
}
	
.row,
.rowIn {
	clear: both;
	max-width: 100%;
}
.wrap {
	clear: both;
	width: 100%;
}
.column {
	float: left;
	width: 50%;
	padding: 0 10px;
}
a { 
	text-decoration: none; 
	outline: none; 
	color: #14abe8;
	-webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out;
}
a:hover { text-decoration: underline}
img { height: auto; max-width: 100%; display: inline-block; vertical-align: top}
.img { width: 100%;}
a img {border: 0}
a,input,select,textarea {outline: none}
input::-moz-focus-inner {border: 0; padding: 0}

.clear:after,
.row:after,
.rowIn:after,
.column:after,
.wrap:after,
nav:after,
header:after,
.header-content:after,
.header-right:after,
.header-container:after,
.header-search-options:after,
.banner-container:after,
.body-content:after,
.content-left:after,
.content-right:after,
.checkout-form:after,
.footer-container:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0}


.blue-btn,
.grey-btn,
.green-btn,
.red-btn,
.orange-btn {
	width: 100%;
	height: 60px;
	padding: 16px 0;
	font-size: 24px;
	line-height: 26px;
	text-align: center;
	margin: 20px auto 0;
	display: block;
	color: #fff;
	border: 0;
	cursor: pointer;
	-webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out;
	background: url(../images/blue-bg.png) repeat;
	font-family: 'Lato', sans-serif;
	-webkit-border-radius: 5px; 
    -moz-border-radius: 5px; 
    border-radius: 5px;
	position: relative;
}
.grey-btn {
	background: url(../images/grey-bg.png) repeat;
}
.green-btn {
	background: url(../images/green-bg.png) repeat;
}
.red-btn {
	background: url(../images/red-bg.png) repeat;
}
.orange-btn {
	background: url(../images/orange-bg.png) repeat;
}
.blue-btn:hover,
.grey-btn:hover,
.green-btn:hover,
.red-btn:hover,
.orange-btn:hover {
	text-decoration: none;
	background: url(../images/dark-blue.png) repeat;
}

.txtField,
.txtarea,
.selectBx {
	display: inline-block;
	vertical-align: middle;
	width:  100%;
	height: 60px;
	padding: 15px 0 15px 20px;
	margin: 0;
	line-height: 30px;
	border: 2px solid #c2c2c2;
	background: url(../images/white-bg.png) repeat;
	color: #9c9c9c;
	font-size: 24px;
	-webkit-border-radius: 5px; 
    -moz-border-radius: 5px; 
    border-radius: 5px;
	font-family: 'Lato', sans-serif;
}
.selectBx {
	height: auto;
	line-height: normal;
	padding: 13px 3px 14px 20px;
}	
.txtarea {
	float: left;
	height: 380px;
	padding: 15px 0 0 20px;
	line-height: 30px;
	resize: none;
}
.txtField:focus,
.selectBx:focus,
.txtarea:focus {
	border-color: #666;
}

h1 {
	font-size: 60px;
	line-height: 62px;
	margin: 0 0 40px;
	color: #fff;
	font-size: 54px\0/;
	font-weight: 400;
}
h2 {
	margin: 0 0 40px;
	font-weight: 700;
	font-size: 40px;
	line-height: 44px;
	font-size: 36px\0/;
}
h3 {
	font-size: 26px;
	line-height: 30px;
	margin: 0 0 15px;
	font-weight: 700;
}
h4 {
	font-size: 18px;
	line-height: 22px;
	margin: 0 0 10px;
	font-weight: 700;
}
h5 {
	font-size: 26px;
	line-height: 30px;
	margin: 35px 0 15px;
	font-weight: 700;
}

p {
	margin: 0 0 40px;
	padding: 0;
}
strong {
	font-weight: 700;
}
ul {
	margin: 0 0 40px;
	padding: 0;
	list-style: none;
}
li {
	margin: 7px 0 7px 0;
	padding: 0 0 0 25px;
	background: url(../images/disc-bullet.png) no-repeat 0 10px;
}
.blackline {
	clear: both;
	width: 100%;
	height: 40px;
	margin-top: 45px;
	border-top: 1px solid #000;
}
.txtSize18 {
	font-size: 18px;
}
.txtSize11 {
	font-size: 11px;
}
.bold-txt {
	font-weight: 700;
}
.skyTxt {
	color: #009cd8;
}
.capsTxt {
	text-transform: uppercase;
}
.pull-right { float: right !important;}
.pull-left { float: left !important;}
.pull-center { margin-left: auto; margin-right: auto;}
.align-left { text-align: left;}
.align-right { text-align: right;}
.align-center { text-align: center;}
.main-container {
	clear: both;
	margin: 0;
	padding: 0;
    min-height: 100%;
    min-width: 100%;
    position: relative;
}
.body-container {
	clear: both;
	width: 100%;
	background: #fff;
	overflow: hidden;
}
.body-content {
	clear: both;
	max-width: 1200px;
	margin: 0 auto;
	padding: 70px 0 120px;
}
.content-left {
	float: left;
	width: 62%;
	padding-right: 50px;
}
.content-right {
	float: right;
	width: 38%;
}
.light-grey {
	background: #f6f6f6;
}
.dark-grey {
	background: #e1e1e1;
}
.grey-bg {
	background: #ececec;
}
/*=========== END COMMON ============*/


/*========== BEGIN HEADER ==========*/
header {
	width: 100%;
	position: relative;
	z-index: 99;
	background: #5bb77b url(../images/header-bg.png) repeat-y left top;
}
.grid-bg {
	width: 100%;
	background: url(../images/grid-bg-single.png) repeat;
	/*background: url(../images/grid-bg.png) no-repeat center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;*/
}
.header-container {
	clear: both;
	margin: 0 auto;
	max-width: 100%;
	max-height:132px;
	position: relative;
	z-index: 10001;
	background: url(../images/transparent-bg.png) repeat;
}
.header-content {
	clear: both;
	max-width: 100%;
	margin: 0 auto;
	padding: 40px;
}
.logo {
	float: left;
	width: 16%;
}
.trial-button {
	float: left;
	width: 12%;
}
.trial-button .blue-btn {
	margin: 0;
	padding: 10px 0;
	height: 43px;
	font-size: 18px;
	line-height: 18px;
	margin-top: 2px;
}
.trial-button .blue-btn:hover {
	background: #000000;
}
.trial-button .orange-btn {
	margin: 0;
	padding: 10px 0;
	height: 43px;
	font-size: 18px;
	line-height: 18px;
	margin-top: 2px;
}
.trial-button .orange-btn:hover {
	background: #000000;
}
.header-right {
	float: right;
	width: 72%;
}

.main-nav {
	float: right;
}
.phone-nav { display:none;}
.main-nav ul{
	margin:0;
	padding: 0;
	list-style:none;
}
.main-nav li{
	float: left;
	margin:0;
	padding: 10px 0 0 50px;
	position:relative;
	background: none;
}

.main-nav li a{
	/*float:left;*/
	padding: 0 0 10px;
	margin-top: 7px;
	display:block;
	font-size:16px;
	/*height:89px;*/
	line-height: 20px;
	color:#d3dede;
	position:relative;
	text-transform: uppercase;
	border-bottom: 5px solid transparent;
}

.main-nav li a:hover,
.main-nav li.active a {
	color: #fff;
	text-decoration:none;
	border-bottom-color:#14abe8;
}

/*========== END HEADER ==========*/	

/*========== BEGIN BANNER ==========*/
.banner-container {
	clear: both;
	margin: 0 auto;
	max-width: 100%;
	position: relative;
	z-index: 3;
	min-height: 265px;
	text-align: center;	
	overflow: hidden;
}
.banner-container h1 {
	margin: 0;
	font-style: italic;
	padding: 95px 0 0;
	text-shadow: 1px 1px 5px rgba(4,62,71,0.5);
}
/*========== END BANNER ==========*/	

/*========== BEGIN SERVICES ==========*/	
.video-space {
	clear: both;
	width: 100%;
	overflow: hidden;
	margin-bottom: 35px;
}
/*========== END SERVICES ==========*/	

/*========== BEGIN DOWNLOADS ==========*/
.info-bank {
	clear: both;
	width: 102.4%;
	margin-left: -13px;
	margin-right: -13px;
	overflow:hidden;
}
.info-bank-item {
	display:inline-block;
	padding: 10px 13px 20px;
	width: 33%;
	vertical-align: top;
}

.download-content{
	clear: both;
	width: 100%;
	overflow: hidden;
	padding: 40px;
	background: #e1e1e1;
}
.download-content p {
	margin-bottom: 25px;
}
.download-content .blue-btn {
	margin-top: 0;
	text-transform: none;
}

/*========== END DOWNLOADS ==========*/

/*========== BEGIN CONTACT ==========*/
.contact-form {
	clear: both;
	width: 100%;
	overflow: hidden;
}
.contact-form h2 {
	font-size: 36px;
	line-height: 40px;
	margin-bottom: 20px;
}
.contact-form h3 {
	font-size: 30px;
	margin-bottom: 40px;
	line-height: 34px;
	font-weight: 400;
}
.field-row {
	max-width: 103%;
	margin-left: -13px;
	margin-right: -13px;
	margin-bottom: 50px;
}
.field-row .column,
.field-row .wrap {
	padding: 0 13px;
}
.field-row span {
	color: #eb4247;
}
.field-row label {
	float: left;
	padding-bottom: 15px;
}
.contact-form .send-btn {
	font-size: 26px;
	float: right;
	width: 185px;
	margin-top: 0;
}
/*========== END CONTACT ==========*/

/*========== BEGIN THOUGHT LEADERSHIP ==========*/
.leadership-content {
	clear: both;
	width: 100%;
	overflow: hidden;
	margin-bottom: 80px;
}
.leadership-content h2 {
	margin-bottom: 30px;
}
.leadership-content h2 a {
	color: #333;
}
.leadership-content h2 a:hover {
	text-decoration: none;
	color:#14abe8;
}
.leadership-content p {
	margin-bottom: 15px;
}
.post-date {
	clear: both;
	width: 100%;
	border-top: 1px solid #d1d1d1;
	border-bottom: 1px solid #d1d1d1;
	overflow: hidden;
	padding: 18px 0 20px;
	margin-bottom: 35px;
	font-size: 22px;
	line-height: 28px;
}
.img-space {
	clear: both;
	width: 100%;
	overflow: hidden;
	margin-bottom: 35px;
}
.article-btns .grey-btn {
	width: 48%;
	float: left;
	margin: 0;
}
.article-btns .grey-btn span {
    left:0; 
	top:0px;
    width:60px; 
	height:60px;
    background: url(../images/prev-arrow.png) no-repeat center;
    position:absolute;
    display:block;
}
.article-btns .pull-right span {
	left: auto;
	right: 0;
    background: url(../images/next-arrow.png) no-repeat center;
}

.content-right .download-content {
	margin-bottom: 30px;
}
.cat-links{
	clear: both;
	width: 100%;
	overflow: hidden;
	padding: 40px;
	background: #e1e1e1;
	margin-bottom: 30px;
}
.cat-links ul {
	list-style: none;
	padding: 0;
	margin: 0;
}
.cat-links li {
	margin: 0;
	padding: 10px 0;
	background: none;
}
.cat-links li a {
	color: #14abe8;
	font-size: 24px;
	line-height: 28px;
}

/*========== END THOUGHT LEADERSHIP ==========*/
	
/*========== BEGIN HOME ==========*/

.home-container {
	height: 100%;
}
.home-container .header-container {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
}
.home-slide {
	width: 100%;
	margin-bottom: 4%;
}
.home-slide ul {
	margin:0 auto;
	padding:0;
	list-style:none;
}		
.home-slide li.slide {
	margin:0;
	padding:0;
	list-style:none;
	background: none;
	text-align: center;
	display: none;
	/*margin-right:100%!important;*/
}


.home-container header,
.home-container .grid-bg {
	min-height: 100%;
	height: 100%;
	overflow: hidden;
}
.home-container .grid-bg{
	height: 180%;
	z-index: -1;
	position: absolute;
	left: 0;
	top: 0;
}
.home-container .banner-container h1{
	/*padding: 0 0 20px;
	margin: 0;*/
	padding: 15px 0 20px;
    margin: 0;
    line-height: 56px;

}
.home-container .banner-container{
	max-width: 1200px;
	/*margin: -60px 0 0 -600px;*/
	margin: -100px 0 0 -600px;
	min-height: 190px;
	color: #fff;
	position: absolute;
	left: 50%;
	top: 50%;
}
.home-container .banner-container strong{
	float: right;
	font-size: 30px;
	line-height: 32px;
	font-weight: 300;
	text-shadow: 1px 1px 4px rgba(4,62,71,0.5);
}
/*
.home-container .body-container {
	height: 100%;
	min-height: 100%;
}
*/
.chart-overlay {
	width: 100%;
	height: 150%;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;
}

#scroll-down-arrows{
	width: 50px;
	height: 40px;
	bottom: 30px;
	left: 50%;
	margin: 0 0 0 -25px;
	position: absolute;
	z-index: 9999;
	cursor: pointer;
	overflow: hidden;
}

.scroll-arrow {
	position:absolute;
	left:0;
	top:0;
	display: block;
	width: 50px;
	height: 40px;
	cursor: pointer;
	text-decoration:none;
	z-index:1;
	display:none
}
.section-1{
	display:block;
	background: url(../images/down-arrow.png) no-repeat center;
}
.section-2 {
	background: url(../images/down-arrow2.png) no-repeat center;
}
.section-3 {
	background: url(../images/down-arrow3.png) no-repeat center;
}
.section-4 {
	background: url(../images/down-arrow4.png) no-repeat center;
}
.section-5 {
	background: url(../images/down-arrow5.png) no-repeat center;
}
.section-0 {
	background: none;
}
.home-content {
	max-width: 1100px;
	min-height: 500px;
	padding: 100px 0;
}
.home-content .column {
	padding-left: 35px;
	padding-right: 35px;
}
.home-content p {
	width: 95%;
	font-size: 44px;
	line-height: 50px;
}
.home-content .btn {
	margin: 0;
	width: 250px;
}
.sec1-slide {
	width: 100%;
	height: 380px;
	position: relative;
}
.sec1-slide img {
	position: absolute;
	right: 0;
	top: 0;
}
.sec1-slide .sec1-slide-img1 {
	z-index: 2;
}
.sec1-slide .sec1-slide-img2 {
	z-index: 1;
}

.sec2-slide {
	width: 100%;
	height: 405px;
	position: relative;
}
.sec2-slide img {
	position: absolute;
	left: 0;
	top: 0;
}
.sec2-slide .sec2-slide-img1 {
	z-index: 1;
}
.sec2-slide .sec2-slide-img2 {
	z-index: 2;
}
.sec2-slide .sec2-slide-img3 {
	z-index: 3;
}

.sec3-slide {
	width: 100%;
	height: 362px;
	position: relative;
}
.sec3-slide img {
	position: absolute;
	right: 0;
	top: 0;
}
.sec3-slide .sec3-slide-img1 {
	z-index: 1;
}
.sec3-slide .sec3-slide-img2 {
	z-index: 2;
}
.sec3-slide .sec3-slide-img3 {
	z-index: 3;
}

.sec4-slide {
	width: 100%;
	height: 374px;
	position: relative;
}
.sec4-slide img {
	position: absolute;
	left: 0;
	top: 0;
}
.sec4-slide .sec4-slide-img1 {
	z-index: 1;
}
.sec4-slide .sec4-slide-img2 {
	z-index: 2;
}
.sec4-slide .sec4-slide-img3 {
	z-index: 3;
}

/*========== END HOME ==========*/


/*========== BEGIN FOOTER ==========*/
.bottom-container {
	clear: both;
	width: 100%;
	text-align: center;
	background: #038bc1 url(../images/btm-bgY.png) repeat-y 0 0;
}
.logo-pattern {
	min-height: 445px;
	width: 100%;
	background: url(../images/logo-pattern.png) repeat;
}
.bottom-content {
	max-width: 1200px;
	margin: 0 auto;
	overflow: hidden;
}
.bottom-content h2 {
	color: #fff;
	font-weight: 400;
	font-style: italic;
	padding-top: 170px;
	margin: 0;
	text-shadow: 1px 1px 4px rgba(4,62,71,0.5);
}	
footer {
	clear: both;
	width: 100%;
}
.footer-container {
	clear: both;
	width: 100%;
}
.footer-content {
	max-width: 1200px;
	margin: 0 auto;
	padding: 60px 0;
	overflow: hidden;
	text-align: center;
	font-size: 18px;
	line-height: 22px;
	color: #fff;
}
.footer-content ul {
	list-style:none;
	margin: 0;
	padding: 0;
}
.footer-content li {
	background: none;
	margin: 0;
	padding: 0;
	display: inline-block;
	vertical-align: middle;
	margin-right: 5px;
}
.footer-content span {
	display: block;
	padding-bottom: 10px;
}
.footer-content li a{
	color: #fff;
	margin-right: 5px;
	font-size: 18px;
	line-height: 22px;
}

/*========== END FOOTER ==========*/
.padd-10{
	padding-left: 10px;
	padding-right: 10px;
}
.BPadd10 {
	padding-bottom: 10px;
}
.BPadd70 {
	padding-bottom: 70px;
}
.TPadd10 {
	padding-top: 10px;
}
.TPadd15 {
	padding-top: 15px;
}
.TPadd20 {
	padding-top: 20px;
}
.padd-50 {
	padding-left: 50px;
	padding-right: 50px;
}
.TMargin20 {
	margin-top: 20px;
}
.TMargin30 {
	margin-top: 30px;
}
.TMargin40 {
	margin-top: 40px;
}
.BMargin30 {
	margin-bottom: 30px;
}
.BMargin40 {
	margin-bottom: 40px;
}
.TMargin0 {
	margin-top: 0;
}
.w100 {
	width: 100px;
}
.w190 {
	width: 190px;
}
.w90 {
	width: 90px;
}
.w240 {
	width: 240px;
}
.w290 {
	width: 290px;
}
.w360 {
	width: 360px;
}
.percent24{
	width: 24%;
}
.for-mobile {
	display: none;
}
.for-desktop {
	display: block;
}

.parallax{
  position: absolute;
  width: 100%;
  height: 300%;
  top:0;
  left:0;
  z-index: -1;
}

/*** Add new 11-24-2014 ***/
.article-btns .grey-btn {
	padding: 0;
}
.nextprev-btn {
	height: 100%;
	padding: 16px 0;
	color: #fff;
	display: block;
}
.nextprev-btn:hover {
	text-decoration: none;
}


/*** Add new 11-27-2014 ***/
h1 {
	font-weight: 400;
}
.banner-container h1 {
	font-style: italic;
	text-shadow: 1px 1px 5px rgba(4,62,71,0.5);
}
.bottom-content h2 {
	font-weight: 400;
	font-style: italic;
	text-shadow: 1px 1px 4px rightgba(4,62,71,0.5);
}	
.nav-item{
	float:left;
	margin:0;
	padding:0;
	list-style:none;
}
.nav-item li{
	float:left;
	width:auto;
	/*height: 99px;*/
	position:relative;
}
	/*


	.nav-item li a:hover, 
	.nav-item li.drpdown a{
		color:#fff;
		text-decoration:none;
		background:#2c2c2c;
	}*/

.nav-item li div{
	position:absolute;
	left:0px; 
	    /*left: 0px;*/
	top:92px;
	height:100%;
	display:none;
	width:270px;
	padding:10px 0;
	/*background:#2c2c2c;*/
	border:none;
	background: url(../images/transparent-bg.png) repeat;	

	}
.nav-item li ul{
	
	top:50px;

	}

.nav-item li div:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0}	
.nav-item li ul{
	float:none;
	list-style:none;
	margin:0;
	padding:0;
	}
/*.nav-item li.drpdown div{
	display:block;
}*/
.nav-item li.drpdown ul li{
	float:left;
	background:none;
	margin:0;
	padding:7px 0;
}
.nav-item li.drpdown ul li a{
	width:255px;
	padding:0 0 0 25px;
	height:auto;
	/*color:#787878;*/
	color: #d3dede;
	text-transform:none;
}
.nav-item li.drpdown ul li a:hover{
	color:#fff;
}

.menu_nav
{
	height:99px!important;
}

.main-nav li.drpdown a,
.main-nav li.drpdown span {
	color: #fff;
}
.drpdown-wrap a{
	cursor:pointer;
}
.drpdown-wrap li:hover a{
	color: #fff;
    text-decoration: none;
    border-bottom-color: #14abe8;
}


.drpdown-item {
	position: absolute;
	
	/*width: 200%;  /* ALTERED */
	top: 0;
	background: url(../images/blank.gif) repeat;
}

.main-nav .drpdown-item {
	padding: 38px 0 10px;
	display:none;
}
.drpdown .drpdown-item {
	left: 0;
}
.drpdown-item li {
	float: none;
	padding: 2px 0;
}
.drpdown-item li:last-child {
	background: none;
}
.main-nav .drpdown-item li a {
	float: none;

	
}
.main-nav .drpdown-item li a:hover {
	color: #fff;
}

/*.top-drop-menu{
	display:block;
}
*/
.main-nav .drpdown-item li a 
{
	border: none!important;

}


.main-nav .drpdown-item {
    /*position: relative;*/
    /*top: -1px;*/
    /*padding: 0;*/
    left:0px;
   	top:50px;
	width:250px;


    /*display: none;
    margin-top: 41px;
    margin-left: -19px!important;*/
}
.main-nav .drpdown-item a{
	color:#fff;
}

/*** Add new 06-10-2015 ***/
.meet-bureau .btn {
	margin: 0;
	width:250px;
}

.jobs{
    clear: both;
    width: 100%;
    overflow: hidden;
    padding: 30px;
    margin-bottom: 15px;
    background: #e1e1e1;
}

.jobs p{
	margin-top:10px;
	line-height: 24px;
	font-size:18px;
	margin-bottom: 0px;
}

.jobs h3{
	height:50px;
	padding-top:10px;
	padding-left:60px;
}
.jobs .blue {
	background: url(../images/b-icon.png) no-repeat  scroll center left;
	color: #25ACE5!important;
}

.jobs .green {
	background: url(../images/green-icon.png) no-repeat scroll center left;
	color: #4EB086!important;
}

.jobs .grey {
	background: url(../images/grey-icon.png) no-repeat scroll center left;
	color: #6F91A4!important;
}
.home-video{
	top: 30%!important;
}

.testimonial-header {    
	font-size: 44px;
	color: #333333;
	font-family: 'Lato', sans-serif;
	font-weight: 400;
	text-align: center;
	margin: 4% 5% 2% 5%;
	line-height: 1.2em;
}
.video-holder {
	width: 60%;
	margin: 0 auto;
	position: relative;
}

.video-holder iframe {
	margin-bottom: 4%;
}


.video-home {
	top: 180px;
	max-width: none;
	z-index: 2;
}

/***** Youtube Responsive Code *****/ .embed-container { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; max-width: 100%; height: auto; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } - See more at: https://engagingcomms.com.au/how-to-make-responsive-youtube-embed-video/#sthash.Qs24GLcy.dpuf