/* add all special styles used for displaying the rules */

/* .rules: used for all elements loading rules (rules at main site, rules
   ingame, popup with rules extract
   #rules: div with complete rules used at main site and ingame display
   #rulesContainer #rules: ingame rules display only
   #sidebarPanel #rules: ingame rules display on right side only
   #sidebarBottom #rules: ingame rules display at bottom only
   .ui-popup .rules: popup with rules extract only */

/* Fonts */
/* orbitron-regular - latin */
@font-face {
  font-family: 'Orbitron';
  font-style: normal;
  font-weight: 400;
  src: url('/game-plugins/volt/1.0.1/fonts/orbitron-v14-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('/game-plugins/volt/1.0.1/fonts/orbitron-v14-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/game-plugins/volt/1.0.1/fonts/orbitron-v14-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('/game-plugins/volt/1.0.1/fonts/orbitron-v14-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('/game-plugins/volt/1.0.1/fonts/orbitron-v14-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('/game-plugins/volt/1.0.1/fonts/orbitron-v14-latin-regular.svg#Orbitron') format('svg'); /* Legacy iOS */
}
/* orbitron-700 - latin */
@font-face {
  font-family: 'Orbitron';
  font-style: normal;
  font-weight: 700;
  src: url('/game-plugins/volt/1.0.1/fonts/orbitron-v14-latin-700.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('/game-plugins/volt/1.0.1/fonts/orbitron-v14-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/game-plugins/volt/1.0.1/fonts/orbitron-v14-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('/game-plugins/volt/1.0.1/fonts/orbitron-v14-latin-700.woff') format('woff'), /* Modern Browsers */
       url('/game-plugins/volt/1.0.1/fonts/orbitron-v14-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('/game-plugins/volt/1.0.1/fonts/orbitron-v14-latin-700.svg#Orbitron') format('svg'); /* Legacy iOS */
}
/* Fonts Ende */

span.emphasize { font-weight: bold; }
.italic { font-style: italic; }

#rules b { color: #1F3F63; }
#rules p {margin-bottom: 0.6em; }
#rules .voltfont { font-family: 'Orbitron', Geneva, Arial Rounded MT Bold, Verdana, Trebuchet MS, sans-serif; }

#rules .rulename {
  background-color: #2B295B;
  color: white;
  text-align: center;
  padding: 0px;
  font-size: 2em;
  border: 4px #A3D5F4 solid;
  border-radius: 8px;
  font-style: normal;
  font-weight: 700;
  min-height: 2em;
  line-height: 2em;
  font-family: 'Orbitron', Arial Rounded MT Bold, Verdana, Trebuchet MS, sans-serif;
}

#rules .chapter .title {
  background-image: url(/game-plugins/volt/1.0.1/images/rules/header_background.jpg);
  background-position: center;
  background-size: cover;
  color: #1F3F63;
  text-align: center;
  padding: 0px;
  font-size: 2em;
  border-top: 4px #36A7E9 solid;
  border-bottom: 4px #36A7E9 solid;
  font-family: 'Orbitron', Arial Rounded MT Bold, Verdana, Trebuchet MS, sans-serif;
  font-variant: small-caps;
  text-transform: uppercase;
  min-height: 2em;
  line-height: 2em;
}

#rules h1 {
  background-image: url(/game-plugins/volt/1.0.1/images/rules/header_background.jpg);
  background-position: center;
  background-size: cover;
  color: #1F3F63;
  padding: 0px;
  border-top: 4px #36A7E9 solid;
  border-bottom: 4px #36A7E9 solid;
  font-size: 1.75em;
  text-align: center;
  margin-top: 0.5em;
  margin-bottom: 0.5em;
  min-height: 2em;
  line-height: 2em;
  font-family: 'Orbitron', Arial Rounded MT Bold, Verdana, Trebuchet MS, sans-serif;
  font-variant: small-caps;
  text-transform: uppercase;
}

#rules h2 {
  color: #1F3F63;
  font-size: 1.8em;
  margin-top: 0.5em;
  margin-bottom: 0.5em;
  clear: left;
  font-family: 'Orbitron', Arial Rounded MT Bold, Verdana, Trebuchet MS, sans-serif;
  font-variant: small-caps;
  text-transform: uppercase;
  text-align: center;
}

#rules h3 {
  color: #1F3F63;
  font-size: 1.5em;
  clear: left;
  font-family: 'Orbitron', Arial Rounded MT Bold, Verdana, Trebuchet MS, sans-serif;
  margin-top: 0.5em;
  margin-bottom: 0.5em;
  font-variant: small-caps;
  text-transform: uppercase;
  text-align: center;
}

#rules h4 {
  color: #1F3F63;
  font-size: 1.25em;
  font-family: 'Orbitron', Arial Rounded MT Bold, Verdana, Trebuchet MS, sans-serif;
  text-align: center;
}

#rules ul {
  margin: 1em 0em 1em 2em;
  list-style-image: url('/game-plugins/volt/1.0.1/images/rules/list_symbol.png');
}
#rules li { margin-bottom: 0.2em; }
#rules ol {margin: 1em 0em 1em 2em; }
span.clear { clear: left; display: block; }
#rules .referback {float: right; font-size: 1.5em; font-weight: bold; margin-right: 1em; color: #2B295B; }

/* some picture definitions */
#rules .examplepicright { width: 30%; float: right; margin-left: 2em; }
#rules .examplepicleft { width: 50%; float: left; margin-right: 2em; }
#rules .examplepicfull { width: 95%; float: center;}
#rules .examplepicfull.examplepicfull--example_module_conditions { float: right; margin-bottom: inherit; margin-right: auto; } /* IE workaround */
#rules .inlinepic { height: 1.2em; margin-left: 0.2em; margin-right: 0.2em; }
#rules .inlinedice { height: 1.5em; margin-left: 0.2em; margin-right: 0.2em; margin-bottom: -0.1em; }
#rules .inlinediceoverlay { height: 1em; margin-left: -1.5em; margin-right: 0.3em; }
#rules .diceorderpic { width: 5em; float: left; margin-right: 2em; margin-top: 0.5em; margin-bottom: 0.5em; clear: left; }
#rules .tablepic { height: 7em; float: left; margin-top: -2em; }

/* sidebar or not sidebar */
#sidebarPanel #rules .nosidebar { display: none; }
.ui-popup .rules .nopopup { display: none; }
#rules .sidebaronly { display: none; }
#sidebarPanel #rules .sidebaronly { display: inherit; }

/* standard box with slightly round corners */
#rules .roundbox {
  padding-left: 0.5em;
  padding-right: 0.5em;
  margin-right: 1em;
  font-size: 1em;
  font-weight: bold;
  border-radius: 3px;
}

/* background and border colour definitions */
#rules .blueishback {  background-color: #DEEDFB; }
#rules .blueishborder { border: 2px solid #8DC4EF; border-radius: 8px; padding: 5px; padding-right: 10px; margin-top: 1em; margin-bottom: 1em; }
#rules .blueishtext { color: #1F3F63; }
#rules .whiteback {  background-color: #E6E6E6; }


/* exampleright */
#rules .exampleright { width: 40%; float: right; margin: .3em .5em; padding: .2em .5em; font-style: italic; }
#rules .exampleright .image img { width: 50%; float: left; margin-right: 1em; }

/* examplefull */
#rules .examplefull { width: 95%; float: right; margin: .3em .5em; padding: .2em .5em; font-style: italic; }
#rules .examplefull .image img { width: 20em; float: right; margin-left: 1em; }


/* modules */
#rules .module { width: 42%; margin-top: 0.5em; min-height: 80px; float: left; margin-right: 2em; }
#rules .module .modulepicture { max-width: 72px;  max-height: 72px;  overflow: hidden; float: left; margin-right: 1em; border-radius: 50%; }
#rules .module .modulepicture img { max-width: none; width: 115px; height: auto; margin-left: -21px; margin-top: -12px; }
#rules .module .header { color: #1F3F63; font-size: 1.5em; font-family: 'Orbitron', Arial Rounded MT Bold, Verdana, Trebuchet MS, sans-serif; font-variant: small-caps; text-transform: uppercase; }
#rules .module .header.blue {border: 3px solid #8DC4EF; background-color: #F5F9FD; border-radius: 8px; padding: 5px; padding-right: 10px; }
#rules .module .header.red {border: 3px solid #C02327; background-color: #FFEDEA; border-radius: 8px; padding: 5px; padding-right: 10px; }
#rules .module .header.yellow {border: 3px solid #F7F410; background-color: #FFFEF6; border-radius: 8px; padding: 5px; padding-right: 10px; }

#rules .moduledicered { width: 47px;  height: 47px;  float: right; margin-left: 1em;  border-radius: 5px; position: relative;
                background-image: url(/game-plugins/volt/1.0.1/images/rules/moduledice_red.jpg); background-position: center; background-size: cover;
                }
#rules .modulediceblue { width: 47px;  height: 47px;  float: right; margin-left: 1em;  border-radius: 5px; position: relative;
                background-image: url(/game-plugins/volt/1.0.1/images/rules/moduledice_blue.jpg); background-position: center; background-size: cover;
                }
#rules .moduledicetext {
  position: absolute;
  width: 47px;
  text-align: center;
  top: 17px;
  color: white;
  font-family: 'Orbitron', sans-serif;
  font-size: 18px;
  font-weight: 700;
}
#rulesContainer #rules .module { width: 95%; }

#rules .circle { border-radius: 50%; text-align: center; }

#rules .content {width: 45%; float: left; margin-right: 1em; }
#rulesContainer #rules .content { width: 95%; }

.module_image--hover { width: 153px; height: 237px; }

#rules .module.faq__module { float: none; margin: auto; width: 80px; }

/* arena elements */
#rules .arenaelement { width: 45%; float: left; margin: .3em .5em; padding: .2em .5em; background-color: #F5F9FD; border-radius: 4px; min-height: 8em; }
#rules .arenaelement img { float: left; height: 7em; width: auto; margin-right: 1em; }
#rulesContainer #rules .arenaelement { width: 95%; }

/* arenas */
#rules .arena { width: 95%;}
#rules .arena img { float: left; width: 45%; margin-right: 1em; }
#rulesContainer #rules .arenaelement { width: 95%; }

#rules .log__coord {
  padding: 0em 0.4em;
  border-radius: 0.3em;
  border: 1px solid #A9A9A9;
}

/* FAQ */
div.FAQ_Question {
  font-weight: bold;
  margin-top: 12px;
  margin-bottom: 6px;
}
span.FAQ_AnswerHeader {
  font-weight: bold;
}
div.FAQ_Answer {
  margin-top: 10px;
  margin-bottom: 12px;
  line-height: 130%;
}
