/* 
Generic Styling, for Desktops/Laptops 
*/
html,body,div {
	font-weight: normal! important;
}
.none {
	display: none! important;
}
.show {
	display: block;
}
/* dataTables */
.dataTables_filter input {
	margin-bottom: 15px;
	height: 30px !important;
	padding: 5px;
	border: 1px solid #cccccc;
}
/* modal */
button.close {
	background: #fff! important;
	color: #666666;
	opacity: 0.8;
	margin-top: 5px;
	padding: 5px 10px;
	border-radius: 100%;
}
table {
  width: 100%;
  border-collapse: collapse;
}
.table tbody h4 {
	padding: 0;
	margin: 0;
	font-size: 15px;
}
/* Zebra striping */
tr:nth-of-type(odd) {
  background: #eee;
}
th {
  background: #607d8b;
  color: white;
  font-weight: bold;
  padding: 6px;
  border: 1px solid #546e7a;
  text-align: center;
  vertical-align: middle !important;
}
.vertical_table th {
  background: transparent;
  color: #202020;
  font-weight: bold;
  padding: 6px;
  border: 1px solid #ddd;
  text-align: left;
  vertical-align: middle;
}
.vertical_table td {
  background: transparent;
  padding: 6px;
  border: 1px solid #ddd;
  text-align: left;
  vertical-align: middle;
}
.vertical_table tr:nth-of-type(odd) {
  background: #f0f0f0;
}
.info th {
	background: #ff5252! important;
	border: 1px solid #546e7a;
}
td {
  padding: 6px! important;
  border: 1px solid #eee;
  text-align: center;
  vertical-align: middle;
  font-weight: normal;
}
table img {
  display: block;
  margin: 0 auto;
  text-align: center;
}
table button.btn,table a.btn,  {
  margin: 5px;
}

.bnr_preview #dft-img {
	width: 100%;
	height: auto;
}
label {
	font-weight: normal;
	font-size: 15px;
}
input, select, textarea {
  border-radius: 2px;
  border: 1px solid #ddd;
}
.checkbox1 {
  border-radius: 2px;
  border: 1px solid #ddd;
}
.form-group input, .form-group select, .form-group textarea {
  border-radius: 2px;
}
.form-group input:hover, .form-group select:hover, .form-group textarea:hover {
  box-shadow: 0 0 2px rgba(0,0,255,0.4)
}
.form-group input[type=file] {
  height: inherit;
}
.height10 {
  min-height: 10px;
}
.height5 {
  min-height: 5px;
}
.height20 {
  min-height: 20px;
}
/* 
Max width before this PARTICULAR table gets nasty
This query will take effect for any screen smaller than 760px
and also iPads specifically.
*/
@media only screen and (max-width: 620px) {
  .content-header {
	padding: 15px 5px;
  }
  .content {
	padding-left: 5px;
    padding-right: 5px;
  }

  /* Force table to not be like tables anymore */

  table,
  thead,
  tbody,
  th,
  td,
  tr {
    display: block;
  }
  table img {
    max-width: 100%! important;
  }
  /* Hide table headers (but not display: none;, for accessibility) */
  thead tr {
    position: absolute;
    top: -9999px;
    left: -9999px;
  }
  tfoot tr {
    position: absolute;
    top: -9999px;
    left: -9999px;
  }
  tr {
    border: 1px solid #eee;
  }
  td {
    /* Behave  like a "row" */
    border: none;
    border-bottom: 1px solid #eee;
    position: relative;
    padding: 10px 0;
  }
  td:before {
    /* Now like a table header */
    position: relative;
    /* Top/left values mimic padding */
    background: #34495E;
    color: #eee;
    top: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    text-align: center;
    width: 100%;
    padding: 10px;
    display: block;
    white-space: nowrap;
  }
  /*
    Label the data
    */
  /* .banner_table td:nth-of-type(1):before {
    content: "ID";
  }
  .banner_table td:nth-of-type(2):before {
    content: "Title";
  }
  .banner_table td:nth-of-type(3):before {
    content: "Image";
  }
  .banner_table td:nth-of-type(4):before {
    content: "Postion";
  }
  .banner_table td:nth-of-type(5):before {
    content: "Satus";
  }
  .banner_table td:nth-of-type(6):before {
    content: "Action";
  } */
}

@media print
{    
    .no-print, .no-print *
    {
        display: none !important;
    }
}