﻿body{
background-color:#333;
}

.bodyBG{
   background-color:#333;
	/* background-image:url('../img/background.jpg'); */
}

.container-fluid{
	margin-top : 10px;
}


.resp-container {
    position: relative;
    overflow: hidden;
    padding-top: 56.25%;
}

.resp-iframe {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   border: 0;
}

.video-containerSF {
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 30px;
  height: 0;
  overflow: hidden;
}

.header{
	width:100%;
	background-color:rgba(128, 170, 255,0.5);
	height:40px;
}

.activeHeader{
	float:left;
	height:40px;
	width:150px;
	text-align: center;	
    background-color:#003399;
	color:white;
	border-radius: 15px 15px 0px 0px;
	margin-right:3px;
}

.logoIMG{
	
	float:right;
}

.resolutionButton{
	cursor:pointer;
}


.thumbnail:hover{
	border:1px solid blue;
}

.bookmarksF{
	text-align:center;
}

.button_cam {
   -webkit-border-radius: 10px;
   -moz-border-radius: 10px;
   border-radius: 10px;
   color: #ffffff;
   background: #2ecc70;
   padding: 6px 10px 6px 10px;
   font-size: 25px;
   text-decoration: none;
   cursor: pointer;
   border: none;
   margin-left: 2px;
   margin-right: 2px;
   -webkit-user-select: none;  /* not selectable text - Chrome all / Safari all */
   -moz-user-select: none;     /* Firefox all */
   -ms-user-select: none;      /* IE 10+ */
   user-select: none;          /* Likely future */      

}

.button_cam:hover {
   background: #16a084;
   color: #ffffff;
   text-decoration: none;
   cursor: pointer;
   box-shadow: 0 0 3px #FFF, 0 0 6px #FFF, 0 0 7px #FFF, 0 0 10px #18f7ff, 0 0 15px #18f7ff, 0 0 20px #18f7ff, 0 0 25px #18f7ff, 0 0 30px #18f7ff;
   -webkit-user-select: none;  /* not selectable text - Chrome all / Safari all */
   -moz-user-select: none;     /* Firefox all */
   -ms-user-select: none;      /* IE 10+ */
   user-select: none;          /* Likely future */      

}
.button_cam:active {
   background: #fd0101;
   color: #ffffff;
   text-decoration: none;
   box-shadow: 0 0 6px #FFF, 0 0 12px #FFF, 0 0 15px #FFF, 0 0 20px #fd0101, 0 0 30px #fd0101, 0 0 40px #fd0101, 0 0 50px #fd0101, 0 0 70px #fd0101;
   cursor: pointer;
   -webkit-user-select: none;  /* not selectable text - Chrome all / Safari all */
   -moz-user-select: none;     /* Firefox all */
   -ms-user-select: none;      /* IE 10+ */
   user-select: none;          /* Likely future */      

}


.button_camON {
   -webkit-border-radius: 10px;
   -moz-border-radius: 10px;
   border-radius: 10px;
   color: #ffffff;
   background: #bbff00;
   box-shadow: 0 0 6px #FFF, 0 0 12px #FFF, 0 0 15px #FFF, 0 0 20px #55ff00, 0 0 30px #55ff00, 0 0 40px #55ff00, 0 0 50px #55ff00, 0 0 70px #55ff00;   
   padding: 6px 10px 6px 10px;
   font-size: 25px;
   text-decoration: none;
   cursor: pointer;
   border: none;
   margin-left: 2px;
   margin-right: 2px;
   -webkit-user-select: none;  /* not selectable text - Chrome all / Safari all */
   -moz-user-select: none;     /* Firefox all */
   -ms-user-select: none;      /* IE 10+ */
   user-select: none;          /* Likely future */  
   -webkit-animation: colorpulsetextON 1s infinite alternate;
   animation: colorpulsetextON 1s infinite alternate;
   }
   @-webkit-keyframes colorpulsetextON {
   0%   { color: rgb(13, 0, 197); }
   50%  { color: rgb(160, 0, 0); }
   80%   { color: rgb(0, 0, 0); }
   }
   @keyframes colorpulsetextON {
      0%   { color: rgb(14, 0, 216); }
      50%  { color: rgb(158, 0, 8); }
      80%   { color: rgb(0, 0, 0); }      
   }      

}

.button_camON:hover {
   background: #00fdcb;
   color: #ffffff;
   text-decoration: none;
   box-shadow: 0 0 6px #FFF, 0 0 12px #FFF, 0 0 15px #FFF, 0 0 20px #55ff007c, 0 0 30px #55ff007c, 0 0 40px #55ff007c, 0 0 50px #55ff007c, 0 0 70px #55ff007c;      
   cursor: pointer;
   -webkit-user-select: none;  /* not selectable text - Chrome all / Safari all */
   -moz-user-select: none;     /* Firefox all */
   -ms-user-select: none;      /* IE 10+ */
   user-select: none;          /* Likely future */      

}
.button_camON:active {
   background: #fd0101;
   color: #ffffff;
   text-decoration: none;
   box-shadow: 0 0 6px #FFF, 0 0 12px #FFF, 0 0 15px #FFF, 0 0 20px #fd0101, 0 0 30px #fd0101, 0 0 40px #fd0101, 0 0 50px #fd0101, 0 0 70px #fd0101;
   cursor: pointer;
   -webkit-user-select: none;  /* not selectable text - Chrome all / Safari all */
   -moz-user-select: none;     /* Firefox all */
   -ms-user-select: none;      /* IE 10+ */
   user-select: none;          /* Likely future */ 
}



.button_cam2ON {
   -webkit-border-radius: 10px;
   -moz-border-radius: 10px;
   border-radius: 10px;
   color: #ffffff;
   background: #ff0000;
   box-shadow: 0 0 6px #FFF, 0 0 12px #FFF, 0 0 15px #FFF, 0 0 20px #55ff00, 0 0 30px #55ff00, 0 0 40px #55ff00, 0 0 50px #55ff00, 0 0 70px #55ff00;   
   padding: 6px 10px 6px 10px;
   font-size: 25px;
   text-decoration: none;
   cursor: pointer;
   border: none;
   margin-left: 2px;
   margin-right: 2px;
   -webkit-user-select: none;  /* not selectable text - Chrome all / Safari all */
   -moz-user-select: none;     /* Firefox all */
   -ms-user-select: none;      /* IE 10+ */
   user-select: none;          /* Likely future */  
   -webkit-animation: colorpulsetext 1s infinite alternate;
   animation: colorpulsetext 1s infinite alternate;
   }
   @-webkit-keyframes colorpulsetext {
   0%   { color: rgb(13, 0, 197); }
   50%  { color: rgb(160, 0, 0); }
   80%   { color: rgb(0, 0, 0); }
   }
   @keyframes colorpulsetext {
      0%   { color: rgb(14, 0, 216); }
      50%  { color: rgb(158, 0, 8); }
      80%   { color: rgb(0, 0, 0); }      
   }      

}




.zoomcolor {
   background: rgba(0, 184, 184, 0.74) !important;
}

.zoomcolor2 {
   background: #ff552a91 !important;
}
.zoomcolor2:hover {
   background: #ff9c2af6 !important;
}


.button_cam2 {
   -webkit-border-radius: 10px;
   -moz-border-radius: 10px;
   border-radius: 10px;
   color: #ffffff;
   background: #f50707;
   padding: 6px 10px 6px 10px;
   font-size: 25px;
   text-decoration: none;
   cursor: pointer;
   border: none;
   margin-left: 2px;
   margin-right: 2px;
   -webkit-user-select: none;  /* not selectable text - Chrome all / Safari all */
   -moz-user-select: none;     /* Firefox all */
   -ms-user-select: none;      /* IE 10+ */
   user-select: none;          /* Likely future */      

}

.button_cam2:hover {
   box-shadow: 0 0 3px #FFF, 0 0 6px #FFF, 0 0 7px #FFF, 0 0 10px #f6ff7e, 0 0 15px #f6ff7e, 0 0 20px #f6ff7e, 0 0 25px #f6ff7e, 0 0 30px #f6ff7e;
   color: #f3f6cc;
background: #ff0101;
}
.button_cam2arrow {
   -webkit-border-radius: 10px;
   -moz-border-radius: 10px;
   border-radius: 10px;
   color: #ffffff;
   background: #f50707;
   padding: 6px 13px 6px 12px;
   font-size: 26px;
   font-weight: 1000;
   cursor: pointer;
   border: none;
   margin-left: 2px;
   margin-right: 2px;
   -webkit-user-select: none;  /* not selectable text - Chrome all / Safari all */
   -moz-user-select: none;     /* Firefox all */
   -ms-user-select: none;      /* IE 10+ */
   user-select: none;          /* Likely future */      

}

.button_cam2arrow:hover {
box-shadow: 0 0 3px #FFF, 0 0 6px #FFF, 0 0 7px #FFF, 0 0 10px #f6ff7e, 0 0 15px #f6ff7e, 0 0 20px #f6ff7e, 0 0 25px #f6ff7e, 0 0 30px #f6ff7e;
color: #ffffff;
background: #ff0202;
}
/* 

.button_cam2:hover {
   background: #3f05c8ad;
   color: #ffffff;
   text-decoration: none;
   cursor: pointer;
   -webkit-user-select: none; 
   -moz-user-select: none;     
   -ms-user-select: none;      
   user-select: none;          

}  */
.button_cam2:active {
   background: #3cff00ad;
   color: #ffffff;
   text-decoration: none;
   box-shadow: 0 0 3px #FFF, 0 0 6px #FFF, 0 0 7px #FFF, 0 0 10px #49ff18, 0 0 15px #49FF18, 0 0 20px #49FF18, 0 0 25px #49FF18, 0 0 30px #49ff18;
   cursor: pointer;
   -webkit-user-select: none;  /* not selectable text - Chrome all / Safari all */
   -moz-user-select: none;     /* Firefox all */
   -ms-user-select: none;      /* IE 10+ */
   user-select: none;          /* Likely future */      

}

.buttonSettOn {
   -webkit-border-radius: 6px;
   -moz-border-radius: 6px;
   border-radius: 6px;
   color: #ffffff;
   background: #ff0000;
   text-shadow: rgb(0, 12, 117) 1px 1px 0;
   box-shadow: 0 0 3px #FFF, 0 0 7px #FFF, 0 0 9px #FFF, 0 0 10px #55ff00, 0 0 15px #55ff00, 0 0 20px #55ff00, 0 0 25px #55ff00, 0 0 40px #55ff00;   
   padding: 4px 8px 4px 8px;
   font-size: 24px;
   text-decoration: none;
   cursor: pointer;
   border: none;
   margin-top: 7px;
   margin-left: -1px;
   margin-right: 0px;
   -webkit-user-select: none;  /* not selectable text - Chrome all / Safari all */
   -moz-user-select: none;     /* Firefox all */
   -ms-user-select: none;      /* IE 10+ */
   user-select: none;          /* Likely future */  
   -webkit-animation: colorpulsetextSettOn 1s infinite alternate;
   animation: colorpulsetextSettOn 1s infinite alternate;
   }
   @-webkit-keyframes colorpulsetextSettOn {
   0%   { color: rgb(251, 255, 4); }
   50%  { color: rgb(160, 0, 0); }
   80%   { color: rgb(255, 255, 255); }
   }
   @keyframes colorpulsetextSettOn {
      0%   { color: rgb(255, 238, 7); }
      50%  { color: rgb(158, 0, 8); }
      80%   { color: rgb(255, 255, 255); }      
   }      

}

.buttonSet {
   -webkit-border-radius: 10px;
   -moz-border-radius: 10px;
   border-radius: 10px;
   color: #ffffff;
   background: #f50707bb;
   padding: 4px 6px 4px 6px;
   font-size: 24px;
   text-decoration: none;
   cursor: pointer;
   border: none;
   margin-left: 2px;
   margin-right: 2px;
   -webkit-user-select: none;  /* not selectable text - Chrome all / Safari all */
   -moz-user-select: none;     /* Firefox all */
   -ms-user-select: none;      /* IE 10+ */
   user-select: none;          /* Likely future */      

}

.button_cam2set {
   -webkit-border-radius: 6px;
   -moz-border-radius: 6px;
   border-radius: 6px;
   color: #ffffff;
   background: #1707f5bb;
   text-shadow: rgb(0, 12, 117) 2px 2px 0;
   padding: 4px 8px 4px 8px;
   font-size: 24px;
   text-decoration: none;
   cursor: pointer;
   border: none;
   margin-top: 7px;
   margin-left: -1px;
   margin-right: 0px;
   -webkit-user-select: none;  /* not selectable text - Chrome all / Safari all */
   -moz-user-select: none;     /* Firefox all */
   -ms-user-select: none;      /* IE 10+ */
   user-select: none;          /* Likely future */      

}
.button_cam2set:hover {
   box-shadow: 0 0 3px #FFF, 0 0 6px #FFF, 0 0 7px #FFF, 0 0 10px #18f7ff, 0 0 15px #18f7ff, 0 0 20px #18f7ff, 0 0 25px #18f7ff, 0 0 30px #18f7ff;
}


.button_focus {
   -webkit-border-radius: 4px;
   -moz-border-radius: 4px;
   border-radius: 4px;
   color:black;
   background: white;
   padding: 6px 16px 6px 16px;
   font-size: 25px;
   text-decoration: none;
   cursor: pointer;
   border: none;
   -webkit-user-select: none;  /* not selectable text - Chrome all / Safari all */
   -moz-user-select: none;     /* Firefox all */
   -ms-user-select: none;      /* IE 10+ */
   user-select: none;          /* Likely future */      

}
.button_focusON {
   -webkit-border-radius: 4px;
   -moz-border-radius: 4px;
   border-radius: 4px;
   color:white;
   background:red;
   padding: 6px 16px 6px 16px;
   font-size: 25px;
   text-decoration: none;
   cursor: pointer;
   border: none;
   -webkit-user-select: none;  /* not selectable text - Chrome all / Safari all */
   -moz-user-select: none;     /* Firefox all */
   -ms-user-select: none;      /* IE 10+ */
   user-select: none;          /* Likely future */      

}

.focus1 {
   position: relative;
   margin-left: 23px;
   top: -40px;
}

.focus2 {
   position: relative;   
   margin-left: 11px;
   top: -40px;
}

.focus3 {
   position: relative;
   margin-left: 11px;
   top: -40px;
}


.bright1 {
   position: relative;
   margin-left: 13px;
   top: -40px;
}

.bright2 {
   position: relative;   
   margin-left: 15px;
   top: -40px;
}

.bright3 {
   position: relative;
   margin-left: 15px;
   top: -40px;
}

.button_focus:hover, .button_focusON:hover {
   box-shadow: 0 0 3px #FFF, 0 0 6px #FFF, 0 0 7px #FFF, 0 0 10px #18f7ff, 0 0 15px #18f7ff, 0 0 20px #18f7ff, 0 0 25px #18f7ff, 0 0 30px #18f7ff;
}

input.savepresbut {
   position: relative;
   float: none;
   margin-top:5px !important;
   height: 34px;
   padding-top: 0px;
   color: white;
   background-color: rgb(146, 59, 59);
}

input.savepresbuttonNew {
   position: relative;
   float: right;
   -webkit-border-radius: 6px;
   -moz-border-radius: 6px;
   border-radius: 6px;
   width:49px;
   max-width:49px;
   min-width: 49px;
   margin-top:6px !important;
   margin-right:8px !important;
   height: 34px;
   padding-top: 0px;
   color: white;
   background-color: rgb(168, 0, 0);
}

input.savepresbuttonNew:hover {
   box-shadow: 0 0 3px #FFF, 0 0 6px #FFF, 0 0 7px #FFF, 0 0 10px #9c093a, 0 0 15px #9c093a, 0 0 20px #9c093a, 0 0 25px #9c093a, 0 0 30px #9c093a;
}

iframe { 
   overflow:hidden; 
}

 /*   Change Color for Active Tabs     */
 .nav-pills>li.active>a,
 .nav-pills>li.active>a:focus
     {
   background-color:#337ab7;
   border-color: #337ab7;
   color: rgb(255, 230, 0);
   -webkit-user-select: none;  /* not selectable text - Chrome all / Safari all */
   -moz-user-select: none;     /* Firefox all */
   -ms-user-select: none;      /* IE 10+ */
   user-select: none;          /* Likely future */      

 }

  .nav-pills>li.active>a:hover,
 .nav-pills>li>a:hover,
 .nav>li>a:hover {
   background-color: #0054c2;
   border-color: #aaa;
   color: #0000FF;
   -webkit-user-select: none;  /* not selectable text - Chrome all / Safari all */
   -moz-user-select: none;     /* Firefox all */
   -ms-user-select: none;      /* IE 10+ */
   user-select: none;          /* Likely future */      

 }
 
 /*   Change Color for Inactive Tabs     */
 .nav-pills>li>a {
   background-color: #184164;
   border: 1px solid #337ab7;
   border-radius: 4px 4px 0 0 ;
   color: rgb(251, 251, 149);
   
   -webkit-user-select: none;  /* not selectable text - Chrome all / Safari all */
   -moz-user-select: none;     /* Firefox all */
   -ms-user-select: none;      /* IE 10+ */
   user-select: none;          /* Likely future */      

 }
 
#exTab .tab-content {
color : #fff;
background-color: #337ab7;
padding : 5px;
/* width: fit-content; */
margin-left: 0px;
width: 480px;
max-height: 350px;
-webkit-user-select: none;  /* not selectable text - Chrome all / Safari all */
-moz-user-select: none;     /* Firefox all */
-ms-user-select: none;      /* IE 10+ */
user-select: none;          /* Likely future */      

}
#IdMenu1:focus, #IdMenu2:focus, #IdMenu3:focus, #IdMenu4:focus, #IdMenu5:focus, #IdMenu6:focus, #IdMenu7:focus, #IdMenu1:active {
   color: rgb(142, 250, 0);
}

    /*   Change Color for Active Tabs     */
    /* .nav-pills>li.active>a,
    .nav-pills>li.active>a:focus
        {
      background-color: blue;
      border-color: #bbb;
      color: #FFFFFF;
    }

    .nav-pills>li.active>a:hover,
    .nav-pills>li>a:hover,
    .nav>li>a:hover {
      background-color: #217cf4;
      border-color: #bbb;
      color: #FFFFFF;
    } */
    
    /*   Change Color for Inactive Tabs     */


input.sed1{
	background-color:#ddd;
   color:black;
   margin-bottom: 5px;
   height:60px;
   width: 60px;
   white-space: normal;
}

input.togglebuttonOn {
   background-color:red;
   box-shadow: 0 0 6px #FFF, 0 0 12px #FFF, 0 0 15px #FFF, 0 0 20px #fd0101, 0 0 30px #fd0101, 0 0 40px #fd0101, 0 0 50px #fd0101, 0 0 70px #fd0101;   
   font-size: 15px;
   font-weight: 700 ;
   margin-left: 0px;
   height:50px;
   width: 95px;
   white-space: normal;
   cursor: pointer;
   color: white;
}

input.togglebuttonOn {
   box-shadow: 0 0 6px #FFF, 0 0 12px #FFF, 0 0 15px #FFF, 0 0 20px #fd0101, 0 0 30px #fd0101, 0 0 40px #fd0101, 0 0 50px #fd0101, 0 0 70px #fd0101;
}

input.togglebuttonOff {
   background-color:#666;
   font-size: 15px;
   font-weight: 700 ;
   margin-left: 0px;
   height:50px;
   width: 95px;
   white-space: normal;
   cursor: pointer;
   color: white;
}

input.togglebuttonOff:hover {
   background-color:#888;
   box-shadow: 0 0 3px #FFF, 0 0 6px #FFF, 0 0 7px #FFF, 0 0 10px #999, 0 0 15px #999, 0 0 20px #999, 0 0 25px #999, 0 0 30px #999;
}

input.OverButtonOn
{
	background-color:yellow;
   border-radius: 20%;
   border-color: white;
   font-size: 15px;
   font-weight: 750 ;
   margin-left: 5px;
   height:60px;
   width: 60px;
   white-space: normal;
   cursor: pointer;
   color: black;
   background-color:yellow;font-weight: bold; box-shadow: 0 0 3px #FFF, 0 0 6px #FFF, 0 0 7px #FFF, 0 0 10px #f5ffa0, 0 0 15px #f5ffa0, 0 0 20px #f5ffa0, 0 0 25px #f5ffa0, 0 0 30px #f5ffa0;
   }

input.OverButtonOff {
   background-color:#555;
   border-radius: 20%;
   font-size: 15px;
   font-weight: 750 ;
   margin-left: 5px;
   height:60px;
   width: 60px;
   white-space: normal;
   cursor: pointer;
   color: white;
}

input.OverButtonOff:hover {
   background-color:#555;
   border-radius: 20%;
   font-size: 16px;
   font-weight: 850 ;
   margin-left: 5px;
   height:60px;
   width: 60px;
   white-space: normal;
   background-color:#ffd138;
   font-weight: bold; 
   box-shadow: 0 0 3px #FFF, 0 0 6px #FFF, 0 0 7px #FFF, 0 0 10px #ffd138, 0 0 15px #ffd138, 0 0 20px #ffd138, 0 0 25px #ffd138, 0 0 30px #ffd138;
   cursor: pointer;
   color: blue;
}


input.presets1{
	background-color:#0066cc;
	color:white;
	height:30px;
}
input.presetsIframe{
	background-color:#0066cc;
	color:white;
	/* height:36px; */
}

img.presets1:hover {
   box-shadow: 0 0 3px #FFF, 0 0 6px #FFF, 0 0 7px #FFF, 0 0 10px #a8a8a8, 0 0 15px #a8a8a8, 0 0 20px #a8a8a8, 0 0 25px #a8a8a8, 0 0 30px #a8a8a8;
}

input.sed2{
	color:white;
   height:50px;
   width: 50px;
   font-weight: bold;
   white-space: normal;
   background-color: #004a7a; 
   font-size:14px; 
}

input.sed2:hover {
   background-color: #043e9c; 
   box-shadow: 0 0 3px #FFF, 0 0 6px #FFF, 0 0 7px #FFF, 0 0 10px #18f7ff, 0 0 15px #18f7ff, 0 0 20px #18f7ff, 0 0 25px #18f7ff, 0 0 30px #18f7ff;
}

input.inpbuttonOn
{
   font-size: 22px;
   font-weight: 750 ;
   height:60px;
   width: 60px;
   margin-left: 100px;
   white-space: normal;
   cursor: pointer;
   color: white;
	background-color:#0066cc;
}

input.inpbuttonOn:hover {
   font-size: 22px;
   font-weight: 850 ;
   height:60px;
   width: 60px;
   margin-left: 100px;
   box-shadow: 0 0 6px #FFF, 0 0 12px #FFF, 0 0 15px #FFF, 0 0 20px #fd0101, 0 0 30px #fd0101, 0 0 40px #fd0101, 0 0 50px #fd0101, 0 0 70px #fd0101;
   white-space: normal;
   cursor: pointer;
   color: rgb(251, 255, 0);
	background-color:#020aee;
}


input.inpbuttonOff
{
	background-color:grey;
   font-size: 15px;
   font-weight: 750 ;
   height:60px;
   width: 60px;
   margin-left: 6px;
   white-space: normal;
   cursor: pointer;
   color: white;
}

input.inpbuttonOff:hover {
   font-size: 15px;
   font-weight: 850 ;
   height:60px;
   width: 60px;
   margin-left: 6px;
   box-shadow: 0 0 6px #FFF, 0 0 12px #FFF, 0 0 15px #FFF, 0 0 20px #fd0101, 0 0 30px #fd0101, 0 0 40px #fd0101, 0 0 50px #fd0101, 0 0 70px #fd0101;
   white-space: normal;
   cursor: pointer;
   color: rgb(251, 255, 0);
	background-color:#0006ba;
}

input.inpbuttonOff:active {
   box-shadow: 0 0 6px #FFF, 0 0 12px #FFF, 0 0 15px #FFF, 0 0 20px #fd0101, 0 0 30px #fd0101, 0 0 40px #fd0101, 0 0 50px #fd0101, 0 0 70px #fd0101;
}

button.inpbuttonOn
{
	background-color:rgb(0, 194, 74);
   font-size: 15px;
   font-weight: 750 ;
   height:60px;
   width: 60px;
   margin: 3px 6px 3px 0px;
   border-radius: 15%c;
   border: 2px inset black;
      /* box-shadow: 0 0 5px #FFF, 0 0 10px #FFF, 0 0 15px #FFF, 0 0 20px #49ff18, 0 0 30px #49FF18, 0 0 40px #49FF18, 0 0 55px #49FF18, 0 0 75px #49ff18; */
   box-shadow: 0 0 3px #FFF, 0 0 6px #FFF, 0 0 7px #FFF, 0 0 10px #49ff18, 0 0 15px #49FF18, 0 0 20px #49FF18, 0 0 25px #49FF18, 0 0 30px #49ff18;
   white-space: normal;
   cursor: pointer;
   color: white;
   -webkit-user-select: none;  /* not selectable text - Chrome all / Safari all */
   -moz-user-select: none;     /* Firefox all */
   -ms-user-select: none;      /* IE 10+ */
   user-select: none;          /* Likely future */      

}

button.inpbuttonOff
{
	background-color:rgb(53, 81, 134);
   font-size: 15px;
   font-weight: 750 ;
   height:60px;
   width: 60px;
   margin: 3px 6px 3px 0px;
   white-space: normal;
   cursor: pointer;
   color: white;
      -webkit-user-select: none;  /* not selectable text - Chrome all / Safari all */
      -moz-user-select: none;     /* Firefox all */
      -ms-user-select: none;      /* IE 10+ */
      user-select: none;          /* Likely future */      
  
}

input.SaveConfOn
{
	background-color:rgb(0, 194, 74);
   font-size: 15px;
   font-weight: 750 ;
   height:60px;
   width: 60px;
   margin: 3px 6px 3px 0px;
   border-radius: 15%c;
   border: 2px inset black;
      /* box-shadow: 0 0 5px #FFF, 0 0 10px #FFF, 0 0 15px #FFF, 0 0 20px #49ff18, 0 0 30px #49FF18, 0 0 40px #49FF18, 0 0 55px #49FF18, 0 0 75px #49ff18; */
   box-shadow: 0 0 3px #FFF, 0 0 6px #FFF, 0 0 7px #FFF, 0 0 10px #49ff18, 0 0 15px #49FF18, 0 0 20px #49FF18, 0 0 25px #49FF18, 0 0 30px #49ff18;
   white-space: normal;
   cursor: pointer;
   color: white;
   -webkit-user-select: none;  /* not selectable text - Chrome all / Safari all */
   -moz-user-select: none;     /* Firefox all */
   -ms-user-select: none;      /* IE 10+ */
   user-select: none;          /* Likely future */      

}

input.SaveConfOff
{
	background-color:rgb(189, 0, 0);
   font-size: 15px;
   font-weight: 750 ;
   height:30px;
   width: 160px;
   margin: 3px 6px 3px 0px;
   white-space: normal;
   cursor: pointer;
   color: rgb(255, 255, 255);
      -webkit-user-select: none;  /* not selectable text - Chrome all / Safari all */
      -moz-user-select: none;     /* Firefox all */
      -ms-user-select: none;      /* IE 10+ */
      user-select: none;          /* Likely future */      
  
}


div.presetzsave  {
   z-index: 10; 
   position: relative; 
   padding:4px;
   top: 0px;
   border: 1px solid blue;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none; 
      user-select: none;
}

div.inputbuttons  {
   z-index: 10; 
   position: relative; 
   top: 10px;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none; 
      user-select: none;
}

img.sed1{
	cursor:pointer;
	margin:-1px;
   margin-top:1px;
   padding-left: 10px;
   padding-right: 5px;
}
img.presets1{
	cursor:pointer;
	margin:-1px;
	margin-top:1px;
	border: 2px solid gray ;
	width: 90px; 
	height: 55px;
}
img.presetsIframe{
	cursor:pointer;
	margin:-1px;
	margin-top:1px;
	border: 2px solid gray ;
	width: 100px; 
	height: 63px;
}

h3.camerasdescr {
    display: inline;
    color: darkgreen;
    font-size: 20px;
    font-weight: bold;
    top: 5px;
    margin-top: 5px;

}
div.camerasdescr {
    margin-top: 5px;

}

input.sed2{
	background-color:#707070;
	color:white;
   height:70px;
   margin-left: 0px;
}

div.counterstyle{
   position: relative;
   float: inline-start;
      color:red;
      font-weight: bold;
      font-size: 40px;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none; 
      user-select: none;
   }
   
   div.counterstyleREC{
         font-family: 'Digital-7';
         margin-left:-15px;
         width:170px;
         position: relative;
         float:right ;
         color:red;
         font-weight: 550;
         font-size: 40px;
         -webkit-user-select: none;
         -moz-user-select: none;
         -ms-user-select: none; 
         user-select: none;
       }

   .reccountercontainer {
         display:flex;
         width: 1000px;
         max-width: 1070px;
         padding: 5px;
         margin-top:-10px;
         -webkit-user-select: none;
         -moz-user-select: none;
         -ms-user-select: none; 
         user-select: none;
          }
   .recsidebar {
         width:270px;
         }
   .recrightbar {
         width:100%;
         position: relative;
         float: right;
         }
div.presetscontainer {
         display:flex;
         /* width: 400px; */
         /* margin-top: -5px; */
         /* max-width: 430px; */
         color: black;
         padding: 3px;
         -webkit-user-select: none;
         -moz-user-select: none;
         -ms-user-select: none; 
         user-select: none;
          }
div.presetsidebar {
         width:110px;
         }
div.presetrightbar {
         width:100%;
         position: relative;
         float: right;
         }
div.presetscontainer2 {
         display:flex;
         /* width: 400px;
         max-width: 430px; */
         color: black;
         padding: 3px;
         -webkit-user-select: none;
         -moz-user-select: none;
         -ms-user-select: none; 
         user-select: none;
        }

div.inputscontainer {
         /* display:flex; */
         width: 59vw;
         max-width: 59vw;
         margin-left: -25px;
         padding: 5px;
         -webkit-user-select: none;
         -moz-user-select: none;
         -ms-user-select: none; 
         user-select: none;
          }
   .inputssidebar {
         width:100px;
         }
   .inputsrightbar {
         width:54vw;
         position: relative;
         float: right;
         }

         
   .countercontainer {
         display:flex;
         width: 400px;
         max-width: 450px;
         -webkit-user-select: none;
         -moz-user-select: none;
         -ms-user-select: none; 
         user-select: none;
               }
         .sidebar {
         width:270px;
         }
         .rightbar {
         width:100%;
         position: relative;
         float: left;
         }
         
   #id_counter {
           font-family: 'Digital-7';
           color:blue;        
           /* min-width: 300px;
           margin-right: 40%;
           margin-left: 40%; */
           font-size: 50px;
           font-weight: 800;
           margin-left: 30px;
           margin-top: -15px;
           margin-bottom: -15px;
    /*       background-color: whitesmoke;  */
   }
   
   #id_counter2 {
      font-family: 'Digital-7';
      color:darkgreen;  
      /* min-width: 300px;
      margin-right: 40%;
      margin-left: 40%; */
      font-size: 50px;
      font-weight: 800;
      margin-left: 10px;
      margin-top: -15px;
      margin-bottom: -15px;
   /*       background-color: whitesmoke;  */
   }
   
   #id_counter1 {
              margin-top: 10px;
   }

h2{
text-align:center;
}

.mousePointer{
cursor:pointer;
}


.tytulh1{
color:darkblue;
font-weight: bold;
margin-top: 4px;
}

.whitefont{
	color:white;
	font-weight: 500;
	font-size: small !important;
}

.textcenter{
   text-align:center;
}

.campresstyle{
	color:darkblue;
	font-weight: bold;
	font-size: small;
}
.descrstyle{
	color:darkblue;
	font-weight: bold;
   font-size: medium;
   margin-top: -1px;
}
.descrstylewhite{
	color:yellow;
	font-weight: bold;
   font-size: medium;
   margin-top: -1px;
}
.titlestyle{
	color:red;
	font-weight: bold;
   font-size: large;
   margin-top: 0px;
}

.phototitle{
	color:red;
	font-weight: bold;
   font-size: medium;
   margin-top: 5px;
   margin-bottom: 5px;
}

div.counterstyle{
position: relative;
float: inline-start;
   color:#f30;
	/* font-weight: 700; */
	/* font-size: 40px; */
}

div.counterstyle2{
     position: relative;
     color:yellow;
      /* font-weight: 700; */
      /* font-size: 40px; */
   }
   
.countercontainer {
      display:flex;
      width: 400px;
      max-width: 450px;
            }
      .sidebar {
      width:270px;
      }
      .rightbar {
      width:100%;
      position: relative;
      float: left;
      }
      
.countersFlex {
      display:flex;
      width: 150px;
      max-width: 150px;
      margin-top:-10px;
      /* border: 1px solid green; */
 }
  .FlexLeftBar {
      width:90px;
      padding-left: 28px;
  }
 .FlexRightBar {
      width:100%;
      position: relative;
      float: left;
      padding-right: 20px;
}


#id_counter {
        font-family: 'Digital-7';
         color:yellow;  /* kolor licznika prawego        */
        /* min-width: 300px;
        margin-right: 40%;
        margin-left: 40%; */
        font-size: 45px;
        font-weight: 400;  /* grubość fontu licznika prawego */
        margin-left: 30px;
        margin-top: -15px;
        margin-bottom: -15px;
 /*       background-color: whitesmoke;  */
}

#id_counterGraph {
   font-family: 'Digital-7';
    color:yellow;  /* kolor licznika prawego        */
   /* min-width: 300px;
   margin-right: 40%;
   margin-left: 40%; */
   font-size: 38px;
   font-weight: 400;  /* grubość fontu licznika prawego */
   margin-left: 0px;
   margin-top: -8px;
   margin-bottom: 0px;
/*       background-color: whitesmoke;  */
}
#id_counter2 {
   font-family: 'Digital-7';
   color:greenyellow;   /* kolor licznika lewego        */
   display: inline;
   /* min-width: 300px;
   margin-right: 40%;
   margin-left: 40%; */
   font-size: 45px;
   font-weight: 400;
   margin-left: 10px;
   margin-top: -15px;
   margin-bottom: -15px;
/*       background-color: whitesmoke;  */
}

#id_counterGraph2 {
   font-family: 'Digital-7';
   color:greenyellow;   /* kolor licznika lewego        */
   /* min-width: 300px;
   margin-right: 40%;
   margin-left: 40%; */
   text-align: left;
   font-size: 50px;
   font-weight: 450;
   margin-left: 0px;
   margin-top: -8px;
   margin-bottom: 0px;
/*       background-color: whitesmoke;  */
}

#id_counterMaxGraph2 {
   font-family: 'Digital-7';
   color:red;   /* kolor licznika lewego        */
   /* min-width: 300px;
   margin-right: 40%;
   margin-left: 40%; */
   text-align: right;
   font-size: 50px;
   font-weight: 450;
   margin-left: 0px;
   margin-top: -8px;
   margin-bottom: 0px;
/*       background-color: whitesmoke;  */
}

#id_counter1 {
           margin-top: 10px;
}

div#hidden{
	display:hidden;
}

.flex {
  display: flex;
  /* justify-content: space-between; */
}

.formrelat {
   position: relative;
   /* display:inline; */
   float:left;
   margin-left: -5px;
   
   /* justify-content: space-between; */
 }

.group
{
	font-weight:bold;
   display:block;
   padding: 5px 5px 5px 5px;
   line-height: 10px;
   /* margin: 5px 5px 5px 5px; */
	/* width:100%; */
	color:rgb(238, 255, 0);
	font-family: Verdana, Geneva, Tahoma, sans-serif;
	font-size:16px;
   font-weight: 500;
  
	/* text-align: center; */
}

.label
{
	display:inline-block;
	width:128px;
	color:white;
	font-family: Verdana, Geneva, Tahoma, sans-serif;
	font-size:16px;
	font-weight: 500;
	text-align: center;
}

#CamPresetSetting {
   font-family: 'Digital-7';
   font-size: 70px !important; 
   color: rgb(0, 255, 34); 
   font-weight:500;
   position: relative; 
   float: right; 
   display:inline;
}

#SaveSettingInfo {

   margin-top:-10px;
}

.TransDurat, .MixTransition, .OverlayNrClass, .backlight, .WhiteBalance, .AExposition, .TiltSpeed, .PTSpeed,  .PanSpeed, .ZoomSpeed, .StandByClass, .OnScreenDispClass, .CamOnClass, .FocusClass  {
	font-size: 16px;
   line-height: 18px;
   width:210px;
   cursor: pointer;
   padding:5px 6px 5px 6px;
   margin-top: 5px;
   margin-left: 15px;
   font-weight: 600;
}
.TiltSpeed, .PTSpeed,  .PanSpeed, .ZoomSpeed {
   color: blue;
	background-color: yellow;
}
.FocusClass {
	color: black;
   background-color:white;
   margin-left: 20px !important;
}
.StandByClass, .OnScreenDispClass, .CamOnClass {
	color: rgb(255, 255, 255);
	background-color: rgb(149, 9, 63);
}
.TransDurat, .MixTransition, .OverlayNrClass {
	color: rgb(255, 255, 255);
	background-color: rgb(1, 70, 134);
}
.backlight {
   color: rgb(0, 3, 165);
	background-color: rgb(137, 245, 255);
}
.OverlayNrClass {
	background-color: rgb(97, 0, 253);
}
.WhiteBalance, .AExposition {
   color: black;
	background-color: yellowgreen;
}
.OnScreenDispClass {
   margin-left: 20px;
}

.TiltSpeed:hover, .PTSpeed:hover,  .PanSpeed:hover, .ZoomSpeed:hover, .StandByClass:hover, .OnScreenDispClass:hover, .VmixIpInpClass:hover, .CamIpClass:hover, .CamOnClass:hover {
   box-shadow: 0 0 3px #FFF, 0 0 6px #FFF, 0 0 7px #FFF, 0 0 10px #f6ff7e, 0 0 15px #f6ff7e, 0 0 20px #f6ff7e, 0 0 25px #f6ff7e, 0 0 30px #f6ff7e;
   font-size: 16px;
}

.WhiteBalance:hover, .AExposition:hover {
   box-shadow: 0 0 3px #FFF, 0 0 6px #FFF, 0 0 7px #FFF, 0 0 10px #9bff8e, 0 0 15px #9bff8e, 0 0 20px #9bff8e, 0 0 25px #9bff8e, 0 0 30px #9bff8e;
   font-size: 16px;
}

.TransDurat:hover, .MixTransition:hover, .OverlayNrClass:hover, .backlight:hover, .CamModelClass:hover, .Cam3ModelClass:hover, .FocusClass:hover {
   box-shadow: 0 0 3px #FFF, 0 0 6px #FFF, 0 0 7px #FFF, 0 0 10px #18f7ff, 0 0 15px #18f7ff, 0 0 20px #18f7ff, 0 0 25px #18f7ff, 0 0 30px #18f7ff;
   font-size: 16px;
}

.LicOwnerDataInpClass {
   position:relative;
   float:right;
   color:rgb(0, 2, 144);
   background-color: rgb(255, 255, 255);
   font-size:15px;
   font-weight: 550;
   width: 250px;
   padding-left:5px;   
   margin-left: 10px;
   margin-right: 10px;   
   opacity: 1; /* Firefox */
   border: 2px solid rgb(16, 0, 160);
}

.VmixIpInpClass {
   position:relative;
   float:left;
   color:black;
   background-color: rgb(131, 255, 255);
   font-size:17px;
   font-weight: 550;
   width: 180px;
   padding-left:5px;
   margin-left: 100px;
   display:inline;
   opacity: 1; /* Firefox */
   border: 2px solid rgb(16, 0, 160);
}

.VmixPortInpClass {
   position:relative;
   float:right;
   color:black;
   background-color: rgb(131, 255, 255);
   font-size:17px;
   font-weight: 550;
   width: 60px;
   padding-left:5px;
   margin-right: 10px;
   display:inline;   
   opacity: 1; /* Firefox */
   border: 2px solid rgb(16, 0, 160);
}

.CamModelClass, .Cam3ModelClass {
   font-size: 16px;
	color: rgb(255, 255, 255);
   line-height: 16px;
   cursor: pointer;   
   width:150px;
   padding:6px 3px 6px 3px;
   margin-top: 4px;
   margin-left: -20px;
	background-color: rgb(1, 70, 134);
	font-weight: 600;
}

.Cam3ModelClass {
   margin-left: -10px;
}


.CamIpClass {
position:relative;
float:right;
color:black;
background-color: yellow;
font-size:16px;
font-weight: 550;
width: 115px;
margin: 3px 10px 0px 10px;
/* margin-left: 10px;
margin-right: 10px; */
opacity: 1; /* Firefox */
border: 3px solid rgb(16, 0, 160);
}

.CamLoginClass, .CamPassClass {
   position:relative;
   float:right;
   color:black;
   display: inline;
   background-color: rgb(183, 255, 195);
   padding: 1px 3px 1px 3px;
   font-size:16px;
   font-weight: 500;
   width: 70px;
   margin: 3px 4px 0px 4px;
   opacity: 1; /* Firefox */
   border: 3px solid rgb(16, 0, 160);
   }
   

.FormParametersClass {
   font-size: 16px;
   font-weight:500px;
   margin-top:8px;
   /* padding: 5px 8px 5px 8px; */
   position: relative;
   /* display:inline;  */
   float:left;
   color: white !important;
   /* width:400px; 
   height: 200px; 
   margin-top: -8px; 
   left: -3px; 
   background-color: #337ab7; */
}


input.SaveParamOn
{
	background-color:rgb(0, 194, 74);
   font-size: 20px;
   font-weight: 750 ;
   height:60px;
   width: 60px;
   margin: 3px 6px 3px 200px;
   /* border-radius: 15%c; */
   border-radius: 35%;
   border: 2px inset black;
      /* box-shadow: 0 0 5px #FFF, 0 0 10px #FFF, 0 0 15px #FFF, 0 0 20px #49ff18, 0 0 30px #49FF18, 0 0 40px #49FF18, 0 0 55px #49FF18, 0 0 75px #49ff18; */
   box-shadow: 0 0 3px #FFF, 0 0 6px #FFF, 0 0 7px #FFF, 0 0 10px #49ff18, 0 0 15px #49FF18, 0 0 20px #49FF18, 0 0 25px #49FF18, 0 0 30px #49ff18;
   white-space: normal;
   cursor: pointer;
   color: white;
   -webkit-user-select: none;  /* not selectable text - Chrome all / Safari all */
   -moz-user-select: none;     /* Firefox all */
   -ms-user-select: none;      /* IE 10+ */
   user-select: none;          /* Likely future */      

}

input.SaveParamOff
{
	background-color:rgb(189, 0, 0);
   font-size: 20px;
   font-weight: 750 ;
   height:34px;
   width: 100px;
   margin: 3px 6px 3px 200px;
   white-space: normal;
   cursor: pointer;
   color: rgb(255, 255, 255);
      -webkit-user-select: none;  /* not selectable text - Chrome all / Safari all */
      -moz-user-select: none;     /* Firefox all */
      -ms-user-select: none;      /* IE 10+ */
      user-select: none;          /* Likely future */      
  
}



