/* Has all the extra styles are used in The Legend of Interplanetry */

img {border:none;}
blockquote {margin:2% auto 2% 5%;width:80%;border-left:2px solid #cc9933;padding-left:.5%;}
.pic-box-left-alt {width:150px;}
.pic-box-right-alt {width:150px;}
.two-pics-stacked-right {display:block;margin-left:1%;width:150px;float:right;}
.two-pics-stacked-left  {display:block;margin-right:1%;width:150px;float:left;}
.ransom-for-toledo {margin-top:25px;height:auto;margin-right:3%;margin-left:55%;}
.spacewrecked {float:left;margin-left:6%;width:55%;}
.swordsmen {float:right;margin-right:15%;margin-top:15px;margin-bottom:15px;width:55%;}
.hermit {float:left;margin-left:6%;width:55%;}
.phobos {float:left;margin-left:8%;margin-bottom:30px;width:35%;}
.meteor {float:right;margin-top:35px;margin-bottom:15px;margin-right:8%;width:35%;}
.dark-swordsmen {float:right;margin-top:15px;margin-right:10%;margin-bottom:10px;width:90%;}
#container {margin-left:3%;width:100%;text-align:center;}
#container > div {
    width: calc(100% / 6);  
    display:inline-block;
    text-align:center;
    vertical-align: top;
    margin: 1%;   
}
#container2 {margin-left:11%;width:100%;text-align:center;}
#container2 > div {
    width: calc(80% / 4);  
    display:inline-block;
    text-align:center;
    vertical-align: top;
    margin: 4%;    
}
#container3 {margin-left:3%;width:100%;text-align:center;}
#container3 > div {
    width: calc(100% / 5);  
    display:inline-block;
    text-align:center;
    vertical-align: top;
    margin: 2%;   
}
#container4 {margin-left:3%;width:100%;text-align:center;}
#container4 > div {
    width: calc(100% / 5);  
    display:inline-block;
    text-align:center;
    vertical-align: top;
    margin: 2%;   
}
#container5 {margin-left:3%;width:100%;text-align:center;}
#container5 > div {
    width: calc(100% / 5);  
    display:inline-block;
    text-align:center;
    vertical-align: top;
    margin: 2%;   
}
.the-end {clear:both;margin: 20px auto;font-weight:bold;text-align:center;}

/* Mobile Styles */
@media only screen and (min-width: 900px){
#jones-adjust-1 {margin-top:50px;margin-bottom:30px;width:70%;}
#jones-adjust-2d {margin-left:20%;margin-bottom:15px;}
#jones-adjust-2a {display:none;}
#jones-adjust-3a {display:none;margin-top:15px;}
#jones-adjust-3b {float:left;margin-top:20px;margin-left:2%;width:40%;}
#jones-adjust-4a {clear:both;float:right;margin-top:-5%;}
#jones-adjust-4b {float:left;margin-top:20px;margin-left:2%;width:40%;}
#jones-adjust-6a {display:none;}
#jones-adjust-6b {margin-bottom:15px;}
#jones-adjust-9 {display:block;margin:auto;}
#jones-adjust-10a {display:none;}
.meteor {width:40%;}
.dark-swordsmen {float:none;display:block;margin:auto;width:80%;}
.exodus {display:block;margin:15px auto;width:50%;}
.jones-text-offset {margin-top:40px;}
}



@media only screen and (min-width: 600px) and (max-width: 700px){
#jones-adjust-2d {clear:both;}
}

@media only screen and (min-width: 600px) and (max-width: 899px){
#jones-adjust-2a {display:none;}
#jones-adjust-3a {display:none;}
#jones-adjust-3b {margin-top:20px;width:auto;}
#jones-adjust-4a {clear:both;float:right;margin-bottom:15px;}
.ransom-for-toledo {margin-top:25px;height:auto;margin-right:1%;margin-left:45%;}
#jones-adjust-6a {display:none;}
#jones-adjust-6b {margin-bottom:15px;}
.spacewrecked {float:left;margin-left:4%;width:75%;}
.swordsmen {float:right;margin-right:6%;width:65%;}
.hermit {float:left;margin-left:4%;width:75%;}
.jones-pic-box {display:block;margin:auto;width:150px;}
#jones-adjust-10a {display:none;}
.phobos {float:left;margin-left:2%;margin-bottom:15px;width:70%;}
.meteor {clear:left;float:right;margin-top:15px;margin-right:1%;width:75%;}
}


@media only screen and (max-width: 599px){
#jones-adjust-1 {margin-top:10px;margin-bottom:15px;}
#jones-adjust-2b {margin-left:2%;margin-bottom:15px;}
#jones-adjust-2c {display:none;}
#jones-adjust-3a {clear:both;margin-top:15px;}
#jones-adjust-3b {margin-top:20px;width:auto;}
#jones-adjust-3c {display:none;}
.ransom-for-toledo {margin-top:25px;height:auto;margin-right:1%;margin-left:35%;}
#jones-adjust-6a {margin-bottom:15px;}
#jones-adjust-6b {display:none;}
.spacewrecked {float:left;margin-left:4%;width:65%;}
.swordsmen {float:right;margin-right:6%;width:65%;}
.hermit {float:left;margin-left:4%;width:65%;margin-bottom:15px;}
#jones-adjust-9 {clear:both;display:block;margin:auto;width:88px;}
.jones-adjust-9a {width:110px;}
#jones-adjust-10b {display:none;}
.phobos {float:left;margin-left:4%;width:59%;}
.meteor {float:right;margin-right:6%;margin-top:15px;width:65%;}
.dark-swordsmen {float:left;margin-left:3%;width:90%;}
}

@media only screen and (min-width: 480px) and (max-width: 599px){
.spacewrecked {float:left;margin-left:3%;width:75%;}
.swordsmen {float:right;margin-right:5%;margin-top:15px;width:75%;}
.hermit {float:left;margin-left:3%;width:75%;}
.meteor {float:right;margin-right:6%;margin-top:15px;width:75%;}
}

@media only screen and (min-width: 899px) and (max-width: 999px){
#jones-adjust-4a {clear:both;float:right;margin-top:1%;}
}

#container-sect-9 {margin-left:10%;width:100%;text-align:center;}
#container-sect-9 > div {
    width: calc(100% / 4);  
    display:inline-block;
    text-align:center;
    vertical-align: top;
    margin: 1%;   
}
#container-sect-13 {margin-left:10%;width:100%;text-align:center;}
#container-sect-13 > div {
    width: calc(100% / 4);  
    display:inline-block;
    text-align:center;
    vertical-align: top;
    margin: 1%;   
}