/* merge this to global later */
.video_wrapper2 { background-color:#f4f4f4; padding:30px 0; text-align:center; }
.videoWrapper2_outter { display:inline-block; text-align:left; width:640px; max-width:100%; }
.videoWrapper2_inner { max-width:100%; width:640px; position:relative; padding-bottom:56.25%; margin-bottom:10px; }
.videoWrapper2_inner iframe { position:absolute; top:0; left:0; height:100%; width:100%; }

.video-list { display:flex; flex-wrap: wrap; margin:2rem -0.5rem -2rem; }
.videobox {
	margin:0 0.5rem 2rem; text-align:center; width:calc((100% - 4rem) / 4); cursor:pointer;
	border-bottom:2px solid #f3531f;
}
.videobox img { border:1px solid #ddd; }
.videobox .thumb_title {
    line-height:22px;
    height:66px;
    overflow:hidden;
    text-overflow:ellipsis;
}

.videobox .category_title { overflow:hidden; padding:0.5rem 0; }
.videobox .category_title::after {
	content:"\f105"; font-family:"Font Awesome 5 Pro"; font-weight:900; margin-left:0.25rem;
	position: relative; top:1px;
}
.video_title {
    color:#1e345d;
    font-size:20px;
    font-weight:bold;
}

.video_wrapper2 .video_title {
    float:left;
    line-height:normal;
    max-width:calc(100% - 150px);
    margin-bottom:10px;
}
.video_featured {
    border:1px solid #f3531f;
    color:#f3531f;
    padding:0 20px;
    line-height:38px;
    display:inline-block;
    text-transform:uppercase;
    font-size:18px;
}

.video_wrapper2 .video_featured {
    float:right;
}
.video_wrapper2 .video_owner {
    clear:left;
}
.promo_banner {
    display:inline;
    border:1px solid #f35321;
    box-sizing:border-box;
    max-width:100%;
}

.videos-heading {
    font-size:1.5em;
    margin-bottom:50px;
    margin-top:30px;
    line-height:39px;
}
.videos-heading a.button {
    margin-right:15px;
    font-size:18px;
    padding:10px 20px;
    display:inline-block;
    text-decoration:none;
    font-weight:500;
    cursor:pointer;
    -webkit-transition:all 0.2s ease-out;
    -moz-transition:all 0.2s ease-out;
    -o-transition:all 0.2s ease-out;
    -ms-transition:all 0.2s ease-out;
    line-height:normal;
    background-color:#fff;
    color:#585858;
    border:1px solid #585858;
}
.button:hover {
    color:white;
    background:url(../images/orange.svg) center center repeat;
    background-color:#f3531f;
    border:1px solid #f3531f;
}
.video_thumb { transition-property: opacity; transition-duration: 400ms; }
.video_thumb:hover { opacity: 0.6; }

@media (max-width:800px) {
   .videobox { width: calc((100% - 3rem) / 3); }
}
@media (max-width:650px) {
   .videoWrapper2_outter { max-width:98%; }
}
@media (max-width:500px) {
   .videobox { width: calc((100% - 2rem) / 2); }
}
@media (max-width:380px) {
   .videobox { width: 100%; }
   .videobox img { margin:0 auto; }
}