@charset "utf-8";
/* CSS Document */
*,:before,:after{ box-sizing:border-box}
.body-container-new {
	width: 100%;
	max-width: 973px;
	margin-right: auto;
	margin-left: auto;
	padding-bottom: 15px; position:relative; display:block;
}
.margtop{ margin-top:150px}
.logo-tp{width:auto; position:absolute; left:40%; display:block; padding-top:20px;}
.sld-txt{width:25%; position:absolute;}
.related_video_box {

	float: left;
	height: auto;
	width: 100%;
	margin:0px 0 0 0px;
}




.video_thumb{ width:32.2%; height: auto; float:left; margin:0 10px 0 0; padding:0px;-webkit-box-shadow: 0 0 8px 1px #C4C4C4;
	-moz-box-shadow: 0 0 8px 1px #C4C4C4;
	box-shadow: 0 0 8px 1px #C4C4C4;}
	.video_thumb-last{ width:32.2%; height: auto; float:left; margin:0 0 0 0; padding:0px;-webkit-box-shadow: 0 0 8px 1px #C4C4C4;
	-moz-box-shadow: 0 0 8px 1px #C4C4C4;
	box-shadow: 0 0 8px 1px #C4C4C4;}
.video_img{ width:100%; height: auto; float:left; margin:0; }
.img-res{ width:100%; display:block;  }
.video_thumb_text{
	width: 100%;
	height: auto;
	float: left;
	margin: 0px 0px;
	background-image: url(../images/arrow.png);
	background-position: left center;
	background-repeat: no-repeat;
	padding-left: 15px;
	padding-top: 10px;
	font-family: 'ErasDemiITCRegular';
	font-size: 12px;
	color: #8c8c8c;
}
.video_thumb_gap{ width:18px; height: 140px; float:left;}
.view {
   width: auto;
   height: auto;
   margin: 0;
   float: left;
   overflow: hidden;
   position: relative;
   text-align: center;
   cursor: default;
   background: #fff url(../images/bgimg.jpg) no-repeat center center; :#F00;
}
.view .mask,.view .content {
   width: 100%;
   height: auto;
   position: absolute;
   overflow: hidden;
   top: 0;
   left: 0;
}
.view img {
	width:100%;
   display: block;
   position: relative;
}
.view h2 {
   text-transform: uppercase;
   color: #fff;
   text-align: center;
   position: relative;
   font-size: 17px;
   padding: 10px;
   background: rgba(0, 0, 0, 0.8);
   margin: 20px 0 0 0;
}
.view p {
   font-family: Georgia, serif;
   font-style: italic;
   font-size: 12px;
   position: relative;
   color: #fff;
   padding: 10px 20px 20px;
   text-align: center;
}
.view a.info {
   display: inline-block;
   text-decoration: none;
   padding: 7px 14px;
   background: #000;
   color: #fff;
   text-transform: uppercase;
   -webkit-box-shadow: 0 0 1px #000;
   -moz-box-shadow: 0 0 1px #000;
   box-shadow: 0 0 1px #000;
}
.view a.info: hover {
   -webkit-box-shadow: 0 0 5px #000;
   -moz-box-shadow: 0 0 5px #000;
   box-shadow: 0 0 5px #000;
}


/* NINTH EXAMPLE*/
.view-ninth .mask-1, .view-ninth .mask-2 {
    background-color: rgba(0, 0, 0, 0.5);
    height: 361px;
    width: 800px;
    background: rgba(119, 0, 36, 0.5);
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    opacity: 1;
    -webkit-transition: all 0.3s ease-in-out 0.6s;
    -moz-transition: all 0.3s ease-in-out 0.6s;
    -o-transition: all 0.3s ease-in-out 0.6s;
    transition: all 0.3s ease-in-out 0.6s;
}
.view-ninth .mask-1 {
    left: auto;
    right: 0;
    -webkit-transform: rotate(56.5deg) translateX(-180px);
    -moz-transform: rotate(56.5deg) translateX(-180px);
    -o-transform: rotate(56.5deg) translateX(-180px);
    -ms-transform: rotate(56.5deg) translateX(-180px);
    transform: rotate(56.5deg) translateX(-180px);
    -webkit-transform-origin: 100% 0%;
    -moz-transform-origin: 100% 0%;
    -o-transform-origin: 100% 0%;
    -ms-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
}
.view-ninth .mask-2 {
    top: auto;
    bottom: 0;
    -webkit-transform: rotate(56.5deg) translateX(180px);
    -moz-transform: rotate(56.5deg) translateX(180px);
    -o-transform: rotate(56.5deg) translateX(180px);
    -ms-transform: rotate(56.5deg) translateX(180px);
    transform: rotate(56.5deg) translateX(180px);
    -webkit-transform-origin: 0% 100%;
    -moz-transform-origin: 0% 100%;
    -o-transform-origin: 0% 100%;
    -ms-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
}
.view-ninth .content {
    background: rgba(0, 0, 0, 0.9);
    height: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
    filter: alpha(opacity=50);
    opacity: 0.5;
    width: 100%;
    overflow: hidden;
    -webkit-transform: rotate(-33.5deg) translate(-112px, 86px);
    -moz-transform: rotate(-33.5deg) translate(-112px, 86px);
    -o-transform: rotate(-33.5deg) translate(-112px, 86px);
    -ms-transform: rotate(-33.5deg) translate(-112px, 86px);
    transform: rotate(-33.5deg) translate(-112px, 86px);
    -webkit-transform-origin: 0% 100%;
    -moz-transform-origin: 0% 100%;
    -o-transform-origin: 0% 100%;
    -ms-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    -webkit-transition: all 0.4s ease-in-out 0.3s;
    -moz-transition: all 0.4s ease-in-out 0.3s;
    -o-transition: all 0.4s ease-in-out 0.3s;
    transition: all 0.4s ease-in-out 0.3s;
	font-family:Verdana, Geneva, sans-serif; font-size:12px; color:#FFF; font-weight:600;
}
.view-ninth h2 {
    background: transparent;
    margin-top: 5px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}
.view-ninth a.info {
    display: none;
}
.view-ninth:hover .content {
    height: 27px;
    width: 100%;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
    filter: alpha(opacity=90);
    opacity: 0.9;
    top: 30px;
    -webkit-transform: rotate(0deg) translate(0, 0);
    -moz-transform: rotate(0deg) translate(0, 0);
    -o-transform: rotate(0deg) translate(0, 0);
    -ms-transform: rotate(0deg) translate(0, 0);
    transform: rotate(0deg) translate(0, 0);
	padding-top:10px;
	font-family:Verdana, Geneva, sans-serif; font-size:12px; color:#FFF; font-weight:600;

}
.view-ninth:hover .mask-1, .view-ninth:hover .mask-2 {
    -webkit-transition-delay: 0s;
    -moz-transition-delay: 0s;
    -o-transition-delay: 0s;
    transition-delay: 0s;
}
.view-ninth:hover .mask-1 {
    -webkit-transform: rotate(56.5deg) translateX(1px);
    -moz-transform: rotate(56.5deg) translateX(1px);
    -o-transform: rotate(56.5deg) translateX(1px);
    -ms-transform: rotate(56.5deg) translateX(1px);
    transform: rotate(56.5deg) translateX(1px);
}
.view-ninth:hover .mask-2 {
    -webkit-transform: rotate(56.5deg) translateX(-1px);
    -moz-transform: rotate(56.5deg) translateX(-1px);
    -o-transform: rotate(56.5deg) translateX(-1px);
    -ms-transform: rotate(56.5deg) translateX(-1px);
    transform: rotate(56.5deg) translateX(-1px);
}
@media all and (max-width:800px)
{
.logo-tp{width:100%; text-align:center; position:static; float:left; left:40%; display:block; padding-top:20px;}
.sld-txt{width:60%; position:static; margin-right: auto; margin-left: auto; padding:0px; margin-bottom:0px;  }
.margtop{ margin-top:100px;}

}

@media all and (max-width:480px)
{
	.sld-txt{width:90%; position:static; margin-right: auto; margin-left: auto; padding:0px; margin-bottom:0px; }
.video_thumb{ width:100%; height: auto; float:left; margin:0px; padding:0 0 10px 0;}
.video_thumb-last{ width:100%; height: auto; float:left; margin:0px; padding:0 0 0 0;}	
.view-ninth:hover .content {
    height: 27px;
    width: 100%;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
    filter: alpha(opacity=90);
    opacity: 0.9;
    top: 60px;
    -webkit-transform: rotate(0deg) translate(0, 0);
    -moz-transform: rotate(0deg) translate(0, 0);
    -o-transform: rotate(0deg) translate(0, 0);
    -ms-transform: rotate(0deg) translate(0, 0);
    transform: rotate(0deg) translate(0, 0);
	padding-top:10px;
	font-family:Verdana, Geneva, sans-serif; font-size:12px; color:#FFF; font-weight:600;

}
	}