@font-face { 
  font-family: montserrat;
  src: url('/Odyssey/javax.faces.resource/fonts/montserrat-regular.ttf.seam');
}
@font-face {
  font-family: lato;
  src: url('/Odyssey/javax.faces.resource/fonts/lato-light.ttf.seam');
}

*, html {
  padding: 0px;
  margin: 0px;
}

body, #body   {
  font-family: lato, sans-serif;
  font-size: 100%;
  font-weight: 300;
  line-height: 1.6;
  color: #023064;
}

button, input, optgroup, select, textarea {
  color: inherit;
  font: inherit;
  margin: 0;
}

/* ===== Search Schedules & Track and trace ===== */
      .searchschedules-container,
      .trackandtrace-container {
        display: block;
        float: left;
        width: 100%;
        margin: 0 0 30px 0;
        position: relative;
      }

        .searchschedules-header,
        .trackandtrace-header {
          display: block;
          float: left;
          width: 100%;
          background: #023064;
          margin-bottom: 10px;
          overflow: hidden;
          position: relative;
        }

          .searchschedules-header .fa,
          .trackandtrace-header .fa {
            display: block;
            position: absolute;
            top: 12px;
            right: 20px;
            font-size: 30px;
            color: #009FE3;
          }
          .searchschedules-header p,
          .trackandtrace-header p {
            display: block;
            float: left;
            width: 100%;
            padding: 0 20px;
            line-height: 50px;
            color: #FFFFFF;
            border-bottom: 2px solid #009FE3;
          }

      .searchschedules-content,
      .trackandtrace-content {
        display: block;
        float: left;
        width: 100%;
        margin: 0px;
        position: relative;
        height: 280px;
      }

        .searchschedules-content p,
        .trackandtrace-content p,
        .trackandtrace-content div {
          display: block;
          float: left;
          width: 100%;
          margin-top: 0px;
          position: relative;
          padding:0px;
        }
        .searchschedules-content p:last-of-type,
        .trackandtrace-content p:last-of-type {
          display: block;
          position: absolute;
          margin-bottom: 0px;
          bottom:0px;
          left: 0;
        }
        .searchschedules-content p.date {
          width: calc(100% - 50px);
        }
        .searchschedules-content p.number {
          width: 40px;
          text-align: center;
          margin-left: 10px;
          padding-top:10px;
        }
        
        .searchschedules-content p.number label{
        	padding-bottom:4px;
        	font-size:16px;
        }
        
        
        .trackandtrace-content div.select, .searchschedules-content div.select {
          position: relative;
        }

		.searchschedules-content div.select{
			background:#E2E2E2;
		}

          .trackandtrace-content div.select span,
           .searchschedules-content div.select span {
            position: absolute;
            top: auto;
            bottom: 10;
            right: 22px;
            line-height: 36px;
          }

		.searchschedules-content div.select div {
			background: #E2E2E2;
		}


        .searchschedules-content p.submit,
        .trackandtrace-content p.submit {
          padding: 0;
        }
        
          .searchschedules-content p.submit span,
          .trackandtrace-content p.submit span {
            top: 17px;
            right: 20px;
            -webkit-transition: all .25s ease-in-out;
            -o-transition: all .25s ease-in-out;
            -ms-transition: all .25s ease-in-out;
            transition: all .25s ease-in-out;
          }
          .searchschedules-content p.submit:hover span,
          .trackandtrace-content p.submit:hover span {
            color: #009FE3;
          }
          .searchschedules-content p.submit:hover input,
          .trackandtrace-content p.submit:hover input {
            background: #023064;
          }

        .searchschedules-content p label,
        .searchschedules-content div label,
        .trackandtrace-content p label,
        .trackandtrace-content div label {
          display: block;
          float: left;
          width: 100%;
          padding: 0 10px;
          background:white;
          /*font-family: montserrat;
          font-size: 90%;*/
        }
        .searchschedules-content p span,
        .trackandtrace-content p span,
        .trackandtrace-content div span  {
          position: absolute;
          right: 20px;
          top: 0;
          line-height: 50px;
        }
        .searchschedules-content p input,
        .searchschedules-content div input,
        .trackandtrace-content p input,
        .trackandtrace-content p select,
        .trackandtrace-content div input,
        .trackandtrace-content div select
        {
          display: block;
          font-family: lato, sans-serif;
          float: left;
          width: 100%;
          border: none;
          background: #E2E2E2;
          height: 36px;
          line-height: 36px;
          padding: 0 10px;
          -webkit-transition: all .25s ease-in-out;
          -o-transition: all .25s ease-in-out;
          -ms-transition: all .25s ease-in-out;
          transition: all .25s ease-in-out;
          -webkit-border:none;
          border:none;
          -webkit-border-radius:0;
          border-radius:0;
             color: #023064;
             font-size: 16px;
        }
        
        .searchschedules-content div input[type='text'].ui-autocomplete-input{
          display: block;
              font-family: lato, sans-serif;
          float: left;
          width: 100%;
          border: none;
          background: #E2E2E2;
          height: 36px;
          line-height: 36px;
          padding: 0 10px;
          border:none;
          -webkit-border-radius:0;
          border-radius:0;
          color:inherit;
            -webkit-transition: all .25s ease-in-out;
          -o-transition: all .25s ease-in-out;
          -ms-transition: all .25s ease-in-out;
          transition: all .25s ease-in-out;
              font-size: 16px;
        }
        
        .searchschedules-content div input[type='text'].ui-state-hover{
        	color:inherit;
        }
        
        .searchschedules-content p input.ui-state-hover,
        .searchschedules-content p input.ui-state-focus{
        	color:inherit;
        }
        
        span.ui-autocomplete {
        	width:100%;
        }
        
        
        
        div.ui-autocomplete-panel {
        	width:400px!important;
        }

		.ui-autocomplete-table td {
			 font-family: lato, sans-serif;
			 font-size:16px;
		} 

          .searchschedules-content div input[type=date],
          .trackandtrace-content div input[type=date]{
            padding: 8px 5px 8px 10px;
          }
          .searchschedules-content p input[type=number],
          .trackandtrace-content p input[type=number]{
            text-align: center;
          }
          .searchschedules-content p input[type=submit],
          .trackandtrace-content p input[type=submit],
          .searchschedules-content p button, 
          .trackandtrace-content p button
         {
          	width:100%;
            color: #FFFFFF;
            background: #009FE3;
            height: 50px;
            line-height: 50px;
            border-radius:0;
            -webkit-border-radius:0;
          }

		.searchschedules-content p button span,
        .trackandtrace-content p button span{
          	width:100%;
            color: #FFFFFF;
            height: 50px;
            line-height: 50px;
            border-radius:0;
            -webkit-border-radius:0;
          }
		

          
          .searchschedules-content p span.ui-autocomplete{
          	position:relative;
          	width:100%;
          	right:0;
          	top:0;
          }
          
          .searchschedules-content div.select {
          flex-grow:1;
          	flex-basis: auto;
    		margin-right: 10px;
          }
          
          .searchschedules-content div.date {
          	flex-grow:1;
          	flex-basis: auto;
    		margin-left: 10px;
          }
          
          .searchschedules-content div span.dateField{
          	position:relative;
          	width:calc(100% -50px);
          	right:0;
          	top:0;
          }
          
          .searchschedules-content p.submit span.ui-button-text,
           .trackandtrace-content p.submit span.ui-button-text{
          	position:relative;
          	right:0;
          	top:0;
          	    font-family: lato, sans-serif;
    		font-size: 16px;
    		font-weight: 300;
    		line-height: 1.6;
    		color:white;
    		padding-top: 12px;
    		transition:none;
    		-webkit-transition:none;
    
          }
          
          td span.flags{
          display:inline-block;
          vertical-align:baseline!important;
          	-webkit-transform:scale(1.25,1.25);
				transform:scale(1.25,1.25);
			-ms-transform:scale(1.25,1.25); /* IE 9 */
			-moz-transform:scale(1.25,1.25); /* Firefox */
			-webkit-transform:scale(1.25,1.25); /* Safari and Chrome */
			-o-transform:scale(1.25,1.25); /* Opera */
          }
          
          .jsfSelect {
          	min-width: 120px;
          	width:100%; 
          	padding-left:10px;
          	background:#E2E2E2;
          	    cursor: pointer;
          	        padding-top: 5px;
          }
          
          .jsfSelect select, option {
          	max-width:300px;
          }
          
          .searchschedules-content p button.button,
         .trackandtrace-content p button.button {
          	background:#009FE3;
          	  -webkit-transition: all .25s ease-in-out;
          -o-transition: all .25s ease-in-out;
          -ms-transition: all .25s ease-in-out;
          transition: all .25s ease-in-out;
          }
          
          .searchschedules-content p button.button.ui-state-hover,
          .trackandtrace-content p button.button.ui-state-hover{    
          -mox-box-shadow: none!important;
  			  -webkit-box-shadow: none!important;
    		box-shadow: none!important;
    		background: #023064!important;
    		
          }
          
          			
          
          
          .ui-state-hover {
          	box-shadow:none!important;
          	-webkit-box-shadow:none!imporant;
          }
          
          
          /* Load port div containing label and port lookup*/
          .loadPort{
          
          }
          
          /* discharge port div containing label and port lookup*/
          .dischargePort{
          	padding-top:10px;
          }
          
          .trackandtrace-content div.reference{
          	padding-top:10px;
          }
          
          div.searchDate {
          		background:white;
          	display: -webkit-flex; /* Safari */
  			display: flex;
  			-webkit-justify-content: space-between; /* Safari */
  			justify-content:         space-between;
  			padding-top:10px;
          }
          
          .ui-datepicker table {
          	font-size:12px!important;
          }
          
          #ui-datepicker-div {
          	left:0!important;
          	 width: 200px;
          }
          
          .ui-datepicker .ui-datepicker-title{
          	font-size:12px;
          }