/* This file contains the mobile css for the template */

/* Variables */
@primaryColor: #000; /* was temporarily 8F2544 for screen shots */
@backgroundColor: #f3f2ef;
@defaultTextColor: #231F20;
@defaultFont: 'Futura', 'Trebuchet MS', 'Arial', sans-serif !important;

@subMenuSelect: ~'.corner_20';
@subMenuSelectNew: ~'.corner_ContextualMenu';
@mainMenuSelector: ~'#main-menu';


/* TAB STYLINGS */
.uni-tabs_ ul.ui-tabs-nav li.ui-corner-top.ui-state-default {
	background: #ccc !important;
}

ul.ui-tabs-nav.ui-helper-reset.ui-helper-clearfix.ui-widget-header.ui-corner-all {
	padding: 0px !important;
	margin-bottom: 15px !important;
}

.uni-tabs_3 li.ui-state-default a,
.uni-tabs_TabStyling1 li.ui-state-default a {
	width: 100% !important;
	color: #fff !important;
    background-color: @primaryColor !important;
    border-color: darken(@primaryColor, 10%) !important;
    border-radius: 0px;
    font-family: 'Futura', 'Trebuchet MS', 'Arial', sans-serif !important;
    text-decoration: none !important;
    display: inline-block;
    padding: 6px 12px;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: 1px solid transparent;
}
.ui-state-default a span,
.uni-tabs_3 ul.ui-tabs-nav li.ui-corner-top.ui-state-default a span,
.uni-tabs_3 ul.ui-tabs-nav li.ui-corner-top a span,
.uni-tabs_3 ul.ui-tabs-nav li.ui-corner-top.ui-tabs-selected a span,
.uni-tabs_3 ul.ui-tabs-nav li.ui-corner-top.ui-state-hover a span,
.uni-tabs_3 ul.ui-tabs-nav li.ui-corner-top.ui-tabs-selected.ui-state-hover a span,

.ui-state-default a span,
.uni-tabs_TabStyling1 ul.ui-tabs-nav li.ui-corner-top.ui-state-default a span,
.uni-tabs_TabStyling1 ul.ui-tabs-nav li.ui-corner-top a span,
.uni-tabs_TabStyling1 ul.ui-tabs-nav li.ui-corner-top.ui-tabs-selected a span,
.uni-tabs_TabStyling1 ul.ui-tabs-nav li.ui-corner-top.ui-state-hover a span,
.uni-tabs_TabStyling1 ul.ui-tabs-nav li.ui-corner-top.ui-tabs-selected.ui-state-hover a span {
	color: #ffffff !important;
}
    
.uni-tabs_3 ul.ui-tabs-nav li.ui-corner-top.ui-tabs-selected a,
.uni-tabs_3 ul.ui-tabs-nav li.ui-corner-top.ui-state-hover a,
.uni-tabs_3 ul.ui-tabs-nav li.ui-corner-top.ui-tabs-selected.ui-state-hover a,

.uni-tabs_TabStyling1 ul.ui-tabs-nav li.ui-corner-top.ui-tabs-selected a,
.uni-tabs_TabStyling1 ul.ui-tabs-nav li.ui-corner-top.ui-state-hover a,
.uni-tabs_TabStyling1 ul.ui-tabs-nav li.ui-corner-top.ui-tabs-selected.ui-state-hover a {
	background-color: lighten(@primaryColor, 10%) !important;
    border-color: lighten(@primaryColor, 20%) !important;
}

.uni-tabs_3,
.uni-tabs_TabStyling1 {
	visibility: visible;
    background: transparent;
    padding: 0px;
    margin: 0px;
}

.uni-tabs_3 .ui-tabs-panel,
.uni-tabs_TabStyling1 .ui-tabs-panel {
	padding: 0px !important;
}
.uni-tabs_3 .ui-state-default,
.uni-tabs_TabStyling1 .ui-state-default {
	margin-right: 15px !important;
}

.ui-state-default a span {
    color: #000 !important;
}

/* TYPOGRAPHY */
td h1, td h2, div h2, h2 div, h2 div a {
    color: @defaultTextColor;
}
h1 {
    font-size: 30px !important;
    margin-top: 0px;
    margin-bottom: 2px;
    padding: 0px;
    line-height: 25px;
    text-transform: none;
    font-weight: 700;
}
#pageTitle h1 {
    font-weight: bold;
    width: 300px;
    margin: 10px auto 0px auto;
    text-align: center;
    font-size: 16px !important;
    color: #fff;
    text-transform: none;
}
h2 {
    font-size: 20px;
    font-weight: 700;
    border-bottom: 1px dashed #aaa;
}
h2 div {
    font-size: 20px;
    font-weight: 700;    
}
h3 {
    font-size: 15px !important;
    font-weight: bold;
    margin: 0px;
    padding: 0px;
    color: #545454;
}
h4 {
    font-weight: bold;
}
h5 {
    font-size: 18px;
}
div, table tr td, table tr th, a, h1, h2, h3, h4 {
    font-family: @defaultFont;
    color: @defaultTextColor;
}

/* Template Settings */
#content-area {
    padding-top: 60px;
    padding-bottom: 50px;
}
body {
    background: @backgroundColor;
}
#bootModeChanger {
    display: none;
}
#header-container > button:nth-child(5) {
  right: 65px;
}
br.clear {
    display: none !important;
}
.table {
    margin-bottom: 0px !important;
}
.blockBody {
    padding: 0px;
    margin: 0px;
}
td, td.label {
    font-size: 12px;
}

/* HEADER BAR */
#headerBar {
    background-color: @primaryColor;
    -webkit-box-shadow: 0px 0px 10px #ccc;
    -moz-box-shadow: 0px 0px 10px #ccc;
    box-shadow: 0px 0px 10px #ccc;
    position: fixed;
    width: 100%;
    z-index: 9;
}
#logo-container {
    float: left;
    margin-top: 5px;
    margin-bottom: 5px;
}
#header-container > button {
    float: right;
    color: #fff;
    margin-top: -30px;
}
#pageTitle {
    height: 31px;
}

/* FORMS & BUTTONS */
.form-control, select.form-control, #e_prop\5b 347\5d {
  display: block;
  font-size: 16px !important;
  width: 100%;
  height: 34px;
  padding: 6px 12px;
  line-height: 1.42857143;
  color: #555555;
  background-color: #ffffff;
  background-image: none;
  border: 1px solid #cccccc;
  border-radius: 0px !important;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
  -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
  transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
  -webkit-appearance: none;
}
.input-group-addon {
    border-radius: 0px;
}
input[type="color"],
input[type="date"],
input[type="datetime"],
input[type="datetime-local"],
input[type="email"],
input[type="month"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="text"],
input[type="time"],
input[type="url"],
input[type="week"],
select:focus,
textarea {
  font-size: 16px !important;
}

.btn {
    border-radius: 0px;
    font-family: @defaultFont;
}
.btn-primary {
    color: #fff !important;
    background-color: @primaryColor !important;
    border-color: darken(@primaryColor, 10%) !important;
}
.btn-primary:hover {
	background-color: lighten(@primaryColor, 10%) !important;
    border-color: lighten(@primaryColor, 10%) !important;
}

/* NAVIGATION */
.navbar-toggle {
    font-size: 24px;
    background: transparent;
    padding: 0px;
    margin: 10px 0px 0px 10px;
    border: none;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
    margin: 0px;
    float: none;
}
.navbar-toggle .icon-bar {
    height: 3px;
    background: #fff;
}

ul#floatingNavContainer a, ul#topNavContainer a, ul#sideNavContainer a {
    color: #fff;
    padding: 2px 4px 0px 4px;
    font-size: 12px;
}
/* SEARCH */
#searchBtnHeader {
	color: #fff;
    float: right;
    margin-top: -28px;
    font-size: 19px;
    right: 35px;
    position: relative;
}
#searchBoxDiv {
    top: 44px;
    position: fixed;
    background: #fff;
    height: 36px;
    display: none;
    z-index: 10000000;
    width: 100%;
}
#searchBoxDiv > form > div > input {
	border: 0px;
}

/* NAVIGATION */
@{subMenuSelect}.navbar-collapse, @{subMenuSelectNew}.navbar-collapse, @{mainMenuSelector} {
	position: fixed;
    right: 0px;
    top: 0px;
    background-color: #fff;
    z-index: 100000000;
    bottom: 0px;
    margin-top: 44px;
    width: 100%;
    margin-left: 0px;
    margin-right: 0px;
}
@{subMenuSelect} .btn, @{subMenuSelectNew} .btn {
    background-color: transparent !important;
    color: #000 !important;
    text-align: left;
    border: 0px !important;
    border-bottom: 1px solid #ccc !important;
    padding-left: 0px;
    margin-bottom: 0px !important;
    padding-top: 10px;
    padding-bottom: 10px;
    width: 100% !important;
}
@{subMenuSelect} .btn:hover, @{subMenuSelectNew} .btn:hover {
    background-color: transparent !important;
}
@{subMenuSelect} .btn i, @{subMenuSelectNew} .btn i {
    font-size: 14px !important;
}

/* TOP BAR BTNS */


/* PROFILE BADGES */
.profileBadge {
    border: 1px solid #efefef;
    margin: 0 auto !important;
}
.profileName {
    color: #6f6f6f;
    font-weight: bold;
    text-align: center;
    margin-top: 8px;
}

/* ADMIN UNIBAR FIXES */
.adminSearch {
	top: 80px !important;
}
.adminContext {
  top: 80px !important;
}
.adminMenu {
    top: 35px !important;
}

/* BG WATERMARK */
.background {
    width: 180px;
    height: 80px;
    background: transparent url(https://source.safs.co.za/intranet/user_data/images/safs-watermark.png) no-repeat 0 0;
    position: fixed;
    bottom: 10px;
    right: 10px;
    background-size: contain;
    z-index: -9;
}
#footer {
    height: 30px;
    background-color: #191919;
    position: fixed;
    bottom: 0px;
    left: 0px;
    width: 100%;
    padding: 5px;
}

/* BLOCKSTYLE */
.corner_ClaimChecklist {
    background: #fff;
    border: 1px solid #ddd;
    margin-bottom: 15px;
}
.corner_ClaimChecklist > div > .row > div > div > div > .row {
	margin: 0px;
}
.corner_style_ClaimChecklist > div.row:nth-child(1) > div > div > div > .row:nth-child(1) {
    margin: 0px;
    background: #efefef;
}
.corner_style_ClaimChecklist > div.row:nth-child(1) > div > div > div > .row:nth-child(1) h2 div {
	border: 0px;
    padding-bottom: 10px;
}
.corner_style_ClaimChecklist > div.row:nth-child(1) > div > div > div > .row:nth-child(2) {
	padding-top: 15px;
}