body {
    -webkit-animation-delay: 0.1s;
    -webkit-animation-name: fontfix;
    -webkit-animation-duration: 0.1s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear;
}

.site-content .videodemo {

display: none
}

ol li p {
   margin: 0;
   display: inline;
}

.hazard-border {
  border: 10px solid pink!important;
  border-image: repeating-linear-gradient(
    -55deg,
    #000,
    #000 20px,
    #ffb101 20px,
    #ffb101 40px
  ) 10!important;
  display: inline-block;
  padding: 15px;
  margin: 20px 0 20px 0;
  background-color: #fff5d4;
width: 100%;
}

.hazard-border p {
  font-size: 17px;
  padding-bottom: 0;
  margin-bottom: 0;
}

.domaincat.selected, .domaincat.selected:hover {
background-color: #eee;
}

.highlight-text {
	color: #42474b;
	font-weight: bold;
	background: transparent;
	padding: 0;
}

.alert .highlight-text {
	color: #fff;
}

.alert a {
	text-decoration: underline;
	color: #fff;
}

.alert p {
	margin:0;
	margin-bottom: 10px;
}

.alert p:last-child {
    margin-bottom: 0;
}


.site-content .alert h3, .site-content .alert h4 {
    font-size: 20px;
    color: #fff;
}

.site-content p, .site-content .alert, .site-content span {
	font-size: 17px!important;
	line-height: 30px!important;
}

.site-content span, .site-content p span {
	font-family: Muli, sans-serif!important;
}

.site-content ul li, .site-content ol li {
	font-size: 17px;
	line-height: 30px;
	margin-bottom: 8px;
}


.domaincat .badge {
   position: relative;
   top: 5px;
   background-color: #ccc!important;
}

.domaincat.selected .badge, .domaincat.selected:hover .badge {
background-color: white;
}

.pricelists h3, .pricelists h5 {
	line-height: 50px;
	margin:0;
}

.pricelists .badge {
	position: relative;
	top: -2px;
}

.nooutline:focus, .nooutline:focus{
    outline: 0;
}

.popover-medium {
    max-width: 600px;
}

@-webkit-keyframes fontfix {
    from { opacity: 1; }
    to   { opacity: 1; }
}

/* Client Tickets */

.helpdeskfeedback {
 display: block;
 text-align: center;
 border-radius: 8px;
}

.helpdeskfeedback:hover, .helpdeskfeedback:focus {
 background: #dcecf9;
 color: #1f5f93;
 text-decoration: underline;
}

/* The ticket's action buttons (Kayako's viewticket template floats them right with inline styles) */
#showSecureData.btn, #closeticket.btn, input[name="postreply"].btn, .helpdesksubmit input[type="submit"].btn {
	height: 40px;
	margin: 0 0 8px 8px !important;
	padding: 0 16px;
	border-radius: 6px;
	background-image: none;
	box-shadow: none;
	text-shadow: none;
	font-size: 14px;
	font-weight: 600;
	line-height: 38px;
	transition: background-color .15s, border-color .15s;
}

input[name="postreply"].btn, .helpdesksubmit input[type="submit"].btn {
	border: 1px solid #2b8ad6 !important;
	background: #2b8ad6 !important;
	color: #fff !important;
}

input[name="postreply"].btn:hover, .helpdesksubmit input[type="submit"].btn:hover {
	border-color: #1f74b9 !important;
	background: #1f74b9 !important;
}

#showSecureData.btn {
	border: 1px solid #b9cde0 !important;
	background: #fff !important;
	color: #1f5f93 !important;
}

#showSecureData.btn:hover {
	background: #eaf4fd !important;
}

#closeticket.btn {
	border: 1px solid #e3b8b8 !important;
	background: #fff !important;
	color: #b03a3a !important;
}

#closeticket.btn:hover {
	background: #fdf0f0 !important;
}

.helpdesksubmit input[type="submit"].btn {
	margin: 0 !important;
}

@media (max-width: 479px) {
	#showSecureData.btn, #closeticket.btn, input[name="postreply"].btn {
		display: block;
		float: none !important;
		width: 100%;
		margin: 0 0 8px !important;
	}
}

/* Jump to the top or the latest reply on a long ticket (templates/kayako/viewticket.tpl) */
.kq-jump {
	position: fixed;
	right: 16px;
	bottom: 16px;
	z-index: 1000;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.kq-jump[hidden] { display: none; }

.kq-jump-btn {
	width: 44px;
	height: 44px;
	padding: 0;
	border: 1px solid #cfe3f5;
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 2px 8px rgba(31, 42, 55, .18);
	color: #1f5f93;
	font-size: 16px;
	line-height: 42px;
	text-align: center;
	cursor: pointer;
}

.kq-jump-btn:hover, .kq-jump-btn:focus { background: #eaf4fd; outline: none; }
.kq-jump-btn[hidden] { display: none; }
/* Ticket thread (task 13236). Kayako prints each reply as a .posttitle (name and date) followed by a .rowpost (the
   body); the two are drawn as one card. Staff replies carry a Kualo marker and a blue edge. The body is staff Markdown,
   so its headings, lists, code and tables are styled here, scoped to the thread. */

.posttitle {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 2px 10px;
	margin: 0;
	padding: 10px 14px;
	border: 1px solid #dfe5ec;
	border-bottom: 0;
	border-radius: 8px 8px 0 0;
	background: #f4f6f9;
	color: #6b7684;
	font-size: 13px;
}

.posttitle.staff {
	border-color: #cfe3f5;
	background: #eaf4fd;
	box-shadow: inset 3px 0 0 #2b8ad6;
}

.ticketpostname {
	color: #1f2a37;
	font-weight: 600;
	font-size: 15px;
}

.posttitle.staff .ticketpostname:after {
	content: 'Kualo';
	display: inline-block;
	margin-left: 8px;
	padding: 1px 7px;
	border-radius: 10px;
	background: #2b8ad6;
	color: #fff;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .02em;
	vertical-align: 1px;
}

.postedat {
   font-size: 10px;
   position: relative;
   top: -20px;
}

.rowpost {
	position: relative;
	margin: 0 0 22px;
	padding: 14px 14px 2px;
	border: 1px solid #dfe5ec;
	border-radius: 0 0 8px 8px;
	background: #fff;
	color: #1f2a37;
	font-size: 15px;
	line-height: 1.6;
	overflow-wrap: break-word;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
	-webkit-tap-highlight-color: transparent;
}

.rowpost.staff {
	border-color: #cfe3f5;
	box-shadow: inset 3px 0 0 #2b8ad6;
}

@media (min-width: 768px) {
	.posttitle { padding: 11px 20px; }
	.rowpost { padding: 18px 20px 4px; }
}

.rowpost .mediumtext { display: block; }
.rowpost .mediumtext > :first-child, .kq-md-preview > :first-child { margin-top: 0; }
.rowpost p, .kq-md-preview p { margin: 0 0 12px; }

.rowpost h1, .rowpost h2, .rowpost h3, .rowpost h4, .rowpost h5, .rowpost h6, .kq-md-preview h1, .kq-md-preview h2, .kq-md-preview h3, .kq-md-preview h4, .kq-md-preview h5, .kq-md-preview h6 {
	margin: 22px 0 8px;
	color: #1f2a37;
	font-weight: 600;
	line-height: 1.3;
}
.rowpost h1, .rowpost h2, .kq-md-preview h1, .kq-md-preview h2 { font-size: 19px; }
.rowpost h3, .kq-md-preview h3 { font-size: 17px; }
.rowpost h4, .kq-md-preview h4 { font-size: 16px; }
.rowpost h5, .rowpost h6, .kq-md-preview h5, .kq-md-preview h6 { font-size: 15px; }

.rowpost ul, .rowpost ol, .kq-md-preview ul, .kq-md-preview ol { margin: 0 0 12px; padding-left: 22px; }
.rowpost ul, .kq-md-preview ul { list-style: disc outside; }
.rowpost li, .kq-md-preview li { margin: 3px 0; line-height: 1.55; }
.rowpost li > p, .kq-md-preview li > p { margin: 0; }
.rowpost li ul, .rowpost li ol, .kq-md-preview li ul, .kq-md-preview li ol { margin: 4px 0; }

.rowpost code, .kq-md-preview code {
	padding: .12em .38em;
	border: 0;
	border-radius: 4px;
	background: #eef1f5;
	color: #1f2a37;
	font-family: SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
	font-size: .84em;
	white-space: normal;
	overflow-wrap: anywhere;
}

.rowpost pre, .kq-md-preview pre {
	margin: 0 0 14px;
	padding: 12px 14px;
	border: 0;
	border-radius: 6px;
	background: #1f2430;
	color: #e6e9ef;
	font-size: 13px;
	line-height: 1.5;
	white-space: pre;
	word-break: normal;
	overflow-x: auto;
}

.rowpost pre code, .rowpost pre code.hljs, .kq-md-preview pre code, .kq-md-preview pre code.hljs {
	padding: 0;
	background: transparent;
	color: inherit;
	font-size: inherit;
	white-space: pre;
	overflow-wrap: normal;
}

.rowpost table, .kq-md-preview table {
	display: block;
	width: max-content;
	max-width: 100%;
	margin: 4px 0 16px;
	overflow-x: auto;
	border-collapse: collapse;
	font-size: 14px;
	line-height: 1.45;
}

.rowpost th, .rowpost td, .kq-md-preview th, .kq-md-preview td {
	padding: 7px 10px;
	border: 1px solid #dfe5ec;
	text-align: left;
	vertical-align: top;
}

.rowpost th, .kq-md-preview th {
	background: #f4f6f9;
	font-weight: 600;
	white-space: nowrap;
}

.rowpost tbody tr:nth-child(even) td, .kq-md-preview tbody tr:nth-child(even) td { background: #fafbfc; }

.rowpost hr, .kq-md-preview hr { margin: 20px 0; border: 0; border-top: 1px solid #dfe5ec; }


.preload * {
  -webkit-transition: none !important;
  -moz-transition: none !important;
  -ms-transition: none !important;
  -o-transition: none !important;
}

.fullimage-container {
	height: 460px;
}

/* Staff signed in as a client: bottom left, above the sticky header, notice bars, cookie banner and chat */
.adminreturndiv {
	position: fixed!important;
	top: auto!important;
	right: auto!important;
	bottom: 16px!important;
	left: 16px!important;
	z-index: 2147483000!important;
	max-width: calc(100% - 32px);
	padding: 8px 14px!important;
	border-radius: 6px;
	box-shadow: 0 4px 14px rgba(0,0,0,0.35);
	font-size: 13px!important;
	line-height: 1.4;
}

.adminreturndiv a {
	color: #ffffff!important;
	font-weight: bold;
	text-decoration: underline;
}


/* Top Nav Menu */




#menu .topnavmenu ul .sub-menu li {
	margin-left: 0px!important;
}


header.sticky-header #menu .topnavmenu {
	top: 0;
	position: absolute;

    -webkit-transition: top 0.3s ease 0s;
    -moz-transition: top 0.3s ease 0s;
    -o-transition: top 0.3s ease 0s;
    transition: top 0.3s ease 0s;
	
}


header.sticky-header.nav-small #menu .trustpilot-widget {
       	top: -31px!important;
}

header.sticky-header.nav-small #menu .topnavmenu {
	top: -41px!important;
}

#menu .topnavmenu ul ul {
    padding: 0;
    background: transparent;
}

#menu .topnavmenu ul li:hover ul,
#menu .topnavmenu ul li.sfHover ul {
    top: 26px!important;
    left: 10px;
    z-index: 99;
}



#menu .topnavmenu > ul > li > a {
	background-color: #E6E6E6;
	color: #818B92;
	padding: 3px 0 3px 0!important;
}

#menu .topnavmenu > ul > li > a:hover {
}

#menu .topnavmenu ul a {
	padding: 0!important;
	line-height: 20px!important;
	color: #fff;
width: 200px;
text-align: center;
text-transform: none;
	border-top: none;
-webkit-border-bottom-right-radius: 4px;
-webkit-border-bottom-left-radius: 4px;
-moz-border-radius-bottomright: 4px;
-moz-border-radius-bottomleft: 4px;
border-bottom-right-radius: 4px;
border-bottom-left-radius: 4px;
padding: 0 0px 0 0!important;
font-size: 12px;

}

#menu .topnavmenu ul a:hover {
border-radius: 0!important;
-webkit-border-radius: 0!important;
border-radius: 0!important;
}


#menu .topnavmenu ul li {
    position: relative;
    float: left;
    margin-left: 0px;
	line-height: 20px;
	z-index: 40;
	color: green!important;
}


#menu .topnavmenu ul a:hover,
#menu .topnavmenu ul li.sfHover a,
#menu .topnavmenu ul li.current-cat a,
#menu .topnavmenu ul li.current_page_item a,
#menu .topnavmenu ul li.current-menu-item a,
#menu .topnavmenu ul li.current-page-ancestor a,
#menu .topnavmenu ul li.current-menu-ancestor a {
border-radius: 0!important;
-webkit-border-radius: 0!important;
	background-color: rgba(0,0,0,0.6);
color: #fff;
}

#menu .topmenu ul.sub-menu {
	background-color:transparent!important;
}

#menu .topnavmenu ul .sub-menu li a, #menu .topnavmenu ul .sub-menu li {
	background: rgba(0,0,0,0.65)!important;

}


/* Statistics */
#account-snapshot{
	margin: 0 0 0px 0;
	overflow: hidden;
}


.stats-title {
	color: #fff;
	font-family: "Oxygen", sans-serif;
	font-size: 23px;
	font-weight: 400;
	margin-left: 25px !important;
	margin-top: 25px !important;
	padding-bottom: 10px;
	border-bottom: 2px solid rgba(253,154,66,0.4);
}
.stats-number {
	color: #fff;
	font-family: "Oxygen", sans-serif;
	font-size: 56px;
	font-weight: 400;
	float: left;
	clear: both;
	margin-left: 25px !important;
	margin-top: 15px !important;
}

.supporttype {
	border: 4px solid #fff;
	-moz-border-radius: 9px;
	-webkit-border-radius: 9px;
	border-radius: 9px;
	-moz-background-clip: padding-box !important;
	-webkit-background-clip: padding-box !important;
	background-clip: padding-box !important;
	-moz-box-shadow: inset 0 0 0 4px rgba(0,0,0,.05);
	-webkit-box-shadow: inset 0 0 0 4px rgba(0,0,0,.05);
	box-shadow: inset 0 0 0 4px rgba(0,0,0,.05);
	display: block;
	text-decoration: none;
	width: 100%;
	height: 160px;
	float: left;
	margin-right: 33px;
	-moz-transition: 0.8s;
	-webkit-transition: 0.8s;
	transition: 0.8s;
	font-size: 110px;
	position: relative;
}

.supporttype .supporttype-title {
        color: #fff;
        font-family: "Oxygen", sans-serif;
        font-size: 23px;
        font-weight: 400;
        margin-left: 25px !important;
        margin-top: 25px !important;
        padding-bottom: 10px;
        padding-left: 0px;
        border-bottom: 2px solid rgba(255,255,255,0.2);
	-moz-transition: 0.8s;
	-webkit-transition: 2s;
	transition: 0.8s;
}

.supporttype:hover .supporttype-title {
	padding-left: 45px;
}

.supporttype:before {
        position:absolute;
        font-family: FontAwesome;
        bottom:50px;
        right:10px;
	font-size: 110px;
	color: rgba(0,0,0,0.04);
}

.supporttype:hover:before {
	right: 77%;
	bottom: 103px;
	-moz-transition: 0.5s;
	-webkit-transition: 15s;
	transition: 0.5s;
	-webkit-transform: rotate(-15deg);
	font-size: 35px;
	color: rgba(255,255,255,0.4);
}


.supporttype.servicedown {
	background: #e74b3b;
}

.supporttype.servicedown:before {
        content: "\f071"; <--- this is your text. You can also use UTF-8 character codes as I do here
}


.supporttype.technical {
	background: #f07406;
}

.supporttype.technical:before {
        content: "\f0ad"; <--- this is your text. You can also use UTF-8 character codes as I do here
}

.supporttype.billing {
	background: #27ad5f;
}

.supporttype.billing:before {
        content: "\f09d"; <--- this is your text. You can also use UTF-8 character codes as I do here
}

.supporttype.sales {
	background: #3397db;
}

.supporttype.sales:before {
        content: "\f07a"; <--- this is your text. You can also use UTF-8 character codes as I do here
}

.supporttype.transfer {
	background: #BF0A92;
}

.supporttype.transfer:before {
        content: "\f090"; <--- this is your text. You can also use UTF-8 character codes as I do here
}

.supporttype.development {
	background: #770ABF;
}

.supporttype.development:before {
        content: "\f121"; <--- this is your text. You can also use UTF-8 character codes as I do here
}

.supporttype.scriptinstall {
	background: #0ABFA7;
}

.supporttype.scriptinstall:before {
        content: "\f19a"; <--- this is your text. You can also use UTF-8 character codes as I do here
}

.supporttype.partnership {
	background: #EDB744;
}

.supporttype.partnership:before {
        content: "\f0b1"; <--- this is your text. You can also use UTF-8 character codes as I do here
}


p.supporttype-description {
	font-size: 14px;
	color: white;
	float: none;
	padding: 0 20px 0 20px;
}

.active-services, .active-domains, .due-invoices, .open-tickets {
	border: 4px solid #fff;
	-moz-border-radius: 9px;
	-webkit-border-radius: 9px;
	border-radius: 9px;
	-moz-background-clip: padding-box !important;
	-webkit-background-clip: padding-box !important;
	background-clip: padding-box !important;
	-moz-box-shadow: inset 0 0 0 4px rgba(0,0,0,.05);
	-webkit-box-shadow: inset 0 0 0 4px rgba(0,0,0,.05);
	box-shadow: inset 0 0 0 4px rgba(0,0,0,.05);
	display: block;
	text-decoration: none;
	width: 23%;
	min-height: 160px;
	float: left;
	margin-right: 2.666%;
	background: #f07406 url(../img/active-services.jpg) 95% 90% no-repeat;
	-moz-transition: 0.3s;
	-webkit-transition: 0.3s;
	transition: 0.3s;
}

.open-tickets {
	margin-right: 0;
}

.active-services:hover {
	background-position: 95% 80%;
	-moz-transition: 0.3s;
	-webkit-transition: 0.3s;
	transition: 0.3s;
}

.active-domains {
	background: #e74b3b url(../img/active-domains.jpg) 99% 88% no-repeat;
}

.active-domains:hover {
	background-position: 99% 70%;
	-moz-transition: 0.3s;
	-webkit-transition: 0.3s;
	transition: 0.3s;
}

.active-domains .stats-title {
	border-color: rgba(255,128,115,0.4);
}

.due-invoices {
	background: #27ad5f url(../img/due-invoices.jpg) 95% 90% no-repeat;
}

.due-invoices:hover {
	background-position: 95% 85%;
	-moz-transition: 0.3s;
	-webkit-transition: 0.3s;
	transition: 0.3s;
}

.due-invoices .stats-title {
	border-color: rgba(113,205,152,.4);
}

.open-tickets {
	background: #3397db url(../img/open-tickets.jpg) 98% 90% no-repeat;
	margin-right: 0 !important;
}

.open-tickets:hover {
	background-position: 98% 80%;
	-moz-transition: 0.3s;
	-webkit-transition: 0.3s;
	transition: 0.3s;
}


.open-tickets .stats-title {
	border-color: rgba(106,188,242,.4);
}



@media only screen and (max-width: 990px) {
	.active-services, .active-domains, .due-invoices, .open-tickets {
		width: 45%;
		margin: 0 7% 30px 0 !important;
	}
	
	.active-domains, .open-tickets {
		margin-right: 0 !important;
	}
}


@media only screen and (max-width: 900px) {
	
	
	.active-services, .active-domains, .due-invoices, .open-tickets {
		margin: 0 0 15px 25%;
	}

}


@media only screen and (max-width: 700px) {
	
	.active-services, .active-domains, .due-invoices, .open-tickets {
		width: 98% !important; 
		height: 130px !important;
		margin: 0 0 20px 0 !important;
	}
	.stats-number {
		font-size: 40px !important;
		margin-top: 0px !important;
	}
	
	#account-snapshot {
		margin-bottom: 0 !important;
		width: 100% !important;
	}


}


/*	Banner	*/
.banner-wrapper {
	font-size: 0.9em;
	padding: 20px;
	border: 1px solid #f39b93;
	border-top-width: 5px;
	-webkit-transition: all 0.6s ease-in-out;
	transition: all 0.6s ease-in-out;
}
.banner-wrapper:hover {
	border-color: #e73827;
	background: rgba(0, 0, 0, 0.0185);
}
.banner-title,
.banner-content {
	text-shadow: 0 1px #fff;
}
.banner-content {
	margin: 1.5em 0.5em;
}
.banner-content .btn {
	text-shadow: none;
}

/*	Banner Horizontal	*/
.banner-horizontal {
	border-top-width: 1px;
	border-left-width: 5px;
}
.banner-horizontal .banner-title,
.banner-horizontal .banner-content {
	float: left;
	margin: 15px 0 0;
	line-height: 20px;
}
.banner-horizontal .banner-title {
	margin-top: 14px;
	margin-right: 0.5em;
	letter-spacing: -0.05em;
}
.banner-horizontal .btn {
	float: right;
	margin: 10px 0;
}

/*	Accordion	*/
.accordion {
	margin-bottom: 30px;
}
.accordion .panel {
	margin-top: 0 !important;
	border-bottom-color: #eee;
	border-radius: 0;
	-webkit-box-shadow: none;
	box-shadow: none;
}
.accordion .panel:first-child {
	border-top-color: #eee;
}
.accordion .panel-heading,
.accordion .panel-body {
	padding-left: 20px !important;
}
.accordion .panel-body {
	padding-top: 0 !important;
	border: 0 !important;
}
.accordion .accordion-toggle > .fa-fw {
	margin-left: -20px;
	margin-right: 0;
	text-decoration: none !important;
}
.accordion .accordion-toggle:not(.collapsed) {
	color: inherit !important;
	text-decoration: none !important;
	cursor: default;
}
.accordion .accordion-toggle:not(.collapsed) > .fa-fw:before {
	content: "\f0da";
}

/*	Categories	*/
.nav-categories li a {
	width: 100%;
	padding-top: 0.5em;
	padding-bottom: 0.5em;
	color: inherit;
	border: 1px solid #eee;
	border-radius: 0;
}
.nav-categories li .badge {
	font-weight: 300;
	background: #e73827;
}

/*	Tags	*/
.widget-area .btn-tag {
	margin-bottom: 0.5em;
	color: #333;
	border-color: #c5c5c5;
	border-color: rgba(0, 0, 0, 0.15) rgba(0, 0, 0, 0.15) rgba(0, 0, 0, 0.25);
	text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
	background: #ffffff; /* Old browsers */
	background: -moz-linear-gradient(top,  #ffffff 0%, #e6e6e6 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#e6e6e6)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #ffffff 0%,#e6e6e6 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #ffffff 0%,#e6e6e6 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #ffffff 0%,#e6e6e6 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #ffffff 0%,#e6e6e6 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e6e6e6',GradientType=0 ); /* IE6-9 */
	-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
}
.widget-area .btn-tag:hover,
.widget-area .btn-tag:active {
  background: #e6e6e6;
}

/*	4.3 - Search Form
/*-----------------------------------------------------------------------------------*/

.site-search .search-form {
	position: relative;
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
}
.site-search .form-border {
	width: 100%;
	background: #fff;
	border-color: #eee;
	border-radius: 3px;
	padding: 10px;
	z-index: 999;
}
.site-search .form-inline .form-group,
.site-search .search-submit {
	width: 100%;
}
.site-search .search-field,
.site-search .search-submit {
	border-radius: 4px;
}
.site-search .search-field.loading {
	background: url(../img/loader.gif) 99% center no-repeat;
}
.site-search .search-advance {
	margin-top: 10px;
	display: none;
}
.site-search .search-advance .form-group {
	min-height: 34px;
}
.site-search .search-advance-button {
	display: none;
	width: 2em;
	height: 2em;
	margin: -1em;
	background: #fff;
	text-decoration: none !important;
	border-radius: 1em;
	-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
	position: absolute;
	top: 100%;
	left: 50%;
}

/*	Search Suggestions	*/
.autocomplete-suggestions {
    padding: 5px 0;
    background: #fff;
	border: 1px solid #eee;
	border-radius: 4px;
	-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
	overflow: auto;
}
.autocomplete-suggestion {
    background: #fff;
    padding: 0.5em 1em;
    cursor: pointer;
}
.autocomplete-suggestion:hover {
    background-color: #f4f4f4;
}
.autocomplete-suggestion strong {
	font-weight: 600;
}

/*	Form Border	*/
.form-border {
	background: #f4f4f4;
	border: 1px solid #ddd;
	border-radius: 4px;
	padding: 20px;
	-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}


@media (min-width: 768px) {
	.site-search .form-border {
		position: absolute;
	}
	.site-search .form-inline .form-group {
		width: 85%;
	}
	.site-search .form-horizontal .form-group {
		margin-bottom: 0;
	}
	.site-search .search-submit {
		width: 14%;
	}
	.site-search .form-inline .form-control {
		width: 100%;
	}
	
}


@media (max-width: 767px) {
	.form-border {
		padding: 15px;
	}
}

#header-search {
	position: relative;
	top: -108px;
}

/* Chosen v1.1.0 | (c) 2011-2013 by Harvest | MIT License, https://github.com/harvesthq/chosen/blob/master/LICENSE.md */


.chosen-select{width:100%}.chosen-select-deselect{width:100%}.chosen-container{display:inline-block;font-size:14px;position:relative;vertical-align:middle}.chosen-container .chosen-drop{background:#fff;border:1px solid #999;border-top-color:#d9d9d9;border-bottom-right-radius:4px;border-bottom-left-radius:4px;-webkit-box-shadow:0 8px 8px rgba(0,0,0,.25);box-shadow:0 8px 8px rgba(0,0,0,.25);margin-top:-1px;position:absolute;top:100%;left:-9000px;z-index:1060}.chosen-container.chosen-with-drop .chosen-drop{left:0;right:0}.chosen-container .chosen-results{color:#555;margin:0 4px 4px 0;max-height:240px;padding:0 0 0 4px;position:relative;overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch}.chosen-container .chosen-results li{display:none;line-height:1.428571429;list-style:none;margin:0;padding:5px 6px}.chosen-container .chosen-results li em{background:#feffde;font-style:normal}.chosen-container .chosen-results li.group-result{display:list-item;cursor:default;color:#999;font-weight:bold}.chosen-container .chosen-results li.group-option{padding-left:15px}.chosen-container .chosen-results li.active-result{cursor:pointer;display:list-item}.chosen-container .chosen-results li.highlighted{background-color:#428bca;color:white}.chosen-container .chosen-results li.highlighted em{background:transparent}.chosen-container .chosen-results li.disabled-result{display:list-item;color:#999}.chosen-container .chosen-results .no-results{background:#eee;display:list-item}.chosen-container .chosen-results-scroll{background:white;margin:0 4px;position:absolute;text-align:center;width:321px;z-index:1}.chosen-container .chosen-results-scroll span{display:inline-block;height:1.428571429;text-indent:-5000px;width:9px}.chosen-container .chosen-results-scroll-down{bottom:0}.chosen-container .chosen-results-scroll-down span{background:url("../img/chosen-sprite.png") no-repeat -4px -3px}.chosen-container .chosen-results-scroll-up span{background:url("../img/chosen-sprite.png") no-repeat -22px -3px}.chosen-container-single .chosen-single{background-color:#fff;background-image:-webkit-gradient(linear,left 0,left 100%,from(#fff),to(#eee));background-image:-webkit-linear-gradient(top,#fff,0%,#eee,100%);background-image:-moz-linear-gradient(top,#fff 0,#eee 100%);background-image:linear-gradient(to bottom,#fff 0,#eee 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff',endColorstr='#ffeeeeee',GradientType=0);-webkit-background-clip:padding-box;-moz-background-clip:padding;background-clip:padding-box;border:1px solid #ccc;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075);box-shadow:inset 0 1px 1px rgba(0,0,0,.075);color:#555;display:block;height:34px;overflow:hidden;line-height:34px;padding:0 0 0 8px;position:relative;text-decoration:none;white-space:nowrap}.chosen-container-single .chosen-single span{display:block;margin-right:26px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chosen-container-single .chosen-single abbr{background:url("../img/chosen-sprite.png") right top no-repeat;display:block;font-size:1px;height:10px;position:absolute;right:26px;top:12px;width:12px}.chosen-container-single .chosen-single abbr:hover{background-position:right -11px}.chosen-container-single .chosen-single.chosen-disabled .chosen-single abbr:hover{background-position:right 2px}.chosen-container-single .chosen-single div{display:block;height:100%;position:absolute;top:0;right:0;width:18px}.chosen-container-single .chosen-single div b{background:url("../img/chosen-sprite.png") no-repeat 0 7px;display:block;height:100%;width:100%}.chosen-container-single .chosen-default{color:#999}.chosen-container-single .chosen-search{margin:0;padding:3px 4px;position:relative;white-space:nowrap;z-index:1000}.chosen-container-single .chosen-search input{background:url("../img/chosen-sprite.png") no-repeat 100% -20px,#fff;border:1px solid #ccc;border-top-right-radius:4px;border-top-left-radius:4px;border-bottom-right-radius:4px;border-bottom-left-radius:4px;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075);box-shadow:inset 0 1px 1px rgba(0,0,0,.075);margin:1px 0;padding:4px 20px 4px 4px;width:100%}.chosen-container-single .chosen-drop{margin-top:-1px;border-bottom-right-radius:4px;border-bottom-left-radius:4px;-webkit-background-clip:padding-box;-moz-background-clip:padding;background-clip:padding-box}.chosen-container-single-nosearch .chosen-search input{position:absolute;left:-9000px}.chosen-container-multi .chosen-choices{background-color:#fff;border:1px solid #ccc;border-top-right-radius:0;border-top-left-radius:0;border-bottom-right-radius:0;border-bottom-left-radius:0;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075);box-shadow:inset 0 1px 1px rgba(0,0,0,.075);cursor:text;height:auto!important;height:1%;margin:0;overflow:hidden;padding:0;position:relative}.chosen-container-multi .chosen-choices li{float:left;list-style:none}.chosen-container-multi .chosen-choices .search-field{margin:0;padding:0;white-space:nowrap}.chosen-container-multi .chosen-choices .search-field input{background:transparent!important;border:0!important;-webkit-box-shadow:none;box-shadow:none;color:#555;height:32px;margin:0;padding:4px;outline:0}.chosen-container-multi .chosen-choices .search-field .default{color:#999}.chosen-container-multi .chosen-choices .search-choice{-webkit-background-clip:padding-box;-moz-background-clip:padding;background-clip:padding-box;background-color:#eee;border:1px solid #ccc;border-top-right-radius:4px;border-top-left-radius:4px;border-bottom-right-radius:4px;border-bottom-left-radius:4px;background-image:-webkit-gradient(linear,left 0,left 100%,from(#fff),to(#eee));background-image:-webkit-linear-gradient(top,#fff,0%,#eee,100%);background-image:-moz-linear-gradient(top,#fff 0,#eee 100%);background-image:linear-gradient(to bottom,#fff 0,#eee 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff',endColorstr='#ffeeeeee',GradientType=0);-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075);box-shadow:inset 0 1px 1px rgba(0,0,0,.075);color:#333;cursor:default;line-height:13px;margin:6px 0 3px 5px;padding:3px 20px 3px 5px;position:relative}.chosen-container-multi .chosen-choices .search-choice .search-choice-close{background:url("../img/chosen-sprite.png") right top no-repeat;display:block;font-size:1px;height:10px;position:absolute;right:4px;top:5px;width:12px}.chosen-container-multi .chosen-choices .search-choice .search-choice-close:hover{background-position:right -11px}.chosen-container-multi .chosen-choices .search-choice-focus{background:#d4d4d4}.chosen-container-multi .chosen-choices .search-choice-focus .search-choice-close{background-position:right -11px}.chosen-container-multi .chosen-results{margin:0;padding:0}.chosen-container-multi .chosen-drop .result-selected{display:none}.chosen-container-active .chosen-single{border:1px solid rgba(82,168,236,0.8);-webkit-box-shadow:0 1px 1px rgba(0,0,0,.075) inset,0 0 8px rgba(82,168,236,.6);box-shadow:0 1px 1px rgba(0,0,0,.075) inset,0 0 8px rgba(82,168,236,.6);-webkit-transition:border linear .2s,box-shadow linear .2s;transition:border linear .2s,box-shadow linear .2s}.chosen-container-active.chosen-with-drop .chosen-single{background-color:#eee;border:1px solid rgba(82,168,236,0.8);-webkit-box-shadow:0 1px 1px rgba(0,0,0,.075) inset,0 0 8px rgba(82,168,236,.6);box-shadow:0 1px 1px rgba(0,0,0,.075) inset,0 0 8px rgba(82,168,236,.6);-webkit-transition:border linear .2s,box-shadow linear .2s;transition:border linear .2s,box-shadow linear .2s}.chosen-container-active.chosen-with-drop .chosen-single div{background:transparent;border-left:none}.chosen-container-active.chosen-with-drop .chosen-single div b{background-position:-18px 7px}.chosen-container-active .chosen-choices{border:1px solid rgba(82,168,236,0.8);border-bottom-right-radius:0;border-bottom-left-radius:0;-webkit-box-shadow:0 1px 1px rgba(0,0,0,.075) inset,0 0 8px rgba(82,168,236,.6);box-shadow:0 1px 1px rgba(0,0,0,.075) inset,0 0 8px rgba(82,168,236,.6);-webkit-transition:border linear .2s,box-shadow linear .2s;transition:border linear .2s,box-shadow linear .2s}.chosen-container-active .chosen-choices .search-field input{color:#111!important}.chosen-disabled{cursor:default;opacity:.5!important}.chosen-disabled .chosen-single{cursor:default}.chosen-disabled .chosen-choices .search-choice .search-choice-close{cursor:default}.chosen-rtl{text-align:right}.chosen-rtl .chosen-single{padding:0 8px 0 0;overflow:visible}.chosen-rtl .chosen-single span{margin-left:26px;margin-right:0;direction:rtl}.chosen-rtl .chosen-single div{left:7px;right:auto}.chosen-rtl .chosen-single abbr{left:26px;right:auto}.chosen-rtl .chosen-choices .search-field input{direction:rtl}.chosen-rtl .chosen-choices li{float:right}.chosen-rtl .chosen-choices .search-choice{margin:6px 5px 3px 0;padding:3px 5px 3px 19px}.chosen-rtl .chosen-choices .search-choice .search-choice-close{background-position:right top;left:4px;right:auto}.chosen-rtl.chosen-container-single .chosen-results{margin:0 0 4px 4px;padding:0 4px 0 0}.chosen-rtl .chosen-results .group-option{padding-left:0;padding-right:15px}.chosen-rtl.chosen-container-active.chosen-with-drop .chosen-single div{border-right:0}.chosen-rtl .chosen-search input{background:url("../img/chosen-sprite.png") no-repeat -28px -20px,#fff;direction:rtl;padding:4px 5px 4px 20px}

#cfslideout {
	margin-top: 100px;
	display: none;
}

.weak {
}

.has-success .form-control{ border-color:#ccc!important;}
.has-success .form-control:focus { border-color:#66afe9!important;     -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6) }


.has-error .help-block{ color:red!important; font-weight: bold!important}
.has-error .form-control{ border-color:red!important;}
.has-error .form-control:focus { border-color:red!important;     -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(255, 0, 0, .6);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(255, 0, 0, .6) }

.has-feedback .form-control-feedback {
    top: 28px;
    right: 0;
}

.has-error, .has-feedback.has-error .form-control-feedback {
    color: red;
}


.blogmason {
    position: relative;
    display: flex;
    flex-wrap: wrap;
}

.rowflex {
    position: relative;
    display: flex;
    flex-wrap: wrap;
}

.blogmason .postcard{
flex: 1 1 300px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    margin: 0 0 44px;
    min-height: 300px;
    background: #fff center center;
    background-size: cover;
    border-radius: 5px;
    box-shadow: rgba(39,44,49,.06) 8px 14px 38px, rgba(39,44,49,.03) 1px 3px 8px;
    transition: all .5s ease;
    padding: 0;
}
.blogmason .postcard:hover{
    box-shadow: rgba(39,44,49,.07) 8px 28px 50px, rgba(39,44,49,.04) 1px 6px 12px;
    transition: all .4s ease;
    transform: translate3D(0,-1px,0) scale(1.02);
}
.blogmason .postcard .postcard-excerpt p {
margin: 0 0 .9em;
    font-size: 17px;
    color: #282828;
    line-height: 26px;
    font-family: Georgia,serif;
}

.blogmason .postcard .postcard-meta {
display: flex;
    justify-content: space-between;
    align-items: flex-end;
    padding: 0 25px 25px;
}

.blogmason .postcard .postcard-meta .author-list {
    display: flex;
    flex-wrap: wrap-reverse;
    margin: 0;
    padding: 0;
    list-style: none;
}

.blogmason .postcard .postcard-meta .author-list-item:nth-child(1) {
    z-index: 10;
}

.blogmason .postcard .postcard-meta .author-list-item {
    position: relative;
    flex-shrink: 0;
    margin: 0;
    padding: 0;
}

.blogmason .static-avatar {
    display: block;
    overflow: hidden;
    margin: 0 -5px;
    width: 50px;
    height: 50px;
    border: #fff 2px solid;
    border-radius: 100%;
}

.blogmason .reading-time {
    flex-shrink: 0;
    margin-left: 20px;
    color: #738a94;
    font-size: 0.9rem;
    line-height: 33px;
    font-weight: 500;
    letter-spacing: .5px;
    text-transform: uppercase;
}

.blogmason .postcard h2{
    line-height: 1.15;
    text-rendering: optimizeLegibility;
    margin: 0 0 .75em;
    font-size: 1.8rem;
}

.blogmason .postcard img{
    width:100%;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}


.blogmason .postcard .postcard-content {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.blogmason .postcard .postcard-content-link{
    position: relative;
    flex-grow: 1;
    display: block;
    padding: 25px 25px 0;
    color: #15171a;
}

.blogmason .postcard .postcard-tags, #blog .postcard-tags{
    display: block;
    margin-bottom: 12px;
    color: #738a94;
    font-size: 0.9rem;
    line-height: 1.15em;
    font-weight: 500;
    letter-spacing: .5px;
    text-transform: uppercase;
}

#blog .postcard-tags{
    display:inline-block;
}
.blogmason .postcard .postcard-image{
    width: auto;
    height: 200px;
    background: #c5d2d9 no-repeat center center;
    background-size: cover;
}

.blogmason .postcard .postcard-image-link{
position: relative;
    display: block;
    overflow: hidden;
    border-radius: 5px 5px 0 0;
}

.blogmason .postcard h4{
    margin:20px;
}

.blogmason .postcard p{
    margin:0 0 20px;
}
.blogmason .blue-button{
    width: 100px;
    -webkit-transition: background-color 1s , color 1s; /* For Safari 3.1 to 6.0 */
    transition: background-color 1s , color 1s;
    min-height: 20px;
    background-color: #002E5B;
    color: #ffffff;
    border-radius: 4px;
    text-align: center;
    font-weight: lighter;
    margin: 0px 20px 15px 20px;
    padding: 5px 0px;
    display: inline-block;
}
.blogmason .blue-button:hover{
    background-color: #dadada;
    color: #002E5B;
}
@media (max-width: 768px) {

    .blogmason .col-lg-4 {
        margin-top: 20px;
    }
}

.whiteboxhp {
flex: 1 1 calc(50% - 40px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
	margin: 20px;
    background: #fff center center;
    background-size: cover;
    border-radius: 5px;
    box-shadow: rgba(39,44,49,.06) 8px 14px 38px, rgba(39,44,49,.03) 1px 3px 8px;
    transition: all .5s ease;
    padding: 25px;
min-height: 285px;
}

.whiteboxhp .page-header {
	margin: 0 0 40px 0;
}

@media (max-width: 768px) {
  .whiteboxhp {
    flex: 1 1 100%;
    margin: 20px;
  }
}

.whiteboxhp p {
margin: 0;
}

#ecologi-tree {
	border-radius: 5px;
	text-align: center;
	background: linear-gradient( rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1) ), url(https://p66.p3.n0.cdn.getcloudapp.com/items/KoulzbDw/mangrovebg.jpg?v=1204f70b2e474ff9d7380311261c0144);
	background-position: center bottom;
	background-size: cover;
}

#ecologi-tree a.treebutton {
	background: white;
	padding: 5px;
	font-size: 15px;
}

#ecologi-tree h2, #ecologi-tree h1 {
 color: white;
	font-size: 50px;
	margin-top: 20px;
}


#ecologi-tree p {
	color: #fff;
}

#ecologi-tree p {
	font-size: 18px;
}

#ecologi-tree p.large {
	font-size: 24px;
}

#ecologi-tree p.findoutmore {
	background-color: rgba(0,0,0,0.7);
	display: inline-block;
	padding: 10px 15px;
	border: 1px solid #000;
	border-radius: 999px;
	margin-bottom: 20px;
}



#ecologi-tree .currenttotal, #ecologi-tree .target {
	color: #fff;
	font-size: 30px;
	float: left;
	display: inline-block;
	height: 50px;
	margin: 35px auto;
	line-height: 50px;
}

.tplabel {
	display: block;
	font-size: 14px;
	color: rgba(255,255,255,0.8);
	text-transform: uppercase;
	font-weight: 800;
	position: relative;
	top: -20px;
}

#ecologi-tree .currenttotal {
}

#ecologi-tree .target {
	float: right!important;
}

.kprogress {
	width: 100%; 
   display: inline-block;
    float: left!important;
    height: 50px;
    margin: 35px 0;
    border-radius: 20px;
    background: #f9f9f9;
    background: rgba(255,255,255,0.4);
box-shadow: 0px 45px 50px rgba(0, 0, 0, 0.25); 
}

.kpbar {
    border-radius: 20px 0 0 20px;
    width: 0%;
    height: 100%;
    transition: width;
    transition-duration: 1s;
    transition-timing-function: cubic-bezier(.36,.55,.63,.48);
}



.leaf {
    background-color: rgba(161,186,35,1);;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 40' width='60' height='30'%3E%3Cpath fill='%2340584a' fill-opacity='0.47' d='M0 40a19.96 19.96 0 0 1 5.9-14.11 20.17 20.17 0 0 1 19.44-5.2A20 20 0 0 1 20.2 40H0zM65.32.75A20.02 20.02 0 0 1 40.8 25.26 20.02 20.02 0 0 1 65.32.76zM.07 0h20.1l-.08.07A20.02 20.02 0 0 1 .75 5.25 20.08 20.08 0 0 1 .07 0zm1.94 40h2.53l4.26-4.24v-9.78A17.96 17.96 0 0 0 2 40zm5.38 0h9.8a17.98 17.98 0 0 0 6.67-16.42L7.4 40zm3.43-15.42v9.17l11.62-11.59c-3.97-.5-8.08.3-11.62 2.42zm32.86-.78A18 18 0 0 0 63.85 3.63L43.68 23.8zm7.2-19.17v9.15L62.43 2.22c-3.96-.5-8.05.3-11.57 2.4zm-3.49 2.72c-4.1 4.1-5.81 9.69-5.13 15.03l6.61-6.6V6.02c-.51.41-1 .85-1.48 1.33zM17.18 0H7.42L3.64 3.78A18 18 0 0 0 17.18 0zM2.08 0c-.01.8.04 1.58.14 2.37L4.59 0H2.07z'%3E%3C/path%3E%3C/svg%3E");
}


.horizontal {
position: relative;
  margin: 30px;
display: inline-block;
  border: 10px solid #fff;;
  font-size: 28px;
  padding: 10px;
  cursor: pointer;
text-transform: uppercase;
}
.horizontal > .text {
  position: relative;
  color: transparent;
  background-image: -webkit-gradient(linear, left top, right top, from(#F05253), color-stop(50%, #F05253), color-stop(50%, #FFF), to(#FFF));
  background-image: linear-gradient(90deg, #F05253 0%, #F05253 50%, #FFF 50%, #FFF 100%);
  background-repeat: repeat;
  background-size: 200%;
  background-position: 100% 0;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-transition: background-position 300ms;
  transition: background-position 300ms;
}
.horizontal::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #FFF;
  -webkit-transform-origin: 100% 0;
          transform-origin: 100% 0;
  -webkit-transform: scale3d(0, 1, 1);
          transform: scale3d(0, 1, 1);
  -webkit-transition: -webkit-transform 300ms;
  transition: -webkit-transform 300ms;
  transition: transform 300ms;
  transition: transform 300ms, -webkit-transform 300ms;
}
.horizontal:hover .text {
  background-position: 0 0;
}
.horizontal:hover::before {
  -webkit-transform-origin: 0 0;
          transform-origin: 0 0;
  -webkit-transform: scale3d(1, 1, 1);
          transform: scale3d(1, 1, 1);
}


#ecologi-tree .tweetthis {
	border-radius: 0;
	font-size: 18px;
	border: 1px solid rgba(255,255,255,0.5);
}

/* MAIN CREDIT CARD CONTAINER */

.credit-card {
    margin-top: 20px;
    margin-bottom: 20px;
    border-radius: 7px;
    width: 95%;
    max-width: 264px;
    position: relative;
    transition: all 0.4s ease;
    box-shadow: 0 2px 4px 0 #cfd7df;
    min-height: 80px;
    padding: 13px;
    background: #1a1b1c;
    color: #efefef;
}

.credit-card.selectable:hover {
    cursor: pointer;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
}


/*  NUMBER FORMATTING */

.credit-card-last4 {
    font-family: "PT Mono", Helvetica, sans-serif;
    font-size: 24px;
}

.credit-card-last4:before {
    content: "**** **** **** ";
    color: #4f4d4d;
    font-size: 20px;
}

.credit-card.american-express .credit-card-last4:before,
.credit-card.amex .credit-card-last4:before {
    content: "**** ****** *";
    margin-right: -10px;
}

.credit-card.diners-club .credit-card-last4:before,
.credit-card.diners .credit-card-last4:before {
    content: "**** ****** ";
}

.credit-card-expiry {
    font-family: "PT Mono", Helvetica, sans-serif;
    font-size: 18px;
    position: absolute;
    bottom: 8px;
    left: 15px;
}


/* BRAND CUSTOMIZATION */

.credit-card.visa {
    background: #1A1F71;
    color: #eaeef2;
}

.credit-card.visa .credit-card-last4:before {
    color: #8999e5;
}

.credit-card.mastercard {
    background: #4f0cd6;
    color: #e3e8ef;
}

.credit-card.maestro {
    background: #6968b7;
}

.credit-card.maestro .credit-card-last4:before {
    color: rgba(255,255,255,0.5);
}

.credit-card.mastercard .credit-card-last4:before {
    color: #8a82dd;
}

.credit-card.american-express,
.credit-card.amex {
    background: #2e77bb;
    color: rgba(255,255,255,0.9);
}

.credit-card.american-express .credit-card-last4:before,
.credit-card.amex .credit-card-last4:before {
    color: rgba(255,255,255,0.5);
}

.credit-card.diners, .credit-card.diners-club {
      background: #8a38ff;
      color: #f5efff;
    }

    .credit-card.diners .credit-card-last4:before, .credit-card.diners-club .credit-card-last4:before {
      color: #b284f4;
    }

.credit-card.discover {
    background: #f16821;
    color: #fff4ef;
}

.credit-card.discover .credit-card-last4:before {
    color: #ffae84;
}

.credit-card.jcb {
    background: #cc3737;
    color: #f7e8e8;
}

.credit-card.jcb .credit-card-last4:before {
    color: #f28a8a;
}

.credit-card.unionpay {
    background: #47bfff;
    color: #fafdff;
}

.credit-card.unionpay .credit-card-last4:before {
    color: #99dcff;
}


/*   LOGOS  */

.credit-card::after {
    content: " ";
    position: absolute;
    bottom: 10px;
    right: 15px;
}

.credit-card.visa::after {
    height: 16px;
    width: 50px;
    background-image: url('data:image/png;base64,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');
}

.credit-card.mastercard::after {
    width: 40px;
    height: 25px;
    background-image: url('data:image/png;base64,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');
}

.credit-card.amex::after,
.credit-card.american-express::after {
    width: 50px;
    height: 14px;
    background-image: url('data:image/png;base64,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');
}

.credit-card.diners::after,
.credit-card.diners-club::after {
    width: 30px;
    height: 24px;
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAYCAYAAADtaU2/AAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAACXBIWXMAAAsTAAALEwEAmpwYAAAED2lUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iWE1QIENvcmUgNS40LjAiPgogICA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPgogICAgICA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIgogICAgICAgICAgICB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIKICAgICAgICAgICAgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiCiAgICAgICAgICAgIHhtbG5zOnRpZmY9Imh0dHA6Ly9ucy5hZG9iZS5jb20vdGlmZi8xLjAvIgogICAgICAgICAgICB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iPgogICAgICAgICA8eG1wTU06RG9jdW1lbnRJRD54bXAuZGlkOkFDMEM4Rjk2NTQzRDExRTQ5MzZBQzlERDRCNDEwQzZDPC94bXBNTTpEb2N1bWVudElEPgogICAgICAgICA8eG1wTU06RGVyaXZlZEZyb20gcmRmOnBhcnNlVHlwZT0iUmVzb3VyY2UiPgogICAgICAgICAgICA8c3RSZWY6aW5zdGFuY2VJRD54bXAuaWlkOkFDMEM4RjkzNTQzRDExRTQ5MzZBQzlERDRCNDEwQzZDPC9zdFJlZjppbnN0YW5jZUlEPgogICAgICAgICAgICA8c3RSZWY6ZG9jdW1lbnRJRD54bXAuZGlkOkFDMEM4Rjk0NTQzRDExRTQ5MzZBQzlERDRCNDEwQzZDPC9zdFJlZjpkb2N1bWVudElEPgogICAgICAgICA8L3htcE1NOkRlcml2ZWRGcm9t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');
}

.credit-card.discover::after {
    width: 50px;
    height: 14px;
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAOCAYAAABth09nAAAAAXNSR0IArs4c6QAAAAlwSFlzAAALEwAACxMBAJqcGAAAAVlpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IlhNUCBDb3JlIDUuNC4wIj4KICAgPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4KICAgICAgPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIKICAgICAgICAgICAgeG1sbnM6dGlmZj0iaHR0cDovL25zLmFkb2JlLmNvbS90aWZmLzEuMC8iPgogICAgICAgICA8dGlmZjpPcmllbnRhdGlvbj4xPC90aWZmOk9yaWVudGF0aW9uPgogICAgICA8L3JkZjpEZXNjcmlwdGlvbj4KICAgPC9yZGY6UkRGPgo8L3g6eG1wbWV0YT4KTMInWQAAA/tJREFUSA19ll2IVVUUx73jmEYgiUpYiIREkFqQD0FhKiVIoPaSRaEPQlATZmk9JERBQVCSldjHk9iDqE8KQaTQB0lFoljDSGKiFI3VWJZZfo6n32+fta5nrrcW/O/6r8+999n77HNbVVWNHnVZqlardSlNYj1yffAWVFt9qSNPX/axxzB2kehhfERdjNs5njmO4RyyBlok52W80pNziLmVpPaPA8fgnT4btyWL0bmAdixJt1inr9FnRP/s8X+aWuda6lqQmZHsUxxklX9qR8J0Ob7vwzcDPQHsx/cPOb3oixG7A309OIjvELEetDt5Nb5ZwAV/h++kdXB7/Yp9HBvlVKqx+G4Bx4H8WnAejAH6zoCJwB05Rc0faOd6lT8X7BByHv0OuCYSDsA/D64/ZQgyO/yz4P0ZCH1fxJZiH2nEfoGvjNg+eH9wF+ZcHo/ce9EfBE+1FvJkGL+jz4G3wFTQZ7GyHcwFG4CyOxoPwHeB2TqRl8EU8CKYDCaCU+Bv8DBwUW+AuWAeSHFnRMqDkAfCmONYCvZBcDS4D/EwuAvcDyaBV4GyGDxXWFU9gx6fC3m+dKqbZcIcEvaAj4Bc2ZB5Mdibtbu6vemP2LcRO4POhZwN3zH0DeA02B75Tlh5KuxD8E/lKdivm9CwNd8ttgx5pRG8sXZVK9Efg6+Mod8Pv5NaD3zR9oIjEdf2XJtrD3dJGa5V+zd35mY87YnB346MSdHj67B/Cv0Q2uOlrAFbCquqheaXsylpyLjgvkiuvuTwYi2ncD32KuBTGwJeDNcBxdxyXaPz+tTfFHOEN42Lfg88Td8X0EvBVsY5gVYcdxC8BBxjL/AiUNbVatQ88j+jvieP1toIaG8CimfyC2DiOOCNVATuEfHlfxYod2ZMjT0aeMaVbkfLm8rbz1z7p9ytT8ExAD6srfoXeyOwtg8oSyK31wLlS+CknLjSFwlH4Z8Aj5LX7QrgApRHI+fn2iz1C+Bu+T1gfvi7qcfqqZUJPxIJe9IXfV2It9Nq8Bq4DawD7qjz3iZHbi11kH5wGHgWXciiEqiTd2BvAtPBNyBlM8Tvgw2nAS+EFHdrfsSWwX/IANpFPxExvyvWjwe/gXx46d+Jz8vgBFBWBdyRMWACGAQ77dOCWNj5VyE/Zp55eX70bsI+i/0j2kk0P4hTcHlcjhF397JHfhDtNUDsL7S10FY+3am4hrB9CMWP9lvm3IaB79Q5YA/frdMkeWn4oXTMk+Cy2ARccQHgK08pMyOvvNjGtDPW1Pi79ept5v8Xb/bpxqkr42fMiafDR1GeUAZzEP3BSy62T6ktzRjOK3YXX44x4s9mNqDeB2WsPT6+rGmnBSGt/mObOdr/Ap6tK4eqKaaFAAAAAElFTkSuQmCC');
}

.credit-card.jcb::after {
    width: 30px;
    height: 15px;
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAPCAYAAADzun+cAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAACXBIWXMAAAsTAAALEwEAmpwYAAABWWlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iWE1QIENvcmUgNS40LjAiPgogICA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPgogICAgICA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIgogICAgICAgICAgICB4bWxuczp0aWZmPSJodHRwOi8vbnMuYWRvYmUuY29tL3RpZmYvMS4wLyI+CiAgICAgICAgIDx0aWZmOk9yaWVudGF0aW9uPjE8L3RpZmY6T3JpZW50YXRpb24+CiAgICAgIDwvcmRmOkRlc2NyaXB0aW9uPgogICA8L3JkZjpSREY+CjwveDp4bXBtZXRhPgpMwidZAAACsklEQVQ4EX2U32uOYRjH32c2zIjyKyc7IDkRZw4cMEcjxIHSyoH4C6yNNJRJOZKWAyeEQqI4wQnlhE0phCHmR1NsI43ttdnm8fk8nktPWu+3Prvu676v57qv+3rve0kJpWk6FbMdVkICRemfS5LkiZPEbsSsgRpdUNpauEbc7WwiTVdjjXW+GDcd/4GJauAiVJJFGXusUhBrh/O4XYzHKsReryZwEzTBOFiZJ9ROgLIbgyRZgm11Ao1AsTPGzoAfxBl/CMxdzi3mX07jhl00YSjaZ1LHod8M6qEKxsB2TSbjFsG8fNFNJlPixkXFiT8y2Q1usAqmwC9QFvQUXoNdshhPth5cc3PVBf2gH9/OZtwIVX4UctP46AqXxIDN8BZMGK0/ztoK/Gb4Brb9IbyHOIixu4nbgu2BpXAH3+LaoM5AN1QmHwVPJ8obadstyPFnOADqLDSA2vHXlC5j4zDT8rlZ2DqYmftztG7sZbCtc2EhqPjIFsVls5gvVP2TC7SA8WJQFhWbZRP88TBx+nuM++A+qPkw4QdWdBc2wDN4BadBNcAy8ELZjeVsupbN/e3a4SvYbn/zIbC4uCfOq21wEHaC6oDUqgzYD1beAgOO2WAfdi/Es/F3U+dZO4J9B0fBFr6EPWCn3NgDbSXuObYTXsAbfA/n3fjuP4UWCA0z6IVyTOS2Ebvuvzld361vfEgHNUM9hO/cCBg3rpPrQvwOFJG10ncXby+eitVLyHm7IHFhohu2OjrEMHtudiE64Z3xTlWb0NYox7bbxCYqJvA2x+YRrzUuYFj6AM6bJxTrzsW3PSazAuVz0rcLVi76Z7hMj7BxOuNiPaw5bsFVKHatmMtYT/4YOlzoBRMPQpyKYVb1TewJHfQJboD/MIqyM51wigK9lGXGl6AWPG3IjbvhpK/iD/ZAl+AbzJMOAAAAAElFTkSuQmCC');
}

.credit-card.unionpay::after {
    width: 50px;
    height: 30px;
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAeCAYAAABuUU38AAAKZklEQVRYhd2YeXBV1R3HP3d5+5rlkQAhhCUD4sKiFRDZFFeoyIxVmcpMx62ldjpTZlprq7W2bq06rdjK1CpDVapOVWCKZVNLxUgwIMgOAUISwpaNl7e/d+89nXtvwPdCEtD/2t/Mb+459557zvn+9nP4fyEpH4dgQQ9YMqBxLHIIXcksknFOBRw9seckmYpsEg14ouIy/jxgBAlJBkPvXUzmqlkBBlDlgEoVFKCP4YX/Coi07uG1ex9l57jc2ddq/pi0u7HHTxJC4EKWNiM7xlsL9yABFGsZErLKjFFT2VlSCcko6Jr1f6+kdb8c54IKFeKG/a6P4QUkJOgsms20TaPZydxegZwKt58nOSHJjyvCM1425O5tn0/hbIofDLuKnZFhEGs7J4Q+KS2gulsTZ4xza100pd1QfvK2/PEFQGTNc764FXm+pfY+QHgMg4TTzbpABDLJi5Bo96ph2Tavb0KKDmnXxr6ByD1XlCoMmao+MFgU0nPs8gQ46vKBnr3wrnQBHgm8JpBvhsPyk6x7Q8He8zuKyGfZ1PZkC4NugJHnIGZfWEBxWkBC4PSCfhHeavqCCcJtRgndntc4O9/XIFn/JH9wgUYMWSuYyFBdk8loaG2nkBQ3avlAjEQX+pkOlFAxkt8HwmCbNwyK2qf5FZCJNazaiKIJ2wxMELkc+HwQ8IF2AYEIKYmq1fUJRPSQqNHVNVGKlFC+5k30M120fm8hzmGXEHl7MYkV60kvW0bOX0qtCaSvUFuwAN1hNsbIsuG8ePcshpUUIQnBpsZmntiwkZa2dvB4+p5DMkB3bCPtyuS/LvQKyfkVyy6Pluqc4BwzEs/N01GHV5LNtOCeNQXPTdMQsQTBzCn25CS2Sh7Qc9DUCq1RcKqQykIi3T2xgGQGulJgZMFIMLe6mltHjeT1HbtYV3+EB64az8Mzp8LJ07aJ6t1ml812a0wDTbMloWi1+BL0CUSWpG6WkSTpakHK7bzyMutb/NV3rKf7usnWM7lyLUF1CIeGVoE/CPEECx+azdzbJ8GXDTgDHgKRELTHLFCyz40vFEQp94BHZvbwEWQ0nWd//Xv+8Nnn1pzr6w/b2khnrPAtmWbncNh9BGVFIRtg1llLxlUApNC0hJ7XlqdLuHFNn2j1MzXbUXDinjmZ5IZPcU4cB+8uYbYkczClcctPl/LIXVN5acVmbrj1Kl59coG1+I9fWk06q7H8l3da/tGhpRi7eAkDvD5cqsKaJc9z8+VjeHPHLiqCAfY/8xjHuuLUt7WzubmFR2dM4aHV61g6bw4Prl7HmqbPwVe2GaMw8RSalpAsNkxOpq5RS4bgmTUFvStOYu9aVIaghIOk3l9L+O65RGWVpnU1DBpUzNhRg8npBo2tUda/8iNe+MenNJ2O8vT9N/LD2ydxJp5i/dZ6qiMlDCqNMCgYoLa5hbZEkvmvvsHizXUsmXsrj3z0CdePqKIs4GdfWzvVpSWsXnAXaV1nzaZaCPr34E2cIBDrG4gimSxQJWSRyV0th3ymiaEE/YS++yDln75jOWxy5Xo8D97N0dUbrTxSezLOFVVlDB9UTGlJ0JqrNZrk2suGsml3I7dNHs2bH+3EK1RqWlu4vLSYIo+bn/xrAwt++xxvv/9PFl07yfrv4OlW6/nu3v3UHW6w2k5FYfpf/waymQK8m+gKQjTYj0bMskKWEbJ0hVQULNJPHqfj4WfJHTjCgNdeRg4FaLn6FkQmC00tnKjdxb7ywaxbV4fX7WBtXT1vr9rCpl1HeereWfxpZS3PvPUJB5rbqN3TjC/gYmntDgaHguxrbWOPuelR1TBsKMu/2MmRjk7enX8HjWeifHKkERJ2pbB0+y6O7zkApaVm+VGLKwvOXAGQAkNrjozrhqcsFIrzZQwN7eQxZG8RsseN1t5q2b1j2HAqjjXyu4rL+PklUyHaAR6nHanM6KIqdr9mHwyNQHEAjkZhuApXKKApdv4oLYH2Tjsud8XB47bZFGg0xgPzbuWV22fjffQpUrE4BAJmUhiFzEErlD/5WO/OLhuS9V1I0iQhDCRk1PIhiHQGoWmokQGgOmxJKQp14VI7yzsUG4AiQygIDacwo8oLby6i5kALq1dtYd591xEc7UeNOHHrsiX9VbVbue/GmQwvLuJgaysVoRAuh4PXt+3g0NEmC8Rzn20h1dQMw4ZAjhOk/AetCrhHkVkIxDxDSKDJ0jQ7SduZWnLnhTph4EYQDYT5wl9s262qfPU9mqRkQIjFv5rPDRNGcGlRgAqngxcWzWV3ooNUUzuTLx3Fsu07LSCvzpvNX+q+YNkdc2no6ETTNK6tHMzJRJKtLSf42TsroazMrggUoxZ/vNdSudBHFIEhixECqUrqp9wI6zn2uf00uP32uSOf2roYP/VSy8HfWL+d3YdPUFlVhoFgxabtHE6lrMGL1nzIty4fY7VPx5M0R6M8X7OFjYePUhkOMa68jL9/ucsuXVxOu1DMOWrIOiHrsLkvIIYuzNA7ud+zhKlGq1AMgtNzfmkS9NK0u5FEOsuiO68l3tbFpOpBCENQHQzi9Xn44EA9nfsP8sz109nY0MjAgI+I14eWSoPTwYjiIg51drL9aLPVP1fDGfJ/0FTOcV9AEGZXnnzB0k9AnbcI5B6FoukvssR3brmSsN/NjsbTnNB0BhcFefqjGsKlRUwoL2NDQ5NVIE6vquR4V5ypQyt5b+9+jp9u4/4JYzkei1Nz4BD7ojEz8JzdZhRvcgfBLs5xX0AkM5HI0sT+SmqnMEg7XNT6wueblSzBmThJAS6HyrR7F9Mmy1RVFrNix35uHD2SNfWHWbXuY74/+0ZURebDww2MipTw3u79tOSyVt4a4PXwxy3bONV0DAJ+kHRTA3XEApqVQ85yn0AEQYEY259hhXSNepePve6AXSgWTCBZZwx3t/P/4p4ZjBlcgqEbPDVnJl3JNFXhEEdzOcYUhfn4QD2PzZhCTtd5ZPo1fPzQ/dyx7C1aE0me//bNtqCsityMUqIW1QzteZy/dH6nOXLlTUJR1/Z3rhiSSbC8pJJ7qqeAljn/QKQbqE6VSNiH3+umoaGNAVUB1LEe2mNJhoZC7Os4g4gnIJnCESkh4HRQ6vMSz+Q4frgB7+CBVh3WaY5RuiOibMxBEh8UrPWbx881CzxGksQ0Q7IDRG9kR2Sd7eaJ0MwnufT5o5wqWirLibYuu5zPKhxvPQ3tXkgZ7O2Igs9rRyKXk1wyRUcsToeZGE2xlg8gGYuRNH3DDPtGt0YS3lrbh3unwupXUq/vzz8cQpBTnGzxFRUefXtoxALg9HcfpAQM8YJHLdTe2choAsonc163235htiVLgntQ9fb+Lr56AGFif/7hFjptqovdZui92BOhuYJfprc7sQuSaRomxwJvWfmjH+rp7P/uL/SmJZmyXJpxqSiYtyYX3Ih5wQDEDHB9nYurPDJk06SeRdU5j/OoMKso8hxJ158AhltxsAeZV6MxRWF5w1YWGgYfhgfKKUMXwhJbLyIwZ3BKcDBnfy5TzIJBXMwdBZLIoamfIaQXKTv1zYTwP0fAfwGNu1G2zKQzagAAAABJRU5ErkJggg==');
}

.credit-card.maestro::after {
    width: 50px;
    height: 30px;
    background-image: url('data:image/png;base64,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');
    background-size: 50px 30px;	
}



form #ccnumber.withvalid {
    background-image: url(../img/paymentlogos.png), url(../img/paymentlogos.png);
    background-position: 2px -121px, 260px -61px;
    background-size: 120px 361px, 120px 361px;
    background-repeat: no-repeat;
    padding-left: 54px;
    width: 290px!important;
}
form #ccnumber.withvalid.visa {
    background-position: 2px -163px, 270px -61px;
}
form #ccnumber.withvalid.visa_electron {
    background-position: 2px -205px, 260px -61px;
}
form #ccnumber.withvalid.mastercard {
    background-position: 2px -247px, 260px -61px;
}
form #ccnumber.withvalid.maestro {
    background-position: 2px -289px, 260px -61px;
}
form #ccnumber.withvalid.amex {
    background-position: 2px -331px, 260px -61px;
}
form #ccnumber.withvalid.valid.visa {
    background-position: 2px -163px, 260px -87px;
}
form #ccnumber.withvalid.valid.visa_electron {
    background-position: 2px -205px, 260px -87px;
}
form #ccnumber.withvalid.valid.mastercard {
    background-position: 2px -247px, 260px -87px;
}
form #ccnumber.withvalid.valid.maestro {
    background-position: 2px -289px, 260px -87px;
}
form #ccnumber.withvalid.valid.amex {
    background-position: 2px -331px, 260px -87px;
}

form #ccnumber.withvalid.valid {
	border: 1px solid #32b616;
}

form #ccnumber.withvalid.invalid {
	border: 1px solid red;
}

.browser-preview {
  width: 100%;
  height: 580px;
  border: 1px solid #ccc;
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
  overflow: hidden;
  font-family: sans-serif;
  background: #fff;
}

.browser-chrome {
  background: #eee;
  height: 32px;
  display: flex;
  align-items: center;
  padding: 0 10px;
  gap: 6px;
}

.browser-chrome .dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  display: inline-block;
}

.dot.red { background: #ff5f56; }
.dot.yellow { background: #ffbd2e; }
.dot.green { background: #27c93f; }

@keyframes scrollPreview {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(var(--scroll-distance));
  }
  100% {
    transform: translateY(0);
  }
}

.preview-content img {
  display: block;
  width: 100%;
  height: auto;
  margin: 0 !important;
  animation: none;
}

.preview-content img.scrolling {
  animation: scrollPreview var(--scroll-duration, 20s) ease-in-out;
}


/* Markdown reply box (task 13242, static/js/kq-md-editor.js): Write and Preview tabs, a toolbar and a hint */
.kq-md { margin: 0; }

.kq-md-bar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px;
	margin: 0 0 6px;
}

.kq-md-tab {
	min-height: 44px;
	padding: 0 14px;
	border: 1px solid transparent;
	border-radius: 6px;
	background: transparent;
	color: #5b6675;
	font-size: 14px;
	font-weight: 600;
}

.kq-md-tab.is-on { border-color: #cfe3f5; background: #eaf4fd; color: #1f5f93; }
.kq-md-tab:focus { outline: 2px solid #2b8ad6; outline-offset: 1px; }

.kq-md-tools { display: flex; gap: 2px; margin-left: auto; }
.kq-md-tools[hidden] { display: none; }

.kq-md-tool {
	width: 44px;
	height: 44px;
	padding: 0;
	border: 0;
	border-radius: 6px;
	background: transparent;
	color: #5b6675;
	font-size: 15px;
}

.kq-md-tool:hover, .kq-md-tool:focus { background: #eef1f5; color: #1f2a37; outline: none; }

.kq-md textarea[name="message"] {
	display: block;
	width: 100%;
	min-height: 180px;
	padding: 12px 14px;
	border: 1px solid #cfd8e2;
	border-radius: 6px;
	color: #1f2a37;
	font-size: 16px;
	line-height: 1.55;
}

.kq-md textarea[name="message"][hidden] { display: none; }

.kq-md-preview {
	padding: 12px 14px 2px;
	border: 1px solid #cfd8e2;
	border-radius: 6px;
	background: #fff;
	color: #1f2a37;
	font-size: 15px;
	line-height: 1.6;
	overflow-wrap: break-word;
}

.kq-md-preview[hidden] { display: none; }
.kq-md-empty { color: #8a95a3; }

.kq-md-hint { margin: 6px 0 0; color: #6b7684; font-size: 13px; }

.kq-md-hint code {
	padding: .1em .35em;
	border: 0;
	border-radius: 4px;
	background: #eef1f5;
	color: #1f2a37;
	font-size: .9em;
	white-space: nowrap;
}

@media (max-width: 479px) {
	.kq-md-tools { margin-left: 0; width: 100%; }
}