/* ==========================================================================
   HTML5 Boilerplate styles - h5bp.com (generated via initializr.com)
   ========================================================================== */

html,
input,
select,
textarea {
    color: #222;
}

html, body
{
  height: 100%;
  
}

body
{
  font-size: 1em;
  line-height: 1.4;
}




::-moz-selection {
   /* background: #b3d4fc;*/
    text-shadow: none;
}

::selection {
    /* background: #b3d4fc;*/
    text-shadow: none;
}

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #fcbf18;
    margin: 1em 0;
    padding: 0;
}

img {
    vertical-align: middle;
}

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

textarea {
    resize: vertical;
}

.side-menu {
  position: fixed;
  right: -300px;
  
  /* margin-top: -2.5em; */
  border-radius: 18px 0px 0px 18px;
	width: 350px;
	color: white;
	padding: 14px 15px;
	
	transition-duration: 2s;
	font-family: 'Lato', sans-serif;
	font-size: 24px;
	font-weight: 300;
	line-height: 36px;
	margin: -20px 0 36px 0px;
	z-index: 50;	
}





#side-menu-eco{
	top: 34%;
	background-color: #2295f0;	
}

#side-menu-eco:hover {
	right: 0px;
	transition-duration: 2s;
	top: 34%;
	background-color: #2295f0;	
}

#side-menu-phish{
	top: 42%;
	background-color: #48ae51;	
}

#side-menu-phish:hover {
	right: 0px;
	transition-duration: 2s;
	top: 42%;
	background-color: #48ae51;	
}

#side-menu-cost-analysis{
	top: 50%;
	background-color: #fcbf18;	
}

#side-menu-cost-analysis:hover {
	right: 0px;
	transition-duration: 2s;
	top: 50%;
	background-color: #fcbf18;	
}
#side-menu-contact {
	top: 58%;
	background-color: #9d29ae;	
}
#side-menu-contact:hover {
	right: 0px;
	transition-duration: 2s;
	top: 58%;
	background-color: #9d29ae;	
}
#side-menu-disaster {
	top: 66%;
	background-color: #e60000;	
}
#side-menu-disaster:hover {
	right: 0px;
	transition-duration: 2s;
	top: 66%;
	background-color: #e60000;	
}



#second-contact{
	text-align: left;
}

#contact-modal div{
	border-radius: 18px 18px 18px 18px;
}

.modal-heading{
	  border-radius: 18px 18px 0px 0px;
	  width: 100%;
	  color: white;
	  padding: 14px 20px;
	  background-color: #9d29ae;
	  font-family: 'Lato', sans-serif; 
      font-size: 34px; 
	  font-weight: 300; 
	  line-height: 36px; 
	  margin: -26px 0 36px 0px; 
	  text-align: center;

}
/* ===== Initializr Styles ==================================================
   Author: Jonathan Verrecchia - verekia.com/initializr/responsive-template
   ========================================================================== */

body {
    font: 16px/26px Helvetica, Helvetica Neue, Arial;
}


#ca_sample_data tr, #ca_sample_data td{
	width:100%;
	border:1px solid #ccc;
}
#ca_sample_data td{
	background-color: #fff;
	width: 11.11%;
}

.wrapper {
    width: 90%;
    margin: 0 5%;
}

.header-container {
    border-bottom: 20px solid #fcbf18;
}

.footer-container{
    border-top: 20px solid #fcbf18;
}

.header-container,
.footer-container,
.main aside {
    background: #fff;
}

.title {
    color: #000;
}

.headerlogo
{
  margin-top: 10px;
}

.undertable{
	text-align: right;
	margin-top: -20px;
	color: #008000;
	width: 100%;
	font-size:xx-small;
} 
/* ==============
    MOBILE: adjustment
   ============== */
   
	#navadalogo{
      max-width: 100%;
	}
	
	ul {
	padding: 0;
	margin: 0;
	}
	

/* ==============
    MOBILE: Menu
   ============== */

nav ul {
    margin-right: 1px;
    padding: 11px 10px 11px 10px;
}

nav a {
    display: block;
    border-radius: 10px 10px 10px 10px;
    text-align: center;
    text-decoration: none;
    font-weight: bold;
	margin-right: 1px;
	padding-bottom: 3px;
    color:#666;
    background: #fcbf18;
/* 	-webkit-box-shadow: 0 1px 3px #a7e5f9;
    -moz-box-shadow: 0 1px 3px #a7e5f9;
    box-shadow: 0 1px 3px #a7e5f9; */
}

nav a:hover,
nav a:visited {
    color:#666;
}

nav a:hover {
    display: block;

    color:#000;
    background: #eee;
}

/* ==============
    MOBILE: Main
   ============== */

#container
{
  min-height:100%;
}

#absolute-content
{
  overflow: auto;
  padding-bottom:50px;
}

.main 
{
  padding: 30px 0;
}

/* .main article h1 {
   color: #1E90FF; 
   font-family: 'Lato', sans-serif; 
   font-size: 42px; 
   font-weight: 300; 
   line-height: 44px; 
   margin: 0 0 14px; 
}
 */


.main aside {
    color: #999;
    /* padding: 0px 5% 10px;*/
	border-radius: 18px 18px 0px 0px;
}
.main aside p{
   margin:15px;
   padding-bottom:15px;
   
}

.main aside a:link
{
 color: #000;
}

.main aside a:visited
{
 color: #000;
}

section p{
	
	background-color: #fcfdfc;
	padding: 10px;
	border-radius: 7px 7px 7px 7px;
	
	
}
header p{
	
	background-color: #fcfdfc;
	padding: 10px;
	border-radius: 7px 7px 7px 7px;
	
	
}

.footer-container footer
{
  color: #999;
  padding: 10px 0;
}

#absolute-footer
{
  position: relative;
  margin-top: -50px; /* negative value of footer height */
  height: 50px;
  clear:both;
}


/* ==========================================================================
   Author's custom styles
   ========================================================================== */

.data-one,
.data-two,
.data-three,
.data-four,
.data-five,
.data-six,
.data-seven{
  float: left;
  display: inline;
  margin-left:0px;
}

.circliful {
    position: relative; 
}

.circle-text, .circle-info, .circle-text-half, .circle-info-half {
    width: 100%;
    position: absolute;
    text-align: center;
    display: inline-block;
}

.circle-info {
	color: #999;
}

.circliful .fa {
	margin: -10px 3px 0 3px;
	position: relative;
	bottom: 4px;
}

.stage {
        border-bottom: 3px solid #444;
        display: flex;
        height: 330px;
        width: 100%;
}
.box {
        align-self: flex-end;
        animation-duration: 2s;
        animation-iteration-count: infinite;
        background-color: #73bb02;
        height: 30px;
        
		text-align: center;
      
        transform-origin: bottom;
        width: 180px;
		-webkit-border-radius: 7px;
        -moz-border-radius: 7px;
        border-radius: 7px;
}
.bounce-new {
        animation-name: bounce-new;
        animation-timing-function: cubic-bezier(0.280, 0.840, 0.420, 1);
}
    @keyframes bounce-new {
        0%   { transform: scale(1,1)      translateY(0); }
        10%  { transform: scale(1.1,.9)   translateY(0); }
        30%  { transform: scale(.9,1.1)   translateY(-10px); }
        50%  { transform: scale(1.05,.95) translateY(0); }
        57%  { transform: scale(1,1)      translateY(-7px); }
        64%  { transform: scale(1,1)      translateY(0); }
        100% { transform: scale(1,1)      translateY(0); }
}

.mustard-button {
  background-color: white; 
  color: #cbda3c; 
  border: 2px solid #cbda3c;
}

.mustard-button:hover {
  background-color: #cbda3c;
  color: white;
}
/* in progress */
.status-button-mustard{
  background-color: #cbda3c;
   font-size: large;
  color: white;
}
.bold{
 font-size: 15px;
 font-weight: 700;
}

/* Completed */
.status-button-green {

  background-color: #73bb02;
   font-size: large;
  color: white;
}
/* other */
.status-button-blue {
  background-color: #04bad2;
   font-size: large;
  color: white;
}
/* clicked link || False - did not report*/
.status-button-red {
  background-color: #f32300;
   font-size: large;
  color: white;
}
.purple-button{
 background-color: white; 
  color: #9d29ae; 
  border: 2px solid #9d29ae;
}
.purple-button:hover{
background-color: #9d29ae;
  color: white;	
}
.icon-button
{
  height: 15px;
  width: 15px;
  border: 0;
  outline: 0;
  background-color: inherit;
  padding-right: 5px;
  padding-bottom: 1px;
  padding-left: 2px;

 
}
.icon-button:hover
{
  background-color: inherit;
}
.edit-button, .save-button, .delete-button
{
  float: right;
}
.services-table tbody
{
  width: 100%;
  
  font-family:arial;
	background-color: #CDCDCD;
	font-size: 7pt;
}

#donutcenter{
   
    top: -75px;
    left:120px;
    text-align: center;
    color: red;
	z-index: 10;
    
}
#campaigns li{
	list-style-type: none;
}
#templates ul li{
 list-style-type: none;
 }

.select-css {
	display: inline-block;
	font-size: 16px;
	font-family: sans-serif;
	font-weight: 700;
	color: #444;
	line-height: 1.3;
	padding: .4em 1.1em .4em .7em;
	width: 20%;
	box-sizing: border-box;
	margin: 0;
	border: 1px solid #aaa;
	box-shadow: 0 1px 0 1px rgba(0,0,0,.04);
	border-radius: .35em;
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
	/*background-color: #fff;*/
	background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23007CB2%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E'),
	  linear-gradient(to bottom, #ffffff 0%,#e5e5e5 100%);
	background-repeat: no-repeat, repeat;
	background-position: right .7em top 50%, 0 0;
	background-size: .65em auto,100%;
}
.select-css::-ms-expand {
	display: none;
}
.select-css:hover {
	border-color: #888;
}
.select-css:focus {
	border-color: #aaa;
	/*box-shadow: 0 0 1px 3px rgba(59, 153, 252, .7);
	box-shadow: 0 0 0 3px -moz-mac-focusring;*/
	color: #222;
	outline: none;
}
.select-css option {
	font-weight:normal;
}


/* ==========================================================================
   Login Modal
   ========================================================================== */
body {font-family: Arial, Helvetica, sans-serif;}

/* Full-width input fields */
input[type="text"], input[type=password] {
  width: 100%;
  padding: 12px 20px;
  margin: 8px 0;
  display: inline-block;
  border: 1px solid #ccc;
  box-sizing: border-box;
  line-height: 2.5em;
  height: 2.5em;
}

/* Set a style for all buttons */
/*main button 100% width*/
button {
  padding: 10px !important;
  margin: 3px 3px !important;
  /* border: none; */
  font-size: 14px;
  text-decoration: none;
  cursor: pointer;
  width: 100%;
  display: inline-block;
  -webkit-border-radius: 7px;
  -moz-border-radius: 7px;
  border-radius: 7px;  
  -webkit-transition-duration: 0.4s; /* Safari */
  transition-duration: 0.4s;
}


button:hover {
  opacity: 0.8;
} 

buttonsmall {
  padding: 10px !important;
  margin: 3px 3px !important;
  /* border: none; */
  font-size: 14px;
  text-decoration: none;
  text-align: center;
  cursor: pointer;
  width: 200px !important;
  display: inline-block;
  -webkit-border-radius: 7px;
  -moz-border-radius: 7px;
  border-radius: 7px;  
  -webkit-transition-duration: 0.4s; /* Safari */
  transition-duration: 0.4s;
}
buttonsmall:hover {
  opacity: 0.8;
} 
buttontiny {
  padding: 10px !important;
  margin: 3px 3px !important;
  /* border: none; */
  font-size: 12px;
  text-decoration: none;
  text-align: center;
  cursor: pointer;
  width: 120px;
  display: inline-block;
  -webkit-border-radius: 7px;
  -moz-border-radius: 7px;
  border-radius: 7px;  
  -webkit-transition-duration: 0.4s; /* Safari */
  transition-duration: 0.4s;
}
buttontiny:hover {
  opacity: 0.8;
} 
.campaignstart{
	 color: white;
}
.buttonlook {
  padding: 5px 8px;
  text-align: center;
  font-size: 16px;
  margin: 2px 2px; 
  min-width: 130px;
  -webkit-border-radius: 7px;
  -moz-border-radius: 7px;
  border-radius: 7px; 
  display: inline-block;

}
.blue-button {
  background-color: white; 
  color: #008CBA; 
  border: 2px solid #008CBA;
   text-decoration: none;
}
.blue-button:hover {
  background-color: #008CBA;
  color: white;
   text-decoration: none;
}

.red-button {
  background-color: white; 
  color: #f62600; 
  border: 2px solid #f62600;
   text-decoration: none;
}
.red-button:hover {
  background-color: #fc5c3d;
  color: white;
   text-decoration: none;
}

.green-button {
  background-color: white; 
  color: #4fd402;
  border: 2px solid #4fd402;
   text-decoration: none;
}
.green-button:hover {
	/* old green #73bb02 new green #4fd402 */
  background-color: #4fd402;
  color: white;
   text-decoration: none;
}

.quote {
  background-color: white; 
  color: #4fd402;
  border: 2px solid #4fd402;
   text-decoration: none;
}
.quote:hover {
	/* old green #73bb02 new green #4fd402 */
  background-color: #4fd402;
  color: white;
   text-decoration: none;
}

#phish {
  max-width: 100%;
  height: auto;
  display: block;
  margin-left: auto;
  margin-right: auto;
}
/* Extra styles for the cancel button */
.cancelbtn {
  width: auto;
  padding: 10px 18px;
  background-color: #f44336;
  border-radius: 10px 10px 10px 10px;
}

/* Center the image and position the close button */
.imgcontainer {
  text-align: center;
  margin: 24px 0 12px 0;
  position: relative;
}

img.avatar {
  width: 40%;
  border-radius: 50%;
}

.modal-container {
	background-color:#f1f1f1;
	font-size: large !important;
  padding: 16px;
  border-radius: 0px 0px 18px 18px;
  text-align:center;
}

span.psw {
  float: right;
  padding-top: 16px;
}

/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 9999; /* Sit on top */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: hidden; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
  padding-top: 30px;
  
}

/* Modal Content/Box */
.modal-content {
  background-color: #fefefe;
  margin: 5% auto 15% auto; /* 5% from the top, 15% from the bottom and centered */
 /* border: 1px solid #888;*/
  width: 90%; /* Could be more or less, depending on screen size */
  border-radius: 18px 18px 18px 18px;
}
.modal-content input{
	border-radius: 5px 5px 5px 5px;
	font-size: large;
}

/* The Close Button (x) */
.close {
  position: absolute;
  right: 25px;
  top: 10px;
  color: #000;
  font-size: 35px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: red;
  cursor: pointer;
}


#cost-analysis{
	width: 90%;
}
#cost-analysis input[type=number]{
	min-width: 120px;
	max-width: 120px;
}
/* Chrome, Safari, Edge, Opera */
/* to get rid of the updown arrow for number*/
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  padding: 6px 6px;
  display: inline-block;
  border: 1px solid #ccc;
  box-sizing: border-box;
  line-height: 2.5em;
  height: 2.5em;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
  padding: 6px 6px;
  display: inline-block;
  border: 1px solid #ccc;
  box-sizing: border-box;
  line-height: 2.5em;
  height: 2.5em;
}



/* ==========================================================================
   Admin Headings
   ========================================================================== */
.headingcapture{
	width: 560px;
}


#tabheading{
  font: normal normal normal 20px/1 Helvetica, arial, sans-serif;
  background:#04bad2;
  color:#fff;
  display:inline-block;
  line-height: 30px;
  margin:-10px 0px 10px 30px;
  padding: 7px 25px 5px 25px;
  border-radius: 7px 7px 0 0;
}
#tabheadingunder{ /* the line under tablheading */
  /*left:0px;*/
  display:block;
 /* position:absolute;*/
  width:100%;
  height:3px;
  position:relative;
  top:-10px;
  /*margin-top:-5px;*/
  content: " ";
  background: -webkit-gradient(radial, 100% 100%, 0, 50% 50%, 350, from(#04bad2), to(#fff));
  padding-bottom: 5px;
  margin-bottom: 15px;
  /*background: radial-gradient(circle at 100% 50%, #fff 25%, #04bad2 60%)*/
}



/* ==========================================================================
   Table sorter
   ========================================================================== */

/* Zebra-striped version of your tablesorter CSS */
table.tablesorter {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-family: 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
}

table.tablesorter thead th:first-child {
    border-top-left-radius: 8px;
}
        
table.tablesorter thead th:last-child {
    border-top-right-radius: 8px;
}

table.tablesorter thead tr th, 
table.tablesorter tfoot tr td {
    background-color: #4a89dc;
    color: white;
    border: none;
    font-size: 1.3em;
    padding: 12px 16px;
    font-weight: 500;
    text-align: left;
}

table.tablesorter thead tr .header {
    background-image: url('data:image/gif;base64,R0lGODlhFQAJAIAAACMtMP///yH5BAEAAAEALAAAAAAVAAkAAAIXjI+AywnaYnhUMoqt3gZXPmVg94yJVQAAOw==');
    background-repeat: no-repeat;
    background-position: center right;
    cursor: pointer;
}

table.tablesorter tbody td {
    color: #3D3D3D;
    padding: 6px 8px;
    background-color: #FFF;
    vertical-align: top;
    position: relative;
    font-size: 1.3em;
    border-bottom: 1px solid #e9ecef;
}

table.tablesorter tbody tr:last-child td {
    border-bottom: none;
}

table.tablesorter tbody td:focus-within {
    border-style: solid;
    border-color: green;
}

table.tablesorter tbody tr.odd td {
    background-color: #f8f9fa;
}

table.tablesorter tbody tr:hover td {
    background-color: #e6f0ff;
}

table.tablesorter thead tr .headerSortUp {
    background-image: url('data:image/gif;base64,R0lGODlhFQAEAIAAACMtMP///yH5BAEAAAEALAAAAAAVAAQAAAINjB+gC+jP2ptn0WskLQA7');
}

table.tablesorter thead tr .headerSortDown {
    background-image: url('data:image/gif;base64,R0lGODlhFQAEAIAAACMtMP///yH5BAEAAAEALAAAAAAVAAQAAAINjI8Bya2wnINUMopZAQA7');
}

table.tablesorter thead tr .headerSortDown, 
table.tablesorter thead tr .headerSortUp {
    background-color: #3a79c4; /* Slightly darker blue for active sort */
}

/* Optional: Add rounded corners to bottom of table */
table.tablesorter tbody tr:last-child td:first-child {
    border-bottom-left-radius: 8px;
}

table.tablesorter tbody tr:last-child td:last-child {
    border-bottom-right-radius: 8px;
}

#device-table
{
	font-family:arial;

	margin:10px 0pt 15px;
	font-size: 9pt;
	text-align: left;
    table-layout: fixed;
	width: 100%;
    margin-right:auto;
    margin-left:auto;
   
	
        
}
.invisible{
	display: none;
	visibility: hidden;
}
#task-table 
{
	font-family:arial;

	margin:10px 0pt 15px;
	font-size: 9pt;
	text-align: left;
    /* table-layout: fixed; */
	width: 100%;
    margin-right:auto;
    margin-left:auto;
      
}
#av-table 
{
	font-family:arial;
	
	margin:10px 0pt 15px;
	font-size: 9pt;
	text-align: left;
    /* table-layout: fixed; */
	width: 100%;
    margin-right:auto;
    margin-left:auto;
	
}
#tasktype{
	max-width:50px;
}
#taskdevicename{
	min-width:150px;
}	

#software-table 
{
	font-family:arial;
	
	margin:10px 0pt 15px;
	font-size: 9pt;
	text-align: left;
    table-layout: fixed;
	width: 100%;
    margin-right:auto;
    margin-left:auto;
   
	
        
}

@-webkit-keyframes fade-out {
from {transform: scale(1)} 
  to {transform: scale(0)}
}

@keyframes fade-out {
  from {transform: scale(1)} 
  to {transform: scale(0)}
}

.fade-out {
    -webkit-animation: fade-out 0.6s;
    -webkit-animation-fill-mode: forwards;
    -webkit-animation-iteration-count: 1;
    animation: fade-out 0.6s
}

/* Add Zoom Animation */
.animate {
  -webkit-animation: animatezoom 0.6s;
  animation: animatezoom 0.6s
}

@-webkit-keyframes animatezoom {
  from {-webkit-transform: scale(0)} 
  to {-webkit-transform: scale(1)}
}
  
@keyframes animatezoom {
  from {transform: scale(0)} 
  to {transform: scale(1)}
}



/* ==========================================================================
   Media Queries
   ========================================================================== */

@media only screen and (min-width: 480px) {

} 
@media only screen and (max-width: 769px) {
	/* ============
       MOBILE VIEW
       ============ 
   for mobile devices */

.select-css {
	width: 80%;
}	
/* .catalogue-table table thead tbody th td tr { 
		display: block; 
		margin: 0 auto;
	}  */
	
#side-menu-eco{
	top: 22%;
	background-color: #2295f0;	
}

#side-menu-eco:hover {
	right: 0px;
	transition-duration: 2s;
	top: 22%;
	background-color: #2295f0;	
}

#side-menu-phish{
	top: 39%;
	background-color: #48ae51;	
}

#side-menu-phish:hover {
	right: 0px;
	transition-duration: 2s;
	top: 39%;
	background-color: #48ae51;	
}

#side-menu-cost-analysis{
	top: 56%;
	background-color: #fcbf18;	
}

#side-menu-cost-analysis:hover {
	right: 0px;
	transition-duration: 2s;
	top: 56%;
	background-color: #fcbf18;	
}
#side-menu-contact {
	top: 73%;
	background-color: #9d29ae;	
}
#side-menu-contact:hover {
	right: 0px;
	transition-duration: 2s;
	top: 73%;
	background-color: #9d29ae;	
}
#side-menu-disaster {
	top: 90%;
	background-color: #e60000;	
}
#side-menu-disaster:hover {
	right: 0px;
	transition-duration: 2s;
	top: 90%;
	background-color: #e60000;	
}	
	
#display-table tbody tr td{
	display: block; 
	margin: 0 auto;
}
#catalogue-table tbody tr td{
	display: block; 
	margin: 0 auto;
}

#task-table	thead {
  display: none;
}	
#task-table	tbody tr td{
  display: block;
}
#tasktype{
	max-width: 100%;
}
#device-table tbody tr td{
	display: block; 
	margin: 0 auto;
}
#device-table tbody tr td img{
	 display: block; 
	  margin-left: auto;
      margin-right: 15px;
	  max-width: auto;
	  max-height: auto;
}
#software-table tbody tr td{
	display: block; 
	margin: 0 auto;
}
#software-table tbody tr td img{
	 display: block; 
	  margin-left: auto;
      margin-right: 15px;
	  max-width: auto;
	  max-height: auto;
}



.invisible{
	display: none !important;
	visibility: hidden !important;
}
.mobileview{
       display: none !important;
	   visibility: hidden !important;
}	

	

.modal-content {
	  background-color: #fefefe;
	  margin: 5% auto 15% auto; /* 5% from the top, 15% from the bottom and centered */
	  border: 1px solid #888;
	  width: 90%; /* Could be more or less, depending on screen size */
}
.button {
  padding: 5px 0px;
  margin: 2px 1px;
	}





ReportTable{
	
} 
ReportTableUpdates{
	
}



	/* gets rid of the lines in orgchart when viewing on small screen render */
.google-visualization-orgchart-connrow-small{
	display: none;
}
.google-visualization-orgchart-linenode{
	display: none;
} 
.google-visualization-orgchart-linebottom{
	display: none;
}
.google-visualization-orgchart-space-small{
	display: none;
}
.google-visualization-orgchart-table{

	
}
.google-visualization-orgchart-node{
	

} 
.google-visualization-orgchart-node-small{
	min-height: 100px;
	
	
}
/* ------------------------------------- */

   	
}


	
	

@media only screen and (min-width: 769px) {
/* generally full desktop screen */

	
/* Network map accross full screen */
#network_map{
  /* width: 80vw;
  position: relative;
  left: calc(10vw + -30%);
  overflow: auto; */
}
#org_network_map{
  position: relative;
  resize: both;
  width: 100%;
margin-left: 10px;
margin-right: 10px;
}
#floor_plan{
	
	  resize: both;
      overflow: auto;
	  height: auto;
	  width: auto;
}
	
.google-visualization-orgchart-table{
	overflow: auto;
	max-width: 400px;
}	
	
/* ====================
    WIDE: CSS3 Effects
   ==================== */

    .header-container{

	}
   

	
	
	
	

/* ============
    WIDE: Menu
   ============ 
   this allows the nav buttons on top to slide to the right when on PC and centre on mobile
   */

     .title {
        float: left;
    }

    nav {
        float: right;
        width: 38%;
    }
	
	#navadalogo{
      max-width: 62%;
	}	
	 

/* ============
    WIDE: Main
   ============ 

 article {       
       width: 57%;
 }


    .main aside {
        float: right;
        width: 33%;
		margin-top: 100px;
		
    } */
	
	
	


 	ul {
	padding: 0;
	margin: 0;
	}
	  #device-table{
	  width: 100%;
	  margin: 0;
      padding: 0;
      }
	  #software-table{
	  width: 100%;
	  margin: 0;
      padding: 0;
	  }
	
	
}

@media only screen and (min-width: 1140px) {

/* ===============
    Maximal Width
   =============== */

    .wrapper {
        width: 1200px; /* 1140px - 10% for margins */
        margin: 0 auto;
    }
		
	.modal-content {
	  background-color: #fefefe;
	  margin: 5% auto 15% auto; /* 5% from the top, 15% from the bottom and centered */
	  border: 1px solid #888;
	  width: 40%; /* Could be more or less, depending on screen size */
}


}

/* ==========================================================================
   Helper classes
   ========================================================================== */

.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    *text-indent: -9999px;
}

.ir:before {
    content: "";
    display: block;
    width: 0;
    height: 150%;
}

.hidden {
    display: none !important;
    visibility: hidden;
}

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

.invisible {
    visibility: hidden !important;
}

.clearfix:before,
.clearfix:after {
    content: " ";
    display: table;
}

.clearfix:after {
    clear: both;
}

.clearfix {
    *zoom: 1;
}
.ui-datepicker-calendar {
    display: none;
    }

/* ==========================================================================
   Print styles
   ========================================================================== */

@media print {
    * {
        background: transparent !important;
        color: #000 !important; /* Black prints faster: h5bp.com/s */
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links for images, or javascript/internal links
     */

    .ir a:after,
    a[href^="javascript:"]:after,
    a[href^="#"]:after {
        content: "";
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group; /* h5bp.com/t */
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    @page {
        margin: 0.5cm;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
}
