/*
Theme Name: Hosting UK 2015
Theme URI: http://underscores.me/
Author: Underscores.me
Author URI: http://underscores.me/
Description: Description
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: hosting-uk-2015
Tags:

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

Hosting UK 2015 is based on Underscores http://underscores.me/, (C) 2012-2015 Automattic, Inc.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/
*/

/*
COLOURS:

BORDERS: #ccc
TEXT: #333
EMPHASIS TEXT: #000
LINKS: #f48028
AUTHOR: Neil Milliken


/* =============================================================================
   HTML5 display definitions
   ========================================================================== */

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }


/* =============================================================================
   Base
   ========================================================================== */

/*
 * 1. Correct text resizing oddly in IE6/7 when body font-size is set using em units
 * 2. Prevent iOS text size adjust on device orientation change, without disabling user zoom: h5bp.com/g
 */

html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%;  }

html, button, input, select, textarea { font-family: open sans; color: #222; }

body { margin: 0; font-size:62.5%; line-height: 1.4; background:#f3f3f5 }

/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection declarations have to be separate
 * Also: hot pink! (or customize the background color to match your design)
 */

::-moz-selection { background: #de5636; color: #fff; text-shadow: none; }
::selection { background: #de5636; color: #fff; text-shadow: none; }

* {
   -moz-box-sizing:    border-box;   /* Firefox 1, probably can drop this */
   -webkit-box-sizing: border-box;   /* Safari 3-4, also probably droppable */
    box-sizing:        border-box;   /* Everything else */
}

p{font-size:1.3em; line-height:1.6em; margin:0 0 1em 0;}

h1{font-size:3em; line-height:1em; color:#000; font-weight:normal;}
h2{font-size:2.5em; line-height:1em; color:#000; font-weight:normal;}
h3{font-size:2em; line-height:1em; color:#000; font-weight:normal;}

p.emph{font-size:1.5em; color:#000;}

ul { list-style: none}
ul li, ol li{font-size:1.3em; line-height:1.6em;}
#main ul li, #main ol li{color:#575757}
#main ul li span, #main ol li span{color:#333;}

ol ul{margin-bottom:0;}
ol{list-style-type:lower-alpha;}

.clear{clear:both;}

.block{max-width:1008px; margin:0 auto;}
.container{width:90%; margin:0 auto;}

.m10-0{margin:10px 0; overflow:auto;}
.m20-0{margin:20px 0; overflow:auto;}
.m30-0{margin:30px 0; overflow:auto;}
.m40-0{margin:40px 0; overflow:auto;}
.p10-0{padding:10px 0; overflow:auto;}
.p20-0{padding:20px 0; overflow:auto;}
.p30-0{padding:30px 0; overflow:auto;}
.p40-0{padding:40px 0; overflow:auto;}
.p50-0{padding:50px 0; overflow:auto;}
.no-padding-bottom {padding-bottom: 0!important;}
.no-top-padding { padding-top: 0!important}
.no-side-padding { padding-left: 0!important; padding-right: 0!important}

.w10{width:10%;}
.w20{width:20%;}
.w30{width:30%;}
.w40{width:40%;}
.w50{width:50%;}
.w60{width:60%;}
.w70{width:70%;}
.w80{width:80%;}
.w90{width:90%;}
.w100{width:100%;}

.no-margin{margin:0;}
.no-padding{padding:0;}
.top-margin{margin-top:0;}
.bottom-margin{margin-bottom:0;}
.right-margin{margin-right:0;}
.left-margin{margin-left:0;}
.top-padding{padding-top:0;}
.bottom-padding{padding-bottom:0;}
.right-padding{padding-right:0;}
.left-padding{padding-left:0;}

.half{width:50%;}
.left{float:left;}
.right{float:right;}

.align-right{text-align:right;}
.align-left{text-align:left;}
.align-center{text-align:center;}

.img-bdr{padding:3px; border:1px solid #000;}

img { max-width: 100%;}

header {
	clear:both; 
	background:#fff;
}

p.callus /* ------- fake button style for call us text ------- */
{
 background: none repeat scroll 0 0 #dce5f0;
    border: medium none;
    border-radius: 4px;
    color: #373737;
    display: block;
    font-size: 1.8em;
    font-weight: 600;
    margin-bottom: 16px;
    padding: 10px 22px;
    text-align: center!important;
    text-decoration: none;
    transition-duration: 0.3s;
    transition-property: all;
    transition-timing-function: ease-in-out;
    text-transform: uppercase;
}

a.btn, .btn {
	background: #de5636;
	padding:10px 22px;
	font-size:1.7em;
	color:#fff;
	text-decoration:none;
	border-radius: 4px;
	display:block;
	text-align:center;
	-webkit-transition-property:all; 
	-webkit-transition-duration: 0.3s;  
	-moz-transition-property: all; 
	-moz-transition-duration: 0.3s;  
	-o-transition-property: all; 
	-o-transition-duration: 0.3s; 
	transition-property: all; 
	transition-duration: 0.3s; 
	transition-timing-function: ease-in-out;
	border: none;
	margin-bottom:16px;
} 

a.btn:hover, .btn:hover {
	background: #f28970;
	color:#fff;
	text-decoration:none;
} 

aside {
	clear:both;
	padding:0px 0px;
}

.clearfix:before,
.clearfix:after {
    content: " ";
    display: table;
}
.clearfix:after {
    clear: both;
}
/* For IE 6/7 only */
.clearfix {
    *zoom: 1;
}

.desktop-only {
	display: none
}


.grey-back {
    background: #EAEAEA!important;
    overflow: auto;
}

@media only screen and (min-width: 1024px) {

.grey-back img {
    max-width: 115%;
}
    
iframe { 
    max-width: 600px;
    margin: 0 auto;
    display: block;
}
}


#main .contents .blue-back {
    background: #0072c6;
    overflow: auto;
    color: #fff!important;
}

#main .contents .blue-back p { 
    padding: 0 80px 40px;
    text-align: center;
    color: #fff;
}

.alternative {
    background: rgba(0,0,0,0.07);
    padding: 12px;
    font-size: 1.2em;
    text-align: left;
}

@media only screen and (min-width: 768px) {
a.btn {
		display: inline-block;
		margin-right:16px;
	}
	.mobile-only {
		display: none!important;
	}
	.desktop-only {
	display: block;
}

}
@media only screen and (min-width: 830px) {
    header {
    top: -100px;
    width: 100%;
    }
}
@media only screen and (min-width: 1024px) {
        header {
    top: -134px;

    }
	.container{
		width:100%;
	}
}

.center-image {
    margin: 10px auto;
    display: block;
}


/* =============================================================================
   Links
   ========================================================================== */

a { color: #de5636; text-decoration:none; }
a:visited {}
a:hover {text-decoration:underline;}


/* =============================================================================
   Typography
   ========================================================================== */

abbr[title] { border-bottom: 1px dotted; }
b, strong { font-weight: 600;}
blockquote {font-size:1.3em; line-height:1.5em; margin:0 0 1.3em 0;}
dfn { font-style: italic; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ddd; margin: 0; padding: 0; }
ins { background: #ff9; color: #000; text-decoration: none; }
mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }
/* Redeclare monospace font family: h5bp.com/j */
pre, code, kbd, samp { font-family: monospace, serif; _font-family: 'courier new', monospace; font-size: 1.3em; }
/* Improve readability of pre-formatted text in all browsers */
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }
q { quotes: none; }
q:before, q:after { content: ""; content: none; }
small { font-size: 85%; }
/* Position subscript and superscript content without affecting line-height: h5bp.com/k */
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }


/* =============================================================================
   Lists
   ========================================================================== */

ul, ol { margin:0; padding: 0 0 0 20px; }
dd { margin: 0 0 0 40px; }
nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }


/* =============================================================================
   Embedded content
   ========================================================================== */

/*
 * 1. Improve image quality when scaled in IE7: h5bp.com/d
 * 2. Remove the gap between images and borders on image containers: h5bp.com/i/440
 */
img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }

/*
 * Correct overflow not hidden in IE9
 */
svg:not(:root) { overflow: hidden; }


/* =============================================================================
   Figures
   ========================================================================== */

figure { margin: 0; }


/* =============================================================================
   Forms
   ========================================================================== */

form { margin: 0; }
fieldset { border: 0; margin: 0; padding: 0; }

/* Indicate that 'label' will shift focus to the associated form element */
label { cursor: pointer; }

/*
 * 1. Correct color not inheriting in IE6/7/8/9
 * 2. Correct alignment displayed oddly in IE6/7
 */

legend { border: 0; *margin-left: -7px; padding: 0; white-space: normal; }

/*
 * 1. Correct font-size not inheriting in all browsers
 * 2. Remove margins in FF3/4 S5 Chrome
 * 3. Define consistent vertical alignment display in all browsers
 */

button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }

/*
 * 1. Define line-height as normal to match FF3/4 (set using !important in the UA stylesheet)
 */

button, input { line-height: normal; }

/*
 * 1. Display hand cursor for clickable form elements
 * 2. Allow styling of clickable form elements in iOS
 * 3. Correct inner spacing displayed oddly in IE7 (doesn't effect IE6)
 */

button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; *overflow: visible; }

/*
 * Re-set default cursor for disabled elements
 */

button[disabled], input[disabled] { cursor: default; }

/*
 * Consistent box sizing and appearance
 */

input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; *width: 13px; *height: 13px; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; }

/*
 * Remove inner padding and border in FF3/4: h5bp.com/l
 */

button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }

/*
 * 1. Remove default vertical scrollbar in IE6/7/8/9
 * 2. Allow only vertical resizing
 */

textarea { overflow: auto; vertical-align: top; resize: vertical; }

/* Colors for form validity */
input:valid, textarea:valid {  }
input:invalid, textarea:invalid { }



.quform textarea { 
    overflow: auto; 
    vertical-align: top; 
    resize: vertical; 
    width: 100%;
    display: block;
}

.quform input[type="text"],
.quform input[type="email"],
.quform input[type="tel"],
.quform textarea,
.quform select,
.quform input
{ 
    display: block;
    width: 100%;
    padding: 10px;
     margin-top: 14px;
}

.quform input[type="text"],
.quform input[type="email"],
.quform input[type="tel"],
.quform select,
.quform textarea
{ 
    border: none;
    background: #efefef;
    font-size: 1.2em;
}

.quform label {
    margin-top: 14px;
}

/* =============================================================================
   Chrome Frame Prompt
   ========================================================================== */

.chromeframe { margin: 0.2em 0; background: #ccc; color: black; padding: 0.2em 0; }


/*	========================================================================== 
	Header
	==========================================================================*/ 

header .container {
	padding:10px 20px
}

#logo img {
	width:70%;
	height:auto;
	display:block;
	margin:0 15%;
}


@media only screen and (min-width: 820px) {
	header .container {
		width:100%;
	}
	
	#logo{ 
		width:20%;
		display:inline-table;
		float:left;
	}
	
#logo img {
	width:87%;
	height:auto;
	display:block;
	margin:0 0;
}
}

@media only screen and (min-width: 1024px) {
	header .container {
		padding:10px 0px;
		width:100%;
		overflow:auto;
	}
}

/* =============================================================================
   Top Text area
   ============================================================================= */ 
   
.toptext { 
	margin:20px 0;
	text-align:center;
	overflow:auto;
}

.toptext h1 {
	 text-transform:uppercase;
	 font-size:3em;
	 font-weight:300;
	 padding:0;
	 margin:10px 0;
}

.toptext h1 strong {
	font-weight:600;
}

.toptext h1 span {
	font-weight:600; display:block;
}

.toptext p {
	font-size:1.5em;
}

.toptext .dark {
	color:#333;
}

@media only screen and (min-width: 768px) {
	.toptext {
		text-align:left;
		max-width:400px;
		color:#fff;
        margin: 40px;
	}
	
	.toptext h1 {
		color:#fff;
        font-size: 4em;
	}
    
    
}


/*	==========================================================================
	Quote include
	========================================================================== */ 
 
#quoteblock { 
	background: url(../images/structure/quote-back.png) no-repeat center top #5c719b;
	overflow:hidden;
	display:block;
	visibility:hidden;
}

#quoteblock .container {
	padding:88px 0 20px;	
	overflow:hidden;
}
#quoteblock img {
	 border-radius: 50%; 
	 margin:20px auto;
	 border:6px solid #6f84ae;
	 display:block;	
	visibility:hidden;
	position:relative;
	z-index:10
}

#quoteblock p {
	display:inline-block;
	float:right;
	color: #fff;
	font-size:1.6em;
	padding:60px 20px 30px;
	background:#5c719b;
	visibility:hidden;
	position:relative;
		z-index:11
}

#quoteblock p span { color:#91a3c9; display:block; }

#quoteblock a.btn {
		 background:none;
		 color:#fff;
		 border:2px solid #a0aeca;
		 font-size:1.4em;
		 display:block;
		 margin-top:20px;
	
	}

@media only screen and (min-width: 768px) {
	
#quoteblock .container {
	padding:120px 0 50px;
}
	
	#quoteblock img {
		position:absolute;
	}
	
	#quoteblock p {
		width:68%;

	}
	
#quoteblock a.btn { max-width:200px;}
}

@media only screen and (min-width: 920px) {	
	#quoteblock p {
		width:75%;
	}
}

/*	==========================================================================
	Floating product text block (as seen on cpanel product info
	========================================================================== */ 

    .show-text {
        padding: 50px 0px 0;
    }

@media only screen and (min-width: 920px) {	
    .show-text {
        padding: 24px 0 0 40px;
    }
}
/*	==========================================================================
	Terms include
	========================================================================== */ 
p.pageterms {
	color:#828282!important;
	font-size:9px!important;
	padding:16px 0
}


/*	==========================================================================
	Column Areas
	========================================================================== */ 
	
.columns { 
	width:100%;  
	padding:20px 0;
	display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
	}

.col {
	background: rgba(255,255,255,0.9);
	width:100%; 
	padding:30px;
	display: inline-block;
	float:left;
	text-align:center;

}

	.col.windows {
		background: url(/images/structure/windows-hosting-icon-small.png) no-repeat #fff 12px 12px;
	}

.col .inner {
    width: 100%;
}

.col .inner p {
	text-align:left;
}

.col .inner h3 { 
	text-align:center;
	margin-top:0; 
	font-size:2.7em; 
	font-weight:300; 
	line-height:1.4em;
}

.col .inner h3 span { 
	font-weight:600;
	display:block;
}
.col .inner h3 small { 
	font-size:0.6em;
}

.col .inner img {
    width: 100%;
    display: block;
    height: auto;
}

.col .inner form { overflow:auto;}

.col .inner .btn {
	margin-top:0px;
}

.col4 .inner h3,
.col5 .inner h3 {
		font-size:2.2em; 
	}

@media only screen and (min-width: 768px) {
	.col {
		margin-right:2.2%;
	}	
	
	
	.col2 {
		width:38.8%;
	}
	
	.col2:first-child {
		margin-left:10%;
	}	
	.col2:last-child {
		margin-right:10%;
	}
	
	.col3 {
		width:31.82%;
	}
	
	.col3:nth-child(3n) {
		margin-right:0;
	}
	
	.col4,
	.col5 {
		width:48.8%;
		margin-bottom:18px
	}
	
	.col4:nth-child(2), 
	.col4:nth-child(4),
	.col5:nth-child(2), 
	.col5:nth-child(4) {
		margin-right:0;
	}
	
}

@media only screen and (min-width: 1024px) {

	.col.windows {
		background: url(/images/structure/windows-hosting-icon.png) no-repeat left 0;
		margin-top:-20px;
	}
	
	.col.windows .inner {
		padding-top:30px;
	}
	
	.col .btn {
        width: 100%;
		max-width: 180px;
        margin: 20px auto;
        display: block;
	}
	
	.col2 {
		width:32.8%;
	}
	
	.col2:first-child {
		margin-left:15%;
	}	
	.col2:last-child {
		margin-right:15%;
	}
	
	.col4 {
		width:23.3%;
		margin-bottom:40px
	}
		
	.col4:nth-child(2) {
		margin-right:2.2%;
	}
	
	.col4:last-child {
		margin-right:0;
	}
	
	.col5 {
		width:18.18%;
		margin-bottom:40px
	}
	
	.col5:nth-child(2), 
	.col5:nth-child(4) {
		margin-right:2.2%;
	}
	
	.col5:last-child {
		margin-right:0;
	}

}


/* ------------ power bars and fetures lists for top columns ----------------*/
progress, progress[role] {
  -webkit-appearance:   none;
  -moz-appearance: none;
  appearance:  none;
  border: none;
  background-size: auto;
  background-color:#cdcdcd;
  height: 28px;
  width: 100%;
}

.col .inner .skill-list {
  list-style: none;
  margin: 0;
  padding:10px 0 24px;
}

.col .inner .skill {
  margin-bottom: 1em;
  position: relative;
}

.col .inner .skill:last-child {
  margin-bottom: 0;
}

.col .inner .skill h3 {
  color: #fff;
  left: 7px;
  font-size:1.1em;
  line-height: 1em;
  position: absolute;
  top: 7px;
}
.col .inner .skill ::-webkit-progress-value {
  -webkit-animation: bar-fill 3s;
  width: 0px;
  background: #ff6b6b;
}

.col .inner .skill ::-moz-progress-bar {
  animation: bar-fill 3s;
  -moz-animation: bar-fill 3s;
  width: 0px;
  background: #ff6b6b;
}
.col .inner .skill strong {
	display:block;
}

.col:nth-child(2) .inner .skill ::-webkit-progress-value {
  background: #ff9e2c;
  -webkit-animation: bar-fill 4s;
}

.col:nth-child(2) .inner .skill ::-moz-progress-bar {
  background: #ff9e2c;
}

.col:nth-child(3) .inner .skill ::-webkit-progress-value {
  background: #67cb86;
  -webkit-animation: bar-fill 4.5s;
}

.col:nth-child(3) .inner .skill ::-moz-progress-bar {
  background: #67cb86;
}

.col:nth-child(4) .inner .skill ::-webkit-progress-value {
  background: #558ccf;
  -webkit-animation: bar-fill 5s;
}

.col:nth-child(4) .inner .skill ::-moz-progress-bar {
  background: #558ccf;
}


@-webkit-keyframes bar-fill {
  0% {
    width: 0;
  }
}
@keyframes bar-fill {
  0% {
    width: 0;
  }
}


.col .inner .standard-list {
padding: 14px 0;
}

.col .inner .standard-list li {
    text-align: center;
    list-style: none;
    border-bottom: 1px solid #ddd;
    color: #71777d;
    padding: 7px;
}



/*	==========================================================================
	Various Boxes
	========================================================================== */ 
.special-offers-corner {
	display: none;
}

@media only screen and (min-width: 820px) {	
	.special-offers-corner {display:block; position:absolute; top:114px; right:0; z-index:20}
}	
@media only screen and (min-width: 1024px) {	
	.special-offers-corner { position:absolute; top:122px; right:0;}
}
	
.partner-boxes { overflow:auto; display: table; width:100%; margin:0; }

.partner-boxes .box{
	position: relative;
	width: 50%;		/* desired width */
	float:left;
	background: #f8f8f8;
	border: 1px solid #ededed;
	border-collapse:collapse;
	display:table-cell;
	position:relative;
	min-height:220px;
}

.partner-boxes .box:before{
	content: "";
	display: block;
		padding-top: 100%; 	/* initial ratio of 1:1*/
}

.partner-boxes .box p{
	padding:16px!important;
	margin:0;
	position:absolute;
		top:0;
	left:0;
	font-size:1.3em!important;
    line-height:1.3em;
	font-weight:300;
}	

.partner-boxes .box p strong {
	margin-bottom:10px;
	display:block;
    color: #787878;
}

.partner-boxes .box img{
	width:80%;
	height:auto;
	margin:10%;
	position:absolute;
	top:0;
	left:0;
}	

.partner-boxes .box-white {background: #efefef;}
.partner-boxes .box-blue { background:#0eb7f2; color:#fff}

@media only screen and (min-width: 600px) {
	.partner-boxes .box p{
		padding:36px!important;
		font-size:1.6em!important;
	}	
}


@media only screen and (min-width: 960px) {
	.partner-boxes {
		width:100%;
	}
	.partner-boxes .box{
		width: 25%;		/* desired width */
		float:left;
	}
	.partner-boxes .box .content h4 {
		max-width:120px;
	}
}
	
.linkboxes { 
	overflow:auto; 
	display:block; 
	width:100%;
	visibility:hidden;
}

.linkboxes .box{
	position: relative;
	width: 100%;		/* desired width */
	float:left;
	background: #e1e1e6;
}

.linkboxes .box:before{
	content: "";
	display: block;
	padding-top: 100%; 	/* initial ratio of 1:1*/
}

.linkboxes .box .content{
	position:  absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background: none;
	padding:30px;
}


/* Common style */
.linkboxes .box-effect {
	position: relative;
	float: left;
	overflow: hidden;
	margin: 0;
	text-align: center;
	cursor: pointer;
}

.linkboxes .box-effect:before {
    content: "";
    display: block;
    padding-top: 100%;
}

.linkboxes .box-effect img {
	display: block;
	min-height: 100%;
	max-width: 100%;
}

.linkboxes .box-effect span {
	padding: 2em;
	text-transform: uppercase;
	font-size: 1.25em;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.linkboxes .box-effect span:before,
.linkboxes .box-effect span:after {
	pointer-events: none;
}

.linkboxes .box-effect span,
.linkboxes .box-effect span > a {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* Anchor will cover the whole item by default */
/* For some effects it will show as a button */
.linkboxes .box-effect span > a {
	z-index: 1000;
	text-indent: 200%;
	white-space: nowrap;
	font-size: 0;
	opacity: 0;
}

.linkboxes .box-effect h4 {
	font-weight:300;
	font-size:1.4em;
	text-transform:uppercase;
	margin-top:0;
}

.linkboxes .box-effect h4 span {
	font-weight: 800;
}

.linkboxes .box-effect p {
	letter-spacing: 1px;
	font-size: 68.5%;
}

/* Individual effects */


.linkboxes .box-effect img {
	max-width: none;
	width: -webkit-calc(100% + 50px);
	width: calc(100% + 50px);
	opacity: 0.7;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	-webkit-transform: translate3d(100px,0, 0);
	transform: translate3d(100px,0,0);
	position:absolute;
	top:-20px;
}

.linkboxes .box-effect.slide-up img {
	width: -webkit-calc(140% + 70px);
	width: calc(140% + 70px);
	opacity: 0.7;
	-webkit-transform: translate3d(-84px,0px, 0);
	transform: translate3d(-84px,0px,0);
	top:0px;
}

.linkboxes .box-subtle img {
	max-width: none;
	width: -webkit-calc(100% + 50px);
	width: calc(100% + 50px);
	opacity: 0.7;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	-webkit-transform: translate3d(0,0, 0);
	transform: translate3d(0,0,0);
	position:absolute;
	top:-20px;
}

.linkboxes .box-effect span {
	text-align: left;
}

.linkboxes .box-effect div {
	position: absolute;
	bottom: 0;
	left: 0;
	padding: 3.2em 4em;
	width: 100%;
	height: 100%;
}

.linkboxes .box-effect h4,
.linkboxes .box-effect p {
	-webkit-transform: translate3d(0,40px,0);
	transform: translate3d(0,40px,0);
}

.linkboxes .box-effect h4 {
	-webkit-transition: -webkit-transform 0.35s;
	transition: transform 0.35s;
}

.linkboxes .box-effect h4 strong {
	font-weight:700;
}

.linkboxes .box-effect p {
	color: rgba(40,40,40,0.8);
	opacity: 0;
	-webkit-transition: opacity 0.2s, -webkit-transform 0.35s;
	transition: opacity 0.2s, transform 0.35s;
	position:relative;
}

.linkboxes .box-red h4,
.linkboxes .box-blue h4,
.linkboxes .ukbox h4,
.linkboxes .box-subtle h4,
.linkboxes .box-red p,
.linkboxes .box-blue p, 
.linkboxes .ukbox h4 p,
.linkboxes .box-subtle p {
	color: rgba(255,255,255,0.8);
}

.linkboxes .box-effect:hover img,
.linkboxes .box-effect:hover p {
	opacity: 1;
}

.linkboxes .box-effect:hover img,
.linkboxes .box-effect:hover h4,
.linkboxes .box-effect:hover p {
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}

.linkboxes .box-effect:hover img {
	-webkit-transform: translate3d(77px,0,0);
	transform: translate3d(77px,0,0);
}

.linkboxes .slide-up:hover img {
	-webkit-transform: translate3d(-84px,-14px,0);
	transform: translate3d(-84px,-14px,0);
}

.linkboxes .box-subtle:hover img {
	-webkit-transform: translate3d(-10px,0,0);
	transform: translate3d(-10px,0,0);
}


.linkboxes .box-effect:hover p {
	-webkit-transition-delay: 0.05s;
	transition-delay: 0.05s;
	-webkit-transition-duration: 0.35s;
	transition-duration: 0.35s;
}

.linkboxes .box-effect p:before {
	position:absolute;
	background:#de5636;
	width:60%;
	height:3px;
	display:block;
	content:"";
	top:-15px;
	
}

.linkboxes .box-effect:after {
	position:absolute;
	bottom:0;
	right:0;
	content:">";
	padding:10px 10px;
	width:20px;
	line-height:1em;
	font-size:2em;
	font-weight:700;
	color: rgba(255,255,255,0.8);
	background:rgba(0,0,0,0.15)
}


.linkboxes .box-white {background: #fff;}
.linkboxes .box-red { background:#de5636}
.linkboxes .box-blue { background:#0eb7f2}
.linkboxes .ukbox { background: #47bdd7;}


@media only screen and (min-width: 420px) {
	.linkboxes .box{
		width: 50%;	
	}	
}

@media only screen and (min-width: 768px) {
	.linkboxes .box .content h4 {
		max-width:120px;
	}
}

@media only screen and (min-width: 1024px) {
	.linkboxes .box{
		width: 25%;		/* desired width */
		float:left;
	}
	.linkboxes .box-effect h4 {
		max-width:154px;
	}
	.linkboxes .box-effect p {
		max-width:172px;
	}
	
	.linkboxes .box-subtle p {
		max-width:100px;
	}
}

/*	==========================================================================
	Standard Includes (eg on dserver pages
	========================================================================== */ 

.standard-includes,
.top-includes {
	text-align:left;
	padding:0 48px;
}
.standard-includes > p:first-child {
	text-align:center;
	width:100%;
	display:block;
	margin-bottom:20px;
}

.standard-includes .col { 
	padding:12px 20px; 
	margin-bottom:10px;
}

.standard-includes .col p {
	text-align:justify;
}

.standard-includes .col ul {
	 padding: 0;
}


.standard-includes .col li {
	text-align:left;
}

.standard-includes .col h4 {
	text-align:center;
	font-size:1.6em;
	margin:0 0 6px;
	position:relative;
	padding:0;
	padding-top:90px;
	overflow:hidden;
}


.standard-includes .col h4:before {
	background-image:url(/images/content/icons/dserver.png);
	background-repeat:no-repeat;
	background-position:30px 0;
	position:absolute;
	top:0;
	left:50%;
	margin-left:-66px;
	content:"";
	display:block;
	width:110px;
	height:88px;
}

.standard-includes .col.cc h4:before {
			background-position:-247px 0;
}
.standard-includes .col.twenty h4:before {
		background-position:-534px 0;	
}
.standard-includes .col.bandwidth h4:before {
			background-position:30px -294px;
}
.standard-includes .col.network h4:before {
			background-position:-247px -294px;
}
.standard-includes .col.monitoring h4:before {
			background-position:-534px -294px;
}
.standard-includes .col.control h4:before {
			background-position:30px -565px;
}
.standard-includes .col.kvm h4:before {
			background-position:-247px -565px;
}
.standard-includes .col.why-windows h4:before {
			background-position:-780px 0;
}
.standard-includes .col.features h4:before {
			background-position:-782px -294px;
}
.standard-includes .col.servers h4:before {
			background-position:-782px -565px;
}
.standard-includes .col.huk h4:before {
			background-position:-1058px -294px;
}
.standard-includes .col.info h4:before {
			background-position:-534px -565px;
}
.standard-includes .col.firewall h4:before {
			background-position:-1057px -567px;
}

.standard-includes .col.number1 h4:before {
			background-position:32px -718px;
}
.standard-includes .col.number2 h4:before {
			background-position:-247px -718px;
}
.standard-includes .col.number3 h4:before {
			background-position:-534px -718px;
}
.standard-includes .col.number4 h4:before {
			background-position:-787px -718px;
}
.standard-includes .col.number5 h4:before {
			background-position:-1058px -718px;
}
.standard-includes .col.number6 h4:before {
			background-position:32px -878px;
}
.standard-includes .col.number7 h4:before {
			background-position:-247px -878px;
}
.standard-includes .col.number8 h4:before {
			background-position:-534px -878px;
}
.standard-includes .col.number9 h4:before {
			background-position:-787px -878px;
}
.standard-includes .col.number10 h4:before {
			background-position:-1058px -878px;
}

/* ----- Top col icons (as seen on network page) ------- */

.top-includes .col h4 {
	text-align:center;
	font-size:1.6em;
	margin:0 0 6px;
	position:relative;
	padding:0;
	padding-top:110px;
	overflow:hidden;
}


.top-includes .col h4:before {
	background-image:url(/images/content/icons/dserver.png);
	background-repeat:no-repeat;
	background-position:30px 0;
	position:absolute;
	top:0;
	left:50%;
	margin-left:-66px;
	content:"";
	display:block;
	width:120px;
	height:110px;
}

.top-includes .col.network-sla h4:before {
			background-position:14px -954px;
}
.top-includes .col.network-contention h4:before {
			background-position:-172px -954px;
}
.top-includes .col.network-247 h4:before {
			background-position:-359px -954px;
}



img.block-image {
	margin:16px 0px 0px;
	display:block;
	width:100%;
	height:auto;
}
/*-
.standard-includes .col:last-child { 
	padding:12px 30px;
	background: #efefef;
}

.standard-includes .col:last-child  h4 {
}

.standard-includes .col:last-child  h4:before {
}
*/
@media only screen and (min-width: 1000px) {
	img.block-image {
		margin:16px 0px 0px;

	}
}

/*	==========================================================================
	Main Contents
	========================================================================== */ 

section {
}

#main{
	background: #fff;
	clear:both; 
	overflow:auto;
}

#main .contents {
	background:#fff;
	position:relative;
	z-index:5;
}

#main .contents p {
    color: #575757;
    font-size: 1.5em;
}

#main .contents p.top-para {
	padding:0 80px 40px;
    text-align: center;
    color: #2b2b2b;
    font-size: 1.8em;
}

#main .contents p.mid-para {
	padding:10px 80px;
    text-align: center;
    color: #2b2b2b;
    font-size: 1.8em;
}

#main .contents .full-col p:last-child{ 
		padding-bottom:0px; 
}
    

#main .contents p.center {
	text-align:center;
}

#main .contents .full-col .quote-para {
	overflow:auto;
    padding-bottom: 50px;
}

#main .contents .full-col .quote-para p {
}

#main .contents .full-col .quote-para blockquote {
	margin-bottom:10px;
	font-size:2.4em;
	text-align:center;
}

#main h2 { 
	text-align:left;
	font-weight:300;
	margin: 0 0 20px 0;
	line-height:1.3em;
	
}

#main .small-left-col h3,
#main .small-right-col h3,
#main .large-left-col h3,
#main .large-right-col h3,
#main .half-col h3 { 
	font-size:1.8em;
	line-height:1.3em;
	margin-bottom:7px;
}

#main .full-col h2,
#main .half-col h2,
#main .small-left-col h2,
#main .small-right-col h2,
#main .large-left-col h2,
#main .large-right-col h2 {
	margin:0 0 40px 0;
    position: relative;
}

#main ul li:last-child {
    border-bottom: none!important;
}

#main .full-col ul li,
#main .half-col ul li,
#main .small-left-col ul li,
#main .small-right-col ul li,
#main .large-left-col ul li,
#main .large-right-col ul li {
    background: url(/images/content/icons/list-arrow-red.png) 0 11px no-repeat;
    padding: 4px 0px 4px 14px;
    border-bottom: 2px dotted #ebebeb;
}

/* ------------ Standand Content list item styles ------------------ */

#main ul.standard li {
    color:#333;
    font-size: 1.4em;
    list-style: none;
    padding: 3px 0;
    border-bottom: 2px dotted #ebebeb;
    background:  none;
}


/* ------------ Terms & conditions list item styles ------------------ */
.terms ul li, .terms ol li{font-size:14px; line-height:1.6em; padding:6px 0 }

/* ------------ Contact us list item styles ------------------ */

#main ul.contact,
#main ul.contact li ul
{
    padding: 0;
    margin: 0;
}

#main ul.contact li {
    color:#333;
    font-size: 1.4em;
    list-style: none;
    padding: 15px 0 15px 58px; 
    position: relative;
    border-bottom: 2px dotted #ebebeb;
    background: none;
}

#main ul.contact li:before {
    background-image: url(/images/content/icons/contact-icons.png);
    background-repeat: no-repeat;
    position: absolute;
    height: 52px;
    width: 42px;
    display: block;
    content: "";
    top:11px;
    left: 0;
}

#main ul.contact li.tel:before {
    background-position: 0 7px;
}

#main ul.contact li.fax:before {
    background-position: 0 -49px;
}

#main ul.contact li.email:before {
    background-position: 0 -106px;
}

#main ul.contact li ul {
    padding-top: 0px;
}

#main ul.contact li ul li {
    color:#787878;
    font-size: 0.9em;
    list-style: none;
    padding: 0px 0 0px 0px; 
    position: relative;
    border: none 0;
}

#main ul.contact li li:before {
     background: none;
}

/*
#main .full-col h2:after,
#main .half-col h2:after,
#main .small-left-col h2:after,
#main .small-right-col h2:after,
#main .large-left-col h2:after,
#main .large-right-col h2:after {
	content:"";
	margin:14px 0 15px 0;
		background:url(/images/structure/h2underline.png) no-repeat center 0;
		width:100%;
		height:20px;
		display:block;
    position: absolute;
}*/
	
/* Large column on top of small
Swap round the style from small to large if the small columns is to display first */
.small-left-col{
	padding:0 40px 40px;
}
.small-right-col{
	padding:0 40px 40px;
}
.large-left-col{
	padding:40px;
}
.large-right-col{
	padding:40px;
}
.half-col {
	padding:20px;
}

.full-col{ 
	width:100%;
	display:block; 
	padding:20px; 
	border:0;
	}

#main .contents .small-left-col p,
#main .contents .small-right-col p,
#main .contents .large-left-col p,
#main .contents .large-right-col p,
#main .contents .half-col p {
	padding:0;
}

.half-col img { 
	width:100%;
	height: auto;
	margin-bottom:20px;
}

.small-left-col img,
.small-right-col img {
    max-width: 100%;
}

.half-col table img {
	width:auto;
	margin:0;
}

@media only screen and (min-width: 768px) {
	#main{
		background-image:  url(../images/content/backgrounds/grey-angle-small.png), url(../images/content/backgrounds/index-angle.jpg);
		background-repeat: no-repeat;
		background-color: #fff;
		background-size: 164%;
        background-position: left top, center top;
			-webkit-transition-property:all; 
	-webkit-transition-duration: 0.3s;  
	-moz-transition-property: all; 
	-moz-transition-duration: 0.3s;  
	-o-transition-property: all; 
	-o-transition-duration: 0.3s; 
	transition-property: all; 
	transition-duration: 0.3s; 
	transition-timing-function: ease-in-out;
	overflow: hidden;
        position: relative
	} 
	
	#main.about {
		background-image:  url(../images/content/backgrounds/grey-angle-small.png), url(../images/content/backgrounds/about.jpg);
	}
	#main.domain {
		background-image:  url(../../../wp-content/themes/hosting-uk-2015/images/content/backgrounds/grey-angle-small.png), url(../../../wp-content/themes/hosting-uk-2015/images/content/backgrounds/domains-results.jpg);
        background-color: #f3f3f5;
	}
	#main.domains-results {
		background-image:  url(../images/content/backgrounds/grey-angle.png), url(../images/content/backgrounds/domains-results.jpg);
	}
   	#main.wales {
		background-image:  url(../images/content/backgrounds/grey-angle.png), url(../images/content/backgrounds/wales.jpg);
	}	
	#main.hosting {
		background-image:  url(../images/content/backgrounds/grey-angle.png), url(../images/content/backgrounds/hosting.jpg);
	}
	#main.developer {
		background-image:  url(../images/content/backgrounds/grey-angle.png), url(../images/content/backgrounds/developer.jpg);
	}
	#main.vps {
		background-image:  url(../images/content/backgrounds/grey-angle.png), url(../images/content/backgrounds/clouds.jpg);
	}	
	#main.exchange {
		background-image:  url(../images/content/backgrounds/grey-angle.png), url(../images/content/backgrounds/exchange.jpg);
	}
	#main.dedicated {
		background-image:  url(../images/content/backgrounds/grey-angle.png), url(../images/content/backgrounds/dedicated.jpg);
	}
	#main.colo {
		background-image:  url(../images/content/backgrounds/grey-angle.png), url(../images/content/backgrounds/colo.jpg);
	}	
	#main.contact {
		background-image:  url(../images/content/backgrounds/grey-angle.png), url(../images/content/backgrounds/contact.jpg);
	}	
	#main.cpanel {
		background-image:  url(../images/content/backgrounds/grey-angle.png), url(../images/content/backgrounds/cpanel.jpg);
	}	
	#main.ssl {
		background-image:  url(../images/content/backgrounds/grey-angle.png), url(../images/content/backgrounds/ssl.jpg);
	}
	#main.network {
		background-image:  url(../images/content/backgrounds/grey-angle.png), url(../images/content/backgrounds/network.jpg);
	}	
    
    	#main.guarantee {
		background-image:  url(../images/content/backgrounds/grey-angle.png), url(../images/content/backgrounds/guarantee.jpg);
	}	
    
   	#main.sitebuilder {
		background-image:  url(../images/content/backgrounds/grey-angle.png), url(../images/content/backgrounds/sitebuilder.jpg);
	}	
   	#main.testi {
		background-image:  url(../images/content/backgrounds/grey-angle.png), url(../images/content/backgrounds/testimonials.jpg);
	}	
}

@media only screen and (min-width: 1024px) {
	#main{
		background-size: 152%;
	}
	.small-left-col{
		float:left;
		width:40%; 
		display:block; 
		padding:50px 25px 50px 50px;
		border:0;
	}
	.small-right-col{
		float:right; 
		width:40%; 
		display:block; 
		padding:50px 50px 50px 25px; 
		border:0;
	}
	.large-right-col{
		float:right; 
		width:60%; 
		display:block; 
		padding:50px 50px 50px 25px; 
		border:0;
	}
	.large-left-col{
		float:left; 
		width:60%; 
		display:block; 
		padding:50px 25px 50px 50px;
		border:0;
	}
	.half-col{
		float:left; 
		width:50%;
		display:block; 
		padding:50px 80px 50px 25px; 
		border:0;
	}
	.half-col:first-of-type{
		padding:50px 25px 50px 80px;
	}
    
	
	.full-col{ 
		padding:50px; 
		display:block;
		width:100%;
	}
    
	.contents:nth-child(2) .full-col { 
		padding-bottom:10px; 
	}
	
	.half-col img { 
		width: auto;
	}
    
    .full-col > img{
        max-width: 600px;
        margin:40px auto 20px;
        display: block; 
    }
    
	#main .half-col h2,
	#main .large-left-col h2,
	#main .large-right-col h2,
	#main .small-left-col h2,
	#main .small-right-col h2{
		text-align:left;
		max-width:300px;

	}
	
	#main .half-col h2:after,
	#main .large-left-col h2:after,
	#main .large-right-col h2:after,
	#main .small-left-col h2:after,
	#main .small-right-col h2:after {
		content:"";
		background:url(/images/structure/h2underline.png) no-repeat 0 0;
		padding-bottom:0px
	}
	
	#main .contents .full-col .quote-para p {
		padding:19px 0px 0 20px;
		font-size:1.6em;
		text-align:left;
		display:inline-block;
		width:65%;	
	}	
	
	#main .contents .full-col .quote-para blockquote {
		padding:15px 14px 0 40px;
		margin-bottom:10px;
		font-size:4em;
		line-height:1.12em;
		text-align:right;
		float:left;
		width:30%;
		display:inline-block;	
        font-weight: 300;
	}
    .small-left-col img{
        width: 100%;
        height: auto;
    }
}

@media only screen and (min-width: 1300px) {
	#main{
		background-size: 120%;
	}
}
@media only screen and (min-width: 1600px) {
	#main{
		background-size: 100%;
	}
}

/* =============================================================================
   Page Tabs
   ========================================================================== */

#menu {}
#menu ul {}
#menu li.left {display: table-cell; text-align: left; width: 20px; white-space:nowrap;}
#menu li {display: table-cell; text-align: right; width: auto;}



/*---------------- TABS -----------------*/
.tabbed-area {
	display:table; 
	width:90%; 
	margin:0 auto;
	/*visibility: hidden;*/
}

.tabs {
    padding: 0;
	overflow:hidden;
	display:table-row; 
	width: 100%;
	text-align:center;
}
.tabs li{list-style:none; display: table-cell; width: auto; }
.tabs li a{
	display: block;
	padding: 18px 30px;
	text-decoration: none;
	font-size: 15px;
	font-weight: 400;
	color: #fff;
	background-color: rgba(40,40,40,0.35);
}
.tabs li:first-child a{ 
	border-left: none; 
	border-radius: 4px 0 0 0;
}

.tabs li:last-child a{ 
	border-left: none; 
	border-radius: 0 4px 0 0;
}
.tabs li a:hover{ 
	color:#fff; 
	background-color: rgba(40,40,40,0.4)
}
.tabs li.active a, 
.tabs li.active a:hover {	
	color: #2d3646; 
	background-color: #fff;
}

/*---------------- accordion -----------------*/
.accordion_tabs {
	display:none;
	background: #cfcfcf;
	border-bottom: 1px solid #ccc;
	padding: 10px;
	font-size:1.6em;
}
a.accordion_tabs:link,
a.accordion_tabs:visited{
	color: #21759B;
}
a.accordion_tabs:hover{ 
	color:#D54E21; 
}
a.accordion_tabs.active{ 
	color: #000; 
	background:#fff; 
	border-bottom: 1px solid #fff;
}

/*---------------- tab content -----------------*/
.col a.select-tab, .col a.fake-select-tab {
	 border-bottom: 1px dotted #474747;
	 background: none;
	 margin:0;
	 padding:0;
	 font-size:1.4em;
	 color:#333;
	 text-decoration:none;
	 -webkit-transition-property:all; 
	-webkit-transition-duration: 0.3s;  
	-moz-transition-property: all; 
	-moz-transition-duration: 0.3s;  
	-o-transition-property: all; 
	-o-transition-duration: 0.3s; 
	transition-property: all; 
	transition-duration: 0.3s; 
	transition-timing-function: ease-in-out;
	display:inline-block;
}

.col a.select-tab:hover, 
.col a.select-tab:active,
.col a.fake-select-tab:hover {
	 margin:0;
	 padding:0;
	 color: #de5636;
	 	 border-bottom: 1px dotted #de5636;

}

@media screen and (max-width: 690px) {
	.tabs{ 
		display:none; 
	}
	.accordion_tabs{ 
		display:block; 
	}
	.tab_content{ 
		border:none; 
	}
}

/*---------------- mid page tabs styles -----------------*/
.mid-tabbed-area {
	display:table; 
	width:100%; 
	margin:0;
	/*visibility: hidden;*/
}

.mid-tabbed-area .tabs {
    padding: 0;
	overflow:hidden;
	display:table-row; 
	text-align:center;
}
.mid-tabbed-area .tabs li {list-style:none; display: table-cell; width: auto; 	width: 33%; }
.mid-tabbed-area .tabs li a{
	display: block;
	padding: 22px 10px;
	text-decoration: none;
	font-size: 15px;
	font-weight: 400;
	color: #2d3646;
    margin-bottom: 3px;
    text-align: center;
    background: rgba(40,40,40,0.1);
    
}
.mid-tabbed-area .tabs li:first-child a{ 
	border-left: none; 
}

.mid-tabbed-area .tabs li:last-child a{ 
	border-left: none; 
}
.mid-tabbed-area .tabs li a:hover{ 
	color:#2d3646; 
	background-color: rgba(40,40,40,0.2)
}
.mid-tabbed-area .tabs li.active a, 
.mid-tabbed-area .tabs li.active a:hover {	
	color: #2d3646; 
background: none repeat scroll 0 0 #fff;
}

@media screen and (min-width: 1024px) {
.mid-tabbed-area {
    padding: 0 0px;
}
}

/* =============================================================================
   Timeline Slider (e.g. on about us page)
   ========================================================================== */
    #timeline {
        color: #fff;
        font-size: 14px;
        width: 100%;
        overflow: hidden;
        padding: 20px 0 0 0;
        position: relative;
        background: #fff;
    }
    #dates {
        width: 100%!important;
        overflow: hidden;
        padding: 20px 0 30px;
        background: url(/images/content/about/dot.gif) left 65px repeat-x #f9f9f9;
        position: absolute;
        z-index: 4;
        margin: 0!important;
        border:1px solid #f2f2f2;
        
    }
    #dates li {
        list-style: none;
        float: left;
        width: 140px;
        height: 50px;
        font-size: 14px;
        text-align: center;
        background: url(/images/content/about/biggerdot.png) center bottom no-repeat;
    }
    #dates a {
        line-height: 38px;
        padding-bottom: 10px;
        color: #de5636;
    }
    #dates .selected {
        font-size: 38px;
    }
    #issues {
        width: 1008px;
        height: auto;
        overflow: hidden;
        padding: 160px 0 0 0;
        margin: 0;
        background: #474747;
    }
    #issues li {
        width: 1008px;
        padding: 0;
        height: auto;
        list-style: none;
        float: left;
    }

#dates li:first-child {
        margin-left: 100px
    }

    #issues li img {
        float: left;
        margin: 0 0 0 100px;
        width: 38%;
        height: auto;
        display: inline-block;
        max-width: 506px;
    }
    #issues li p {
        font-weight: 400;
        line-height: 22px;
        font-size: 13px!important;
        padding: 50px 70px 50px;
        color: #fff;
        float: left;
        width: 50%;
    }

    #issues li p span {
        font-size: 1.9em;
        display: block;
        color: #999;
        margin-bottom: 6px;
}
    #next,
    #prev {
        position: absolute;
        font-size: 70px;
        top: 262px;
        width: 52px;
        height: 54px;
        background-position: 0 0;
        background-repeat: no-repeat;
        text-indent: -9999px;
        overflow: hidden;
        opacity: 0.34;
        	-webkit-transition-property:all; 
	-webkit-transition-duration: 0.3s;  
	-moz-transition-property: all; 
	-moz-transition-duration: 0.3s;  
	-o-transition-property: all; 
	-o-transition-duration: 0.3s; 
	transition-property: all; 
	transition-duration: 0.3s; 
	transition-timing-function: ease-in-out;
    }
    #next:hover,
    #prev:hover {
        opacity: 1;
    }
    #next {
        right: 0;
        background-image: url(/images/content/about/next.png);
    }
    #prev {
        left: 14px;
        background-image: url(/images/content/about/prev.png);
    }
    #next.disabled,
    #prev.disabled {
        opacity: .2;
    }

/* =============================================================================
   Tool Tips - 100% css
   ========================================================================== */

.help-tip{
    position: absolute;
    top: 0px;
    right: 0px;
	padding-left:30px;
    text-align: center;
    cursor: pointer;
	width:100%;
	display:block;
}

.help-tip:before{
    content:'?';
    font-weight: bold;
    color:#fff;
	    background-color: #BCDBEA;
    border-radius: 50%;
    width: 24px;
    height: 24px;    
	font-size: 14px;
    line-height: 26px;
	float:left;
}

.help-tip:before:hover{
	    background-color: #79bdde;
}

.help-tip:hover p{
    display:block;
    transform-origin: 100% 0%;

    -webkit-animation: fadeIn 0.3s ease-in-out;
    animation: fadeIn 0.3s ease-in-out;

}

.help-tip p{	/* The tooltip */
    display: none;
    text-align: left;
    background-color: #1E2021;
    padding: 20px!important;
    width: 300px;
    position: absolute;
    box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
    right: -4px;
	top:23px;
    color: #999;
    font-size: 12px!important;
    line-height: 1.4;
	z-index:9
}

.help-tip p:before{ /* The pointer of the tooltip */
    position: absolute;
    content: '';
    width:0;
    height: 0;
    border:6px solid transparent;
    border-bottom-color:#1E2021;
    left:10px;
    top:-12px;
}

.help-tip p:after{ /* Prevents the tooltip from being hidden */
    width:100%;
    height:40px;
    content:'';
    position: absolute;
    top:-40px;
    left:0;
}

/* CSS animation */

@-webkit-keyframes fadeIn {
    0% { 
        opacity:0; 
        transform: scale(0.6);
    }

    100% {
        opacity:100%;
        transform: scale(1);
    }
}

@keyframes fadeIn {
    0% { opacity:0; }
    100% { opacity:100%; }
}


/* =============================================================================
   Customer Testimonials page styles
   ========================================================================== */

.our-customers {
    overflow: auto; 
    	display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.our-customers > div {
    overflow: auto;
    padding: 0;
    width: 100%;
    background: #f4f4f4;
    margin: 20px 0;
}

.our-customers p span {
    display: block;
    text-align: center;
    color: #DE5636;
    padding-top: 20px
}


.our-customers img {
    display: block;
    margin: 0;
    position: relative;
    z-index: 10;
    width: 100%;
    height: auto;
}

.our-customers p {
 background: none repeat scroll 0 0 #f4f4f4;
    display: block;
    font-size: 1.6em;
    padding: 30px!important;
    position: relative;
    z-index: 11;
    width: 100%;
    text-align: center;
}  
    
    .our-customers p:before {
        bottom: 100%; 
        left: 50%; 
        border: solid transparent;
        content: " ";
        height: 0; 
        width: 0; 
        position: absolute; 
        pointer-events: none; 
        border-color: rgba(244, 244, 244, 0); 
        border-bottom-color: #f4f4f4; 
        border-width: 15px; 
        margin-left: -15px;
    }


@media screen and (min-width: 768px) {
.our-customers {
    padding: 20px 20px 40px;  
}
    
    .our-customers > div {
    float: left;
    width: 45%;
    margin: 10px;
}
}

@media screen and (min-width: 1024px) {
    .our-customers > div {
    float: left;
    width: 45%;
    margin: 20px;
}

    
}

/* =============================================================================
   Content Accordion (eg on contact page)
   ========================================================================== */

.accordion {
    overflow:hidden;
    background:#f7f7f7;
}
 
/*----- Section Titles -----*/
.accordion-section-title {
    width:100%;
    padding:30px 30px 30px 50px;
    display:inline-block;
    border-bottom:1px solid #dfdfdf;
    background:#fff;
    transition:all linear 0.15s;
    position: relative;
}

.accordion-section-title:after {
    position: absolute;
    top:20px;
    right:50px;
    content: "+";

    font-size: 3em;
}

.accordion-section-title.active, .accordion-section-title:hover {
    background:#f4f4f4;
    /* Type */
    text-decoration:none;
}

.accordion-section-title.active:after {
    position: absolute;
    top:20px;
    right:53px;
    content: "-"
}

.accordion-section-title h4 {
    font-size: 2em; 
    color: #222;
    margin: 0;
}


 
/*----- Section Content -----*/
.accordion-section-content {
    padding:15px;
    display:none;
    background: #fff;
    overflow: auto;
    border-bottom:1px solid #dfdfdf;
}


/* =============================================================================
   Tables
   ========================================================================== */
table { 
	border-collapse: collapse; 
	border-spacing: 0; 
}
td { 
	vertical-align: top;
}

td span { 
	position:relative;
	display:block;
}

td span:hover{
	text-decoration:underline;
}


table {
	width:100%;
	font-size: 1.8em;
	position:relative;
}
table tr:nth-child(2n+1) { 
	background:#eaeaea;
}
table td {
    padding: 10px;
	text-align: center;
}

table td:first-child {
	width:80%;
	text-align:left;
}

table.comparison td:first-child {
	text-align:right;
}

table tr.offer { position: relative; font-weight:700;}

table tr.offer td span { position:absolute; top:-15px; right:0px; padding:5px 10px; font-weight:400; font-size:0.6em; background: #de5636 ;color:#fff; display:block; text-transform:uppercase;}

table tr.offer td span:after {
top: 100%; 
left: 50%; 
border: solid transparent; 
content: " "; 
height: 0; 
width: 0; 
position: absolute;
pointer-events: none; 
border-color: rgba(222, 86, 54, 0); 
border-top-color: #de5636; 
   border-width: 6px;
margin-left: -6px;
}

table.features { 
	font-size:1.4em;
}

table.comparison { 
	font-size:1.4em;
	margin:40px 0;
    position: relative;
}

table.comparison.small-table { 
    width: 86%;
    margin: 40px 18px 60px;
}

table.comparison th { 
	font-size:1.1em;
	padding:20px 2px;
	background:#fff;
	font-weight:300;
}

table.comparison td:first-child {
	width:36%;
	background:#fff;
	border-right:3px solid #ddd;
}

table.comparison.small-table td:first-child {
	width:20%;
	background:#fff;
	border-right:3px solid #ddd;
}

table.left-align td,
table.left-align th {
	 text-align:left;
}


table a.btn {
	font-size:1.1em;
    margin: 0;
}


.most-popular {
    background: rgba(145,183,239,0.56)!important;
    color: #fff;
    padding: 7px;
}

@media only screen and (min-width: 1024px) {

table tr.offer td span {
    top:0px; 
    right: auto; 
    left:398px; 
    padding:12px; 
    font-weight:400; 
    font-size:0.78em; 
    display: inline-block;
    white-space: nowrap;
}

table tr.offer td span:after {
   right: 100%; 
   top: 50%; 
   border: solid transparent;
   content: ""; 
   height: 0; 
   width: 0; 
   border-color: rgba(222, 86, 54, 0); 
   border-right-color: #de5636; 
   border-width: 10px;
   margin-top: -10px;
   margin-left: auto;
   font-size:1em;
}
}


/*	==========================================================================
	Form Styles
	========================================================================== */ 
	
/* input, textarea{}
input:focus, textarea:focus{background:#fff; border:1px solid #ccc; color:#333;}
input:focus:invalid, textarea:focus:invalid{border:1px solid #be3c3c;}
input:required:valid, textarea:required:valid{border:1px solid #91c643;} */
.quform-errors{}
.checkbox-element-wrapper .quform-errors{margin-top:0;}
.quform-success-message{background:#8cc41f; margin-bottom:20px; color:#fff; font-size:2.0em; padding:10px; font-weight:normal;}
/* input, textarea{padding:16px; width:100%; font-size:1.5em; background:#fff; border:1px solid #ccc; -moz-box-shadow: inset 1px 1px 1px #fff; -webkit-box-shadow: inset 1px 1px 1px #fff; box-shadow: inset 1px 1px 1px #fff; margin-bottom:20px; color:#a8a8a8;}
input:focus, textarea:focus{background:#fff; border:1px solid #555; color:#333;}
input:focus:invalid, textarea:focus:invalid{border:1px solid #be3c3c;}
input:required:valid, textarea:required:valid{border:1px solid #91c643;}*/
.quform-errors{margin-top:-20px; color:#f48028; padding-left:0;}/* when html5 'required' isn't supported - test in ie */
.checkbox-element-wrapper .quform-errors{margin-top:0;}
.quform-success-message{background:#f48028; margin-bottom:20px; color:#fff; font-size:2.0em; padding:10px; font-weight:normal;}

.quform label{color: #333; font-size: 1.6em; line-height: 1.6em; display:block;}
.quform input, .quform textarea{}
.quform .checkbox{}

.submit, #goog-wm-sb{} /* For generic .submit and google search on 404 page */
.submit:hover, #goog-wm-sb:hover{}

input[type="submit"] {
	-webkit-transition-property:all; 
	-webkit-transition-duration: 0.3s;  
	-moz-transition-property: all; 
	-moz-transition-duration: 0.3s;  
	-o-transition-property: all; 
	-o-transition-duration: 0.3s; 
	transition-property: all; 
	transition-duration: 0.3s; 
	transition-timing-function: ease-in-out;
}

/*	==========================================================================
	Choose Hosting / VPS  Checkout Popup Box
	========================================================================== */ 
#chooseprice {
	display: none;
	background: rgba(0,0,0,0.74);
	position:absolute;
	width:100%;
	height:100%;
	top:0;
	left:0;
	z-index:9999;
}

#chooseprice .choose-inner {
    width:90%;
	height: auto;
	position:absolute;
	top: 70px;
	left:5%;
	background:#fff;
	padding:20px;
	max-height: 88%;
}

#chooseprice .choose-inner h2 {
	display:none;
	text-align:center;
}

#chooseprice .choose-inner p {
	text-align:center;
}

#chooseprice .choose-inner .plan {
	display: none;
}

#chooseprice .choose-inner input[type="submit"] {
	width: 100%;
}


/* ---------- Radio Button Style ----------------*/
#chooseprice .choose-inner .terms {
	overflow:auto;
    margin-bottom:14px;
}

#chooseprice .choose-inner .terms .term {
	width:100%;
	border-bottom:1px solid #dfdfdf;
	padding:12px;
}

#chooseprice .choose-inner .terms .term:nth-child(2n+1) {
	background:#f2f2f2;
}

#chooseprice .choose-inner .terms .term p {
	margin-top:0px;
	text-align:right;
	float:right;
}

#chooseprice .choose-inner .terms .term p span {
	text-align:left;
	background:#474747;
	display:block;
	color:#fff;
	text-align:center;
	padding:0 12px;
}

input[type=radio].css-checkbox {
	position:absolute; z-index:-1000; left:-1000px; overflow: hidden; clip: rect(0 0 0 0); height:1px; width:1px; margin:-1px; padding:0; border:0;
}

input[type=radio].css-checkbox + label.css-label, input[type=radio].css-checkbox + label.css-label.clr{
	padding-left:45px;
	height:34px; 
	display:inline-block;
	line-height:34px;
	background-repeat:no-repeat;
	background-position: 0 0;
	font-size:16px;
	vertical-align:middle;
	cursor:pointer;
}

input[type=radio].css-checkbox:checked + label.css-label, input[type=radio].css-checkbox + label.css-label.chk {
	background-position: 0 -124px;
}

label.css-label {
	background-image:url(/images/structure/radio-button-green.png);
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}



span.ui-button-text, span.ui-dialog-title, span.ruledescription {
	display: inline;
}

img.imagechoice {
	width:50%;
	padding:60px 30px 90px;
	background: #fff;
		-webkit-transition-property:all; 
-webkit-transition-duration: 0.3s;  
-moz-transition-property: all; 
-moz-transition-duration: 0.3s;  
-o-transition-property: all; 
-o-transition-duration: 0.3s; 
transition-property: all; 
transition-duration: 0.3s; 
transition-timing-function: ease-in-out;
}

img.imagechoice:hover {
	cursor: hand;
	cursor: pointer;
    	background: #ececed;
	-webkit-transition-property:all; 
-webkit-transition-duration: 0.3s;  
-moz-transition-property: all; 
-moz-transition-duration: 0.3s;  
-o-transition-property: all; 
-o-transition-duration: 0.3s; 
transition-property: all; 
transition-duration: 0.3s; 
transition-timing-function: ease-in-out;
}

img.imagechoice:nth-child(2) { margin-left:-1px;}

img.imagechoice.unselected {
	opacity : 0.4;
    filter: alpha(opacity=40); // msie
    background-color: #000;
}
img.imagechoice.selected {
	background: #ececed;
}
form.plan div.continuebutton, form.plan div.imgchoice {
	text-align:center;
}

#chooseprice table {
	margin-bottom:10px;
}

#chooseprice table td {font-size:0.8em; text-align:left }
#chooseprice table td:first-child { width:38%;}
#chooseprice table td input { width:auto; margin-bottom:2px;}

#closechoice,
#login-pop #closelogin {
    background: url(../../../wp-content/themes/hosting-uk-2015/images/structure/close-cross.png) 8px 8px no-repeat;
    opacity: 0.5;
    height:40px; 
    width:40px; 
    border-radius: 30px; 
    position:absolute; 
    display: block;
    top:20px; 
    right:20px; 
    cursor:pointer;
}

#closechoice:hover,
#login-pop #closelogin:hover {
    opacity: 1;
}

@media only screen and (min-width: 768px) and (max-width: 1100px)  {
    	#chooseprice .choose-inner {
            overflow-y: scroll;
        }
}


@media only screen and (min-width: 768px) {
        
    #chooseprice {
        display: none;
        background: rgba(0,0,0,0.74);
        position:fixed;
        width:100%;
        height:100%;
        top:0;
        left:0;
        z-index:9999;
    }
    
    
	#chooseprice .choose-inner {
		height: auto;
		min-height: 200px;
		background:#fff;
		padding:0px;
    	left: 50%;
    	position: absolute;
    	top: 10%;
		margin-left:-300px;
    	width: 600px;
	}
	
	#chooseprice .choose-inner h2 {
		display:block;
	}
	
	#chooseprice .choose-inner .terms .term {
		width:33%;
		float:left;
		border: none;
		border-right: 1px solid #dfdfdf;
		min-height:180px;
		margin-bottom:20px;
		background:none!important;
		padding:16px;
		-webkit-transition-property:all; 
-webkit-transition-duration: 0.3s;  
-moz-transition-property: all; 
-moz-transition-duration: 0.3s;  
-o-transition-property: all; 
-o-transition-duration: 0.3s; 
transition-property: all; 
transition-duration: 0.3s; 
transition-timing-function: ease-in-out;
	}
	
	#chooseprice .choose-inner .terms .term:hover {
		background:#f0f0f0!important;
	}
	
	#chooseprice .choose-inner .terms .term p {
		font-size:20px;
		margin-top:30px;
		margin-bottom:1px;
		float:none;
		text-align:center;
	}
	
	#chooseprice .choose-inner .terms .term p span {
		font-size:12px;
		margin-top:12px
	}
	
	
	#chooseprice .choose-inner .terms .term:last-child {
		border:none;
	}
	
	input[type=radio].css-checkbox + label.css-label, input[type=radio].css-checkbox + label.css-label.clr{
		padding:38px 0 0 0;
		height:34px; 
		display:inline-block;
		line-height:34px;
		background-repeat:no-repeat;
		background-position: 0 0;
		font-size:16px;
		vertical-align:middle;
		cursor:pointer;
		text-align:center;
		background-position: center 0;
		width:100%;
	}

	input[type=radio].css-checkbox:checked + label.css-label, input[type=radio].css-checkbox + label.css-label.chk {
		background-position: center -124px;
	}
	
	#chooseprice .choose-inner input[type="submit"] {
	display: block;
        position: absolute;
        bottom: 0px;
        margin: 0;
        border-radius: 0;
        width:100%;
	}
    
	#chooseprice .choose-inner .inner-padding {
    padding: 30px;
    }
}

.choose-inner .plat-choice {
    position: relative;
    overflow: auto;
}

.choose-inner .plat-choice:after {
    content: "or";
    color: #fff;
    position: absolute;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: block;
    text-align: center;
    background: #d4d4d4;
    bottom: 130px;
    left: 50%;
    margin-left: -20px;
    font-size: 18px;
    line-height: 38px;

}

.choose-inner a.platform {
    width: 50%;
    height: auto;
    min-height: 200px;
    background-color: #f9f9f9;
    display: block;
    float: left;
    padding: 170px 0 0 0;
    background-image: url(/images/structure/vps-windows.png);
    background-repeat: no-repeat;
    background-size: 50%;
    background-position: center center;
    text-align: center;
    text-decoration: none;
    color: #474747;
    font-size: 1.2em;
}

.choose-inner a.platform:hover {
    background-color: #ededed;
    color: #DE5636;
}

.choose-inner a.platform.win{
    margin: 0px ;
}

.choose-inner a.platform.linux{
        margin: 0; 
        background-image: url(/images/structure/vps-linux.png);
}

@media only screen and (min-width: 480px) {
.choose-inner a.platform {
    background-size: 42%;
    }
}

@media only screen and (min-width: 768px) {
    .choose-inner a.platform {
    background-size: 30%;
            min-height: 300px;
    padding: 230px 0 0 0;
    }

}

/*	==========================================================================
	CP LOGINS
	========================================================================== */ 

#login-pop {
    background: rgba(0, 0, 0, 0.74);
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 9999;
    display: none;
}

.login-inner {
  background: none;
    height: auto;
    margin: 0 5%;
    min-height: 200px;
    padding: 0;
    position: absolute;
    top: 10px;
    width: 90%;
}

.login-inner .tabs-menu {
    width: 100%;
    padding: 0;
    margin: 0;

}

.tabs-menu li {
float: left;
    width: 50%;
}

.login-inner .tabs-menu li a {
    border-top: 3px solid rgba(0,0,0,0);
    background: rgba(0,0,0,0.08);
    padding: 20px 10px;
    width: 100%;
    display: block;
    font-size: 1.3em;
    text-align: center;
    color: #fff;
}


.login-inner .tab {
    background-color: #fff;
    float: left;
    margin-bottom: 20px;
    width: auto;
}

.login-inner .tabs-menu li.current a {
    border-top: 3px solid #DE5636; 
    background: #fff;
    color: #575757;
}


.login-inner h2 {
    color: #fff;
    text-transform: uppercase;
    padding-right: 40px;
    text-align: left !important;
font-weight: normal !important;
margin: 20px 0 !important;
line-height: 1em !important;
}


.login-inner .contents {
    background: #fff;
    padding: 30px;
    width: 100%;

}

#cp2 {
 display: block;   
}


.login-inner .tab-content {
    display: none;
}


.login-inner .contents .textinput {
    display: block;
    background: #efefef;
    width: 100%;
    padding: 0;
    margin-bottom: 16px;
    position: relative;
}

.login-inner .contents .textinput:before {
    background: url(../../../wp-content/themes/hosting-uk-2015/images/structure/login-icons.png) 15px 15px no-repeat #ddd;
    width: 60px;
    height: 100%;
    position: absolute;
    top:0;
    left: 0;
    display: block;
    content: "";
   
}

.login-inner .contents .textinput.pw:before {
    background: url(../../../wp-content/themes/hosting-uk-2015/images/structure/login-icons.png) 16px -55px no-repeat #ddd;   
}

.login-inner .contents  .textinput input {
    display: block;
    background: none;
    width: 100%;
    padding: 16px 16px 16px 76px;
    border: 1px solid #efefef;
    font-size: 1.4em;
}


.login-inner .contents input.btn {
	background: #de5636;
	padding:10px 22px;
	font-size:1.4em;
	color:#fff;
	text-decoration:none;
	border-radius: 4px;
	display:block;
	text-align:center;
	border: none;
	margin-bottom:16px;
    width: 100%;
}


.login-inner a.accordion_tabs {
    border-bottom: 1px solid #ddd;
    border-top: 1px solid #ddd;
    margin: -1px -30px 0;
    padding: 30px;
    background: #fff;
    font-weight: 700; 
    color: #030303;
    position: relative;
}




.login-inner .tab_content {
    padding-top: 30px;
}

@media only screen and (min-width: 768px) {
    .login-inner .contents {
    padding: 50px 50px 40px;
}  
        
}



@media only screen and (min-width: 1024px) {

.login-inner {
  background: none;
    height: auto;
    left: 50%;
    margin-left: -250px;
    min-height: 200px;
    padding: 0;
    position: absolute;
    top: 20%;
    width: 500px;
}
    

    
    }



/*	==========================================================================
	Further Info
	========================================================================== */ 

#further-info {
    background: #fafbfd;
    overflow: auto;
    border-top: 1px solid #eee;
    padding: 50px;
    text-align: center;
}

#further-info p {
    margin:14px auto 30px;
    color: #575757;
    max-width: 600px;
    font-size: 1.5em;
    text-align: center;
    font-weight: 300;
}

#further-info h2 {
    color: #030303;
    margin-top: 0px;
    text-align: center;
    background: url(/images/content/backgrounds/info-standard-header.png) no-repeat center 0;
    padding-top: 40px;
}

#further-info a.btn, #further-info .btn {

	display:inline-block;
	text-align:center;
	margin:0 auto;
} 


@media only screen and (min-width: 1024px) {
    #further-info a.btn, #further-info .btn {
	margin-top:4px;
} 
}

/*	==========================================================================
	Warning or important info box
	========================================================================== */ 

.warning-box {
    background: #F3F3F5;
    border: 1px dotted #ebebeb;
    padding: 20px;
    overflow: auto;
    margin: 20px 0;
    font-size: 0.7em; 
}

.warning-box h3 {
    margin: 0 0 12px 0;
    padding: 0;
}

/*	==========================================================================
	Footer
	========================================================================== */ 

footer {
	clear:both;
	padding:40px;
	background:#f3f3f5;
}
footer p {
	text-align:center;
}

#partners {
	text-align:center;
	display:none;
	padding: 0 0 40px 0
}


/* scroll to top pop-up */
#to-top{position:fixed; right:0; top:90%; border-left:1px solid #fff; border-top:1px solid #fff; border-bottom:1px solid #fff; display:none;}
#to-top:hover{cursor:pointer;}

@media only screen and (min-width: 768px) {
	#partners {
		display:block;
	}
}

/*	==========================================================================
	Banners/Ads - Full width
	========================================================================== */ 

.full-ad { 
	width:100%;
	background: #fff;
	min-height:100px;
	text-align:center;
	padding:50px;
	visibility:hidden;
}
a.twitter h3 {
    	color:#dc5d3f;
	font-size:2.8em;
	font-style:italic;
	font-weight:700;
	display:inline-block;
	margin:0;
	word-wrap: break-word;
	position:relative;
	padding:66px 0 0 0;
}

a.twitter h3:before {
	content:"";
	background: url(/images/content/banners/twitter.png) no-repeat;
	display:block;
	height:48px;
	width:45px;
	position:absolute;
	left:50%;
	top:0px;
    margin-left: -23px;
	
}
a.twitter p {
	margin:0;
}


a.twitter span {
	color: #252a34;
}

a.twitter:hover {
	text-decoration: none!important;
	opacity:0.84;
}



@media only screen and (min-width: 768px) {
    a.twitter h3 {
	font-size:4.8em;
	padding:0 0 0 66px;
}
    
    a.twitter h3:before {
	left:0;
	top:8px;
        margin:0;
	
}
}





/* ==|== non-semantic helper classes ========================================
   Please define your styles before this section.
   ========================================================================== */

/* For image replacement */
.ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; *line-height: 0; }
.ir br { display: none; }

/* Hide from both screenreaders and browsers: h5bp.com/u */
.hidden { display: none !important; visibility: hidden; }

/* Hide only visually, but have it available for screenreaders: h5bp.com/v */
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }

/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: h5bp.com/p */
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }

/* Hide visually and from screenreaders, but maintain layout */
.invisible { visibility: hidden; }

/* Contain floats: h5bp.com/q */
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }



/* ==|== print styles =======================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */

@media print {
  * { background: transparent !important; color: black !important; box-shadow:none !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: h5bp.com/s */
  a, a:visited { text-decoration: underline; }
  a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }  /* Don't show links for images, or javascript/internal links */
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; } /* h5bp.com/t */
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { page-break-after: avoid; }
}

/* FANCYBOX */

/*
 * FancyBox - jQuery Plugin
 * Simple and fancy lightbox alternative
 *
 * Examples and documentation at: http://fancybox.net
 * 
 * Copyright (c) 2008 - 2010 Janis Skarnelis
 * That said, it is hardly a one-person project. Many people have submitted bugs, code, and offered their advice freely. Their support is greatly appreciated.
 * 
 * Version: 1.3.4 (11/11/2010)
 * Requires: jQuery v1.3+
 *
 * Dual licensed under the MIT and GPL licenses:
 *   http://www.opensource.org/licenses/mit-license.php
 *   http://www.gnu.org/licenses/gpl.html
 */

#fancybox-loading {
	position: fixed;
	top: 50%;
	left: 50%;
	width: 40px;
	height: 40px;
	margin-top: -20px;
	margin-left: -20px;
	cursor: pointer;
	overflow: hidden;
	z-index: 2001;
	display: none;
}

#fancybox-loading div {
	position: absolute;
	top: 0;
	left: 0;
	width: 40px;
	height: 480px;
	background-image: url(/images/structure/fancybox/fancybox.png);
}

#fancybox-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 2000;
	display: none;
}

#fancybox-tmp {
	padding: 0;
	margin: 0;
	border: 0;
	overflow: auto;
	display: none;
}

#fancybox-wrap {
	position: absolute;
	top: 0;
	left: 0;
	padding: 20px;
	z-index: 2001;
	outline: none;
	display: none;
    overflow: hidden;
}

#fancybox-outer {
	position: relative;
	width: 100%;
	height: 100%;
	background: #fff;
}

#fancybox-content {
	width: 0;
	height: 0;
	padding: 0;
	outline: none;
	position: relative;
	overflow: hidden;
	z-index: 2002;
	border: 0px solid #fff;
    background: #fff;
    border: 0;
}

#fancybox-content div{
    margin: 30px;
}

#fancybox-hide-sel-frame {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: transparent;
	z-index: 2001;
}

#fancybox-close {
	position: absolute;
	top: 27px;
	right: 5px;
	width: 20px;
	height: 20px;
	background: transparent url(/images/structure/fancybox/fancy_close.png);
	cursor: pointer;
	z-index: 2003;
	display: none;
}

#fancybox-error {
	color: #444;
	font: normal 12px/20px Arial;
	padding: 14px;
	margin: 0;
}

#fancybox-img {
	width: 100%;
	height: 100%;
	padding: 0;
	margin: 0;
	border: none;
	outline: none;
	line-height: 0;
	vertical-align: top;
}

#fancybox-frame {
	width: 100%;
	height: 100%;
	border: none;
	display: block;
}

#fancybox-left, #fancybox-right {
	position: absolute;
	bottom: 0px;
	height: 100%;
	width: 35%;
	cursor: pointer;
	outline: none;
	background: transparent url(/images/structure/fancybox/blank.gif);
	z-index: 2002;
	display: none;
}

#fancybox-left {
	left: 0px;
}

#fancybox-right {
	right: 0px;
}

#fancybox-left-ico, #fancybox-right-ico {
	position: absolute;
	top: 50%;
	left: -9999px;
	width: 30px;
	height: 30px;
	margin-top: -15px;
	cursor: pointer;
	z-index: 2002;
	display: block;
}

#fancybox-left-ico {
	background-image: url(/images/structure/fancybox/fancybox.png);
	background-position: -40px -30px;
}

#fancybox-right-ico {
	background-image: url(/images/structure/fancybox/fancybox.png);
	background-position: -40px -60px;
}

#fancybox-left:hover, #fancybox-right:hover {
	visibility: visible; /* IE6 */
}

#fancybox-left:hover span {
	left: 20px;
}

#fancybox-right:hover span {
	left: auto;
	right: 20px;
}

.fancybox-bg {
	position: absolute;
	padding: 0;
	margin: 0;
	border: 0;
	width: 20px;
	height: 20px;
	z-index: 2001;
}

#fancybox-bg-n {
	top: -20px;
	left: 0;
	width: 100%;
	background-image: url(/images/structure/fancybox/fancybox-x.png);
}

#fancybox-bg-ne {
	top: -20px;
	right: -20px;
	background-image: url(/images/structure/fancybox/fancybox.png);
	background-position: -40px -162px;
}

#fancybox-bg-e {
	top: 0;
	right: -20px;
	height: 100%;
	background-image: url(/images/structure/fancybox/fancybox-y.png);
	background-position: -20px 0px;
}

#fancybox-bg-se {
	bottom: -20px;
	right: -20px;
	background-image: url(/images/structure/fancybox/fancybox.png);
	background-position: -40px -182px; 
}

#fancybox-bg-s {
	bottom: -20px;
	left: 0;
	width: 100%;
	background-image: url(/images/structure/fancybox/fancybox-x.png);
	background-position: 0px -20px;
}

#fancybox-bg-sw {
	bottom: -20px;
	left: -20px;
	background-image: url(/images/structure/fancybox/fancybox.png);
	background-position: -40px -142px;
}

#fancybox-bg-w {
	top: 0;
	left: -20px;
	height: 100%;
	background-image: url(/images/structure/fancybox/fancybox-y.png);
}

#fancybox-bg-nw {
	top: -20px;
	left: -20px;
	background-image: url(/images/structure/fancybox/fancybox.png);
	background-position: -40px -122px;
}

#fancybox-title {
	font-family: Verdana;
	font-size: 17px;
	z-index: 2002;
	background:#eee; 
	margin: 6px 0 0 0px;
	padding:7px;
	border:1px solid #dedede;
}

.fancybox-title-inside {
	padding-bottom: 10px;
	text-align: left;
	color: #333;
	background: #fff;
	position: relative;
}

.fancybox-title-outside {
	padding-top: 10px;
	color: #fff;
}

.fancybox-title-over {
	position: absolute;
	bottom: 0;
	left: 0;
	color: #FFF;
	text-align: left;
}

#fancybox-title-over {
	padding: 10px;
	background-image: url(/images/structure/fancybox/fancybox_title_over.png);
	display: block;
}

.fancybox-title-float {
	position: absolute;
	left: 5px!important;
	top: -20px;
	height: 32px;
}

#fancybox-title-float-wrap {
	border: none;
	border-collapse: collapse;
	width: auto;
}

#fancybox-title-float-wrap td {
	border: none;
	white-space: nowrap;
}

#fancybox-title-float-left {
	padding: 0 0 0 15px;
	background: url(/images/structure/fancybox/fancybox.png) -40px -90px no-repeat;
}

#fancybox-title-float-main {
	color: #2f2f2f;
	line-height: 29px;
	font-weight: normal;
	padding: 0 0 3px 0;
	background: url(/images/structure/fancybox/fancybox-x.png) 0px -40px;
}

#fancybox-title-float-right {
	padding: 0 0 0 15px;
	background: url(/images/structure/fancybox/fancybox.png) -55px -90px no-repeat;
}

/* IE6 */

.fancybox-ie6 #fancybox-close { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/beta/images/site-layout/fancybox/fancy_close.png', sizingMethod='scale'); }

.fancybox-ie6 #fancybox-left-ico { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/beta/images/site-layout/fancybox/fancy_nav_left.png', sizingMethod='scale'); }
.fancybox-ie6 #fancybox-right-ico { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/beta/images/site-layout/fancybox/fancy_nav_right.png', sizingMethod='scale'); }

.fancybox-ie6 #fancybox-title-over { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/beta/images/site-layout/fancybox/fancy_title_over.png', sizingMethod='scale'); zoom: 1; }
.fancybox-ie6 #fancybox-title-float-left { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/beta/images/site-layout/fancybox/fancy_title_left.png', sizingMethod='scale'); }
.fancybox-ie6 #fancybox-title-float-main { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/beta/images/site-layout/fancybox/fancy_title_main.png', sizingMethod='scale'); }
.fancybox-ie6 #fancybox-title-float-right { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/beta/images/site-layout/fancybox/fancy_title_right.png', sizingMethod='scale'); }

.fancybox-ie6 #fancybox-bg-w, .fancybox-ie6 #fancybox-bg-e, .fancybox-ie6 #fancybox-left, .fancybox-ie6 #fancybox-right, #fancybox-hide-sel-frame {
	height: expression(this.parentNode.clientHeight + "px");
}

#fancybox-loading.fancybox-ie6 {
	position: absolute; margin-top: 0;
	top: expression( (-20 + (document.documentElement.clientHeight ? document.documentElement.clientHeight/2 : document.body.clientHeight/2 ) + ( ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop )) + 'px');
}

#fancybox-loading.fancybox-ie6 div	{ background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/beta/images/site-layout/fancybox/fancy_loading.png', sizingMethod='scale'); }

/* IE6, IE7, IE8 */

.fancybox-ie .fancybox-bg { background: transparent !important; }

.fancybox-ie #fancybox-bg-n { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/beta/images/site-layout/fancybox/fancy_shadow_n.png', sizingMethod='scale'); }
.fancybox-ie #fancybox-bg-ne { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/beta/images/site-layout/fancybox/fancy_shadow_ne.png', sizingMethod='scale'); }
.fancybox-ie #fancybox-bg-e { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/beta/images/site-layout/fancybox/fancy_shadow_e.png', sizingMethod='scale'); }
.fancybox-ie #fancybox-bg-se { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/beta/images/site-layout/fancybox/fancy_shadow_se.png', sizingMethod='scale'); }
.fancybox-ie #fancybox-bg-s { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/beta/images/site-layout/fancybox/fancy_shadow_s.png', sizingMethod='scale'); }
.fancybox-ie #fancybox-bg-sw { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/beta/images/site-layout/fancybox/fancy_shadow_sw.png', sizingMethod='scale'); }
.fancybox-ie #fancybox-bg-w { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/beta/images/site-layout/fancybox/fancy_shadow_w.png', sizingMethod='scale'); }
.fancybox-ie #fancybox-bg-nw { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/beta/images/site-layout/fancybox/fancy_shadow_nw.png', sizingMethod='scale'); }

/*	========================================================================== 
	Navigation
	========================================================================== */

/*-----Top Nav ---- */

#topnav {
    float: right;
    display: none;
    font-size: 0.9em;
    padding: 11px 0;
}
#topnav ul li {
    display: table-cell;
    line-height: 1.2em;
    color: #929bad;
}
#topnav ul li:after {
    content: "/";
    padding: 0 8px;
    color: #929bad;
}
#topnav ul li:last-child:after {
    content: "";
    padding: 0px
}
#topnav ul li a {
    color: #929bad;
    text-decoration: none;
}

#topnav ul li a:hover {
    color: #454545;
}
@media only screen and (min-width: 820px) {
    #topnav {
        display: inline-block;
    }
}
@media only screen and (min-width: 1024px) {
    #topnav {
        padding: 19px 0;
    }
}
/*----- Main Nav ---- */

nav {
    width: 100%;
    clear: both;
    background: #f3f6f9;
    display: block;
}
nav ul {
    padding: 0;
}
nav ul li {
    display: block;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}
nav ul li a {
    color: #fff;
    line-height: 1.6em;
    padding: 12px 14px;
    display: block;
    text-decoration: none;
    border-left: 3px solid transparent;
    font-weight: 600;
    text-transform: uppercase;
    text-rendering: auto;
    -webkit-transition-property: all;
    -webkit-transition-duration: 0.3s;
    -moz-transition-property: all;
    -moz-transition-duration: 0.3s;
    -o-transition-property: all;
    -o-transition-duration: 0.3s;
    transition-property: all;
    transition-duration: 0.3s;
    transition-timing-function: ease-in-out;
}
nav ul li a:hover {
    color: #fff;
    text-decoration: none;
    background-color: rgba(255, 255, 255, 0.05);
    border-left: 3px solid #de5636;
    color: #de5636;
    -webkit-transition-property: all;
    -webkit-transition-duration: 0.3s;
    -moz-transition-property: all;
    -moz-transition-duration: 0.3s;
    -o-transition-property: all;
    -o-transition-duration: 0.3s;
    transition-property: all;
    transition-duration: 0.3s;
    transition-timing-function: ease-in-out;
}
nav ul li a.active {
    color: #fff;
    background: #de5636;
    border-left: 3px solid #de5636;
}
@media only screen and (min-width: 820px) {
    nav {
        border-top: 1px solid #e2ebfa;
        height: 60px;
        position: relative;
    }
    nav ul {
        margin: 0 auto;
        width: 100%;
        text-align: center;
        display: table;
        margin-top: 8px
    }
    nav ul li {
        border: none;
        padding: 0;
        display: table-cell;
        margin: 6px 1px 6px 0;
    }
    

    
    nav ul li:last-child {
        margin-right: 0;
    }
    nav ul li a {
        display: inline-block;
        font-size: 0.9em;
        padding: 6px 6px;
        border: none;
        color: #33393f;
    }
    nav ul li a:hover {
        background: #d8dce0;
        text-decoration: none;
        border-radius: 4px;
        border: none;
        color: #424a51
    }
    nav ul li a.active {
        color: #fff;
        background: #3ea1c3;
        text-decoration: none;
        border-radius: 4px;
        border: none;
    }
    #show-nav {
        display: none;
    }
}


    nav ul li.desktop-only {
        display: none;
    }    
    nav.nav-scrolled ul li.desktop-only {
        display: table-cell;
    }
    nav.nav-scrolled ul li.desktop-only a {
        background: #DE5636;
        color: #fff;
        border-radius: 4px;
    }
    nav.nav-scrolled ul li.desktop-only a:hover {
        background: #f16240;
        color: #fff
    }

@media only screen and (min-width: 1024px) {
    nav ul {
        width: 1006px;
        margin-top: 12px;
    }
    nav ul li a {
        font-size: 1em;
        padding: 7px 10px;
    }
}
html,
body,
#sb-site,
.sb-site-container,
.sb-slidebar {
    /* Set box model to prevent any user added margins or paddings from altering the widths or heights. */
    margin: 0;
    padding: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
html,
body {
    width: 100%;
}
html {
    height: 100%;
    /* Site is as tall as device. */
    overflow-x: hidden;
    /* Stops horizontal scrolling. */
}
body {
    min-height: 100%;
    height: auto;
    position: relative;
    /* Required for static Slidebars to function properly. */
}
/* Site scroll locking - prevent site from scrolling when a Slidebar is open, except when static Slidebars are only available. */

html.sb-scroll-lock.sb-active:not(.sb-static) {
    overflow: hidden;
}
/* ----------
 * 002 - Site
 */

#sb-site,
.sb-site-container {
    /* You may now use class .sb-site-container instead of #sb-site and use your own id. However please make sure you don't set any of the following styles any differently on your id. */
    z-index: 1;
    /* Site sits above Slidebars */
    background: #f3f3f5;
}
/* ---------------
 * 003 - Slidebars
 */

@media only screen and (max-width: 830px) {
    .sb-slidebar {
        height: 100%;
        overflow-y: auto;
        /* Enable vertical scrolling on Slidebars when needed. */
        position: fixed;
        top: 0;
        left: 0;
        z-index: 0;
        /* Slidebars sit behind sb-site. */
        display: none;
        /* Initially hide the Slidebars. Changed from visibility to display to allow -webkit-overflow-scrolling. */
        background-color: #222222;
        /* Default Slidebars background colour, overwrite this with your own css. */
        -webkit-transform: translate(0px);
        /* Fixes issues with translated and z-indexed elements on iOS 7. */
    }
    .sb-left {
        left: 0;
        /* Set Slidebar to the left. */
    }
    html.sb-static .sb-slidebar,
    .sb-slidebar.sb-static {
        position: absolute;
        /* Makes Slidebars scroll naturally with the site, and unfixes them for Android Browser < 3 and iOS < 5. */
    }
    .sb-slidebar.sb-active {
        display: block;
        /* Makes Slidebars visibile when open. Changed from visibility to display to allow -webkit-overflow-scrolling. */
        left: -280px;
    }
    .sb-style-overlay {
        z-index: 9999;
        /* Set z-index high to ensure it overlays any other site elements. */
    }
    .sb-momentum-scrolling {
        -webkit-overflow-scrolling: touch;
        /* Adds native momentum scrolling for iOS & Android devices. */
    }
    /* Slidebar widths for browsers/devices that don't support media queries. */
    .sb-slidebar {
        width: 280px;
    }
    /* ---------------
	 * 004 - Animation
	 */
    .sb-slide,
    #sb-site,
    .sb-site-container,
    .sb-slidebar {
        -webkit-transition: -webkit-transform 400ms ease;
        -moz-transition: -moz-transform 400ms ease;
        -o-transition: -o-transform 400ms ease;
        transition: transform 400ms ease;
        -webkit-transition-property: -webkit-transform, left, right;
        /* Add left/right for Android < 4.4. */
        -webkit-backface-visibility: hidden;
        /* Prevents flickering. This is non essential, and you may remove it if your having problems with fixed background images in Chrome. */
    }
    /* --------------------
	 * 005 - Helper Classes
	 */
    .sb-hide {
        display: none;
        /* Optionally applied to control classes when Slidebars is disabled over a certain width. */
    }
}
.sb-toggle-left {
    padding: 20px;
}
.sb-toggle-left .navicon-line {
    background-color: #71777d;
    border-radius: 1px;
    height: 4px;
    margin-bottom: 3px;
    width: 24px;
    cursor: pointer;
}
@media (min-width: 830px) {
    .sb-toggle-left {
        display: none;
    }
    
.nav-scrolled {
  position: fixed;
  width: 100%;
  top: 0;
    z-index: 12;
    box-shadow: 0 0.03em 0.2em #000;
} 
    
}
/*----- Sub Nav ---- */

.subnav {
    display: table;
    width: 90%;
    margin: 0 auto;
}
.subnav ul#nav {
    padding: 0;
    overflow: hidden;
    display: table-row;
    width: 100%;
    text-align: center;
}
.subnav ul#nav li {
    list-style: none;
    display: table-cell;
    width: auto;
    padding: 0;
}
.subnav ul#nav li a {
    display: block;
    padding: 18px 10px;
    text-decoration: none;
    font-size: 15px;
    font-weight: 400;
    min-height: 80px;
    color: #fff;
    background-color: rgba(40, 40, 40, 0.6);
}
.subnav ul#nav li:first-child a {
    border-left: none;
    border-radius: 4px 0 0 0;
}
.subnav ul#nav li:last-child a {
    border-left: none;
    border-radius: 0 4px 0 0;
}
.subnav ul#nav li a:hover {
    color: #fff;
    background-color: rgba(40, 40, 40, 0.4)
}
.subnav ul#nav .active a,
.subnav ul#nav li.active a:hover {
    color: #2d3646;
    background-color: #fff;
}

@media only screen and (min-width: 860px) {
.subnav ul#nav li a {
    min-height: 40px;
}
}
/*----- Bottom Nav ---- */

#bottom-nav {
    width: 100%;
    overflow: auto;
    clear: both;
    background: #e8eaee;
    display: none;
    margin-bottom: 30px;
}
#bottom-nav ul {
    padding: 0;
}
#bottom-nav ul li a {
    color: #5c719b;
    line-height: 1.6em;
    padding: 12px 10px;
}
#bottom-nav ul li a:hover {
    color: #fff;
}
#bottom-nav ul li a.active {
    color: #fff;
    background: #2d3646
}
@media only screen and (min-width: 768px) {
    #bottom-nav {
        width: 100%;
        display: block;
    }
    #bottom-nav ul {
        margin: 0 auto;
        text-align: center
    }
    #bottom-nav ul li {
        border-bottom: 0;
        padding: 0;
        display: inline-block;
        margin: 0;
    }
    #bottom-nav ul li a {
        display: inline-block;
        font-size: 1em;
    }
    #bottom-nav ul li a:hover {
        color: #5c719b;
        text-decoration: underline;
    }
}

























@media only screen and (max-width: 600px){
    #wpadminbar{ top: -46px; }
}
    
#primary{
    float: left;
    width: 67%;
}

#primary p{
    font-size: 15px;
    color: #575757;
    line-height: 24px;
    margin-bottom: 25px;
}

#secondary{
    float: right;
    background: #fff;
    padding: 50px;
    width: 30%;
}

#secondary ul{
    padding: 0;
}

#secondary ul li a{
    font-size: 15px;
}

h1.entry-title{
    font-weight: 300;
    margin: 0;
    line-height: 1.3em;
}

h1.entry-title a{
    color:#575757;
}

h1.entry-title a:hover{
    text-decoration: none;
}

h1.widget-title{
    font-weight: 300;
    font-size: 22px;
    margin-bottom: 10px;
    margin-top: 40px;
}

footer.entry-footer{
    background: #fff;
    padding: 0;
    font-size: 15px;
    color: #575757;
    padding-top: 10px;
    border-top: 1px solid #ddd;
    margin-top: 40px;
}

div.content-area #main{
    padding: 50px;
}

div.entry-meta{
    font-size: 13px;
    margin-bottom: 10px;
    background: #f0f0f0;
    padding: 10px;
    margin-top: 10px;
    color: #575757;
}

article.post{
    margin-bottom: 40px;
}

.single-post article.post{
    margin-bottom: 0;
}

#searchform input[type="text"]{
    font-size: 15px;
    padding: 6px;
    width: 100%;
}

#searchform input[type="submit"]{
    float: right;
    margin-top:-36px;
    background: #de5636;
    color: #fff;
    border: 0;
    font-size: 15px;
    padding: 8px;
    position:relative;
}

a.moretag{
    display: block;
background: #de5636;
color: #fff;
padding: 5px 0px;
width: inherit;
max-width: 120px;
text-align: center;
    border-radius: 4px;
    margin-top: 15px;
    font-size: 13px;
}

a.moretag:hover{
    text-decoration: none;
    background: #f28970;
}

#comments{
    display: none;
}

div.breadcrumbs{
    font-size: 15px;
    color: #575757;
    margin-bottom: 30px;
    border-bottom: 1px solid #ddd;
    padding-bottom: 10px;
}

time.updated{
    display: none;
}

time.entry-date.published.updated{
    display: inline-block;
}

span.byline{
    float: right;
}

div.pagination{
    font-size: 15px;
    color: #575757;
    padding-top: 20px;
    border-top: 1px solid #ddd;
}

div.pagination .page-numbers{
    background: #f0f0f0;
    color: #575757;
    padding: 5px 10px;
}

div.pagination .page-numbers.current{
    background: #de5636;
    color: #fff;
}

a.post-edit-link{
    display: none;
}

div.featured-image{
    max-height: 300px;
    overflow: hidden;
    margin-bottom: 20px;
}

div.featured-image img{
    height: auto;
	width: 100%;
}

div.homepage-featured-image{
    max-height: 300px;
    overflow: hidden;
    position: relative;
}

div.homepage-featured-image img{
    height: auto;
	width: 100%;
}

div.homepage-featured-image h1{
    position: absolute;
    background: #fff;
    bottom: 20px;
    border-left: 5px solid #de5636;
    padding: 10px;
}

img.alignleft{
float: left;
margin-right: 30px;
margin-bottom: 25px;
}

img.alignright{
float: right;
margin-left: 30px;
margin-bottom: 25px;
}

.entry-content hr{
    clear: both;
    margin: 30px 0 25px 0;
}

@media only screen and (max-width:768px){
 
    #primary{
        float: none;
        width: 100%;
        max-width: 100%;
    }
    
    div.content-area #main{
        padding: 10px;
    }
    
    #secondary{
        float: none;
        width: 100%;
        max-width: 100%;
        padding: 10px;
        margin-top: 30px;
        margin-bottom: 30px;
    }
    
}

.entry-content ul{
	list-style: initial;
padding-left: 40px;
margin-bottom: 20px;
}

.entry-content ul li{
  font-size: 15px;
  line-height: 24px;
}