/*** Common CSS for all templates ***/ .cycloneslider{ position:relative; } .cycloneslider-slides{ position:relative; overflow:hidden; } .cycloneslider-slide{ position:absolute; left:0; top:0; width:100%; height:100%; z-index:100; } .cycloneslider-slide img{ border:0; padding:0; margin:0; max-width:100%; } .cycloneslider-prev,.cycloneslider-next,.cycloneslider-pager{ cursor:pointer; } .cycloneslider-slide:first-child{ z-index:101; } /*** Template Black ***/ .cycloneslider-template-black img{ display:block; } .cycloneslider-template-black .cycloneslider-prev, .cycloneslider-template-black .cycloneslider-next{ display:none; opacity:0; position:absolute; top:50%; margin-top:-22px; z-index:102; width:26px; height:44px; text-indent:-99999px; background: url(https://www.atta.or.th/wp-content/plugins/cyclone-slider/templates/black/images/sprite-arrows.png) no-repeat; } .cycloneslider-template-black:hover .cycloneslider-prev, .cycloneslider-template-black:hover .cycloneslider-next{ display:block; opacity:0.4; } .cycloneslider-template-black .cycloneslider-prev{ left:10px; background-position:0 0; } .cycloneslider-template-black .cycloneslider-next{ right:10px; background-position:-29px 0; } .cycloneslider-template-black .cycloneslider-prev:hover, .cycloneslider-template-black .cycloneslider-next:hover{ opacity:1; } .cycloneslider-template-black .cycloneslider-pager{ position:absolute; z-index:99; top:20px; right:20px; } .cycloneslider-template-black .cycloneslider-pager a { background: url(https://www.atta.or.th/wp-content/plugins/cyclone-slider/templates/black/images/sprite-nav.png) no-repeat scroll 0 0 transparent; display: block; float: left; font-size: 0; width: 10px; height: 10px; line-height: 0; margin-right: 6px; text-indent: -99999px; } .cycloneslider-template-black .cycloneslider-pager a.activeSlide { background-position: left bottom; } .cycloneslider-template-black .cycloneslider-caption{ position:absolute; left:0; bottom:0; width:100%; z-index:99; background: url(https://www.atta.or.th/wp-content/plugins/cyclone-slider/templates/black/images/bg-caption.png); color:#fff; } .cycloneslider-template-black .cycloneslider-caption-title{ padding:10px 20px 5px 20px; font-size:22px; line-height:1; margin-bottom:0; } .cycloneslider-template-black .cycloneslider-caption-description{ padding:0 20px 15px 20px; line-height:1.5; font-size:12px; } /*** Template Blue ***/ .cycloneslider-template-blue img{ display:block; } .cycloneslider-template-blue .cycloneslider-prev, .cycloneslider-template-blue .cycloneslider-next{ display:none; opacity:0; position:absolute; top:50%; margin-top:-22px; z-index:102; width:26px; height:44px; text-indent:-99999px; background: url(https://www.atta.or.th/wp-content/plugins/cyclone-slider/templates/blue/images/sprite-arrows.png) no-repeat; } .cycloneslider-template-blue:hover .cycloneslider-prev, .cycloneslider-template-blue:hover .cycloneslider-next{ display:block; opacity:0.4; } .cycloneslider-template-blue .cycloneslider-prev{ left:10px; background-position:0 0; } .cycloneslider-template-blue .cycloneslider-next{ right:10px; background-position:-29px 0; } .cycloneslider-template-blue .cycloneslider-prev:hover, .cycloneslider-template-blue .cycloneslider-next:hover{ opacity:1; } .cycloneslider-template-blue .cycloneslider-pager{ position:absolute; z-index:99; top:20px; right:20px; } .cycloneslider-template-blue .cycloneslider-pager a { background: url(https://www.atta.or.th/wp-content/plugins/cyclone-slider/templates/blue/images/sprite-nav.png) no-repeat scroll 0 0 transparent; display: block; float: left; font-size: 0; width: 10px; height: 10px; line-height: 0; margin-right: 6px; text-indent: -99999px; } .cycloneslider-template-blue .cycloneslider-pager a.activeSlide { background-position: left bottom; } .cycloneslider-template-blue .cycloneslider-caption{ position:absolute; left:0; bottom:0; width:100%; z-index:99; background: url(https://www.atta.or.th/wp-content/plugins/cyclone-slider/templates/blue/images/bg-caption.png); color:#fff; } .cycloneslider-template-blue .cycloneslider-caption-title{ padding:10px 20px 5px 20px; font-size:22px; line-height:1; margin-bottom:0; } .cycloneslider-template-blue .cycloneslider-caption-description{ padding:0 20px 15px 20px; line-height:1.5; font-size:12px; } /*** Template Dark ***/ .cycloneslider-template-dark{ position:relative; margin-bottom: 30px; outline: none; } .cycloneslider-template-dark .cycloneslider-slides{ position:relative; overflow:hidden; } .cycloneslider-template-dark .cycloneslider-slide{ text-align: center; width: 100%; /* For slides in scrollHorz to work */ display: none; /* Hide slides to prevent FOUC when JS hasn't kicked in yet */ background: #fff; /* Add background to prevent slides from peeking behind the current slide when fx=scrollHorz and hideNonActive=false */ } .cycloneslider-template-dark .cycle-slide{ display: block; /* Show slide so that getBoundingClientRect().height will not return 0. Class .cycle-slide is added when cycle has initialized. */ } .cycloneslider-template-dark div[data-cycle-dynamic-height="off"] .cycloneslider-slide-image{ height: 100%; /* To prevent cutting off captions when dynamic height is off */ } .cycloneslider-template-dark .cycloneslider-slide:first-child, /* Show first slide */ .cycloneslider-template-dark .cycle-sentinel + .cycloneslider-slide{ /* Select next slide when using sentinel slide */ display: block; } .cycloneslider-template-dark .cycloneslider-slide img{ display:block; margin:0 auto; padding:0; max-width:100%; border:0; } .cycloneslider-template-dark.cycloneslider-width-full .cycloneslider-slide img{ width:100%; } .cycloneslider-template-dark .cycloneslider-slide iframe, /* Make our videos fluid */ .cycloneslider-template-dark .cycloneslider-slide object, .cycloneslider-template-dark .cycloneslider-slide embed { position: absolute; left: 0; top: 0; width: 100% !important; /* Override width attrib */ height: 100% !important; /* Override height attrib */ } .cycloneslider-template-dark .cycloneslider-slide-youtube, .cycloneslider-template-dark .cycloneslider-slide-vimeo{ background: #000; } .cycloneslider-template-dark .cycloneslider-slide-custom{ min-height: 100%; } .cycloneslider-template-dark div[data-cycle-dynamic-height="on"] .cycloneslider-slide-custom { min-height: 100px; /* Disable 100% min height when dynamic height is on. To fix issue with scrollHorz */ } .cycloneslider-template-dark .cycloneslider-slide-testimonial{ font-style: italic; } .cycloneslider-template-dark .cycloneslider-slide-testimonial blockquote{ margin-bottom: 0; } .cycloneslider-template-dark .cycloneslider-slide-testimonial p{ margin: 0; } .cycloneslider-template-dark .cycloneslider-slide-testimonial .cycloneslider-testimonial-author{ text-align: right; font-style: normal; } .rtl .cycloneslider-template-dark .cycloneslider-slide-testimonial .cycloneslider-testimonial-author{ text-align: left; } .cycloneslider-template-dark .cycloneslider-slide-testimonial .cycloneslider-testimonial-author a{ text-decoration: none; } /*** Prev/Next ***/ .cycloneslider-template-dark .cycloneslider-prev, .cycloneslider-template-dark .cycloneslider-next, .cycloneslider-template-dark .cycloneslider-pager span { cursor:pointer; } .cycloneslider-template-dark .cycloneslider-prev, .cycloneslider-template-dark .cycloneslider-next{ position:absolute; top:50%; z-index:501; display: block; margin-top:-15px; width:30px; height:30px; background: #000; opacity: 0.6; -webkit-transition: all 0.5s ; -moz-transition: all 0.5s ; -ms-transition: all 0.5s ; -o-transition: all 0.5s ; transition: all 0.5s ; } .cycloneslider-template-dark .cycloneslider-prev:hover, .cycloneslider-template-dark .cycloneslider-next:hover{ opacity: 1; } .cycloneslider-template-dark .cycloneslider-prev.disabled, .cycloneslider-template-dark .cycloneslider-next.disabled{ display: none; } .cycloneslider-template-dark .arrow{ position: absolute; top: 50%; left: 50%; margin-top: -6px; width: 0; height: 0; } .cycloneslider-template-dark .cycloneslider-prev{ left:0; } .rtl .cycloneslider-template-dark .cycloneslider-prev{ left:auto; right:0; } .cycloneslider-template-dark .cycloneslider-prev .arrow{ margin-left: -4px; border-top: 6px solid transparent; border-right: 6px solid #fff; border-bottom: 6px solid transparent; } .rtl .cycloneslider-template-dark .cycloneslider-prev .arrow{ margin-left: -2px; border: 0; border-top: 6px solid transparent; border-left: 6px solid #fff; border-bottom: 6px solid transparent; } .cycloneslider-template-dark .cycloneslider-next{ right:0; } .rtl .cycloneslider-template-dark .cycloneslider-next{ right:auto; left:0; } .cycloneslider-template-dark .cycloneslider-next .arrow{ margin-left: -2px; border-top: 6px solid transparent; border-left: 6px solid #fff; border-bottom: 6px solid transparent; } .rtl .cycloneslider-template-dark .cycloneslider-next .arrow{ margin-left: -4px; border: 0; border-top: 6px solid transparent; border-right: 6px solid #fff; border-bottom: 6px solid transparent; } /*** Pager ***/ .cycloneslider-template-dark .cycloneslider-pager{ position:absolute; bottom:-22px; left:0; z-index:100; width: 100%; height: 12px; text-align: center; } .cycloneslider-template-dark .cycloneslider-pager span { display: inline-block; margin: 0 4px; width: 12px; height: 12px; background: #333; vertical-align: top; font-size: 0; line-height: 0; -webkit-box-shadow: 1px 1px 2px 0px #000; box-shadow: 1px 1px 2px 0px #000; } .ie7 .cycloneslider-template-dark .cycloneslider-pager span{ zoom: 1;/* IE 7 inline-block */ *display: inline;/* IE 7 inline-block */ } .cycloneslider-template-dark .cycloneslider-pager span.cycle-pager-active { background-color: #ccc; } /*** Caption ***/ .cycloneslider-template-dark .cycloneslider-caption{ position:absolute; top:0; left:0; z-index:500; max-width:60%; margin: 15% 30px; text-align: left; } .rtl .cycloneslider-template-dark .cycloneslider-caption{ text-align: right; left: auto; right:0; } .cycloneslider-template-dark .cycloneslider-caption-title, .cycloneslider-template-dark .cycloneslider-caption-description, .cycloneslider-template-dark .cycloneslider-caption-more{ display: none; float: left; clear: both; margin-bottom:1px; background: #000; padding:10px; opacity: 0.8; } .rtl .cycloneslider-template-dark .cycloneslider-caption-title, .rtl .cycloneslider-template-dark .cycloneslider-caption-description, .rtl .cycloneslider-template-dark .cycloneslider-caption-more{ float: right; } .cycloneslider-template-dark .cycloneslider-caption-title{ color:#fff; opacity: 0.7; font-size:24px; line-height:1.2; } .cycloneslider-template-dark .cycloneslider-caption-description{ color:#FC3; font-size:12px; line-height:1.5; } .cycloneslider-template-dark .cycloneslider-caption-more{ color:#fff; font-size:10px; text-decoration: none; text-transform: uppercase; line-height:1.5; } .cycloneslider-template-dark .cycloneslider-caption-more:hover{ color: #FC3; } /*** Responsive ***/ @media (max-width: 960px) { .cycloneslider-template-dark .cycloneslider-caption{ max-width: 100%; } } @media (max-width: 480px) { .cycloneslider-template-dark .cycloneslider-caption{ display: none; } } /*** Template Default ***/ .cycloneslider-template-default img{ display:block; } .cycloneslider-template-default .cycloneslider-prev, .cycloneslider-template-default .cycloneslider-next{ display:none; opacity:0; position:absolute; top:50%; margin-top:-22px; z-index:102; width:26px; height:44px; text-indent:-99999px; background: url(https://www.atta.or.th/wp-content/plugins/cyclone-slider/templates/default/images/sprite-arrows.png) no-repeat; } .cycloneslider-template-default:hover .cycloneslider-prev, .cycloneslider-template-default:hover .cycloneslider-next{ display:block; opacity:0.4; } .cycloneslider-template-default .cycloneslider-prev{ left:10px; background-position:0 0; } .cycloneslider-template-default .cycloneslider-next{ right:10px; background-position:-29px 0; } .cycloneslider-template-default .cycloneslider-prev:hover, .cycloneslider-template-default .cycloneslider-next:hover{ opacity:1; } .cycloneslider-template-default .cycloneslider-pager{ position:absolute; z-index:99; top:20px; right:20px; } .cycloneslider-template-default .cycloneslider-pager a { background: url(https://www.atta.or.th/wp-content/plugins/cyclone-slider/templates/default/images/sprite-nav.png) no-repeat scroll 0 0 transparent; display: block; float: left; font-size: 0; width: 10px; height: 10px; line-height: 0; margin-right: 6px; text-indent: -99999px; } .cycloneslider-template-default .cycloneslider-pager a.activeSlide { background-position: left bottom; } .cycloneslider-template-default .cycloneslider-caption{ position:absolute; left:0; bottom:0; width:100%; z-index:99; background: url(https://www.atta.or.th/wp-content/plugins/cyclone-slider/templates/default/images/bg-caption.png); color:#fff; } .cycloneslider-template-default .cycloneslider-caption-title{ padding:10px 20px 5px 20px; font-size:22px; line-height:1; margin-bottom:0; } .cycloneslider-template-default .cycloneslider-caption-description{ padding:0 20px 15px 20px; line-height:1.5; font-size:12px; } /*** Template Myrtle ***/ .cycloneslider-template-myrtle{ overflow:hidden; } .cycloneslider-template-myrtle .cycloneslider-slide img{ max-width:100%; max-height:100%; } .cycloneslider-template-myrtle .cycloneslider-prev, .cycloneslider-template-myrtle .cycloneslider-next{ display:none; position:absolute; top:50%; margin-top:-19px; z-index:102; text-indent:-99999px; width:45px; height:45px; background: url(https://www.atta.or.th/wp-content/plugins/cyclone-slider/templates/myrtle/images/sprite-arrows.png) no-repeat; } .cycloneslider-template-myrtle:hover .cycloneslider-prev, .cycloneslider-template-myrtle:hover .cycloneslider-next{ display:block; } .cycloneslider-template-myrtle .cycloneslider-prev{ left:10px; background-position:-45px 0; } .cycloneslider-template-myrtle .cycloneslider-next{ right:10px; background-position:0 0; } .cycloneslider-template-myrtle .cycloneslider-prev:hover{ background-position:-45px -45px; } .cycloneslider-template-myrtle .cycloneslider-next:hover{ background-position:0 -45px; } .cycloneslider-template-myrtle .cycloneslider-pager{ position:absolute; z-index:99; top:20px; right:20px; } .cycloneslider-template-myrtle .cycloneslider-pager a { background: url(https://www.atta.or.th/wp-content/plugins/cyclone-slider/templates/myrtle/images/sprite-nav.png) no-repeat scroll 0 0 transparent; display: block; float: left; font-size: 0; width: 12px; height: 12px; line-height: 0; margin-right: 6px; text-indent: -99999px; } .cycloneslider-template-myrtle .cycloneslider-pager a.activeSlide { background-position: left bottom; } .cycloneslider-template-myrtle .cycloneslider-caption{ position:absolute; left:0; bottom:0; width:100%; z-index:99; background: url(https://www.atta.or.th/wp-content/plugins/cyclone-slider/templates/myrtle/images/bg-caption.png) right; color:#fff; } .cycloneslider-template-myrtle .cycloneslider-caption-title{ padding:10px 20px 5px 20px; font-size:24px; line-height:1; margin-bottom:0; color:#E62B4E; } .cycloneslider-template-myrtle .cycloneslider-caption-description{ padding:0 20px 15px 20px; line-height:1.5; font-size:12px; color:#676761; } /*** Template Responsive ***/ .cycloneslider-template-responsive img{ display:block; max-width:100%; } .cycloneslider-template-responsive .cycloneslider-prev, .cycloneslider-template-responsive .cycloneslider-next{ display:none; opacity:0; position:absolute; top:50%; margin-top:-22px; z-index:102; width:26px; height:44px; text-indent:-99999px; background: url(https://www.atta.or.th/wp-content/plugins/cyclone-slider/templates/responsive/images/sprite-arrows.png) no-repeat; } .cycloneslider-template-responsive:hover .cycloneslider-prev, .cycloneslider-template-responsive:hover .cycloneslider-next{ display:block; opacity:0.4; } .cycloneslider-template-responsive .cycloneslider-prev{ left:10px; background-position:0 0; } .cycloneslider-template-responsive .cycloneslider-next{ right:10px; background-position:-29px 0; } .cycloneslider-template-responsive .cycloneslider-prev:hover, .cycloneslider-template-responsive .cycloneslider-next:hover{ opacity:1; } .cycloneslider-template-responsive .cycloneslider-pager{ position:absolute; z-index:99; top:20px; right:20px; } .cycloneslider-template-responsive .cycloneslider-pager a { background: url(https://www.atta.or.th/wp-content/plugins/cyclone-slider/templates/responsive/images/sprite-nav.png) no-repeat scroll 0 0 transparent; display: block; float: left; font-size: 0; width: 10px; height: 10px; line-height: 0; margin-right: 6px; text-indent: -99999px; } .cycloneslider-template-responsive .cycloneslider-pager a.activeSlide { background-position: left bottom; } .cycloneslider-template-responsive .cycloneslider-caption{ position:absolute; left:0; bottom:0; width:100%; z-index:99; background: url(https://www.atta.or.th/wp-content/plugins/cyclone-slider/templates/responsive/images/bg-caption.png); color:#fff; } .cycloneslider-template-responsive .cycloneslider-caption-title{ padding:10px 20px 5px 20px; font-size:22px; line-height:1; margin-bottom:0; } .cycloneslider-template-responsive .cycloneslider-caption-description{ padding:0 20px 15px 20px; line-height:1.5; font-size:12px; } /*** Template Standard ***/ .cycloneslider-template-standard{ position:relative; margin-bottom: 30px; outline: none; } .cycloneslider-template-standard .cycloneslider-slides{ position:relative; overflow:hidden; } .cycloneslider-template-standard .cycloneslider-slide{ text-align: center; width: 100%; /* For slides in scrollHorz to work */ display: none; /* Hide slides to prevent FOUC when JS hasn't kicked in yet */ background: #fff; /* Add background to prevent slides from peeking behind the current slide when fx=scrollHorz and hideNonActive=false */ } .cycloneslider-template-standard .cycle-slide{ display: block; /* Show slide so that getBoundingClientRect().height will not return 0. Class .cycle-slide is added when cycle has initialized. */ } .cycloneslider-template-standard div[data-cycle-hide-non-active="false"] .cycloneslider-slide{ opacity: 0; /* Avoid youtube and vimeo or other slides from peeking behind the current slide whe in transit */ } .cycloneslider-template-standard div[data-cycle-dynamic-height="off"] .cycloneslider-slide-image{ height: 100%; /* To prevent cutting off captions when dynamic height is off */ } .cycloneslider-template-standard .cycloneslider-slide:first-child, /* Show first slide */ .cycloneslider-template-standard .cycle-sentinel + .cycloneslider-slide{ /* Select next slide when using sentinel slide */ display: block; } .cycloneslider-template-standard .cycloneslider-slide img{ display:block; margin:0 auto; padding:0; max-width:100%; border:0; } .cycloneslider-template-standard.cycloneslider-width-full .cycloneslider-slide img{ width:100%; } .cycloneslider-template-standard .cycloneslider-slide iframe, /* Make our videos fluid */ .cycloneslider-template-standard .cycloneslider-slide object, .cycloneslider-template-standard .cycloneslider-slide embed { position: absolute; left: 0; top: 0; width: 100% !important; /* Override width attrib */ height: 100% !important; /* Override height attrib */ } .cycloneslider-template-standard .cycloneslider-slide-youtube, .cycloneslider-template-standard .cycloneslider-slide-vimeo{ background: #000; } .cycloneslider-template-standard .cycloneslider-slide-custom { min-height: 100%; } .cycloneslider-template-standard div[data-cycle-dynamic-height="on"] .cycloneslider-slide-custom{ min-height: 100px; /* Disable 100% min height when dynamic height is on. To fix issue with scrollHorz */ } .cycloneslider-template-standard .cycloneslider-slide-testimonial{ font-style: italic; } .cycloneslider-template-standard .cycloneslider-slide-testimonial blockquote{ margin-bottom: 0; } .cycloneslider-template-standard .cycloneslider-slide-testimonial p{ margin: 0; } .cycloneslider-template-standard .cycloneslider-slide-testimonial .cycloneslider-testimonial-author{ text-align: right; font-style: normal; } .rtl .cycloneslider-template-standard .cycloneslider-slide-testimonial .cycloneslider-testimonial-author{ text-align: left; } .cycloneslider-template-standard .cycloneslider-slide-testimonial .cycloneslider-testimonial-author a{ text-decoration: none; } /*** Prev/Next ***/ .cycloneslider-template-standard .cycloneslider-prev, .cycloneslider-template-standard .cycloneslider-next, .cycloneslider-template-standard .cycloneslider-pager span { cursor:pointer; } .cycloneslider-template-standard .cycloneslider-prev, .cycloneslider-template-standard .cycloneslider-next{ position:absolute; top:50%; z-index:501; display: block; margin-top:-12px; width:24px; height:24px; border-radius: 40px; background: #fefefe; opacity: 0; -webkit-transition: all 0.5s ; -moz-transition: all 0.5s ; -ms-transition: all 0.5s ; -o-transition: all 0.5s ; transition: all 0.5s ; -webkit-box-shadow: 1px 1px 2px 0px #333333; box-shadow: 1px 1px 2px 0px #333333; } .cycloneslider-template-standard:hover .cycloneslider-prev, .cycloneslider-template-standard:hover .cycloneslider-next{ opacity: 0.4; } .cycloneslider-template-standard .cycloneslider-prev:hover, .cycloneslider-template-standard .cycloneslider-next:hover{ opacity: 1; } .cycloneslider-template-standard .cycloneslider-prev.disabled, .cycloneslider-template-standard .cycloneslider-next.disabled{ display: none; } .cycloneslider-template-standard .arrow{ position: absolute; top: 50%; left: 50%; margin-top: -6px; width: 0; height: 0; } .cycloneslider-template-standard .cycloneslider-prev{ left:10px; } .rtl .cycloneslider-template-standard .cycloneslider-prev{ left:auto; right:10px; } .cycloneslider-template-standard .cycloneslider-prev .arrow{ margin-left: -4px; border-top: 6px solid transparent; border-right: 6px solid #333; border-bottom: 6px solid transparent; } .rtl .cycloneslider-template-standard .cycloneslider-prev .arrow{ margin-left: -2px; border: 0; border-top: 6px solid transparent; border-left: 6px solid #333; border-bottom: 6px solid transparent; } .cycloneslider-template-standard .cycloneslider-next{ right:10px; } .rtl .cycloneslider-template-standard .cycloneslider-next{ right:auto; left:10px; } .cycloneslider-template-standard .cycloneslider-next .arrow{ margin-left: -2px; border-top: 6px solid transparent; border-left: 6px solid #333; border-bottom: 6px solid transparent; } .rtl .cycloneslider-template-standard .cycloneslider-next .arrow{ margin-left: -4px; border: 0; border-top: 6px solid transparent; border-right: 6px solid #333; border-bottom: 6px solid transparent; } /*** Pager ***/ .cycloneslider-template-standard .cycloneslider-pager{ position:absolute; bottom:-22px; left:0; z-index:100; width: 100%; height: 12px; text-align: center; } .cycloneslider-template-standard .cycloneslider-pager span { display: inline-block; margin: 0 3px; width: 12px; height: 12px; border-radius: 6px; background: #333; vertical-align: top; font-size: 0; line-height: 0; -webkit-box-shadow: 1px 1px 2px 0px #333333; box-shadow: 1px 1px 2px 0px #333333; } .ie7 .cycloneslider-template-standard .cycloneslider-pager span{ zoom: 1;/* IE 7 inline-block */ *display: inline;/* IE 7 inline-block */ } .cycloneslider-template-standard .cycloneslider-pager span.cycle-pager-active { background-color: #ccc; } /*** Caption ***/ .cycloneslider-template-standard .cycloneslider-caption{ position:absolute; bottom:0; left:0; z-index:500; width:100%; background: #222; color:#fff; opacity: 0.7; text-align: left; } .rtl .cycloneslider-template-standard .cycloneslider-caption{ text-align: right; } .cycloneslider-template-standard .cycloneslider-caption-title{ margin-bottom:0; padding:10px 20px 5px 20px; font-size:22px; line-height:1; } .cycloneslider-template-standard .cycloneslider-caption-description{ padding:0 20px 15px 20px; font-size:12px; line-height:1.5; } /* Lightbox */ .mfp-title span { line-height: 1.8; } .mfp-title small { line-height: 1.3; } /*** Template Thumbnails ***/ .cycloneslider-template-thumbnails img{ display:block; } .cycloneslider-template-thumbnails .cycloneslider-prev, .cycloneslider-template-thumbnails .cycloneslider-next{ display:none; opacity:0; position:absolute; top:50%; margin-top:-22px; z-index:102; width:26px; height:44px; text-indent:-99999px; background: url(https://www.atta.or.th/wp-content/plugins/cyclone-slider/templates/thumbnails/images/sprite-arrows.png) no-repeat; } .cycloneslider-template-thumbnails:hover .cycloneslider-prev, .cycloneslider-template-thumbnails:hover .cycloneslider-next{ display:block; opacity:0.4; } .cycloneslider-template-thumbnails .cycloneslider-prev{ left:10px; background-position:0 0; } .cycloneslider-template-thumbnails .cycloneslider-next{ right:10px; background-position:-29px 0; } .cycloneslider-template-thumbnails .cycloneslider-prev:hover, .cycloneslider-template-thumbnails .cycloneslider-next:hover{ opacity:1; } .cycloneslider-template-thumbnails .cycloneslider-caption{ position:absolute; left:0; bottom:0; width:100%; z-index:99; background: url(https://www.atta.or.th/wp-content/plugins/cyclone-slider/templates/thumbnails/images/bg-caption.png); color:#fff; } .cycloneslider-template-thumbnails .cycloneslider-caption-title{ padding:10px 20px 5px 20px; font-size:22px; line-height:1; margin-bottom:0; } .cycloneslider-template-thumbnails .cycloneslider-caption-description{ padding:0 20px 15px 20px; line-height:1.5; font-size:12px; } .cycloneslider-template-thumbnails.cycloneslider-thumbnails{ padding:20px 0; text-align:center; } .cycloneslider-template-thumbnails.cycloneslider-thumbnails li{ display:inline-block; margin:0 5px; border:5px solid #ccc; cursor:pointer; } .cycloneslider-template-thumbnails.cycloneslider-thumbnails li.current{ border-color:#333; }