.pageContentContainer
{
   height: calc(100vh - 40pt);
   margin: 0 auto;
   max-width:480pt;
   display: block;
   align-items: center;
   justify-content: center;
   text-align: justify;
   padding:8pt;
   padding-top:4pt;
   padding-left:2pt;
   padding-right:4pt;
   background: rgba(0,0,0, 0.16);
   background-filter: blur(100px);
   border-radius: 6pt;
}

.pageContent {
   height: calc(100vh - 60pt);
   margin: 0 auto;
   max-width:480pt;
   display: block;
   align-items: center;
   justify-content: center;
   text-align: justify;
   padding:10pt;
   padding-top:5pt;
   color: #FFFFEE;
   overflow-y: scroll;
   line-height:140%;
}

.pageContentContainer.light {
   background: rgba(250,250,250, 0.5);
}
.pageContent.light {
   color: #000000;
}

.pageContentTop {
   padding: 0;
   margin: 0;
   padding-left:10pt;
   padding-bottom:12pt;
   color: #AAAAAA;
   overflow:hidden;
}
.pageContentTop.light {
   color: #000000;
}

.pageContentTop a {
   color: orange;
}

.pageContentTop a.light {
   color: #804010;
}

.pageContentTextHighlight {
   color: orange;
}

.pageContentTextHighlight.light {
   color: #804010;
}

::-webkit-scrollbar {
  width: 8pt;
}

.pageContent a {
   color: orange;
}
.pageContent a.light {
   color: #804600;
   font-weight:bold;
}

p {
   padding-top:2pt;
   padding-bottom:8pt;
   line-height:140%;
}

input, textarea {
   color:#FFFFFF;
   background-color:rgba(240,240,240,0.2);
}

input.light, textarea.light {
   color:#000000;
   //background-color:rgba(250,250,250,0.4);
}

.buttonSubmit {
   background-color: rgba(200,120,40,1);
   color: #FFFFFF;
   padding: 0.22rem 0.7rem;
   border: none;
   outline: none;
   border-radius: 10pt;
   text-decoration: none;
   font-size: 0.8rem;
   font-weight: bold;
   cursor: pointer;
   justify-content: center;
   text-align: center;
   transition: scale 0.2 ease;
}


.buttonSubmit.light {
   color: #000000;
}

.buttonSubmit:hover {
   scale: 1.05;
   background-color: rgba(250,140,40,1);
   color: #FFFFFF;
}

.buttonSubmit:active {
   scale: 0.95;
}

.bullet {
  display: inline-block;
  background-color:rgba(150,200,250,0.2);
  border: 1px solid #AAAAAA;
  border-radius: 6pt;
  padding: 1pt;
  padding-left:5pt;
  padding-right:5pt;
  margin-right:7pt;
  margin-top:10pt;
  margin-bottom:2pt;
  font-weight:bold;
}
.bullet.light {
  background-color:orange;
}

.toolTipBox
{
   background-color:rgba(0,0,0,0.1);
   border: 1px solid #CCCCCC;
   border-radius:6pt;
   padding:7pt;
   margin-top:8pt;
   margin-bottom:8pt;
}

.toolTipBox.light
{
   background-color:rgba(255,255,255,0.2);
   border: 1px solid #222222;
}

hr {
   margin-top:10pt;
   margin-bottom:15pt;
}

hr.light {
   color:#000000;
}

/* Track */
::-webkit-scrollbar-track {
  opacity:0.1;
  box-shadow: inset 0 0 4px grey; 
  border-radius: 4pt;
}
 
::-webkit-scrollbar-track:hover {
  opacity:0.7;
  box-shadow: inset 0 0 4px #f0ffff; 
  border-radius: 4pt;
}

.pageContent.light::-webkit-scrollbar-track {
  opacity:0.1;
  box-shadow: inset 0 0 4px grey;
  border-radius: 4pt;
}

.pageContent.light::-webkit-scrollbar-track:hover {
  opacity:0.4;
  box-shadow: inset 0 0 4px #444444;
  border-radius: 4pt;
}


.cardFrame
{
   position:relative;
   margin:0pt;
   padding:10pt;
   background-color:rgba(20,20,20,0.2);
   border:1px solid #CCCCCC;
   border-color: rgba(250,250,250,0.2);
   border-radius:5pt;
}

.cardFrame.light {
   background-color:rgba(250,250,250,0.1);
   border-color: rgba(20,20,20,0.4);
}

.cardIcon
{
   display:inline;
   height:32pt;
   vertical-align:middle;
   padding-right:10pt;
   position:relative;
   top:-3pt;
}

.cardTitle
{
   font-size:1rem;
   font-weight:bold;
   display:inline;
   color: orange;
}

.cardTitle.light {
   color: #804600;
}

.cardIconDrone {
   content:url(images/icon_drone2_white.png);
}
.cardIconDrone.light {
   content:url(images/icon_drone2_blue.png);
}

.cardIconController {
   content:url(images/icon_controller_white.png);
}
.cardIconController.light {
   content:url(images/icon_controller_blue.png);
}

.cardIconBoard {
   content:url(images/icon_board_white.png);
}
.cardIconBoard.light {
   content:url(images/icon_board_blue.png);
}

.cardIconRadio {
   content:url(images/icon_radio_cards_white.png);
}
.cardIconRadio.light {
   content:url(images/icon_radio_cards_blue.png);
}

.cardIconCamera {
   content:url(images/icon_camera_white.png);
}
.cardIconCamera.light {
   content:url(images/icon_camera_blue.png);
}

.pictureContainer
{
   vertical-align:top;
   display:inline-block;
   margin:0pt;
   padding:0pt;
   padding-top:5pt; padding-bottom:5pt;
}

.pictureFrameSimple
{
   margin:0pt; padding:0pt; box-shadow: 0pt 0pt 3pt #444444;
   border-radius:3pt;
}

.popupImgContainer {
   zIndex:2001; z-index:2001; cursor:zoom-out; justify-content: center;
   background-color: #112731;
}

.popupImgContainer.light {
   zIndex:2001; z-index:2001; cursor:zoom-out; justify-content: center;
   background-color:#EEEEEE;
}

.pictureLegend {
   padding-top:-2pt; padding-left:10pt; border-bottom:1px solid #DDDDDD; margin-bottom:7pt
}

.pictureLegend.light {
   padding-top:-2pt; padding-left:10pt; border-bottom:1px solid #222222; margin-bottom:7pt
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: rgba(250,170,80,0.7); 
  border-radius: 4pt;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: rgba(255,150,40, 0.9); 
}