/* 101World.net */ html {} body { overflow-x: hidden; background: white; color: black; font-style: normal; font-weight: normal; font-size: 1.2rem; width: 100%; border: 0; margin: 0; padding: 0; } form { width: 100%; border: 0; margin: 0; padding: 0; } iframe { background: white; width: 100%; min-height: 400px; border: 0; margin: 0; padding: 0; } iframe.tall { min-height: 550px; } h1,h2,h3 { color: black; border: 0; margin: 0; padding: 0; } h1 { font-family: "CopperPlate", "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: bold; font-size: 3.2rem;} h2 { font-family: "CopperPlate", "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 2.6rem;; } h3 { font-family: "CopperPlate", "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 2.3rem;; } .topMesg { position: absolute; visibility: hidden; left: 0; top: 0; z-index:99 } div { border: 0; margin: 0; padding: 0; } div.Body { position: relative; background: white; color: black; margin: 0 auto 0 auto; padding: 10px 10px 10px 10px; } div.MainBody {} div.SubmitForm { display: none; } div.Library, div.GBLibrary { background: white; background-image: url('https://www.101World.Net/assets/images/backs/StxBG200.jpg'); background-repeat: repeat-y; background-size: 100%; } div.Padded { padding: 20px 22px 20px 22px; } div.Left { text-align: left; } div.Center { vertical-align: middle; text-align: center; } div.Relative { position: relative; } div.Absolute { position: absolute; left: 0; top: 0; } div.floatTop { float: top; } div.floatBottom { float: bottom; } div.floatLeft { float: left; } div.floatRight { float: right; } span { vertical-align: top; text-align: left; border: 0; margin: 0; padding: 0; word-break: break-word; } table { vertical-align: middle; border: 0; margin: 0; padding: 0; } table.Compact { width: 100%; border-collapse: collapse; border: 0; margin: 0; padding: 0; } table tr { height: 100% vertical-align: middle; border: 0; margin: 0; padding: 0; } table td { height: 100% vertical-align: middle; text-align: center; border: 0; margin: 0; padding: 0; } div.Code, table td.Code { font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 0.8rem; vertical-align: top; padding: 10px; } table td.Magazine { height: 100%; background-image: url('https://www.101World.Net/assets/images/backs/StxBG401.jpg'); background-repeat: repeat; background-size: 100% auto; vertical-align: top; } p.Magazine { color: black; font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1.2rem; padding: 20px 12px 20px 12px; } span.Magazine { padding: 10px auto 10px auto; } a.Magazine { background: inherit; text-decoration: none; } a.Magazine:hover { cursor: pointer; color: #005; text-decoration: underline; } table td.Article { /* TO DO ??? */ } table td.Top { vertical-align: top; } table td.Left { text-align: left; } table td.Right { text-align: right; } img { border: 0; margin: 0; padding: 0; } p { vertical-align: middle; text-align: center; border: 0; margin: 0; padding: 0 5px 0 11px; } p.Book, span.Book { background-image: url('https://www.101World.Net/assets/images/icons/BookIcon40Blue.png'); background-repeat: no-repeat; background-size: 40px; background-position: top left; min-height: 40px; } span.Book { padding: 2px 0 3px 50px; } span.Booklet { background-image: url('https://www.101World.Net/assets/images/icons/BookIcon26Blue.png'); background-repeat: no-repeat; background-size: 26px; background-position: top left; padding: 1px 0 0 36px; } p.Hilite, span.Hilite, a.Hilite { color: #005; } p.Php, span.Php, a.Php { color: #0ac; font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 0.8rem;} p.Code, span.Code, a.Code { text-align: left; font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 0.8rem;} p.Code, span.Code { padding: 10px; word-break: break-word; } a.Code { color: inherit; } p.Larger, span.Larger, a.Larger { font-family: "CopperPlate", "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 2.6rem;} p.Medium, span.Medium, a.Medium { font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1.6rem;} p.Small, span.Small, a.Small { font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1.2rem;} p.Smaller, span.Smaller, a.Smaller { font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1rem;} div.Justify, p.Justify, span.Justify { text-align: justify; text-justify: auto; } p.Padded, span.Padded { padding: 15px 12px 15px 12px; } p.Indent { text-align: left; text-justify: none; padding: 1px 30px 1px 20px; } p.IndentC { text-align: centre; text-justify: none; padding: 0 30px 0 30px; } p.Scene { text-align: center; padding: 9px 0 0 0; } p.Anchor, span.Anchor { cursor: pointer; text-decoration: underline; } p.Center { width: 100%; text-align: center; } p.Left { text-align: left; } p.Right { text-align: right; } div.ButtonMore { position: relative; z-index: 1; background-image: url('https://www.101World.Net/assets/images/etcX/ButtonMoreNeg.png'); background-repeat: no-repeat; background-size: 100%, 100%; width: 130px; height: 44px; overflow: hidden; } a.ButtonMore, a.ButtonMore:hover { background: initial; text-decoration: none; } div.ButtonMoreEffect { position: absolute; z-index: 2; left: -68px; top: 0; width: 198px; height: 44px; background: inherit; } div.ButtonMoreEffectLeft { position: absolute; z-index: 4; background-image: url('https://www.101World.Net/assets/images/etcX/ButtonLeftNeg.png'); background-repeat: no-repeat; background-size: 100%, 100%; left: 0; top: 0; width: 195px; height: 44px; transition: left 1s; } div.ButtonMoreEffectRight { position: absolute; z-index: 3; background-image: url('https://www.101World.Net/assets/images/etcX/ButtonRightNeg.png'); background-repeat: no-repeat; background-size: 100%, 100%; left: 3px; top: 0; width: 195px; height: 44px; transition: left 1s; } div.ButtonMoreEffectLeft:hover { left: 68px; transition: left 0.3s;} p.Button, span.Button, span.ButtonSmall { background-image: url('https://www.101World.Net/assets/images/etcX/Button.png'); color: white; text-align: center; vertical-align: middle; padding: 10px 10px 10px 10px; } span.ButtonSmall { padding: 3px 5px 3px 5px; } a.Button { text-decoration: none; } p.Button:hover, span.Button:hover, span.ButtonSmall:hover, a.Button:hover { background: rgb(192,64,0); color: white; text-decoration: underline; } ol { border: 0; margin: 0; padding: 5px 5px 5px 55px; } ul { list-style: disc; list-style-position: outside; list-style-image: none; border: 0; margin: 0; padding: 10px 5px 0 35px; } ul li, ol li { text-align: left; border: 0; margin: 0; padding: 2px 0 0 1px; } a { color: black; font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1.2rem; border: 0; margin: 0; padding: 0; } a:hover { background-color: black; color: white; text-decoration: underline; } a.Caption { vertical-align: top; text-align: centre; color: black; font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1rem;} a.Caption:hover { vertical-align: top; text-align: centre; background: black; color: white; font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1rem;} a.Other { background: initial; } a.Img { background: black; color: white; vertical-align: middle; text-align: left; text-decoration: none; } a Img.Other { vertical-align: bottom; } select { font-size: 0.8rem; border: 0; margin: 2px 2px 3px 2px; padding: 0; } /* Menu Objects */ nav { border: 0; margin: 0; padding: 0; } nav span { display: block; vertical-align: middle; text-align: right; } nav a { font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1.2rem; text-decoration: underline; } nav span.Float, span.SmallNav { display: none; } nav span.MiniNav { display: block; } nav a.MiniNav { font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 0.8rem;} nav a.Float { vertical-align: bottom; text-align: right; } nav a.Float:hover, a.Float:hover { background: initial; text-decoration: none; } nav span.Other { display: block; } nav a.Other { background: white; color: black; vertical-align: bottom; text-align: right; } nav a.Other:hover { text-decoration: none; } nav span.BreadCrumb { vertical-align: middle; text-align: right; padding: 0 11px 9px 0; } nav a.BreadCrumb, bread-crumb.Text, bread-crumb.Navigated { font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1rem; border-color: black; border-style: solid; border-width: 1px 0px 1px 0px; } nav a.BreadCrumb, bread-crumb.Navigated { padding: 0 5px 0 5px; text-decoration: none; } a.BreadCrumb:hover { border-radius: 0px; } bread-crumb.Navigated { background: black; color: white; } bread-crumb.Text:hover, bread-crumb.Navigated:hover { cursor: default; } /* Classes: * Header */ div.Header { background-image: url('https://www.101World.Net/assets/images/backs/StxBGplanetA.jpg'); background-position: center; background-size: cover; background-repeat: no-repeat; background-color: white; color: black; margin: 0; padding: 0; } table.Header, table td.Header { color: black; font-family: "CopperPlate", "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 2.6rem;; } /* Navigation Bar */ table.Navigation { } a.Navigation { margin: 0; padding: 0 11px 0 11px; text-decoration: none; } a.Navigation:hover { border-radius: 7px; text-decoration: underline; } a.Navigated { font-weight: bold; background-color: black; color: white; margin: 0; padding: 0 11px 0 11px; text-decoration: none; } a.Navigated:hover { cursor: default; } /* Floating Menu */ table.menuFloat { position: absolute; visibility: hidden; display: block; z-index: 3; background: white; color: black; border-radius: 15px; border-color: black; border-width: 1px; border-style: solid; margin: 0; padding: 20px 23px 20px 23px; } td.menuFloat, a.menuFloat { font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 2rem;; } table tr.Navigation:hover { background-color: black; color: white; } table tr.Navigated { background-color: black; color: white; } table td.Navigation { border-radius: 7px; padding-top: 5px 1px 2px 1px; } div.menuMask { background: white; opacity: 0; position: absolute; top: 0; left: 0; width: 0; height: 0; z-index: 2; } div.bodyMask { background: rgb(0,0,32); opacity: 1; position: absolute; left: 0; top: 0; width: 100vw; height: 100vh; z-index: 4; } /* Title Box */ h1.Title { color: black; font-family: "CopperPlate", "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: bold; font-size: 3.2rem;} /* Footer Box */ div.Footer { background-image: url('https://www.101World.Net/assets/images/backs/StxBGplanetA.jpg'); background-position: center; background-size: cover; background-repeat: no-repeat; font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1.2rem; background-color: white; color: black; } table.Footer { width: 100%; color: black; font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1.2rem;; } table td.Footer { color: black; font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1.2rem;; } a.Footer { color: black; font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1.2rem;; text-decoration: none; } a.Footer:hover { background-color: black; color: white; text-decoration: underline; } /* Heading Box */ h2.Heading, table.Heading, td.Heading { color: black; font-family: "CopperPlate", "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 2.6rem;; } /* Sub-heading Box */ h3.SubHead, table.SubHead, td.SubHead { color: black; font-family: "CopperPlate", "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 2.3rem;; } a.SubHead { color: black; font-family: "CopperPlate", "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 2.3rem;; text-decoration: underline; } a.SubHead:hover { background: black; color: inherit; } /* Text Boxes */ div.Text { background: white; color: black; background-repeat: no-repeat; background-size: cover; font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1.2rem; border: 0; margin: 0; padding: 0; } td.Text, a.Text { color: black; font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1.2rem;} a.Text { text-decoration: underline; } a.Text:hover { background-color: black; color: white; } div.Text0 { color: inherit; font-family: "CopperPlate", "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1.6rem;} table.Text0 { color: inherit; font-family: "CopperPlate", "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1.6rem;} table td.Text0, p.Text0 { color: inherit; font-family: "CopperPlate", "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1.6rem;} a.Text0 { color: inherit; font-family: "CopperPlate", "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1.6rem; text-decoration: underline; } a.Text0:hover { background-color: inherit; color: inherit; } div.Text1 { background: white; color: black; font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1.2rem;} table.Text1 { color: black; font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1.2rem;} tr.Text1, td.Text1, p.Text1, span.Text1 { color: black; font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1.2rem;} p.Text1, span.Text1 { display: block; background: white; padding: 20px 22px 20px 22px; } a.Text1 { color: black; font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1.2rem; text-decoration: underline; } a.Text1:hover { background: black; color: white; } div.Text2 { background-image: url('https://www.101World.Net/assets/images/backs/StxBG201.jpg'); background-repeat: no-repeat; background-size: cover; color: black; font-family: "CopperPlate", "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1.2rem; padding: 14px 5px 8px 5px; } table.Text2 { color: black; font-family: "CopperPlate", "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1.2rem; padding: 2px 5px 2px 5px; } tr.Text2, td.Text2, p.Text2, span.Text2 { background: #eee; color: black; font-family: "CopperPlate", "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1.2rem;} a.Text2 { color: black; font-family: "CopperPlate", "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1.2rem; text-decoration: underline; } a.Text2:hover { background-color: black; color: #eee; } div.Text3 { background: #fffff060; color: black; font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1.2rem; padding: 20px 22px 20px 22px; margin: 0; } table.Text3 { color: black; font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1.2rem; padding: 20px 22px 20px 22px; margin: 0; } tr.Text3, td.Text3, p.Text3, span.Text3 { background: #fffff060; color: black; font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1.2rem;} a.Text3 { color: black; font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1.2rem; font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1.2rem; text-decoration: underline; } a.Text3:hover { background-color: black; color: #fffff060; } div.Text4 { background: white; color: black; font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1.2rem; padding: 20px 22px 20px 22px; margin: 0; } table.Text4 { color: black; font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1.2rem; padding: 20px 22px 20px 22px; margin: 0; } tr.Text4, td.Text4, p.Text4, span.Text4 { background: white; color: black; font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1.2rem;} a.Text4 { color: black; font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1.2rem; font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1.2rem; text-decoration: underline; } a.Text4:hover { background-color: black; color: white; } div.Text5 { background: white; color: black; font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1rem; padding: 20px 22px 20px 22px; margin: 0; } table.Text5 { color: black; font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1rem; padding: 20px 22px 20px 22px; margin: 0; } tr.Text5, td.Text5, p.Text5, span.Text5 { background: white; color: black; font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1rem;} a.Text5 { color: black; font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 1rem; text-decoration: underline; } a.Text5:hover { background: black; color: white; text-decoration: none; } div.Text6 { color: black; font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 0.8rem;} table.Text6 { color: black; font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 0.8rem;} table td.Text6, p.Text6, span.Text6 { color: black; font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 0.8rem; padding: 5px 0 0 0; margin: 0; } a.Text6 { color: black; font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 0.8rem;} a.Text6:hover { background: black; color: white; text-decoration: none; } div.Text7 { color: black; font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 0.8rem;} p.Text7, span.Text7 { color: black; font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 0.8rem; padding: 5px 0 0 0; margin: 0; } a.Text7 { color: black; font-family: "Monaco", "Helvetica", "Arial"; font-style: normal; font-weight: normal; font-size: 0.8rem;} a.Text7:hover { background: black; color: white; text-decoration: none; } table#menuHeader { border-color: black; border-style: solid; border-width: 0px 0px 0px 0px; } nav a.navigation, nav a.navigated { border-color: black; border-style: solid; border-width: 1px 0px 1px 0px; } div.Code, table td.Code, p.Code, span.Code { background: rgb(64,64,64); color: ivory; } /* 101World.net: FINAL Large/medium/small screens */ div.Large, div.Medium { display: block; } td.Large, td.Medium { display: table-cell; } tr.large, tr.Medium { display: table-row; } td.MarginLeft, td.MarginRight { width: 50px; } td.MarginCenter { min-width: 20px; max-width: 50px; } td.MarginTop, td.MarginBottom { height: 30px; } div.Small, p.Small, td.Small, tr.Small { display: none; } div.Tiny, p.Tiny, td.Tiny, tr.Tiny { display: none; } img.Large, img.Medium { width: 100%; } img.Universal { max-width: 100%; } img.Small { width: 100%; display: none; } img.Magazine { max-width: 350px; width: 100%; } img.Inline { vertical-align: middle; width: 40; height: 50; } a.Img:hover { background: black; } a.Container { background: inherit; text-decoration: underline; } a.Container:hover { cursor: pointer; text-decoration: none; } /* Choose correct objects by screen width: 1. Large (>= 980) */ @media (min-width: 980px) {} /* 2. Medium (<= 980) */ @media (max-width: 980px) { nav span.Navigation { display: none; } nav span.Float { display: block; } nav span.SmallNav { display: block; } div.Large { display: none; } td.Large, tr.Large { display: none; } div.Small, p.Small { display: block; } td.Small { display: table-cell; } tr.Small { display: table-row; } td.MarginLeft { width: 15px; } td.MarginRight { width: 0px; } td.MarginCenter { min-width: 10px; max-width: 15px; } td.MarginTop { height: 10px; } td.MarginBottom { height: 10px; } } /* 3. Small (portrait/phone devices <= 640 - Note: Additional to 2) */ @media (max-width: 640px) { div.Medium { display: none; } td.Medium { display: none; } tr.Medium { display: none; } img.Magazine, img.Medium { display: none; } img.Small { display: block; } div.Tiny, p.Tiny { display: block; } td.Tiny { display: table-cell; } tr.Tiny { display: table-row; } } /* Orientation storage and update */ .iOrientation { position: absolute; left: -20px; top: 0; width: 10px; height: 10px; opacity: 0; } @media (orientation: portrait) { .iOrientation {opacity: 0.5;} } @media (orientation: landscape) { .iOrientation {opacity: 1;} }