/*
	Author: Dominic Shooter July 2014;
	Additional styles ontop of Bootstrap3 theme 
*/
:root {
	--vgrid-color-orange:#c1753a;
	--vgrid-color-blue:#3fa9c0;
	--vgrid-color-grey:#4f4f51;
	--vgrid-color-green:#88bf40;
}

.text-white {
	color:white !important;
}

.text-dark {
	color:#3a3a3c !important;
}

/* Subnav */

.dropdown-horizontal {
  position: fixed;
  top: 95px;
  right: 0;
  width: 100%;
  z-index: 1000;
  display: none;
  float: left;
  min-width: 160px;
  padding: 5px 0;
  margin: 0 auto;
  list-style: none;
  font-size: 14px;
  background-color: rgba(58, 58, 60, 0.9);
  text-align: center;
}

@media (max-width: 768px) {
	.dropdown-horizontal {
		top: 361px;
	}
}

.dropdown-horizontal li {
  display:inline-block;
}

.dropdown-horizontal.pull-right {
  right: 0;
  left: auto;
}
.dropdown-horizontal > li > a {
  display: block;
  padding: 3px 20px;
  clear: both;
  font-weight: normal;
  line-height: 1.42857143;
  color: #ffffff;
  white-space: nowrap;
  -webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-ms-transition: all 0.3s;
-o-transition: all 0.3s;
}
.dropdown-horizontal > li > a:hover,
.dropdown-horizontal > li > a:focus {
  text-decoration: none;
  color: #262626;
  background-color: #f5f5f5;
}
.dropdown-horizontal > .active > a,
.dropdown-horizontal > .active > a:hover,
.dropdown-horizontal > .active > a:focus {
  color: #ffffff;
  text-decoration: none;
  outline: 0;
  background-color: #88bf3d;
}
.dropdown-horizontal > .disabled > a,
.dropdown-horizontal > .disabled > a:hover,
.dropdown-horizontal > .disabled > a:focus {
  color: #999999;
}
.dropdown-horizontal > .disabled > a:hover,
.dropdown-horizontal > .disabled > a:focus {
  text-decoration: none;
  background-color: transparent;
  background-image: none;
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  cursor: not-allowed;
}
.open > .dropdown-horizontal {
  display: block;
}
.open > a {
  outline: 0;
}

.margin-top {
	margin-top:50px
}

.padding {
	padding: 50px 0px;
}

.padding-top {
	padding-top: 50px;
}

.padding-lg {
	padding:180px 0 50px;
}

.parallax {
	background-repeat: no-repeat;
	background-position: top center;
	background-attachment: fixed;
}

@media (max-width: 768px) {
	.parallax {
	background-size: auto 100%; 
	background-position: center center;
	}
}

#main-header {
	height: auto;
	background-image: url(../img/header.jpg);
	background-color:#ededed;
}

#support-header {
	height: auto;
	background-image: url(../img/header-support.png);
	background-color:#222222;
}

#bg-blur {
	height: auto;
	background-image: url(../img/blur.png);
	background-color: #88bf3d;
	color:#fff;
	background-size: 100% 100%; 
	background-position: center center;
}

#screenshots {
	padding: 15px 0;
}

.bg-dark {
	background-color: rgba(58, 58, 60, 1);
	color:#fff;
}

.blend {
	background-blend-mode: multiply;
}

.logo {
	width: 154px;
	height: 47px;
	background: url("../img/logo.png") no-repeat top left;
	background-size: 154px auto;
	margin:10px 0;
}

@media (max-width: 768px) {
	.logo {
		background-size: auto 38px;
		margin-left: 5px;
	}
}
.asset {
	margin:5px 0;
	display: inline-block;
	vertical-align: middle;
	background-repeat: no-repeat;
	background-color: transparent;
}

section.contrast {
	background: #ededed;
}

section.contrast-header {
	background-color: #d2d2d2;
}

section h2,h1 {
	margin-bottom: 30px;
}

.topbar {
	background: #fff;
	border-bottom: 1px solid #dcdcdc;
	color: #333;
}

.topbar-text {
	padding:7px 0;
	margin:4px;
	font-size: 13px;
	color:#999;
}

.topbar-button {
	padding: 6px;
	margin: 4px;
	border: solid 1px var(--vgrid-color-green);
	border-radius: 6px;
	color: var(--vgrid-color-green);
}
.topbar-button:hover {
	text-decoration: none;
	color: #fff;
	background: var(--vgrid-color-green);
}
.topbar-button-solid {
	padding: 6px;
	margin: 4px;
	border: solid 1px var(--vgrid-color-green);
	border-radius: 6px;
	background: var(--vgrid-color-green);
	color:#fff;
}
.topbar-button-solid:hover {
	text-decoration: none;
	color: var(--vgrid-color-grey);
}

.slider {
	max-height: 350px;
}

.homepage-header h1 {
  font-size:38px;
  font-weight:700;
}
/* Product Features */
.feature-block {
	margin-bottom: 40px;
}

.feature-block h1 {
	font-size: 3em;
}

/* Services */
.service {
  	margin-bottom: 40px;
}

.service p {
	padding-bottom: 10px;
}

.service,
.service-body {
  overflow: hidden;
  zoom: 1;
}
.service,
.service .service {
  margin-top: 15px;
}
/*.service:first-child {
  margin-top: 0;
}*/
.service-object {
  display: block;
}
.service-heading {
  margin: 0 0 5px;
}
.service > .pull-left {
  margin-right: 10px;
}
.service > .pull-right {
  margin-left: 10px;
}
.service-list {
  padding-left: 0;
  list-style: none;
}

/* Media */
.media {
	padding:15px;
}

/* Price Panel */
.panel-price-body {
  background-color: #545456;
  color:#fff;
}
.panel-price > .panel-heading {
  color:#fff;
  background-image: -webkit-linear-gradient(top, #383838 0%, #383838 100%);
  background-image: linear-gradient(to bottom, #383838 0%, #383838 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#383838', endColorstr='#383838', GradientType=0);
}

/* down arrow divider */

.arrow-down {
	width: 0; 
	height: 0; 
	border-left: 20px solid transparent;
	border-right: 20px solid transparent;
	border-top: 20px solid #fff;
}

.arrow-down.contrast {
	border-top: 20px solid #d2d2d2;
}

/* FTP Chart */

.members-social li a i {
	padding:10px;
	background-color: #516258;
	border:1px solid #516258;
	color:#ffffff;
	transition: all 0.3s;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-o-transition: all 0.3s;
}

.members-social li a i:hover {
	background-color: transparent;
	border:1px solid #516258;
	color:#516258;
}

@media (max-width: 768px) {
	.members-social li a i {
		padding:0px;
		background:transparent;
		border:1px solid transparent;
		color:#516258;
		font-size: 1em;
	}
	.members-social li a i:hover {
		border:1px solid transparent;
	}
}


/* Banner */
.banner-text {
	padding:40px 0;
}

/* Footer */

footer {
	padding:40px 0 20px;
	background: #333333;
	color:#ffffff;
}

footer img {
    filter: url(filters.svg#grayscale); /* Firefox 3.5+ */
    filter: gray; /* IE6-9 */
    -webkit-filter: grayscale(1); /* Google Chrome, Safari 6+ & Opera 15+ */
}

footer img:hover {
    filter: none;
    -webkit-filter: grayscale(0);
}

footer p, address {
	font-size: 12px;
}

footer h5 {
	text-transform: uppercase;
}

footer a {
	color:#ededed;
	font-size: 12px
}

footer a:hover {
	color:#d2d2d2;
	text-decoration: none;
}

.bottombar {
	font-size:11px;
	padding:9px 0;
	background: #555555;
	color:#ffffff;
	overflow: hidden;
}

.footer-map {
	height: 150px;
	width: 100%;
}

a.symbol:hover {
	text-decoration: none;
}

.social li {
	font-size:30px;
	padding:0px;
}

.btn-outline {
	color:#ffffff;
  	border:2px solid white;
  	background-color: transparent; 
  	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-o-transition: all 0.3s;
}
.btn-outline:hover,
.btn-outline:focus {
	border:2px solid white;
	background-color: white;
}
.btn-outline:active,
.btn-outline.active {
  	border:2px solid white;
	background-color: white;
}

a.full, a.full:hover {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	text-decoration: none;
	background-color: #ededed;
	opacity: 0;
	filter: alpha(opacity=1);
}
#filtered {
	min-height: 580px;
}
#filtered .mix{
	display: none;
}

#filtered a {
	font-size: 0.8em;
}

.greyscale img {
    filter: url(filters.svg#grayscale); /* Firefox 3.5+ */
    filter: gray; /* IE6-9 */
    -webkit-filter: grayscale(1); /* Google Chrome, Safari 6+ & Opera 15+ */
}

/* additional large font awesome sizes */
.jumbotron-icon {
	padding-top:20px;
}

.jumbotron-icon .fa-6 {
  font-size: 7em;
}

.jumbotron-icon .fa-7 {
  font-size: 20em;
}

.callout {
	border-top:4px solid #88bf3d;
}

.callout p:last-child {
    margin-bottom: 0;
}

/* UFB Map */
#map-canvas {
	height: 500px;
	margin: 0px;
	padding: 0px;
}

 

#pac-input {
	margin:10px;
	background-color: #fff;
	padding: 0 11px 0 13px;
	width: 400px;
	font-family: 'Open Sans';
	font-size: 15px;
	font-weight: 300;
	text-overflow: ellipsis;
}

@media (max-width: 768px) {
	#pac-input {
		width:100%;
		margin-left:0px;
	}
	#pac-input:focus {
		width: 100%;
		margin-left:0px;
	}
}

#pac-input:focus {
	border-color: #4d90fe;
	margin-left: -1px;
	padding-left: 14px;  /* Regular padding-left + 1. */
	width: 401px;
}

.pac-container {
	font-family: 'Open Sans';
}

#type-selector {
	color: #fff;
	background-color: #4d90fe;
	padding: 5px 11px 0px 11px;
}

#type-selector label {
	font-family: 'Open Sans';
	font-size: 13px;
	font-weight: 300;
}

#headlines > li {
	border-bottom:2px solid #ededed;
}

.terms h4 {
	margin-top:30px;
}

.terms h4 a {
	text-decoration: none;
	color:#222;
}

.terms ol + p {
	margin-top: 30px
}

/* vGRID colours */
.vgrid-box {
	border:0px !important;
	min-height: 263px;
}
.vgrid-box h4 {
	margin:30px 0 15px 0;
}
.vgrid-box img {
	text-align: center;
	padding:15px;
}
.text-starter {
	color: #3DA9C0;
}
.text-enterprise {
	color: #ADC13C;
}
.text-flex {
	color: #C1753C;
}
.text-desktop {
	color: #797A7D;
}
.bg-starter {
	background-color: #3DA9C0;
}
.bg-enterprise {
	background-color: #88BF3D;
}
.bg-flex {
	background-color: #C1753C;
}
.bg-desktop {
	background-color: #797A7D;
}

#partnerBadge {
	width: 300px;
	height: 178px;
}

.country-select .country-list {
    width: 10em;
    overflow-y: hidden;
}

.country-select {
    float: right;
}

#country-selector {
    width: 20px;
    padding: 3.7px;
    visibility: hidden;
}

.cl-padding {
    padding: 15px 0px;
}