/* header {
	top:0;
    left:0;
    right:0;
  width: 100%;
  background-color: blue;
  height: 100px;
  

} */


/* The n.fixed-nav-bar {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: auto;
  z-index: 9999;
  width: 100%;
  height: 50px;
  background-color: #00a087;
} */

/* header {
	 position: fixed;
  width: 100vw;
  background-color: black;
  height: 100px;
} */



/* 
#footer {
   position:static;
   bottom:0;
   width:100%;
   height:60px;   
   background:#6cf;
}
 */
 
 
 /* this is takes away the margin around the page (User agent stylesheet (Chrome)) it was set at 8 by them CB */
 
 body { margin: 0; padding: 0; }
 
 
 /*this will change the atributes for the ENTIER PAGE , IGNORING EVERYTHING ELSE*/
 
  
 html *
{
  /* font-size: 1em !important;*/
 /*  color: #000 !important;*/
    font-family: Arial, Helvetica, sans-serif; !important;
}
 
 /* this is to make the to black bar links white with no default underline ....but a hover underline CB */
div.CBLinks a:link {
	
	/*no link underline8*/ 
   /*  text-decoration: none; */

    color: white;
	
}
	div.CBLinks a:visited {
  color: #FFFFFF /*keeps the links white even after they are visited*/
}
	
    div.CBLinks a:hover {
  text-decoration: underline; /*a hover underline CB */
}


 /* this is to make the to orange bar on show pages links black with no default underline ....but a hover underline CB */
div.CBLinksShoPgs a:link {
	
	/*no link underline8*/ 
   /*  text-decoration: none; */

    color: black;
	font-weight:525;
}
	div.CBLinksShoPgs a:visited {
  color: #000000 /*keeps the links white even after they are visited*/
}
	
    div.CBLinksShoPgs a:hover {
  text-decoration: underline; /*a hover underline CB */
}






/* this is for the yello bar at the top */

.col-scroll-fixed {
    width: 100%;
    height: 71px;
    background-color: #ffa500;
	position: fixed;
    top:0;
    right: 0px;
    bottom: 0;
    z-index: 9999;
	
}
/* this is for the black bar at the top */
.col-scroll-fixed2 {
    width: 100%;
    height: 14px;
    background-color: black;
    position: fixed;
    top:71;
    right: 0px;
    bottom: 0;
    z-index: 9999;
}

/* this is for the black bar at the botton */
.bottombar {
    
	min-width:1120px;/*    this helps with the bar width so that it goes all the way the the edge    */
    height: 350px;
    background-color: black;
	position: static;
    top:0;
    right: 0;
	/* left: 0; */
    bottom: 0;
    z-index: 9999;
 /* overflow: auto; */
}


/* this is for the yellow thin bar at the botton */
.bottombar2 {
    
	min-width:1120px;   /*    this helps with the bar width so that it goes all the way the the edge    */
    height: 3px;
    background-color: #ffa500;
	position: static;
    top:0;
    right: 0;
	/* left: 0; */
    bottom: 0;
    z-index: 9999;
 /* overflow: auto; */
}






/* this is for a rounded search box */
.round {
    width: 85%;
    border-radius: 6px;/* makes edges less or more rounded*/
    border: 1px #000 solid;
    padding: 5px 5px 5px 25px;
    position: static;
    top: 0;
    left: 0;
    z-index: 5;
}

/* this is for a rounded show markee. top 5 ..10 etc. where the show names are.. */
.round2 {
    width: 1%;
    border-radius: 6px;/* makes edges less or more rounded*/
    border: 1px #000 solid;
    padding: 5px 5px 5px 5px;/* same padding all around (the order is :top, right, bottom, left*/
    position: static;
    top: 0;
    left: 0;
    z-index: 5;

}

/* this is for the yellow bar at the top of the SHOW PAGES */

.col-scroll-fixed3 {
	min-width:1120px;/*    this helps with the bar width so that it goes all the way the the edge    */
    width: 100%;
    height: 71px;
    background-color: #ffa500;
	position: static;
    top:0;
    right: 0px;
    bottom: 0;
    z-index: 9999;
}
 
 /* this is for the Black bar at the top of the SHOW PAGES */
 
.col-scroll-fixed4 {
	min-width:1120px;/*    this helps with the bar width so that it goes all the way the the edge    */
    width: 100%;
    height: 4px;
    background-color: Black;
    position: static;
    top:0;
    right: 0px;
    bottom: 0;
    z-index: 9999;
}
 
 
 
  /* this is for the select box dropdown -- Add this show */
  
.roundAddThisShow {
    width: 375px; /* can do it by % too*/
    border-radius: 6px;/* makes edges less or more rounded*/
    border: 1px #000 solid;
    padding: 5px 5px 5px 25px;
    position: static;
    top: 0;
    left: 0;
    z-index: 5;
}

 /* this is for the select Vote Button -- Add this show */

 .SelectVoteButton{
 
    margin-left: 20px; /* puts space between the dropdown and the button*/
	 margin-right: 30px; /* puts space between the button Question mark button*/
    background:#ffa500;  /* button color */
    color:#FFFFFF ;  /* text coloring*/
    border: 1px solid #223445;
    border-radius: 18px;
    -moz-border-radius: 5px ;
    display:inline-block;
    width: 10em;
    height: 2em;
    -webkit-font-smoothing: antialiased;
	-webkit-border-radius: 5px;

}


 /* this is for the sugggest a show button -- Add this show */
 #suggestButton{
 
    margin-left: 20px;
    background:#000000;  /* button color */
    color:#FFFFFF ;  /* text coloring*/
    border: 1px solid #223445;
    border-radius: 18px;
    -moz-border-radius: 5px ;
    display:inline-block;
    width: 10em;
    height: 4em;
    -webkit-font-smoothing: antialiased;
	-webkit-border-radius: 5px;


}










 
/*  .font-for-choose-show{
	 
	
	
  font-family: Arial, Helvetica, sans-serif;

	 
	 
 } */
 
 
 
  /* for rounded submit/search button  uses the "id" atribute*/
 
 #CBbutton{
    background:#ffa500;  /* button color */
    color:#FFFFFF ;  /* text coloring*/
    border: 1px solid #223445;
    border-radius: 18px;
    -moz-border-radius: 5px ;
    display:inline-block;
    width: 10em;
    height: 2em;
    -webkit-font-smoothing: antialiased;
	-webkit-border-radius: 5px;
}
 
 
  /* for rounded reset button  uses the "id" atribute*/
 
 #CBbutton2{
    background:#000000;  /* button color */
    color:#FFFFFF ;  /* text coloring*/
    border: 1px solid #223445;
    border-radius: 18px;
    -moz-border-radius: 5px ;
    display:inline-block;
    width: 5em;
    height: 2em;
    -webkit-font-smoothing: antialiased;
	-webkit-border-radius: 5px;
}
 
   /* for rounded submit/Search button on HOME Page uses the "id" atribute*/
 #CBbutton3{
    background:#ffa500;  /* button color */
    color:#FFFFFF ;  /* text coloring*/
    border: 1px solid #223445;
    border-radius: 18px;
    -moz-border-radius: 5px ;
    display:inline-block;
    width: 5em;
    height: 2em;
    -webkit-font-smoothing: antialiased;
	-webkit-border-radius: 5px;
}
 
 /*Radio Button stuff on show pages#############################################*/
 
 /* The container */
.container {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 18px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default radio button */
.container input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

/* Create a custom radio button */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #eee;
  border-radius: 50%;
}

/* On mouse-over, add a grey background color */
.container:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the radio button is checked, add a blue background */
.container input:checked ~ .checkmark {
  background-color: #2196F3;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the indicator (dot/circle) when checked */
.container input:checked ~ .checkmark:after {
  display: block;
}

/* Style the indicator (dot/circle) */
.container .checkmark:after {
 	top: 9px;
	left: 9px;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: white;
}
 
 
  /*Check Box stuff on NetworkGraph Page page#########################################*/
 
/* The container */
.container2{
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 19px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default checkbox */
.container2 input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */
.checkmark2 {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #eee;
}

/* On mouse-over, add a grey background color */
.container2:hover input ~ .checkmark2 {
  background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
.container2 input:checked ~ .checkmark2 {
  background-color: #2196F3;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark2:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.container2 input:checked ~ .checkmark2:after {
  display: block;
}

/* Style the checkmark/indicator */
.container2 .checkmark2:after {
  left: 9px;
  top: 5px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

/* this selects an image that has a width of 182(here the show picture) and puts a boader around it */
img[width="182"]{
 
border-style: solid;
border-width: thin;
border-color: #000000;
}