@font-face {
    font-family: 'GoudyBookletter1911Regular';
    src: url('../fonts/goudy_bookletter_1911-webfont.eot');
    src: url('../fonts/goudy_bookletter_1911-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/goudy_bookletter_1911-webfont.woff') format('woff'),
         url('../fonts/goudy_bookletter_1911-webfont.ttf') format('truetype'),
         url('../fonts/goudy_bookletter_1911-webfont.svg#GoudyBookletter1911Regular') format('svg');
    font-weight: normal;
    font-style: normal;
	}


	
@font-face {
    font-family: 'permiansanstypefaceregular';
    src: url('../fonts/PermianSansTypeface-Bold-webfont.eot');
    src: url('../fonts/PermianSansTypeface-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/PermianSansTypeface-Bold-webfont.woff') format('woff'),
         url('../fonts/PermianSansTypeface-Bold-webfont.ttf') format('truetype'),
         url('../fonts/PermianSansTypeface-Bold-webfont.svg#permiansanstypefaceregular') format('svg');
    font-weight: normal;
    font-style: normal;
	}

@font-face {
	font-family:"Caudex Bold";
	src:url("../fonts/Caudex-Bold.eot?") format("eot"),
	url("../fonts/Caudex-Bold.woff") format("woff"),
	url("../fonts/Caudex-Bold.ttf") format("truetype"),
	url("../fonts/Caudex-Bold.svg#Caudex-Bold") format("svg");
	font-weight:normal;
	font-style:normal;
	}


/* Extended base styles (site specific)

*****************************************************************/
	
	
/* LINKS ****************************************************/


	
	/* GENERAL *************************************************************/
	p{
		padding-bottom: 15px;
	}
	
	.leftColumn{
	float: left;
	width:300px;
	margin: 20px 0 0 10px;
	font-size: 14px;
	color: #fff;	
	}

	/* TITLE */	
	h1{
	font: 1.5em/1.1em 'permiansanstypefaceregular', Arial, sans-serif;
	color:#004edd;
	}
	
	.subhead{
	font: 1.2em/1.1em 'permiansanstypefaceregular', Arial, sans-serif;
	color:#004edd;
	}
	
	.smaller{
	font: .9em/.9em 'permiansanstypefaceregular', Arial, sans-serif;
	}
	
	/* DESCRIPTION OF VIDEO */
	.descrition{
	margin-left: 50px;
	}
	
	/* DESCRIPTION OF VIDEO */
	.detailDescription{
	text-align: left;
	clear:both;
	font: 1em/1.2em 'GoudyBookletter1911Regular', Arial, sans-serif;
	letter-spacing: .5px;	
	}
	
	/* ORDER CONTENT */
	.orderContent{
	margin: 0 auto;
	margin-top: 30px;
	width: 700px;
	padding: 20px 10px 20px 10px;
	background: rgba(250, 250, 250, .7)
	}
	
	/* WHISPERS */
	.orderWhispers{
	width:580px;
	}
	
	.widthWhispers{
	width: 62em;		
	}			
	
	.window{
	margin: 40px 0 0 0;	
	}
	
	.orderBtn{
	text-align: center;
	margin: 0 auto;
	width:   600px;
	padding: 6px 0 6px 0;
	}
	
	/* BUTTONS */
	
	.prices {
	font: 1em/1.2em 'permiansanstypefaceregular', Arial, sans-serif;
	width: 130px;
	float: left;
	color: #000;
	padding: 10px 0 20px 0;
	text-align: center;	
	}
	
	.orderButtons{
	font: .9em/1.2em 'permiansanstypefaceregular', Arial, sans-serif;
	width: 130px;
	float: left;
	color: #fff;
	height: 40px;
	margin: 10px 13px 20px 0;
	padding: 10px;
	text-align: center;	
	background-color:#C00;
	}
	
	.groups{
	height: 80px;
	}
	
	.italic{
	font-style: italic;
		
	}
	
	/* DESCRIPTION OF VIDEO */
	.orderMain{
	font: .9em/1.2em 'permiansanstypefaceregular', Arial, sans-serif;
	margin: 15px 0 5px 0;
	clear: both;
	text-align: center;
	}
	
	.orderMail{
	padding: 35px 0 25px 0;
	clear: both;
	text-align: center;
	}
	
	.view {
	width: 75px;
	height: 20px;
	}
	
	.vhs{
	width: 75px;
	}

	.content img {
	float: left;
	padding-right: 10px;
	}
	
	h2{
	color: #C00;
	}
	
	.title{
	color: #387eff;
	}
	
	.bold{
	font-weight: bold;		
	}
	
	.lineHeight{
	line-height: 125%;
	}
	
	.btn3{
	width: 450px;
	margin: 0 auto;
	}
	
	.btn2{
	margin: 0 auto;
	width: 350px;
	}
	
	.btn1{
	width:275px;
	margin: 0 auto;
	}
	
	/* AWARDS *********************************************/
	
	.award{
	text-align: left;
	float: left;
	padding: 10px 10px 10px 20px;
	line-height: 120%;
	width: 90%;
	}
	
	.award img{
	float: left;
	}

	/* RUNGS *********************************************/
	
	td{
	padding: 8px;
	text-align: left;
	font: 1em/1.1em "Times New Roman", Times, serif;
	}
	
	.tablePadding{
	padding: 15px;
	}
	
	.border{
	border:#33F;
	border-style:solid;
 	border-width:1px;
	}
	
	.ordersm{
	color:#387eff;
		
	}
	
	h4{
	font: 1em/2em 'permiansanstypefaceregular', Arial, sans-serif;
	color:#004edd;
	text-align: center;
	}
	
	.btnCnt{
	margin: 0 auto;
	}


/*@media only screen and (max-width: 960px) and (min-width:768px) {*/
@media only screen and (max-width: 768px) and (min-width:320px)
{	
		h1{
	font: 1.17em/1.2em 'permiansanstypefaceregular', Arial, sans-serif;
	color:#004edd;
	}
	
		.subhead{
	font: .9em/1em 'permiansanstypefaceregular', Arial, sans-serif;
	color:#004edd;
	}
	
	.orderBtn{
	width: 95%;
	margin: 0 auto;
	float: none;
	}
	
			
	.btnCnt{
	width: 400px;
	margin: 0 auto;
	}
	
	.orderContent{
	width: 95%;
	margin: 0 auto;
	float: none;
	}
	
.btn2{
	margin: 0 auto;
	width: 70%;
	float: none;
	}
	
	.btn3{
	margin: 0 auto;
	width: 90%;
	float: none;
	}
	
	.orderWhispers{
	margin: 0 auto;
	width: 90%;
	float: none;
	}
	
	.widthWhispers{
	margin: 0 auto;
	width: 90%;
	float: none;	
	}
	
	.window{
	display: none;
	}
	
	.award{
	text-align: left;
	float: left;
	padding: 10px 10px 10px 20px;
	line-height: 120%;
	width: 90%;
	}
	
	.award img{
	float: left;
	}
		


}

@media only screen and (max-width : 420px){
	
			h1{
	font: 1.2em/1.2em 'permiansanstypefaceregular', Arial, sans-serif;
	color:#004edd;
	}
	
	.orderBtn{
	width: 95%;
	margin: 0 auto;
	float: none;
	}
	
	.orderContent{
	width: 90%;
	margin: 0 auto;
	float: none;
	}
	
	.btn2{
	margin: 0 auto;
	width:90%;
	float: none;
	}
	
	.btn3{
	margin: 0 auto;
	width:90%;
	float: none;
	}
	
	.orderWhispers{
	margin: 0 auto;
	width: 90%;
	float: none;
	}
	
	.window{
	display: none;
	}	
	
	.btnCnt{
	width: 90%;
	margin: 0 auto;
	float: none;
	
	}
	
	.desPhoto {
	display: none;
	}
}


/*	
@media only screen and (max-width: 685px) and (min-width: 320px) {

	
	.orderBtn{
	width: 90%;
	margin: 0 auto;
	float: none;
	}
	
	.orderContent{
	width: 90%;
	margin: 0 auto;
	float: none;
	}
	
	.btn2{
	margin: 0 auto;
	width: 70%;
	float: none;
	}
	
	.orderWhispers{
	margin: 0 auto;
	width: 90%;
	float: none;
	}
			
	}

@media only screen and (max-width : 320px) {

	
	.orderBtn{
	width: 90%;
	margin: 0 auto;
	float: none;
	}
	
	.orderContent{
	width: 90%;
	margin: 0 auto;
	float: none;
	}
	
	.btn2{
	margin: 0 auto;
	width: 70%;
	float: none;
	}
	
	.orderWhispers{
	margin: 0 auto;
	width: 90%;
	float: none;
	}
}
*/