
td{
font-family: Arial,Helvetica,Sans;
}
hr{
border-top: 1px solid #5A5D6B !important;
}
/*** INPUT STYLES ***/
body {
	margin: 0;
	padding: 0;
	background-color: #EFEBE7;
}
h2{
font-family: Arial,Helvetica,Sans;
font-size: 18px;
}

.fwOptHorizontal {
	position: relative;
	margin: 0;
	padding: 0;
}
.fwOptHorizontal li {
	list-style: none;
	display: inline-block;
	margin: 5px 5px; 20px 0;
	font-size: 1.2rem;
}
.fwOptHorizontal li:first-child {
	font-size: 22px !important;
}

#fwImgLink, #fwTextLink {
	position: relative;
	width: 100%;
	height: auto;
	text-align: center;
	font-size: 0.9rem;
	display: inline-block;
	text-decoration: none;
	color: #FFFFFF;
	z-index: 10;
}
#fwButtonLink{
	padding: 5px;;
	border: 1px solid #FFFFFF;
	width: auto !important;
	margin: 5px; auto;
	transition: 0.2s ease all;
	color: #FFFFFF;
	display: inline-block;
	text-align: center;
	font-size: 0.9rem;
	text-decoration: none;
	z-index: 10;
}
#fwButtonLink:hover{
	color: #000000 !important;
	background: #FFFFFF !important;
}
#fwNoLink:after, #fwTextLink:after, #fwButtonLink:after{
	content: '';
	display: block;
	clear: both;
}
/* Link Icons */
#fwTextLink.None:after, #fwButtonLink.None:after{
	content: '';
}
#fwTextLink.Right_Carat:after, #fwButtonLink.Right_Carat:after{
	content: '\203A';
	font-size: 1.1rem;
	padding-left: 3px;
	display: inline-block;
}
#fwTextLink.Double_Right_Carat:after, #fwButtonLink.Double_Right_Carat:after{
	content: '\00BB';
	font-size: 1.1rem;
	padding-left: 3px;
	display: inline-block;
}
#fwTextLink.Right_Triangle:after, #fwButtonLink.Right_Triangle:after{
	content: '\25B8';
	font-size: 1.1rem;
	padding-left: 3px;
	display: inline-block;
}
#fwTextLink.Right_Arrow:after, #fwButtonLink.Right_Arrow:after{
	content: '\2192';
	font-size: 1.1rem;
	padding-left: 3px;
	display: inline-block;
}

#fwLnkType{
	margin:5px;
}

/*** Custom Radio Button Styles ***/
/* The fwRadioContainer */
.fwRadioContainer {
  display: block;
  position: relative;
  padding-left:30px;
  padding-top:5px;
  margin-bottom: 12px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
/* Hide the browser's default radio button */
.fwRadioContainer input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}
/* Create a custom radio button */
.fwCheckMark {
  position: absolute;
  top:0;
  left: 0;
  height: 20px;
  width: 20px;
  background-color: #eee;
  border:1px solid #333;
  border-radius: 50%;
}
/* On mouse-over, add a grey background color */
.fwRadioContainer:hover input ~ .fwCheckMark {
  background-color: #ccc;
}
/* When the radio button is checked, add a background */
.fwRadioContainer input:checked ~ .fwCheckMark {
  background-color: #5A5D6B;
}
/* Create the indicator (the dot/circle - hidden when not checked) */
.fwCheckMark:after {
  content: "";
  position: absolute;
  display: none;
}
/* Show the indicator (dot/circle) when checked */
.fwRadioContainer input:checked ~ .fwCheckMark:after {
  display: block;
}
/* Style the indicator (dot/circle) */
.fwRadioContainer .fwCheckMark:after {
  top: 6px;
  left: 6px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: white;
}


/*** CUSTOM CHECKBOX STYLES ***/
/* The fwCheckContainer */
.fwCheckContainer {
  display: block;
  position: relative;
  padding-top:5px;  
  padding-left:30px;
  margin-bottom:12px;
  cursor: pointer;
  font-size: 22px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
/* Hide the browser's default checkbox */
.fwCheckContainer input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}
/* Create a custom checkbox */
.fwCheckBox {
  position: absolute;
  top: 0;
  left: 0;
  height: 20px;
  width: 20px;
  border:1px solid #333;
  background-color: #eee;
}
/* On mouse-over, add a grey background color */
.fwCheckContainer:hover input ~ .fwCheckBox {
  background-color: #ccc;
}
/* When the checkbox is checked, add a background */
.fwCheckContainer input:checked ~ .fwCheckBox {
  background-color: #5A5D6B;
}
/* Create the checkmark/indicator (hidden when not checked) */
.fwCheckBox:after {
  content: "";
  position: absolute;
  display:none;
}
/* Show the checkmark when checked */
.fwCheckContainer input:checked ~ .fwCheckBox:after {
  display: block;
}
/* Style the checkmark/indicator */
.fwCheckContainer .fwCheckBox:after {
  left: 6px;
  top: 3px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

/* OUTPUT STYLES */

@media only screen and (max-width: 786px){
.hov3Col, .hov4Col, .hov5Col{
display: block !important;
width: 100% !important;
margin: 5px auto !important;
}
}

/* Output Structure */
.hovRow{
	position: relative;
	width: 100%;
	max-width: 100%;
	height: auto;
	display: block;
	clear: both;
	text-align: center;
	font-size: 0;
}
.hovRow:after{
	content: '';
	display: block;
	clear: both;
}
.hov1Col{
	position: relative;
	width: 100%;
	max-width: 100%;
	height: auto;
	display: block;
	clear: both;
	font-size: 1rem;
}
.hov2Col{
	position: relative;
	display: inline-block;
	vertical-align: top;
	width: 50%;
	max-width: 100%;
	height: auto;
	font-size: 1rem;
}
.hov3Col{
	position: relative;
	display: inline-block;
	vertical-align: top;
	width: 33.33%;
	max-width: 100%;
	height: auto;
	font-size: 1rem;
}
.hov4Col{
	position: relative;
	display: inline-block;
	vertical-align: top;
	width: 25%;
	max-width: 100%;
	height: auto;
	font-size: 1rem;
}
.hov5Col{
	position: relative;
	display: inline-block;
	vertical-align: top;
	width: 20%;
	max-width: 100%;
	height: auto;
	font-size: 1rem;
}

#backgroundImage{
	display: inline-block !important;
  vertical-align: middle !important;
  width: 80% !important;
  position: relative;
}


.hovFormFieldDiv {
	white-space:nowrap;
	position: relative;
	width: 100%;
	max-width: 100%;
	height: auto;
	margin: 5px;
}
.hovFormFieldDiv label {
	font-size: 13px;
	font-weight: bold;
	font-family: Arial, sans-serif;
}
.hovSmallText {
	font-size: 5px;
	font-style: italic;
	font-weight: normal !important;
}
.hovFormFieldDiv input[type="text"], .hovFormFieldDiv input[type="number"], .hovFormFieldDiv textarea {
	padding: 4px;
	width: 98%;
	border: 1px solid #5A5D6B;
	/*border-radius: 5px;*/
	color: #5A5D6B;
	-webkit-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;
	background-clip: padding-box;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	word-break: normal;
	font-size: 0.857rem;
}
.hovFormFieldDiv input[type="text"]:focus, .hovFormFieldDiv textarea:focus {
	outline: 0;
	border-color: #5A5D6B;
	-webkit-box-shadow: 0 0 0 1px #5A5D6B;
	box-shadow: 0 0 0 1px #5A5D6B;
}
.hovFormFieldDiv input[type="file"] {
	border: 0 !important;
	background: #EFEBE7 !important;
}

/*** Preview Styles ***/
.hovLink {
	background: #5A5D6B;
	/*border: 2px dashed #e0d5cc;*/
	margin: 5px;;
	text-decoration: none;
}
/*** OUTPUT STYLES ***/
.hovLink, .hovLink:hover, .hovLink:focus{
	text-decoration: none !important;
	display: block;
}
#hovDiv{
	position: relative;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	background-image:url('./default_bg_image.jpg');
	padding: 2rem;
	min-height: 400px;
	transition: 0.2s ease all;
}
#hovDiv:before{
	content: "";
	display: block;
	position: absolute;
	z-index: 1;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgba(0,0,0,.35);
	transition: 0.2s ease all;
}
#hovDiv:hover:before{
	content: "";
    display: block;
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0,0,0,.5) !important;
	transition: 0.2s ease all;
}
.hovContent{
	position: absolute;
    width: 90%;
    max-width: 90%;
    text-align: center;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: 15;
    color: #FFFFFF;
}
#hovHeadline {
	position: relative;
	width: 100%;
	height: auto;
	text-align: center;
	font-size: 2rem;
	margin-bottom: 0.5rem;
	color: #FFFFFF;
	z-index: 10;
	font-family: adobe-garamond-pro, serif;
	font-weight: 600;
	font-style: normal;
}
#hovText {
	transition: 0.2s ease all;
	position: relative;
    width: auto;
    height: auto;
    text-align: center;
    font-size: 1rem;
    margin: 1rem 0;
    color: #FFFFFF;
    z-index: 10;
}
#hovLinkButton{
	position: relative;
	z-index: 10;
}
#hovNoLinkText{
	display: none;
	z-index: 10;
}

#hovDiv:hover #hovHeadline.hovHoverHide, #hovDiv:hover #hovText.hovHoverHide, #hovDiv:hover #hovLinkButton.hovHoverHide{
	display: none;
}
#hovLinkOptions, #fwLinkHovOptional{
	display: none;
}

#hovHeadlineTextHoverDiv, #hovHeadlineHover, #hovTextHover, #hovTextContentHoverDiv{
	display: none;
}

#hovHeadlineHover{
	transition: 0.2s ease all;
	font-weight: bold;
	position: relative;
	width: 100%;
	height: auto;
	text-align: center;
	font-size: 2rem;
	margin-bottom: 0.5rem;
	color: #FFFFFF;
	z-index: 10;
	font-family: adobe-garamond-pro, serif;
	font-weight: 600;
	font-style: normal;
}

#hovTextHover{
	transition: 0.2s ease all;
	position: relative;
	width: auto;
	height: auto;
	text-align: center;
	font-size: 1rem;
	margin: 1rem 0;
	color: #FFFFFF;
	z-index: 10;	
}

#hovDiv:hover #hovHeadlineHover{
	display:block !important;
}

#hovDiv:hover #hovTextHover{
	display:block !important;
}
