@font-face {
        font-family: "MyriadPro";
        src: url("../fonts/MYRIADPRO-REGULAR.OTF");
          
    }

@font-face {
        font-family: "MyriadProCond";
        src: url("../fonts/MYRIADPRO-COND.OTF");
          
    }


@font-face {
        font-family: "MyriadProSemiBold";
        src: url("../fonts/MYRIADPRO-SEMIBOLD.OTF");
          
    }

@font-face {
        font-family: "OpenSansCondLight";
        src: url("../fonts/OpenSans-CondLight.ttf");
          
    }


@font-face {
        font-family: "OpenSansCondBold";
        src: url("../fonts/OpenSans-CondBold.ttf");
          
    }

@font-face {
  font-family: "Ubuntu";
  src: url(../fonts/Ubuntu-Light.ttf);
}    

label.myLabel input[type="file"] {
    position: fixed;
    top: -1000px;
}

/***** Example custom styling *****/
.myLabel {
    border: 2px solid #AAA;
    border-radius: 4px;
    padding: 2px 5px;
    margin: 2px;
    background: #DDD;
    display: inline-block;
}
.myLabel:hover {
    background: #CCC;
}
.myLabel:active {
    background: #CCF;
}
.myLabel :invalid + span {
    color: #A44;
}
.myLabel :valid + span {
    color: #4A4;
}

.profileInput {
       margin-bottom: 7px !important;
     -webkit-appearance:none !important;
     text-transform: uppercase;
     
      

  font-family: "OpenSansCondLight" !important;
  line-height: 1.2 !important;
  font-weight: 200 !important;

  font-size: 16px !important;
  
  /*text-shadow: 0 1px 0 #f3f3f3;*/
  /*border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
  border-top-right-radius: 4px;
  border-top-left-radius: 4px;*/
  border-style: solid;
  border-width: 1px !important;
  margin: 0.5em 0;
  /*box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2) inset;
  border-radius: 0.3125em;*/
  border-color: #ffffff;
  padding: 0px;
  margin: 0px;
  width: 100%;
  min-height: 2.2em;
  padding: 0.4em;
  margin-bottom: 3px;   

}



 .tripsButtonClass
{
    background:#f8a440 !important;
    padding: 2px !important;
    color:#ffffff !important;
    font-family:"OpenSansCondBold" !important;
    font-size:14px !important;
   
    border-radius:2px !important;
    -moz-border-radius:2px !important;
    -webkit-border-radius:2px !important;
    border:none !important;
}

 .settingsButtonClass
{
    background:#7d4ca1 !important;
    padding: 2px !important;
    color:#ffffff !important;
    font-family:"OpenSansCondBold" !important;
    font-size:14px !important;
   
    border-radius:2px !important;
    -moz-border-radius:2px !important;
    -webkit-border-radius:2px !important;
    border:none !important;
}


 .viewsButtonClass
{
    background:#99d24b !important;
    padding: 2px !important;
    color:#ffffff !important;
    font-family:"OpenSansCondBold" !important;
    font-size:14px !important;
   
    border-radius:2px !important;
    -moz-border-radius:2px !important;
    -webkit-border-radius:2px !important;
    border:none !important;
}

 .ui-dialog .ui-dialog-buttonpane {
  text-align: left;
  border-width: 1px 0 0 0;
  background-image: none;
  margin-top: .5em;
  padding: 10px 2px 2px 10px !important;
}

 
 .ui-dialog.settingsModal-dialog {
    left: 0;
    outline: 0 none;
    padding: 0 !important;
    position: absolute;
    top: 0;
}

 .ui-dialog.tripsModal-dialog {
    left: 0;
    outline: 0 none;
    padding: 0 !important;
    position: absolute;
    top: 0;
}

 .ui-dialog.tripsModal-dialog .ui-dialog-content {
    background: none repeat scroll 0 0 transparent;
    border: 0 none;
    overflow: auto;
    position: relative;
    padding: 2px !important;
    margin: 0;

}

 .ui-dialog .ui-dialog-buttonpane {
  text-align: left;
  border-width: 0px 0 0 0 !important;
  background-image: none;
  margin-top: .5em;
  font: normal 14px "OpenSansCondLight" !important;
}

 .loginInput::-webkit-input-placeholder { 
    color:    white;

}
.loginInput:-moz-placeholder { 
    color:    white;
}
.loginInput::-moz-placeholder { 
    color:    white;
}
.loginInput:-ms-input-placeholder { 
    color:    white;
}


.tripInput::-webkit-input-placeholder { 
    color: #333333;

}
.tripInput:-moz-placeholder { 
    color:#333333;
}
.tripInput::-moz-placeholder { 
    color:#333333;
}
.tripInput:-ms-input-placeholder { 
    color:#333333   ;
}



.loginCheckBox {
   
	position: relative;

}

.smartBtn {
display:none;
}

.loginCheckBox label {
	cursor: pointer;
	position: absolute;
	width: 25px;
	height: 25px;
	top: 0;
  	left: 0;
	background: #eee;
	border:1px solid #ddd;
}


.loginCheckBox label:after {
	opacity: 0.2;
	content: '';
	position: absolute;
	width: 9px;
	height: 5px;
	background: transparent;
	top: 6px;
	left: 7px;
	border: 3px solid #333;
    border-top: none;
	border-right: none;

	transform: rotate(-45deg);
}

/**
 * Create the hover event of the tick
 */
.loginCheckBox label:hover::after {
	opacity: 0.5;
}

/**
 * Create the checkbox state for the tick
 */
.loginCheckBox input[type=checkbox]:checked + label:after {
	opacity: 1;
}




body {
font-family: "Ubuntu" !important;
background-color:white;
margin: 0px;
color: white;

}

.img-circular {
  width: 80px;
  height: 80px;
  background-size: cover;
  display: block;
  border-radius: 100px;
  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  margin-left:50px;

}

.img-circular-profile {
  width: 80px;
  height: 80px;
  background-size: cover;
  display: block;
  border-radius: 100px;
  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  margin-left:20px; margin-right:10px;

}

.pushmenu { /*this is the nav*/
  background: #ffffff;
 font-family: "OpenSansCondLight" !important;
  width: 180px;
  height: 100%; 
  top: 0;
  z-index: 1000;
  position:fixed;
  
}

.pushmenu h3 {
  color: #cbbfad;
  font-size: 14px;
  font-weight: bold;
  padding: 15px 20px;
  margin: 0;
  background: #282522;    
  height: 16px;
}

.pushmenu a {
  display: block; /* drops the nav vertically*/
  color: #000;
  font-size: 16px;
  font-weight: bold;
  text-decoration: none;
  /*border-top: 1px solid #56544e;
  border-bottom: 1px solid #312e2a;*/
  padding: 14px;
}

#ultags li {
  border: 0px;
  height: 30px;
  vertical-align: middle;
}
.settingsSpan {
    color: white;
    font: 200 16px/1.5em "OpenSansCondBold";
    text-transform: uppercase;
    width: 36%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
    padding-top: 1px;
}

.pushmenu a:hover {
  background:#00A287;
}

.pushmenu a:active {
  background: #454f5c;
  color: #fff;
}

.pushmenu-left {
  left: -180px;

}

.pushmenu-left.pushmenu-open {
  left: 0;
  position: absolute;
  /* top: 50px; */
  /* z-index: 1000;
  float: left; */
}

.pushmenu-push {
  overflow-x: hidden;
  position: relative;
  left: 0;
}


.pushmenu-push-toright {
  /* left: 180px; */
}

.pushmenu-push-toright-content {
    /* left: 180px;
    position: relative;
    width: calc(100% - 180px); */
}
/*Transition*/
.pushmenu, .pushmenu-push {
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  transition: all 0.3s ease;  
}

#nav_list {
  background: url(/images/navmenu.png) no-repeat left top;
  cursor: pointer;
 
  
  text-indent: -99999em;
}

nav-list.active {
  background-position: -33px top;
}

 .buttonset {
      background: #ffffff;
      height: 16px;
      padding: 10px 20px 30px;
 }
 
 


.ddlTrips {
padding:10px; width:100%; font-size:20px;color: #828282;
    font-family: 'MyriadProCond'; font-size: 20px; font-weight: 200; height: 50px;

}
.selectWhite {
 color: #ffffff !important;
      background-color: #f8a440 !important;
      margin-bottom: 7px !important;
     -webkit-appearance:none !important;
      
  font-family: "OpenSansCondLight" !important;
  line-height: 1.2 !important;
  font-weight: 200 !important;

  font-size: 16px !important;
  line-height: 1.5;
  text-transform: uppercase;
  /*text-shadow: 0 1px 0 #f3f3f3;*/
  /*border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
  border-top-right-radius: 4px;
  border-top-left-radius: 4px;*/
  border-style: solid;
  border-width: 1px !important;
  margin: 0.5em 0;
  /*box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2) inset;
  border-radius: 0.3125em;*/
  border-color: #ffffff;
  padding: 0px;
  margin: 0px;
  width: 100%;
  min-height: 2.2em;
  padding-left: 0.4em;
  padding-top: 2px;
  /*margin-bottom: 3px;*/
}




.selectGrey {
 color: #333333 !important;
      background-color: #f8a440 !important;
      margin-bottom: 7px !important;
     -webkit-appearance:none !important;
      
  font-family: "OpenSansCondLight" !important;
  line-height: 1.2 !important;
  font-weight: 200 !important;

  font-size: 16px !important;
  line-height: 1.5;
  text-transform: uppercase;
  /*text-shadow: 0 1px 0 #f3f3f3;*/
  /*border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
  border-top-right-radius: 4px;
  border-top-left-radius: 4px;*/
  border-style: solid;
  border-width: 1px !important;
  margin: 0.5em 0;
  /*box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2) inset;
  border-radius: 0.3125em;*/
  border-color: #ffffff;
  padding: 0px;
  margin: 0px;
  width: 100%;
  min-height: 2.2em;
  padding-left: 0.4em;
  padding-top: 2px;
  /*margin-bottom: 3px;*/
}


.selectTrips {
  -moz-box-shadow: inset 0px 1px 0px 0px #ffffff;
    -webkit-box-shadow: inset 0px 1px 0px 0px #ffffff;
    box-shadow: inset 0px 1px 0px 0px #ffffff;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #dfdfdf));
    background: -moz-linear-gradient(top, #ededed 5%, #dfdfdf 100%);
    background: -webkit-linear-gradient(top, #ededed 5%, #dfdfdf 100%);
    background: -o-linear-gradient(top, #ededed 5%, #dfdfdf 100%);
    background: -ms-linear-gradient(top, #ededed 5%, #dfdfdf 100%);
    background: linear-gradient(to bottom, #ededed 5%, #dfdfdf 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#dfdfdf',GradientType=0);
    background-color: #ededed;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
    border: 1px solid #dcdcdc;
    display: inline-block;
    cursor: pointer;
    color: #777777;
    font-family: Arial;
    font-size: 12px;
    font-weight: bold;
    padding: 3px 12px;
    text-decoration: none;
    text-shadow: 0px 1px 0px #ffffff;

}

.tripInputSelect {
    
      background-color: #f8a440 !important;
      margin-bottom: 7px !important;
     -webkit-appearance:none !important;
      
  font-family: "OpenSansCondLight" !important;
  line-height: 1.2 !important;
  font-weight: 200 !important;

  font-size: 16px !important;
  line-height: 1.5;
  text-transform: uppercase;
  /*text-shadow: 0 1px 0 #f3f3f3;*/
  /*border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
  border-top-right-radius: 4px;
  border-top-left-radius: 4px;*/
  border-style: solid;
  border-width: 1px !important;
  margin: 0.5em 0;
  /*box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2) inset;
  border-radius: 0.3125em;*/
  border-color: #ffffff;
  padding: 0px;
  margin: 0px;
  width: 100%;
  min-height: 2.2em;
  padding-left: 0.4em;
  padding-top: 2px;
  /*margin-bottom: 3px;*/
}


.tripInput {
    color: #ffffff;
      background-color: #f8a440 !important;
      margin-bottom: 7px !important;
     -webkit-appearance:none !important;
      
  font-family: "OpenSansCondLight" !important;
  line-height: 1.2 !important;
  font-weight: 200 !important;

  font-size: 16px !important;
  line-height: 1.5;
  text-transform: uppercase;
  /*text-shadow: 0 1px 0 #f3f3f3;*/
  /*border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
  border-top-right-radius: 4px;
  border-top-left-radius: 4px;*/
  border-style: solid;
  border-width: 1px !important;
  margin: 0.5em 0;
  /*box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2) inset;
  border-radius: 0.3125em;*/
  border-color: #ffffff;
  padding: 0px;
  margin: 0px;
  width: 100%;
  min-height: 2.2em;
  padding-left: 0.4em;
  padding-top: 2px;
  /*margin-bottom: 3px;*/
}


 #listviewViews li{
    margin: 0;
  background-color: #99d24b;
  list-style-type: none;
  
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0px 0px 0px 0px;
  height:59px;
    border-top-left-radius: 10px;
  border-top-right-radius: 10px;

}



 .settingsInput {
      color: #ffffff !important;
      background-color: #7d4ca1 !important;
      margin-bottom: 7px !important;
     -webkit-appearance:none !important;
     text-transform: uppercase;
     
       -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
     margin-left: 10px; padding: 0px;
     
  font-family: "OpenSansCondLight" !important;
  line-height: 1.2 !important;
  font-weight: 200 !important;

  font-size: 14px !important;
  line-height: 1.5;
  /*text-shadow: 0 1px 0 #f3f3f3;*/
  /*border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
  border-top-right-radius: 4px;
  border-top-left-radius: 4px;*/
  border-style: solid;
  border-width: 1px !important;
 
  /*box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2) inset;
  border-radius: 0.3125em;*/
  border-color: #ffffff;
 
  width: 95%;
  min-height: 2.2em;
  
  margin-bottom: 3px;

}

.settingsSelect {
      color: #ffffff !important;
      background-color: #7d4ca1 !important;
     
     -webkit-appearance:none !important;
     text-transform: uppercase;
     
       -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
   
     
  font-family: "OpenSansCondBold" !important;
  line-height: 1.2 !important;
  font-weight: 200 !important;

  font-size: 14px !important;
  line-height: 1.5;
  /*text-shadow: 0 1px 0 #f3f3f3;*/
  /*border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
  border-top-right-radius: 4px;
  border-top-left-radius: 4px;*/
  border-style: solid;
  border-width: 1px !important;
  padding: 0px 0px 0px 5px;
 
  /*box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2) inset;
  border-radius: 0.3125em;*/
  border-color: #ffffff;
 
  
}

.settingsSpan {   
    color: inherit;font: 200 1em/1.5em Lato;color: white;font-size:16px;font-family:"OpenSansCondBold";text-transform: uppercase;
}

.settingsLabel {
    margin-top: 5px;padding-bottom:5px; width:100%; background-color: inherit;display:block;padding:2px; color:white;border-bottom: dotted 1px #999999;
}

#prfbtn {
margin-top: 2px;
margin-bottom: 2px;

}

.km-switch {
  width: 3.2rem;
  height: 1.8rem;
  line-height: 1.76rem;
  overflow: hidden;
  margin-bottom: -6px;
  float: right;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
  border-top-right-radius: 10px;
  border-top-left-radius: 10px;
}

.km-switch-container {
  top: 0;
  left: 0;
  position: absolute;
  display: block;
  height: 100%;
  width: 100%;
  overflow: hidden;
  background: transparent;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.onoffswitch {
    position: relative; width: 60px;
    -webkit-user-select:none; -moz-user-select:none; -ms-user-select: none; bottom:3px;
   
}
.onoffswitch-checkbox {
    display: none;
}
.onoffswitch-label {
    display: block; overflow: hidden; cursor: pointer;
    border-radius: 20px;
}
.onoffswitch-inner {
    display: block; width: 200%; margin-left: -100%;
    transition: margin 0.3s ease-in 0s;

}
.onoffswitch-inner:before, .onoffswitch-inner:after {
    display: block; float: left; width: 50%; height: 30px; padding: 0; line-height: 30px;
    font-size: 14px; color: white; font-family: Trebuchet, Arial, sans-serif; font-weight: bold;
    box-sizing: border-box;

}
.onoffswitch-inner:before {
    content: "";
    padding-left: 20px;
    background-color: #ffffff; color: #FFFFFF;
     background-image: url('/images/on3.png'); position:relative; z-index:10;
       background-position: 90% 50%;
  background-repeat: no-repeat;
}
.onoffswitch-inner:after {
    content: "";
     background-image: url('/images/off3.png');
    padding-right: 5px;
    background-color: #ffffff; color: #999999;
    text-align: right;
      background-position: 8% 50%;
  background-repeat: no-repeat;
}
.onoffswitch-switch {
    display: block;  margin: 0px;
    background: #038f5c;
    position: absolute; top: 0; bottom: 0; 
    right: 66px;
    
    transition: all 0.3s ease-in 0s; 
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {
    margin-left: 0;
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {
    right: 0px; 
}

.previewInput {
  font-size: 14px !important;
  color: white !important;
  background-color: #0e76bc !important;
  border: none !important;
  border-radius: 0px !important;
  text-shadow: none !important;
  padding: 10px !important;
  box-shadow: none !important;
  width: 100%;
  text-transform: uppercase;
  line-height: 1.5;
}       

#listviewNews li {
  margin: 0;
  background-color: #2bb673;
  list-style-type: none;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0px 0px 0px 0px;
  height: 60px;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}


.order-button {
    width: 100%;
    margin-top: 2px;
    width: 100%;
    font-family: 'MyriadProCond';
    font-size: 20px;
    color: #828282;
    font-weight: 200;
    height: 50px;
    display: -webkit-box;
    -webkit-box-pack: center;
    -webkit-box-align: center;
    background-color: #ffffff;
    border-color: #ffffff;
    text-shadow: none !important;
    border: none !important;
    box-shadow: none !important;
    cursor: pointer;
    cursor: hand;
    text-decoration-line: none;
}

/*.container {
    width:100%;
    margin-top: 30px;
}*/



ul.listviewTrips li {
    margin: 0;
    margin-top: -10PX !important;
    width: 1024px;
    background-color: #f7941e;
    list-style-type: none;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0px 0px 0px 0px;
    height: 59px;
    border-top-left-radius: 10px !important;
    border-top-right-radius: 10px !important;
}

    ul.listviewTrips li.historical {
        background-color: #f8a440 !important;
    }

.menu-dashboard-selected {
    color: #cccccc !important;
}
.menu-profile-selected {
    color: #cccccc !important;
}
.menu-trips-selected {
    color: #cccccc !important;
}
.menu-views-selected {
    color: #cccccc !important;
}


.menu-news-selected {
    color: #cccccc !important;
}

.menu-help-selected {
    color: #cccccc !important;
}

.menu-settings-selected {
    color: #cccccc !important;
}
.menu-preview-selected {
    color: #cccccc !important;
}


/* Login */

.loginInput {
  font-size: 16px !important;
  color:white !important; 
  background-color: #70cde9ea !important; 
  border: none !important; 
  border-radius: 10px !important;   
  text-shadow: none !important; 
  padding:10px !important; 
  box-shadow: none !important; 
  font-family: "OpenSansCondLight";
}