html,
body {
	position: relative;
}

body {
	font-family: Montserrat, Arial, sans-serif;
	color: #424d54;
	font-size: 13px;
	font-weight: 300;
	-webkit-font-smoothing: antialiased;
	-webkit-text-size-adjust: 100%;
	overflow-x: hidden;
	overflow-y: scroll;
}

body,
li,
address {
	line-height: 22px
}

input,
button,
select,
textarea {
	font-family: Montserrat, Arial, sans-serif;
	font-size: 13px;
	font-weight: 300;
}

p {
	margin: 0 0 15px;
}

a {
	color: #222;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

a:hover,
a:focus {
	text-decoration: none;
}

ul,
li {
	padding: 0;
	margin: 0;
}

li {
	list-style: none;
}

.text_center {
	text-align: center;
}

.text_left {
	text-align: left;
}

.text_right {
	text-align: right;
}

.newsletter ::placeholder {
	color: #fff;
}

.item-service .button-Op1,
.item-news .button-Op1 {
	float: right
}

.clear {
	height: 60px;
}

.btn-border {
	border: solid 1px #f79423;
	padding: 6px 10px;
	border-radius: 4px;
}

/* ============================== Project style CSS ============================== */
main{
	position: relative;
	overflow: hidden;
	width: 100%;
}

main.page slider{
	display: inline-block;
	width: 100%
}

body.show-nav{
	overflow: hidden;
}

header {
	position: fixed;
	z-index: 11;
	top: 0;
	left: 0;
	width: 100%;
}

.top-header {
	position: relative;
	padding: 15px 0;
	background: #fff
}

.top-header:before {
	content: "";
	display: inline-block;
	border-bottom: solid 1px #16479e;
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 1px;
}

.top-header:after {
	content: "";
	background: url(../img/line1.svg) no-repeat;
	background-position: 0 62px;
	width: 244px;
	height: 150px;
	position: absolute;
	bottom: 1px;
	right: 0;
}

.top-header .logo {
	float: left
}

.top-header .logo h5 {
	text-transform: uppercase;
	margin-top: 10px;
	color: #16479e;
	font-weight: 700;

}

.menu {
	background: #16479e
}

.lang {
	position: absolute;
	right: 0;
	bottom: 0;
}

.search-wrapper {
	position: absolute;
	right: 0;
	display: inline-block;
}

.search-wrapper .input-holder {
	height: 50px;
	width: 50px;
	background: rgba(255, 255, 255, 0);
	border-radius: 6px;
	position: relative;
	transition: all 0.3s ease-in-out;
}

.search-wrapper.active .input-holder {
width: 300px;
    border-radius: 50px;
    background: rgb(255 255 255);
    border: solid 1px #d0d2d3;
    transition: all .5s cubic-bezier(0.000, 0.105, 0.035, 1.570);
}

.search-wrapper .input-holder .search-input {
	width: 100%;
	height: 50px;
	padding: 0px 70px 0 20px;
	opacity: 0;
	position: absolute;
	top: 0px;
	left: 0px;
	background: transparent;
	box-sizing: border-box;
	border: none;
	outline: none;
	font-family: "Open Sans", Arial, Verdana;
	transform: translate(0, 60px);
	transition: all .3s cubic-bezier(0.000, 0.105, 0.035, 1.570);
	transition-delay: 0.3s;
}

.search-wrapper.active .input-holder .search-input {
	opacity: 1;
	transform: translate(0, 0);
}

.search-wrapper .input-holder .search-icon {
	width: 48px;
	height: 48px;
	border: none;
	border-radius: 50px;
	background: #16479e;
	padding: 0px;
	outline: none;
	position: relative;
	z-index: 2;
	float: right;
	cursor: pointer;
	transition: all 0.3s ease-in-out;
}

.search-wrapper .input-holder .search-icon span {
	width: 22px;
	height: 22px;
	display: inline-block;
	vertical-align: middle;
	position: relative;
	transform: rotate(45deg);
	transition: all .4s cubic-bezier(0.650, -0.600, 0.240, 1.650);
}

.search-wrapper.active .input-holder .search-icon span {
	transform: rotate(-45deg);
}

.search-wrapper .input-holder .search-icon span::before,
.search-wrapper .input-holder .search-icon span::after {
	position: absolute;
	content: '';
}

.search-wrapper .input-holder .search-icon span::before {
	width: 4px;
	height: 11px;
	left: 9px;
	top: 18px;
	border-radius: 2px;
	background: #fff;
}

.search-wrapper .input-holder .search-icon span::after {
	width: 21px;
	height: 21px;
	left: 0px;
	top: 0px;
	border-radius: 16px;
	border: 4px solid #fff;
}

.search-wrapper .close {
	position: absolute;
	z-index: 1;
	top: 12px;
	right: 20px;
	width: 25px;
	height: 25px;
	cursor: pointer;
	transform: rotate(-180deg);
	transition: all .3s cubic-bezier(0.285, -0.450, 0.935, 0.110);
	transition-delay: 0.2s;
}

.search-wrapper.active .close {
	right: 58px;
	transform: rotate(45deg);
	transition: all .6s cubic-bezier(0.000, 0.105, 0.035, 1.570);
	transition-delay: 0.5s;
}

.search-wrapper .close::before,
.search-wrapper .close::after {
	position: absolute;
	content: '';
	background: #ec0d15;
	border-radius: 2px;
}

.search-wrapper .close::before {
	width: 3px;
	height: 24px;
	left: 11px;
	top: 0px;
}

.search-wrapper .close::after {
	width: 25px;
	height: 3px;
	left: 0px;
	top: 11px;
}

header .logo a img {
	width: 120px;
}

header .menu ul li {
    display: inline-block;
    list-style: none;
    float: left;
    border-bottom: solid 2px #f7942300;
    transition: all 0.4s;
}

header .menu ul li a {
	text-decoration: none;
	display: block;
	padding: 14px 11px;
	text-transform: uppercase;
	color: #fff
}

header .menu ul li ul.submenu {
	background-color: #65c2ed;
	display: none;
	position: absolute;
	width: 150px;
	-moz-box-shadow: 0 1px 1px 2px rgba(0, 0, 0, 0.05);
	-webkit-box-shadow: 0 1px 1px 2px rgba(0, 0, 0, 0.05);
	box-shadow: 0 1px 1px 2px rgba(0, 0, 0, 0.05);
}

header .menu ul li ul.submenu li {
	display: block;
	width: 100%;
}

header .menu ul li ul.submenu li a {
	color: #fff;
	line-height: 25px;
	padding: 10px 27px;
}

header .menu ul li ul.submenu li a:hover {
	color: #fff;
	background-color: #000;
}

header .menu ul li:hover {
	border-bottom: solid 2px #f79423;
}

header .menu ul li:hover a {
	color: #f79423
}

header .menu ul li:hover ul.submenu {
	display: block;
}

header .menu ul li i.icon-arrow {
	display: none;
}

#transition-body {
    position: relative;
    width: 100%;
    height: 100%;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    -webkit-transition: -webkit-transform 0.33s cubic-bezier(0.694, 0.0482, 0.335, 1);
    transition: -webkit-transform 0.33s cubic-bezier(0.694, 0.0482, 0.335, 1);
}

#elmobile {
	position: fixed;
	overflow-y: hidden;
	top: 0;
	right: -400px;
	width: 400px;
	height: 100%;
	background: #33333399;
}

body.show-nav #elmobile {
	max-width: 100%;
	border-left: 1px solid white;
}

.navholder--utility {
	display: none;
}

@media only screen and (min-width: 768px) {
	.navholder--utility {
		display: block;
		background-color: #333;
	}

	.navholder--utility nav {
		float: left;
		display: inline-block;
	}

	.navholder--utility .nav--social {
		float: right;
		display: inline-block;
	}
}

.navholder--main {
	display: none;
}

@media only screen and (min-width: 768px) {
	.navholder--main {
		display: block;
		background-color: #666;
	}
}

.nav--utility .elm__link {
	text-transform: none;
	color: #999;
}

.nav--utility .elm__link:visited {
	color: #999;
}

.nav--utility .elm__link:hover,
.nav--utility .elm__link:active,
.nav--utility .elm__link:focus {
	color: white;
}

.nav--social .elm__link {
	text-transform: none;
	color: #999;
}

.nav--social .elm__link:visited {
	color: #999;
}

.nav--social .elm__link:hover,
.nav--social .elm__link:active,
.nav--social .elm__link:focus {
	color: white;
}

.nav--main .elm__link--sub {
	color: white;
	background-color: #666;
}

.nav--main .elm__link--sub:visited {
	color: white;
	background-color: #666;
}

.nav--main .elm__link--sub:hover,
.nav--main .elm__link--sub:active,
.nav--main .elm__link--sub:focus {
	color: white;
	background-color: #7a7a7a;
}

.nav--main .elm__link--subsub {
	min-width: 200px;
	color: white;
	background-color: #7a7a7a;
}

.nav--main .elm__link--subsub:visited {
	color: white;
	background-color: #7a7a7a;
}

.nav--main .elm__link--subsub:hover,
.nav--main .elm__link--subsub:active,
.nav--main .elm__link--subsub:focus {
	color: white;
	background-color: #8f8f8f;
}

.nav--main .elm__item--sub:hover>a {
	background-color: #7a7a7a;
}

body.show-nav #transition-body {
	-webkit-transform: translateX(-400px);
	transform: translateX(-400px);
}

.elmtoggle__holder,
.elmtoggle__holder--mobile {
	display: block;
	width: 100%;
	text-align: right;
	padding: 1rem 1rem .75rem 1rem;
}

.elmtoggle__holder--mobile {
background-color: #223f99;
}

.logo-mobile{
    width: 134px;
    float: left;	
}

@media only screen and (min-width: 991px) {
	.elmtoggle__holder, .menu .lang{
		display: none;
	}
}

@media only screen and (max-width: 991px) {
	header .logo a img {
		width: 90px;
	}
	
	.top-header .logo h5 {
		width: 75%;
	}
	
	.nav-menu, .top-header .lang {
		display: none;
	}

	.menu-wrapper .search-wrapper{
		right: 70px;
		top: 2px;
	}
	
	.lang {
		right: initial;
		left: 0;
	}
	
	.bootstrap-select>.btn, .bootstrap-select.open>.dropdown-toggle.btn-default {
		color: #fff
	}
}

.elmtoggle__holder a {
	text-decoration: none;
}

.elmtoggle__icon {
	width: auto;
	height: 1.5rem;
	display: inline-block;
	vertical-align: top;
}

.elm__link {
	display: block;
	padding: 1.25rem 1rem;
	text-decoration: none;
}

.elm__link--sub {
	display: block;
	padding: 1.25rem 1rem;
	text-decoration: none;
}

.elm__list--sub {
	display: none;
	text-align: left;
}

.elm__item.hassub:hover .elm__list--sub {
	display: block;
}

.elm__item.hassub {
	position: relative;
}

.elm__item.hassub .elm__list--sub {
	position: absolute;
	top: 100%;
	left: 0;
	width: auto;
}

.elm__item--sub {
	width: 100%;
}

.elm__link--sub {
	display: block;
	padding: 1.25rem 1rem;
	white-space: nowrap;
}

.elm__link--subsub {
	display: block;
	padding: 1.25rem 1rem;
	text-decoration: none;
}

.elm__list--subsub {
	display: none;
	text-align: left;
}

.elm__item--sub.hassubsub:hover .elm__list--subsub {
	display: block;
}

.elm__item--sub.hassubsub {
	position: relative;
}

.elm__item--sub.hassubsub .elm__list--subsub {
	position: absolute;
	top: 0;
	left: 100%;
	width: auto;
}

.elm__item--subsub {
	width: 100%;
}

.elm__link--subsub {
	display: block;
	padding: 1.25rem 1rem;
	white-space: nowrap;
}

/**
 * --------------------------------- The mobile menu styles
 */
.m-elm__list,
.m-elm__list--sub,
.m-elm__list--subsub {
	list-style: none;
	text-align: left;
	padding-left: 0;
}

.m-elm__link,
.m-elm__link--sub,
.m-elm__link--subsub {
	color: white;
}

.m-elm__link:visited,
.m-elm__link--sub:visited,
.m-elm__link--subsub:visited {
	color: white;
}

.m-elm__link:hover,
.m-elm__link:active,
.m-elm__link:focus,
.m-elm__link--sub:hover,
.m-elm__link--sub:active,
.m-elm__link--sub:focus,
.m-elm__link--subsub:hover,
.m-elm__link--subsub:active,
.m-elm__link--subsub:focus {
	color: white;
}

.m-elm__list {
	display: block;
	margin: 0;
}

.m-elm__item {
	border-bottom: 1px solid white;
}

.m-elm__link {
	display: block;
	padding: .85rem 1rem;
	text-decoration: none;
}

.m-elm__list--sub {
	display: none;
	margin: 0;
}

.m-elm__item--sub {
	border-bottom: 1px solid white;
}

.m-elm__item--sub:first-of-type {
	border-top: 1px solid white;
}

.m-elm__item--sub:last-of-type {
	border-bottom: none;
}

.m-elm__link--sub {
	display: block;
	padding: .85rem 1rem;
	text-decoration: none;
	border-left: 10px solid orange;
}

.m-elm__list--subsub {
	display: none;
	margin: 0;
}

.m-elm__item--subsub {
	border-bottom: 1px solid white;
}

.m-elm__item--subsub:first-of-type {
	border-top: 1px solid white;
}

.m-elm__item--subsub:last-of-type {
	border-bottom: none;
}

.m-elm__link--subsub {
	display: block;
	padding: .85rem 1rem;
	text-decoration: none;
	border-left: 20px solid orange;
}

[class^="elmtrigger"] {
	cursor: pointer;
	text-align: center;
	margin: 0;
	padding: 0;
}

[class^="elmtrigger"] img {
	margin-left: auto;
	margin-right: auto;
	padding: 0;
	display: inline-block;
	vertical-align: middle;
	width: auto;
	height: .75rem;
	-ms-transform: rotate(0deg);
	-webkit-transform: rotate(0deg);
	transform: rotate(0deg);
}

[class^="elmtrigger"] img.rotate {
	-ms-transform: rotate(180deg);
	-webkit-transform: rotate(180deg);
	transform: rotate(180deg);
	-webkit-animation: spin 4s linear infinite;
	-moz-animation: spin 4s linear infinite;
	animation: spin 4s linear infinite;
}

.m-elm__item.hassub {
	background-color: orange;
}

.m-elm__item.hassub a {
	background-color: #333;
}

.m-elm__item--sub.hassubsub {
	background-color: orange;
}

.m-elm__item--sub.hassubsub a,
.m-elm__link--sub {
	background-color: #4d4d4d;
}

.m-elm__item--subsub,
.m-elm__link--subsub {
	background-color: #666666;
}

.hassub>.m-elm__link,
.hassubsub>.m-elm__link--sub {
	border-right: 1px solid white !important;
}

.hassub .m-elm__link,
.hassubsub .m-elm__link--sub {
	display: inline-block;
	width: 84%;
}

[class^="elmtrigger"] {
	display: inline-block;
	width: 16%;
	text-align: center;
}

code[class*="language-"],
pre[class*="language-"] {
	color: black;
	background: none;
	text-shadow: 0 1px white;
	font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
	text-align: left;
	white-space: pre;
	word-spacing: normal;
	word-break: normal;
	word-wrap: normal;
	line-height: 1.5;
	-moz-tab-size: 4;
	-o-tab-size: 4;
	tab-size: 4;
	-webkit-hyphens: none;
	-moz-hyphens: none;
	-ms-hyphens: none;
	hyphens: none;
}

pre[class*="language-"]::-moz-selection,
pre[class*="language-"] ::-moz-selection,
code[class*="language-"]::-moz-selection,
code[class*="language-"] ::-moz-selection {
	text-shadow: none;
	background: #b3d4fc;
}

pre[class*="language-"]::selection,
pre[class*="language-"] ::selection,
code[class*="language-"]::selection,
code[class*="language-"] ::selection {
	text-shadow: none;
	background: #b3d4fc;
}

@media print {

	code[class*="language-"],
	pre[class*="language-"] {
		text-shadow: none;
	}
}

/* Code blocks */
pre[class*="language-"] {
	padding: 1em;
	margin: .5em 0;
	overflow: auto;
}

:not(pre)>code[class*="language-"],
pre[class*="language-"] {
	background: #f5f2f0;
}

/* Inline code */
:not(pre)>code[class*="language-"] {
	padding: .1em;
	border-radius: .3em;
	white-space: normal;
}

.token.comment,
.token.prolog,
.token.doctype,
.token.cdata {
	color: slategray;
}

.token.punctuation {
	color: #999;
}

.namespace {
	opacity: .7;
}

.token.property,
.token.tag,
.token.boolean,
.token.number,
.token.constant,
.token.symbol,
.token.deleted {
	color: #905;
}

.token.selector,
.token.attr-name,
.token.string,
.token.char,
.token.builtin,
.token.inserted {
	color: #690;
}

.token.operator,
.token.entity,
.token.url,
.language-css .token.string,
.style .token.string {
	color: #a67f59;
	background: rgba(255, 255, 255, 0.5);
}

.token.atrule,
.token.attr-value,
.token.keyword {
	color: #07a;
}

.token.function {
	color: #DD4A68;
}

.token.regex,
.token.important,
.token.variable {
	color: #e90;
}

.token.important,
.token.bold {
	font-weight: bold;
}

.token.italic {
	font-style: italic;
}

.token.entity {
	cursor: help;
}

/*---- Menu -------*/
/*------- Content ****/
.padding-LR {
	padding: 100px 0;
	width: 70%;
	display: inline-block;
}

.title-border {
	position: relative;
	text-transform: uppercase;
	color: #f08d37;
	margin: 0 0 50px 0;
	line-height: normal;
	text-align: center
}

.title-border:before {
	content: "";
	position: absolute;
	bottom: -10px;
	width: 150px;
	border-bottom: solid 2px #F79420;
	left: 50%;
	margin-left: -75px;
}

p.title-border {
	position: relative;
	text-transform: inherit;
	color: #424d54;
	margin: -30px 0 30px 0;
}

p.title-border:before {
	content: "";
	display: none;
}

.button-Op1 {
	position: relative;
	display: inline-block;
	z-index: 1;
}

.button-Op1 a {
	padding: 10px 50px 10px 24px;
	color: #F79420;
	font-size: 13px;
	text-transform: uppercase;
}

.button-Op1:after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	display: inline-block;
	border-bottom: solid 1px #d0d2d3;
	width: 100%;
	height: 1px;
	margin-top: 10px;
	background: #fff;
	transform-origin: left 50%;
	-moz-transition: all 1200ms cubic-bezier(0.16, 0.01, 0.77, 1);
	-o-transition: all 1200ms cubic-bezier(0.16, 0.01, 0.77, 1);
	-webkit-transition: all 1200ms cubic-bezier(0.16, 0.01, 0.77, 1);
	transition: all 1200ms cubic-bezier(0.16, 0.01, 0.77, 1);
	moz-transform: scaleX(0);
	-ms-transform: scaleX(0);
	-webkit-transform: scaleX(0);
	transform: scaleX(0);
	-moz-transform-origin: top left;
	-ms-transform-origin: top left;
	-webkit-transform-origin: top left;
	transform-origin: top left;
}

.button-Op1:before {
	content: "";
	background: url(../img/line1.svg) no-repeat;
	position: absolute;
	right: 0;
	bottom: 0px;
	width: 40px;
	height: 24px;
}

.back-service {
	background: #21409A;
	color: #fff;
	position: relative;
	overflow: hidden;
	z-index: 1;
}


.back-service:after {
	content: "";
	background: url(../img/pattern1.png) no-repeat;
	position: absolute;
	background-size: 100%;
	width: 600px;
	height: 670px;
	top: 50%;
	margin-top: -280px;
	left: 50%;
	margin-left: -300px;
	z-index: -1;
	opacity: .2;
}

.wrap-service .owl-carousel .owl-nav {
	margin: 0
}

.wrap-service .owl-carousel .owl-nav button span {
	width: 42px;
	height: 42px;
	border: solid 1px #fff;
	display: inline-block;
	color: #fff;
	line-height: 34px;
	font-size: 40px;
	background: #3333337a;
}

.wrap-service .owl-carousel .owl-nav button.owl-prev,
.wrap-service .owl-carousel .owl-nav button.owl-next {
	position: absolute;
	top: 50%;
	margin: 0;
	margin-top: -21px;
	left: 15px;
	z-index: 1;
}

.wrap-service .owl-carousel .owl-nav button.owl-next {
	position: absolute;
	left: inherit;
	right: 15px;
}

.title-width {
	width: 100%;
	display: inline-block
}

.title-width .title-border {
	text-align: left
}

.title-width .title-border:before {
	left: 0;
	margin-left: 0;
}

.owl-carousel .item i,
.item figcaption .button-Op1 {
	float: right;
	color: #d0d2d3;
}

.owl-carousel .img-responsive {
	position: relative
}

.owl-carousel .cont-position h4 {
	margin-bottom: 20px
}

.owl-carousel .cont-position h4 a {
	font-size: 26px;
	color: #ffffff;
	font-weight: 700;
}

.owl-carousel .cont-position {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	padding: 2em;
	color: #fff;
	text-transform: uppercase;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transition: -webkit-transform 0.35s;
	transition: transform 0.35s;
	-webkit-transform: translate3d(0, 100%, 0);
	transform: translate3d(0, 100%, 0);
	opacity: 0;
	-webkit-transition: opacity 0.35s;
	transition: opacity 0.35s;
	-webkit-backface-visibility: hidden;
}

.owl-carousel .item:hover .cont-position {
	opacity: 1;
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
}

.carousel-inner .item:hover .cont-position a {
	color: #fff
}

.carousel-inner .item:hover .cont-position .button-Op1 {
	margin-top: 60px;
}

#carousel-service .item {
	border: solid 1px #fff
}

.media-img {
	overflow: hidden;
	position: relative;
	display: inline-block
}

.carousel .carousel-dots-container .carousel-dot.active {
	opacity: 1;
	width: 16px;
	height: 2px;
	margin-top: 2px;
	transition: opacity 275ms ease-out;
}

.carousel .carousel-dots-container .carousel-dot {
	border-radius: 0;
	height: 1px;
	margin: 3px 3px;
	width: 8px;
	transition: opacity 275ms ease-out;
}


/*------- wrap-newsletter ****/
.wrap-newsletter {
	background: #21409A;
	color: #fff;
	position: relative;
	padding: 60px 0;
}

.input-subscribefrm {
	position: relative;
	width: 100%;
}

.input-subscribefrm>input {
	display: block;
	width: 100%;
	height: calc(3.25rem + -14px);
	padding: 10px;
	font-size: 13px;
	line-height: 14px;
	transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
	float: left;
	background: 0;
	border-radius: 0;
	border: 1px #fff solid;
	color: #fff;
	outline: none;
}

.input-subscribebutton {
	right: 0;
	position: absolute;
	top: 0;
	border: solid 1px #fff;
}

.input-subscribebutton input {
	border: 0;
	padding: 7px 20px;
	color: #fff;
	background: #f79423;
	cursor: pointer;
}

.social-icons ul li {
	float: left;
	margin-right: 15px
}

.social-icons ul li a {
	width: 42px;
	height: 42px;
	display: inline-block;
	text-align: center;
	line-height: 40px;
	border: solid 1px #fff;
	border-radius: 50px;
	font-size: 16px;
	background: 0;
	color: #fff;
	transition: all 0.5s;
}

.social-icons ul li:hover a {
	border: solid 1px #F79420;
	background: #F79420;
}

.title-width.social-icons {
	width: initial;
	display: inline-block;
	float: right;
}

/*------- .wrap-newsletter ****/

/*------- Footer ****/
.main-footer {
	padding: 80px 0
}

.main-footer .title-border {
	text-align: left
}

.main-footer .title-border:before {
	left: 0;
	margin-left: 0px;
	width: 80px
}

.main-footer ul li {
	margin: 0 0 10px 0
}

.main-footer ul li:hover a {
	color: #F79420
}


#logo-carousel {
	padding-top: 60px
}

.nav-footer {
	padding: 10px 0;
	background: #f79423
}

.nav-footer ul li {
	float: left
}

.nav-footer ul li:nth-child(1) {
	width: 50%
}

.nav-footer ul li:nth-child(2) {
	width: 25%;
	text-align: right
}

.nav-footer ul li:nth-child(3) {
	width: 25%;
	text-align: right
}

.nav-footer ul li a,
.nav-footer ul li span {
	color: #fff
}

/*------- .Footer ****/


.banner-page {
	width: 100%;
	height: 290px;
	padding: 168px 0 48px 0;
	position: relative;
	z-index: 1;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
	text-align: center;
	margin-top: 192px;
}

.banner-page:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	width: 100%;
	height: 100%;
	background-image: linear-gradient(360deg, rgba(0, 0, 0, 0.79) 0%, rgba(255, 255, 255, 0) 58%);
}

.banner-page h2 {
	color: #fff;
	font-weight: bold;
	letter-spacing: 0.040em;
	font-size: 40px;
	position: relative;
}

.banner-page a {
	color: #fff
}

.banner-page p.breadcrumb {
	background: 0;
	font-size: 16px;
	text-transform: uppercase;
	color: #fff;
	letter-spacing: 0.075em;
	margin: 0;
	padding: 0;
}

.banner-page p.breadcrumb span {
	background-image: url(../img/diagonal-lines.png);
	background-repeat-x: repeat;
	background-position: right;
	height: 50px;
	padding: 4px 10px;
}

.banner-page i {
	font-style: normal;
	color: #f79423;
	border-radius: 4px;
}


.wrap-video {
	position: relative;
	padding: 60px 0;
	background: url(../img/back-video-about.jpg) no-repeat center;
	width: 100%;
	height: 367px;
	text-align: center;
}

.wrap-video:after {
	position: absolute;
	padding: 60px 0;
}

.circle {
	stroke: #f79420;
	stroke-dasharray: 650;
	stroke-dashoffset: 650;
	-webkit-transition: all 0.5s ease-in-out;
	opacity: 0.3;
}

.playBut {
	display: inline-block;
	-webkit-transition: all 0.5s ease;
	background: 0;
}

.playBut .triangle {
	-webkit-transition: all 0.7s ease-in-out;
	stroke-dasharray: 240;
	stroke-dashoffset: 480;
	stroke: #f79420;
	transform: translateY(0);
}

.playBut:hover .triangle {
	stroke-dashoffset: 0;
	opacity: 1;
	stroke: #f79420;
	animation: nudge 0.7s ease-in-out;
}

@keyframes nudge {
	0% {
		transform: translateX(0);
	}

	30% {
		transform: translateX(-5px);
	}

	50% {
		transform: translateX(5px);
	}

	70% {
		transform: translateX(-2px);
	}

	100% {
		transform: translateX(0);
	}
}

.playBut:hover .circle {
	stroke-dashoffset: 0;
	opacity: 1;
}

.wrap-video .playBut {
    cursor: pointer;
    border: none;
    display: inline-block;
    -webkit-transition: all 0.5s ease;
    background: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -42px;
    margin-top: -30px;
}

.wrap-video .playBut svg:not(:root) {
	overflow: hidden;
	background: #ffffff9c;
	border: solid 1px #f79420;
	border-radius: 100px;
}

.wrap-video .stroke-solid {
	stroke-dashoffset: 0;
	stroke-dashArray: 300;
	stroke-width: 4px;
	transition: stroke-dashoffset 1s ease, opacity 1s ease;
}

.wrap-video .icon {
	transform: scale(0.8);
	transform-origin: 50% 50%;
	transition: transform 200ms ease-out;
}

.wrap-video #play:hover .stroke-solid {
	opacity: 1;
	stroke-dashoffset: 300;
}

.wrap-video #play:hover .icon {
	transform: scale(0.9);
}

.wrap-video #play {
	cursor: pointer;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateY(-50%) translateX(-50%);
}

.wrap-service,
.wrap-news,
.wrap-media,
.wrap-contact {
	margin: 100px 0;
}

.wrap-careers {
	margin: 100px 0 0 0;
	position: relative
}

.box-border {
	border: solid #d0d2d3 1px;
	padding: 30px;
	position: relative;
	overflow: hidden;
	margin-bottom: 60px
}

.box-border:after {
	content: "";
	background: url(../img/line1.svg) no-repeat;
	background-position: 0 36px;
	width: 135px;
	height: 85px;
	position: absolute;
	bottom: 0;
	right: -100px;
	opacity: 0;
	transition: all 0.6s;
}

.box-border:hover:after {
	content: "";
	right: 0px;
	opacity: 1;
}

.box-border .title-border {
	text-align: left;
}

.box-border .title-border:before {
	content: "";
	width: 40px;
	left: 0;
	margin-left: 0;
}

.item-service,
.item-news,
.item-gallery-video,
.list-careers ul.text-center li {
	display: inline-block;
	width: calc(33.333% - 128px);
	margin: 0 15px 30px 15px;
	overflow: hidden;
	text-align: left;
	padding-bottom: 10px;
}

.list-careers ul.text-center li {
	width: calc(50% - 32px);
	border: solid 1px #fff;
	padding: 15px 15px 0 15px;
	transition: all 0.6s;
	background: #ffffff87
}

.item-gallery-video {
	width: calc(33% - 30px);
	margin: 0 15px 30px 15px;
}

.img-service img {
	width: 100%;
}

.wrap-criteria {
	position: relative;
	padding: 0 0 30px 0;
}

.wrap-criteria .box-back {
	position: relative;
	padding: 30px;
}

.wrap-criteria .box-back:hover {
	background: #fcfcfc;
	box-shadow: 0px 1px 5px 1px #d2d2d2;
	transition: all 0.5s
}

.wrap-criteria:after {
	content: "";
	background: url(../img/line1.svg) no-repeat;
	background-position: 0 170px;
	width: 618px;
	height: 432px;
	opacity: .5;
	position: absolute;
	z-index: -1;
	bottom: 0;
	right: 0;
}

.wrap-criteria .title-border {
	text-align: left
}

.wrap-criteria .title-border:before {
	border: 0
}

.title-border-left {
	position: relative;
	padding-left: 100px;
}

.title-border-left:after {
	content: "";
	position: absolute;
	border: solid 1px #f79423;
	top: 10px;
	width: 80px;
	left: 0;
}

.item-cont-DV {
	display: inline-block;
	width: calc(33.333% - 128px);
	margin: 0 15px 30px 15px;
	overflow: hidden;
}

.wrap-criteria .box-border {
	border: 0
}

.wrap-cont-DV {
	background: #e8e9e9;
	padding: 60px 0;
}

.wrap-cont-DV .border-height {
	border-right: solid 1px #797979;
	text-align: left;
}

.wrap-cont-DV .item-cont-DV:last-child .border-height {
	border-right: 0;
}

.wrap-cont-DV .border-height span {
	text-align: center;
	line-height: 27px;
	font-size: 14px;
	width: 30px;
	height: 30px;
	border: solid 1px #f79423;
	border-radius: 50px;
	background: 0;
	color: #f79423;
	margin-right: 6px;
	transition: all 0.5s;
}

.wrap-cont-DV .border-height:hover span {
	background: #f79423;
	color: #fff;
}

.wrap-cont-DV .border-height:hover a {
	color: #f79423;
}

.wrap-media .nav-pills li a {
	padding: 4px 15px;
	border-right: solid 1px #999;
}

.wrap-media .tab-content {
	display: inline-block;
	margin-top: 30px;
	width: 100%;
}

.wrap-media .nav-tabs {
	border: 0
}

.wrap-media .nav-pills li:last-child a {
	border: 0
}

.wrap-media .nav-pills li.active a {
	color: #f79423;
}

.accordion {
	text-align: left
}

.accordion .panel_heading .title-border {
	text-align: left;
	margin-bottom: 30px;
	color: #f18d37;
	cursor: pointer
}

.accordion .panel_default .panel_heading.collapsed .title-border {
	color: #222;
}

.accordion .panel_default:hover .panel_heading .title-border {
	color: #f18d37
}

.accordion .panel_heading .title-border:before,
.accordion .panel_default:hover .panel_heading .title-border:before {
	border-bottom: solid 2px #F79420;
	left: 0;
	margin: 0;
	width: 80px;
}

.accordion .panel_heading.collapsed .title-border:before {
	width: 80px;
	left: 0;
	margin-left: 0;
	bottom: -31px;
	border-bottom: solid 2px #d0d2d3;
}

.panel_heading .panel_title {
	display: inline-block;
	position: relative;
	margin: 0;
	padding: 0;
	width: 100%;
	vertical-align: top;
}

.panel_heading .panel_title i {
	position: absolute;
	top: 2px;
	right: -10px;
	transform: translate(-10px, 0);
	display: inline-block;
	cursor: pointer;
	width: 20px;
	height: 20px;
	text-align: center;
}

.accordion .panel_heading i:before,
.accordion .panel_heading i:after {
	content: "";
	position: absolute;
	width: 1px;
	height: 12px;
	transition: all 0.5s ease-in-out;
	transform: translate(4px, 0) rotate(45deg);
}

.accordion .panel_heading i:before {
	transform: translate(-4px, 0) rotate(45deg);
	background-color: #f7941d;
}

.accordion .panel_heading i:after {
	transform: translate(4px, 0) rotate(-45deg);
	background-color: #f7941d;
}

.accordion .panel_heading.collapsed i:before {
	transform: translate(4px, 0) rotate(45deg);
	background-color: #424d54;
}

.accordion .panel_heading.collapsed i:after {
	transform: translate(-4px, 0) rotate(-45deg);
	background-color: #424d54;
}

.popup-gallery li {
	display: inline-block;
	width: calc(25% - 23px);
	margin: 0 7px 30px 7px;
	overflow: hidden;
	position: relative
}

.popup-gallery li .media-img:after,
#gallery-video li .media-img:after {
	content: "";
	display: flex;
	flex-direction: column;
	justify-content: center;
	height: 100%;
	position: absolute;
	width: 100%;
	top: 0;
	left: 0;
	transition: transform 300ms;
	transform: translate3d(0, calc(100% - 3.5rem), 0);
	background-image: linear-gradient(360deg, rgba(0, 0, 0, 0.79) 0%, rgba(255, 255, 255, 0) 58%);
}

.popup-gallery .media-img img {
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	-webkit-transform: scale(1.15);
	transform: scale(1.15);
}

.popup-gallery li:hover .media-img img {
	-webkit-transform: scale(1);
	transform: scale(1);
}

#gallery-video li:after {
	content: "";
	display: none
}

li .media-img:before {
	content: "";
	display: inline-block;
	background: url(../img/icon-hinh.png) no-repeat center;
	border-radius: 50px;
	border: solid 1px #fff;
	width: 40px;
	height: 40px;
	position: absolute;
	left: 50%;
	margin: -20px 0 0 -20px;
	top: 50%;
	z-index: 1;
	transition: all .5s;
	transition: all .5s ease-in-out;
	opacity: 0;
	cursor: pointer;
}

#gallery-video li .media-img:before {
	background: url(../img/icon-video.png) no-repeat center;
}

li:hover .media-img:before,
#gallery-video li:hover .media-img:before {
	background-color: #f79423;
	transform: rotate(180deg);
	content: "";
	opacity: 1
}

li:hover .media-img:after,
#gallery-video li:hover .media-img:after {
	transform: translate3d(0, 0, 0);
}

.popup-gallery li:hover img {
	transform: scale(1.25) translateY(-10%);
}

.item-gallery-video .media-img i {
	position: absolute;
	left: 15px;
	bottom: 10px;
	color: #fff;
	z-index: 1;
	letter-spacing: 0.1em;
}

.scrtabs-tab-container .nav-tabs {
	display: inline-block
}

.scrtabs-tab-container .nav-tabs>li>a {
	color: #222;
	font-size: 18px;
	text-align: center;
	text-transform: uppercase;
	font-weight: 700;
}

.scrtabs-tab-container .nav-tabs>li.active>a {
	color: #f18d37;
}

.scrtabs-tabs-fixed-container {
	float: left;
	height: 42px;
	overflow: hidden;
	width: 100%;
}

.scrtabs-tabs-movable-container {
	position: relative;
}

.scrtabs-tabs-movable-container .tab-content {
	display: none;
}

.scrtabs-tab-container.scrtabs-rtl .scrtabs-tabs-movable-container>ul.nav-tabs {
	padding-right: 0;
}

.scrtabs-tab-scroll-arrow {
	border: 1px solid #dddddd;
	border-top: none;
	color: #428bca;
	cursor: pointer;
	display: none;
	float: left;
	font-size: 12px;
	height: 42px;
	margin-bottom: -1px;
	padding-left: 2px;
	padding-top: 13px;
	width: 20px;
}

.scrtabs-tab-scroll-arrow:hover {
	background-color: #eeeeee;
}

.scrtabs-tab-scroll-arrow.scrtabs-disable {
	color: #ddd;
	cursor: default;
}

.scrtabs-tabs-fixed-container ul.nav-tabs>li {
	white-space: nowrap;
}

.lightSlider.lsGrab img {
	width: 100%
}

.wrap-news.wrap-news-detail {
	background: #f7f7f7;
	padding: 60px 0;
	margin-top: 0;
	margin-bottom: 0;
}

.show-text {
	margin-bottom: 80px
}

.sharelink {
	display: inline-block;
	width: 100%;
}

.sharelink h4 span {
	width: 30px;
	height: 30px;
	text-align: center;
	line-height: 30px;
	border-radius: 50px;
	color: #fff;
	background: #f79423;
}

.sharelink h4,
.sharelink ul li {
	float: left;
	margin: 0;
	font-weight: initial;
}

.sharelink h4 {
	border-right: #343434 solid 1px;
	margin-right: 20px;
	padding-right: 20px;
}

.sharelink ul li a {
	display: inline-block;
	line-height: 30px;
	margin-right: 20px
}

.back-careers {
	width: 500px;
	position: absolute;
	bottom: 0;
	z-index: -1;
}

.benefits-careers .pull-right {
	width: 60%;
	margin-bottom: 150px;
}

.button-file {
	display: inline-block;
}

.button-file li {
	float: left;
}

.button-file li .btn-form {
	border: solid #f79423 1px;
	color: #222;
	padding: 10px 10px;
	line-height: initial;
	border-radius: 4px;
	margin-right: 30px;
	cursor: pointer;
	transition: all 0.5s;
}

.button-file li:hover .btn-form {
	background: #f79423;
	color: #fff;
}

.button-file li span {
	margin-right: 4px;
}

.form-benefits,
.list-careers {
	background: #f8f8f8;
	padding: 60px 0;
}

.form-benefits {
	background: url(https://www.unilogistics.vn/assets/media/img/bg01.jpg) no-repeat center #ffffff;
	position: relative;
	z-index: 1;
	width: 100%;
	padding: 60px 0;
	background-attachment: fixed;
	background-size: 100%;
	text-align: center;
}

.form-benefits .col-md-3 {
	margin: 0 10px 20px 10px;
	padding: 10px 15px;
	border: solid 1px #fff;
	background: #ffffffbd;
	color: #0a0601;
	width: calc(33.333% - 24px);
	text-transform: uppercase;
	text-align: left;
	float: none;
	display: inline-block;
}

.form-benefits .col-md-3 i {
	margin-right: 4px;
	color: #fff;
	border: solid 1px #fff;
	background: #f79420;
	border-radius: 50px;
	text-align: center;
	line-height: 30px;
	height: 30px;
	width: 30px;
}

.list-careers ul li p {
	width: 33.3333%;
	float: left
}

.list-careers ul.text-center span {
	margin-right: 4px;
	color: #f79423;
}

.list-careers ul li .button-Op1 {
	float: right;
	margin-right: -15px;
	opacity: 0;
	transition: all 0.5s;
}

.list-careers ul li .button-Op1 a{
    margin-right: 20px;
}


.list-careers ul li:hover .button-Op1 a{
	margin-right: 0;
}

.list-careers ul li:hover .button-Op1 {
	opacity: 1
}

.list-careers ul li:hover {
	background: #fff
}

body.modal_open {
	padding-right: 0px !important;
	overflow-y: hidden;
}

.list-careers .modal .modal-dialog,
.wrap-video .modal .modal-dialog {
	position: fixed;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	margin: auto;
	width: 70%;
}

.list-careers .modal-header h4.title-border{
    margin-bottom: 30px;
}

.list-careers .modal-header .title-border:before{
	bottom: -31px;
	border-bottom: solid 5px #F79420;
}

.list-careers .modal .title-border:before {
	width: 80px;
}

.list-careers .modal h5.title-border {
	margin-bottom: 30px !important
}

.list-careers .modal .width-50 {
	float: left;
	width: 50%;
	margin-bottom: 30px
}

.list-careers .modal .modal-dialog .modal-header {
	margin-bottom: 20px;
	border-bottom: 1px solid #f89420;
	padding: 0;
}

.list-careers .modal .modal-header .title-border {
	color: #f89420
}

.list-careers .modal .modal-body .title-border {
	margin-bottom: 10px;
	color: #424d54;
}

.list-careers .modal .modal-content {
	padding: 30px;
}

.list-careers .modal .modal-content .modal-body {
	overflow-y: scroll;
	max-height: calc(50vh - 143px);
}

.list-careers .modal .btn,
.wrap-video .modal .btn {
	position: fixed;
	right: 0;
	z-index: 1;
	padding: 10px 14px;
	margin: 0;
	box-shadow: none;
	border-radius: 0;
	border: 0;
	transition: all 0.5s;
}

.modal .btn-default:hover {
	color: #fff;
	background-color: #f79420;
}

.list-careers .modal .btn-form,
.submit-btn input,
.form-benefits .close-modal {
	padding: 10px;
	text-align: center;
	background: #f79420;
	text-transform: uppercase;
	color: #fff;
	cursor: pointer;
	border-radius: 4px;
	display: inline-block;
	width: 300px;
	transition: all 0.5s;
	border: 0;
}

.modal .btn-form.close-modal {
	width: auto;
	border: solid 1px #ddd;
	background: 0;
	color: #333;
}

.submit-btn {
	float: right
}

.list-careers .modal .btn-form:hover,
.submit-btn input:hover {
	opacity: .8
}

.list-careers .form-register {
	display: inline-block;
	margin-top: 80px;
}

.form-row {
	position: relative;
	margin-bottom: 30px;
	display: inline-block;
	width: 100%;
}

.form-row.active_show .form-textbox {
	padding: 30px 0 4px 0;
}

.form-row.active_show .form-textbox:focus~.form-label,
.form-row.active_show .form-textbox:valid~.form-label {
	top: 0;
}

.form-label {
	position: absolute;
	top: 10px;
	left: 0px;
	line-height: 13px;
	cursor: text;
	transition: all .15s ease-in-out 0s;
	margin: 0;
}

.form-textbox {
	width: 100%;
	padding: 15px 0 0px 0;
	border: 0;
	background: 0;
	box-sizing: initial;
	outline: inherit;
	border-bottom: solid 1px #d0d2d3;
	position: relative;
	z-index: 1;
}

.form-textbox:focus~.form-label,
.form-textbox:valid~.form-label {
	top: -13px;
	color: #f79420;
}

.upload-CV {
	display: inline-block;
	float: left;
}

.upload-CV .btn_submit {
	float: right;
	border: solid 1px #fff;
	padding-left: 30px;
	padding-right: 30px;
	height: 44px;
	background: #fff;
	cursor: pointer;
}

.btn_show_form_apply {
	border: 0;
	background: #f7941d;
	padding: 10px 30px;
	color: #fff;
	cursor: pointer
}

.inputfile {
	width: 0.1px;
	height: 0.1px;
	opacity: 0;
	overflow: hidden;
	position: absolute;
	z-index: -1;
}

.inputfile+label {
	border: 1px solid #e5e6e7;
	background-color: #ffffff;
	padding: 0;
	display: inline-flex;
	border-radius: 4px;
}

.inputfile+label span,
.inputfile+label strong {
	padding: 0.625rem 1.25rem;
	/* 10px 20px */
}

.inputfile+label span {
	min-height: 38.8px;
	line-height: 18px;
	display: inline-block;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
	vertical-align: top;
	width: 50%;
}

.inputfile+label strong {
	height: 40.8px;
	line-height: 28px;
	border-radius: 4px;
	color: #333;
	background-color: #e5e6e7;
	display: inline-block;
	cursor: pointer;
	width: 50%;
	float: left;
	transition: all 0.5s;
}

.inputfile+label strong:hover {
	background-color: #f79420;
	color: #fff;
}

.submit_btn input {
	position: relative;
	z-index: 1;
	border: 0;
	padding: 5px 0 5px 20px;
	background: 0;
	text-transform: uppercase;
	outline: inherit;
	font-weight: 600;
	letter-spacing: 0.1em;
}

.submit_btn input:hover {
	color: #0e5bb7
}

.wrap-contact .social-icons,
.inf-cont ul li {
	display: inline-block;
	border-bottom: solid 1px #d0d2d3;
	padding-bottom: 15px;
	margin-bottom: 15px;
	width: 100%;
}

.wrap-contact h5 {
	text-transform: uppercase
}

.inf-cont ul li span {
	color: #f79420;
}

.wrap-contact .title-width p {
	width: 50%
}

.wrap-contact .social-icons li a {
	border: solid 1px #d0d2d3;
	color: #959595;
	width: 30px;
	height: 30px;
	line-height: 30px;
}

.wrap-contact .social-icons li:hover a {
	color: #fff;
}

.wrap-contact .col-xs-12.col-sm-4 {
	padding-left: 70px
}

.wrap-contact .col-xs-12.col-sm-4:after {
	content: "";
	border-left: solid 1px #d0d2d3;
	position: absolute;
	left: 30px;
	top: 0;
	height: 100%;
}

.wrap-maps {
	width: 100%;
	height: 600px;
	border-bottom: solid 9px #0b337d;
}

.form-search {
	margin: 30px 0 60px 0
}

.form-search .input-subscribefrm {
	display: inline-block;
}

.form-search .input-subscribefrm>input {
	border: 1px #d0d2d3 solid;
	color: #333;
}

.list-inf-search .item {
	padding-left: 30px;
	margin-bottom: 30px;
	display: inline-block;
	width: 100%
}

.list-inf-search .media-img {
	width: 200px;
	float: left;
}

.list-inf-search .media-body {
	padding-left: 30px;
}

.list-inf-search .media-body .position-btn {
	float: right
}

.list-inf-search .media-body h4 strong {
	background: #ececec;
	border-radius: 4px;
	padding: 2px 8px;
	color: #f79423;
}


figure {
	position: relative;
	overflow: hidden;
	background: #21409a;
	text-align: center;
	cursor: pointer;
}

figure img {
	position: relative;
	display: block;
	min-height: 100%;
	max-width: 100%;
	opacity: 0.8;
}

figure figcaption {
	padding: 2em;
	color: #fff;
	text-transform: uppercase;
	font-size: 1.25em;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

figure figcaption::before,
figure figcaption::after {
	pointer-events: none;
}

figure figcaption,
figure figcaption>a {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}


figure figcaption>a {
	z-index: 1;
	text-indent: 200%;
	white-space: nowrap;
	font-size: 0;
	opacity: 0;
	cursor: initial;
}

figure h2 {
	word-spacing: -0.15em;
	font-weight: 300;
	color: #ffffff91;
}

figure h2 span {
	font-weight: 800;
	color: #fff;
}

figure h2,
figure p {
	margin: 0;
	line-height: initial;
}

figure p {
	letter-spacing: 1px;
	font-size: 13px;
	text-transform: none;
}

figure.effect-ruby {
	background-color: #21409a;
}

figure.effect-ruby img {
	opacity: 0.7;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	-webkit-transform: scale(1.15);
	transform: scale(1.15);
}

.item:hover figure.effect-ruby img {
	opacity: 0.5;
	-webkit-transform: scale(1);
	transform: scale(1);
}

figure.effect-ruby h2 {
	margin-top: 20%;
	-webkit-transition: -webkit-transform 0.35s;
	transition: transform 0.35s;
	-webkit-transform: translate3d(0, 20px, 0);
	transform: translate3d(0, 20px, 0);
}

figure .position-btn {
	position: absolute;
	z-index: 11;
	left: 0;
	width: 100%;
	top: auto;
	bottom: 0;
	padding: 1em;
	background: #fff;
	-webkit-transition: -webkit-transform 0.35s;
	transition: transform 0.35s;
	-webkit-transform: translate3d(0, 100%, 0);
	transform: translate3d(0, 100%, 0);
	-webkit-transition: -webkit-transform 0.35s;
	transition: transform 0.35s;
	-webkit-transform: translate3d(0, 100%, 0);
	transform: translate3d(0, 100%, 0);
}

figure.effect-ruby p {
	margin: 1em 0 0;
	padding: 3em;
	border: 1px solid #fff;
	opacity: 0;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	-webkit-transform: translate3d(0, 20px, 0) scale(1.1);
	transform: translate3d(0, 20px, 0) scale(1.1);
}

.item:hover figure.effect-ruby h2,
.item:hover figure.effect-ruby .position-btn {
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
}

.item:hover figure.effect-ruby p,
.item:hover figure.effect-ruby .button-Op1 {
	opacity: 1;
	-webkit-transform: translate3d(0, 0, 0) scale(1);
	transform: translate3d(0, 0, 0) scale(1);
}