@import url('https://fonts.googleapis.com/css?family=PT+Sans:400,700|Ruluko|Kanit:300,400,500');
@import "./jquery-ui.min.css";
@import "./bootstrap.min.css";
@import "./font-awesome.min.css";
@import "./bannerscollection_zoominout.css";
@import "./owl.carousel.min.css";
@import "./fancybox.css";
@import "./default.css";


html,body{font-family: "PT Sans", sans-serif;padding:0;margin:0;font-weight: 400;opacity: 1;transition: .3s opacity;}
body.loading{opacity: 0;}
body.fullscreen{overflow: hidden;height: 100vh;width: 100%;}
body:not(.fullscreen){padding-top: 88px;}
ul,li{margin:0;padding: 0;list-style: none}
iframe,img{max-width: 100%;border:0;}
h1,h2,h3,h4,h5,h6{font-family: "Ruluko", "Kanit", sans-serif;font-weight: 400;text-transform: uppercase;color: #494949;}
h1{margin-top: 34px;font-size: 32px;}
h2{font-size: 28px;}
a{transform: .3s all;}
a:hover{text-decoration: none;transform: .3s all;}
.container{width: 1030px;max-width: 100%;}
.btn{border-radius: 30px;text-align: center;min-width: 150px;}

header{box-shadow: 0 1px 3px rgba(0,0,0,.3);position: relative;top: 0;left: 0;width: 100%;z-index: 1000;background: white;}
body:not(.fullscreen) header{position: fixed;}
header #logo{display: inline-block;margin: 10px 0;}
header ul#munu{float: right;}
header ul#munu>li{display: inline-block;vertical-align: middle;margin-right: -3px;}
header ul#munu>li>a{display: block;font-size: 15px;color: #333;padding: 33px 13px;position: relative;transition: .3s all;}
header ul#munu>li>div{display: block;font-size: 15px;color: #333;padding: 33px 12px;position: relative;cursor: default;width: 70px;}
header ul#munu>li>a:before{content:'';width: 0;height: 0;background:transparent;position: absolute;top: 60px;left: 0;margin: 0 auto;right: 0;}
header ul#munu>li.active>a:before{background: #f9f9f9;color: #000;width: 30px;height: 2px;background: #e0351d;}
header ul#munu>li:hover>a,header ul#munu>li.active>a{color: #000;background:#f9f9f9;transition: .3s all;}
header ul#munu>li:hover>a:before{background: #f9f9f9;color: #000;width: 30px;height: 2px;background: #e0351d;transition: width .3s;}

header ul#munu>li:last-child>div>span{background:#eee;display: inline-block;padding: 2px 10px;border-radius: 4px;position: absolute;top: 20px;width: 70px;white-space: nowrap;}
header ul#munu>li:last-child>div ul{position: absolute; top: 31%; right: -12px; background: #eee; width: 100%; border-radius: 4px;display: none;overflow: hidden;}
header ul#munu>li:last-child>div ul>li:not(:first-child){border-top: 1px solid #ccc;}
header ul#munu>li:last-child>div ul>li>a{padding: 2px 10px;display: block;color: #333;}
header ul#munu>li:last-child>div ul>li:hover>a{color:#000;background:#e7e7e7;}
header ul#munu>li:last-child>div:hover ul,header ul#munu>li:last-child>div:active ul,header ul#munu>li:last-child>div:focus ul{display: block;}
header #responsive-menu{display: none; position: absolute; top: 15px; right: 15px; font-size: 20px;color: #9E2530}
body.show-menu header #responsive-menu i:before{content:'\f00d';}

#contact-form textarea{min-height: 120px;border-radius: 18px;max-width: 100%;}
#contact-form .btn{font-size: 15px;padding: 7px;min-width: 200px;}
#contact-form .form-control:not(textarea){border-radius: 30px;}


#shares{position: absolute;top: 30px;right: 15px;}
#shares li{display: inline-block;vertical-align: middle;margin-left: 10px;opacity: .75;transition: .3s all;}
#shares li img{width: 45px;}
#shares li:hover{opacity: 1;transition: .3s all;}


/* FANCYBOX
==========================*/
.fancybox-skin{border-radius: 0;padding:5px !important;}
#fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span{background: transparent;}
#fancybox-loading:after, .fancybox-close:after{content:'✕';font-size: 30px;}
.fancybox-prev span:after{content:'\f104';font-family: "FontAwesome";font-size: 50px;color: #000;}
.fancybox-next span:after{content:'\f105';font-family: "FontAwesome";font-size: 50px;color: #000;}
.fancybox-close{ color: #42210B; top: 5px; right: 15px; text-transform: uppercase; width: auto; height: auto;}
.fancybox-close:hover{text-decoration: none;color: #000;}
.fancybox-title-float-wrap{bottom: 50px;}
.fancybox-next span{text-align: right;}

/*main .slider{height:100vh;overflow: hidden;padding-top: 85px;}
main .slider a[href="javascript:void(0)"]{cursor: default;}
main .slider a[href="javascript:void(0)"]{cursor: default;}
main .owl-dots{bottom: 45px;}
main .owl-dot{width: 7px;height: 15px;border-radius: 4px;}
main .owl-item a{height: 100vh;background-position: top center;background-size: cover;background-repeat: no-repeat;transform-origin: top left; animation: slideShow 18s linear infinite 0s; -o-animation: slideShow 18s linear infinite 0s; -moz-animation: slideShow 18s linear infinite 0s; -webkit-animation: slideShow 18s linear infinite 0s;}
main .owl-next i, .owl-prev i{font-size: 55px;}main .owl-prev, .owl-next{top: 46%;opacity: .1;}
main .owl-prev{left: 15px;}
main .owl-next{right: 15px;}
*/

/*SLIDER 1
============================= */
.mycanvas{display: none;}
.textElement22_opportuneFullScreen{font-family: "PT Sans", sans-serif;font-weight: 400;}
.textElement21_opportuneFullScreen{font-family: "PT Sans", sans-serif;font-weight: 500;line-height: 75px;}
.bannerscollection_zoominout .contentHolderUnit:after{content:'';width: 100%;height: 100%;position: absolute;top: 0;left: 0;z-index: 1;}
.bannerscollection_zoominout.opportune .leftNav{background: transparent;top: -50px;}
.bannerscollection_zoominout.opportune .leftNav:hover{background: transparent;}
.bannerscollection_zoominout.opportune .leftNav:hover:before{color: white;}
.bannerscollection_zoominout.opportune .leftNav:before{content:'\f104';font-family: "FontAwesome";color: rgba(255,255,255,.1);font-size: 55px;padding: 15px 15px 15px 10px; background: transparent;position: absolute;top: 0;left: 0;}
.bannerscollection_zoominout.opportune .rightNav{background: transparent;top: -50px;}
.bannerscollection_zoominout.opportune .rightNav:hover{background: transparent;}
.bannerscollection_zoominout.opportune .rightNav:hover:before{color: white;}
.bannerscollection_zoominout.opportune .rightNav:before{content:'\f105';font-family: "FontAwesome";color: rgba(255,255,255,.1);font-size: 55px;padding: 15px 10px 15px 15px; background: transparent;margin-left: 24px;position: absolute;top: 0;right: 0;}
.owl-next i, .owl-prev i{font-size: 36px;color: #333;}
.owl-prev, .owl-next {top: 44%; background: rgba(255,255,255,.75);border-radius: 0;opacity: 1}
.owl-prev:hover, .owl-next:hover{background: rgba(255,255,255,1);transition: .3s all}

main .mycanvas{display: none !important;}

footer{position: relative;width: 100%;background:#393939;color: #eee;z-index: 100;padding: 3px 0 5px;font-size: 12px;margin-top: 30px}
footer.stick{width: 100%;position: fixed;bottom: 0;left: 0;width: 100%}
footer #language{padding-top: 2px;}
footer #language ul{display: inline-block;}
footer #language ul>li{display: inline-block;vertical-align: middle;}
footer #language ul>li>a{display: block;padding:0;margin: 0;line-height: 0;opacity: .5;transition: .3s all;}
footer #language ul>li.active>a,footer #language ul>li:hover>a{opacity: 1;transition: .3s all;}

footer>div>div{float: left;height: 25px;padding-right: 20px;border-right: 1px solid #494949;border-left: 1px solid #292929;padding-left: 20px;}
footer>div>div:first-child{border-left: 0;padding-left: 0;}
footer>div>div:last-child{border: 0;padding-right: 0;float: right;padding-left: 0;}
footer>div>div:nth-child(2){border-right: 0;padding-right: 0;}
footer #contact{font-size: 12px;padding-top: 3px;}
footer #contact a{color: #eee;}
footer #contact a:hover{text-decoration: underline;}
footer #contact ul>li{display: inline-block;vertical-align: middle;position: relative;}
footer #contact ul>li:not(:last-child){margin-right: 5px;}
footer #contact ul>li:not(:last-child):after{content:',';}
footer #copyright{padding-top: 4px;}

#overlay-background{position: fixed;top: 0;left: 0;width: 100%;height: 100%;background:rgba(0,0,0,.5);z-index: 100;display: none;cursor: pointer;}
body.show-menu #overlay-background{display: block;}

.grid.style1{margin: 0 -5px;}
.grid.style1 .item{width: 25%;padding: 5px;position: relative;}
.grid.style1 .item>a{display: block;overflow: hidden;text-decoration: none !important;}
.grid.style1 .item>a>div{background-position: top center;background-size: cover;display: block;position: relative;height: 300px;width: 100%;padding: 15px;color: #333;overflow: hidden;border:1px solid #eee;}
.grid.style1 .item>a>div>div{visibility: hidden;}
.grid.style1 .item>a>div>div:before{content:'';background:rgba(255,255,255,.95);top: 0;left: 0;width: 100%;height: 100%;position: absolute;}
.grid.style1 .item>a>div:hover>div{visibility: visible;}
.grid.style1 .item>a>div:hover>div p,.grid.style1 .item>a>div:hover>div h2{opacity: 1;transition: 1s all;}
.grid.style1 .item>a>div:hover{border:1px solid #eee;}
.grid.style1 .item>a>div p{font-size: 14px;text-align: center;z-index: 10;position: relative;margin: 0 auto;opacity: 0;}
.grid.style1 .item>a>div h2{font-size: 20px;color: #333;position: relative;text-align: center;margin-bottom: 20px;opacity: 0;}
.grid.style1 .item>a>div p.price{font-size: 18px;margin-top: 30px;opacity: 0;}
.grid.style1 .item>a[href="javascript:void(0)"]{cursor: default;}


.grid.style2{margin: 0 -5px;}
.grid.style2 .item{width: 33.33%;padding: 5px;position: relative;}
.grid.style2 .item>a{display: block;overflow: hidden;text-decoration: none !important;}
.grid.style2 .item>a>div{background-position: top center;background-size: cover;display: table;position: relative;height: 300px;transition: .3s all;width: 100%;}
.grid.style2 .item>a>div:before{content:'';background:rgba(0,0,0,.2);top: 0;left: 0;width: 100%;height: 100%;position: absolute;}
.grid.style2 .item>a>div p{font-size: 22px;color: white;text-align: center;z-index: 10;position: relative;margin: 0 auto;transition: .3s all;display: table-cell;vertical-align: middle;font-family: "Ruluko","Kanit",sans-serif;color: white;font-weight: 300;}
.grid.style2 .item>a:hover>div{transform: scale(1.1);transition: .3s all;}


.grid.style3{margin: 0 -5px;}
.grid.style3 .item{width: 33.33%;padding: 5px;position: relative;}
.grid.style3 .item>a{display: block;overflow: hidden;text-decoration: none !important;border:1px solid #eee;padding: 5px;}
.grid.style3 .item>a>div{background-position: top center;background-size: cover;display: table;position: relative;height: 300px;transition: .3s all;width: 100%;}
.grid.style3 .item p{font-size: 22px;color: #666;text-align: center;font-family: "Ruluko","Kanit",sans-serif;font-weight: 300;}
.grid.style3 .item>a:hover>div{transform: scale(1.1);transition: .3s all;}

.text-editor b,.text-editor strong{font-weight: bold;}
.text-editor{font-weight: normal;font-family: "PT Sans", sans-serif;color: initial;max-width: 100%;}
.text-editor ul,.text-editor li{list-style: initial;margin: initial;padding: initial;}
.text-editor ul,.text-editor li{list-style: initial;margin: initial;padding: initial;}
.text-editor ul{padding-left: 30px;}
.text-editor img{max-width: 100%;height: auto;}
address {margin: 0;padding: 0;}

@media(max-width: 1050px){
	header ul#munu > li > a{padding: 37px 14px;}
	header{padding-right: 15px;}
}

@media(max-width: 991px){
	.text-editor img{max-width: 100% !important;height: auto !important;}
	.grid.style1 .item{width: 33.33%;}
	#shares{top: 0;right: 15px;}
	h1{margin-top: 0;}
	.grid.style2 .item > a > div{height: 250px}
	.grid.style3 .item > a > div{height: 250px}
	header #logo>img{height: 50px;}
	header #logo{margin:5px 0;}
	header ul#munu{float: none;position: fixed;width: 240px;background: #fff;left: -300px;top: 60px;height: 100%;box-shadow: 2px 3px 5px 0px rgba(0,0,0,.3);visibility: hidden;transition: .3s all;}
	body.show-menu header ul#munu{visibility: visible;left: 0;transition: .3s all;}
	header ul#munu > li{display: block;margin: 0;}
	header ul#munu>li>a:before{display: none;}
	header ul#munu > li > a{border-top: 1px solid #eee;padding: 15px;}
	header #responsive-menu{display: block;}
	header ul#munu > li:last-child{visibility: visible;position: fixed;top: -6px;right: 60px;}
}

@media(max-width: 767px){
	.warp-recapcha{height: 85px;}
	/*.owl-carousel .owl-item img{max-width: initial;width: auto;height: 100%;}*/
	/*.owl-carousel.slider-mobile .owl-item>div{height: 90vh;background-size: cover;background-position: center center}*/
	header ul#munu>li:last-child>div>span{top: 23px;}
	.contentHolderUnit img{height: 100% !important;width: auto !important;margin: 0 auto !important;}
	.grid.style1{margin-top: 20px;}
	.grid.style1 .item{width: 50%;}
	#shares {top: 33px; right: 15px;transform: scale(.6); transform-origin: top right; text-align: right; }
	#contact iframe{height: 300px;}
	h1{font-size: 26px;}
	h2{font-size: 22px;}
	h3{font-size: 20px;}
	.grid.style2 .item > a > div p{font-size: 16px;}
	.grid.style3 .item > a > div p{font-size: 16px;}
	body:not(.fullscreen){padding-bottom: 0px;}
	body:not(.fullscreen) footer{position: relative;margin-top: 15px;}
	.grid.style2 .item{width: 50%}
	.grid.style3 .item{width: 50%}
	footer{text-align: center;}
	footer #copyright,footer #language,footer #contact{float: none;display: block;}
	footer > div > div{height: auto;padding: 0;border:0;}
	body:not(.fullscreen){padding-top: 75px;}
}
@media(max-width: 500px){
	.container{padding-left: 10px;padding-right: 10px}
	.grid.style1 .item{width: 50%;}
	.grid.style1 .item > a > div{height: 250px;}
	.grid.style2 .item > a > div{height: 200px}
	.grid.style3 .item > a > div{height: 200px}
}
@media(max-width: 449px){
	.grid.style1 .item > a > div{height: 300px;}
	.grid.style1 .item{width: 100%;}
	.grid.style2 .item > a > div{height: 300px}
	.grid.style2 .item{width: 100%}
	.grid.style3 .item > a > div{height: 300px}
	.grid.style3 .item{width: 100%}
}
@media(max-width: 349px){
	.grid.style2 .item > a > div{height: 260px}
	.grid.style3 .item > a > div{height: 260px}
}
