/* CSS_Styling.htm content */

*{
  padding: 0px;
  margin: 0px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  text-shadow: none;
}

body {
  background: #DCDDDF url(https://static.cdn.responsys.net/i5/responsysimages/content/valuer/7AF2Qzt.png);
  color: #000;
  font: 14px Arial;
  margin: 0 auto;
  padding: 0;
  position: relative;
}

h1{
  padding: 0px;
  margin: 0px;
  font-size: 20px;
  color: #000;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: normal;
  font-style: italic;
}

h2{
  margin: 20px 0px;
  color: #000;
  font-weight: 300;
  font-size: 20px;
}

h2 i{
  font-size: 14px;
  position: relative;
  top: -5px;
  color: #000;
}

.container {
  margin: 25px auto;
  position: relative;
  width: 1000px;
}

header{
  overflow: hidden;
  border-bottom: 1px dotted #999;
}

.logo{
  width: 232px;
  float: right;
  padding-bottom: 10px;
}

.mainTitle{
  float: left;
  padding-bottom: 10px;
  padding-left: 10px;
}

.content {
  background: #ffffff;
  -webkit-box-shadow: 0 1px 0 #fff inset;
  -moz-box-shadow: 0 1px 0 #fff inset;
  -ms-box-shadow: 0 1px 0 #fff inset;
  -o-box-shadow: 0 1px 0 #fff inset;
  box-shadow: 0 1px 0 #fff inset;
  border: 1px solid #c4c6ca;
  margin: 0 auto;
  padding: 25px;
  position: relative;
  text-align: center;
  text-shadow: 0 1px 0 #fff;
  /* width: 1000px; */
}

article{
  padding: 25px 0px;
  overflow: hidden;
  min-height: 500px;
}

.btn-primary[disabled], .btn-primary.disabled, .btn-primary[disabled]:hover, .btn-primary.disabled:hover{
  background-color: #e4e4e4;
  border-color: #000000;
}

.back_btn{
  float: left;
  background-color: #2980b9;
  color: #FFF;
}

.btn-default:hover {
  background-color: #d8bf86;
  color: #FFF;
}

input.btn-default{
  margin-right: 22px;
    float: right;
}

button.btn-primary i{
  float: left;
  font-weight: 300;
  text-shadow: none;
  margin-top: 4px;
}

#breadcrumb{
  float: left;
  display: block;
  width: 100%;
}

#breadcrumb ul {
  list-style: none;
  text-align: left;
}


.select_btn{
  float: left;
  width: 100%;
  margin-bottom: 10px;
  height: 100px;
  font-weight: bold;
  border-color: #000000;
}

.select_btn:nth-child(odd) {
  background: #E5E5E5;
}

.select_btn:nth-child(even) {
  background: #CFCFCF;
}

.select_btn:nth-child(odd):hover {
  background: #2e6da4;
  border-color: #000000;
}

.select_btn:nth-child(even):hover {
  background: #2e6da4;
  border-color: #000000;
}

.select_btn img{
  float: left;
  position: relative;
  top: 3px;
}

i[atitle]:hover:after {
  content: attr(atitle);
  border: #c0c0c0 1px dotted;
  padding: 5px 20px 5px 5px;
  display: block;
  z-index: 100;
  background: url(../images/status-info.png) #f0f0f0 no-repeat 100% 5%;
  left: 0px;
  margin: 10px;
  width: 250px;
  position: absolute;
  top: 10px;
  text-decoration: none
}

.lineKeyList li, .pieKeyList li{
  padding: 5px 0px;
}

button.btn-primary i{
  color: #000;
  font-weight: 400;
}

#breadcrumb {
  list-style: none;
  display: inline-block;
}
#breadcrumb .icon {
  font-size: 14px;
}
#breadcrumb li {
  float: left;
  color: #FFF !important;
}
#breadcrumb li a {
  color: #FFF !important;
  display: block;
  background: #3498db;
  text-decoration: none;
  position: relative;
  height: 40px;
  line-height: 40px;
  padding: 0 10px 0 5px;
  text-align: center;
  margin-right: 23px;
  text-shadow: none;
}
#breadcrumb li:nth-child(even) a {
  background-color: #2980b9;
}
#breadcrumb li:nth-child(even) a:before {
  border-color: #2980b9;
  border-left-color: transparent;
}
#breadcrumb li:nth-child(even) a:after {
  border-left-color: #2980b9;
}
#breadcrumb li:first-child a {
  padding-left: 15px;
  -moz-border-radius: 4px 0 0 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px 0 0 4px;
}
#breadcrumb li:first-child a:before {
  border: none;
}
#breadcrumb li:last-child a {
  padding-right: 15px;
  -moz-border-radius: 0 4px 4px 0;
  -webkit-border-radius: 0;
  border-radius: 0 4px 4px 0;
}
#breadcrumb li:last-child a:after {
  border: none;
}
#breadcrumb li a:before, #breadcrumb li a:after {
  content: "";
  position: absolute;
  top: 0;
  border: 0 solid #3498db;
  border-width: 20px 10px;
  width: 0;
  height: 0;
}
#breadcrumb li a:before {
  left: -20px;
  border-left-color: transparent;
}
#breadcrumb li a:after {
  left: 100%;
  border-color: transparent;
  border-left-color: #3498db;
}

#breadcrumb li a span:hover {
  color: #1abc9c;
}

#breadcrumb .icon:hover{
    color: #d8bf86;
}

#breadcrumb li a:active:after {
  border-left-color: #d8bf86;
}

#breadcrumbs{
  overflow: hidden;
}

.footer{
  margin: 10px;
}

.width100{
  width: 100% !important;
  max-width: 1000px;
}

/* MEDIA QUERIES */
@media all and (max-width:480px){

  .logo{
    width: 100% !important;
  }

  .mainTitle {
    float: none !important;
  }

}




body {
  padding: 0px;
  margin: 0px;
  font-size: 12px !important;
}

input,
select {
  border: 1px solid #000000 !important;
  background-color: #ffffff;
  width: 100%;
  padding: 5px;
  color: #4e4e4e !important;
}

.optionButtons a {
  color: inherit !important;
}

.inner {
  margin: 20px auto;
  padding: 0px;
  width: 100%;
  min-width: 1040px;
  display: flex;
  align-items: flex-start;
}

.templateArea {
  width: 740px;
  float: left;
  border: 1px solid #4e4e4e;
  background-color: #ffffff;
}

.btn {
  font-size: 12px !important;
}

.optionButtons {
  position: sticky;
  top: 20px;
  width: 240px;
  margin: 0px 0px 0px 10px;
  border: 1px solid #000000;
  border-radius: 5px;
  padding: 10px 10px;
  background-color: #e4e4e4;
}

.styling_buttons button {
  padding: 10px;
}

.newModules {
  position: sticky;
  top: 20px;
  width: 200px;
  margin: 0px 10px 0px 0px;
  border: 1px solid #000000;
  border-radius: 5px;
  padding: 10px 10px;
  background-color: #AEC6CF;
}

h4 {
  margin: 0px;
  padding: 0px;
  text-align: left;
  border-bottom: 1px solid #4e4e4e;
  padding-bottom: 10px;
  margin-bottom: 10px;
  font-weight: bold;
}

.templateArea h4 {
  padding: 21px 0px 10px 0px;
  margin: 0px 20px;
}

.cretive_output_inner h4 {
  margin: 15px;
}

.outputHTML {
  display: none;
}

#sortable1,
#draggable1,
#headerModule,
#footerModule {
  list-style-type: none;
}

#draggable1 {
  padding: 0px;
}

#sortable1 {
  min-height: 20px;
  width: 602px;
  margin: auto;
}

#sortable1 li,
#draggable1 li,
#headerModule li,
#footerModule li {
  /*                margin: 0 5px 5px 5px;
  padding: 5px;*/
  font-size: 1.2em;
  width: 602px;
  min-height: 20px !important;
  height: auto !important;
  margin: auto;
}

#sortable1 li {
  margin: 5px 0px;
}

ul#draggable1 li.dividerli {
  padding: 0px;
  margin: 0px;
  min-height: auto !important;
}

#draggable1 li {
  width: auto;
  padding: 5px;
  margin: 5px 0px;
  font-size: 12px;
}

ul#draggable1 li.dividerli hr {
  margin-top: 10px;
  margin-bottom: 10px;
}

#headerModule ul,
#footerModule ul,
#sortable1 li {
  background-color: transparent !important;
  min-height: 134px !important;
  overflow: hidden;
}
#headerModule li,
#footerModule li {
  background-color: transparent;
}

ul#headerModule {
  margin: 20px 0px 0px 0px;
}

#headerModule img,
#footerModule img {
  display: block;
  margin: 0 auto;
}

[class^="icon-"]:before,
[class*=" icon-"]:before {
  color: #337ab7;
}

#sortable1 [class^="icon-"]:before,
[class*=" icon-"]:before {
  float: left;
  position: relative;
  left: -28px;
  color: #fff;
  border: 1px solid #e4e4e4;
  border-radius: 12px;
  width: 25px;
  padding: 5px;
  margin: 10px auto;
  background-color: #4e4e4e;
}

.moduleOption {
  position: absolute;
}

.moduleOption [class^="icon-"]:before,
[class*=" icon-"]:before {
  float: left;
  position: relative;
  left: -20px;
  clear: both;
  padding-bottom: 10px;
  font-size: 14px;
  color: #337ab7;
}

.ui-selectable-placeholder {
  background: #F00 !important;
}

ul#draggable1 li {
  cursor: cursor: -webkit-grab;
  cursor: grab;
  text-align: center;
  border-radius: 5px;
}

.addText {
  text-align: center;
  color: " + charcoalHEX + "
  padding: 20px;
  border: 2px dashed rgb(133, 147, 149);
  margin: 20px auto;
  width: 50%;
}

button,
input,
optgroup,
select,
textarea {
  font-size: 12px !important;
}

.linkText:before {
  /*
  font-family: FontAwesome;
  content: "\f0c1";
  color: #F00;
  font-size: 12px;
  */
}

.selectVillage button:active,
.active {
  border: 0px;
  outline: 1px solid #c5c5c5;
  background-color: #e8ca01;
}

.selectVillage button:active,
.error {
  background-color: #ea3c53;
}

.selectVillage .error {
  background-color: #ea3c53;
}

.selectVillage {
  margin: 0px 0px 5px 0px;
  width: 100%;
  background-color: #ffffff !important;
  color: #337ab7 !important;
}

.village_selector_select button {
  width: 22%;
  margin: 1%;
}

.success {
  background-color: #a3e5ca;
}

.successGold {
  background-color: #e8ca01;
}

.error {
  background-color: #ffcbbc;
}

.errorDark {
  background-color: #ff8663;
}

.copy_description_confirmation {
  color: #000000;
  font-weight: bold;
}

.optionBtn {
  width: 100%;
  margin-bottom: 10px !important;
}

.optionBtn [class^="icon-"]:before,
.optionBtn [class*=" icon-"]:before {
  float: left;
  position: relative;
  left: 0px;
  top: 3px;
}

h4 [class^="icon-"]:before,
h4 [class*=" icon-"]:before {
  float: left;
  position: relative;
  left: 0px;
  top: 0px;
  padding-right: 10px;
}

select {
  border: 0;
  outline: 1px solid #c5c5c5;
  background: #f6f6f6;
  height: 25px;
}
/* module border */

.switch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
}

.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider {
  background-color: #2196F3;
}

input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}
/* Rounded sliders */

.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}
/* //module border */
/* Edit Area */

.jqte {
  display: none;
}

.jqte {
  position: fixed;
  /* or absolute */
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.styling_buttons {
  padding: 15px;
  width: 100%;
  background: #fff;
}

.jqte_editor {
  border: 1px solid #4e4e4e;
}

script {
  display: block;
}
/*            #code_output{
  height: 1px !important;
  overflow: hidden;
  }  */
/* bootbox link area */

.bootbox-form textarea {
  height: 150px;
}

.bootbox-form {
  overflow: hidden;
}
/* BIF styling */

.select_btn {
  width: 198px !important;
  padding: 10px;
}

.btn-primary:hover,
.select_btn:hover {
  color: #337ab7;
}

.button_icon {
  width: 52px;
  height: 60px !important;
  padding: 0px !important;
}

.button_icon table {
  width: 52px;
  height: 60px !important;
  padding: 0px !important;
}

.button_header table {
  width: 124px;
  height: 60px !important;
  padding: 0px !important;
}

.button_header {
  width: 116px !important;
  height: 60px !important;
  text-align: left;
  font-size: 12px;
}

a.btn-primary i {
  font-size: 32px;
}

legend {
  display: block;
  width: auto;
  font-size: 14px;
  text-align: left;
  color: #000;
  padding: 10px;
  font-weight: bold;
  border: 1px solid #000;
  background-color: #e4e4e4;
  color: #000000;
  text-shadow: none;
}

fieldset {
  border: 1px groove #000;
  margin: 0px 0px 25px 0px;
  padding-top: 15px;
  padding-bottom: 15px;
}

.REPORT_btn,
.REF_btn,
.TOOL_btn,
.DEV_btn {
  background-color: #f2f5f6;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#f2f5f6), to(#c8d7dc)) !important;
  background-image: -webkit-linear-gradient(top, #f2f5f6, #c8d7dc) !important;
  background-image: -moz-linear-gradient(top, #f2f5f6, #c8d7dc) !important;
  background-image: -ms-linear-gradient(top, #f2f5f6, #c8d7dc) !important;
  background-image: -o-linear-gradient(top, #f2f5f6, #c8d7dc) !important;
  background-image: linear-gradient(to bottom, #f2f5f6, #c8d7dc);
  filter: progid: DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#f2f5f6, endColorstr=#c8d7dc) !important;
}

.REF_btn {
  background-color: #E6E6E6;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#E6E6E6), to(#CCCCCC)) !important;
  background-image: -webkit-linear-gradient(top, #E6E6E6, #CCCCCC) !important;
  background-image: -moz-linear-gradient(top, #E6E6E6, #CCCCCC) !important;
  background-image: -ms-linear-gradient(top, #E6E6E6, #CCCCCC) !important;
  background-image: -o-linear-gradient(top, #E6E6E6, #CCCCCC) !important;
  background-image: linear-gradient(to bottom, #E6E6E6, #CCCCCC);
  filter: progid: DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#E6E6E6, endColorstr=#CCCCCC) !important;
}

.iconised {
  display: inline-block;
  border-radius: 60px;
  box-shadow: 0px 0px 2px #337ab7;
  padding: 0.5em 0.6em;
  background-color: #ffffff;
  color: #000000;
  margin-right: 5px;
}

.iconised_small {
  display: inline-block;
  border-radius: 60px;
  box-shadow: 0px 0px 2px #337ab7;
  padding: 0.5em 0.9em;
  background-color: #ffffff;
  color: #000000;
  margin-right: 5px;
}
/* additional */

.select_btn {
  cursor: pointer;
}

#function_selection {
  display: block;
}

#function_selection,
#FIRST_NAME_selection,
#FIRST_NAME_DEFAULT_selection,
#TEXT_ENGAGEMENT_selection,
#SPEND_ENGAGEMENT_selection {
  padding: 10px;
}

.bifArea p {
  text-align: center;
}

.bg-5bc0de {
  background-color: #5bc0de !important;
}

.font-ffffff {
  color: #ffffff !important;
}

.bifArea #FIRST_NAME_selection h5,
#FIRST_NAME_DEFAULT_selection h5,
#TEXT_ENGAGEMENT_selection h5,
#SPEND_ENGAGEMENT_selection h5 {
  border-bottom: 1px solid #000000;
  text-align: center;
}

.bifArea h6 {
  text-align: center;
  margin: 0px 0px 10px 0px;
}

#DATE_selection,
#FIRST_NAME_selection,
#SALUTATION_selection,
#FIRST_NAME_DEFAULT_selection,
#TEXT_ENGAGEMENT_selection,
#SPEND_ENGAGEMENT_selection {
  display: none;
  padding: 3px;
}

h3 {
  margin: 20px 0px;
  color: #000;
  font-weight: 300;
  font-size: 20px;
  text-align: left;
}

.selection {
  display: block;
}

.select_btn img {
  float: none;
  position: relative;
  top: 0px;
}

.select_btn {
  cursor: pointer;
  display: table;
}

.select_btn img {
  text-align: center;
  vertical-align: middle;
}

.select_btn {
  width: 204px !important;
}

.function_back_btn,
.function_next,
.function_next_input {
  background-color: #2980b9 !important;
  color: #FFF;
  float: left;
  clear: both;
  margin-top: 30px;
}

.back_btn {
  float: left;
  width: auto !important;
}

.select_btn:hover {
  background: #2e6da4;
  border-color: #000000;
  color: #fff;
}

ul.criteria_list {
  text-align: left;
  counter-reset: item;
  margin-bottom: 10px;
  text-align: left;
  padding-left: 10px;
  list-style-type: none;
  clear: both;
  padding-top: 10px;
  font-size: 12px;
}

ul.criteria_list li {
  padding: 5px;
}

ul.criteria_list .anchor:before,
div.select_btn span:before {
  font-family: FontAwesome;
  content: "\f0a9";
  color: #337ab7 !important;
  padding-right: 5px;
}

h2 {
  text-decoration: none;
}

h3 {
  font-weight: bold;
}

.h4,
h4 {
  font-size: 14px;
}

.container,
.content {
  width: 100% !important;
}

.select_btn {
  height: 72px !important;
  display: table;
}

.select_btn img {
  display: table-cell;
  width: 100%;
}

.select_btn span {
  display: table-cell !important;
  vertical-align: middle !important;
  text-align: center !important;
}

.criteria_list .anchor span {
  font-weight: bold;
}

div.function_back_btn span:before,
div.function_next span:before,
div.tactical-2nd_level_back_btn span:before,
div.spend-2nd_level_back_btn span:before {
  font-family: FontAwesome;
  content: "\f060";
  color: #FFF !important;
}

.radio_btn_4_liner label {
  margin: 0.6% 0.5%;
}

.radio_btn_4_liner label div {
  display: table-cell;
  vertical-align: middle;
}

.function_next,
.FIRST_NAME_language,
.FIRST_NAME_position,
.FIRST_NAME_textinput,
.SALUTATION_textinput,
.SALUTATION_language,
.function_next_input,
.function_fn_next_language,
.FIRST_NAME_output,
.SALUTATION_output,
.function_salutation_next_language,
.function_fn_next_position,
.DATE-step_1 {
  display: none;
}

.btn_area {
  overflow: hidden;
  padding: 10px 0px 10px 0px;
}

.btn_area .function_back_btn span,
.btn_area .function_next span {
  padding: 0px;
  margin: 0px;
}

.radio_btn_holder {
  overflow: hidden;
}

.bifArea {
  display: none;
  background-color: #ffffff;
}

.btn-no_bottom_border {
  border-bottom: 0px !important;
  border-radius: 4px 4px 0px 0px !important;
}

.area-no_top_border {
  border-color: #adadad;
  border-style: solid;
  border-width: 0px 1px 1px 1px;
}

.margin0px {
  margin: 0px !important;
}

.bifArea .btn,
.bifArea .ui-checkboxradio-radio-label {
  width: 100%;
  margin: 0px 0px 10px 0px;
}

.btn-secondary,
.dynamic_nextBtn,
.function_next_create {
  width: 48% !important;
  margin: 1% 0 !important;
  border: 1px solid #c5c5c5 !important;
}

.dynamic_nextBtn,
.function_next_create {
  float: right;
}

.FIRST_NAME_DEFAULT_outputtext_loop,
.FIRST_NAME_outputtext_loop {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.TEXT_ENGAGEMENT_outputtext_loop,
.SPEND_ENGAGEMENT_outputtext_loop {
  overflow: hidden;
  text-overflow: ellipsis;
}

.copyFunctionCode {
  margin: 0px 4px 0px 0px;
  padding: 10px;
}

@media all and (max-width:480px) {
  #canvas-holder_pie,
  .pieKey {
    width: 100% !important;
    padding: 5px 0px !important;
  }
  .select_btn {
    width: 100% !important;
    margin: 5px 0px !important;
    padding: 2px 0px !important;
  }
  .select_btn img {
    display: table-cell;
    width: 100%;
    height: auto;
    padding: 10px;
  }
  #breadcrumbs .back_btn {
    float: left;
    margin-top: 10px;
  }
  #breadcrumb li:first-child a {
    border-radius: 4px 0 0 0px;
  }
}
/* // BIF styling */

.width100 {
  width: 100% !important;
  max-width: 1300px;
}

h1 {
  font-size: 20px !important;
  padding: 0px !important;
  margin: 0px !important;
}

.newModules h4,
.optionButtons h4 {
  color: #000;
  text-align: left;
  font-weight: 400;
}

.optionButtons h5,
.newModules h5 {
  color: #000;
  text-align: left;
}

h5,
.h5 {
  font-size: 12px;
}

.jqte_editor,
.jqte_source {
  min-height: 200px !important;
  min-width: 500px !important;
}

.btn-primary [class^="icon-"]:before,
.btn-primary [class*=" icon-"]:before,
.btn-info [class^="icon-"]:before,
.btn-info [class*=" icon-"]:before,
.btn-success [class^="icon-"]:before,
.btn-success [class*=" icon-"]:before {
  color: #337ab7;
}

::placeholder {
  color: #337ab7;
  font-style: italic;
}

.dashed {
  border-top: 1px dashed #eee !important;
}

.optionButtons a {
  color: inherit !important;
}

.btn-primary {
  color: #000000 !important;
  background-color: #f2f5f6;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#f2f5f6), to(#c8d7dc)) !important;
  background-image: -webkit-linear-gradient(top, #f2f5f6, #c8d7dc) !important;
  background-image: -moz-linear-gradient(top, #f2f5f6, #c8d7dc) !important;
  background-image: -ms-linear-gradient(top, #f2f5f6, #c8d7dc) !important;
  background-image: -o-linear-gradient(top, #f2f5f6, #c8d7dc) !important;
  background-image: linear-gradient(to bottom, #f2f5f6, #c8d7dc);
  filter: progid: DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#f2f5f6, endColorstr=#c8d7dc) !important;
  border: 1px solid #000000 !important;
}

.btn-info {
  color: #000000 !important;
  background-color: #f2f5f6;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#f2f5f6), to(#c8d7dc)) !important;
  background-image: -webkit-linear-gradient(top, #f2f5f6, #c8d7dc) !important;
  background-image: -moz-linear-gradient(top, #f2f5f6, #c8d7dc) !important;
  background-image: -ms-linear-gradient(top, #f2f5f6, #c8d7dc) !important;
  background-image: -o-linear-gradient(top, #f2f5f6, #c8d7dc) !important;
  background-image: linear-gradient(to bottom, #f2f5f6, #c8d7dc);
  filter: progid: DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#f2f5f6, endColorstr=#c8d7dc) !important;
  border: 1px solid #000000 !important;
}

.ui-draggable-handle {
  border: 1px solid #e4e4e4;
}

.ui-state-default {
  border: 1px solid transparent;
}
.ui-state-default:hover {
  /* background-color: #e4e4e4; */
  border: 1px solid #bbb;
}

.mainTitle {
  padding-top: 20px;
}

#cancel {
  margin-left: 20px;
}
/* cyrillic-ext */

@font-face {
  font-family: 'BrownStd Regular';
  font-style: normal;
  font-weight: 400;
  src: local('BrownStd Regular'), local('NotoSans'), url(https://fonts.gstatic.com/s/notosans/v9/o-0IIpQlx3QUlC5A4PNr6DRASf6M7VBj.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */

@font-face {
  font-family: 'BrownStd Regular';
  font-style: normal;
  font-weight: 400;
  src: local('BrownStd Regular'), local('NotoSans'), url(https://fonts.gstatic.com/s/notosans/v9/o-0IIpQlx3QUlC5A4PNr4TRASf6M7VBj.woff2) format('woff2');
  unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* devanagari */

@font-face {
  font-family: 'BrownStd Regular';
  font-style: normal;
  font-weight: 400;
  src: local('BrownStd Regular'), local('NotoSans'), url(https://fonts.gstatic.com/s/notosans/v9/o-0IIpQlx3QUlC5A4PNr5DRASf6M7VBj.woff2) format('woff2');
  unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB;
}
/* greek-ext */

@font-face {
  font-family: 'BrownStd Regular';
  font-style: normal;
  font-weight: 400;
  src: local('BrownStd Regular'), local('NotoSans'), url(https://fonts.gstatic.com/s/notosans/v9/o-0IIpQlx3QUlC5A4PNr6TRASf6M7VBj.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */

@font-face {
  font-family: 'BrownStd Regular';
  font-style: normal;
  font-weight: 400;
  src: local('BrownStd Regular'), local('NotoSans'), url(https://fonts.gstatic.com/s/notosans/v9/o-0IIpQlx3QUlC5A4PNr5jRASf6M7VBj.woff2) format('woff2');
  unicode-range: U+0370-03FF;
}
/* vietnamese */

@font-face {
  font-family: 'BrownStd Regular';
  font-style: normal;
  font-weight: 400;
  src: local('BrownStd Regular'), local('NotoSans'), url(https://fonts.gstatic.com/s/notosans/v9/o-0IIpQlx3QUlC5A4PNr6jRASf6M7VBj.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */

@font-face {
  font-family: 'BrownStd Regular';
  font-style: normal;
  font-weight: 400;
  src: local('BrownStd Regular'), local('NotoSans'), url(https://fonts.gstatic.com/s/notosans/v9/o-0IIpQlx3QUlC5A4PNr6zRASf6M7VBj.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */

@font-face {
  font-family: 'BrownStd Regular';
  font-style: normal;
  font-weight: 400;
  src: local('BrownStd Regular'), local('NotoSans'), url(https://fonts.gstatic.com/s/notosans/v9/o-0IIpQlx3QUlC5A4PNr5TRASf6M7Q.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */

@font-face {
  font-family: 'Sangbleukingdom Light';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Sangbleukingdom Light'), local('NotoSerif'), url(https://fonts.gstatic.com/s/notoserif/v8/ga6Iaw1J5X9T9RW6j9bNfFoWaDq8fMVxMw.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */

@font-face {
  font-family: 'Sangbleukingdom Light';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Sangbleukingdom Light'), local('NotoSerif'), url(https://fonts.gstatic.com/s/notoserif/v8/ga6Iaw1J5X9T9RW6j9bNfFMWaDq8fMVxMw.woff2) format('woff2');
  unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */

@font-face {
  font-family: 'Sangbleukingdom Light';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Sangbleukingdom Light'), local('NotoSerif'), url(https://fonts.gstatic.com/s/notoserif/v8/ga6Iaw1J5X9T9RW6j9bNfFsWaDq8fMVxMw.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */

@font-face {
  font-family: 'Sangbleukingdom Light';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Sangbleukingdom Light'), local('NotoSerif'), url(https://fonts.gstatic.com/s/notoserif/v8/ga6Iaw1J5X9T9RW6j9bNfFQWaDq8fMVxMw.woff2) format('woff2');
  unicode-range: U+0370-03FF;
}
/* vietnamese */

@font-face {
  font-family: 'Sangbleukingdom Light';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Sangbleukingdom Light'), local('NotoSerif'), url(https://fonts.gstatic.com/s/notoserif/v8/ga6Iaw1J5X9T9RW6j9bNfFgWaDq8fMVxMw.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */

@font-face {
  font-family: 'Sangbleukingdom Light';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Sangbleukingdom Light'), local('NotoSerif'), url(https://fonts.gstatic.com/s/notoserif/v8/ga6Iaw1J5X9T9RW6j9bNfFkWaDq8fMVxMw.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */

@font-face {
  font-family: 'Sangbleukingdom Light';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Sangbleukingdom Light'), local('NotoSerif'), url(https://fonts.gstatic.com/s/notoserif/v8/ga6Iaw1J5X9T9RW6j9bNfFcWaDq8fMU.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'BrownStd Regular';
  font-style: normal;
  src: url(https://www.bicestervillage.com/assets/fonts/BrownStd-Regular.woff) format('woff');
}

@font-face {
  font-family: 'Sangbleukingdom Light';
  font-style: normal;
  src: url(https://www.bicestervillage.com/assets/fonts/sangbleukingdom-light-webfont.woff) format('woff');
}

@font-face {
  font-family: 'Sangbleukingdom Italic';
  font-style: normal;
  src: url(https://www.bicestervillage.com/assets/fonts/sangbleukingdom-lightitalic-webfont.woff) format('woff');
}

@font-face {
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 400;
  src: local('Noto Sans'), local('NotoSans'), url(https://fonts.gstatic.com/s/notosans/v9/o-0IIpQlx3QUlC5A4PNr5TRASf6M7Q.woff2) format('woff2');
}
/* cyrillic-ext */

@font-face {
  font-family: 'Noto Serif';
  font-style: normal;
  font-weight: 400;
  src: local('Noto Serif'), local('NotoSerif'), url(https://fonts.gstatic.com/s/notoserif/v8/ga6Iaw1J5X9T9RW6j9bNfFoWaDq8fMVxMw.woff2) format('woff2');
}

.disabled {
  pointer-events: none;
  opacity: 0.5;
  background: #CCC;
}

.helpTable {
  width: 100%;
}

.helpTable td,
.helpTable th {
  padding: 5px;
}

th {
  text-align: left;
  background-color: #e4e4e4;
}

.inputText {
  font-style: italic;
  color: #F00;
}

.templateHolder {
  width: inherit;
  overflow: hidden;
  text-overflow: ellipsis;
}

.noCTA{
  color: rgb(69, 82, 85) !important;
  padding: 0px !important;
  border: 0px !important;
  background: none !important;
}
/* lightbox css */

@media all {
  .lightbox {
    display: none;
  }
  .fl-page h1,
  .fl-page h3,
  .fl-page h4 {
    font-family: 'HelveticaNeue-UltraLight', 'Helvetica Neue UltraLight', 'Helvetica Neue', Arial, Helvetica, serif;
    font-weight: 100;
    letter-spacing: 1px;
    text-decoration: underline;
  }
  .fl-page h1 {
    font-size: 110px;
    margin-bottom: 0.5em;
  }
  .fl-page h1 i {
    font-style: normal;
    color: #ddd;
  }
  .fl-page h1 span {
    font-size: 30px;
    color: #333;
  }
  .fl-page h3 {
    text-align: right;
  }
  .fl-page h3 {
    font-size: 15px;
  }
  .fl-page h4 {
    font-size: 2em;
  }
  .fl-page .jumbotron {
    margin-top: 2em;
  }
  .fl-page .doc {
    margin: 2em 0;
  }
  .fl-page .btn-download {
    float: right;
  }
  .fl-page .btn-default {
    vertical-align: bottom;
  }
  .fl-page .btn-lg span {
    font-size: 0.7em;
  }
  .fl-page .footer {
    margin-top: 3em;
    color: #aaa;
    font-size: 0.9em;
  }
  .fl-page .footer a {
    color: #999;
    text-decoration: none;
    margin-right: 0.75em;
  }
  .fl-page .github {
    margin: 2em 0;
  }
  .fl-page .github a {
    vertical-align: top;
  }
  .fl-page .marketing a {
    color: #999;
  }
  /* override default feather style... */
  .fixwidth {
    background: rgba(256, 256, 256, 0.8);
  }
  .fixwidth .featherlight-content {
    width: 650px;
    background: #fff;
    border: 5px solid #4e4e4e;
  }
  .fixwidth .featherlight-close {
    color: #fff;
    background: #333;
  }
  /*
    .featherlight-content h3:after {
      content: '';
      display: block;
      width: 100%;
      height: .25rem;
      background: #777;
    }
*/
  .featherlight-content img {
    border: 1px solid #4e4e4e;
  }
  .featherlight-content h3 {
    background-color: #4e4e4e;
    padding: 10px;
    color: #fff;
    margin: 0px;
    font-size: 18px;
  }
  .featherlight-content h4 {
    text-decoration: underline;
  }
  .featherlight-content {
    color: #000 !important;
  }
  .featherlight .featherlight-content {
    padding: 0px !important;
    border-radius: 5px;
  }
  .help_intro_text {
    margin: 25px;
  }
  .fixwidth .featherlight-close {
    color: #333;
    background: #fff;
  }
}

@media only screen and (max-width: 1024px) .featherlight .featherlight-content {
  padding: 0px !important;
}
/* // lightbox css */

/* navigation */

.sidenav {
  height: auto;
  width: 0;
  position: fixed;
  z-index: 1;
  top: 0px;
  left: 0;
  background-color: #000000;
  overflow-x: hidden;
  transition: 0.5s;
  padding-top: 60px;
  padding-bottom: 5px;
}

.sidenav i{
   color: #F0EDE5;
}

.sidenav h2{
  color: #000000;
  text-align: center;
  background-color: #F0EDE5;
  padding: 10px 0px 10px 0px;
  text-decoration: none;
  margin-bottom: 5px;
  margin-top: 0px;
}

.sidenav a {
  padding: 8px 8px 8px 32px;
  text-decoration: none;
  font-size: 14px;
  color: #ffffff !important;
  display: block;
  transition: 0.3s
}

.sidenav a:nth-child(2)  {
  margin-top: 11px;
}


.sidenav a:hover, .offcanvas a:focus{
  color: #f1f1f1;
}

.sidenav .closebtn {
  position: absolute;
  top: 0;
  right: 25px;
  font-size: 36px;
  margin-left: 50px;
  color: #818181 !important;
  padding-left: 23px;
}

.sidenav [class^="icon-"], [class*=" icon-"] {
  color: #F0EDE5;
}

@media screen and (max-height: 450px) {
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 18px;}
}

.container {
  padding: 0px 25px !important;
}

.sidenav a:hover{
  background-color: #585858;
}

a.closebtn:hover{
   color: #ffffff;
}

.sidenav [class^="icon-"], [class*=" icon-"] {
  color: #F0EDE5;
}


/* // navigation */



/* ECRM_Help_Styling */

.helpnav {
  height: auto;
  width: 0;
  position: fixed;
  z-index: 998;
  top: 100px;
  left: 0;
  overflow-x: hidden;
  transition: 0.5s;
  padding: 53px 0px;
  background-color: #F0EDE5;
  -webkit-box-shadow:inset 0px 0px 0px 1px #c4c6ca; -moz-box-shadow:inset 0px 0px 0px 1px #c4c6ca; box-shadow:inset 0px 0px 0px 1px #c4c6ca;
  padding-bottom: 17px;
  border-left: none;
}

.helpnav .help_links a:before {
  font-family: FontAwesome;
  content: "\f05a";
  color: #337ab7;
}

.helpnav a i{
   color: #000000 !important;
}

.helpnav h2{
  font-size: 20px;
  margin: 0px;
  padding: 0px;
  text-decoration: none;
  padding: 10px 0px 10px 0px;
  border-bottom: 1px dotted #999;
  color: #ffffff !important;
  background-color: #000000;
}

.helpnav h2 i {
  font-size: 20px;
  top: 0px;
  color: #ffffff;
}

.helpnav a {
  padding: 8px 8px 8px 32px;
  text-decoration: none;
  font-size: 18px;
  color: #000;
  display: block;
  transition: 0.3s;
  text-align: left;
}

.helpnav a:hover {
  color: #337ab7;
}

.helpnav .help_links a{
  font-size: 14px;
  padding: 25px 15px 10px 15px;
  text-align: left;
}

.helpnav .help_links i{
  color: #337ab7 !important;
}

.helpnav .closebtn {
  position: absolute;
  top: 0;
  font-size: 36px;
  text-align: center;
  width: 100%;
  padding: 5px 0px 5px 0px;
  margin: 0px;
}

span.help_header i{
  color: #337ab7 !important;
}

@media screen and (max-height: 450px) {
  .helpnav {padding-top: 15px;}
  .helpnav a {font-size: 18px;}
}