@font-face { font-family: 'NarzissDropsRegular'; src: url('../fonts/narziss-drops-webfont.eot'); src: url('../fonts/narziss-drops-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/narziss-drops-webfont.woff') format('woff'), url('../fonts/narziss-drops-webfont.ttf') format('truetype'), url('../fonts/narziss-drops-webfont.svg#NarzissDropsRegular') format('svg'); font-weight: normal; font-style: normal; } .bx-content h2, .bx-content h3{ font-size: 60px; position: relative; z-index: 300; color: #fff; padding: 20px 30px 0px; font-family: 'NarzissDropsRegular'; text-align: center; text-shadow: 0px 0px 1px rgba(255,255,255,0.9), 1px 2px 5px rgba(0,0,0,0.5); } .bx-content h3{ font-size: 60px; } .bx-content h1{ font-size: 20px; position: absolute; z-index: 300; color: #fff; bottom: 50px; font-family: 'NarzissDropsRegular'; text-align: center; text-shadow: 0px 0px 1px rgba(255,255,255,0.9), 1px 2px 5px rgba(0,0,0,0.5); width: 100%; } .bx-container{ position:fixed; /*top:100px;*/ left:0px; width:100%; height:100%; z-index:0; margin: 0px; } .bx-container img{ position:absolute; top:0px; left:0px; width:100%; z-index: 101; display:none; } .bx-canvas{ position:absolute; top:0px; left:0px; width:100%; } .bx-overlay, .bx-loading { width: 100%; height: 100%; position: fixed; top: 0px; left: 0px; /*background: transparent url(../images/pattern_cream.png) repeat top left; */ z-index:10; } .bx-loading{ z-index: 9999; background: #f1efd4; } .bx-loading span{ color: #fff; font-size: 13px; position: fixed; font-family: Arial, sans-serif; text-transform: uppercase; letter-spacing: 8px; margin: -12px 0 0 -46px; left: 50%; top: 50%; text-shadow: 0px 0px 1px rgba(255,255,255,0.9), 1px 2px 5px rgba(0,0,0,0.5); } .bx-thumbs{ position:absolute; z-index: 100; bottom: 50px; left: 40%; margin-left: -360px; /*half of width for centering*/ } .bx-thumbs a{ /*แก้ไขขนาดภาพเล็กตรงนี้*/ float: left; width: 330px; height: 264px; border: 2px solid #b2ad8e; overflow: hidden; margin: 2px 7px; position: relative; outline: none; cursor: pointer; background-repeat: no-repeat; background-position: center center; opacity: 0.8; border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; box-shadow: 0px 0px 3px rgba(0,0,0,0.6), 0px 0px 0px 180px rgba(0,0,0,0.3) inset; -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; } .bx-thumbs a:hover{ opacity: 1.0; box-shadow: 0px 0px 3px rgba(0,0,0,0.6), 0px 0px 0px 0px rgba(0,0,0,0.1) inset; } .bx-thumbs a.bx-thumbs-current{ opacity: 1.0; border-color: #fff; box-shadow: 0px 0px 3px rgba(0,0,0,0.6); }