umts/pvta-multiplatform

// Ionic Variables and Theming. For more info, please see:
// http://ionicframework.com/docs/v2/theming/
@import "ionic.globals";


// Shared Variables
// --------------------------------------------------
// To customize the look and feel of this app, you can override
// the Sass variables found in Ionic's source scss files.
// To view all the possible Ionic variables, see:
// http://ionicframework.com/docs/v2/theming/overriding-ionic-variables/




// Named Color Variables
// --------------------------------------------------
// Named colors makes it easy to reuse colors on various components.
// It's highly recommended to change the default colors
// to match your app's branding. Ionic uses a Sass map of
// colors so you can add, rename and remove colors as needed.
// The "primary" color is the only required color in the map.

$colors: (
  primary:        #2196F3,
  positive:       #2196F3,
  positive-dark:  #1976D2,
  secondary:      #1976D2,
  danger:         #f53d3d,
  light:          #f4f4f4,
  dark:           #222,
  light-green:    #76FF03,
  dark-green:     #68B49F,
  grey:           #808080,
  white:          #ffffff
);


// App iOS Variables
// --------------------------------------------------
// iOS only Sass variables can go here




// App Material Design Variables
// --------------------------------------------------
// Material Design only Sass variables can go here




// App Windows Variables
// --------------------------------------------------
// Windows only Sass variables can go here




// App Theme
// --------------------------------------------------
// Ionic apps can have different themes applied, which can
// then be future customized. This import comes last
// so that the above variables are used and Ionic's
// default are overridden.

@import "ionic.theme.default";


// Ionicons
// --------------------------------------------------
// The premium icon font for Ionic. For more info, please see:
// http://ionicframework.com/docs/v2/ionicons/

$ionicons-font-path: "../assets/fonts";
@import "ionic.ionicons";

#directions-map {
  height:50%;
}

.user-input{
  border-radius: 5px;
  background-color: #FFFFFF;
}

.location-typeahead {
  width:100%;
  text-overflow: ellipsis;
}

.center-div {
  text-align: center;
  margin-bottom: 10px;
}

.center {
  text-align: center;
}

.input-div {
background-color: #387ef5;
color: white;
border: none;
}

.trip-time {
display:inline-block;
float:left;
margin:5px;
}

.trip-button{
  border: 3px white solid;
  background-color: #2C63BF;
  color: white;
  padding: 10px;
  display: inline-block;
  font-weight: bold;
  margin: 5px;
}

#route-button{
  width:25%;
}

#stop-map {
  height: 50%;
}

#directions {
  font-family: 'Roboto','sans-serif';
  line-height: 30px;
  padding-left: 10px;
  padding-right: 10px;
  height: 50%;
  float: top;
  overflow: auto;
  width: 100%;
}

.disclaimer {
  color: grey;
  font-size: small;
  font-style: italic;
  text-align: left;
}

.ion-social-facebook {
  margin-left: 30%;
}

.button-contact-page {
  width: 2.5em;
}

.departure-padding {
  margin-bottom: 10px;
}

.text-left {
  text-align: left;
}
.no-more-departures {
  text-align: center;
  color: white;
}

.no-more-departures.ng-enter {
  transition: 0.5s linear all;
  opacity: 0;
}

.no-more-departures.ng-enter.ng-enter-active {
  opacity: 1;
}

.bold {
  font-weight: bold;
}

.route-shortname {
  font-size: 175%;
}

.white {
  color: white;
}

.center {
  text-align: center;
}
.fade.ng-enter {
  transition:0.5s linear all;
  opacity:0;
}

/* The finishing CSS styles for the enter animation */
.fade.ng-enter.ng-enter-active {
  opacity:1;
}
/*
 * Used when displaying Stop Departures by time.
 * Essentially a workaround for the fact that <ion-item>s
 * don't allow us to apply a background color and an href
 * unless we subclass them.
 * See the second answer at
 * http://stackoverflow.com/questions/29878825/ionic-item-color-and-href-not-working
 */
.departure-by-time .item-complex .item-content {
  background-color: inherit;
}