.dx-stat-job-today, .dx-stat-job-total {
    font-size: 4em;
    color: #ff9800;
    font-family: 'Kanit', sans-serif;
    font-weight: 600;
    letter-spacing: 4px;
}

.dx-stat-shipper-num, .dx-stat-carrier-num, .dx-stat-route-num {
    font-size: 2em;
    color: #ff9800;
    font-family: 'Kanit', sans-serif;
    font-weight: 500;
    letter-spacing: 4px;
}

.css-slideshow {
position: relative;
max-width: 1140px;
height: 450px;
margin: 1em auto .5em auto;
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
font-weight: 300;
}
.css-slideshow figure {
margin: 0;
max-width: 1140px;
height: 450px;
background: #fff;
position: absolute;
}
.css-slideshow img {
-webkit-box-shadow: 0 0 2px #666;
box-shadow: 0 0 2px #666;
}
.css-slideshow figcaption {
position: absolute;
top: 5px;
color: #fff;
background: rgba(0,0,0, .3);
font-size: .8em;
padding: 8px 12px;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: alpha(opacity=0);
opacity: 0;
-webkit-transition: opacity .5s;
-moz-transition: opacity .5s;
-o-transition: opacity .5s;
-ms-transition: opacity .5s;
transition: opacity .5s;
}
.css-slideshow:hover figure figcaption {
-webkit-transition: opacity .5s;
-moz-transition: opacity .5s;
-o-transition: opacity .5s;
-ms-transition: opacity .5s;
transition: opacity .5s;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
filter: alpha(opacity=100);
opacity: 1;
}
.css-slideshow-attr {
max-width: 1140px;
text-align: right;
font-size: .7em;
font-style: italic;
}
.css-slideshow-attr a {
color: #666;
}
.css-slideshow figure:nth-child(1),.css-slideshow figure:nth-child(2),.css-slideshow figure:nth-child(3),.css-slideshow figure:nth-child(4),.css-slideshow figure:nth-child(5),.css-slideshow figure:nth-child(6),.css-slideshow figure:nth-child(7) {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: alpha(opacity=0);
opacity: 0;
}
.css-slideshow figure:nth-child(1) {
-webkit-animation: xfade 48s 42s infinite;
-moz-animation: xfade 48s 42s infinite;
-ms-animation: xfade 48s 42s infinite;
-o-animation: xfade 48s 42s infinite;
animation: xfade 48s 42s infinite;
}
.css-slideshow figure:nth-child(2) {
-webkit-animation: xfade 48s 36s infinite;
-moz-animation: xfade 48s 36s infinite;
-ms-animation: xfade 48s 36s infinite;
-o-animation: xfade 48s 36s infinite;
animation: xfade 48s 36s infinite;
}
.css-slideshow figure:nth-child(3) {
-webkit-animation: xfade 48s 30s infinite;
-moz-animation: xfade 48s 30s infinite;
-ms-animation: xfade 48s 30s infinite;
-o-animation: xfade 48s 30s infinite;
animation: xfade 48s 30s infinite;
}
.css-slideshow figure:nth-child(4) {
-webkit-animation: xfade 48s 24s infinite;
-moz-animation: xfade 48s 24s infinite;
-ms-animation: xfade 48s 24s infinite;
-o-animation: xfade 48s 24s infinite;
animation: xfade 48s 24s infinite;
}
.css-slideshow figure:nth-child(5) {
-webkit-animation: xfade 48s 18s infinite;
-moz-animation: xfade 48s 18s infinite;
-ms-animation: xfade 48s 18s infinite;
-o-animation: xfade 48s 18s infinite;
animation: xfade 48s 18s infinite;
}
.css-slideshow figure:nth-child(6) {
-webkit-animation: xfade 48s 12s infinite;
-moz-animation: xfade 48s 12s infinite;
-ms-animation: xfade 48s 12s infinite;
-o-animation: xfade 48s 12s infinite;
animation: xfade 48s 12s infinite;
}
.css-slideshow figure:nth-child(7) {
-webkit-animation: xfade 48s 6s infinite;
-moz-animation: xfade 48s 6s infinite;
-ms-animation: xfade 48s 6s infinite;
-o-animation: xfade 48s 6s infinite;
animation: xfade 48s 6s infinite;
}
.css-slideshow figure:nth-child(8) {
-webkit-animation: xfade 48s 0s infinite;
-moz-animation: xfade 48s 0s infinite;
-ms-animation: xfade 48s 0s infinite;
-o-animation: xfade 48s 0s infinite;
animation: xfade 48s 0s infinite;
}
@keyframes "xfade" {
 0% {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
   	filter: alpha(opacity=100);
   	opacity: 1;
 }
10.5% {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	opacity: 1;
}
12.5% {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: alpha(opacity=0);
	opacity: 0;
}
98% {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
   	filter: alpha(opacity=0);
   	opacity: 0;
 }
 100% {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
   	filter: alpha(opacity=100);
   	opacity: 1;
 }
}
@-moz-keyframes xfade {
 0% {
   filter: alpha(opacity=100);
   opacity: 1;
 }
10.5% {
	filter: alpha(opacity=100);
	opacity: 1;
}
12.5% {
	filter: alpha(opacity=0);
	opacity: 0;
}
 98% {
   filter: alpha(opacity=0);
   opacity: 0;
 }
 100% {
   filter: alpha(opacity=100);
   opacity: 1;
 }
}
@-webkit-keyframes "xfade" {
 0% {
   filter: alpha(opacity=100);
   opacity: 1;
 }
10.5% {
	filter: alpha(opacity=100);
	opacity: 1;
}
12.5% {
	filter: alpha(opacity=0);
	opacity: 0;
}
 98% {
   filter: alpha(opacity=0);
   opacity: 0;
 }
 100% {
   filter: alpha(opacity=100);
   opacity: 1;
 }
}
@-ms-keyframes "xfade" {
 0% {
   -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
 }
10.5% {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	opacity: 1;
}
12.5% {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: alpha(opacity=0);
	opacity: 0;
}
 98% {
   -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
 }
 100% {
   -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
 }
}
@-o-keyframes "xfade" {
 0% {
   filter: alpha(opacity=100);
   opacity: 1;
 }
10.5% {
	filter: alpha(opacity=100);
	opacity: 1;
}
12.5% {
	filter: alpha(opacity=0);
	opacity: 0;
}
 98% {
   filter: alpha(opacity=0);
   opacity: 0;
 }
 100% {
   filter: alpha(opacity=100);
   opacity: 1;
 }
}


#search-front-form {
	height: 380px;
    background-color: #fff;
}

#crossfade img {
    position: absolute;
	height: 100%;
	width: 100%;
    object-fit: cover;
    left: 0px;
    color: transparent;
    opacity: 0;
    z-index: 0;
    -webkit-backface-visibility: hidden;
    -webkit-animation: imageAnimation 30s linear infinite 0s;
    -moz-animation: imageAnimation 30s linear infinite 0s;
    -o-animation: imageAnimation 30s linear infinite 0s;
    -ms-animation: imageAnimation 30s linear infinite 0s;
    animation: imageAnimation 30s linear infinite 0s;
}

#crossfade img:nth-child(2)  {
    -webkit-animation-delay: 6s;
    -moz-animation-delay: 6s;
    -o-animation-delay: 6s;
    -ms-animation-delay: 6s;
    animation-delay: 6s;
}
#crossfade img:nth-child(3) {
    -webkit-animation-delay: 12s;
    -moz-animation-delay: 12s;
    -o-animation-delay: 12s;
    -ms-animation-delay: 12s;
    animation-delay: 12s;
}
#crossfade img:nth-child(4) {
    -webkit-animation-delay: 18s;
    -moz-animation-delay: 18s;
    -o-animation-delay: 18s;
    -ms-animation-delay: 18s;
    animation-delay: 18s;
}
#crossfade img:nth-child(5) {
    -webkit-animation-delay: 24s;
    -moz-animation-delay: 24s;
    -o-animation-delay: 24s;
    -ms-animation-delay: 24s;
    animation-delay: 24s;
}

@-webkit-keyframes imageAnimation {
    0% { opacity: 0;
    -webkit-animation-timing-function: ease-in; }
    8% { opacity: 1;
         -webkit-animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}

@-moz-keyframes imageAnimation {
    0% { opacity: 0;
    -moz-animation-timing-function: ease-in; }
    8% { opacity: 1;
         -moz-animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}

@-o-keyframes imageAnimation {
    0% { opacity: 0;
    -o-animation-timing-function: ease-in; }
    8% { opacity: 1;
         -o-animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}

@-ms-keyframes imageAnimation {
    0% { opacity: 0;
    -ms-animation-timing-function: ease-in; }
    8% { opacity: 1;
         -ms-animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}

@keyframes imageAnimation {
    0% { opacity: 0;
    animation-timing-function: ease-in; }
    8% { opacity: 1;
         animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}

#block-dxfront-front-search .container {
	width : 100%;
	margin : 0;
	padding : 0;
}

#crossfade {
	position: relative;
	height: 380px;
	width: 100%;
	margin:auto;
	overflow: hidden;
    -webkit-filter: brightness(0.65);
    filter: brightness(0.65);
}

#form-layer {
    position: relative;
	top: -380px;
	border: 0 !important;
	margin : 0 !important;
	padding : 0 !important;
	left: 0px;
  	height: 380px;
	color: #ff0000;
	opacity: 0.9;
    z-index: 1;
	width: 100%;
}
#route-search-front-from-wrapper {
	width: 100%;
  	height: 380px;
	text-align: center;
	display: table;
	font-family: 'Roboto','Kanit', sans-serif;
}

#block-dxfront-front-search {
    height: 380px;
}

#search-form {
	display: table-cell;
	vertical-align: middle;
}

#form-field-wrapper {
    display: block;
    padding: .5em;
}

#form-button-wrapper {
	display: -moz-groupbox;
}

.content-center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.dummy-clear {
	display: none;
}

#edit-search-front {
    font-size: 20px;
    height: 50px;
    background-color: #fd9800;
    border: 1px solid #fd8c00
}

#edit-search-front:hover, #edit-search-front:active {
    background-color: #f19000;
    border: 1px solid #e88b00;
}

.form-item-origin,
.form-item-destination,
.form-item-type {
	/* float: left;
	margin: 0 10px 0 0; */
}

#route-search-front-from-wrapper .form-group {
	width:100%;
}

#route-search-front-from-wrapper .form-item label {
	display: none;
}

#route-search-front-from-wrapper .form-control {
	font-size: 18px;
	height: 50px;
	line-height: 50px;
}

#search-title-wrapper {
    color: #fff;
    font-size: 48px;
    font-family: 'Roboto', 'Kanit', sans-serif;
}

#search-sub-title-wrapper {
	color: #fff;
	margin: 0 0 1rem;
}

#search-form-statistic-wrapper {
    float: left;
    margin-top: 1em;
    display: none;
}

.statistic-item {
	display: -moz-groupbox;
	background-color: #fff;
	/*margin: 0 10px 10px 0;*/
	padding: 1em 0;
	float:left;
}

.statistic-icon {
	display: table-cell;
	padding: 10px 5px;
}

.statistic-icon-image {
	height: 75px;
	width: 75px;
}

.statistic-text-number {
	color: #ff9800;
    font-size: 3em;
    font-weight: 600;
}

.statistic-text-unit {
	color: #888;
}

@media (max-width:1024px){


}

@media (max-width:800px){


}

@media (max-width:768px){



	#form-layer {
		top: -380px;
	}
	#search-title-wrapper {
		font-size: 50px;
		margin: 0 0 1rem;
	}

}

@media (max-width:640px){
	#crossfade {
		height: 380px;
	}
	#form-layer {
		height: 380px;
	}
	#route-search-front-from-wrapper {
	}

	#form-field-wrapper {
		display: -moz-groupbox;
	}

	#form-button-wrapper {
		display: -moz-groupbox;
		margin-bottom: 15px;
	}

	.dummy-clear {
		clear: both;
		display: block;
	}

	.form-item-origin,
	.form-item-destination,
	.form-item-type {
		float: left;
		margin: 0 10px 10px 0;
	}

	#search-title-wrapper {
		font-size: 40px;
		margin: 0 0 1rem;
	}

	.statistic-item {
		display: -moz-groupbox;
	}

}

@media (max-width:480px){




	#search-title-wrapper {
		font-size: 30px;
		margin: 0 0 1rem;
	}

}