@charset "utf-8";
/* CSS Document */

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section { 
    display:block;
}
nav ul {
    list-style:none;
}
section ul, section ol {
	margin-left: 40px;
}
img {
	max-width: 100%;
}
blockquote, q {
    quotes:none;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}
a {
	color: #08c;
    margin: 0;
    padding: 0;
    vertical-align: baseline;
    background: transparent;
	text-decoration: none;
	transition: ease-in-out 0.3s;
	-moz-transition: ease-in-out 0.3s;
	-webkit-transition: ease-in-out 0.3s;
	-o-transition: ease-in-out 0.3s;
}
a:hover {
	color: #AAAAAA !important;
}
a:after {
	transition: ease-in-out 0.3s;
	-moz-transition: ease-in-out 0.3s;
	-webkit-transition: ease-in-out 0.3s;
	-o-transition: ease-in-out 0.3s;
}
em {
	font-style: italic;
}
ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none;
}
mark {
    background-color:#ff9;
    color:#000; 
    font-style:italic;
    font-weight:bold;
}
del {
    text-decoration: line-through;
}
abbr[title], dfn[title] {
    border-bottom:1px dotted;
    cursor:help;
}
table {
    border-collapse:collapse;
    border-spacing:0;
}
hr {
    display:block;
    height:1px;
    border:0;   
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}
input, select {
    vertical-align:middle;
}
time {
	color: #AAAAAA;
	display: block;
	margin-bottom: 14px;
	font-size: 90%;
}
figure img {
	display: block;
	margin: 0 auto !important;
}
::selection {
  background: #C6BFD2;
}
::-moz-selection {
  background: #C6BFD2;
}
body {
	color: #888888;
	font-family: 'museo-sans-rounded', 'roboto', Arial, sans-serif;
	-webkit-font-smoothing: subpixel-antialiased;
	overflow-x: hidden;
	font-size: 120%;
	font-weight: 300;
}
.section-content h1, .section-content h2, .section-content h3 {
	text-align: left;
	margin-top: 48px;
	margin-bottom: 36px;
}
h1, h2, h3, h4, h5, h6 {
	color: #333333;
}
h1 {
	font-size: 500%;
	font-weight: 100;
	letter-spacing: -5pt;
}
h2 {
	font-size: 180%;
	font-weight: 100;
	margin-bottom: 18px;
}
section h2 {
	font-size: 340%;
	letter-spacing: -1.4pt;
}
h3 {
	font-size: 150%;
	font-weight: 300;
	margin-top: 18px;
	margin-bottom: 18px;
}
section h3 {
	font-size: 300%;
	text-align: center;
}
h4 {
	font-size: 120%;
	font-weight: 500;
	margin-top: 18px;
	margin-bottom: 12px;
}
p {
	line-height: 170%;
	margin-bottom: 18px;
}

/* inputs */
input, textarea {
	clear: both;
	padding: 12px 16px;
	border: 1px solid #DDDDDD;
	float: left;
	font-family: inherit;
	font-size: inherit;
	-webkit-appearance: none;
	border-radius: 0;
	-moz-border-radius: 0;
	-webkit-border-radius: 0;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	transition: ease-in-out 0.3s;
	-moz-transition: ease-in-out 0.3s;
	-webkit-transition: ease-in-out 0.3s;
	-o-transition: ease-in-out 0.3s;
	width: 100%;
}
input[type="radio"] {
	-webkit-appearance: radio;
	width: auto;
}
input[type="checkbox"] {
	-webkit-appearance: checkbox;
	width: auto;
}
input[type="submit"] {
	background: #049372;
	border: none;
	color: #FFFFFF;
	margin: 14px 0;
}
input[type="submit"]:hover {
	background: #05B48C;
}
label {
	clear: both;
	display: block;
	float: left;
	margin-top: 24px;
	margin-bottom: 14px;
	text-transform: uppercase;
	font-weight: 700;
}
span.req {
	clear: none;
	color: #D24D57;
}
.radio-btn {
	clear: both;
	display: block;
	float: left;
	margin-bottom: 10px;
	width: auto;
}
form div.item {
	clear: both;
	display: block;
}
form div.item:before, form div.item:after {
	content: "";
	clear: both;
	display: block;
}
form div.item-padding {
	padding: 14px 0;
}
	/* adjust 'remember me' checkbox */
	label[for="RememberMe"] {
		clear: none;
		margin: 0;
	}
.under-form {
	border-top: 1px solid #F2F2F2;
	display: block;
	padding: 24px 0;
}

/* header */
.header {
	background-color: rgba(0,0,0,0.60);
	overflow: hidden;
	z-index: 100000;
	position: relative;
	font-family: 'museo-sans-rounded', Arial, sans-serif;
}
div#vistaweb-logo {
	float: left;
	padding: 10px 0 4px 0;
}
div#vistaweb-logo a {
	background: url(/images/logo-scalable.svg) no-repeat;
	display: block;
	content: "";
	width: 210px;
	height: 28px;
}
div#vistaweb-menu, div#responsive-menu {
	font-weight: 300;
	float: right;
}
div#vistaweb-menu li {
	display: inline-block;
	margin-right: 36px;
	padding: 11px 0;
}
div#vistaweb-menu li:last-of-type {
	margin-right: 0;
}
div#vistaweb-menu li a {
	color: #FFFFFF;
}
div#vistaweb-menu li a:hover {
	color: #AAAAAA;
}
#responsive-menu-icon {
	background: url(../images/responsive-menu.svg) no-repeat;
	background-size: auto;
	content: "";
	display: block;
	height: 20px;
	width: 24px;
	margin: 12px 0;
}
div.subtle-menu-bar {
	background: #F2F2F2;
	color: #666666;
	padding: 18px 0;
	font-size: 90%;
}

/* page titles */
div.dynamic {
	min-height: 600px;
	text-align: center;
}
div.dynamic h1 {
	color: #FFFFFF;
	text-transform: lowercase;
}
div#dynamic-home {
	color: #FFF;
	background: url(/images/background-1.jpg);
	background-size: cover;
}
div#dynamic-home h1 {
	position: absolute;
	top: 25%;
	left: 0;
	right: 0;
}
div#dynamic-home h1 span {
	font-size: 350%;
	letter-spacing: -16pt;
}
div#dynamic-wd {
	background: #473d56;
	color: #FFFFFF;
}
div#dynamic-bc {
	background: #222222;
	color: #FFFFFF;
}
div.vistaweb-title a {
	color: #83719E;
	display: block;
	margin-top: 12px;
}
div#dynamic-p {
	background: #EEEEEE;
}
div#dynamic-p h1 {
	color: #333333;
}
div.dynamic-portfolio {
	background-size: 100% !important;
	background-repeat: no-repeat !important;
}
div.dynamic-portfolio h1 {
	margin-top: 100px;
}
div.dynamic-portfolio a.view-casestudy {
	margin-bottom: 64px;
}
div#dynamic-cirencester-christmas-trees {
	background: url(/images/cirencester-christmas-trees-background.jpg);
	color: #FFFFFF;
}
div#dynamic-cirencester-christmas-trees h1 {
	text-transform: none;
}
div.vistaweb-title {
	text-align: center;
}
.intro {
	font-size: 170%;
	font-weight: 300;
	text-align: center;
	margin: 48px 0;
	line-height: 150%;
}
div#dynamic-wd h1, div#dynamic-p h1, div#dynamic-b h1, div#dynamic-bc h1 {
	padding: 48px 0;
}

/* backgrounds */
.bg-grey {
	background: #F2F2F2;
}

/* homepage */

.service-heading {
	font-size: 140%;
	text-align: left;
	text-transform: lowercase;
}
.service-heading:before {
	content: "";
	display: block;
	float: left;
	width: 8px;
	height: 28px;
	margin-right: 24px;
}
#sh-purple:before {
	background: #473D56;
}
#sh-yellow:before {
	background: #F4B350;
}
#sh-red:before {
	background: #D24D57;
}
#sh-blue:before {
	background: #4183D7;
}
#sh-green:before {
	background: #049372;
}
#sh-black:before {
	background: #333333;
}
.c-green {
	color: #049372;
}
.c-red {
	color: #d24d57;
}
.c-blue {
	color: #4183d7;
}
.c-purple {
	color: #473d56;
}
.c-grey {
	color: #777777 !important;
}

/* links */
a.read-more {
	display: inline-block;
	line-height: 175%;
	margin-top: 18px;
}
a.read-more:after {
	content: "";
	background: url(/images/arrow-right.png);
	display: block;
	float: right;
	margin: 12px 0 0 12px;
	height: 14px;
	width: 8px;
}
a.read-more:hover:after {
	background: url(/images/arrow-right-hover.png);
}

/* portfolio */
div.portfolio-box {
	text-align: center;
}
div.portfolio-box span {
	display: block;
	margin-bottom: 12px;
}
div.portfolio-box em {
	color: #777777;
	font-size: 80%;
}
div.companybox {
	display: block;
	text-align: center;
	width: 100%;
	padding: 60px 0;
	margin-bottom: 24px;
}
div.companybox img {
	margin: 0 auto;
	width: auto;
}
#cb-ccc {
	background: #9F3142;
}
a.view-casestudy {
	background-color: #333333;
	background-image: url(../images/arrow-link.png);
	background-repeat: no-repeat;
	background-position: right center;
	color: #FFFFFF;
	display: inline-block;
	padding: 12px 48px 10px 24px;
}
a.view-casestudy:hover {
	background-color: #0088cc;
}
ul.project-requirements {
	text-align: center;
	list-style: none;
	margin: 0 auto;
	padding: 48px 0;
}
ul.project-requirements li {
	display: inline-block;
	background: #333333;
	color: #FFFFFF;
	padding: 8px 24px;
	margin-bottom: 6px;
}
ul.color-palette {
	text-align: center;
	margin: 0 auto;
}
ul.color-palette li {
	display: inline-block;
	text-align: center;
	margin-right: 48px;
	margin-bottom: 14px;
}
ul.color-palette li:last-of-type {
	margin-right: 0;
}
div.dot {
	border-radius: 100%;
	-moz-border-radius: 100%;
	-webkit-border-radius: 100%;
	width: 100px;
	height: 100px;
	margin-bottom: 24px;
}

/* blog */
div.captchaimg {
	clear: both;
	margin-bottom: 14px;
}
div.blog-post h3 {
	margin-top: 0;
}

/* individual properties */
.bg-grey {
	background-color: #F2F2F2;
}
section#g0-work {
	background: #F2F2F2;
}
section#g0-contact {
	background: #F2F2F2;
	text-align: center;
}
#wd-init1 {
	background: #F2F2F2 url(/images/meeting-table.jpg) no-repeat;
	background-size: cover;
}
#wd-init2 {
	background: url(/images/fireworks.jpg) no-repeat;
	background-size: cover;
}
#wd-init3 {
	background: #F2F2F2 url(/images/content-management-system.jpg) no-repeat center;
	background-size: cover;
}
#wd-init4 {
	background: url(/images/responsive.jpg) no-repeat center;
	background-size: cover;
}
section#wd-responsive-breakdown {
	background: #F2F2F2;
	text-align: center;
}
#wd-init5 {
	background: url(/images/search-engine-optimisation.jpg) no-repeat;
	background-size: cover;
}
section#wd-site-select {
	text-align: center;
}
#wd-init6 {
	background: #F2F2F2 url(/images/support.jpg) no-repeat;
	background-size: cover;
}
#bc-online-store {
	color: #FFFFFF;
	background: #16A085;
}
#bc-online-store h2 {
	color: #36D7B7;
}
#bc-crm h2 {
	color: #16A085;
}
#bc-email-marketing {
	background: #446CB3;
	color: #FFFFFF;
}
#bc-email-marketing h2 {
	color: #89C4F4;
}
#bc-modules h2 {
	color: #446CB3;
}
#bc-analytics {
	background: #D24D57;
	color: #FFFFFF;
}
#bc-analytics h2 {
	color: #F1A9A0;
}

/* footer */
.footer {
	background: #F2F2F2;
	padding: 24px 0;
	width: 100%;
	font-size: 90%;
	font-weight: 300;
	font-family: 'museo-sans-rounded', Arial, sans-serif;
}
div#vistaweb-footer-menu {
	margin-bottom: 10px;
}
div#vistaweb-footer-menu li {
	display: inline-block;
	margin-right: 24px;
}
a#scroll-to-top {
	display: inline-block;
	float: right;
}

/* ARTICLES */
article h3 {
	font-size: 160%;
	text-align: left;
}

	/* BLOGS */
	.tier-full {
		box-sizing: border-box;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		display: block;
		background: #F2F2F2;
		float: left;
		width: 29%;
		margin-top: 4%;
		margin-right: 4%;
		margin-bottom: 4%;
		padding: 24px 36px;
	}

/* GRID */
.full-40, .full-60 {
	box-sizing: border-box;
	float: left;
}
.full-40 {
	width: 40%;
	padding: 120px 7%;
}
.full-60 {
	width: 60%;
}
.full-offset-40 {
	margin-left: 60%;
}

	/* FLOAT THE DIVS EITHER SIDE OF BROWSER */
	.full-left {
		float: left;
	}
	.full-right {
		float: right;
	}
	
.large-6 {
	width: 50%;
}
.large-offset-6 {
	margin-left: 50%;
}

/* ICONS */
.icon {
	background-repeat: no-repeat;
	display: block;
	height: 80px;
	width: 80px;
	margin-bottom: 24px;
}
.icon-business-catalyst-svgl {
	background: url(../images/icons/icon-business-catalyst-l.svg);
}
.icon-call {
	background: url(../images/icons/icon-call.png);
}
.icon-cms {
	background: url(../images/icons/icon-cms.png);
}
.icon-configurator {
	background: url(../images/icons/icon-configurator.png);
}
.icon-contact {
	background: url(../images/icons/icon-contact.png);
}
.icon-email {
	background: url(../images/icons/icon-email.png);
}
.icon-logo {
	background: url(../images/logo-large.svg) no-repeat center;
}
.icon-logo-black {
	background: url(../images/logo-large-black.svg) no-repeat center;
}
.icon-responsive {
	background: url(../images/icons/icon-responsive.png);
}
.icon-seo {
	background: url(../images/icons/icon-seo.png);
}
.icon-support {
	background: url(../images/icons/icon-support.png);
}
.icon-website-design {
	background: url(../images/icons/icon-website-design.svg);
}
.icon-website-design-svgl {
	background: url(../images/icons/icon-website-design-l.svg);
}

.icon-large {
	display: block;
	height: 300px;
	background-repeat: no-repeat;
	background-position: center;
}

.verticalcenter {
	margin: auto;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	height: 460px;
}
.minified:before {
	background: #16A085;
	content: "";
	display: block;
	margin-bottom: 14px;
	height: 2px;
	width: 100%;
}
.minified {
	color: #16A085;
	display: block;
	float: left;
	margin-right: 48px;
	margin-top: 48px;
	font-weight: 100;
}
.minified span {
	display: block;
	clear: both;
	font-size: 300%;
}