/*** My Netfuse CSS. Authors: Leo Brown, Domenico Salvia ***/

/** Core definitions. **/
	/* Load fonts */
	@font-face {
	    font-family: 'BariolRegular';
	    src: url('/fonts/bariol-regular.eot');
	    src: url('/fonts/bariol-regular.eot?#iefix') format('embedded-opentype'),
	         url('/fonts/bariol-regular.woff') format('woff'),
	         url('/fonts/bariol-regular.ttf') format('truetype'),
	         url('/fonts/bariol-regular.svg#BariolRegularRegular') format('svg');
	    font-weight: normal;
	    font-style: normal;
	}

	/* Background image for the login page */
	#bg {
	  position: fixed; 
	  top: -50%; 
	  left: -50%; 
	  width: 200%; 
	  height: 200%;
	  z-index:-1;
	  opacity: 0.2;
	}
	#bg img {
	  position: absolute; 
	  top: 0; 
	  left: 0; 
	  right: 0; 
	  bottom: 0; 
	  margin: auto; 
	  min-width: 50%;
	  min-height: 50%;
	}

	/* Body definitions. */
	body {
		max-width:1300px;
		margin:0 auto;
		font-family: BariolRegular, "Helvetica Neue", Helvetica, Arial, sans-serif;
	  	line-height: 140%;
	  	color: #333333;
	  	font-weight: 300;
	  	padding-top: 110px;
	}

	#content-area{
		min-height: 400px;
	}

	/* Heading definitions. */
	h1,h2,h3,h4,h5,h6 {
		font-family: BariolRegular, "Helvetica Neue", Helvetica, Arial, sans-serif;
	}

	/* Handle Dropdown menu size limitation. */
	.dropdown-menu {
		max-height: 360px;
		overflow: hidden;
		overflow-y: auto;
	}
	.dropdown-menu::-webkit-scrollbar {
	    -webkit-appearance: none;
	}
	.dropdown-menu::-webkit-scrollbar:vertical {
	    width: 11px;
	}

	.dropdown-menu::-webkit-scrollbar-thumb {
	    border-radius: 8px;
	    border: 2px solid white; /* should match background, can't be transparent */
	    background-color: rgba(0, 0, 0, .5);
	}
/** End Core Definitions **/

/** Table Styling **/

	/* Table condensed must use smaller type */
	.table-condensed th,
	.table-condensed td {
		font-size: 85%;
	}
	/* Forms and Inputs within a table should not have margin or padding! */
	table form {
		margin:0;
	}
	table input {
		margin:0 !important;
		padding:0 !important;
	}
/** End Table Styling **/

/** Connector Styling **/

	.connectors {
		
	}
	.connector-category {
		clear:both;
	}
	.connector-item {
		float:left;
		width:300px;
		margin-right:20px;
	}
	.connector-item-description {
		height:32px;
	}

	.connectors .well {
		position:relative;
		overflow: hidden;
	}

	.connectors .well > i {
		position: absolute;
		font-size: 7em;
		color: #eaeaea;
		margin-top: -0.28em;
		margin-left: 0.1em;
	 	-webkit-transition: all .8s ease-in-out;
	}

	/* Connector index page connector intro */
	.destinationOptions .description {
		overflow:hidden;
	}
	.destinationOptions .description i {
		font-size: 6.5em;
		position: absolute;
		color: #eaeaea;
		margin-top: -35px;
		margin-left: -10px;
		-webkit-transition: all .8s ease-in-out;
	}
	.destinationOptions .description .text {
		position:relative;
		font-weight:bold;
	}

	/* Hover for connector blocks */
	.connectors .well:hover > i,
	.destinationOptions .description:hover i {
		-webkit-transition: all .8s ease-in-out;
		-webkit-transform: scale(1.3);
		color: #f5f5f5;
	}

	.connectors .well a {
		position: relative;
		padding-top: 2px;
	}

	.connectors .well .destination_info {
		position: relative;
	}

/** End Connector Styling **/

/** Navbar Styling **/

	div.navbar {
		border:0;
		z-index:900;
	}

	div.navbar-inner {
		background: #fff
	}

	.navbar-inner {
		height: 70px;
		padding: 15px;
	}
	
	.brand {
		margin-top:5px;
		height: 65px;
	}
	.navbar-fixed-top ul.nav {
		float:right;
		margin-top: 5px;
		padding-left: 20px;
	}

	/* Add some bottom margin to the navbar */
	div.navbar-fixed-top {
		margin-bottom: 25px !important;
	}

	/* Navbar button group default styling */
	.navbar-buttons {
		float:right;
		margin-top: -44px;
		padding-right:20px;
		padding-left:15px;
	}
	
	/* Styling for navbar switches */
	.has-switch{
		margin-left: 10px;
		margin-right: 10px;
	}

/** End Navbar Styling **/

/** Sidebar Styling **/
	
	#sidebar-nav {
		margin-top: 20px;
		padding:0px;
	}
	.nav-list {
		padding:0 !important; /** for IE9 **/
		margin:0 !important;
		-webkit-padding-start: 0;
		list-style:none;
	}
	#sidebar-nav li {
		position: relative;
		display: block;
	}
	#sidebar-nav li a {
		display:block;
		padding: 5px 5px;
	}
	#sidebar-nav li a:hover {
		text-decoration:none;
	}
	#sidebar-nav li a i {
		line-height:14px !important; /* line up icons fully with text */
		width:21px;
		color:rgb(97, 97, 116);
		-webkit-transition: all .2s ease-in-out;
	}
	#sidebar-nav li.active a i {
		color: rgb(49, 154, 236);
	}
	#sidebar-nav li a:hover i {
		-webkit-transition: all .3s ease-in-out;
		-webkit-transform: scale(1.3);
		color: rgb(29, 192, 42);
	}

	#sidebar-nav .subgroup {
		padding-left:10px;
		margin-left:14px;
		margin-bottom: 5px;
		border-left:solid 1px #eee;
		display: none;
	}

	#sidebar-nav .subgroup-item {
		font-size:12px;
	}

/** End Sidebar Styling **/

/** Dashboard Styling **/

	/* Dashboard Item Font Size */
	.dashboard .data {
		font-size: 90%;
	}
	.dashboard .panel {
		padding-top: 7px;
	}
	.dashboard .panel i {
		width:30px;
		color: #777;
	}

	.dashboard .panel a {
		padding-top: 2px;
	}

	.dashboard .col-md-4 {
		padding:0px 10px 0px 0px;
	}

	/* Optional dashboard style -- Make massive background dashboard items! */
	.dashboard .panel .title a {
	  position:relative;
	}
	.dashboard .panel i {
	  position: absolute;
	  font-size: 10em;
	  color: #eaeaea;
	  margin-top: -0.25em;
	  -webkit-transition: all .8s ease-in-out;
	}
	.dashboard .panel:hover i {
	  -webkit-transition: all .8s ease-in-out;
	  color: #f5f5f5;
	  -webkit-transform: scale(1.5);
	}
	.dashboard .panel {
	  overflow: hidden;
	  position: inherit;
	}
	.dashboard .panel .data {
	  position:relative;
	}
	/* End custom dashboard style */

/** End Dashboard Styling **/

/** Modal Styling **/
	.system_modal {
		display:none;
		position: absolute;
		background-color: rgba(245, 245, 245, 0.97);
		border:solid 1px #ccc;
		left: 18%;
		padding: 20px;
		min-width: 550px;
		border-radius: 10px;
		max-width: 600px;
		overflow: auto;
		top: 100px;
	}
	@media screen and (max-width: 750px) {
		.system_modal{
			min-width:inherit;
		}
	}
	/* Fixes for modal connector forms */
	@media (min-width: 1200px) {
		.system_modal .col-lg-3 {
			width: 35%;
		}
		.system_modal .col-lg-4 {
			width: 50%;
		}
	}

/** End Modal Styling **/

/** Platform Specific Media Queries **/

	/* Desktop/Laptop configuration. */
	@media screen and (min-width: 768px) {

		.hidden-btn{
			display: none;
		}

		.grouped-control-button-group .btn-group{
			padding-right: 10px;
			padding-bottom: 10px;
		}

		.switch-group {
			float: left;
			padding: 2px 15px 0 10px;
		}
		.switch-group label{
			font-weight: 200;
		}
		
		.navbar-buttons i{
			font-size: 2.4em;
			padding: 0px 10px 0px 10px ;
		}
		.navbar-buttons .btn-group{
		padding: 0px 10px 0px 10px;
		}
	}

	/* iPad/Tablet display configuration. */
	@media screen and (max-width: 767px) {
		.row-offcanvas {
			position: relative;
			left: 0;
			-webkit-transition: left .3s ease-in;
			-moz-transition: left 0.25s ease-in;
			transition: left 0.25s ease-in;
		}

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

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

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

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

		.sidebar-offcanvas {
			position: absolute;
			top: 0;
			width: 100%; /* 6 columns */
		}  

		.hidden-btn{
	  		margin-right: 5px;
	  	}
	  	.switch-group {
			float: left;
			padding-right: 20px;
			margin-top: -10px;
			display:none;
		}
		.navbar-buttons .fa-th {
			font-size: 2.4em;
			padding: 0px 10px 0px 10px ;
			float: right;
		}
	
	}

	/* iPhone/Mobile configuration. */
	@media screen and (max-width: 580px) {

		.navbar-buttons {
	    	float:left;
	    	margin-top: 10px;
	  	}

	  	.navbar-inner {
			height: 115px;
		}

		.switch-group {
			float: left;
			margin-top: 5px;
			padding-left: 20px;
			display:none;
		}

		.container {
			margin-top: 50px;
		}
	}
	
/** End Platform Specific Media Queries **/

/** Grouped Control Styling **/

	.item-simple-representation {
		margin-bottom: 10px;
		overflow: hidden;
	}

	.gc-row {
		padding-top: 5px; 
		border-bottom: solid 1px #ccc;
	}

	.edit-view {
		cursor: pointer;
	}

	.grouped-control-delete {
		cursor: pointer;
	}

	.grouped-control-container .control-group {
	  border: solid 1px #ccc;
	  border-radius: 10px;
	  padding-top : 10px;
	  padding-left: 10px;
	  padding-right: 10px;
	  padding-bottom: 5px;
	  margin-bottom: 10px;
	}

	/* grouped-control-button media queries */
	@media screen and (min-width: 1199px) {
		.form-horizontal.connector-form {
			width: 58.3333%;
		}
		.modal .grouped-control-button-group .btn-group,
		.system_modal .grouped-control-button-group .btn-group {
			margin:auto;
		}
	}

/** End Grouped Control Styling **/

/** Number Order Styling **/
	
	.number-quantity {
        padding-right: 0px;
    }

    .number-order-row {
    	padding-left: 0px;
    	padding-right: 0px;
    }

    .heading {
    	padding-right: 5px;
    }
	
/** End Number Order Styling **/
		
/** Form Panel Styling **/
	
    .form-panel-footer {
        padding: 5px 0px 5px 0px;
    }
	
    .form-panel-row {
        padding-top: 10px;
        padding-bottom: 10px;
    }
	
/** End Form Panel Styling **/


/** Miscellaneous Styling **/

	/* Definition lists - used mainly for "view" views */
	dl {
		max-width:500px;
	}
	dt {
		float:left;
		clear:both;
	}
	dd {
		float:right;
	}
	dt,dd {
		line-height:30px;
	}

	/* Auto-hide related panes, which will be reactivated by javascript */
	.related {
		margin-top:15px;
		display:none;
	}

	/* In a similar vein, for anything that's tabbed we will be stripping out the
    first h1 or h2 which means for tabular data there will not be enough space
    between the "add" button and the table */
	.tab-pane .table {
		margin-top:20px;
		float:left;
	}

	.popover,
	.tooltip {
		font-size:13px;
		z-index:10000;
	}

	fieldset {
	/*	max-width:550px; */
	}

	.pagination {
		margin-top: 0px;
	}
	/* Fade settings */
	.sub-box {
		color:#bbb;
		background-color:#ffffff;
		min-height: 196px;
	}

	.sub-box.active {
		color:#222;
		background-color:#f5f5f5;
	}

	.description {
		min-height: 57px;  
	}

	/* Hide manage buttons by default */
	.sub-box .manage-subscription {
		display: none;
	}

	/* For active boxes, activate manage subscription button */
	.sub-box.active .manage-subscription {
		display: inline-block;
	}

	/* For active boxes, hide add button */
	.sub-box.active .add-subscription {
		display: none;
	}

	/* For Netfuse configurator */
	.tab-constraints {
		min-height: 300px;
	}

	.configurator-header {
		margin-top: 0px;
	}

	.submit-button {
		margin-bottom: 2%;
	}

	/* Text size override for form elements */
	.form-control {
		font-size: 15px;
	}

	/* Fix styling for switches in forms as Bootstrap insists 34px high for .form-control */ 
 	.bootstrap-switch .form-control { 
	    height:auto !important; 
 	}
	.bootstrap-switch{
		border-color:rgba(196,196,196,0.6);
		margin-left: 2px;
	}

	.form-control.number-routing-select {
		font-size: 13px;
		height: 25px;
padding:1px !important;
	}

	.clickable {
		cursor: pointer;
	}

	/* Country data in Numbers controller styling */
	.countryData h3 {
		text-shadow: 3px 3px 2px #fff;
	}
	.countryData h4 {
		text-shadow: 3px 3px 3px #fff;
	}
	.countryData ul li {
		text-shadow: 2px 2px 2px #fff;
	}

	/* Fix to ensure that navbar is aligned correctly with page content */
	.align-to-navbar {
		padding-top: 20px;
	}

	.margin-fix {
		margin-top: 9px;
	}
/** End Miscellaneous **/