/* planettoolStyles.css
/* html elements
*******************************************************************************/
body { width:100%; height:auto; background-size:cover; background-repeat:no-repeat; background-image:url("../image/supersat.svg"); background-position: 11% 0%; font-family:"Helvetica Neue", Helvetica, Arial, sans-serif; }
body, div, dl, dt, dd, h1, h2, h3, h4, h5, h6, p, pre, code, blockquote { margin:0; padding:0; border-width:0; text-rendering:optimizeSpeed; }
/*
ol, ul, li { font-size:28pt; list-style-type:none; }
ul li a { width:auto; height:75px; border:solid #ffffff 1px; color:#000000; background-color:#c6c6c6; display:table-cell; vertical-align:middle; padding-left:20px; padding-right:20px; text-decoration:none; }*/
table, tr { border:none; border-collapse:collapse; text-align:left; }
tr { border-top:2px solid grey; border-bottom:1px solid grey; border-collapse:collapse; text-align:left; }
h1, h2, h3, h4, h5, p, table, ol, ul { font-family:Arial, Helvetica, sans-serif; }
h1, h2, h3, h4, h5, h6 { font-weight:bold; }
h1, h2 { color:#ffffff; display:inline; }
h1 { font-size:30pt; float:left; margin-top:8px; margin-left:20px; letter-spacing:0.1em;}
h2 { font-size:28pt; float:left; margin-top:16px; margin-right:30px; }
h3 { font-size:26pt; color:#555555; }
h4 { font-size:24pt; color:#555555; }
h5 { font-size:22pt; color:#000000; }
h6 { font-size:20pt; color:#000000; }
p { text-align:justify; }
td { font-family:Arial; font-style:normal; font-size:0.7em; line-height:1.5; white-space:normal; vertical-align:top; letter-spacing:0.05em; color:#000000; }
/* ID's
*******************************************************************************/
#container006, #moons_Div_Saturn { background-repeat:no-repeat; background-size:cover; column-gap:24px; column-rule-width:thin; column-rule-color:#666666; column-rule-style:solid; -webkit-column-gap:24px; -webkit-column-rule-width:thin; -webkit-column-rule-color:#666666; -webkit-column-rule-style:solid; -moz-column-gap:24px; -moz-column-rule-width:thin; -moz-column-rule-color:#666666; -moz-column-rule-style:solid; }
#container_header_3 { width:100%; height:76px; top:36px; left:0px; display:block; border:none; background-color:#969696; column-count:1; -webkit-column-count:1; -moz-column-count:1; }
#container006, #container007 { width:100%; height:auto; left:0px; position:relative; border:none; background: none; column-count:1; -webkit-column-count:1; -moz-column-count:1; }
#container007 { width:100%; height:auto; left:0px; position:relative; border:none; background-color:white; opacity:1; border-radius:10px; -webkit-column-count:1; -moz-column-count:1; }
#objects_Container1 { border:none; background:none; float:left; display:inline-block; position:relative; }
#selection_Planet { width:210px; height:48px; float:left; border-radius:5px; font-family:Arial; font-style:normal; font-size:22pt; font-weight:normal; float:left; padding-left:5px; }
#table_2 { width:100%; border:none; top:0px; position:relative; }
#table_3 { width:100%; font-family:Arial; font-style:normal; font-size:20pt; float:left; border-left:none; border-right:none; }
/* classes
*******************************************************************************/
p.floattext1, p.floattext2 { background-color:white; font-family:Times New Roman; font-weight:normal; font-style:normal; font-size:1.4em; color:#000000; opacity:0.6; margin-top:20px; margin-bottom:20px; padding:15px; border-radius:10px; text-align:justify; line-height:1.4; letter-spacing:0.05em; hyphens:auto; -moz-hyphens:auto; -o-hyphens:auto; -webkit-hyphens:auto; -ms-hyphens:auto; }
td.col0, td.col1, td.col2 { border:none }
td.col0 { width:40%; padding-left:15px; }
td.col1, td.col2 { width:30%; }
.colhead { font-weight:bold; }
.object_name1 { font-family:Arial; font-style:italic; font-size:1.25em; letter-spacing:0.1em; text-anchor:begin; }
.planet_name1 { font-family:Arial; font-style:normal; font-size:28pt; letter-spacing:2px; color:#ffffff; text-anchor:middle; }
.row1 { font-size:22pt; font-style:italic; font-weight:bold; border:none; }
.row2 { border-top:none; border-left:none; border-right:none; border-bottom:1px solid #000000; }
.scaleLine_W { stroke:#ffffff; stroke-width:1px; }
.scaleLine_B { stroke:#000000; stroke-width:1px; }
.video_1 { left:0px; position:relative; width:100%; height:auto; }
* {
box-sizing: border-box;
}
.row {
top:auto;
left:20px;
position:absolute;
display:block;
width:100%;
/* border:2px solid #0000ff;*/
background:none;
}
/* Create two equal columns that floats next to each other */
.column {
/* border:2px solid #ff0000;*/
float: left;
width: 50%;
padding-left: 20px;
padding-top: 20px;
padding-right: 20px;
height: auto; /* Should be removed. Only for demonstration */
display:inline;
}
/* Clear floats after the columns */
.row:after {
top:76px;
left:0px;
/* border:2px solid #0000ff;*/
width:100%;
height:auto;
margin-left:auto;
margin-right:auto;
position:relative;
content: "";
display: table;
clear: both;
}
@media only screen
and (min-device-width :320px)
and (max-device-width :480px) { /* Styles */
}/* Smartphones (landscape) ----------- */
@media only screen
and (min-width :321px) { /* Styles */
}/* Smartphones (portrait) ----------- */
@media only screen
and (max-width :320px) { /* Styles */
}/* iPads (portrait and landscape) ----------- */
@media only screen
and (min-device-width :768px)
and (max-device-width :1024px) { /* Styles */
}/* iPads (landscape) ----------- */
@media only screen
and (min-device-width :768px)
and (max-device-width :1024px)
and (orientation :landscape) { /* Styles */
}/* iPads (portrait) ----------- */
@media only screen
and (min-device-width :768px)
and (max-device-width :1024px)
and (orientation :portrait) { /* Styles */
}/* The New iPad (iPad 3) ----------- */
/**************************************************************/
/* Responsive layout - two columns stack on top of each other */
@media screen and (max-width: 1280px) {
body { background-image:url("../image/supersat2.svg");}
.row { width: 100%; }
.column { width: 100%; }
}
/**************************************************************/
@media only screen
and (min-device-width:1536px)
and (max-device-width:2048px)
and (-webkit-min-device-pixel-ratio:2) { /* Styles */
}/* iPhone 4 ----------- */
@media
only screen and (-webkit-min-device-pixel-ratio :1.5),
only screen and (min-device-pixel-ratio :1.5) { /* Styles */
}