/* CSS Custom Style */
 

html, body {
  overflow-x: hidden; /* Prevent scroll on narrow devices */
}

body {
	background-color:#EBF0F5;


}

/*modified h1 and h2 sizes for SEO */





#homesecurityModal {
        background-image: url("../../media/static/images/home_security.jpg");
        background-repeat: no-repeat;
    	background-position: center center;    
    	-webkit-background-size: cover;
    	-moz-background-size: cover;
    	-o-background-size: cover;
    	background-size: cover;
}

.homesecurityprice {
	

		color: green;
}

#businesssecurityModal {
        background-image: url("../../media/static/images/business.jpg");
        background-repeat: no-repeat;
    	background-position: center center;    
    	-webkit-background-size: cover;
    	-moz-background-size: cover;
    	-o-background-size: cover;
    	background-size: cover;
}

#alarmcomModal {
        background-image: url("../../media/static/images/home_security.jpg");
        background-repeat: no-repeat;
    	background-position: center center;    
    	-webkit-background-size: cover;
    	-moz-background-size: cover;
    	-o-background-size: cover;
    	background-size: cover;
}

#businessalarmcomModal {
        background-image: url("../../media/static/images/business.jpg");
        background-repeat: no-repeat;
    	background-position: center center;    
    	-webkit-background-size: cover;
    	-moz-background-size: cover;
    	-o-background-size: cover;
    	background-size: cover;
}

#videofiedModal {
        background-image: url("../../media/static/images/home_security.jpg");
        background-repeat: no-repeat;
    	background-position: center center;    
    	-webkit-background-size: cover;
    	-moz-background-size: cover;
    	-o-background-size: cover;
    	background-size: cover;
}

#businessvideofiedModal {
        background-image: url("../../media/static/images/business.jpg");
        background-repeat: no-repeat;
    	background-position: center center;    
    	-webkit-background-size: cover;
    	-moz-background-size: cover;
    	-o-background-size: cover;
    	background-size: cover;
}

.modal-header {
        background-color: yellow;
}

.modal-header a {
  color: black;
}


.modal-footer {
        background-color: yellow;
}

.modalbusiness-header {
        background-color: red;
  	min-height: 16.42857143px;
  	padding: 15px;
  	border-bottom: 1px solid #e5e5e5;
	color: white;

}

.modalbusiness-header a {
  color: white;
}


.modalbusiness-footer {
        background-color: red;
  padding: 15px;
  text-align: right;
  border-top: 1px solid #e5e5e5;

}





.footer {
  padding: 30px 0 15px 15px;
  background-color: slategray;
 
}

.footer a {
  color: white;
}


.footerlogos {
  max-height: 60px;
  padding: 5px 5px 5px 5px;
}


/*set banner padding */

#banner {
  padding: 5px 20px 0px 5px;

}
#resbanner {
  padding: 5px 20px 0px 10px;

}


.smallbtn {
 height: 50px;
 width: 140px;
 line-height: 1.25;
 padding: 0px 0px 0px 0px;
}




/*set containerpadding value, call by js to add class for #main, ===
== creates space between nav and main container */

.containerpadding {
margin-top: 80px;

}

.navbar-toggle2 {
  position:relative;
  float: none;
  display: inline-block;
  padding: 9px 5px;
  margin-top: 8px;
  margin-right: 5px;
  margin-bottom: 8px;
  background-color: transparent;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 4px;
  list-style:none;
   
}
.navbar-toggle2:focus {
  outline: 0;
}
.navbar-toggle2 .icon-bar {
  display: block;
  width: 22px;
  height: 2px;
  border-radius: 1px;
}
.navbar-toggle2 .icon-bar + .icon-bar {
  margin-top: 4px;
}

ul.navbar-toggle2 {
	color:white;
}


@media (min-width: 768px) {
	.navbar-toggle2 {
            display:none;
 }
 

}

/* test code - look below @media */
.container-fluid {
  padding-left: 3px;
}

.navbar-inverse {
  background-color: #646464;
  border-color: #646464;
  
}
.navbar-inverse .navbar-brand {
 padding: 15px 5px 15px 18px;
  color: #000;
  font-weight:bold;
  
 
  
}
.navbar-inverse .navbar-brand:hover,
.navbar-inverse .navbar-brand:focus {
  color: #000;
  background-color: transparent;
}
.navbar-inverse .navbar-text {
  color: #fff;
}
.navbar-inverse .navbar-nav > li > a {
  color: #fff;
}
.navbar-inverse .navbar-nav > li > a:hover,
.navbar-inverse .navbar-nav > li > a:focus {
  color: #fff;
  background-color: #000;
}
.navbar-inverse .navbar-nav > .active > a,
.navbar-inverse .navbar-nav > .active > a:hover,
.navbar-inverse .navbar-nav > .active > a:focus {
  color: #fff;
  background-color: #080808;
}
.navbar-inverse .navbar-nav > .disabled > a,
.navbar-inverse .navbar-nav > .disabled > a:hover,
.navbar-inverse .navbar-nav > .disabled > a:focus {
  color: #444;
  background-color: transparent;
}
.navbar-inverse .navbar-toggle {
  border-color: #333;
}
.navbar-inverse .navbar-toggle:hover,
.navbar-inverse .navbar-toggle:focus {
  background-color: #333;
}
.navbar-inverse .navbar-toggle .icon-bar {
  background-color: #fff;
}
.navbar-inverse .navbar-collapse,
.navbar-inverse .navbar-form {
  border-color: #101010;
}
.navbar-inverse .navbar-nav > .open > a,
.navbar-inverse .navbar-nav > .open > a:hover,
.navbar-inverse .navbar-nav > .open > a:focus {
  color: #fff;
  background-color: #080808;
}
@media (max-width: 767px) {

.nwsaTEL {
   display: none;
}

/* testing code */
.container-fluid {
  padding-left: 15px;
}

.galleryspacer {
	height: 1px;
}

 
.loginspacer {
	height: 1px;
}

.supportspacer {
	height: 1px;
}

.locspacer {
	height:1px;
}


  .navbar-inverse .navbar-nav .open .dropdown-menu > .dropdown-header {
    border-color: #080808;
  }
  .navbar-inverse .navbar-nav .open .dropdown-menu .divider {
    background-color: #080808;
  }
  .navbar-inverse .navbar-nav .open .dropdown-menu > li > a {
    color: #eaeaea;
  }
  .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:hover,
  .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:focus {
    color: #fff;
    background-color: transparent;
  }
  .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a,
  .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:hover,
  .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:focus {
    color: #fff;
    background-color: #080808;
  }
  .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a,
  .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a:hover,
  .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a:focus {
    color: #444;
    background-color: transparent;
  }
}




.navbar-inverse .navbar-link {
  color: #9d9d9d;
}
.navbar-inverse .navbar-link:hover {
  color: #fff;
}
.navbar-inverse .btn-link {
  color: #9d9d9d;
}
.navbar-inverse .btn-link:hover,
.navbar-inverse .btn-link:focus {
  color: #fff;
}
.navbar-inverse .btn-link[disabled]:hover,
fieldset[disabled] .navbar-inverse .btn-link:hover,
.navbar-inverse .btn-link[disabled]:focus,
fieldset[disabled] .navbar-inverse .btn-link:focus {
  color: #444;
}


#banner {
	background-image: url("../../media/static/images/header-background-cityscape_mobile.jpg");
}


#resbanner {

        
          background-image: url("../../media/static/images/header-background-residential_mobile.jpg");
      
}

/*.list-group-item {
   padding: 4px 4px 4px 4px;
}*/



@media screen and (max-width: 767px) {
  .row-offcanvas {
    position: relative;
    -webkit-transition: all .25s ease-out;
         -o-transition: all .25s ease-out;
            transition: all .25s ease-out;
   }
#banner {
  padding: 0px 0px 0px 0px;

}

#banner {
 res padding: 0px 0px 0px 0px;

}


.containerpadding {
margin-top: 130px;
}


.row-offcanvas-right {
    right: 0;
}

.row-offcanvas-left {
    left: 0;
}

.row-offcanvas-right  .sidebar-offcanvas {
    right: -50%; /* 6 columns */
}

.row-offcanvas-left  .sidebar-offcanvas {
    left: -50%; /* 6 columns */
}

.row-offcanvas-right.active {
    right: 50%; /* 6 columns */
}

.row-offcanvas-left.active {
    left: 50%; /* 6 columns */
}

.sidebar-offcanvas {
    position: absolute;
    top: 0;
    width: 50%; /* 6 columns */
    
  
    
 
/* sm xs padding 

.list-group-item {
     padding: 2px 5px 2px 2px;
}*/
 
    
}

}

/* full screen padding*/






/*back to top button css*/


.back-to-top {
background: none;
position: fixed;
bottom: 0;
right: 0;
width: 35px;
height: 35px;
z-index: 100;
display: none;
text-decoration: none;
color: #ffffff;
background-color: #ff9000;
}
 
.back-to-top i {
  font-size: 40px;
}




/*sidenave toggle button*/

/*.buttonpadding {
margin-top: 100px;
}*/

/* side nav popout button */

.btn-custom {
position: absolute;
margin-left: -5px;
margin-right: 5px;
background: transparent;
width: 32px;
font-size: 30px;
padding: 0px 0px 0px 0px;
opacity: 0.8;
z-index: 100;
border: 2px solid white;

}


/* side nav popout button, set for semi-transparet look */

#buttonicon {
   background: rgba(66, 139, 202, 0.3);
   color: #428bca;
   
 
}


/* home security jumbotron background - same effect as responsive */

#homejumbotron {
   background-image: url("../../media/static/images/home_security.jpg");
   background-repeat: no-repeat;
   background-position: center center;    
   -webkit-background-size: cover;
   -moz-background-size: cover;
   -o-background-size: cover;
   background-size: cover;
}

.homecarousel {
  min-height: 310px;
}

#businessjumbotron {
   background-image: url("../../media/static/images/business.jpg");
   background-repeat: no-repeat;
   background-position: center center;    
   -webkit-background-size: cover;
   -moz-background-size: cover;
   -o-background-size: cover;
   background-size: cover;
}

.businesstag {
   background-color: rgba(255,0,0, 0.60);
   border-radius: 10px 10px 10px 10px;
   padding: 0px 5px 0px 5px;
   
}

/* contact jumbotron background - same effect as responsive */

#contactjumbotron {
   background-image: url("../../media/static/images/contact.jpg");
   background-repeat: no-repeat;
   background-position: center center;    
   -webkit-background-size: cover;
   -moz-background-size: cover;
   -o-background-size: cover;
   background-size: cover;
}

.mapcontainer {
	 height: 200px;
	 margin: 5px 0px 5px 0px;
}

.mapcontainer2 {
	 height: 325px;
	 margin: 5px 0px 5px 0px;
}

/* about jumbotron background - same effect as responsive */

#aboutjumbotron {
   background-image: url("../../media/static/images/about.jpg");
   background-repeat: no-repeat;
   background-position: center center;    
   -webkit-background-size: cover;
   -moz-background-size: cover;
   -o-background-size: cover;
   background-size: cover;
}





.logodiv {
  padding: 15px 10px 15px 10px;
  margin: 10px 0px 0px 10px;
  background-color: #FFF;
  border-radius: 10px;
  
}

/*.logodiv img{
  max-height: 60px;
  max-width: 150px;
}*/



/*trust image formating*/

.aboutimage {
   max-height: 200px;
   width: 600px;
 
}

/*support page image*/

.supportimage {
	margin: 15px 0 0 0;
	height: 200px;
	width: 200px;
}

/*service area page image*/

.serviceareaimage {
   padding: 10px 10px 30px 10px;
   max-height: 325px;
     
}

.accessimage {
	margin: 15px 0 0 0;
}

.commimage {
	margin: 15px 0 0 0;
}

/* jumbotron formating for background image */

.jumbotron{
   color: #FFF;
   padding: 5px 20px 100px 20px;
   min-height: 500px;
   
}


/* max height for div images to keep divs the same size */

.alarmcom {
   max-height: 160px;
   padding: 10px 10px 10px 10px;
}

.videofied {
   max-height: 160px;
   padding: 10px 10px 10px 10px;
}



/*side nav menu, rounded corners */

#startlist {
   border-top-left-radius: 10px;
   border-top-right-radius: 10px;
}

#endlist {
   border-bottom-left-radius: 10px;
   border-bottom-right-radius: 10px;
}

.contactform {
	z-index: 90;
}

.carousel {
	margin-left: auto;
	margin-right: auto;
	min-height: 250px;
	max-height: 400px;
}

.gallerycontent {
	background: limegreen;
	padding: 5px 5px 5px 5px;
	margin: 0 0 10px 0;
	color: white;
}

.gallery {
	min-height: 200px;
	max-height: 450px;
	
}

.galleryspacer {
	height: 100px;
}

.loginspacer {
	height: 400px;
}

.supportspacer {
	height: 40px;
}

.locspacer {
	height:120px;
}


.automationbg {
	   background-image: url("../../media/static/images/automation_yard.jpg");
   	   background-repeat: no-repeat;
   	   background-position: center center;    
   	   -webkit-background-size: cover;
   	   -moz-background-size: cover;
   	   -o-background-size: cover;
   	   background-size: cover;
   	   border-radius: 10px;
          margin-bottom: 20px;
	  padding: 20px 20px 20px 20px;

}



.hscontact {
	
	background-color: rgba(66,139,202, 0.60);
	color: white;
        border-radius: 10px;
        margin-bottom: 20px;
	padding: 30px 30px 30px 30px;
}

.seccambg {
	   background-image: url("../../media/static/images/frontentry.jpg");
   	   background-repeat: no-repeat;
   	   background-position: center center;    
   	   -webkit-background-size: cover;
   	   -moz-background-size: cover;
   	   -o-background-size: cover;
   	   background-size: cover;
   	   border-radius: 10px;
          margin-bottom: 20px;
	  padding: 20px 20px 20px 20px;
}



.ipphoneintercomdatabg {

        background-image: url("../../media/static/images/ipphoneintercomdataimage.jpg");
	background-repeat: no-repeat;
  background-size: cover;
	   	   background-position: center center;    
   	   -webkit-background-size: cover;
   	   -moz-background-size: cover;
   	   -o-background-size: cover;
   	 
   	   border-radius: 10px;
          margin-bottom: 20px;
	  padding: 20px 20px 20px 20px;
      
}

.assocbg {
	   background-image: url("../../media/static/images/associations.jpg");
   	   background-repeat: repeat;
   	   background-position: center center;    
   	  /* -webkit-background-size: cover;
   	   -moz-background-size: cover;
   	   -o-background-size: cover;
   	   background-size: cover;*/
   	   border-radius: 10px;
          margin-bottom: 20px;
	  padding: 20px 20px 20px 20px;
}


.accesscontrolbg {
	   background-image: url("../../media/static/images/businessentry.jpg");
   	   background-repeat: no-repeat;
   	   background-position: center center;    
   	   -webkit-background-size: cover;
   	   -moz-background-size: cover;
   	   -o-background-size: cover;
   	   background-size: cover;
   	   border-radius: 10px;
          margin-bottom: 20px;
	  padding: 20px 20px 20px 20px;
}

.maincontent {
	background-color: #fff;
        border-radius: 10px;
        margin-bottom: 20px;
}

.subcontent {
        background-color: #fff;
        border-radius: 10px;
        margin-bottom: 20px;

}

.assocmaincontent {
	background-color: rgba(66,139,202, 0.60);
	color: white;
        border-radius: 10px;
        margin-bottom: 20px;
	padding: 30px 30px 30px 30px;
}

.assocsubcontent {
        background-color: rgba(0,50,139, 0.55);
        border-radius: 10px;
        margin-bottom: 20px;
	padding: 10px 10px 10px 10px;

}

.automaincontent {
	
	background-color: rgba(169,169,169, 0.80);
	color: white;
        border-radius: 10px;
        margin-bottom: 20px;
	padding: 30px 30px 30px 30px;
}


.autosubcontent {
	
	background-color: rgba(255,255,255, 0.90);
        border-radius: 10px;
        margin-bottom: 20px;
	padding: 30px 30px 30px 30px;
}

.autoimages {
	max-height: 200px;
}

.seccammaincontent {
	
	background-color: rgba(66,139,202, 0.60);
	color: white;
        border-radius: 10px;
        margin-bottom: 20px;
	padding: 30px 30px 30px 30px;
}

.commaincontent {
	
	background-color: rgba(50,110,120, 0.80);
	color: white;
        border-radius: 10px;
        margin-bottom: 20px;
	padding: 30px 30px 30px 30px;
}

.comsubcontent {
	
	background-color: rgba(255,255,255, 0.85);
        border-radius: 10px;
        margin-bottom: 20px;
	padding: 30px 30px 30px 30px;
}

.accesssubcontent {
	
	background-color: rgba(70,130,180, 0.60);
	color: white;
        border-radius: 10px;
        margin-bottom: 20px;
	padding: 30px 30px 30px 30px;
}

.accesssubcontent a {
	color: white;
}

.seccamimages {
	max-height: 140px;
}

.videomaincontent {
	background-color: rgba(169,169,169, 0.45);
	color: white;
        border-radius: 10px;
        margin-bottom: 20px;
	padding: 30px 30px 30px 30px;
}

.hsservices {
	background-color: rgba(50,205,50, 0.50);
	color: black;
        border-radius: 10px;
        margin-bottom: 20px;
	padding: 30px 30px 30px 30px;
}



.globalcontact {
	background-color: rgba(124,252,0, 0.60);
	color: white;
        border-radius: 10px;
        margin-bottom: 20px;
	padding: 30px 30px 30px 30px;
}
.globalcontact2 {
	background-color: rgba(169,169,169, 0.65);
	color: white;
        border-radius: 10px;
        margin-bottom: 20px;
	padding: 30px 30px 30px 30px;
}

.mainright {
	background-color: rgba(255,239,213, 0.55);	
        border-radius: 10px;
	margin-top: 10px;
        margin-bottom: 10px;
	padding: 20px 10px 10px 10px;
}




/* Home Security Promo Page */

.hscologodiv {i
	margin: 0px 0px 0px 0px;
	padding: 0px 3px 0px 0px;
}

.hscologo {
	min-height: 55px;
	min-width: 230px;
}

.hscocontent {
	
	background-color: rgba(169,169,169, 0.70);
	color: white;
        border-radius: 10px;
        margin-bottom: 20px;
	padding: 5px 5px 25px 5px;
}

.hscocontact {
	
	background-color: rgba(66,139,202, 0.50);
	color: white;
        border-radius: 10px;
        margin-bottom: 20px;
	padding: 30px 30px 30px 30px;
}

.hscobg {
	   background-image: url("../../media/static/images/hscurrentoffer_yard.jpg");
   	   background-repeat: no-repeat;
   	   background-position: center center;    
   	   -webkit-background-size: cover;
   	   -moz-background-size: cover;
   	   -o-background-size: cover;
   	   background-size: cover;
   	  /* border-radius: 10px;*/
       /*   margin-bottom: 20px;*/
	  /*padding: 20px 20px 20px 20px;*/
}

.hscocall {
	background-color: rgba(124,252,0, 0.60);
	color: white;
        border-radius: 10px;
        margin-bottom: 5px;
		text-align: center;
	
}

.hscosubcontent {
        background-color: rgba(255,255,255, 0.70);
        border-radius: 10px;        
		padding: 5px 5px 5px 5px;
	
}

.divs {
         margin-top: 10px;
		 margin-bottom: 10px;
	
}





.navbar-inverse1 {
  background-color: rgba(255,255,255, 0.70);
  border-color: #646464;
  
}
.navbar-inverse1 .navbar-brand {
 padding: 15px 5px 15px 18px;
  color: #000;
  font-weight:bold;
  
 
  
}
.navbar-inverse1 .navbar-brand:hover,
.navbar-inverse1 .navbar-brand:focus {
  color: #000;
  background-color: transparent;
}
.navbar-inverse1 .navbar-text {
  color: #000;
}
.navbar-inverse1 .navbar-nav > li > a {
  color: #000;
}
.navbar-inverse1 .navbar-nav > li > a:hover,
.navbar-inverse1 .navbar-nav > li > a:focus {
  color: #fff;
  background-color: #000;
}
.navbar-inverse1 .navbar-nav > .active > a,
.navbar-inverse1 .navbar-nav > .active > a:hover,
.navbar-inverse1 .navbar-nav > .active > a:focus {
  color: #fff;
  background-color: #080808;
}
.navbar-inverse1 .navbar-nav > .disabled > a,
.navbar-inverse1 .navbar-nav > .disabled > a:hover,
.navbar-inverse1 .navbar-nav > .disabled > a:focus {
  color: #fff;
  background-color: transparent;
}
.navbar-inverse1 .navbar-toggle {
  border-color: #333;
}
.navbar-inverse1 .navbar-toggle:hover,
.navbar-inverse1 .navbar-toggle:focus {
  background-color: #333;
}
.navbar-inverse1 .navbar-toggle .icon-bar {
  background-color: #fff;
}
.navbar-inverse1 .navbar-collapse,
.navbar-inverse1 .navbar-form {
  border-color: #101010;
}
.navbar-inverse1 .navbar-nav > .open > a,
.navbar-inverse1 .navbar-nav > .open > a:hover,
.navbar-inverse1 .navbar-nav > .open > a:focus {
  color: #fff;
  background-color: #080808;
}
@media (max-width: 767px) {



/* testing code */
.container-fluid {
  padding-left: 15px;
}


  .navbar-inverse1 .navbar-nav .open .dropdown-menu > .dropdown-header {
    border-color: #080808;
  }
  .navbar-inverse1 .navbar-nav .open .dropdown-menu .divider {
    background-color: #080808;
  }
  .navbar-inverse1 .navbar-nav .open .dropdown-menu > li > a {
    color: #000;
  }
  .navbar-inverse1 .navbar-nav .open .dropdown-menu > li > a:hover,
  .navbar-inverse1 .navbar-nav .open .dropdown-menu > li > a:focus {
    color: #000;
    background-color: transparent;
  }
  .navbar-inverse1 .navbar-nav .open .dropdown-menu > .active > a,
  .navbar-inverse1 .navbar-nav .open .dropdown-menu > .active > a:hover,
  .navbar-inverse1 .navbar-nav .open .dropdown-menu > .active > a:focus {
    color: #000;
    background-color: #080808;
  }
  .navbar-inverse1 .navbar-nav .open .dropdown-menu > .disabled > a,
  .navbar-inverse1 .navbar-nav .open .dropdown-menu > .disabled > a:hover,
  .navbar-inverse1 .navbar-nav .open .dropdown-menu > .disabled > a:focus {
    color: #444;
    background-color: transparent;
  }
}




.navbar-inverse1 .navbar-link {
  color: #9d9d9d;
}
.navbar-inverse1 .navbar-link:hover {
  color: #fff;
}
.navbar-inverse1 .btn-link {
  color: #9d9d9d;
}
.navbar-inverse1 .btn-link:hover,
.navbar-inverse1 .btn-link:focus {
  color: #fff;
}
.navbar-inverse1 .btn-link[disabled]:hover,
fieldset[disabled] .navbar-inverse1 .btn-link:hover,
.navbar-inverse1 .btn-link[disabled]:focus,
fieldset[disabled] .navbar-inverse1 .btn-link:focus {
  color: #444;
}