span.fw-fancy-checkbox-tick {
	position: relative;
    margin-right: 5px;
}

div.checkbox span.fw-fancy-checkbox-tick {
    padding-right: 0.5em;
}

/* This label will be generated by the fw_plugin.js code immediately after the input box */
/* This essentially draws the rounded box in which the tick is contained */
label.fw-fancy-checkbox-tick {
	position: absolute;
	top: -2px;
	left: -18px;
	width: 15px;
	height: 15px;
	background: #ffffff;
	border: 2px solid #3c3c3c;
	border-radius: 3px;
    min-height: 15px !important;
    max-width: none !important;
    margin-bottom: auto !important;
    padding-left: 0px !important;
    box-sizing: content-box;
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;
}

div.checkbox label.fw-fancy-checkbox-tick {
    left: -20px;
}

input.fw-fancy-checkbox.input-form-validation-error~span.fw-fancy-checkbox-tick label.fw-fancy-checkbox-tick {
	border-color: red;
}

/* Make the background and border lighter when the checkbox is disabled */
span.fw-fancy-checkbox-tick-disabled label.fw-fancy-checkbox-tick {
    background: #ebebeb;
    border: 2px solid #8f8f8f;
}

/* Display the actual tick inside the rounded box we just created */
label.fw-fancy-checkbox-tick:after {
	opacity: 0;
	content: '';
	position: absolute;
	width: 9px;
	height: 4px;
	background: transparent;
	top: 3px;
	left: 2px;
	border: 3px solid #333;
	border-top: none;
	border-right: none;
    box-sizing: content-box;
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;

	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

/*div.checkbox label.fw-fancy-checkbox-tick:after {
    width: 16px;
    height: 8px;
    top: 5px;
}*/

/* Create the checked state for the tick */
input.fw-fancy-checkbox[type=checkbox]:checked+span.fw-fancy-checkbox-tick:not(.fw-fancy-checkbox-tick-disabled) label.fw-fancy-checkbox-tick:after {
	opacity: 1;
}

/* Create the checked and hover state for the tick */
input.fw-fancy-checkbox[type=checkbox]:checked:hover+span.fw-fancy-checkbox-tick:not(.fw-fancy-checkbox-tick-disabled) label.fw-fancy-checkbox-tick:after {
	opacity: 0.6;
}

/* Create the hover event for the tick */
input.fw-fancy-checkbox:hover:not(:disabled):not(:checked)+span.fw-fancy-checkbox-tick:not(.fw-fancy-checkbox-tick-disabled) label.fw-fancy-checkbox-tick:after {
    opacity: 0.4;
}

/* Blue border for focus */
input.fw-fancy-checkbox:focus:not(:disabled)+span.fw-fancy-checkbox-tick label.fw-fancy-checkbox-tick {
    border-color: rgb(97, 157, 215);
}

input.fw-fancy-checkbox:not(:disabled)+span label.fw-fancy-checkbox-pointer {
    cursor: pointer;
}

/* Make the checked state of the tick a little lighter when disabled */
input.fw-fancy-checkbox:disabled:checked+span.fw-fancy-checkbox-tick label.fw-fancy-checkbox-tick:after {
    opacity: 0.6;
}

span.fw-fancy-radio-tick {
	position: relative;
	margin-right: 5px;
}

div.checkbox span.fw-fancy-radio-tick {
	padding-right: 0.5em;
}

/* This label will be generated by the fw_plugin.js code immediately after the input box */
/* This essentially draws the outside circle */
label.fw-fancy-radio-tick {
	position: absolute;
	top: -1px;
	left: -18px;
	width: 15px;
	height: 15px;
	background: #ffffff;
	border: 2px solid #3c3c3c;
	border-radius: 50%;
    max-width: none;
    box-sizing: content-box;
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;
}

input.fw-fancy-radio.input-form-validation-error~span.fw-fancy-radio-tick label.fw-fancy-radio-tick {
	border-color: red;
}

/* Make the background and border lighter when the radio is disabled */
span.fw-fancy-radio-tick-disabled label.fw-fancy-radio-tick {
	background: #ebebeb;
	border: 2px solid #8f8f8f;
}

/* Display the dot inside the circle we just created */
label.fw-fancy-radio-tick:after {
	opacity: 0;
	content: '';
	position: absolute;
	width: 1px;
	height: 1px;
	background: #333;
	top: 4px;
	left: 4px;
	border: 3px solid #333;
	border-radius: 50%;
    box-sizing: content-box;
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;
}

/* Create the hover event for the tick */
input.fw-fancy-radio:hover:not(:disabled)+span.fw-fancy-radio-tick label.fw-fancy-radio-tick:after {
	opacity: 0.4;
}

/* Get rid of the outline from browsers when focussed */
input.fw-fancy-radio:focus:not(:disabled) {
	outline: none;
}

/* Blue border for focus */
input.fw-fancy-radio:focus:not(:disabled)+span.fw-fancy-radio-tick label.fw-fancy-radio-tick {
	border-color: rgb(97, 157, 215);
}

input.fw-fancy-radio:not(:disabled)+span label.fw-fancy-radio-pointer {
	cursor: pointer;
}

/* Create the checked state for the tick */
input.fw-fancy-radio[type=radio]:checked+span.fw-fancy-radio-tick label.fw-fancy-radio-tick:after {
	opacity: 1;
}

/* Make the checked state of the tick a little lighter when disabled */
input.fw-fancy-radio:disabled:checked+span.fw-fancy-radio-tick label.fw-fancy-radio-tick:after {
	opacity: 0.6;
}

/* Make the label for the fancy radio grayed out when disabled */
.fw-fancy-radio-tick-disabled {
	color: #8f8f8f;
}

.fw-scroller {
	overflow: hidden;
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
}

.fw-scroller ul {
    padding: 0;
    margin: 0;
    position: relative;
}

.fw-scroller li {
    padding: 0;
    margin: 0;
    list-style-type: none;
    position: absolute;
}

.fw-hideable-heading {
	font-weight: 300;
}

.fw-hideable-heading:hover {
	cursor: pointer;
}

.fw-carousel-index {
	position: absolute;
}

.fw-carousel-index .nav-index-item {
	width: 15px;
	height: 15px;
	border-radius: 50%;
	display: inline-block;
	background-color: #002d5c;
	opacity: 1;
	border: none;
	margin: 0 4px;
	vertical-align: bottom
}

.fw-carousel-index .nav-index-item:first-child {
	margin-left: 0
}

.fw-carousel-index .nav-index-item:last-child {
	margin-right:0
}

.fw-carousel-index .nav-index-item.active {
	background-color: #aaa;
	border: none;
}

.fw-carousel-index img {
	position: relative;
}

.fw-carousel-index img:hover,.fw-carousel-index div:hover {
	cursor: pointer;
}

.fw-carousel-index-bottom-left {
	bottom: 10px;
	left: 10px;
}

.fw-carousel-index-bottom-left img {
	float: left;
	padding-left: 5px;
}

.fw-carousel-index-top-left {
	top: 10px;
	left: 10px;
}

.fw-carousel-index-top-left img {
	float: left;
	padding-left: 5px;
}

.fw-carousel-index-bottom-right {
	bottom: 10px;
	right: 10px;
}

.fw-carousel-index-bottom-right img {
	float: right;
	padding-right: 5px;
}

.fw-carousel-index-top-right {
	top: 10px;
	right: 10px;
}

.fw-carousel-index-top-right img {
	float: right;
	padding-right: 5px;
}

.fw-carousel-nav-buttons {
    position: absolute;
    left:0;
    right:0;
    bottom:50%;
    z-index:100
}
@media (min-width: 1200px) {
    .fw-carousel-nav-buttons {
        width:1043px;
        left:-120px
    }
}

.fw-carousel-btn-prev,.fw-carousel-btn-next {
    font-size:4em;
    background:rgba(0,105,146,0.6);
    color:#fff;
    border-radius:50%;
    margin-top:-25px;
    width:50px;
    height:50px;
    text-align:center;
    line-height:50px;
    display:block;
    position:absolute;
    text-decoration:none;
    -webkit-transition:background 0.3s,color 0.3s;
    -o-transition:background 0.3s,color 0.3s;
    transition:background 0.3s,color 0.3s
}

.fw-carousel-btn-prev:hover,.fw-carousel-btn-prev:focus,.fw-carousel-btn-next:hover,.fw-carousel-btn-next:focus {
    background:rgba(51,175,91,0.6);
    color:#fff;
    text-decoration:none
}

.fw-carousel-btn-prev {
    left:30px
}
@media (min-width: 768px) {
    .fw-carousel-btn-prev {
        left:60px
    }
}
@media (min-width: 992px) {
    .fw-carousel-btn-prev {
        left:90px
    }
}

.fw-carousel-btn-next {
    right:30px
}
@media (min-width: 768px) {
    .fw-carousel-btn-next {
        right:60px
    }
}
@media (min-width: 992px) {
    .fw-carousel-btn-next {
        right:90px
    }
}