/* ====================================================
 * Company: Unity Technologies
 * Contributors:
   - Rickard Andersson, rickard@unity3d.com
======================================================= */

/****************************************
  ==== UNITY LOGO SVG
****************************************/

.unity-logo--light { fill: #FFFFFF; }
.unity-logo--dark { fill: #002835; }

/****************************************
  ==== TABS
****************************************/

ul.tabs {
  margin: 0;
}
ul.tabs:after {
  visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0;
}
ul.tabs li {
  height: 60px; float: left; padding: 0; margin: 0 5px 0 0; font-size: 0.9375em;
}
ul.tabs li:before {
  display: none;
}
ul.tabs li a {
  height: 60px; line-height: 60px; display: block; float: left; padding: 0 25px; background: #ececec; text-decoration: none; color: #5a5a5b; -webkit-border-radius: 3px 3px 0 0; -moz-border-radius: 3px 3px 0 0; border-radius: 3px 3px 0 0;
}
ul.tabs li a:hover {
  color: #222c37; background: #f5f8f9;
}
ul.tabs li.selected a, ul.tabs li a.selected {
  height: 60px; line-height: 54px; color: #222c37; border-top: #2196f3 3px solid; background: #f5f8f9;
}
ul.tabs li.more a {
  height: 60px; line-height: 60px; display: block; float: left; padding: 0 25px; background: #ececec; text-decoration: none; color: #5a5a5b; -webkit-border-radius: 3px 3px 0 0; -moz-border-radius: 3px 3px 0 0; border-radius: 3px 3px 0 0;
}
div.tab-content {
  padding: 30px; background: #f5f8f9;
}
.dashboard ul.tabs li a {
  background: #e5edee;
}
.dashboard ul.tabs li a:hover, .dashboard ul.tabs li.selected a, .dashboard ul.tabs li a.selected {
  background: #fff;
}
.dashboard div.tab-content {
  background: #fff;
}

/****************************************
  ==== SUB TABS
****************************************/

ul.subtabs {
  margin: 0; border-bottom: #f5f8f9 2px solid;
}
ul.subtabs:after {
  visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0;
}
ul.subtabs li {
  height: 50px; float: left; padding: 0; margin: 0 30px 0 0; font-size: 1.125em;
}
ul.subtabs li:before {
  display: none;
}
ul.subtabs li a {
  height: 50px; line-height: 50px; display: block; float: left; padding: 0 5px; text-decoration: none; color: #5a5a5b; position: relative;
}
ul.subtabs li a:hover {
  color: #2196f3;
}
ul.subtabs li.selected a, ul.subtabs li a.selected {
  color: #2196f3;
}
ul.subtabs li.selected a:after, ul.subtabs li a.selected:after {
  content: ''; width: 100%; height: 2px; background: #2196f3; position: absolute; bottom: -2px; left: 0;
}
div.subtab-content {
  padding: 0; background: #fff;
}
ul.subtabs.center li {
  float: none; display: inline-block; margin: 0 15px; vertical-align: top;
}
ul.subtabs.center li.selected a:after, ul.subtabs.center li a.selected:after {
  bottom: -2px;
}



/****************************************
  ==== CUSTOM SELECT BOX
****************************************/

div.select-box {
  position: relative;
}
div.select-box select:focus + div.trigger, div.select-box select:focus + div.trigger.open, div.select-box div.trigger.open {
  border-color: #2196f3;
}
div.select-box div.trigger {
  width: 100%; line-height: 20px; padding: 12px 45px 12px 13px; float: left; position: relative; color: #222c37; font-size: 1em; text-align: left; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; background: #e9ebec; border: 1px solid #e9ebec; cursor: pointer; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;
}
div.select-box div.trigger:hover {
  border-color: #9e9e9e;
}
div.select-box div.trigger:before {
  content: ""; width: 36px; height: 46px; line-height: 46px; display: block; position: absolute; top: 0; right: 0; z-index: 9; font-family: 'entypo-plus'; content: "\e92c"; font-size: 120%; -webkit-transform: rotateX(180deg); -moz-transform: rotateX(180deg); transform: rotateX(180deg);
}
div.select-box div.trigger.open:before {
  -webkit-transform: rotateX(0deg); -moz-transform: rotateX(0deg); transform: rotateX(0deg);
}
div.select-box ul.options {
  width: 100%; max-height: 300px; list-style: none; overflow: auto; visibility: hidden; opacity: 0; background: #fff; text-align: left; position: absolute; top: 56px; left: 0; z-index: 1003; -webkit-box-shadow: 0 0 10px rgba(34,44,55,0.25); -moz-box-shadow: 0 0 10px rgba(34,44,55,0.25); box-shadow: 0 0 10px rgba(34,44,55,0.25);
}
div.select-box ul.options.open {
  visibility: visible; opacity: 1;
}
div.select-box ul.options li {
  cursor: pointer; padding: 0;
}
div.select-box ul.options li a {
  display: block; padding: 15px 20px; font-size: 1em;
}
div.select-box ul.options li:before {
  display: none;
}
div.select-box ul.options li:hover {
  background: #e0f7fa;
}
div.select-box ul.options li.selected, div.select-box ul.options li.selected a, div.select-box ul.options li.selected a:hover, div.select-box ul.options li.selected a:active, div.select-box ul.options li.selected a:focus {
  background: #2196f3; color: #fff;
}
div.select-box ul.options li a, div.select-box ul.options li a:hover, div.select-box ul.options li a:active, div.select-box ul.options li a:focus {
  display: block; color: #5a5a5b; text-decoration: none;
}
div.select-box.small div.trigger {
  padding: 4px 10px; font-size: 0.875em;
}
div.select-box.small div.trigger:before {
  width: 9px; height: 6px; top: 11px; right: 12px; background-position: -265px -77px;
}
div.select-box.small ul.options {
  top: 37px;
}
div.select-box.small ul.options li a {
  padding: 5px 10px; font-size: 0.875em;
}

div.select-box.text div.trigger {
  width: auto; line-height: 20px; padding: 20px 40px 12px 30px; float: left; color: #222c37; font-size: 1.0625em; font-weight: 400; background: #f5f8f9; border: 0;
}
div.select-box.text div.trigger:before {
  content: ""; width: 9px; height: 6px; top: 26px; right: 15px; background-position: -265px -77px;
}
div.select-box.text ul.options li {
  width: 100%; height: auto; margin: 0;
}
div.select-box.text ul.options li a {
  width: 100%; height: auto; line-height: 20px; padding: 15px 20px; background: #fff; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0;
}
div.select-box.text ul.options li a:hover {
  background: #e0f7fa;
}
div.select-box.text ul.options li a.selected, div.select-box.text ul.options li a.selected:hover, div.select-box.text ul.options li a.selected:active, div.select-box.text ul.options li a.selected:focus {
  background: #2196f3; color: #fff; border: 0; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0;
}
div.select-box.text ul.options li a span {
  display: none;
}

/****************************************
  ==== TOOLTIP
****************************************/

.tooltip {
  position: relative;
}
.tooltip div.tip {
  height: 24px; line-height: 24px; position: absolute; left: -100000px; z-index: 9999; background: #222c37; color: #fff; border: 0; font-size: 0.75em; font-weight: 300; padding: 0 7px; white-space: nowrap; text-align: center;
}
.tooltip div.bottom:after {
  content: ""; display: block; position: absolute; top: -8px; left: 50%; font-size: 0px; line-height: 0%; width: 0px; margin: 0 0 0 -3px; border: transparent 4px solid; border-bottom-color: #222c37;
}
.tooltip div.top:after {
  content: ""; display: block; position: absolute; bottom: -8px; left: 50%; font-size: 0px; line-height: 0%; width: 0px; margin: 0 0 0 -4px; border: transparent 4px solid; border-top-color: #222c37;
}
.tooltip div.tip-visible {
  left: 50%; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); transform: translateX(-50%);
}

/****************************************
  ==== TABLES
****************************************/

table {
  margin: 0 0 20px 0;
}
table td {
  padding: 0 20px 0 0; vertical-align: top;
}
table.data {
  width: 100%; margin: 0 0 20px 0;
}
table.data thead tr {
  border-bottom: #f5f8f9 2px solid;
}
.bg-lg table.data thead tr {
  border-color: #ececec;
}
table.data thead tr th {
  font-size: 0.875em; font-weight: 400; padding: 0 15px 5px 15px; vertical-align: top;
}
table.data tbody tr {
  border-bottom: #f5f8f9 1px solid; -webkit-transition: all .1s; -moz-transition: all .1s; transition: all .1s;
}
.bg-lg table.data tbody tr {
  border-color: #ececec;
}
table.data tbody tr:hover {
  background: #f5f8f9;
}
table.data tbody td {
  padding: 15px 15px 15px 15px; font-size: 0.9375em;
}
table.data tbody td:first-child {
  font-weight: 400;
}
table.data tbody td .ico {
  color: #9e9e9e;
}
table.data tbody tr:hover td .ico {
  color: #2196f3;
}

table.list {
  width: 100%; margin: 0 0 20px 0;
}
table.list thead tr {
  border-bottom: #f5f8f9 1px solid;
}
table.list thead tr th.lbl {
  font-size: 1.25em; font-weight: 700; padding: 10px 0 10px 0; vertical-align: top;
}
table.list tbody tr {
  border-bottom: #f5f8f9 1px solid; -webkit-transition: all .1s; -moz-transition: all .1s; transition: all .1s;
}
table.list tbody td {
  padding: 15px 15px 15px 0; font-size: 0.9375em;
}
table.list tbody td:first-child {
  font-weight: 400;
}
table.list tbody td .ico {
  color: #9e9e9e;
}
table.list tbody tr:hover td .ico {
  color: #2196f3;
}

/****************************************
  ==== FILTERS
****************************************/

div.table-filter {
  margin: 0 0 30px 0;
}
div.date-range p {
  width: 10%; line-height: 46px; float: left; margin: 0; text-align: center;
}
div.date-range div.field {
  width: 45%; float: left; position: relative;
}
div.date-range input.datepicker {
  padding-left: 40px;
}
div.date-range a.datepickershow {
  display: block; position: absolute; top: 13px; left: 13px; text-decoration: none; color: #009688;
}

/****************************************
  ==== BREADCRUMBS
****************************************/

div.breadcrumbs ul {
  list-style: none; padding: 0;
}
div.breadcrumbs ul li {
  float: left; padding: 0; margin: 0 3px 0 0; font-size: 1em;
}
div.breadcrumbs ul li:before {
  display: none;
}
div.breadcrumbs ul li:last-child {
  margin: 0;
}
div.breadcrumbs ul li a {
  display: block; float: left; color: #7e8286;
}

/****************************************
  ==== ALERTS
****************************************/

div.alert-overlay {
  width: 100%; position: fixed; top: 0; bottom: 0; left: 0; z-index: 98; background: rgba(34,44,55,0.6); cursor: pointer; display: none;
}
div.alert-overlay.stay {
  cursor: auto;
}
div.alert {
  width: 400px; padding: 30px; background: #fff; position: fixed; top: 50%; left: 50%; z-index: 99; text-align: center; display: none; -webkit-box-shadow: 0 1px 20px rgba(34,44,55,0.3); -moz-box-shadow: 0 1px 20px rgba(34,44,55,0.3); box-shadow: 0 1px 20px rgba(34,44,55,0.3); -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); transform: translate(-50%,-50%);
}
div.alert .loading {
  width: 0; height: 3px; position: absolute; top: 0; left: 0; z-index: 10; background: rgb(205,220,57); background: -moz-linear-gradient(left,  rgba(205,220,57,1) 0%, rgba(0,188,212,1) 100%); background: -webkit-linear-gradient(left,  rgba(205,220,57,1) 0%,rgba(0,188,212,1) 100%); background: linear-gradient(to right,  rgba(205,220,57,1) 0%,rgba(0,188,212,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cddc39', endColorstr='#2196f3',GradientType=1 );
  -webkit-animation: pong cubic-bezier(0.77, 0, 0.175, 1) 4s infinite; -moz-animation: pong cubic-bezier(0.77, 0, 0.175, 1) 4s infinite; animation: pong cubic-bezier(0.77, 0, 0.175, 1) 4s infinite;
}
@-webkit-keyframes pong {
  25% { width: 100%; }
  50% { width: 0; left: auto; right: 0; }
  75% { width: 100%; }
  100% { width: 0; right: auto; left: 0; }
}
@-moz-keyframes pong {
  25% { width: 100%; }
  50% { width: 0; left: auto; right: 0; }
  75% { width: 100%; }
  100% { width: 0; right: auto; left: 0; }
}
@keyframes pong {
  25% { width: 100%; }
  50% { width: 0; left: auto; right: 0; }
  75% { width: 100%; }
  100% { width: 0; right: auto; left: 0; }
}
.show-alert div.alert-overlay, .show-alert div.alert {
  display: block;
}

/****************************************
  ==== MESSAGES
****************************************/

div.error-msg {
  background: #fdd9d7; padding: 15px 15px 1px 15px;
}
div.error-msg.ico {
  position: relative; padding-left: 80px;
}
div.error-msg.ico span {
  width: 60px; display: block; text-align: center; background: #f44336; color: #fff; position: absolute; top: 0; bottom: 0; left: 0;
}
div.error-msg.ico span:before {
  width: 100%; position: absolute; top: 50%; left: 0; font-size: 160%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); transform: translateY(-50%);
}
div.error-msg ul {
  margin: 0 0 11px 0;
}
div.warning-msg {
  background: #fffde7; padding: 15px 15px 1px 15px;
}
div.warning-msg.ico {
  position: relative; padding-left: 80px;
}
div.warning-msg.ico span {
  width: 60px; display: block; text-align: center; background: #ff9800; color: #fff; position: absolute; top: 0; bottom: 0; left: 0;
}
div.warning-msg.ico span:before {
  width: 100%; position: absolute; top: 50%; left: 0; font-size: 160%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); transform: translateY(-50%);
}
div.ok-msg {
  background: #e8f3db; padding: 15px 15px 1px 15px;
}
div.ok-msg.ico {
  position: relative; padding-left: 80px;
}
div.ok-msg.ico span {
  width: 60px; display: block; text-align: center; background: #8ac249; color: #fff; position: absolute; top: 0; bottom: 0; left: 0;
}
div.ok-msg.ico span:before {
  width: 100%; position: absolute; top: 50%; left: 0; font-size: 160%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); transform: translateY(-50%);
}

/****************************************
  ==== NOTIFICATIONS
****************************************/

.notification {
  width: 280px; position: fixed; top: 20px; right: -300px; z-index: 4; text-align: left; font-size: 0.9375em; border-left: transparent 5px solid; padding: 10px 35px 10px 15px; background: #fff; -webkit-transition: right .2s; -moz-transition: right .2s; transition: right .2s; -webkit-box-shadow: 0 1px 20px rgba(34,44,55,0.3); -moz-box-shadow: 0 1px 20px rgba(34,44,55,0.3); box-shadow: 0 1px 20px rgba(34,44,55,0.3);
}
.notification.ok {
  border-color: #8ac249;
}
.notification.error {
  border-color: #f44336;
}
.notification.revealed {
  right: 20px;
}
.notification .close {
  position: absolute; top: 12px; right: 10px; cursor: pointer;
}

/****************************************
  ==== FORM FIELD HELPER
****************************************/

div.form-field-helper {
  padding: 20px; background: #fff; position: absolute; border-bottom: #2196f3 5px solid; top: 50px; left: -5px; right: -5px; font-weight: 300; z-index: 999; -webkit-box-shadow: 0 1px 20px rgba(34,44,55,0.3); -moz-box-shadow: 0 1px 20px rgba(34,44,55,0.3); box-shadow: 0 1px 20px rgba(34,44,55,0.3);
}
div.form-field-helper:before {
  content: ''; display: block; position: absolute; top: -19px; left: 50px; z-index: 18; border: transparent 10px solid; border-bottom-color: #fff;
}

/****************************************
  ==== FORM LABEL HELPER
****************************************/

div.label-helper {
  padding: 20px; background: #fff; position: absolute; border-bottom: #2196f3 5px solid; top: 50px; left: -5px; right: -5px; font-weight: 300; z-index: 999; text-align: left; -webkit-box-shadow: 0 1px 20px rgba(34,44,55,0.3); -moz-box-shadow: 0 1px 20px rgba(34,44,55,0.3); box-shadow: 0 1px 20px rgba(34,44,55,0.3);
}
div.label-helper:before {
  content: ''; display: block; position: absolute; top: -19px; left: 50%; margin: 0 0 0 -10px; z-index: 18; border: transparent 10px solid; border-bottom-color: #fff;
}

/****************************************
  ==== DATEPICKER
****************************************/

div.datepicker-widget {
  width: 800px; background: #fff; position: fixed; top: 50%; left: 50%; z-index: 99; text-align: left; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-shadow: 0 1px 20px rgba(34,44,55,0.3); -moz-box-shadow: 0 1px 20px rgba(34,44,55,0.3); box-shadow: 0 1px 20px rgba(34,44,55,0.3); -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); transform: translate(-50%,-50%);
}
div.datepicker-overlay {
  display: block !important; z-index: 98 !important;
}
div.datepicker-widget div.calendar-sidebar {
  width: 300px; min-height: 400px; float: left; display: -webkit-flex; display: -ms-flexbox; display: flex;
}
 div.datepicker-widget div.table-wrap {
  width: 500px; float: left; padding: 30px; display: -webkit-flex; display: -ms-flexbox; display: flex;
}
div.datepicker-widget div.calendar-sidebar-content {
  width: 100%; padding: 30px 30px 80px 30px; background: #009688; color: #fff;
}
div.datepicker-widget div.calendar-sidebar div.selected-year {
  font-size: 1.25em; line-height: 1em;
}
div.datepicker-widget div.calendar-sidebar div.selected-month {
  font-size: 3em; line-height: 1em; margin: 0 0 20px 0;
}
div.datepicker-widget div.calendar-sidebar .arrow {
  width: 39px; height: 39px; float: left; margin: 0 5px 0 0; cursor: pointer; background: #222c37 url(../../images/ui/sprites/core-sprite.png) 14px -191px no-repeat; text-indent: -9999em; outline: none; -webkit-appearance: none; outline-width: 0; outline: none; border: 0; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;
}
div.datepicker-widget div.calendar-sidebar .arrow-next {
  background-position: -33px -191px;
}
div.datepicker-widget table {
  width: 100%; margin: 0;
}
div.datepicker-widget table tr td {
  text-align: center; padding: 5px 0;
}
div.datepicker-widget table tr.daysRow td {
  font-size: 1.25em; font-weight: 400; padding: 0 0 10px 0; border-bottom: #f5f8f9 1px solid;
}
div.datepicker-widget table input {
  width: 40px; height: 40px; line-height: 40px; font-family: 'Inter', sans-serif; font-weight: 300; display: inline-block; font-size: 1.125em; cursor: pointer; outline: none; -webkit-appearance: none; outline-width: 0; outline: none; border: 0; background: none; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%;
}
div.datepicker-widget table input:hover {
  background: #fce4ec;
}
div.datepicker-widget table input.today {
  font-weight: 700; background: #222c37; color: #fff;
}
div.datepicker-widget table input.selected {
  font-weight: 700; background: #e91e63; color: #fff;
}
div.datepicker-widget table input.othermonth {
  color: #9e9e9e;
}

/****************************************
  ==== PROGRESS
****************************************/

div.progress {
  width: 100%; padding: 30px 0 30px 0; overflow: hidden;
}
div.progress div.step {
  float: left; text-align: center; position: relative;
}
div.progress div.step:before {
  content: ''; width: 100%; height: 1px; display: block; position: absolute; top: -20px; left: 50%; z-index: 1; background: #ececec;
}
div.progress div.step div.dot {
  width: 11px; height: 11px; position: absolute; top: -25px; left: 50%; z-index: 4; background: #ececec; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); transform: translateX(-50%);
}
div.progress div.step:last-child:before {
  display: none;
}
div.progress div.active div.dot {
  width: 22px; height: 22px; top: -30px; background: #fff; border: #e91e63 2px solid;
}
div.progress div.active div.dot:after {
  content: ''; width: 10px; height: 10px; display: block; position: absolute; top: 4px; left: 50%; background: #e91e63; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); transform: translateX(-50%);
}
div.progress div.active div.dot:before {
  top: 8px;
}
div.progress div.completed:before {
  background: #e91e63;
}
div.progress div.completed div.dot {
  background: #e91e63;
}
div.steps3 div.step { width: 33.33333334%; }
div.steps4 div.step { width: 25%; }
div.steps5 div.step { width: 20%; }
div.steps6 div.step { width: 16.66666667%; }
div.steps7 div.step { width: 14.28571428%; }
div.steps8 div.step { width: 12.5%; }

/****************************************
  ==== CREDIT CARD ICONS
****************************************/

div.card {
  width: 32px; height: 20px; float: left; margin: 0 5px 5px 0; background: url(../../images/ui/sprites/cc-sprite.png) 0 0 no-repeat;
}
div.visa { background-position: 0 0; }
div.mastercard { background-position: -32px 0; }
div.discovercard { background-position: -64px 0; }
div.diners { background-position: -96px 0; }
div.americanexpress { background-position: -128px 0; }
div.japanesecreditbank { background-position: -160px 0; }
div.paypal { background-position: -192px 0; }
div.maestro { background-position: -224px 0; }
div.unionpay { background-position: -256px 0; }
div.na { background-position: -288px 0; }

div.credit-cards.big div.card {
  width: 48px; height: 30px; margin: 0 10px 0 0; background: url(../../images/ui/sprites/cc-big-sprite.png) 0 0 no-repeat;
}
div.credit-cards.big div.visa { background-position: 0 0; }
div.credit-cards.big div.mastercard { background-position: -48px 0; }
div.credit-cards.big div.discovercard { background-position: -96px 0; }
div.credit-cards.big div.diners { background-position: -144px 0; }
div.credit-cards.big div.americanexpress { background-position: -192px 0; }
div.credit-cards.big div.japanesecreditbank { background-position: -240px 0; }
div.credit-cards.big div.paypal { background-position: -288px 0; }
div.credit-cards.big div.maestro { background-position: -336px 0; }
div.credit-cards.big div.unionpay { background-position: -384px 0; }
div.credit-cards.big div.na { background-position: -432px 0; }

div.card.disabled {
  opacity: 0.2;
}

/****************************************
  ==== BREAKPOINT < 1024px
****************************************/

@media only screen and (min-width: 150px) and (max-width: 1023px){

div.datepicker-widget {
  width: 96%; margin: 0 0 1px 0;
}
div.datepicker-widget div.calendar-sidebar {
  width: 100%;
}
 div.datepicker-widget div.table-wrap {
  width: 100%; padding: 20px;
}
div.datepicker-widget div.calendar-sidebar-content {
  padding: 20px; text-align: center;
}
div.datepicker-widget div.calendar-sidebar div.selected-year {
  font-size: 1.25em;
}
div.datepicker-widget div.calendar-sidebar div.selected-month {
  font-size: 1.25em; margin: 0; font-weight: 700;
}
div.datepicker-widget div.calendar-sidebar .arrow {
  float: none; margin: 0; position: absolute; top: 20px; left: 20px;
}
div.datepicker-widget div.calendar-sidebar .arrow-next {
  left: auto; right: 20px;
}
div.datepicker-widget table tr td {
  padding: 5px 0;
}
div.datepicker-widget table tr.daysRow td {
  font-size: 1.125em;
}
div.datepicker-widget table input {
  width: 35px; height: 35px; line-height: 35px; font-size: 1em;
}

}

/****************************************
  ==== BREAKPOINT < 768px
****************************************/

@media only screen and (min-width: 150px) and (max-width: 767px){

ul.tabs li {
  height: 50px;
}
ul.tabs li a {
  height: 50px; line-height: 50px; padding: 0 20px;
}
ul.tabs li.selected a, ul.tabs li a.selected {
  height: 50px; line-height: 44px;
}
div.tab-content {
  padding: 20px;
}
div.select-box.text div.trigger {
  padding: 20px 35px 12px 20px;
}
table.data thead {
  display: none;
}
table.data tbody tr {
  margin: 0 0 10px 0;
}
table.data tbody tr:hover {
  background: none;
}
table.data tbody td {
  display: block; padding: 10px 15px; text-align: left !important; border-bottom: #f5f8f9 1px solid;
}
table.data tbody tr td:first-child {
  background: #f5f8f9; color: #222c37;
}
table.data tbody td:before {
  content: attr(data-th); width: 25%; display: inline-block; font-weight: 400;
}
table.data tbody tr, table.data tbody tr td:first-child {
  border: 0;
}
div.alert {
  width: 400px; padding: 20px;
}

}

/****************************************
  ==== BREAKPOINT < 480px
****************************************/

@media only screen and (min-width: 150px) and (max-width: 479px){

ul.tabs li {
  height: 40px;
}
ul.tabs li a {
  height: 40px; line-height: 40px; padding: 0 15px;
}
ul.tabs li.selected a, ul.tabs li a.selected {
  height: 40px; line-height: 34px;
}
div.tab-content {
  padding: 15px;
}
div.select-box.text div.trigger {
  padding: 20px 35px 12px 10px;
}
table.data tbody td {
  padding: 10px;
}
div.alert {
  width: 280px; padding: 20px;
}

}

/****************************************
  ==== RETINA IMAGES
****************************************/

@media only screen and (-moz-min-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio:2){

div.datepicker-widget div.calendar-sidebar .arrow {
  background-image: url(../../images/ui/sprites/core-sprite@2x.png); -webkit-background-size: 500px 500px; -moz-background-size: 500px 500px; -o-background-size: 500px 500px; background-size: 500px 500px;
}
div.card {
  background-image: url(../../images/ui/sprites/cc-sprite@2x.png); -webkit-background-size: 320px 20px; -moz-background-size: 320px 20px; -o-background-size: 320px 20px; background-size: 320px 20px;
}
div.credit-cards.big div.card {
  background-image: url(../../images/ui/sprites/cc-big-sprite@2x.png); -webkit-background-size: 480px 30px; -moz-background-size: 480px 30px; -o-background-size: 480px 30px; background-size: 480px 30px;
}

}