/* ########## LIST BOX - CSS (This styles should be there in the implementing page) ########## _START */
#ajax_listOfOptions {
  position: absolute; /* Never change this one */

  width: 520px; /* Width of box */
  height: 250px; /* Height of box */

  overflow: auto; /* Scrolling features */
  border: 1px solid #317082; /* Dark green border */
  background-color: #ffffff; /* White background color */

  text-align: left;
  z-index: 10000;
}

#ajax_listOfOptions div {
  /* General rule for both .optionDiv and .optionDivSelected */
  margin: 1px;
  padding: 1px;
  cursor: pointer;

  border-bottom: 1px solid #e4e4e4;
}

#ajax_listOfOptions .optionDiv {
  /* Div for each item in list */
}

#ajax_listOfOptions .optionDivSelected {
  /* Selected item in the list */
  background-color: #317082;
  color: #ffffff;
}

#ajax_listOfOptions_iframe {
  background-color: #f00000;
  position: absolute;
  z-index: 5;
}
/* ########## LIST BOX - CSS (This styles should be there in the implementing page) ########## _END */

/*##############################################################################*/
html,
body {
  height: 100%;

  font-size: 11px;
  font-family: Verdana, Arial, sans-serif;

  margin-left: 0px;
  margin-top: 0px;
  margin-bottom: 0px;
  margin-right: 0px;
  outline: none;
}

input {
  outline: none;
}

textarea {
  resize: none;
  border: 1px solid #8c8c8c;
}

td#application_header {
  font-family: Verdana, Arial, sans-serif;
  color: #fff;
  font-size: 24px;
  font-weight: normal;

  margin-left: 0px;
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: 0px;
}

div#application_header {
  font-family: Verdana, Arial, sans-serif;
  color: #fff;
  font-size: 24px;
  font-weight: normal;

  margin-left: 0px;
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: 0px;
}

table.careers {
  border-collapse: collapse;
}

table.careers tr.head_one {
  background-color: #881b4c;
  color: #ffffff;
  height: 30px;
}

table.careers tr.head_one td {
  padding: 4px;
}

table.careers tr.head_two {
  background-color: #eeeeee;
}

table.careers tr.head_two td {
  padding: 4px;
}

table.careers tr.head_three {
  background-color: #cccccc;
  height: 20px;
  line-height: 20px;
}

table.careers tr.chat td {
  padding: 4px;
  border-bottom: 1px solid #d5f1ff;
  background-color: #ecf9ff;
}

table.careers tr.chat1 {
  padding: 1px;
  border-bottom: 1px solid #d5f1ff;
  background-color: #ecf9ff;
}

table.careers tr.chat1:hover {
  cursor: pointer;
  background-color: #cce6ff;
}

table.careers tr.chat2 {
  padding: 1px;
  border-bottom: 1px solid #d5f1ff;
  background-color: #ecf9ff;
}

table.careers tr.data {
  border-bottom: 1px solid #eeeeee;
  background-color: #eeeeee;
}

table.careers tr.data_one {
  border-bottom: 1px solid #eeeeee;
}

table.careers tr.data_one:hover {
  background-color: #daf8fe;
  cursor: pointer;
}

table.careers tr.data_two {
  border-bottom: 1px solid #eeeeee;
}

table.careers tr.data_two:hover {
  background-color: #daf8fe;
}

table.whitetable {
  border-collapse: collapse;
  empty-cells: show;
}

table.whitetable tr.whiterow {
  background-color: #ffffff;
}

table.whitetable td {
  border: 1px solid #f0f0f0;

  border-spacing: 0px;
  border-collapse: separate;

  background-color: inherit;
}

/* ################################# Pagination #################################### */
table.pagination {
  background-color: #eeeeee;
  table-layout: fixed;
  border-collapse: collapse;
}

table.pagination tr.row_one {
  background-color: #eeeeee;
}

table.pagination td {
  border: 1px;
}

table.pagination td.cell_one {
  border: 1px solid black;
}

table.pagination td.cell_two {
  border: 1px;
}

table.pagination td.cell_one:hover {
  background-color: #cccccc;
  cursor: pointer;
  color: #ffffff;
}

table.pagination td.cell_two:hover {
  background-color: #cccccc;
  cursor: pointer;
  color: #ffffff;
}

a {
  text-decoration: none;
}

/* ##################################################################################### */

.style_button {
  -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 0 0;
  -moz-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 0 0;
  box-shadow: rgba(0, 0, 0, 0.2) 0 1px 0 0;

  color: #ffffff;
  background-color: #881b4c;

  border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;

  border: none;
  font-family: Verdana, Arial, sans-serif;
  font-size: 12px;
  font-weight: 500;
  height: 25px;
  padding: 3px 8px;
  text-shadow: #fe6 0 1px 0;

  cursor: pointer;
}

.style_button1 {
  -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 0 1px;
  -moz-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 0 1px;
  box-shadow: rgba(0, 0, 0, 0.2) 0 1px 0 1px;

  color: #881b4c;
  background-color: #ffffff;

  border-radius: 25px;
  -moz-border-radius: 25px;
  -webkit-border-radius: 25px;

  border: none;
  font-family: Verdana, Arial, sans-serif;
  font-size: 12px;
  font-weight: 500;
  height: 25px;
  padding: 3px 8px;
  text-shadow: #fe6 0 1px 0;

  cursor: pointer;
}

.style_button2 {
  color: #ffffff;
  background-color: #881b4c;
  border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  font-family: Roboto;
  font-size: 1.25rem;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.07;
  letter-spacing: 0.56px;
  text-align: center;
  border: none;
  /* width: 12rem; */
  height: 3rem;
  padding: 0.438rem 0.625rem 0.5rem;
  cursor: pointer;
}

/* ##################################################################################### */

div#transparent {
  background-color: #cccccc;
  opacity: 0.2;
}

/* ##################################################################################### */

.notice {
  color: #69a2a3;
  font-weight: normal;
}

.msgError {
  color: #e30000;
  font-weight: bold;
}

.msgOK {
  color: #00b900;
  font-weight: bold;
}

.head_one {
  background-color: #881b4c;
  color: #ffffff;

  height: 30px;
  line-height: 30px;

  padding: 4px 0;
  vertical-align: middle;

  padding-left: 5px;
  padding-right: 0px;
}

.head_two {
  background-color: #eeeeee;
  padding: 4px 0;
}

.heightStrip {
  height: 22px;
  line-height: 22px;
}

.subHeading {
  padding: 6px 0;
}

.data_padding {
  padding: 4px 0;
}

.normal_text {
  font-size: 12px;
}

/* ############################# RESPONSIVE DESIGN - CANDIDATE PAGE #############################*/

/*  SECTIONS  */
.section {
  clear: both;
  padding: 0px;
  margin: 0px;

  /*border: 1px solid orange;*/
  /*background-color: red;*/
}

.sectionPadded {
  padding: 0px 0px 0px 5px; /* only left padding */
}

/*  COLUMN SETUP  */
.col {
  display: block;
  float: left;
  margin: 0px 0px 0px 0px;

  /*background-color: blue;*/
}

.col:first-child {
  margin-left: 0;
}

/*  GROUPING  */
.group:before,
.group:after {
  content: "";
  display: table;
}
.group:after {
  clear: both;
}

.group {
  zoom: 1; /* For IE 6/7 */
}

/*  grid configuration  */
.span_8_of_8 {
  width: 11.5%;
}

.span_7_of_7 {
  width: 14%;
}

.span_6_of_6 {
  width: 16%;
}

.span_5_of_5 {
  width: 20%;
}

.span_4_of_4 {
  width: 24%;
}

.span_3_of_3 {
  width: 32%;
}
.span_2_of_2 {
  width: 48%;
}
.span_1_of_1 {
  width: 98.7%;
  /*border: 1px solid yellow;*/
}

.span_1_of_1_width_left_padding {
  width: 99.6%;
  padding: 0px 0px 0px 5px;
}

.span_90 {
  width: 90%;
}

.span_spacer {
  width: 1%;
}

.span_1_of_8 {
  width: 11.5%;
}

.span_7_of_8 {
  width: 84%;
}

.span_header_left {
  width: 13%;
  background-color: #881b4c !important;
  height: 73px;
  background-image: url("images/Background – 1.svg") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
}
.span_header_middle {
  width: 1px;
}
.span_header_right {
  width: 86.9%;
  height: 73px;
  line-height: 73px;
  background-color: #3c454b !important;

  display: block;
    background-image: url("images/Background.svg") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    /* width: 320px !important;
    height: 75px !important; */
}

@media only screen and (min-width: 0px) and (max-width: 320px) {
  .col {
    margin: 0% 0 0% 0%;
  }

  .span_1_of_1,
  .span_2_of_2,
  .span_3_of_3,
  .span_4_of_4,
  .span_5_of_5,
  .span_6_of_6,
  .span_7_of_7,
  .span_8_of_8 {
    width: 100%;
  }

  .span_1_of_1_width_left_padding {
    width: 97.5%;
  }

  .span_1_of_8,
  .span_7_of_8 {
    width: 99%;
  }

  .span_spacer {
    width: 0;
  }
  .spacer_image_row {
    width: 100%;
  }

  span[id="switcher"] {
    display: block;
    background-image: url("images/lisec_logo_w.png") !important;
    background-repeat: no-repeat !important;
    /* background-position: center !important; */
    width: 320px !important;
    height: 75px !important;
  }
  img[id="lisec_logo_img"] {
    display: none !important;
  }

  .span_header_left {
    width: 100%;
  }
  .span_header_middle {
    width: 1px;
  }
  .span_header_right {
    height: 0;
    width: 0;
    display: none;
  }

  #adv_img {
    width: 100%;
  }
  #table-like {
    width: 99%;
  }
  #reg_table {
    width: 99%;
    padding-left: 5px;
    padding-right: 0px;
  }

  .title {
    font-weight: bold;
  }
}

@media only screen and (min-width: 321px) and (max-width: 520px) {
  .col {
    margin: 0% 0 0% 0%;
  }

  .span_1_of_1,
  .span_2_of_2,
  .span_3_of_3,
  .span_4_of_4,
  .span_5_of_5,
  .span_6_of_6,
  .span_7_of_7,
  .span_8_of_8 {
    width: 100%;
  }

  .span_1_of_1_width_left_padding {
    width: 97.5%;
  }

  .span_1_of_8,
  .span_7_of_8 {
    width: 99%;
  }

  .span_spacer {
    width: 0;
  }
  .spacer_image_row {
    width: 100%;
  }

  span[id="switcher"] {
    display: block;
    background-image: url("images/lisec_logo_w.png") !important;
    background-repeat: no-repeat !important;
    /* background-position: center !important; */
    width: 361px !important;
    height: 75px !important;
  }
  img[id="lisec_logo_img"] {
    display: none !important;
  }

  .span_header_left {
    width: 100%;
  }
  .span_header_middle {
    width: 1px;
  }
  .span_header_right {
    height: 0;
    width: 0;
    display: none;
  }

  #adv_img {
    width: 99.6%;
  }
  #table-like {
    width: 85%;
  }
  #reg_table {
    width: 99%;
    padding-left: 5px;
    padding-right: 0px;
  }

  .title {
    font-weight: bold;
  }
}

@media only screen and (min-width: 521px) and (max-width: 1000px) {
  #table-like {
    width: 60%;
  }
  #reg_table {
    width: 75%;
    padding-left: 5px;
    padding-right: 0px;
  }
  .span_1_of_1_width_left_padding {
    width: 99%;
  }

  span[id="switcher"] {
    display: block;
    background-image: url("images/lisec_logo_100.png") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    width: 100px !important;
    height: 75px !important;
  }
  img[id="lisec_logo_img"] {
    display: none !important;
  }

  .span_header_left {
    width: 20%;
  }

  .span_header_right {
	width: 80% !important;
}
}

@media only screen and (min-width: 1001px) and (max-width: 1439px) {
  #table-like {
    width: 30%;
  }
  #reg_table {
    width: 75%;
    padding-left: 5px;
    padding-right: 0px;
  }
  .span_1_of_1_width_left_padding {
    width: 100%;
  }

  span[id="switcher"] {
    display: block;
    background-image: url("images/lisec_logo_100.png") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    width: 145px !important;
    height: 70px !important;
  }
  img[id="lisec_logo_img"] {
    display: none !important;
  }
}

@media only screen and (min-width: 1440px) and (max-width: 2559px) {
  #table-like {
    width: 30%;
  }
  #reg_table {
    width: 75%;
    padding-left: 5px;
    padding-right: 0px;
  }
  .span_1_of_1_width_left_padding {
    width: 100%;
  }

  span[id="switcher"] {
    display: block;
    background-image: url("images/lisec_logo_w.png") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    width: 220px !important;
    height: 70px !important;
  }
  img[id="lisec_logo_img"] {
    display: none !important;
  }
}

@media only screen and (min-width: 2560px) {
  #table-like {
    width: 30%;
  }
  #reg_table {
    width: 75%;
    padding-left: 5px;
    padding-right: 0px;
  }
  .span_1_of_1_width_left_padding {
    width: 100%;
  }

  span[id="switcher"] {
    display: block;
    background-image: url("images/lisec_logo_w.png") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    width: 360px !important;
    height: 70px !important;
  }
  img[id="lisec_logo_img"] {
    display: none !important;
  }
}
/* ############################# RESPONSIVE DESIGN - CANDIDATE PAGE #############################*/