/*
	DESCRIPTION:      CSS for TheLittlePrince.net
	SITE CREATION:    ??? 199?
	CSS FILE CREATION/IMPLIMENTATION:   07/27/2016
*/

html {font-family: sans-serif; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%;}
body {background: #ffffff; margin: 15px 0 0; font-family:"Times New Roman", Times, serif;} /* was 25 */
a {background-color: transparent;}
a:active,
a:hover {outline: 0;}
b,
strong {font-weight: bold;}
small {font-size: 80%;}
sub,
sup {font-size: 75%; line-height: 0; position: relative; vertical-align: baseline;}
sup {top: -0.5em;}
sub {bottom: -0.25em;}
img {border: 0;}
hr {box-sizing: content-box; height: 0;}
table {border-collapse: collapse; border-spacing: 0;}
td,
th {padding: 0; vertical-align:top;}

a {color: #000066;}
a:hover {color: #0000ff;}
a img {border:none;}

html {box-sizing: border-box;}
*,
*:before,
*:after {box-sizing: inherit;}

hr {background-color: #cccccc; border: 0; height: 1px; margin-bottom: 1.5em;}

.shipping {font-family: "Times New Roman", Times, serif; font-size: 11px; font-weight: normal; color: #666;}
.newgrey {color: #666;}
.imgpad {margin-right: 25px;}
img.flex {width:100%; height: auto;}

.audio-d {display:block;}
.audio-m {display:none;}
.audio-m a {display:inline-block; text-decoration:none; vertical-align:middle; padding:8px 10px; color:#000; background:#ccc; -webkit-border-radius:5px; -moz-border-radius: 5px; border-radius: 5px;}
.audio-m a:hover {color:#006; background:#efefef;}
.audio-m a img {vertical-align:middle;}

.audio {
	margin: 2em 0;
}
.audio-img img {
	margin: 2em 0;
	max-width: 300px;
	width: 100%;
	height: auto;
}

.p-spacer {margin: 30px 0;}
.cover-image {-webkit-box-shadow: 1px 4px 18px rgba(0, 0, 0, .2); -moz-box-shadow: 1px 4px 18px rgba(0, 0, 0, .2); box-shadow: 1px 4px 18px rgba(0, 0, 0, .2);}

.container {max-width:800px; margin:0 auto; padding: 0 2em; text-align:center;}
.content {max-width:740px; margin:0 auto; padding: 0 20px;}

.top-drop {position:relative; width:130px; margin:0 auto; padding:0;}
.top-drop ul {padding:0;}
.top-drop li {list-style:none;}
.top-drop li a {text-decoration:none; letter-spacing:1px; font-family:Arial, Helvetica, sans-serif;}

.btn-buynow {margin:0 10px}
.btn-buynow img {display:block;}
.btn-buynow ul { display:none; position:absolute; left:0; width:100%; z-index:99;  padding-top:3px;}
.btn-buynow:hover ul {display:block;}
.btn-buynow ul li {display:block;}
.btn-buynow ul li a {background:#999; color: #fff; display:block; padding: 10px 20px;}
.btn-buynow ul li a:hover {background:#aaa; color: #00f;}

.btn-buynow ul.up { bottom: 102%; padding-top:0;}

.btn-buynow .button {display: inline-block;
	background:url(../images/buynow.jpg) no-repeat; width:110px; height:40px; 
	-webkit-border-radius: 9px; -moz-border-radius: 9px; border-radius: 9px;
	-webkit-box-shadow: 1px 2px 6px rgba(0, 0, 0, .5);
	-moz-box-shadow: 1px 2px 6px rgba(0, 0, 0, .5);
	box-shadow: 1px 2px 6px rgba(0, 0, 0, .5);
}
.btn-buynow:hover .button {
	cursor:pointer;
	background:url(../images/buynow2.jpg) no-repeat;
	-webkit-box-shadow: 1px 1px 4px rgba(0, 0, 0, .3);
	-moz-box-shadow: 1px 1px 4px rgba(0, 0, 0, .3);
	box-shadow: 1px 1px 4px rgba(0, 0, 0, .3);
}

.home-banner {
	width: 100%;
	text-align: center;
}
.home-banner img {
	margin-bottom: 1em;
	max-width: 700px;
	width: 100%;
	height: auto;
}

.castrow {
	display: flex;
	align-content: center;
	flex-direction: row;
    flex-wrap: wrap;
	justify-content: space-around;
}
.castrow div {
	margin-bottom: 1em;
}
.castrow img {
	margin-bottom: .25em;
}

.castgroup {
	font-size: 12px;
	margin-top: 2em;
}
.castgroup img {
	margin-bottom: 1em;
	max-width: 400px;
	width: 100%;
	height: auto;
}

.home-menu {
	margin: 5em auto;
	text-align: left;
	font-size:13px;
}
.home-menu div {
	float: left;
}
.home-menu div.home-menu-mid {
	padding: 0 1em;
}
.home-menu div.f-right {
	float: right;
}

.home-credits {
	clear: both;
	margin: 3em 0 0;
}

@media handheld, screen and (max-width: 995px) {
	.audio-m {display:block;}
	.audio-d {display:none;}
}
@media all and (max-width: 770px) {
	.container {padding: 0 1em;}
}
@media (max-width: 482px) {
	.cover-image {width: 87%; height: auto;}
	.home-menu div,
	.home-menu div.f-right {
		float: none;
		text-align: center;
		width: 100%;
	}
}