﻿

  		.title {
  			width: 100%;
  			max-width: 854px;
  			margin: 0 auto;
  		}

  		.caption {
  			width: 100%;
  			max-width: 854px;
  			margin: 0 auto;
  			padding: 20px 0;
  		}

  		.vid-main-wrapper {
  			width: 100%;
  			max-width: 1100px;
  			min-width: 440px;
  			background: #ffdc50;
  			margin: 0 auto;
  		}


  		/*  VIDEO PLAYER CONTAINER
 		############################### */
  		.vid-container { position: relative; padding-bottom: 40%; padding-top: 30px; height: 0; width:70%;float:left;background-color:#ffdc50}
		 
		.vid-container iframe,
		.vid-container object,
		.vid-container embed {
		    position: absolute;
		    top: 0;
		    left: 0;
		    width: 100%;
		    height: 360px;
		    
		}
		
		


		/*  VIDEOS PLAYLIST 
 		############################### */
	.vid-list-container {width: 30%; height:360px;overflow-y: ; float:right; background-color:#ffdc50}

    .vid-list-container:hover, .vid-list-container:focus {overflow-y: ;background-color:#ffdc50}
	ol#vid-list { margin:0px;padding:0px;background: #ffdc50; }
    ol#vid-list li { list-style: none;}
    ol#vid-list li a {text-decoration: none;background-color: #ffdc50; height:100px; display:block; padding:10px;}
    ol#vid-list li a:hover {background-color:#678fa8; }
	.vid-thumb { float:left;margin-right: 8px; border-top:0px solid #000; border-bottom:0px solid #000	}
	.vid-thumb img{ border-top:0px solid #fff; border-bottom:0px solid #fff	}

    .active-vid { background:#fff;}
	#vid-list .desc {color: #000;font-size: 14px;margin-top:5px;}


		@media (max-width: 624px) {
			body {
				margin: 15px;
			}
			.caption {
				margin-top: 40px;
			}
			.vid-list-container {padding-bottom: 10px;background-color:#000}

		}