@charset "UTF-8";
/* CSS Document */

body {margin:0; height:100%; background-image:url(images/bg.png); background-repeat:repeat;}
#mobilebuy, .mobileonly, #bottompetty {display:none;}
#wrapper {width:100%; height:autopx; overflow:hidden;}
#leftcolumn {width:23%; float:left; display:block; overflow:hidden; position:fixed;}
#middlecolumn {width:52%; float:left; display:block; padding-left:1%; padding-right:0%; margin-left:23%;}
#middlecolumncontent {width:90%; margin-left:auto; margin-right:auto;}
#rightcolumn {width:25%; height:100%; float:left; margin-left:77%; display:block; overflow:hidden; background-image:url(images/tom-petty-sidebar.png); background-repeat:no-repeat; background-size:100% auto; position:fixed; background-position: bottom right; }
#leftcolumn img {display:block; overflow:hidden; width:100%; height:auto;}
#leftcolumn h1 {margin:0; padding:0; float:left; display:inline-block;}
#leftcolumn h2 {margin:15px 0 0 0; padding:0; float:left; display:inline-block;}
#leftcolumn h3 {margin:0; padding:0; float:left; display:inline-block;}
#leftcolumn h4 {margin:0; padding:0; float:left; display:inline-block;}
p {font-family: 'Source Sans Pro', sans-serif; font-weight:400; font-size:18px; line-height:24px;}
.keynote {font-family: 'Lato', sans-serif; font-weight: 900; font-size:24px; text-transform:uppercase; text-align:center;}
.keynote2 {display:none;}

.boxshadow {width:80%; margin-left:auto; margin-right:auto; padding:10px 10px 3px 10px; margin-top:10px; background-color:#ffffff; -webkit-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.55); -moz-box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.55); box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.55);}
.blurbtop {margin-bottom:0; margin-top:0px; font-weight:bold;}
.blurb {margin-bottom:0; margin-top:0px; }
.blurber {margin-top:5px; margin-bottom:20px; font-family: 'Lato', sans-serif; font-weight: 900; font-size:26px; text-transform:uppercase; text-align:right; color:#ec1d25; text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.75);}
.credit {font-family: 'Lato', sans-serif; font-weight:400; font-size:18px; line-height:24px; text-transform:none; color:#000000; text-align:right; font-weight:bold; text-shadow: 0px 0px 0px rgba(0, 0, 0, 0);}

.bookshot {width:80% !Important; height:auto; margin-left:10%; margin-right:10%;}
.buybutton {width:80% !Important; height:auto; margin-top:10px; margin-left:10%; margin-right:10%;}
.rounded {-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;}
.shadow {-webkit-box-shadow: 1px 1px 6px 0px rgba(50, 50, 50, 0.75); -moz-box-shadow: 1px 1px 6px 0px rgba(50, 50, 50, 0.75); box-shadow: 1px 1px 6px 0px rgba(50, 50, 50, 0.75);}
.termsprivacy p {font-size:13px; color:#000000;}
.termsprivacy p a {font-size:13px; text-decoration:underline; color:#000000;}
.termsprivacy p a:hover {font-size:13px; text-decoration:none;}
#mask {position:absolute; left:0; top:0; z-index:9000; background-color:#000; display:none;}
#boxes .window {position:fixed; left:0; top:0; width:80%; height:80%; display:none; z-index:9999; padding:0px; border-radius:10px 10px 10px 10px; -moz-border-radius-topleft: 10px; -moz-border-radius-topright: 10px; -moz-border-radius-bottomright: 10px; -moz-border-radius-bottomleft: 10px;}
#boxes #dialogterms {width:80%; height:65%; padding:0%; background-color:#ffffff; overflow-y: hidden; overflow-x: hidden;}
#boxes #dialogprivacy {width:80%; height:65%; padding:0%; background-color:#ffffff; overflow-y: hidden; overflow-x: hidden;}
#closeButton {position: absolute; right:-5px; top:-5px;}
.iframes {height:100%; width:100%; border:0; overflow-y:scroll;}
#mask2 {position:absolute; left:0; top:0; z-index:9001; background-color:#000; display:none;}
#boxes2 .window2 {position:fixed; left:0; top:0; width:80%; height:80%; display:none; z-index:9999; padding:0px; border-radius:10px 10px 10px 10px; -moz-border-radius-topleft: 10px; -moz-border-radius-topright: 10px; -moz-border-radius-bottomright: 10px; -moz-border-radius-bottomleft: 10px;}
#closeButton2 {position: absolute; right:-16px; top:-16px;}
#boxes2 #dialogbook {width:650px; height:300px; background-color:#ffffff;}

#video1 {margin-left:15%; margin-right:15%; width:70%; height:auto; text-align:center;}
#video2 {margin-left:15%; margin-right:15%; width:70%; height:auto; text-align:center;}
#video3 {margin-left:15%; margin-right:15%; width:70%; height:auto; text-align:center;}

#audiocontainer {width:60%; margin-right:20%; margin-left:20%; text-align:center; height:auto;}

#authorbio {width:100%; margin-top:24px; margin-left:auto; margin-right:auto; overflow:hidden;}
#photo {float:left !important; display:block !important; width:33%; padding-right:2%; overflow:hidden;}
#bio {float:left !important; display:block !important; width:65%;}
#bio p {margin-top:0;}
.photoimage {margin-bottom:0; margin-top:0; overflow:hidden;}
.photocaption {margin-top:-7px; font-size:12px; text-align:center; overflow:hidden;}
.photoimage img {width:94%; margin:3%; height:auto;}

#mobilebuy ul {width:100%;position:fixed;}
#mobilebuy li {width:33%;float:left;border-right:none;position:fixed;}
#mobilebuy li:last-child {border-right:none;position:fixed;}
#mobilebuy li a {display: block;width:100%;color:#ffffff;background:#444444;padding:4% 10%;font-size:1.35em;text-decoration: none;position:fixed;}
#mobileonly {display:none;}

#gallerycontainer {width:100%; margin-left:auto; margin-right:auto; padding-top:20px; padding-bottom:20px; clear:both;}
#praisecontainer {width:100%; margin-top:24px; margin-left:auto; margin-right:auto; padding-top:20px; padding-bottom:20px; clear:both;}

.hangingindent {padding-left: 7px; text-indent: -7px;}

@media screen and (min-width: 651px) and (max-width: 999px) {
#sthoverbuttons, .keynote, #bottompetty {display:none;}
#leftcolumn {width:30%;}
#middlecolumn {width:68%; margin-left:30%;}
#middlecolumncontent {width:100%;}
#rightcolumn {display:none;}
.closebutton {position:fixed; right:25px; top:25px;}
#middlecolumnsizer {width:96%; margin-left:2%; margin-right:2%;}
#centertext {text-align:center !Important; padding-top:15px;}
.keynote2 {display:inline; font-family: 'Lato', sans-serif; font-weight: 900; font-size:24px; text-transform:uppercase; text-align:center;}

#video1 {float:none; display:block; width:80%; height:auto; margin-bottom:25px; margin-left:auto; margin-right:auto;}
#video2 {float:none; display:block; width:80%; height:auto; margin-bottom:25px;margin-left:auto; margin-right:auto;}
#video3 {clear:both; margin-left:auto; margin-right:auto; width:80%; height:auto;}

#audiocontainer {width:100%; margin-right:0; margin-left:0; text-align:center; height:auto;}

.videoWrapper {position: relative; padding-bottom: 56.25%; /* 16:9 */ 	padding-top: 25px;	height: 0;}
.videoWrapper object,
.videoWrapper iframe {	position: absolute; top: 0; left: 0; 	width: 100%; height: 100%;} 

}

@media screen and (max-width: 650px) {
#leftcolumn h2, #sthoverbuttons, .keynote {display:none;}
#leftcolumn {width:100%; margin-top:35px; position:relative;}
#middlecolumn {width:94%; padding-left:3%; padding-right:3%; margin-left:0; padding-top:15px; clear:both;}
#middlecolumncontent {width:100%;}
#rightcolumn {display:none; }
#bottompetty {display:inline; width:100%; height:auto;}
#bottompetty p {margin-bottom:0; }
#bottompetty img {width:100%; height:auto; margin-bottom:0; margin-top:20px;}
.closebutton {position:fixed; right:0px; top:0px;}
.mobileonly {display:inline;}
#mobilebuy {display:inline; position:fixed; z-index:99999;}
#mobilebuy #menu {width:100%;display:block;background:#000000;font-size:20px;font-family:"Times New Roman", Times, serif;text-align:left;color:#ffffff;position:fixed;z-index:99999;margin:0;padding:0;}
#mobilebuy #nav.js {display: none;}
#mobilebuy ul {width:100%;margin:0;padding:0;}
#mobilebuy li {width:100%;border-bottom:1px solid #000000;margin:0;padding:0;}
.mheadersize {width:100%; height:auto;}
.boxshadow {margin-bottom:20px;}

.keynote2 {display:inline; font-family: 'Lato', sans-serif; font-weight: 900; font-size:24px; margin-bottom:15px; text-transform:uppercase; }
.centertext p {text-align:center;}
.btn-is-active {pointer-events: none;}

#authorbio {width:100%; margin-left:auto; margin-right:auto; overflow:hidden;}
#photo {float:left !important; display:block !important; width:100%; margin-left:auto; margin-right:auto; padding-right:0%; overflow:hidden; margin-bottom:0;}
#bio {float:left !important; display:block !important; width:100%; margin-top:-10px;}
.photoimage {margin-bottom:0; overflow:hidden;}
.photocaption {margin-top:-7px; font-size:12px; text-align:center; overflow:hidden; margin-bottom:0;}
.photoimage img {width:56%; height:auto; margin-left:22%; margin-right:22%;}

#video1 {float:left; display:block; width:100%; height:auto; margin-bottom:25px;}
#video2 {float:right; display:block; width:100%; height:auto; margin-bottom:25px;}
#video3 {clear:both; margin-left:auto; margin-right:auto; width:100%; height:auto;}

#audiocontainer {width:100%; margin-right:0; margin-left:0; text-align:center; height:auto;}

.videoWrapper {position: relative; padding-bottom: 56.25%; /* 16:9 */ 	padding-top: 25px;	height: 0;}
.videoWrapper object,
.videoWrapper iframe {	position: absolute; top: 0; left: 0; 	width: 100%; height: 100%;} 

}



/* iPad [portrait + landscape] */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
#boxes #dialogterms {width:80%; height:75%; padding:0; background-color:#ffffff; overflow:auto;-webkit-overflow-scrolling:touch;}
#boxes #dialogprivacy {width:80%; height:75%; padding:0; background-color:#ffffff; overflow:auto;-webkit-overflow-scrolling:touch;}
}

/* iPhone [portrait + landscape] */
@media only screen and (max-device-width: 480px) {
#boxes #dialogterms {width:80%; height:75%; padding:0; background-color:#ffffff; overflow:auto;-webkit-overflow-scrolling:touch;}
#boxes #dialogprivacy {width:80%; height:75%; padding:0; background-color:#ffffff; overflow:auto;-webkit-overflow-scrolling:touch;}
}