@charset "UTF-8";


/***** Variable Values *****/

/*
COLORS:
   bodyBackground           rgb(50, 58, 69)
   headerBackgroundTop      rgb(255, 255, 255)
   headerBackgroundBottom   rgb(255, 255, 255)
   headerText               rgb(153, 153, 153)
   sectionBackgroundLight   rgb(255, 255, 255)
   sectionBackgroundDark    rgb(51, 51, 51)
   bodyTextLight            rgb(255, 255, 255)
   bodyTextDark             rgb(0, 0, 0)
   headingText              rgb(35, 200, 216)
   link                     rgb(109, 206, 34)
   buttonBackground         rgb(212, 137, 24)
   footerBackground         rgb(50, 58, 69)
   footerText               rgb(187, 187, 187)

COMPUTED COLORS:
   captionBackground        rgba(0, 0, 0, 0.6)
   overlayBackground        rgba(255, 255, 255, 0.85)
   buttonText               rgb(255, 255, 255)
   headerBorder             rgba(195, 195, 195, 0.3)
   footerBorder             rgba(187, 187, 187, 0.6)

HARD-CODED COLORS:
   background_work          rgb(102, 102, 102)
   background_work_overlay  rgba(186, 186, 186, 0.85)
   heading_work             rgb(82, 92, 92)
   background_play          rgb(29, 48, 65)
   background_play_overlay  rgba(53, 181, 191, 0.7)
   heading_play             rgb(255, 141, 239)

FONTS:
   topMenuText              Arial, 700 (Font stack: Arial, 'Helvetica Neue', Helvetica, sans-serif)
   sideMenuText             Arial, 400 (Font stack: Arial, 'Helvetica Neue', Helvetica, sans-serif)
   bodyText                 Arial, 400 (Font stack: Arial, 'Helvetica Neue', Helvetica, sans-serif)
*/

	
/***** Site-wide styles *****/

body {
	background-color: rgb(50, 58, 69);
	font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
	color: rgb(0, 0, 0);
	font-size: 1.8em;
	line-height: 1.25;
	padding-top: 70px;
	overflow-x: hidden;
	font-weight: 400;
}

a {
	color: rgb(109, 206, 34);
	/*color:black;*/
}

p {
	margin-bottom: 20px;
}

a:hover,
a:focus {
	color: rgb(109, 206, 34);
}

#sections {
	display: block;
	margin-left: auto;
	margin-right: auto;
}





/***** Header nav styles *****/

.navbar-fixed-top {
	font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;

    background-color: rgb(255, 255, 255);

	padding-top: 7px;
	padding-bottom: 5px;
	border-bottom: solid 1px rgba(195, 195, 195, 0.3);
	min-height: 70px;
}

.navbar-wrapper {
	margin-left: auto;
	margin-right: auto;
	max-width: 1366px;
	position: relative;
}

.container-fluid {
	padding: 0 15px 0;
}

.icon-bar {
	background-color: rgb(153, 153, 153);
	display: block;
	width: 22px;
	height: 2px;
	margin-top: 4px;
	margin-bottom: 4px;
	border-radius: 1px;
}

.navbar-toggle {
	margin-top: 14px;
	margin-bottom: 14px;
	margin-right: 42px;
	padding: 3px 9px;
}

.menu-slide-button {
	float: right;
	position: relative !important;
	display: block !important;
	margin-left: 3px;
	margin-top: 14px;
	margin-right: 0;
	margin-bottom: 14px;
	padding: 2px 9px;
	z-index: 500;
	background-color: transparent;
	border: none;
	border-radius: 6px;
	outline: none;
}

.navbar-toggle:hover .icon-bar,
.navbar-toggle:focus .icon-bar,
.menu-slide-button:hover .icon-bar,
.menu-slide-button:focus .icon-bar {
	background-color: rgb(109, 206, 34) !important;
}

.navbar-nav,
.sidebar-duplicate {
	font-size: 0.9em;
	list-style: none;
	margin-top: 0;
	margin-bottom: 0;
	padding: 0;
	font-weight: 700;
}

.navbar-nav > li,
.sidebar-duplicate > li {
	padding: 0 !important;
	line-height: 1em !important;
	margin: 0 0 5px 0 !important;
}

.navbar-nav > li > a,
.navbar-nav button,
.sidebar-duplicate > li > a {
	display: block;
	padding: 7px 10px;
	border-radius: 6px;
	color: rgb(153, 153, 153);
	border: none;
	background-color: transparent;
}

.navbar-nav button {
	padding-bottom: 6px;
}

.navbar-nav > li > a:hover,
.navbar-nav > li > a:focus,
.navbar-nav button:hover,
.navbar-nav button:focus,
.sidebar-duplicate > li > a:hover,
.sidebar-duplicate > li > a:focus {
	background-color: rgb(109, 206, 34);
	color: rgb(255, 255, 255);
	text-decoration: none;
}

.navbar-brand {
	font-size: 1.5em;
	margin-left: 0 !important;
	padding: 0;
}

.navbar-brand svg {
	height: 42px;
	width: auto;
	margin: 8px 0 0;
}

.navbar-nav > li > a.dropdown-toggle {
	padding: 4px 9px;
}

.navbar-form {
	padding: 0;
	position: absolute;
	top: 3px;
	right: 145px;
	left: 25px;
	text-align: right;
	z-index: 100;
	display: none;
	background-color: rgb(255, 255, 255);
	padding-right: 10px;
}

#search-btn {
	float: right;
	font-size: 0.9em;
	color: rgb(153, 153, 153) !important;
	box-shadow: none;
	margin-top: 14px;
	margin-left: 3px;
	padding: 2px 11px 0;
	border-radius: 6px;
	background-color: transparent;
	outline: none;
}

#search-btn:hover,
#search-btn:focus {
	color: rgb(109, 206, 34) !important;
}

#navbar-search {
	display: inline-block;
	width: auto;
	width: 100%;
	padding-top: 0;
	padding-bottom: 0;
	height: 30px;
	font-size: 1em;
}

.navbar-form .btn {
	position: absolute;
	top: 2px;
	left: 100%;
	margin-left: -2px;
	padding: 2px 11px 0;
	border-radius: 6px;
	font-size: 0.9em;
	color: rgb(193, 193, 193);
}

.navbar-form .btn:hover,
.navbar-form .btn:focus {
	color: rgb(255, 255, 255);
	background-color: rgb(109, 206, 34);
	border-color: rgb(109, 206, 34);
	outline: none;
}

.navbar-form .btn:active {
	box-shadow: none;
}

.navbar-fixed-top .navbar-collapse {
	max-height: 90vh !important;
}

.dropdown-form {
	padding: 10px;
	width: 300px;
}

.dropdown-form input {
	margin-bottom: 6px;
	font-weight: 400;
}

.dropdown-form label {
	position: absolute;
	left: -999em;
}

.dropdown-form h2 {
	font-size: 1.2em;
	text-transform: uppercase;
	text-align: center;
	font-weight: 600;
	margin-top: 0;
	margin-bottom: 15px;
}

.dropdown-form h3 {
	font-size: 1em;
	margin-top: 10px;
	margin-bottom: 0;
	color: rgb(153, 153, 153);
}

.dropdown-form p {
	margin-top: 10px;
	margin-bottom: 0;
	padding-left: 2px;
}

.dropdown-form ul {
	padding-left: 5px	;
	list-style-type: disc;
	list-style-position: inside;
	font-weight: normal;
	color: rgb(153, 153, 153);
}

.dropdown-form li {
	margin-top: 5px;
}

.dropdown-form a {
	font-weight: 400;
}

.dropdown-form .btn {
	text-transform: uppercase;
	font-weight: 600;
	color: rgb(255, 255, 255) !important;
	text-decoration: none !important;
	background-color: rgb(153, 153, 153);
	padding: 2px 11px;
	margin-top: 10px;
	border-radius: 6px;
}

.dropdown-form .btn[type="submit"] {
	background-color: rgb(109, 206, 34);
	float: right;
	padding: 3px 11px;
}

.dropdown-form .btn:hover,
.dropdown-form .btn:focus {
	background-color: rgb(109, 206, 34);
}

.dropdown-form .btn[type="submit"]:active {
	outline: none;
}

.dropdown.open > button {
	color: rgb(109, 206, 34);
	text-decoration: underline;
}

.sidebar {
	position: fixed;
	top: 69px;
	right: 0;
	bottom: 0;
	width: 370px;
	padding-right: 50px;
	height: auto !important;
	max-height: 50vh !important;
	background-color: rgb(50, 58, 69);
	color: rgb(255, 255, 255);
	-webkit-transition: right 0.2s ease;
	transition: right 0.2s ease;
	font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
	font-weight: 400;
}

.sidebar-interior {
	overflow-y: auto;
	max-height: 100vh;
	max-height: calc(100vh - 100px);
	width: 320px;
}

.navbar-fixed-top .sidebar {
	max-height: none !important;
}

.sidebar.collapse {
	right: -370px;
}

.sidebar.collapsing {
	right: 0;
}

.sidebar.in {
	right: -50px;
}

.sidebar h2 {
	background-color: rgb(255, 255, 255);
	margin-top: 0;
	margin-bottom: 0;
	padding: 10px 50px 15px 10px;
	text-align: center;
	text-transform: uppercase;
	font-weight: 600;
	color: rgb(51, 51, 51);
	font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
}

.sidebar h2:before {
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	border-left: solid 1px rgba(195, 195, 195, 0.3);
}

.sidebar-menu {
	list-style: none;
	padding: 0;
	margin-top: 20px;
}

.sidebar-menu li {
	margin-bottom: 5px;
}

.sidebar-menu li a {
	display: block;
	padding: 5px 15px;
}

.sidebar-menu li a:hover,
.sidebar-menu li a:focus {
	text-decoration: none;
	background-color: rgb(109, 206, 34);
	color: rgb(50, 58, 69);
}

.sidebar-footer {
	margin-top: 100px;
	padding: 15px 15px 30px;
	position: relative;
}

.sidebar-contact a {
	color: rgb(255, 255, 255);
}

.close-sidebar-button {
	background-color: transparent;
	border: none;
	color: rgb(187, 187, 187);
	font-size: 3em;
	position: absolute;
	margin-top: -1.7em;
	left: 0;
	outline: none;
}

.sidebar-close-hitbox {
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: rgb(50, 58, 69);
	display: none !important;
	z-index: 1000;
	-webkit-transition: opacity 0.1s ease;
	transition: opacity 0.1s ease;
}

.sidebar-close-hitbox.collapse {
	display: none !important;
	opacity: 0;
}

.sidebar-close-hitbox.collapsing {
	display: block !important;
	opacity: 0;
}

.sidebar-close-hitbox.collapse.in {
	display: block !important;
	opacity: 0.4;
}

.nav-toggle-hidden {
	display: none;
}

.sidebar-duplicate {
	border-top: solid 1px rgb(153, 153, 153);
	margin-top: 10px;
	padding-top: 10px;
}

@media all and (max-width: 767px) {
	
	.navbar-nav {
		position: relative;
		top: -5px;
	}
	
	.navbar-nav .dropdown {
		display: none;
	}
	
	.dropdown-menu > li {
		padding: 3px 0;
	}
	
	.dropdown-menu > li > a {
		padding: 7px 10px;
		border-radius: 6px;
		color: rgb(153, 153, 153);
		font-weight: 700;
	}
	
	.dropdown-menu > li > a:hover,
	.dropdown-menu > li > a:focus {
		background-color: rgb(109, 206, 34);
		color: rgb(255, 255, 255);
	}
	
	.dropdown-menu .divider {
		display: none;
	}
	
	.sidebar {
		display: none !important;
	}
	
	.navbar-collapse {
		background-color: rgb(50, 58, 69);
		margin-left: -15px;
		margin-right: -15px;
		margin-bottom: -6px;
		box-sizing: border-box;
	}
	
	.navbar-nav {
		padding-top: 15px;
	}
	
	.navbar-collapse a {
		border-radius: 0 !important;
	}
	
	.sidebar-duplicate {
		padding-bottom: 10px;
	}
	
	.navbar-nav > li > a,
	.navbar-nav button,
	.sidebar-duplicate > li > a {
		font-weight: 700;
		color: rgb(109, 206, 34);
		font-size: 18px;
	}
	
	.navbar-nav > li > a:hover,
	.navbar-nav > li > a:focus,
	.navbar-nav button:hover,
	.navbar-nav button:focus,
	.sidebar-duplicate > li > a:hover,
	.sidebar-duplicate > li > a:focus {
		color: rgb(50, 58, 69);
	}
	
}

@media all and (min-width: 768px) {
	
	.navbar-nav {
		clear: none !important;
		float: right;
		text-align: right;
		padding-top: 14px;
		font-size: 0.75em;
	}
	
	.navbar-nav > li {
		padding: 2px 0;
		display: inline-block;
		float: none;
	}
	
	.navbar-nav > li > a {
		padding: 3px 8px;
	}
	
	.navbar-nav > li > a,
	.navbar-nav button {
		text-transform: uppercase;
	}
	
	.navbar-form {
		left: 260px;
		right: 129px;
		top: 4px;
	}
	
	#navbar-search {
		max-width: 400px;
	}
	
	.navbar-collapse {
		height: auto !important;
		margin-left: 90px;
		float: none !important;
		max-height: none;
	}
	
	.navbar-collapse:before,
	.navbar-collapse:after {
		display: none !important;
	}
	
	.navbar-collapse.collapsing {
		height: auto !important;
	}
	
	.navbar-brand svg {
		height: 52px;
		margin: 2px 0 0;
	}
	
	.navbar-brand.nav-toggle-hidden {
		display: block;
	}
	
	.navbar-nav .login-link {
		display: none;
	}
	
	.navbar-nav .dropdown {
		display: block;
	}
	
	.sidebar {
		position: fixed;
		right: 50px;
	}
	
	.sidebar-duplicate {
		display: none;
	}
	
	.sidebar-close-hitbox {
		margin-left: 0;
	}
	
	.navbar-nav > li > a:hover,
	.navbar-nav > li > a:focus,
	.navbar-nav button:hover,
	.navbar-nav button:focus {
		background-color: transparent;
		color: rgb(109, 206, 34);
		text-decoration: underline;
	}
	
}





/***** Section common styles *****/

section {
	margin-left: auto;
	margin-right: auto;
	max-width: 1366px;
}

.spread h2 {
	font-size: 4.5em;
	font-weight: normal;
	margin-bottom: 30px;
	text-transform: uppercase;
}

h2.spread-smaller {
	text-transform: none;
	font-size: 2.2em;
}

h2.capital {
	text-transform: uppercase;
}

.btn-more {
	background-color: rgb(212, 137, 24);
	border-radius: 8px;
	color: rgb(255, 255, 255) !important;
	font-size: 1em;
	font-weight: 600;
	margin-top: 20px;
	padding: 8px 25px;
	text-transform: uppercase;
	white-space: normal;
}

.btn-more:hover,
.btn-more:focus {
	background-color: rgb(109, 206, 34);
}

@media all and (min-width: 768px) {
	
	.spread h2 {
		font-size: 7.5em;
		margin-bottom: 35px;
	}
	
	h2.spread-smaller {
		font-size: 3.6em;
	}
	
}





/* LIVE/SLIDER section */

#section-home-slider {
	overflow: hidden;
}

.flexslider {
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 0 !important;
	border: none !important;
	border-radius: 0;
}

.flex-direction-nav {
	display: none;
}

.flexslider .flex-control-nav {
	bottom: 20px;
	right: 20px;
    display: inline-block;
    width: auto;
	z-index: 500;
	text-align: right;
	font-size: 0;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.flexslider .btn-more {
    margin-bottom: 20px;
}

.flex-control-paging a {
	background-color: rgb(153, 153, 153) !important;
}

.flex-control-paging a.flex-active {
	cursor: pointer !important;
	background-color: rgb(109, 206, 34) !important;
}

.flex-control-paging a:hover,
.flex-control-paging a:focus {
	background-color: rgb(109, 206, 34) !important;
}

.flexslider .item {
	min-height: 520px;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}

.slider-1 {
	background-color: rgb(255, 255, 255);
	position: relative;
}

.slider-1 .section-interior {
	max-width: 1000px;
	margin: 40px;
	position: relative;
	z-index: 100;
	padding: 30px;
	float: right;
	background-color: rgba(250,250,250,0.9);
}

.slider-1 h2 {
	color: rgb(35, 200, 216);
	margin-left: -6px;
}

.slider-1 .section-image {
	min-height: 651px;
	background-image: url('graphics/livebg[2].jpg');
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}

.slider-2 {
	background-color: rgb(255, 255, 255);
	position: relative;
}

.slider-2 .section-interior {
	max-width: 500px;
	margin: 40px;
	position: relative;
	z-index: 100;
	padding: 30px;
	background-color: rgba(250,250,250,0.9);
}

.slider-2 h2 {
	color: rgb(35, 200, 216);
	margin-left: -6px;
}
.slider-2 .section-image {
	min-height: 651px;
	background-image: url('graphics/workbg[2].jpg');
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}


.slider-3 {
	background-color: rgb(255, 255, 255);
	position: relative;
}

.slider-3 .section-interior {
	max-width: 450px;
	margin: 40px;
	position: relative;
	z-index: 100;
	padding: 30px;
	float: right;
	background-color: rgba(250,250,250,0.9);
}

.slider-3 h2 {
	color: rgb(35, 200, 216);
	margin-left: -6px;
}

.slider-3 .section-image {
	min-height: 651px;
	background-image: url('graphics/playbg[2].jpg');
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}

.slider-4 {
	background-image: url('graphics/Browne Co.jpg');
	background-position: 40% center !important;
	color: rgb(255, 255, 255);
}

.slider-4 h2 {
	max-width: 600px;
	margin-top: 120px;
	margin-left: 15%;
}

.slider-caption {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: rgba(0, 0, 0, 0.6);
	color: rgb(255, 255, 255);
	font-size: 1.2em;
	font-weight: 300;
	padding: 13px 115px 13px 15px;
}

	.flexslider .item {
		min-height: 650px;
	}
	

	.slider-1 h2 {
		margin-left: -8px;
	}
	
	.slider-1 p {
		max-width: 400px;
	}
	
	.slider-1 .section-image {
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		height: auto;
		width: 100%;
	}
	
	.slider-2 h2 {
		margin-left: -8px;
	}
	
	.slider-2 p {
		max-width: 450px;
	}
	
	.slider-2 .section-image {
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		height: auto;
		width: 100%;
	}




/* GRID/PANELS sections */

#coin-slider {
	height: auto;
	position: relative;
	overflow: hidden;
	width: 100%;
	font-size: 18px;
	background-color: rgb(51, 51, 51);
}

#coin-slider .img-container {
	display: block;
	width: 100%;
	color: rgb(255, 255, 255);
	box-sizing: border-box;
	position: relative;
	overflow: hidden;
}

#coin-slider .img-container > a {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background-size: cover;
	background-position: center center; /* add variables to edit page to control this */
	background-repeat: no-repeat;
	text-decoration: none !important;
}

#coin-slider .img-container > a > *,
#coin-slider td,
#coin-slider th {
	padding: 20px;
}

#coin-slider td,
#coin-slider th {
	display: block;
	min-height: 300px;
}

#section-home-grid .grid-title {
	background-color: rgba(0, 0, 0, 0.6);
	padding: 0 5px;
	text-align: center;
	position: relative;
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
}

#section-home-grid h2,
#section-home-grid h3 {
	margin-top: 3px;
	margin-bottom: 3px;
}

#section-home-grid h2 {
	font-size: 22px;
	font-weight: 300;
	text-align: center;
}

#section-home-grid h3 {
	font-size: 1em;
}

#coin-slider .img-container > a[href] {
	color: rgb(255, 255, 255);
	-webkit-transition: -webkit-transform 1s cubic-bezier(.11, 1.11, .47, .95), z-index 1s;
	transition: transform 1s cubic-bezier(.11, 1.11, .47, .95), z-index 1s;
}

#coin-slider .img-container > a[href]:hover,
#coin-slider .img-container > a[href]:focus {
	-webkit-transform: scale(1.1);
	-ms-transform: scale(1.1);
	transform: scale(1.1);
}

#coin-slider .img-container > a[href]:hover .grid-more-link,
#coin-slider .img-container > a[href]:focus .grid-more-link {
	text-decoration: underline;
}

span.grid-more-link {
	display: inline-block;
}

.grid-more-link .glyphicon {
	font-weight: 600;
	color: rgb(255, 255, 255);
	margin-left: 5px;
	font-size: 0.85em;
}





/* GROW YOUR BUSINESS tri-panel section */

#section-home-tripanel {
	background-color: rgb(51, 51, 51);
	padding: 30px 0 10px;
	color: rgb(255, 255, 255);
}

#section-home-tripanel table {
	margin: 0;
	padding: 0;
	border: 0;
	border-collapse: collapse;
	max-width: 1100px;
	margin-left: auto;
	margin-right: auto;
}

#section-home-tripanel thead,
#section-home-tripanel tfoot {
	display: none;
}

#section-home-tripanel th,
#section-home-tripanel td {
	padding-left: 30px;
	padding-right: 30px;
	vertical-align: top;
}

#section-home-tripanel th {
	padding-top: 0;
	padding-bottom: 20px;
	font-size: 1.6em;
	font-weight: 600;
	color: rgb(35, 200, 216);
}

#section-home-tripanel td {
	padding-top: 15px;
	padding-bottom: 15px;
	display: block;
	margin-bottom: 20px;
}

#section-home-tripanel h2 {
	color: rgb(35, 200, 216);
}

#section-home-tripanel .glyphicon {
	margin-left: 5px;
}

@media all and (min-width: 840px) {
	
	#section-home-tripanel {
		padding: 50px 15px 40px;
	}
	
	#section-home-tripanel thead {
		display: table-header-group;
	}
	
	#section-home-tripanel tfoot {
		display: table-footer-group;
	}
	
	#section-home-tripanel tbody h2,
	#section-home-tripanel tbody a {
		display: none;
	}
	
	#section-home-tripanel td {
		display: table-cell;
		margin-bottom: 0;
	}
	
	#section-home-tripanel th,
	#section-home-tripanel td {
		width: 30%;
		/*padding-left: 1.6%;
		padding-right: 1.6%;*/
	}
	
}





/* GROW YOUR BUSINESS and FINGERTIPS section */

.banner {
	padding: 15px 10px;
	text-align: center;
	background-color: rgb(51, 51, 51);
	color: rgb(35, 200, 216);
}

.banner h2 {
	font-size: 1.3em;
	font-weight: 700;
	margin-top: 0;
	margin-bottom: 5px;
	text-transform: none;
}

#section-home-fingertips {
	color: rgb(35, 200, 216);
}

#section-home-grow {
	color: rgb(109, 206, 34);
}

@media all and (min-width: 480px) {
    
    .banner {
        padding: 50px 30px;
    }
    
    .banner h2 {
        font-size: 2em;
    }
    
}

@media all and (min-width: 768px) {
	
	.banner h2 {
		font-size: 2.7em;
	}
	
}





/* WORK section */

#section-home-work {
	position: relative;
	background-color: rgb(102, 102, 102);
}

#section-home-work:after {
    content: '';
    clear: both;
    display: block;
}

#work-bg1,
#work-bg2 {
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center 75%;
}

#work-bg1 {
	display: none;
	background-image: url('graphics/tower.jpg');
}

#work-bg2 {
	background-image: url('graphics/interior.jpg');
    display: block;
    height: 300px;
}

#section-home-work .section-accent {
	background-color: rgb(255, 255, 255);
	position: relative;
	z-index: 100;
	padding-top: 5px;
	padding-bottom: 5px;
}

#section-home-work .section-interior {
	padding-left: 30px;
	padding-right: 30px;
}

#section-home-work h2 {
	color: rgb(0, 0, 0);
}

#section-home-work .btn {
    margin-top: 10px;
    margin-bottom: 20px;
}

@media all and (min-width: 900px) {
	
	#section-home-work {
		padding-bottom: 225px;
		padding-top: 200px;
	}
    
    #section-home-work h2 {
        color: rgb(82, 92, 92);
    }
	
	#work-bg1,
	#work-bg2 {
        bottom: 0;
        position: absolute;
        top: 0;
	}
	
	#work-bg1 {
		display: block;
		left: 0;
		width: 35%;
	}
	
	#work-bg2 {
		left: auto;
		right: 0;
        height: auto;
		width: 65%;
	}
	
	#section-home-work .section-accent {
		max-width: 55%;
		border-top-right-radius: 12px;
		border-bottom-right-radius: 12px;
        background-color: rgba(186, 186, 186, 0.85);
	}
	
	#section-home-work .section-interior {
		max-width: 550px;
		margin-left: auto;
	}
    
    #section-home-work .btn {
        margin-top: 35px;
        margin-bottom: 0;
        float: left;
    }
	
}





/* PLAY section */

#section-home-play {
	background-color: rgb(29, 48, 65);
    position: relative;
}

#section-home-play .section-image {
	background-image: url('graphics/photo-1522778526097-ce0a22ceb253.jpeg');
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
    height: 250px;
}

#section-home-play .section-accent {
	background-color: rgb(255, 255, 255);
}

#section-home-play .section-interior {
	margin-left: auto;
	margin-right: auto;
	max-width: 1000px;
	padding: 30px 30px 10px;
}

#section-home-play h2 {
	color: rgb(0, 0, 0);
	margin-top: -10px;
	margin-left: -6px;
}

#section-home-play .btn {
	margin-top: 10px;
    margin-bottom: 20px;
}

@media all and (min-width: 768px) {
	
	#section-home-play {
		padding-bottom: 175px;
		padding-top: 275px;
	}
    
    #section-home-play .section-image {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        height: auto;
    }
    
    #section-home-play .section-accent {
        background-color: rgba(53, 181, 191, 0.7);
        position: relative;
        z-index: 10;
    }
	
	#section-home-play .section-interior {
		padding-left: 450px;
	}
	
	#section-home-play h2 {
		margin-left: -420px;
		position: absolute;
        color: rgb(255, 141, 239);
	}
    
    #section-home-play .btn {
        margin-top: 50px;
        margin-bottom: 0;
        float: left;
   }
		
}





/***** DEMO FORM styles *****/





#section-demo-form {
	text-align: center;
	color: rgb(255, 255, 255);
	background-color: rgb(51, 51, 51);
	padding: 1px 30px 30px 30px;
}

#section-demo-form-group {
	position: relative;
}

#section-demo-form:after {
		content: '';
		display: block;
		clear: both;
	}

#section-demo-form h2 {
	text-transform: uppercase;
	color: rgb(35, 200, 216);
	font-weight: 600;
	margin-top: 0;
	margin-bottom: 20px;
	font-size: 1.4em;
}

#section-demo-form h3 {
	font-size: 1.1em;
	line-height: 1.2;
}

#section-demo-form > p {
	font-size: 18px;
	margin-bottom: 10px;
}

#demo_form {
	margin-top: 40px;
	text-align: left;
	border-bottom: solid 1px rgb(151, 151, 151);
	padding-bottom: 35px;
}

#demo_form input {
	font-size: 1em;
	height: auto;
	margin-bottom: 25px;
	border-radius: 0;
    border-color: #fff;
    background-color: #fff;
	color: #000;
}

#demo_form label {
	text-transform: uppercase;
	font-size: 0.7em;
	font-weight: normal;
	color: rgb(35, 200, 216);
}

#demo_form input[type="button"],
#demo_form input[type="submit"],
#demo_form input[type="reset"] {
	background-color: rgb(212, 137, 24);
	border-color: rgb(212, 137, 24);
	border-radius: 8px;
	color: rgb(255, 255, 255) !important;
	font-size: 1em;
	font-weight: 600;
	margin-top: 20px;
	padding: 8px 25px;
	text-transform: uppercase;
	white-space: normal;
}

#demo_form input[type="button"]:hover,
#demo_form input[type="submit"]:hover,
#demo_form input[type="reset"]:hover,
#demo_form input[type="button"]:focus,
#demo_form input[type="submit"]:focus,
#demo_form input[type="reset"]:focus {
	background-color: rgb(109, 206, 34);
	border-color: rgb(109, 206, 34);
}

#demo_form textarea {
	height: 85px;
	border-radius: 0;
	margin-bottom: 10px;
	font-size: 1em;
    border-color: #fff;
    background-color: #fff;
	color: #000;
}

#demo_form .divider {
	width: 100%;
	height: 1px;
	background-color: rgb(151, 151, 151);
	margin-top: 35px;
	margin-bottom: 25px;
}

#sponsor-grid {
	padding-top: 50px;
	max-width: 700px;
	margin-left: auto;
	margin-right: auto;
}

#sponsor-grid a {
	display: block;
	width: 100%;
	margin-bottom: 5%;
}

#sponsor-grid img {
	width: 100%;
}

.google-map {
	width: 100%;
	max-width: 1100px;
	margin-left: auto;
	margin-right: auto;
	height: 200px;
	margin-top: 30px;
	margin-bottom: 5px;
	border: 0;
}

@media all and (min-width: 540px) {
	
	.half-width {
		width: 47%;
	}
	
	.half-width-l {
		float: left;
	}
	.half-width-r {
		float: right;
	}
	
}
	
@media all and (min-width: 768px) {
	
	.half-width {
		width: 47.5%;
	}
	
}

@media all and (min-width: 1000px) {
	
	.half-width {
		width: 48%;
	}
	
	#section-demo-form {
		position: relative;
	}
	
	#demo_form {
		
		border-bottom: none;
		padding-bottom: 0;
		;
		
	}
	
	#demo_form .btn {
		float: left;
	}
	
	#sponsor-grid {
		position: absolute;
		top: 5px;
		padding-top: 0;
		left: 50%;
		right: 0;
		padding-left: 20px;
	}
	
/*
	#section-demo-form .google-map {
		border: 0;
		position: absolute;
		top: 0;
		padding-top: 0;
		left: 50%;
		width: 50%;
		height: 70%;
		padding-left: 30px;
	}
*/
	
	#section-demo-form .google-map {
		height: 400px;
	}
	
/*
	#section-demo-form h5 {
		position: absolute;
		bottom: 0;
		left: 50%;
		right: 0;
		padding-left: 30px;
	}
*/
	
/*
	#section-demo-form-group .logos {
		position: absolute;
		bottom: 0;
		left: 50%;
		right: 0;
		padding-left: 25px;
	}
*/
	
}





/* FOOTER LINKS section */

#section-footer-links {
	background-color: rgb(50, 58, 69);
	color: rgb(187, 187, 187);
	padding: 20px 30px;
	font-size: 0.85em;
}

#section-footer-links .section-interior {
	max-width: 1080px;
	margin-left: auto;
	margin-right: auto;
}

#section-footer-links ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

#section-footer-links li {
	display: block;
}

#section-footer-links a {
	color: inherit;
	display: inline-block;
	text-decoration: none;
}

#section-footer-links a:hover,
#section-footer-links a:focus {
	color: rgb(227, 227, 227);
}

#section-footer-links h3 {
	font-size: 1em;
	font-weight: normal;
	margin-top: 0;
	margin-bottom: 15px;
}

#section-footer-links h3,
#section-footer-links h3 a {
	color: rgb(109, 206, 34);
}

.footer-links-row > div {
	display: block;
	width: 100%;
	padding: 10px;
	margin-bottom: 15px;
}

.logo-group {
	display: inline-block;
	margin-top: 10px;
}

.logos {
	width: 100% !important;
	text-align: center;
	padding-right: 0 !important;
}

.logos a {
	display: inline-block;
	text-decoration: none;
	margin-left: 5px;
	margin-right: 5px;
}

.logos svg {
	display: block;
}

path.dark,
.vi-logos path,
.vi-logos polygon {
	fill: rgb(187, 187, 187);
}

path.light {
	fill: rgb(50, 58, 69);
}

.logos a:hover path.dark,
.vi-logos a:hover path,
.vi-logos a:hover polygon,
.vi-logos a:hover rect,
.logos a:focus path.dark,
.vi-logos a:focus path,
.vi-logos a:focus polygon,
.vi-logos a:focus rect {
	fill: rgb(227, 227, 227);
}

.logo-qcti svg {
	width: 93px;
}

.logo-youtube svg {
	width: 55px;
	height: auto;
}

.logo-facebook svg {
	width: 56px; /*30px;*/
	height: auto;
}

.logo-twitter svg {
	width: 32px;
	position: relative;
	top: 2px;
	height: auto;
	margin-left: 7px;
}

@media all and (min-width: 480px) {
	
	.footer-links-row {
	}
	
	.footer-links-row > div {
		display: inline-block;
		width: 49%;
		vertical-align: top;
	}
	
	.logos {
		width: 100%;
	}
	
}

@media all and (min-width: 768px) {
	
	.footer-links-row > div {
		width: 200px;
		float: left;
	}
	
	.logos {
		text-align: right;
		width: 280px !important;
		float: right !important;
	}
    
    .footer-links-row:after {
        content: '';
        display: block;
        clear: both;
    }
	
}

@media all and (min-width: 900px) {
	
	.logos {
		width: 420px !important;
	}
	
}





/***** Footer styles *****/

footer {
	clear: both;
    background-color: rgb(50, 58, 69);
	color: rgb(187, 187, 187);
	padding: 20px 30px;
	margin-left: auto;
	margin-right: auto;
	max-width: 1366px;
	position: relative;
}

footer:before {
	content: '';
	display: block;
	border-top: solid 1px rgba(187, 187, 187, 0.6);
	position: absolute;
	top: 0;
	left: 25px;
	right: 25px;
}

footer h6 {
	font-weight: normal;
	margin: 2px;
}

footer a {
	color: inherit !important;
}

section {
	position: relative;
}

.offset-anchor {
    position: absolute;
	top: -1px;
	left: 0;
}








/***** CLIENTS PAGE *****/

#clients-featured {
	display: none;
	background-color: rgb(51, 51, 51);
	color: rgb(255, 255, 255);
	font-size: 16px;
	padding: 5px 5px 0;
}

#clients-featured h2 {
	background-color: rgb(255, 255, 255);
	color: rgb(0, 0, 0);
	padding: 12px 10px 12px;
	text-align: center;
	margin: 0 -50px 10px;
}
			
#flexsliderPreload {
	
}

#clients-featured .flexslider {
	background-color: rgb(51, 51, 51);
}

#clients-featured .flexslider .flex-control-nav {
	bottom: 0;
	right: 40%;
	margin-right: -39px;
	width: 30px;
	z-index: 500;
	text-align: right;
	font-size: 0;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

#clients-featured .flexslider .flex-control-paging li {
	width: 22px;
	height: 22px;
	margin: 0;
}

#clients-featured .slides li {
	position: relative;
}

.featured-text {
	width: 40%;
	margin-left: auto;
	padding: 0 50px;
	height: 300px;
	overflow: hidden;
}

.featured-images {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 40%;
}

.featured-images div {
	height: 100%;
	width: 49%;
	width: calc(50% - 5px);
	margin-right: 5px;
	float: left;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}

#clients-featured .client-grid-website {
	position: static;
	float: right;
}



#clients-nav {
	position: relative;
	height: 50px;
	padding: 0 50px 0;
	cursor: default;
	overflow: hidden;
    background-color: rgb(51, 51, 51);
}

#clients-nav-before,
#clients-nav-after {
	position: absolute;
	top: 0;
	bottom: 0;
	width: 50px;
	background-color: transparent;
	color: rgb(151, 151, 151);
	border: none;
	outline: none;
}

#clients-nav-before {
	left: 0;
}

#clients-nav-after {
	right: 0;
}

#clients-nav ul {
	overflow-y: hidden;
	overflow-x: scroll;
	white-space: nowrap;
	list-style: none;
	padding: 0 10px 20px 0;
	margin-bottom: -20px;
	text-align: center;
	-webkit-overflow-scrolling: touch;
}

#clients-nav li {
	display: inline-block;
}

#clients-nav li a {
	display: block;
	padding: 15px 12px;
	text-transform: uppercase;
	font-weight: 600;
	/*color: rgb(255, 255, 255); */
	text-decoration: none;
}

#clients-nav li a:hover,
#clients-nav li a:focus,
.clientSectionActive {
	/* color: rgb(109, 206, 34) !important; */
	text-decoration: underline !important;
}





#clients-grid {
	background-color: rgb(255, 255, 255);
	padding: 10px;
}

#clients-grid iframe {
	display: block;
	width: 100%;
	border: 0;
}

.clients-section {
	list-style: none;
	padding: 0;
	display: block;
	margin-left: auto;
	margin-right: auto;
	padding-bottom: 5px;
}

.clients-section li {
	display: block;
	width: 100;
	padding-top: 50%;
	position: relative;
	margin-bottom: 2.5%;
}

.client-grid-link {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}

.clients-section-title {
	font-weight: 600;
	clear: both;
	margin-top: 0;
	font-size: 1.8em;
	margin-bottom: 15px;
	padding: 10px 17px 10px 0;
}

.client-grid-title {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: rgba(0, 0, 0, 0.6);
	color: rgb(255, 255, 255);
	padding: 8px 100px 8px 10px;
}

.client-grid-link:hover .client-grid-title,
.client-grid-link:focus .client-grid-title {
	text-decoration: underline;
}

.client-grid-website {
	position: absolute;
	bottom: 4px;
	right: 4px;
	width: 70px;
	text-align: center;
	text-decoration: none;
	background-color: rgb(212, 137, 24);
	border-radius: 8px;
	padding: 3px 8px;
	color: rgb(255, 255, 255) !important;	
}

.loading-box,
#flexsliderPreload {
	display: none;
	padding-top: 100px;
    height: 300px;
	background-color: rgb(255, 255, 255);
}
			
#flexsliderPreload {
	display: block;
}

.spinner {
	margin: 0 auto;
	border-bottom: 5px solid rgb(215, 215, 215);
	border-left: 5px solid rgb(215, 215, 215);
	border-right: 5px solid rgb(109, 206, 34);
	border-top: 5px solid rgb(109, 206, 34);
	border-radius: 100%;
	height: 80px;
	width: 80px;
	-webkit-animation: spin .6s infinite linear;
	animation: spin .6s infinite linear;
	background-color: rgb(255, 255, 255);
}

@keyframes "spin" {
	from {
		-webkit-transform: rotate(0deg);
		-ms-transform: rotate(0deg);
		transform: rotate(0deg);
	} to {
		-webkit-transform: rotate(359deg);
		-ms-transform: rotate(359deg);
		transform: rotate(359deg);
	}
}

@-webkit-keyframes "spin" {
	from {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	} to {
		-webkit-transform: rotate(359deg);
		transform: rotate(359deg);
	}	
}

@media all and (min-width: 600px) {
	
	.clients-section {
		padding-left: 5%;
	}
	
	.clients-section-title {
		padding-left: 5%;
	}
	
	.clients-section li {
		width: 45%;
		float: left;
		margin-bottom: 5%;
		margin-right: 5%;
		padding-top: 25%;
	}
	
	.clients-section li:nth-child(even) {
		margin-right: 0;
	}
}


@media all and (min-width: 900px) {
	
	.clients-section {
		padding-left: 2%;
		padding-bottom: 40px;
	}
	
	.clients-section-title {
		padding-left: 2%;
	}
	
	#clients-featured {
		display: block;
	}
	
	.clients-section li {
		width: 31%;
		margin-bottom: 2%;
		margin-right: 2% !important;
		padding-top: 18%;
	}
	
	.clients-section li:nth-child(3n) {
		margin-right: 0 !important;
	}
	
}

@media all and (max-width: 767px) {
	
	.responsiveTable {
		display: block;
	}
	
	.responsiveTable thead,
	.responsiveTable tbody {
		display: block;
	}
	
	.responsiveTable tr {
		display: block;
		background-color: rgb(100, 100, 100);
		color: #fff;
		padding: 5px;
	}
	
	.responsiveTable .gridAltItems {
		background-color: #fff;
		color: #000;
	}
	
	.responsiveTable td,
	.responsiveTable th {
		display: block;
		padding: 0;
		margin-bottom: 5px;
	}
	
	.responsiveTable td[align="center"] {
		text-align: left;
	}
	
	.responsiveTable .gridTitle {
		display: none;
	}
	
	.responsiveTable .imageColumn {
		display: none;
	}
	
	.form-inline * {
		margin-bottom: 5px;
	}
	
	#txtSearch {
		max-width: 205px;
		display: inline-block;
	}
	
}





/*****  ABOUT page styles  *****/




#about section h2 {
	color: rgb(35, 200, 216);
}

#about .section-image {
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	height: 300px;
}







#section-about-us {
	position: relative;
}

#section-about-us .section-image {
	background-image: url('graphics/about/Dollarphotoclub_77570930.jpg');
}

#section-about-us .section-interior {
	background-color: rgb(255, 255, 255);
	padding: 10px 15px 20px;
}

.section-image {
	display: block;
}





#section-about-vision {
	position: relative;
}

#section-about-vision .section-image {
	background-image: url('graphics/about/Dollarphotoclub_73407750.jpg');
}

#section-about-vision .section-interior {
	background-color: rgb(255, 255, 255);
	padding: 10px 15px 20px;
}

#section-about-vision ul {
	padding-left: 23px;
}

#section-about-vision li {
	margin-bottom: 15px;
}





#section-about-offer {
	background-color: rgb(51, 51, 51);
	text-align: center;
	padding: 30px 30px 35px;
}

#section-about-offer h2 {
	font-size: 1em;
	font-weight: 600;
	margin: 0;
}

#section-about-offer .btn {
	width: 220px;
	display: block;
	margin-left: auto;
	margin-right: auto;
}







#section-about-products {
	background-color: rgb(255, 255, 255);
	padding: 10px 15px 20px;
}

#section-about-products .section-interior {
	max-width: 1000px;
	margin-left: auto;
	margin-right: auto;
	
}

#section-about-products h2 {
	font-size: 2.5em;
	margin-bottom: 30px;
}





#section-about-features {
	background-color: rgb(51, 51, 51);
	padding: 50px 15px 40px;
	color: rgb(255, 255, 255);
}

#section-about-features h2 {
	text-transform: uppercase;
	text-align: center;
	font-weight: 600;
	font-size: 1.3em;
	margin-top: 0;
}

#section-about-features h3 {
	color: rgb(109, 206, 34);
	font-size: 1em;
	margin-top: 0;
	margin-bottom: 15px;
}

#section-about-features .btn {
	width: 220px;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

#section-about-features ul {
	list-style: none;
	padding: 0;
	margin-top: 50px;
	margin-bottom: 60px;
	max-width: 1000px;
	margin-left: auto;
	margin-right: auto;
}

#section-about-features li {
	padding-left: 60px;
	min-height: 45px;
	background-size: 50px;
	background-repeat: no-repeat;
	background-position: top left;
	margin-top: 0;
	margin-bottom: 0;
}

#section-about-features p {
	display: none;
}



#section-about-technology {
	position: relative;
}

#section-about-technology .section-image {
	background-image: url('graphics/about/Dollarphotoclub_81516358.jpg');
}

#section-about-technology .section-interior {
	background-color: rgb(255, 255, 255);
	padding: 10px 15px 20px;
}

@media all and (min-width: 768px) {
	
	#about .section-image {
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		height: auto;
	}
	
	
	#section-about-us {
		padding-top: 100px;
		padding-bottom: 120px;
	}
	
	#section-about-us .section-interior {
		background-color: rgba(255, 255, 255, 0.85);
		max-width: 450px;
		border-radius: 8px;
		margin-left: 13%;
		position: relative;
		z-index: 10;
	}
	
	
	#section-about-vision {
		padding-top: 75px;
		padding-bottom: 100px;
	}
	
	#section-about-vision .section-interior {
		background-color: rgba(255, 255, 255, 0.85);
		max-width: 500px;
		border-radius: 8px;
		margin-left: auto;
		margin-right: 11%;
		position: relative;
		z-index: 10;
	}
	
	#section-about-products {
		padding: 40px 30px;
	}
	
	#section-about-features li {
		padding-left: 75px;
		min-height: 65px;
		background-size: 65px;
		margin-bottom: 35px;
	}
	
	#section-about-features p {
		display: block;
	}
	
	
	#section-about-technology {
		padding-top: 50px;
		padding-bottom: 100px;
	}
	
	#section-about-technology .section-interior {
		background-color: rgba(255, 255, 255, 0.85);
		max-width: 660px;
		border-radius: 8px;
		margin-left: auto;
		margin-right: 11%;
		position: relative;
		z-index: 10;
	}
	
}


/****** OLD QCTI CLASSES ******/

.gridTitle {
	font-size: 1.1em;
	height: 45px;
	color: rgb(255, 255, 255);
	background-color: rgb(51, 51, 51);
}

.gridstyle {
}

.gridAltItems {
	color: rgb(255, 255, 255);
	background-color: rgba(0, 0, 0, 0.6);
}

.normalText {
	font-size: 0.9em;
	font-weight: 400;
	font-family: Arial;
}

.normalHeading {
	padding-top: 0;
	padding-bottom: 20px;
	font-size: 1.6em;
	font-weight: 600;
	color: rgb(35, 200, 216);
}

.normalCtrl {
	font-size: 1em;
	height: auto;
	border-radius: 0;
    border-color: #d2d2d2;
    background-color: #fff;
	color: #000;
}

.normalBtn {
	background-color: rgb(212, 137, 24);
	border-radius: 8px;
	color: rgb(255, 255, 255) !important;
	font-size: 1em;
	font-weight: 600;
	padding: 8px 25px;
	text-transform: uppercase;
	white-space: normal;
}

.normalBtn:hover,
.normalBtn:focus {
	background-color: rgb(109, 206, 34);
}

.arrow-up {
	width: 0; 
	height: 0; 
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-bottom: 5px solid rgb(109, 206, 34);
}

.arrow-down {
	width: 0; 
	height: 0; 
	border-left: 20px solid transparent;
	border-right: 20px solid transparent;
	border-top: 20px solid rgb(109, 206, 34);
}

.Menubar {
	color: rgb(153, 153, 153);
	text-decoration: none;
	margin-top: 3px;
	font-size: 0.9em;
	font-weight: 700;
}

.Menubar:hover {
	color: rgb(109, 206, 34);
	text-decoration: none;
	margin-top: 3px;
	font-size: 0.9em;
	font-weight: 700;
}