Error: INSERT INTO `kin_1_1040205` (subject, seo_subject, content, page, description, og_image, time) VALUES ('네이버스토어 html 삽입', '%EB%84%A4%EC%9D%B4%EB%B2%84%EC%8A%A4%ED%86%A0%EC%96%B4+html+%EC%82%BD%EC%9E%85', '<div class=\"questionDetail\">\n					\n						\n						안녕하세요 네이버스토어 상세페이지에 페인트 색상 고를 수 있도록  <div><br></div>\n<div>이런 html 삽입하려고 하는데 잘 안되네요..</div>\n<div><br></div>\n<div>https://behr.kr/sub/gallery/studio_iframe.asp</div>\n<div><br></div>\n<div>이 페이지를 넣으려면</div>\n<div><br></div>\n<div><br></div>\n<div>html 적는 칸에</div>\n<div><br></div>\n<div><br></div>\n<div>\n<div>&lt;center&gt;&lt;iframe src=\"https://behr.kr/sub/gallery/studio_iframe.asp\" width=\"850\" height=\"1000\" frameborder=\"0\" marginwidth=\"0\" marginheight=\"0\" scrolling=\"no\"&gt;</div>\n<div>&lt;html lang=\"ko\" class=\" -webkit-\"&gt;&lt;head&gt;</div>\n<div>\n<span style=\"white-space:pre;\"></span>&lt;meta charset=\"UTF-8\"&gt;</div>\n<div>\n<span style=\"white-space:pre;\"></span>&lt;meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\"&gt;</div>\n<div>\n<span style=\"white-space:pre;\"></span>&lt;meta name=\"format-detection\" content=\"telephone=no\"&gt;</div>\n<div>\n<span style=\"white-space:pre;\"></span>&lt;meta name=\"viewport\" content=\"user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, width=device-width\"&gt;</div>\n<div>\n<span style=\"white-space:pre;\"></span>&lt;meta http-equiv=\"Content-Type\" content=\"text/html; charset=utf-8\"&gt;</div>\n<div>\n<span style=\"white-space:pre;\"></span>&lt;meta http-equiv=\"Content-Script-Type\" content=\"text/javascript\"&gt;</div>\n<div>\n<span style=\"white-space:pre;\"></span>&lt;meta http-equiv=\"Content-Style-Type\" content=\"text/css\"&gt;</div>\n<div><br></div>\n<div>\n<span style=\"white-space:pre;\"></span>&lt;style media=\"\" data-href=\"https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700,900\"&gt;/*# sourceURL=https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700,900 */</div>\n<div>/*@ sourceURL=https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700,900 */</div>\n<div>/* devanagari */</div>\n<div>@font-face {</div>\n<div>  font-family: \'Poppins\';</div>\n<div>  font-style: normal;</div>\n<div>  font-weight: 300;</div>\n<div>  src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLDz8Z11lFd2JQEl8qw.woff2) format(\'woff2\');</div>\n<div>  unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB;</div>\n<div>}</div>\n<div>/* latin-ext */</div>\n<div>@font-face {</div>\n<div>  font-family: \'Poppins\';</div>\n<div>  font-style: normal;</div>\n<div>  font-weight: 300;</div>\n<div>  src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLDz8Z1JlFd2JQEl8qw.woff2) format(\'woff2\');</div>\n<div>  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;</div>\n<div>}</div>\n<div>/* latin */</div>\n<div>@font-face {</div>\n<div>  font-family: \'Poppins\';</div>\n<div>  font-style: normal;</div>\n<div>  font-weight: 300;</div>\n<div>  src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLDz8Z1xlFd2JQEk.woff2) format(\'woff2\');</div>\n<div>  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;</div>\n<div>}</div>\n<div>/* devanagari */</div>\n<div>@font-face {</div>\n<div>  font-family: \'Poppins\';</div>\n<div>  font-style: normal;</div>\n<div>  font-weight: 400;</div>\n<div>  src: url(https://fonts.gstatic.com/s/poppins/v20/pxiEyp8kv8JHgFVrJJbecnFHGPezSQ.woff2) format(\'woff2\');</div>\n<div>  unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB;</div>\n<div>}</div>\n<div>/* latin-ext */</div>\n<div>@font-face {</div>\n<div>  font-family: \'Poppins\';</div>\n<div>  font-style: normal;</div>\n<div>  font-weight: 400;</div>\n<div>  src: url(https://fonts.gstatic.com/s/poppins/v20/pxiEyp8kv8JHgFVrJJnecnFHGPezSQ.woff2) format(\'woff2\');</div>\n<div>  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;</div>\n<div>}</div>\n<div>/* latin */</div>\n<div>@font-face {</div>\n<div>  font-family: \'Poppins\';</div>\n<div>  font-style: normal;</div>\n<div>  font-weight: 400;</div>\n<div>  src: url(https://fonts.gstatic.com/s/poppins/v20/pxiEyp8kv8JHgFVrJJfecnFHGPc.woff2) format(\'woff2\');</div>\n<div>  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;</div>\n<div>}</div>\n<div>/* devanagari */</div>\n<div>@font-face {</div>\n<div>  font-family: \'Poppins\';</div>\n<div>  font-style: normal;</div>\n<div>  font-weight: 500;</div>\n<div>  src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLGT9Z11lFd2JQEl8qw.woff2) format(\'woff2\');</div>\n<div>  unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB;</div>\n<div>}</div>\n<div>/* latin-ext */</div>\n<div>@font-face {</div>\n<div>  font-family: \'Poppins\';</div>\n<div>  font-style: normal;</div>\n<div>  font-weight: 500;</div>\n<div>  src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLGT9Z1JlFd2JQEl8qw.woff2) format(\'woff2\');</div>\n<div>  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;</div>\n<div>}</div>\n<div>/* latin */</div>\n<div>@font-face {</div>\n<div>  font-family: \'Poppins\';</div>\n<div>  font-style: normal;</div>\n<div>  font-weight: 500;</div>\n<div>  src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLGT9Z1xlFd2JQEk.woff2) format(\'woff2\');</div>\n<div>  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;</div>\n<div>}</div>\n<div>/* devanagari */</div>\n<div>@font-face {</div>\n<div>  font-family: \'Poppins\';</div>\n<div>  font-style: normal;</div>\n<div>  font-weight: 600;</div>\n<div>  src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLEj6Z11lFd2JQEl8qw.woff2) format(\'woff2\');</div>\n<div>  unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB;</div>\n<div>}</div>\n<div>/* latin-ext */</div>\n<div>@font-face {</div>\n<div>  font-family: \'Poppins\';</div>\n<div>  font-style: normal;</div>\n<div>  font-weight: 600;</div>\n<div>  src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLEj6Z1JlFd2JQEl8qw.woff2) format(\'woff2\');</div>\n<div>  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;</div>\n<div>}</div>\n<div>/* latin */</div>\n<div>@font-face {</div>\n<div>  font-family: \'Poppins\';</div>\n<div>  font-style: normal;</div>\n<div>  font-weight: 600;</div>\n<div>  src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLEj6Z1xlFd2JQEk.woff2) format(\'woff2\');</div>\n<div>  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;</div>\n<div>}</div>\n<div>/* devanagari */</div>\n<div>@font-face {</div>\n<div>  font-family: \'Poppins\';</div>\n<div>  font-style: normal;</div>\n<div>  font-weight: 700;</div>\n<div>  src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLCz7Z11lFd2JQEl8qw.woff2) format(\'woff2\');</div>\n<div>  unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB;</div>\n<div>}</div>\n<div>/* latin-ext */</div>\n<div>@font-face {</div>\n<div>  font-family: \'Poppins\';</div>\n<div>  font-style: normal;</div>\n<div>  font-weight: 700;</div>\n<div>  src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLCz7Z1JlFd2JQEl8qw.woff2) format(\'woff2\');</div>\n<div>  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;</div>\n<div>}</div>\n<div>/* latin */</div>\n<div>@font-face {</div>\n<div>  font-family: \'Poppins\';</div>\n<div>  font-style: normal;</div>\n<div>  font-weight: 700;</div>\n<div>  src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLCz7Z1xlFd2JQEk.woff2) format(\'woff2\');</div>\n<div>  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;</div>\n<div>}</div>\n<div>/* devanagari */</div>\n<div>@font-face {</div>\n<div>  font-family: \'Poppins\';</div>\n<div>  font-style: normal;</div>\n<div>  font-weight: 900;</div>\n<div>  src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLBT5Z11lFd2JQEl8qw.woff2) format(\'woff2\');</div>\n<div>  unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB;</div>\n<div>}</div>\n<div>/* latin-ext */</div>\n<div>@font-face {</div>\n<div>  font-family: \'Poppins\';</div>\n<div>  font-style: normal;</div>\n<div>  font-weight: 900;</div>\n<div>  src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLBT5Z1JlFd2JQEl8qw.woff2) format(\'woff2\');</div>\n<div>  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;</div>\n<div>}</div>\n<div>/* latin */</div>\n<div>@font-face {</div>\n<div>  font-family: \'Poppins\';</div>\n<div>  font-style: normal;</div>\n<div>  font-weight: 900;</div>\n<div>  src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLBT5Z1xlFd2JQEk.woff2) format(\'woff2\');</div>\n<div>  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;</div>\n<div>}</div>\n<div>&lt;/style&gt;</div>\n<div><br></div>\n<div>\n<span style=\"white-space:pre;\"></span>&lt;style media=\"\" data-href=\"/css/style.css\"&gt;/*# sourceURL=/css/style.css */</div>\n<div>/*@ sourceURL=/css/style.css */</div>\n<div>@charset \"utf-8\";</div>\n<div>@import url(\"https://behr.kr/css/base.css\");</div>\n<div>@import url(\"https://behr.kr/css/common.css\");</div>\n<div>@import url(\"https://behr.kr/css/main.css\");</div>\n<div>@import url(\"https://behr.kr/css/sub.css\");</div>\n<div>/* @import url(\"https://behr.kr/css/gallery.css\"); */&lt;/style&gt;</div>\n<div>\n<span style=\"white-space:pre;\"></span>&lt;style media=\"\" data-href=\"//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css\"&gt;/*# sourceURL=//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css */</div>\n<div>/*@ sourceURL=//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css */</div>\n<div>/*!</div>\n<div> *  Font Awesome 4.1.0 by @davegandy - http://fontawesome.io - @fontawesome</div>\n<div> *  License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)</div>\n<div> */@font-face{font-family:\'FontAwesome\';src:url(\"https://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/../fonts/fontawesome-webfont.eot?v=4.1.0\");src:url(\"https://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/../fonts/fontawesome-webfont.eot?#iefix&amp;v=4.1.0\") format(\'embedded-opentype\'),url(\"https://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/../fonts/fontawesome-webfont.woff?v=4.1.0\") format(\'woff\'),url(\"https://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/../fonts/fontawesome-webfont.ttf?v=4.1.0\") format(\'truetype\'),url(\"https://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/../fonts/fontawesome-webfont.svg?v=4.1.0#fontawesomeregular\") format(\'svg\');font-weight:normal;font-style:normal}.fa{display:inline-block;font-family:FontAwesome;font-style:normal;font-weight:normal;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.fa-lg{font-size:1.33333333em;line-height:.75em;vertical-align:-15%}.fa-2x{font-size:2em}.fa-3x{font-size:3em}.fa-4x{font-size:4em}.fa-5x{font-size:5em}.fa-fw{width:1.28571429em;text-align:center}.fa-ul{padding-left:0;margin-left:2.14285714em;list-style-type:none}.fa-ul&gt;li{position:relative}.fa-li{position:absolute;left:-2.14285714em;width:2.14285714em;top:.14285714em;text-align:center}.fa-li.fa-lg{left:-1.85714286em}.fa-border{padding:.2em .25em .15em;border:solid .08em #eee;border-radius:.1em}.pull-right{float:right}.pull-left{float:left}.fa.pull-left{margin-right:.3em}.fa.pull-right{margin-left:.3em}.fa-spin{-webkit-animation:spin 2s infinite linear;-moz-animation:spin 2s infinite linear;-o-animation:spin 2s infinite linear;animation:spin 2s infinite linear}@-moz-keyframes spin{0%{-moz-transform:rotate(0deg)}100%{-moz-transform:rotate(359deg)}}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg)}100%{-webkit-transform:rotate(359deg)}}@-o-keyframes spin{0%{-o-transform:rotate(0deg)}100%{-o-transform:rotate(359deg)}}@keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}.fa-rotate-90{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=1);-webkit-transform:rotate(90deg);-moz-transform:rotate(90deg);-ms-transform:rotate(90deg);-o-transform:rotate(90deg);transform:rotate(90deg)}.fa-rotate-180{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2);-webkit-transform:rotate(180deg);-moz-transform:rotate(180deg);-ms-transform:rotate(180deg);-o-transform:rotate(180deg);transform:rotate(180deg)}.fa-rotate-270{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);-webkit-transform:rotate(270deg);-moz-transform:rotate(270deg);-ms-transform:rotate(270deg);-o-transform:rotate(270deg);transform:rotate(270deg)}.fa-flip-horizontal{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1);-webkit-transform:scale(-1, 1);-moz-transform:scale(-1, 1);-ms-transform:scale(-1, 1);-o-transform:scale(-1, 1);transform:scale(-1, 1)}.fa-flip-vertical{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1);-webkit-transform:scale(1, -1);-moz-transform:scale(1, -1);-ms-transform:scale(1, -1);-o-transform:scale(1, -1);transform:scale(1, -1)}.fa-stack{position:relative;display:inline-block;width:2em;height:2em;line-height:2em;vertical-align:middle}.fa-stack-1x,.fa-stack-2x{position:absolute;left:0;width:100%;text-align:center}.fa-stack-1x{line-height:inherit}.fa-stack-2x{font-size:2em}.fa-inverse{color:#fff}.fa-glass:before{content:\"\\f000\"}.fa-music:before{content:\"\\f001\"}.fa-search:before{content:\"\\f002\"}.fa-envelope-o:before{content:\"\\f003\"}.fa-heart:before{content:\"\\f004\"}.fa-star:before{content:\"\\f005\"}.fa-star-o:before{content:\"\\f006\"}.fa-user:before{content:\"\\f007\"}.fa-film:before{content:\"\\f008\"}.fa-th-large:before{content:\"\\f009\"}.fa-th:before{content:\"\\f00a\"}.fa-th-list:before{content:\"\\f00b\"}.fa-check:before{content:\"\\f00c\"}.fa-times:before{content:\"\\f00d\"}.fa-search-plus:before{content:\"\\f00e\"}.fa-search-minus:before{content:\"\\f010\"}.fa-power-off:before{content:\"\\f011\"}.fa-signal:before{content:\"\\f012\"}.fa-gear:before,.fa-cog:before{content:\"\\f013\"}.fa-trash-o:before{content:\"\\f014\"}.fa-home:before{content:\"\\f015\"}.fa-file-o:before{content:\"\\f016\"}.fa-clock-o:before{content:\"\\f017\"}.fa-road:before{content:\"\\f018\"}.fa-download:before{content:\"\\f019\"}.fa-arrow-circle-o-down:before{content:\"\\f01a\"}.fa-arrow-circle-o-up:before{content:\"\\f01b\"}.fa-inbox:before{content:\"\\f01c\"}.fa-play-circle-o:before{content:\"\\f01d\"}.fa-rotate-right:before,.fa-repeat:before{content:\"\\f01e\"}.fa-refresh:before{content:\"\\f021\"}.fa-list-alt:before{content:\"\\f022\"}.fa-lock:before{content:\"\\f023\"}.fa-flag:before{content:\"\\f024\"}.fa-headphones:before{content:\"\\f025\"}.fa-volume-off:before{content:\"\\f026\"}.fa-volume-down:before{content:\"\\f027\"}.fa-volume-up:before{content:\"\\f028\"}.fa-qrcode:before{content:\"\\f029\"}.fa-barcode:before{content:\"\\f02a\"}.fa-tag:before{content:\"\\f02b\"}.fa-tags:before{content:\"\\f02c\"}.fa-book:before{content:\"\\f02d\"}.fa-bookmark:before{content:\"\\f02e\"}.fa-print:before{content:\"\\f02f\"}.fa-camera:before{content:\"\\f030\"}.fa-font:before{content:\"\\f031\"}.fa-bold:before{content:\"\\f032\"}.fa-italic:before{content:\"\\f033\"}.fa-text-height:before{content:\"\\f034\"}.fa-text-width:before{content:\"\\f035\"}.fa-align-left:before{content:\"\\f036\"}.fa-align-center:before{content:\"\\f037\"}.fa-align-right:before{content:\"\\f038\"}.fa-align-justify:before{content:\"\\f039\"}.fa-list:before{content:\"\\f03a\"}.fa-dedent:before,.fa-outdent:before{content:\"\\f03b\"}.fa-indent:before{content:\"\\f03c\"}.fa-video-camera:before{content:\"\\f03d\"}.fa-photo:before,.fa-image:before,.fa-picture-o:before{content:\"\\f03e\"}.fa-pencil:before{content:\"\\f040\"}.fa-map-marker:before{content:\"\\f041\"}.fa-adjust:before{content:\"\\f042\"}.fa-tint:before{content:\"\\f043\"}.fa-edit:before,.fa-pencil-square-o:before{content:\"\\f044\"}.fa-share-square-o:before{content:\"\\f045\"}.fa-check-square-o:before{content:\"\\f046\"}.fa-arrows:before{content:\"\\f047\"}.fa-step-backward:before{content:\"\\f048\"}.fa-fast-backward:before{content:\"\\f049\"}.fa-backward:before{content:\"\\f04a\"}.fa-play:before{content:\"\\f04b\"}.fa-pause:before{content:\"\\f04c\"}.fa-stop:before{content:\"\\f04d\"}.fa-forward:before{content:\"\\f04e\"}.fa-fast-forward:before{content:\"\\f050\"}.fa-step-forward:before{content:\"\\f051\"}.fa-eject:before{content:\"\\f052\"}.fa-chevron-left:before{content:\"\\f053\"}.fa-chevron-right:before{content:\"\\f054\"}.fa-plus-circle:before{content:\"\\f055\"}.fa-minus-circle:before{content:\"\\f056\"}.fa-times-circle:before{content:\"\\f057\"}.fa-check-circle:before{content:\"\\f058\"}.fa-question-circle:before{content:\"\\f059\"}.fa-info-circle:before{content:\"\\f05a\"}.fa-crosshairs:before{content:\"\\f05b\"}.fa-times-circle-o:before{content:\"\\f05c\"}.fa-check-circle-o:before{content:\"\\f05d\"}.fa-ban:before{content:\"\\f05e\"}.fa-arrow-left:before{content:\"\\f060\"}.fa-arrow-right:before{content:\"\\f061\"}.fa-arrow-up:before{content:\"\\f062\"}.fa-arrow-down:before{content:\"\\f063\"}.fa-mail-forward:before,.fa-share:before{content:\"\\f064\"}.fa-expand:before{content:\"\\f065\"}.fa-compress:before{content:\"\\f066\"}.fa-plus:before{content:\"\\f067\"}.fa-minus:before{content:\"\\f068\"}.fa-asterisk:before{content:\"\\f069\"}.fa-exclamation-circle:before{content:\"\\f06a\"}.fa-gift:before{content:\"\\f06b\"}.fa-leaf:before{content:\"\\f06c\"}.fa-fire:before{content:\"\\f06d\"}.fa-eye:before{content:\"\\f06e\"}.fa-eye-slash:before{content:\"\\f070\"}.fa-warning:before,.fa-exclamation-triangle:before{content:\"\\f071\"}.fa-plane:before{content:\"\\f072\"}.fa-calendar:before{content:\"\\f073\"}.fa-random:before{content:\"\\f074\"}.fa-comment:before{content:\"\\f075\"}.fa-magnet:before{content:\"\\f076\"}.fa-chevron-up:before{content:\"\\f077\"}.fa-chevron-down:before{content:\"\\f078\"}.fa-retweet:before{content:\"\\f079\"}.fa-shopping-cart:before{content:\"\\f07a\"}.fa-folder:before{content:\"\\f07b\"}.fa-folder-open:before{content:\"\\f07c\"}.fa-arrows-v:before{content:\"\\f07d\"}.fa-arrows-h:before{content:\"\\f07e\"}.fa-bar-chart-o:before{content:\"\\f080\"}.fa-twitter-square:before{content:\"\\f081\"}.fa-facebook-square:before{content:\"\\f082\"}.fa-camera-retro:before{content:\"\\f083\"}.fa-key:before{content:\"\\f084\"}.fa-gears:before,.fa-cogs:before{content:\"\\f085\"}.fa-comments:before{content:\"\\f086\"}.fa-thumbs-o-up:before{content:\"\\f087\"}.fa-thumbs-o-down:before{content:\"\\f088\"}.fa-star-half:before{content:\"\\f089\"}.fa-heart-o:before{content:\"\\f08a\"}.fa-sign-out:before{content:\"\\f08b\"}.fa-linkedin-square:before{content:\"\\f08c\"}.fa-thumb-tack:before{content:\"\\f08d\"}.fa-external-link:before{content:\"\\f08e\"}.fa-sign-in:before{content:\"\\f090\"}.fa-trophy:before{content:\"\\f091\"}.fa-github-square:before{content:\"\\f092\"}.fa-upload:before{content:\"\\f093\"}.fa-lemon-o:before{content:\"\\f094\"}.fa-phone:before{content:\"\\f095\"}.fa-square-o:before{content:\"\\f096\"}.fa-bookmark-o:before{content:\"\\f097\"}.fa-phone-square:before{content:\"\\f098\"}.fa-twitter:before{content:\"\\f099\"}.fa-facebook:before{content:\"\\f09a\"}.fa-github:before{content:\"\\f09b\"}.fa-unlock:before{content:\"\\f09c\"}.fa-credit-card:before{content:\"\\f09d\"}.fa-rss:before{content:\"\\f09e\"}.fa-hdd-o:before{content:\"\\f0a0\"}.fa-bullhorn:before{content:\"\\f0a1\"}.fa-bell:before{content:\"\\f0f3\"}.fa-certificate:before{content:\"\\f0a3\"}.fa-hand-o-right:before{content:\"\\f0a4\"}.fa-hand-o-left:before{content:\"\\f0a5\"}.fa-hand-o-up:before{content:\"\\f0a6\"}.fa-hand-o-down:before{content:\"\\f0a7\"}.fa-arrow-circle-left:before{content:\"\\f0a8\"}.fa-arrow-circle-right:before{content:\"\\f0a9\"}.fa-arrow-circle-up:before{content:\"\\f0aa\"}.fa-arrow-circle-down:before{content:\"\\f0ab\"}.fa-globe:before{content:\"\\f0ac\"}.fa-wrench:before{content:\"\\f0ad\"}.fa-tasks:before{content:\"\\f0ae\"}.fa-filter:before{content:\"\\f0b0\"}.fa-briefcase:before{content:\"\\f0b1\"}.fa-arrows-alt:before{content:\"\\f0b2\"}.fa-group:before,.fa-users:before{content:\"\\f0c0\"}.fa-chain:before,.fa-link:before{content:\"\\f0c1\"}.fa-cloud:before{content:\"\\f0c2\"}.fa-flask:before{content:\"\\f0c3\"}.fa-cut:before,.fa-scissors:before{content:\"\\f0c4\"}.fa-copy:before,.fa-files-o:before{content:\"\\f0c5\"}.fa-paperclip:before{content:\"\\f0c6\"}.fa-save:before,.fa-floppy-o:before{content:\"\\f0c7\"}.fa-square:before{content:\"\\f0c8\"}.fa-navicon:before,.fa-reorder:before,.fa-bars:before{content:\"\\f0c9\"}.fa-list-ul:before{content:\"\\f0ca\"}.fa-list-ol:before{content:\"\\f0cb\"}.fa-strikethrough:before{content:\"\\f0cc\"}.fa-underline:before{content:\"\\f0cd\"}.fa-table:before{content:\"\\f0ce\"}.fa-magic:before{content:\"\\f0d0\"}.fa-truck:before{content:\"\\f0d1\"}.fa-pinterest:before{content:\"\\f0d2\"}.fa-pinterest-square:before{content:\"\\f0d3\"}.fa-google-plus-square:before{content:\"\\f0d4\"}.fa-google-plus:before{content:\"\\f0d5\"}.fa-money:before{content:\"\\f0d6\"}.fa-caret-down:before{content:\"\\f0d7\"}.fa-caret-up:before{content:\"\\f0d8\"}.fa-caret-left:before{content:\"\\f0d9\"}.fa-caret-right:before{content:\"\\f0da\"}.fa-columns:before{content:\"\\f0db\"}.fa-unsorted:before,.fa-sort:before{content:\"\\f0dc\"}.fa-sort-down:before,.fa-sort-desc:before{content:\"\\f0dd\"}.fa-sort-up:before,.fa-sort-asc:before{content:\"\\f0de\"}.fa-envelope:before{content:\"\\f0e0\"}.fa-linkedin:before{content:\"\\f0e1\"}.fa-rotate-left:before,.fa-undo:before{content:\"\\f0e2\"}.fa-legal:before,.fa-gavel:before{content:\"\\f0e3\"}.fa-dashboard:before,.fa-tachometer:before{content:\"\\f0e4\"}.fa-comment-o:before{content:\"\\f0e5\"}.fa-comments-o:before{content:\"\\f0e6\"}.fa-flash:before,.fa-bolt:before{content:\"\\f0e7\"}.fa-sitemap:before{content:\"\\f0e8\"}.fa-umbrella:before{content:\"\\f0e9\"}.fa-paste:before,.fa-clipboard:before{content:\"\\f0ea\"}.fa-lightbulb-o:before{content:\"\\f0eb\"}.fa-exchange:before{content:\"\\f0ec\"}.fa-cloud-download:before{content:\"\\f0ed\"}.fa-cloud-upload:before{content:\"\\f0ee\"}.fa-user-md:before{content:\"\\f0f0\"}.fa-stethoscope:before{content:\"\\f0f1\"}.fa-suitcase:before{content:\"\\f0f2\"}.fa-bell-o:before{content:\"\\f0a2\"}.fa-coffee:before{content:\"\\f0f4\"}.fa-cutlery:before{content:\"\\f0f5\"}.fa-file-text-o:before{content:\"\\f0f6\"}.fa-building-o:before{content:\"\\f0f7\"}.fa-hospital-o:before{content:\"\\f0f8\"}.fa-ambulance:before{content:\"\\f0f9\"}.fa-medkit:before{content:\"\\f0fa\"}.fa-fighter-jet:before{content:\"\\f0fb\"}.fa-beer:before{content:\"\\f0fc\"}.fa-h-square:before{content:\"\\f0fd\"}.fa-plus-square:before{content:\"\\f0fe\"}.fa-angle-double-left:before{content:\"\\f100\"}.fa-angle-double-right:before{content:\"\\f101\"}.fa-angle-double-up:before{content:\"\\f102\"}.fa-angle-double-down:before{content:\"\\f103\"}.fa-angle-left:before{content:\"\\f104\"}.fa-angle-right:before{content:\"\\f105\"}.fa-angle-up:before{content:\"\\f106\"}.fa-angle-down:before{content:\"\\f107\"}.fa-desktop:before{content:\"\\f108\"}.fa-laptop:before{content:\"\\f109\"}.fa-tablet:before{content:\"\\f10a\"}.fa-mobile-phone:before,.fa-mobile:before{content:\"\\f10b\"}.fa-circle-o:before{content:\"\\f10c\"}.fa-quote-left:before{content:\"\\f10d\"}.fa-quote-right:before{content:\"\\f10e\"}.fa-spinner:before{content:\"\\f110\"}.fa-circle:before{content:\"\\f111\"}.fa-mail-reply:before,.fa-reply:before{content:\"\\f112\"}.fa-github-alt:before{content:\"\\f113\"}.fa-folder-o:before{content:\"\\f114\"}.fa-folder-open-o:before{content:\"\\f115\"}.fa-smile-o:before{content:\"\\f118\"}.fa-frown-o:before{content:\"\\f119\"}.fa-meh-o:before{content:\"\\f11a\"}.fa-gamepad:before{content:\"\\f11b\"}.fa-keyboard-o:before{content:\"\\f11c\"}.fa-flag-o:before{content:\"\\f11d\"}.fa-flag-checkered:before{content:\"\\f11e\"}.fa-terminal:before{content:\"\\f120\"}.fa-code:before{content:\"\\f121\"}.fa-mail-reply-all:before,.fa-reply-all:before{content:\"\\f122\"}.fa-star-half-empty:before,.fa-star-half-full:before,.fa-star-half-o:before{content:\"\\f123\"}.fa-location-arrow:before{content:\"\\f124\"}.fa-crop:before{content:\"\\f125\"}.fa-code-fork:before{content:\"\\f126\"}.fa-unlink:before,.fa-chain-broken:before{content:\"\\f127\"}.fa-question:before{content:\"\\f128\"}.fa-info:before{content:\"\\f129\"}.fa-exclamation:before{content:\"\\f12a\"}.fa-superscript:before{content:\"\\f12b\"}.fa-subscript:before{content:\"\\f12c\"}.fa-eraser:before{content:\"\\f12d\"}.fa-puzzle-piece:before{content:\"\\f12e\"}.fa-microphone:before{content:\"\\f130\"}.fa-microphone-slash:before{content:\"\\f131\"}.fa-shield:before{content:\"\\f132\"}.fa-calendar-o:before{content:\"\\f133\"}.fa-fire-extinguisher:before{content:\"\\f134\"}.fa-rocket:before{content:\"\\f135\"}.fa-maxcdn:before{content:\"\\f136\"}.fa-chevron-circle-left:before{content:\"\\f137\"}.fa-chevron-circle-right:before{content:\"\\f138\"}.fa-chevron-circle-up:before{content:\"\\f139\"}.fa-chevron-circle-down:before{content:\"\\f13a\"}.fa-html5:before{content:\"\\f13b\"}.fa-css3:before{content:\"\\f13c\"}.fa-anchor:before{content:\"\\f13d\"}.fa-unlock-alt:before{content:\"\\f13e\"}.fa-bullseye:before{content:\"\\f140\"}.fa-ellipsis-h:before{content:\"\\f141\"}.fa-ellipsis-v:before{content:\"\\f142\"}.fa-rss-square:before{content:\"\\f143\"}.fa-play-circle:before{content:\"\\f144\"}.fa-ticket:before{content:\"\\f145\"}.fa-minus-square:before{content:\"\\f146\"}.fa-minus-square-o:before{content:\"\\f147\"}.fa-level-up:before{content:\"\\f148\"}.fa-level-down:before{content:\"\\f149\"}.fa-check-square:before{content:\"\\f14a\"}.fa-pencil-square:before{content:\"\\f14b\"}.fa-external-link-square:before{content:\"\\f14c\"}.fa-share-square:before{content:\"\\f14d\"}.fa-compass:before{content:\"\\f14e\"}.fa-toggle-down:before,.fa-caret-square-o-down:before{content:\"\\f150\"}.fa-toggle-up:before,.fa-caret-square-o-up:before{content:\"\\f151\"}.fa-toggle-right:before,.fa-caret-square-o-right:before{content:\"\\f152\"}.fa-euro:before,.fa-eur:before{content:\"\\f153\"}.fa-gbp:before{content:\"\\f154\"}.fa-dollar:before,.fa-usd:before{content:\"\\f155\"}.fa-rupee:before,.fa-inr:before{content:\"\\f156\"}.fa-cny:before,.fa-rmb:before,.fa-yen:before,.fa-jpy:before{content:\"\\f157\"}.fa-ruble:before,.fa-rouble:before,.fa-rub:before{content:\"\\f158\"}.fa-won:before,.fa-krw:before{content:\"\\f159\"}.fa-bitcoin:before,.fa-btc:before{content:\"\\f15a\"}.fa-file:before{content:\"\\f15b\"}.fa-file-text:before{content:\"\\f15c\"}.fa-sort-alpha-asc:before{content:\"\\f15d\"}.fa-sort-alpha-desc:before{content:\"\\f15e\"}.fa-sort-amount-asc:before{content:\"\\f160\"}.fa-sort-amount-desc:before{content:\"\\f161\"}.fa-sort-numeric-asc:before{content:\"\\f162\"}.fa-sort-numeric-desc:before{content:\"\\f163\"}.fa-thumbs-up:before{content:\"\\f164\"}.fa-thumbs-down:before{content:\"\\f165\"}.fa-youtube-square:before{content:\"\\f166\"}.fa-youtube:before{content:\"\\f167\"}.fa-xing:before{content:\"\\f168\"}.fa-xing-square:before{content:\"\\f169\"}.fa-youtube-play:before{content:\"\\f16a\"}.fa-dropbox:before{content:\"\\f16b\"}.fa-stack-overflow:before{content:\"\\f16c\"}.fa-instagram:before{content:\"\\f16d\"}.fa-flickr:before{content:\"\\f16e\"}.fa-adn:before{content:\"\\f170\"}.fa-bitbucket:before{content:\"\\f171\"}.fa-bitbucket-square:before{content:\"\\f172\"}.fa-tumblr:before{content:\"\\f173\"}.fa-tumblr-square:before{content:\"\\f174\"}.fa-long-arrow-down:before{content:\"\\f175\"}.fa-long-arrow-up:before{content:\"\\f176\"}.fa-long-arrow-left:before{content:\"\\f177\"}.fa-long-arrow-right:before{content:\"\\f178\"}.fa-apple:before{content:\"\\f179\"}.fa-windows:before{content:\"\\f17a\"}.fa-android:before{content:\"\\f17b\"}.fa-linux:before{content:\"\\f17c\"}.fa-dribbble:before{content:\"\\f17d\"}.fa-skype:before{content:\"\\f17e\"}.fa-foursquare:before{content:\"\\f180\"}.fa-trello:before{content:\"\\f181\"}.fa-female:before{content:\"\\f182\"}.fa-male:before{content:\"\\f183\"}.fa-gittip:before{content:\"\\f184\"}.fa-sun-o:before{content:\"\\f185\"}.fa-moon-o:before{content:\"\\f186\"}.fa-archive:before{content:\"\\f187\"}.fa-bug:before{content:\"\\f188\"}.fa-vk:before{content:\"\\f189\"}.fa-weibo:before{content:\"\\f18a\"}.fa-renren:before{content:\"\\f18b\"}.fa-pagelines:before{content:\"\\f18c\"}.fa-stack-exchange:before{content:\"\\f18d\"}.fa-arrow-circle-o-right:before{content:\"\\f18e\"}.fa-arrow-circle-o-left:before{content:\"\\f190\"}.fa-toggle-left:before,.fa-caret-square-o-left:before{content:\"\\f191\"}.fa-dot-circle-o:before{content:\"\\f192\"}.fa-wheelchair:before{content:\"\\f193\"}.fa-vimeo-square:before{content:\"\\f194\"}.fa-turkish-lira:before,.fa-try:before{content:\"\\f195\"}.fa-plus-square-o:before{content:\"\\f196\"}.fa-space-shuttle:before{content:\"\\f197\"}.fa-slack:before{content:\"\\f198\"}.fa-envelope-square:before{content:\"\\f199\"}.fa-wordpress:before{content:\"\\f19a\"}.fa-openid:before{content:\"\\f19b\"}.fa-institution:before,.fa-bank:before,.fa-university:before{content:\"\\f19c\"}.fa-mortar-board:before,.fa-graduation-cap:before{content:\"\\f19d\"}.fa-yahoo:before{content:\"\\f19e\"}.fa-google:before{content:\"\\f1a0\"}.fa-reddit:before{content:\"\\f1a1\"}.fa-reddit-square:before{content:\"\\f1a2\"}.fa-stumbleupon-circle:before{content:\"\\f1a3\"}.fa-stumbleupon:before{content:\"\\f1a4\"}.fa-delicious:before{content:\"\\f1a5\"}.fa-digg:before{content:\"\\f1a6\"}.fa-pied-piper-square:before,.fa-pied-piper:before{content:\"\\f1a7\"}.fa-pied-piper-alt:before{content:\"\\f1a8\"}.fa-drupal:before{content:\"\\f1a9\"}.fa-joomla:before{content:\"\\f1aa\"}.fa-language:before{content:\"\\f1ab\"}.fa-fax:before{content:\"\\f1ac\"}.fa-building:before{content:\"\\f1ad\"}.fa-child:before{content:\"\\f1ae\"}.fa-paw:before{content:\"\\f1b0\"}.fa-spoon:before{content:\"\\f1b1\"}.fa-cube:before{content:\"\\f1b2\"}.fa-cubes:before{content:\"\\f1b3\"}.fa-behance:before{content:\"\\f1b4\"}.fa-behance-square:before{content:\"\\f1b5\"}.fa-steam:before{content:\"\\f1b6\"}.fa-steam-square:before{content:\"\\f1b7\"}.fa-recycle:before{content:\"\\f1b8\"}.fa-automobile:before,.fa-car:before{content:\"\\f1b9\"}.fa-cab:before,.fa-taxi:before{content:\"\\f1ba\"}.fa-tree:before{content:\"\\f1bb\"}.fa-spotify:before{content:\"\\f1bc\"}.fa-deviantart:before{content:\"\\f1bd\"}.fa-soundcloud:before{content:\"\\f1be\"}.fa-database:before{content:\"\\f1c0\"}.fa-file-pdf-o:before{content:\"\\f1c1\"}.fa-file-word-o:before{content:\"\\f1c2\"}.fa-file-excel-o:before{content:\"\\f1c3\"}.fa-file-powerpoint-o:before{content:\"\\f1c4\"}.fa-file-photo-o:before,.fa-file-picture-o:before,.fa-file-image-o:before{content:\"\\f1c5\"}.fa-file-zip-o:before,.fa-file-archive-o:before{content:\"\\f1c6\"}.fa-file-sound-o:before,.fa-file-audio-o:before{content:\"\\f1c7\"}.fa-file-movie-o:before,.fa-file-video-o:before{content:\"\\f1c8\"}.fa-file-code-o:before{content:\"\\f1c9\"}.fa-vine:before{content:\"\\f1ca\"}.fa-codepen:before{content:\"\\f1cb\"}.fa-jsfiddle:before{content:\"\\f1cc\"}.fa-life-bouy:before,.fa-life-saver:before,.fa-support:before,.fa-life-ring:before{content:\"\\f1cd\"}.fa-circle-o-notch:before{content:\"\\f1ce\"}.fa-ra:before,.fa-rebel:before{content:\"\\f1d0\"}.fa-ge:before,.fa-empire:before{content:\"\\f1d1\"}.fa-git-square:before{content:\"\\f1d2\"}.fa-git:before{content:\"\\f1d3\"}.fa-hacker-news:before{content:\"\\f1d4\"}.fa-tencent-weibo:before{content:\"\\f1d5\"}.fa-qq:before{content:\"\\f1d6\"}.fa-wechat:before,.fa-weixin:before{content:\"\\f1d7\"}.fa-send:before,.fa-paper-plane:before{content:\"\\f1d8\"}.fa-send-o:before,.fa-paper-plane-o:before{content:\"\\f1d9\"}.fa-history:before{content:\"\\f1da\"}.fa-circle-thin:before{content:\"\\f1db\"}.fa-header:before{content:\"\\f1dc\"}.fa-paragraph:before{content:\"\\f1dd\"}.fa-sliders:before{content:\"\\f1de\"}.fa-share-alt:before{content:\"\\f1e0\"}.fa-share-alt-square:before{content:\"\\f1e1\"}.fa-bomb:before{content:\"\\f1e2\"}&lt;/style&gt;</div>\n<div><br></div>\n<div>\n<span style=\"white-space:pre;\"></span>&lt;script src=\"/js/jquery-1.8.3.min.js\"&gt;&lt;/script&gt;</div>\n<div>\n<span style=\"white-space:pre;\"></span>&lt;script src=\"/js/prefixfree.min.js\"&gt;&lt;/script&gt;</div>\n<div>\n<span style=\"white-space:pre;\"></span>&lt;script src=\"/js/common.js\"&gt;&lt;/script&gt;</div>\n<div>\n<span style=\"white-space:pre;\"></span>&lt;!--//스크롤--&gt;</div>\n<div>\n<span style=\"white-space:pre;\"></span>&lt;script src=\"/js/scrollIt.js\"&gt;&lt;/script&gt;</div>\n<div><br></div>\n<div>\n<span style=\"white-space:pre;\"></span>&lt;!--text animation--&gt;</div>\n<div>\n<span style=\"white-space:pre;\"></span>&lt;script src=\"/js/jquery.fittext.js\"&gt;&lt;/script&gt;</div>\n<div>\n<span style=\"white-space:pre;\"></span>&lt;script src=\"/js/jquery.lettering.js\"&gt;&lt;/script&gt;</div>\n<div>\n<span style=\"white-space:pre;\"></span>&lt;script src=\"/js/jquery.textillate.js\"&gt;&lt;/script&gt;</div>\n<div>\n<span style=\"white-space:pre;\"></span>&lt;style media=\"\" data-href=\"/css/text_animation.css\"&gt;/*# sourceURL=/css/text_animation.css */</div>\n<div>/*@ sourceURL=/css/text_animation.css */</div>\n<div><br></div>\n<div><br></div>\n<div>@charset \"UTF-8\";</div>\n<div>/*</div>\n<div>Animate.css - http://daneden.me/animate</div>\n<div>Licensed under the ☺ license (http://licence.visualidiot.com/)</div>\n<div><br></div>\n<div>Copyright (c) 2012 Dan Eden</div>\n<div><br></div>\n<div>Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the \"Software\"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:</div>\n<div><br></div>\n<div>The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.</div>\n<div><br></div>\n<div>THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.</div>\n<div>*/</div>\n<div>body { /* Addresses a small issue in webkit: http://bit.ly/NEdoDq */</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-backface-visibility: hidden;</div>\n<div>}</div>\n<div>.animated {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-duration: 1s;</div>\n<div>\n<span style=\"white-space:pre;\"></span>   -moz-animation-duration: 1s;</div>\n<div>\n<span style=\"white-space:pre;\"></span>     -o-animation-duration: 1s;</div>\n<div>\n<span style=\"white-space:pre;\"></span>        animation-duration: 1s;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-fill-mode: both;</div>\n<div>\n<span style=\"white-space:pre;\"></span>   -moz-animation-fill-mode: both;</div>\n<div>\n<span style=\"white-space:pre;\"></span>     -o-animation-fill-mode: both;</div>\n<div>\n<span style=\"white-space:pre;\"></span>        animation-fill-mode: both;</div>\n<div>}</div>\n<div><br></div>\n<div>.animated.hinge {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-duration: 2s;</div>\n<div>\n<span style=\"white-space:pre;\"></span>   -moz-animation-duration: 2s;</div>\n<div>\n<span style=\"white-space:pre;\"></span>     -o-animation-duration: 2s;</div>\n<div>\n<span style=\"white-space:pre;\"></span>        animation-duration: 2s;</div>\n<div>}</div>\n<div><br></div>\n<div>@-webkit-keyframes flash {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0%, 50%, 100% {opacity: 1;} <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>25%, 75% {opacity: 0;}</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes flash {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0%, 50%, 100% {opacity: 1;} <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>25%, 75% {opacity: 0;}</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes flash {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0%, 50%, 100% {opacity: 1;} <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>25%, 75% {opacity: 0;}</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes flash {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0%, 50%, 100% {opacity: 1;} <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>25%, 75% {opacity: 0;}</div>\n<div>}</div>\n<div><br></div>\n<div>.flash {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: flash;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: flash;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: flash;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: flash;</div>\n<div>}</div>\n<div>@-webkit-keyframes shake {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0%, 100% {-webkit-transform: translateX(0);}</div>\n<div>\n<span style=\"white-space:pre;\"></span>10%, 30%, 50%, 70%, 90% {-webkit-transform: translateX(-10px);}</div>\n<div>\n<span style=\"white-space:pre;\"></span>20%, 40%, 60%, 80% {-webkit-transform: translateX(10px);}</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes shake {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0%, 100% {-moz-transform: translateX(0);}</div>\n<div>\n<span style=\"white-space:pre;\"></span>10%, 30%, 50%, 70%, 90% {-moz-transform: translateX(-10px);}</div>\n<div>\n<span style=\"white-space:pre;\"></span>20%, 40%, 60%, 80% {-moz-transform: translateX(10px);}</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes shake {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0%, 100% {-o-transform: translateX(0);}</div>\n<div>\n<span style=\"white-space:pre;\"></span>10%, 30%, 50%, 70%, 90% {-o-transform: translateX(-10px);}</div>\n<div>\n<span style=\"white-space:pre;\"></span>20%, 40%, 60%, 80% {-o-transform: translateX(10px);}</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes shake {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0%, 100% {transform: translateX(0);}</div>\n<div>\n<span style=\"white-space:pre;\"></span>10%, 30%, 50%, 70%, 90% {transform: translateX(-10px);}</div>\n<div>\n<span style=\"white-space:pre;\"></span>20%, 40%, 60%, 80% {transform: translateX(10px);}</div>\n<div>}</div>\n<div><br></div>\n<div>.shake {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: shake;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: shake;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: shake;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: shake;</div>\n<div>}</div>\n<div>@-webkit-keyframes bounce {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0%, 20%, 50%, 80%, 100% {-webkit-transform: translateY(0);}</div>\n<div>\n<span style=\"white-space:pre;\"></span>40% {-webkit-transform: translateY(-30px);}</div>\n<div>\n<span style=\"white-space:pre;\"></span>60% {-webkit-transform: translateY(-15px);}</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes bounce {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0%, 20%, 50%, 80%, 100% {-moz-transform: translateY(0);}</div>\n<div>\n<span style=\"white-space:pre;\"></span>40% {-moz-transform: translateY(-30px);}</div>\n<div>\n<span style=\"white-space:pre;\"></span>60% {-moz-transform: translateY(-15px);}</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes bounce {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0%, 20%, 50%, 80%, 100% {-o-transform: translateY(0);}</div>\n<div>\n<span style=\"white-space:pre;\"></span>40% {-o-transform: translateY(-30px);}</div>\n<div>\n<span style=\"white-space:pre;\"></span>60% {-o-transform: translateY(-15px);}</div>\n<div>}</div>\n<div>@keyframes bounce {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0%, 20%, 50%, 80%, 100% {transform: translateY(0);}</div>\n<div>\n<span style=\"white-space:pre;\"></span>40% {transform: translateY(-30px);}</div>\n<div>\n<span style=\"white-space:pre;\"></span>60% {transform: translateY(-15px);}</div>\n<div>}</div>\n<div><br></div>\n<div>.bounce {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: bounce;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: bounce;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: bounce;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: bounce;</div>\n<div>}</div>\n<div>@-webkit-keyframes tada {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {-webkit-transform: scale(1);} <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>10%, 20% {-webkit-transform: scale(0.9) rotate(-3deg);}</div>\n<div>\n<span style=\"white-space:pre;\"></span>30%, 50%, 70%, 90% {-webkit-transform: scale(1.1) rotate(3deg);}</div>\n<div>\n<span style=\"white-space:pre;\"></span>40%, 60%, 80% {-webkit-transform: scale(1.1) rotate(-3deg);}</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {-webkit-transform: scale(1) rotate(0);}</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes tada {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {-moz-transform: scale(1);} <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>10%, 20% {-moz-transform: scale(0.9) rotate(-3deg);}</div>\n<div>\n<span style=\"white-space:pre;\"></span>30%, 50%, 70%, 90% {-moz-transform: scale(1.1) rotate(3deg);}</div>\n<div>\n<span style=\"white-space:pre;\"></span>40%, 60%, 80% {-moz-transform: scale(1.1) rotate(-3deg);}</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {-moz-transform: scale(1) rotate(0);}</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes tada {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {-o-transform: scale(1);} <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>10%, 20% {-o-transform: scale(0.9) rotate(-3deg);}</div>\n<div>\n<span style=\"white-space:pre;\"></span>30%, 50%, 70%, 90% {-o-transform: scale(1.1) rotate(3deg);}</div>\n<div>\n<span style=\"white-space:pre;\"></span>40%, 60%, 80% {-o-transform: scale(1.1) rotate(-3deg);}</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {-o-transform: scale(1) rotate(0);}</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes tada {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {transform: scale(1);} <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>10%, 20% {transform: scale(0.9) rotate(-3deg);}</div>\n<div>\n<span style=\"white-space:pre;\"></span>30%, 50%, 70%, 90% {transform: scale(1.1) rotate(3deg);}</div>\n<div>\n<span style=\"white-space:pre;\"></span>40%, 60%, 80% {transform: scale(1.1) rotate(-3deg);}</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {transform: scale(1) rotate(0);}</div>\n<div>}</div>\n<div><br></div>\n<div>.tada {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: tada;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: tada;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: tada;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: tada;</div>\n<div>}</div>\n<div>@-webkit-keyframes swing {</div>\n<div>\n<span style=\"white-space:pre;\"></span>20%, 40%, 60%, 80%, 100% { -webkit-transform-origin: top center; }</div>\n<div>\n<span style=\"white-space:pre;\"></span>20% { -webkit-transform: rotate(15deg); } <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>40% { -webkit-transform: rotate(-10deg); }</div>\n<div>\n<span style=\"white-space:pre;\"></span>60% { -webkit-transform: rotate(5deg); } <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>80% { -webkit-transform: rotate(-5deg); } <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% { -webkit-transform: rotate(0deg); }</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes swing {</div>\n<div>\n<span style=\"white-space:pre;\"></span>20% { -moz-transform: rotate(15deg); } <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>40% { -moz-transform: rotate(-10deg); }</div>\n<div>\n<span style=\"white-space:pre;\"></span>60% { -moz-transform: rotate(5deg); } <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>80% { -moz-transform: rotate(-5deg); } <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% { -moz-transform: rotate(0deg); }</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes swing {</div>\n<div>\n<span style=\"white-space:pre;\"></span>20% { -o-transform: rotate(15deg); } <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>40% { -o-transform: rotate(-10deg); }</div>\n<div>\n<span style=\"white-space:pre;\"></span>60% { -o-transform: rotate(5deg); } <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>80% { -o-transform: rotate(-5deg); } <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% { -o-transform: rotate(0deg); }</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes swing {</div>\n<div>\n<span style=\"white-space:pre;\"></span>20% { transform: rotate(15deg); } <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>40% { transform: rotate(-10deg); }</div>\n<div>\n<span style=\"white-space:pre;\"></span>60% { transform: rotate(5deg); } <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>80% { transform: rotate(-5deg); } <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% { transform: rotate(0deg); }</div>\n<div>}</div>\n<div><br></div>\n<div>.swing {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform-origin: top center;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform-origin: top center;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform-origin: top center;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform-origin: top center;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: swing;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: swing;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: swing;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: swing;</div>\n<div>}</div>\n<div>/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */</div>\n<div><br></div>\n<div>@-webkit-keyframes wobble {</div>\n<div>  0% { -webkit-transform: translateX(0%); }</div>\n<div>  15% { -webkit-transform: translateX(-25%) rotate(-5deg); }</div>\n<div>  30% { -webkit-transform: translateX(20%) rotate(3deg); }</div>\n<div>  45% { -webkit-transform: translateX(-15%) rotate(-3deg); }</div>\n<div>  60% { -webkit-transform: translateX(10%) rotate(2deg); }</div>\n<div>  75% { -webkit-transform: translateX(-5%) rotate(-1deg); }</div>\n<div>  100% { -webkit-transform: translateX(0%); }</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes wobble {</div>\n<div>  0% { -moz-transform: translateX(0%); }</div>\n<div>  15% { -moz-transform: translateX(-25%) rotate(-5deg); }</div>\n<div>  30% { -moz-transform: translateX(20%) rotate(3deg); }</div>\n<div>  45% { -moz-transform: translateX(-15%) rotate(-3deg); }</div>\n<div>  60% { -moz-transform: translateX(10%) rotate(2deg); }</div>\n<div>  75% { -moz-transform: translateX(-5%) rotate(-1deg); }</div>\n<div>  100% { -moz-transform: translateX(0%); }</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes wobble {</div>\n<div>  0% { -o-transform: translateX(0%); }</div>\n<div>  15% { -o-transform: translateX(-25%) rotate(-5deg); }</div>\n<div>  30% { -o-transform: translateX(20%) rotate(3deg); }</div>\n<div>  45% { -o-transform: translateX(-15%) rotate(-3deg); }</div>\n<div>  60% { -o-transform: translateX(10%) rotate(2deg); }</div>\n<div>  75% { -o-transform: translateX(-5%) rotate(-1deg); }</div>\n<div>  100% { -o-transform: translateX(0%); }</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes wobble {</div>\n<div>  0% { transform: translateX(0%); }</div>\n<div>  15% { transform: translateX(-25%) rotate(-5deg); }</div>\n<div>  30% { transform: translateX(20%) rotate(3deg); }</div>\n<div>  45% { transform: translateX(-15%) rotate(-3deg); }</div>\n<div>  60% { transform: translateX(10%) rotate(2deg); }</div>\n<div>  75% { transform: translateX(-5%) rotate(-1deg); }</div>\n<div>  100% { transform: translateX(0%); }</div>\n<div>}</div>\n<div><br></div>\n<div>.wobble {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: wobble;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: wobble;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: wobble;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: wobble;</div>\n<div>}</div>\n<div>/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */</div>\n<div><br></div>\n<div>@-webkit-keyframes pulse {</div>\n<div>    0% { -webkit-transform: scale(1); } <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>50% { -webkit-transform: scale(1.1); }</div>\n<div>    100% { -webkit-transform: scale(1); }</div>\n<div>}</div>\n<div>@-moz-keyframes pulse {</div>\n<div>    0% { -moz-transform: scale(1); } <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>50% { -moz-transform: scale(1.1); }</div>\n<div>    100% { -moz-transform: scale(1); }</div>\n<div>}</div>\n<div>@-o-keyframes pulse {</div>\n<div>    0% { -o-transform: scale(1); } <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>50% { -o-transform: scale(1.1); }</div>\n<div>    100% { -o-transform: scale(1); }</div>\n<div>}</div>\n<div>@keyframes pulse {</div>\n<div>    0% { transform: scale(1); } <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>50% { transform: scale(1.1); }</div>\n<div>    100% { transform: scale(1); }</div>\n<div>}</div>\n<div><br></div>\n<div>.pulse {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: pulse;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: pulse;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: pulse;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: pulse;</div>\n<div>}</div>\n<div>@-webkit-keyframes flip {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: perspective(400px) rotateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-timing-function: ease-out;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>\n<span style=\"white-space:pre;\"></span>40% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-timing-function: ease-out;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>\n<span style=\"white-space:pre;\"></span>50% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-timing-function: ease-in;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>\n<span style=\"white-space:pre;\"></span>80% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: perspective(400px) rotateY(360deg) scale(.95);</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-timing-function: ease-in;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: perspective(400px) scale(1);</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-timing-function: ease-in;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div>@-moz-keyframes flip {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: perspective(400px) rotateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-timing-function: ease-out;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>\n<span style=\"white-space:pre;\"></span>40% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: perspective(400px) translateZ(150px) rotateY(170deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-timing-function: ease-out;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>\n<span style=\"white-space:pre;\"></span>50% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-timing-function: ease-in;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>\n<span style=\"white-space:pre;\"></span>80% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: perspective(400px) rotateY(360deg) scale(.95);</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-timing-function: ease-in;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: perspective(400px) scale(1);</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-timing-function: ease-in;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div>@-o-keyframes flip {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: perspective(400px) rotateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-timing-function: ease-out;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>\n<span style=\"white-space:pre;\"></span>40% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: perspective(400px) translateZ(150px) rotateY(170deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-timing-function: ease-out;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>\n<span style=\"white-space:pre;\"></span>50% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-timing-function: ease-in;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>\n<span style=\"white-space:pre;\"></span>80% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: perspective(400px) rotateY(360deg) scale(.95);</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-timing-function: ease-in;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: perspective(400px) scale(1);</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-timing-function: ease-in;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div>@keyframes flip {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: perspective(400px) rotateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-timing-function: ease-out;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>\n<span style=\"white-space:pre;\"></span>40% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: perspective(400px) translateZ(150px) rotateY(170deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-timing-function: ease-out;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>\n<span style=\"white-space:pre;\"></span>50% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-timing-function: ease-in;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>\n<span style=\"white-space:pre;\"></span>80% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: perspective(400px) rotateY(360deg) scale(.95);</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-timing-function: ease-in;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: perspective(400px) scale(1);</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-timing-function: ease-in;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>.flip {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-backface-visibility: visible !important;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: flip;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-backface-visibility: visible !important;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: flip;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-backface-visibility: visible !important;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: flip;</div>\n<div>\n<span style=\"white-space:pre;\"></span>backface-visibility: visible !important;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: flip;</div>\n<div>}</div>\n<div>@-webkit-keyframes flipInX {</div>\n<div>    0% {</div>\n<div>        -webkit-transform: perspective(400px) rotateX(90deg);</div>\n<div>        opacity: 0;</div>\n<div>    }</div>\n<div>    </div>\n<div>    40% {</div>\n<div>        -webkit-transform: perspective(400px) rotateX(-10deg);</div>\n<div>    }</div>\n<div>    </div>\n<div>    70% {</div>\n<div>        -webkit-transform: perspective(400px) rotateX(10deg);</div>\n<div>    }</div>\n<div>    </div>\n<div>    100% {</div>\n<div>        -webkit-transform: perspective(400px) rotateX(0deg);</div>\n<div>        opacity: 1;</div>\n<div>    }</div>\n<div>}</div>\n<div>@-moz-keyframes flipInX {</div>\n<div>    0% {</div>\n<div>        -moz-transform: perspective(400px) rotateX(90deg);</div>\n<div>        opacity: 0;</div>\n<div>    }</div>\n<div>    </div>\n<div>    40% {</div>\n<div>        -moz-transform: perspective(400px) rotateX(-10deg);</div>\n<div>    }</div>\n<div>    </div>\n<div>    70% {</div>\n<div>        -moz-transform: perspective(400px) rotateX(10deg);</div>\n<div>    }</div>\n<div>    </div>\n<div>    100% {</div>\n<div>        -moz-transform: perspective(400px) rotateX(0deg);</div>\n<div>        opacity: 1;</div>\n<div>    }</div>\n<div>}</div>\n<div>@-o-keyframes flipInX {</div>\n<div>    0% {</div>\n<div>        -o-transform: perspective(400px) rotateX(90deg);</div>\n<div>        opacity: 0;</div>\n<div>    }</div>\n<div>    </div>\n<div>    40% {</div>\n<div>        -o-transform: perspective(400px) rotateX(-10deg);</div>\n<div>    }</div>\n<div>    </div>\n<div>    70% {</div>\n<div>        -o-transform: perspective(400px) rotateX(10deg);</div>\n<div>    }</div>\n<div>    </div>\n<div>    100% {</div>\n<div>        -o-transform: perspective(400px) rotateX(0deg);</div>\n<div>        opacity: 1;</div>\n<div>    }</div>\n<div>}</div>\n<div>@keyframes flipInX {</div>\n<div>    0% {</div>\n<div>        transform: perspective(400px) rotateX(90deg);</div>\n<div>        opacity: 0;</div>\n<div>    }</div>\n<div>    </div>\n<div>    40% {</div>\n<div>        transform: perspective(400px) rotateX(-10deg);</div>\n<div>    }</div>\n<div>    </div>\n<div>    70% {</div>\n<div>        transform: perspective(400px) rotateX(10deg);</div>\n<div>    }</div>\n<div>    </div>\n<div>    100% {</div>\n<div>        transform: perspective(400px) rotateX(0deg);</div>\n<div>        opacity: 1;</div>\n<div>    }</div>\n<div>}</div>\n<div><br></div>\n<div>.flipInX {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-backface-visibility: visible !important;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: flipInX;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-backface-visibility: visible !important;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: flipInX;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-backface-visibility: visible !important;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: flipInX;</div>\n<div>\n<span style=\"white-space:pre;\"></span>backface-visibility: visible !important;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: flipInX;</div>\n<div>}</div>\n<div>@-webkit-keyframes flipOutX {</div>\n<div>    0% {</div>\n<div>        -webkit-transform: perspective(400px) rotateX(0deg);</div>\n<div>        opacity: 1;</div>\n<div>    }</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>        -webkit-transform: perspective(400px) rotateX(90deg);</div>\n<div>        opacity: 0;</div>\n<div>    }</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes flipOutX {</div>\n<div>    0% {</div>\n<div>        -moz-transform: perspective(400px) rotateX(0deg);</div>\n<div>        opacity: 1;</div>\n<div>    }</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>        -moz-transform: perspective(400px) rotateX(90deg);</div>\n<div>        opacity: 0;</div>\n<div>    }</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes flipOutX {</div>\n<div>    0% {</div>\n<div>        -o-transform: perspective(400px) rotateX(0deg);</div>\n<div>        opacity: 1;</div>\n<div>    }</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>        -o-transform: perspective(400px) rotateX(90deg);</div>\n<div>        opacity: 0;</div>\n<div>    }</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes flipOutX {</div>\n<div>    0% {</div>\n<div>        transform: perspective(400px) rotateX(0deg);</div>\n<div>        opacity: 1;</div>\n<div>    }</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>        transform: perspective(400px) rotateX(90deg);</div>\n<div>        opacity: 0;</div>\n<div>    }</div>\n<div>}</div>\n<div><br></div>\n<div>.flipOutX {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: flipOutX;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-backface-visibility: visible !important;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: flipOutX;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-backface-visibility: visible !important;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: flipOutX;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-backface-visibility: visible !important;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: flipOutX;</div>\n<div>\n<span style=\"white-space:pre;\"></span>backface-visibility: visible !important;</div>\n<div>}</div>\n<div>@-webkit-keyframes flipInY {</div>\n<div>    0% {</div>\n<div>        -webkit-transform: perspective(400px) rotateY(90deg);</div>\n<div>        opacity: 0;</div>\n<div>    }</div>\n<div>    </div>\n<div>    40% {</div>\n<div>        -webkit-transform: perspective(400px) rotateY(-10deg);</div>\n<div>    }</div>\n<div>    </div>\n<div>    70% {</div>\n<div>        -webkit-transform: perspective(400px) rotateY(10deg);</div>\n<div>    }</div>\n<div>    </div>\n<div>    100% {</div>\n<div>        -webkit-transform: perspective(400px) rotateY(0deg);</div>\n<div>        opacity: 1;</div>\n<div>    }</div>\n<div>}</div>\n<div>@-moz-keyframes flipInY {</div>\n<div>    0% {</div>\n<div>        -moz-transform: perspective(400px) rotateY(90deg);</div>\n<div>        opacity: 0;</div>\n<div>    }</div>\n<div>    </div>\n<div>    40% {</div>\n<div>        -moz-transform: perspective(400px) rotateY(-10deg);</div>\n<div>    }</div>\n<div>    </div>\n<div>    70% {</div>\n<div>        -moz-transform: perspective(400px) rotateY(10deg);</div>\n<div>    }</div>\n<div>    </div>\n<div>    100% {</div>\n<div>        -moz-transform: perspective(400px) rotateY(0deg);</div>\n<div>        opacity: 1;</div>\n<div>    }</div>\n<div>}</div>\n<div>@-o-keyframes flipInY {</div>\n<div>    0% {</div>\n<div>        -o-transform: perspective(400px) rotateY(90deg);</div>\n<div>        opacity: 0;</div>\n<div>    }</div>\n<div>    </div>\n<div>    40% {</div>\n<div>        -o-transform: perspective(400px) rotateY(-10deg);</div>\n<div>    }</div>\n<div>    </div>\n<div>    70% {</div>\n<div>        -o-transform: perspective(400px) rotateY(10deg);</div>\n<div>    }</div>\n<div>    </div>\n<div>    100% {</div>\n<div>        -o-transform: perspective(400px) rotateY(0deg);</div>\n<div>        opacity: 1;</div>\n<div>    }</div>\n<div>}</div>\n<div>@keyframes flipInY {</div>\n<div>    0% {</div>\n<div>        transform: perspective(400px) rotateY(90deg);</div>\n<div>        opacity: 0;</div>\n<div>    }</div>\n<div>    </div>\n<div>    40% {</div>\n<div>        transform: perspective(400px) rotateY(-10deg);</div>\n<div>    }</div>\n<div>    </div>\n<div>    70% {</div>\n<div>        transform: perspective(400px) rotateY(10deg);</div>\n<div>    }</div>\n<div>    </div>\n<div>    100% {</div>\n<div>        transform: perspective(400px) rotateY(0deg);</div>\n<div>        opacity: 1;</div>\n<div>    }</div>\n<div>}</div>\n<div><br></div>\n<div>.flipInY {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-backface-visibility: visible !important;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: flipInY;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-backface-visibility: visible !important;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: flipInY;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-backface-visibility: visible !important;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: flipInY;</div>\n<div>\n<span style=\"white-space:pre;\"></span>backface-visibility: visible !important;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: flipInY;</div>\n<div>}</div>\n<div>@-webkit-keyframes flipOutY {</div>\n<div>    0% {</div>\n<div>        -webkit-transform: perspective(400px) rotateY(0deg);</div>\n<div>        opacity: 1;</div>\n<div>    }</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>        -webkit-transform: perspective(400px) rotateY(90deg);</div>\n<div>        opacity: 0;</div>\n<div>    }</div>\n<div>}</div>\n<div>@-moz-keyframes flipOutY {</div>\n<div>    0% {</div>\n<div>        -moz-transform: perspective(400px) rotateY(0deg);</div>\n<div>        opacity: 1;</div>\n<div>    }</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>        -moz-transform: perspective(400px) rotateY(90deg);</div>\n<div>        opacity: 0;</div>\n<div>    }</div>\n<div>}</div>\n<div>@-o-keyframes flipOutY {</div>\n<div>    0% {</div>\n<div>        -o-transform: perspective(400px) rotateY(0deg);</div>\n<div>        opacity: 1;</div>\n<div>    }</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>        -o-transform: perspective(400px) rotateY(90deg);</div>\n<div>        opacity: 0;</div>\n<div>    }</div>\n<div>}</div>\n<div>@keyframes flipOutY {</div>\n<div>    0% {</div>\n<div>        transform: perspective(400px) rotateY(0deg);</div>\n<div>        opacity: 1;</div>\n<div>    }</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>        transform: perspective(400px) rotateY(90deg);</div>\n<div>        opacity: 0;</div>\n<div>    }</div>\n<div>}</div>\n<div><br></div>\n<div>.flipOutY {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-backface-visibility: visible !important;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: flipOutY;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-backface-visibility: visible !important;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: flipOutY;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-backface-visibility: visible !important;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: flipOutY;</div>\n<div>\n<span style=\"white-space:pre;\"></span>backface-visibility: visible !important;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: flipOutY;</div>\n<div>}</div>\n<div>@-webkit-keyframes fadeIn {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {opacity: 0;} <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {opacity: 1;}</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes fadeIn {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {opacity: 0;} <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {opacity: 1;}</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes fadeIn {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {opacity: 0;} <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {opacity: 1;}</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes fadeIn {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {opacity: 0;} <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {opacity: 1;}</div>\n<div>}</div>\n<div><br></div>\n<div>.fadeIn {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: fadeIn;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: fadeIn;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: fadeIn;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: fadeIn;</div>\n<div>}</div>\n<div>@-webkit-keyframes fadeInUp {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateY(20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes fadeInUp {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateY(20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes fadeInUp {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateY(20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes fadeInUp {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateY(20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>.fadeInUp {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: fadeInUp;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: fadeInUp;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: fadeInUp;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: fadeInUp;</div>\n<div>}</div>\n<div>@-webkit-keyframes fadeInDown {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateY(-20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes fadeInDown {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateY(-20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes fadeInDown {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateY(-20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes fadeInDown {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateY(-20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>.fadeInDown {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: fadeInDown;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: fadeInDown;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: fadeInDown;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: fadeInDown;</div>\n<div>}</div>\n<div>@-webkit-keyframes fadeInLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateX(-20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes fadeInLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateX(-20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes fadeInLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateX(-20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes fadeInLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateX(-20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>.fadeInLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: fadeInLeft;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: fadeInLeft;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: fadeInLeft;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: fadeInLeft;</div>\n<div>}</div>\n<div>@-webkit-keyframes fadeInRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateX(20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes fadeInRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateX(20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes fadeInRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateX(20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes fadeInRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateX(20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>.fadeInRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: fadeInRight;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: fadeInRight;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: fadeInRight;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: fadeInRight;</div>\n<div>}</div>\n<div>@-webkit-keyframes fadeInUpBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateY(2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes fadeInUpBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateY(2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes fadeInUpBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateY(2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes fadeInUpBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateY(2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>.fadeInUpBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: fadeInUpBig;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: fadeInUpBig;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: fadeInUpBig;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: fadeInUpBig;</div>\n<div>}</div>\n<div>@-webkit-keyframes fadeInDownBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateY(-2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes fadeInDownBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateY(-2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes fadeInDownBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateY(-2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes fadeInDownBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateY(-2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>.fadeInDownBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: fadeInDownBig;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: fadeInDownBig;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: fadeInDownBig;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: fadeInDownBig;</div>\n<div>}</div>\n<div>@-webkit-keyframes fadeInLeftBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateX(-2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div>@-moz-keyframes fadeInLeftBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateX(-2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div>@-o-keyframes fadeInLeftBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateX(-2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div>@keyframes fadeInLeftBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateX(-2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>.fadeInLeftBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: fadeInLeftBig;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: fadeInLeftBig;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: fadeInLeftBig;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: fadeInLeftBig;</div>\n<div>}</div>\n<div>@-webkit-keyframes fadeInRightBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateX(2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes fadeInRightBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateX(2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes fadeInRightBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateX(2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes fadeInRightBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateX(2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>.fadeInRightBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: fadeInRightBig;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: fadeInRightBig;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: fadeInRightBig;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: fadeInRightBig;</div>\n<div>}</div>\n<div>@-webkit-keyframes fadeOut {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {opacity: 1;}</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {opacity: 0;}</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes fadeOut {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {opacity: 1;}</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {opacity: 0;}</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes fadeOut {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {opacity: 1;}</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {opacity: 0;}</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes fadeOut {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {opacity: 1;}</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {opacity: 0;}</div>\n<div>}</div>\n<div><br></div>\n<div>.fadeOut {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: fadeOut;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: fadeOut;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: fadeOut;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: fadeOut;</div>\n<div>}</div>\n<div>@-webkit-keyframes fadeOutUp {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateY(-20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div>@-moz-keyframes fadeOutUp {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateY(-20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div>@-o-keyframes fadeOutUp {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateY(-20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div>@keyframes fadeOutUp {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateY(-20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>.fadeOutUp {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: fadeOutUp;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: fadeOutUp;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: fadeOutUp;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: fadeOutUp;</div>\n<div>}</div>\n<div>@-webkit-keyframes fadeOutDown {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateY(20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes fadeOutDown {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateY(20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes fadeOutDown {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateY(20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes fadeOutDown {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateY(20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>.fadeOutDown {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: fadeOutDown;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: fadeOutDown;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: fadeOutDown;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: fadeOutDown;</div>\n<div>}</div>\n<div>@-webkit-keyframes fadeOutLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateX(-20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes fadeOutLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateX(-20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes fadeOutLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateX(-20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes fadeOutLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateX(-20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>.fadeOutLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: fadeOutLeft;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: fadeOutLeft;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: fadeOutLeft;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: fadeOutLeft;</div>\n<div>}</div>\n<div>@-webkit-keyframes fadeOutRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateX(20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes fadeOutRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateX(20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes fadeOutRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateX(20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes fadeOutRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateX(20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>.fadeOutRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: fadeOutRight;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: fadeOutRight;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: fadeOutRight;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: fadeOutRight;</div>\n<div>}</div>\n<div>@-webkit-keyframes fadeOutUpBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateY(-2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes fadeOutUpBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateY(-2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes fadeOutUpBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateY(-2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes fadeOutUpBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateY(-2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>.fadeOutUpBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: fadeOutUpBig;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: fadeOutUpBig;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: fadeOutUpBig;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: fadeOutUpBig;</div>\n<div>}</div>\n<div>@-webkit-keyframes fadeOutDownBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateY(2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes fadeOutDownBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateY(2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes fadeOutDownBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateY(2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes fadeOutDownBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateY(2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>.fadeOutDownBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: fadeOutDownBig;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: fadeOutDownBig;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: fadeOutDownBig;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: fadeOutDownBig;</div>\n<div>}</div>\n<div>@-webkit-keyframes fadeOutLeftBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateX(-2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes fadeOutLeftBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateX(-2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes fadeOutLeftBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateX(-2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes fadeOutLeftBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateX(-2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>.fadeOutLeftBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: fadeOutLeftBig;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: fadeOutLeftBig;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: fadeOutLeftBig;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: fadeOutLeftBig;</div>\n<div>}</div>\n<div>@-webkit-keyframes fadeOutRightBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateX(2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div>@-moz-keyframes fadeOutRightBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateX(2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div>@-o-keyframes fadeOutRightBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateX(2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div>@keyframes fadeOutRightBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateX(2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>.fadeOutRightBig {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: fadeOutRightBig;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: fadeOutRightBig;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: fadeOutRightBig;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: fadeOutRightBig;</div>\n<div>}</div>\n<div>@-webkit-keyframes bounceIn {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: scale(.3);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>50% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: scale(1.05);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>70% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: scale(.9);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: scale(1);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes bounceIn {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: scale(.3);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>50% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: scale(1.05);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>70% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: scale(.9);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: scale(1);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes bounceIn {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: scale(.3);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>50% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: scale(1.05);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>70% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: scale(.9);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: scale(1);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes bounceIn {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: scale(.3);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>50% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: scale(1.05);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>70% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: scale(.9);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: scale(1);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>.bounceIn {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: bounceIn;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: bounceIn;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: bounceIn;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: bounceIn;</div>\n<div>}</div>\n<div>@-webkit-keyframes bounceInUp {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateY(2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>60% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateY(-30px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>80% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateY(10px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div>@-moz-keyframes bounceInUp {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateY(2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>60% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateY(-30px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>80% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateY(10px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes bounceInUp {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateY(2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>60% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateY(-30px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>80% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateY(10px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes bounceInUp {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateY(2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>60% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateY(-30px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>80% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateY(10px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>.bounceInUp {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: bounceInUp;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: bounceInUp;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: bounceInUp;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: bounceInUp;</div>\n<div>}</div>\n<div>@-webkit-keyframes bounceInDown {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateY(-2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>60% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateY(30px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>80% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateY(-10px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes bounceInDown {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateY(-2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>60% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateY(30px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>80% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateY(-10px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes bounceInDown {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateY(-2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>60% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateY(30px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>80% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateY(-10px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes bounceInDown {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateY(-2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>60% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateY(30px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>80% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateY(-10px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>.bounceInDown {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: bounceInDown;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: bounceInDown;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: bounceInDown;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: bounceInDown;</div>\n<div>}</div>\n<div>@-webkit-keyframes bounceInLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateX(-2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>60% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateX(30px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>80% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateX(-10px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes bounceInLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateX(-2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>60% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateX(30px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>80% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateX(-10px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes bounceInLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateX(-2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>60% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateX(30px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>80% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateX(-10px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes bounceInLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateX(-2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>60% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateX(30px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>80% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateX(-10px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>.bounceInLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: bounceInLeft;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: bounceInLeft;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: bounceInLeft;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: bounceInLeft;</div>\n<div>}</div>\n<div>@-webkit-keyframes bounceInRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateX(2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>60% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateX(-30px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>80% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateX(10px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes bounceInRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateX(2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>60% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateX(-30px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>80% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateX(10px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes bounceInRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateX(2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>60% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateX(-30px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>80% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateX(10px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes bounceInRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateX(2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>60% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateX(-30px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>80% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateX(10px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>.bounceInRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: bounceInRight;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: bounceInRight;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: bounceInRight;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: bounceInRight;</div>\n<div>}</div>\n<div>@-webkit-keyframes bounceOut {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: scale(1);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>25% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: scale(.95);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>50% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: scale(1.1);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: scale(.3);</div>\n<div>\n<span style=\"white-space:pre;\"></span>} <span style=\"white-space:pre;\"></span>\n</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes bounceOut {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: scale(1);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>25% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: scale(.95);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>50% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: scale(1.1);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: scale(.3);</div>\n<div>\n<span style=\"white-space:pre;\"></span>} <span style=\"white-space:pre;\"></span>\n</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes bounceOut {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: scale(1);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>25% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: scale(.95);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>50% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: scale(1.1);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: scale(.3);</div>\n<div>\n<span style=\"white-space:pre;\"></span>} <span style=\"white-space:pre;\"></span>\n</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes bounceOut {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: scale(1);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>25% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: scale(.95);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>50% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: scale(1.1);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: scale(.3);</div>\n<div>\n<span style=\"white-space:pre;\"></span>} <span style=\"white-space:pre;\"></span>\n</div>\n<div>}</div>\n<div><br></div>\n<div>.bounceOut {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: bounceOut;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: bounceOut;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: bounceOut;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: bounceOut;</div>\n<div>}</div>\n<div>@-webkit-keyframes bounceOutUp {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>20% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateY(20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateY(-2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes bounceOutUp {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>20% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateY(20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateY(-2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes bounceOutUp {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>20% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateY(20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateY(-2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes bounceOutUp {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>20% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateY(20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateY(-2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>.bounceOutUp {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: bounceOutUp;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: bounceOutUp;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: bounceOutUp;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: bounceOutUp;</div>\n<div>}</div>\n<div>@-webkit-keyframes bounceOutDown {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>20% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateY(-20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateY(2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes bounceOutDown {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>20% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateY(-20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateY(2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes bounceOutDown {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>20% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateY(-20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateY(2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes bounceOutDown {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateY(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>20% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateY(-20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateY(2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>.bounceOutDown {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: bounceOutDown;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: bounceOutDown;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: bounceOutDown;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: bounceOutDown;</div>\n<div>}</div>\n<div>@-webkit-keyframes bounceOutLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>20% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateX(20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateX(-2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes bounceOutLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>20% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateX(20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateX(-2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes bounceOutLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>20% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateX(20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateX(-2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes bounceOutLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>20% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateX(20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateX(-2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>.bounceOutLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: bounceOutLeft;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: bounceOutLeft;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: bounceOutLeft;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: bounceOutLeft;</div>\n<div>}</div>\n<div>@-webkit-keyframes bounceOutRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>20% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateX(-20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateX(2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes bounceOutRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>20% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateX(-20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateX(2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes bounceOutRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>20% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateX(-20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateX(2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes bounceOutRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateX(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>20% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateX(-20px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateX(2000px);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>.bounceOutRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: bounceOutRight;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: bounceOutRight;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: bounceOutRight;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: bounceOutRight;</div>\n<div>}</div>\n<div>@-webkit-keyframes rotateIn {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform-origin: center center;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: rotate(-200deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform-origin: center center;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div>@-moz-keyframes rotateIn {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform-origin: center center;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: rotate(-200deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform-origin: center center;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div>@-o-keyframes rotateIn {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform-origin: center center;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: rotate(-200deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform-origin: center center;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div>@keyframes rotateIn {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform-origin: center center;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: rotate(-200deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform-origin: center center;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>.rotateIn {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: rotateIn;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: rotateIn;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: rotateIn;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: rotateIn;</div>\n<div>}</div>\n<div>@-webkit-keyframes rotateInUpLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform-origin: left bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: rotate(90deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform-origin: left bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes rotateInUpLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform-origin: left bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: rotate(90deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform-origin: left bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes rotateInUpLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform-origin: left bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: rotate(90deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform-origin: left bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes rotateInUpLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform-origin: left bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: rotate(90deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform-origin: left bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>.rotateInUpLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: rotateInUpLeft;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: rotateInUpLeft;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: rotateInUpLeft;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: rotateInUpLeft;</div>\n<div>}</div>\n<div>@-webkit-keyframes rotateInDownLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform-origin: left bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: rotate(-90deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform-origin: left bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes rotateInDownLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform-origin: left bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: rotate(-90deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform-origin: left bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes rotateInDownLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform-origin: left bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: rotate(-90deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform-origin: left bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes rotateInDownLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform-origin: left bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: rotate(-90deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform-origin: left bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>.rotateInDownLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: rotateInDownLeft;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: rotateInDownLeft;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: rotateInDownLeft;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: rotateInDownLeft;</div>\n<div>}</div>\n<div>@-webkit-keyframes rotateInUpRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform-origin: right bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: rotate(-90deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform-origin: right bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes rotateInUpRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform-origin: right bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: rotate(-90deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform-origin: right bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes rotateInUpRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform-origin: right bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: rotate(-90deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform-origin: right bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes rotateInUpRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform-origin: right bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: rotate(-90deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform-origin: right bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>.rotateInUpRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: rotateInUpRight;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: rotateInUpRight;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: rotateInUpRight;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: rotateInUpRight;</div>\n<div>}</div>\n<div>@-webkit-keyframes rotateInDownRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform-origin: right bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: rotate(90deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform-origin: right bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes rotateInDownRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform-origin: right bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: rotate(90deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform-origin: right bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes rotateInDownRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform-origin: right bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: rotate(90deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform-origin: right bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes rotateInDownRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform-origin: right bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: rotate(90deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform-origin: right bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>.rotateInDownRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: rotateInDownRight;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: rotateInDownRight;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: rotateInDownRight;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: rotateInDownRight;</div>\n<div>}</div>\n<div>@-webkit-keyframes rotateOut {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform-origin: center center;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform-origin: center center;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: rotate(200deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes rotateOut {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform-origin: center center;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform-origin: center center;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: rotate(200deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes rotateOut {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform-origin: center center;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform-origin: center center;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: rotate(200deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes rotateOut {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform-origin: center center;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform-origin: center center;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: rotate(200deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>.rotateOut {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: rotateOut;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: rotateOut;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: rotateOut;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: rotateOut;</div>\n<div>}</div>\n<div>@-webkit-keyframes rotateOutUpLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform-origin: left bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform-origin: left bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: rotate(-90deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes rotateOutUpLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform-origin: left bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform-origin: left bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: rotate(-90deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes rotateOutUpLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform-origin: left bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform-origin: left bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: rotate(-90deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes rotateOutUpLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform-origin: left bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform-origin: left bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: rotate(-90deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>.rotateOutUpLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: rotateOutUpLeft;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: rotateOutUpLeft;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: rotateOutUpLeft;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: rotateOutUpLeft;</div>\n<div>}</div>\n<div>@-webkit-keyframes rotateOutDownLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform-origin: left bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform-origin: left bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: rotate(90deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes rotateOutDownLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform-origin: left bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform-origin: left bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: rotate(90deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes rotateOutDownLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform-origin: left bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform-origin: left bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: rotate(90deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes rotateOutDownLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform-origin: left bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform-origin: left bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: rotate(90deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>.rotateOutDownLeft {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: rotateOutDownLeft;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: rotateOutDownLeft;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: rotateOutDownLeft;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: rotateOutDownLeft;</div>\n<div>}</div>\n<div>@-webkit-keyframes rotateOutUpRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform-origin: right bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform-origin: right bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: rotate(90deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes rotateOutUpRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform-origin: right bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform-origin: right bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: rotate(90deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes rotateOutUpRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform-origin: right bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform-origin: right bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: rotate(90deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes rotateOutUpRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform-origin: right bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform-origin: right bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: rotate(90deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>.rotateOutUpRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: rotateOutUpRight;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: rotateOutUpRight;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: rotateOutUpRight;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: rotateOutUpRight;</div>\n<div>}</div>\n<div>@-webkit-keyframes rotateOutDownRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform-origin: right bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform-origin: right bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: rotate(-90deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes rotateOutDownRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform-origin: right bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform-origin: right bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: rotate(-90deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes rotateOutDownRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform-origin: right bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform-origin: right bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: rotate(-90deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes rotateOutDownRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform-origin: right bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: rotate(0);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><span style=\"white-space:pre;\"></span></div>\n<div>\n<span style=\"white-space:pre;\"></span>100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform-origin: right bottom;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: rotate(-90deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>.rotateOutDownRight {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: rotateOutDownRight;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: rotateOutDownRight;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: rotateOutDownRight;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: rotateOutDownRight;</div>\n<div>}</div>\n<div>@-webkit-keyframes hinge {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% { -webkit-transform: rotate(0); -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; } <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>20%, 60% { -webkit-transform: rotate(80deg); -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; } <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>40% { -webkit-transform: rotate(60deg); -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; } <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>80% { -webkit-transform: rotate(60deg) translateY(0); opacity: 1; -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; } <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% { -webkit-transform: translateY(700px); opacity: 0; }</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes hinge {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% { -moz-transform: rotate(0); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; } <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>20%, 60% { -moz-transform: rotate(80deg); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; } <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>40% { -moz-transform: rotate(60deg); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; } <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>80% { -moz-transform: rotate(60deg) translateY(0); opacity: 1; -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; } <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% { -moz-transform: translateY(700px); opacity: 0; }</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes hinge {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% { -o-transform: rotate(0); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; } <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>20%, 60% { -o-transform: rotate(80deg); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; } <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>40% { -o-transform: rotate(60deg); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; } <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>80% { -o-transform: rotate(60deg) translateY(0); opacity: 1; -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; } <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% { -o-transform: translateY(700px); opacity: 0; }</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes hinge {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% { transform: rotate(0); transform-origin: top left; animation-timing-function: ease-in-out; } <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>20%, 60% { transform: rotate(80deg); transform-origin: top left; animation-timing-function: ease-in-out; } <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>40% { transform: rotate(60deg); transform-origin: top left; animation-timing-function: ease-in-out; } <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>80% { transform: rotate(60deg) translateY(0); opacity: 1; transform-origin: top left; animation-timing-function: ease-in-out; } <span style=\"white-space:pre;\"></span>\n</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% { transform: translateY(700px); opacity: 0; }</div>\n<div>}</div>\n<div><br></div>\n<div>.hinge {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: hinge;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: hinge;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: hinge;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: hinge;</div>\n<div>}</div>\n<div>/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */</div>\n<div><br></div>\n<div>@-webkit-keyframes rollIn {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% { opacity: 0; -webkit-transform: translateX(-100%) rotate(-120deg); }</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); }</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes rollIn {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% { opacity: 0; -moz-transform: translateX(-100%) rotate(-120deg); }</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% { opacity: 1; -moz-transform: translateX(0px) rotate(0deg); }</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes rollIn {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% { opacity: 0; -o-transform: translateX(-100%) rotate(-120deg); }</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% { opacity: 1; -o-transform: translateX(0px) rotate(0deg); }</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes rollIn {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% { opacity: 0; transform: translateX(-100%) rotate(-120deg); }</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% { opacity: 1; transform: translateX(0px) rotate(0deg); }</div>\n<div>}</div>\n<div><br></div>\n<div>.rollIn {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: rollIn;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: rollIn;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: rollIn;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: rollIn;</div>\n<div>}</div>\n<div>/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */</div>\n<div><br></div>\n<div>@-webkit-keyframes rollOut {</div>\n<div>    0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateX(0px) rotate(0deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><br></div>\n<div>    100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-transform: translateX(100%) rotate(120deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes rollOut {</div>\n<div>    0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateX(0px) rotate(0deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><br></div>\n<div>    100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-transform: translateX(100%) rotate(120deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes rollOut {</div>\n<div>    0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateX(0px) rotate(0deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><br></div>\n<div>    100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-transform: translateX(100%) rotate(120deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes rollOut {</div>\n<div>    0% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 1;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateX(0px) rotate(0deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div><br></div>\n<div>    100% {</div>\n<div>\n<span style=\"white-space:pre;\"></span>opacity: 0;</div>\n<div>\n<span style=\"white-space:pre;\"></span>transform: translateX(100%) rotate(120deg);</div>\n<div>\n<span style=\"white-space:pre;\"></span>}</div>\n<div>}</div>\n<div><br></div>\n<div>.rollOut {</div>\n<div>\n<span style=\"white-space:pre;\"></span>-webkit-animation-name: rollOut;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-moz-animation-name: rollOut;</div>\n<div>\n<span style=\"white-space:pre;\"></span>-o-animation-name: rollOut;</div>\n<div>\n<span style=\"white-space:pre;\"></span>animation-name: rollOut;</div>\n<div>}</div>\n<div><br></div>\n<div>/* originally authored by Angelo Rohit - https://github.com/angelorohit */</div>\n<div><br></div>\n<div>@-webkit-keyframes lightSpeedIn {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% { -webkit-transform: translateX(100%) skewX(-30deg); opacity: 0; }</div>\n<div>\n<span style=\"white-space:pre;\"></span>60% { -webkit-transform: translateX(-20%) skewX(30deg); opacity: 1; }</div>\n<div>\n<span style=\"white-space:pre;\"></span>80% { -webkit-transform: translateX(0%) skewX(-15deg); opacity: 1; }</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% { -webkit-transform: translateX(0%) skewX(0deg); opacity: 1; }</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes lightSpeedIn {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% { -moz-transform: translateX(100%) skewX(-30deg); opacity: 0; }</div>\n<div>\n<span style=\"white-space:pre;\"></span>60% { -moz-transform: translateX(-20%) skewX(30deg); opacity: 1; }</div>\n<div>\n<span style=\"white-space:pre;\"></span>80% { -moz-transform: translateX(0%) skewX(-15deg); opacity: 1; }</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% { -moz-transform: translateX(0%) skewX(0deg); opacity: 1; }</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes lightSpeedIn {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% { -o-transform: translateX(100%) skewX(-30deg); opacity: 0; }</div>\n<div>\n<span style=\"white-space:pre;\"></span>60% { -o-transform: translateX(-20%) skewX(30deg); opacity: 1; }</div>\n<div>\n<span style=\"white-space:pre;\"></span>80% { -o-transform: translateX(0%) skewX(-15deg); opacity: 1; }</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% { -o-transform: translateX(0%) skewX(0deg); opacity: 1; }</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes lightSpeedIn {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% { transform: translateX(100%) skewX(-30deg); opacity: 0; }</div>\n<div>\n<span style=\"white-space:pre;\"></span>60% { transform: translateX(-20%) skewX(30deg); opacity: 1; }</div>\n<div>\n<span style=\"white-space:pre;\"></span>80% { transform: translateX(0%) skewX(-15deg); opacity: 1; }</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% { transform: translateX(0%) skewX(0deg); opacity: 1; }</div>\n<div>}</div>\n<div><br></div>\n<div>.lightSpeedIn {</div>\n<div>    -webkit-animation-name: lightSpeedIn;</div>\n<div>    -moz-animation-name: lightSpeedIn;</div>\n<div>    -o-animation-name: lightSpeedIn;</div>\n<div>    animation-name: lightSpeedIn;</div>\n<div><br></div>\n<div>    -webkit-animation-timing-function: ease-out;</div>\n<div>    -moz-animation-timing-function: ease-out;</div>\n<div>    -o-animation-timing-function: ease-out;</div>\n<div>    animation-timing-function: ease-out;</div>\n<div>}</div>\n<div><br></div>\n<div>.animated.lightSpeedIn {</div>\n<div>    -webkit-animation-duration: 0.5s;</div>\n<div>    -moz-animation-duration: 0.5s;</div>\n<div>    -o-animation-duration: 0.5s;</div>\n<div>    animation-duration: 0.5s;</div>\n<div>}</div>\n<div><br></div>\n<div>/* originally authored by Angelo Rohit - https://github.com/angelorohit */</div>\n<div><br></div>\n<div>@-webkit-keyframes lightSpeedOut {</div>\n<div>    0% { -webkit-transform: translateX(0%) skewX(0deg); opacity: 1; }</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% { -webkit-transform: translateX(100%) skewX(-30deg); opacity: 0; }</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes lightSpeedOut {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% { -moz-transform: translateX(0%) skewX(0deg); opacity: 1; }</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% { -moz-transform: translateX(100%) skewX(-30deg); opacity: 0; }</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes lightSpeedOut {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% { -o-transform: translateX(0%) skewX(0deg); opacity: 1; }</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% { -o-transform: translateX(100%) skewX(-30deg); opacity: 0; }</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes lightSpeedOut {</div>\n<div>\n<span style=\"white-space:pre;\"></span>0% { transform: translateX(0%) skewX(0deg); opacity: 1; }</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% { transform: translateX(100%) skewX(-30deg); opacity: 0; }</div>\n<div>}</div>\n<div><br></div>\n<div>.lightSpeedOut {</div>\n<div>    -webkit-animation-name: lightSpeedOut;</div>\n<div>    -moz-animation-name: lightSpeedOut;</div>\n<div>    -o-animation-name: lightSpeedOut;</div>\n<div>    animation-name: lightSpeedOut;</div>\n<div><br></div>\n<div>    -webkit-animation-timing-function: ease-in;</div>\n<div>    -moz-animation-timing-function: ease-in;</div>\n<div>    -o-animation-timing-function: ease-in;</div>\n<div>    animation-timing-function: ease-in;</div>\n<div>}</div>\n<div><br></div>\n<div>.animated.lightSpeedOut {</div>\n<div>    -webkit-animation-duration: 0.25s;</div>\n<div>    -moz-animation-duration: 0.25s;</div>\n<div>    -o-animation-duration: 0.25s;</div>\n<div>    animation-duration: 0.25s;</div>\n<div>}</div>\n<div><br></div>\n<div>/* originally authored by Angelo Rohit - https://github.com/angelorohit */</div>\n<div><br></div>\n<div>@-webkit-keyframes wiggle {</div>\n<div>    0% { -webkit-transform: skewX(9deg); }</div>\n<div>    10% { -webkit-transform: skewX(-8deg); }</div>\n<div>    20% { -webkit-transform: skewX(7deg); }</div>\n<div>    30% { -webkit-transform: skewX(-6deg); }</div>\n<div>    40% { -webkit-transform: skewX(5deg); }</div>\n<div>    50% { -webkit-transform: skewX(-4deg); }</div>\n<div>    60% { -webkit-transform: skewX(3deg); }</div>\n<div>    70% { -webkit-transform: skewX(-2deg); }</div>\n<div>    80% { -webkit-transform: skewX(1deg); }</div>\n<div>    90% { -webkit-transform: skewX(0deg); }</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% { -webkit-transform: skewX(0deg); }</div>\n<div>}</div>\n<div><br></div>\n<div>@-moz-keyframes wiggle {</div>\n<div>    0% { -moz-transform: skewX(9deg); }</div>\n<div>    10% { -moz-transform: skewX(-8deg); }</div>\n<div>    20% { -moz-transform: skewX(7deg); }</div>\n<div>    30% { -moz-transform: skewX(-6deg); }</div>\n<div>    40% { -moz-transform: skewX(5deg); }</div>\n<div>    50% { -moz-transform: skewX(-4deg); }</div>\n<div>    60% { -moz-transform: skewX(3deg); }</div>\n<div>    70% { -moz-transform: skewX(-2deg); }</div>\n<div>    80% { -moz-transform: skewX(1deg); }</div>\n<div>    90% { -moz-transform: skewX(0deg); }</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% { -moz-transform: skewX(0deg); }</div>\n<div>}</div>\n<div><br></div>\n<div>@-o-keyframes wiggle {</div>\n<div>    0% { -o-transform: skewX(9deg); }</div>\n<div>    10% { -o-transform: skewX(-8deg); }</div>\n<div>    20% { -o-transform: skewX(7deg); }</div>\n<div>    30% { -o-transform: skewX(-6deg); }</div>\n<div>    40% { -o-transform: skewX(5deg); }</div>\n<div>    50% { -o-transform: skewX(-4deg); }</div>\n<div>    60% { -o-transform: skewX(3deg); }</div>\n<div>    70% { -o-transform: skewX(-2deg); }</div>\n<div>    80% { -o-transform: skewX(1deg); }</div>\n<div>    90% { -o-transform: skewX(0deg); }</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% { -o-transform: skewX(0deg); }</div>\n<div>}</div>\n<div><br></div>\n<div>@keyframes wiggle {</div>\n<div>    0% { transform: skewX(9deg); }</div>\n<div>    10% { transform: skewX(-8deg); }</div>\n<div>    20% { transform: skewX(7deg); }</div>\n<div>    30% { transform: skewX(-6deg); }</div>\n<div>    40% { transform: skewX(5deg); }</div>\n<div>    50% { transform: skewX(-4deg); }</div>\n<div>    60% { transform: skewX(3deg); }</div>\n<div>    70% { transform: skewX(-2deg); }</div>\n<div>    80% { transform: skewX(1deg); }</div>\n<div>    90% { transform: skewX(0deg); }</div>\n<div>\n<span style=\"white-space:pre;\"></span>100% { transform: skewX(0deg); }</div>\n<div>}</div>\n<div><br></div>\n<div>.wiggle {</div>\n<div>    -webkit-animation-name: wiggle;</div>\n<div>    -moz-animation-name: wiggle;</div>\n<div>    -o-animation-name: wiggle;</div>\n<div>    animation-name: wiggle;</div>\n<div><br></div>\n<div>    -webkit-animation-timing-function: ease-in;</div>\n<div>    -moz-animation-timing-function: ease-in;</div>\n<div>    -o-animation-timing-function: ease-in;</div>\n<div>    animation-timing-function: ease-in;</div>\n<div>}</div>\n<div><br></div>\n<div>.animated.wiggle {</div>\n<div>    -webkit-animation-duration: 0.75s;</div>\n<div>    -moz-animation-duration: 0.75s;</div>\n<div>    -o-animation-duration: 0.75s;</div>\n<div>    animation-duration: 0.75s;</div>\n<div>}&lt;/style&gt;</div>\n<div><br></div>\n<div><br></div>\n<div>\n<span style=\"white-space:pre;\"></span>&lt;!--banner--&gt;</div>\n<div>\n<span style=\"white-space:pre;\"></span>&lt;script src=\"/js/jquery.bxslider-rahisified.js\"&gt;&lt;/script&gt;</div>\n<div>\n<span style=\"white-space:pre;\"></span>&lt;script src=\"/js/jquery.easing.1.3.js\"&gt;&lt;/script&gt;</div>\n<div>\n<span style=\"white-space:pre;\"></span>&lt;!--[if lt IE 9]&gt;</div>\n<div>\n<span style=\"white-space:pre;\"></span>&lt;script src=\"/js/html5shiv.js\"&gt;&lt;/script&gt;</div>\n<div>\n<span style=\"white-space:pre;\"></span>&lt;![endif]--&gt;</div>\n<div><br></div>\n<div>\n<span style=\"white-space:pre;\"></span>&lt;/head&gt;</div>\n<div>&lt;body marginwidth=\"0\" marginheight=\"0\" class=\"show\"&gt;</div>\n<div>&lt;article id=\"cont\" class=\"\" style=\"text-align:center; margin:0 auto; padding:30px 0; width: 1100px; ;\"&gt;</div>\n<div><br></div>\n<div>\n<span style=\"white-space:pre;\"></span>&lt;!-- 컬러챠트 삽입 { --&gt;</div>\n<div>\n<span style=\"white-space:pre;\"></span>&lt;style media=\"\" data-href=\"/colorbox/css/colorbox_iframe.css\"&gt;/*# sourceURL=/colorbox/css/colorbox_iframe.css */</div>\n<div>/*@ sourceURL=/colorbox/css/colorbox_iframe.css */</div>\n<div>@import url(\"https://cdn.rawgit.com/theeluwin/NotoSansKR-Hestia/master/stylesheets/NotoSansKR-Hestia.css\");</div>\n<div><br></div>\n<div><br></div>\n<div><br></div>\n<div>body {margin:0;padding:0;}</div>\n<div><br></div>\n<div>#behr_colorbox {width:850px; font-family: \"Noto Sans Korean\", \"NotoSans\", sans-serif,\"dotum\"; overflow: hidden;position: relative; font-size: 12px;  line-height: 1.2; text-align: left; z-index: 9999;}</div>\n<div>#behr_colorbox * {margin:0; padding: 0; vertical-align: top;}</div>\n<div>#behr_colorbox a {outline: none; text-decoration: none; cursor: pointer;}</div>\n<div>#behr_colorbox img {border:0;}</div>\n<div>#behr_colorbox ul {list-style: none;}</div>\n<div>#behr_colorbox .behr_monitor {width: 570px; border:2px solid #e6e6e5; min-height: 846px; margin-top: 52px; float: left; margin-left: 15px;}</div>\n<div>#behr_colorbox .behr_monitor .behr_color_menu {padding:33px 2px 25px;}</div>\n<div>#behr_colorbox .behr_monitor .behr_color_menu ul {font-size: 0}</div>\n<div>#behr_colorbox .behr_monitor .behr_color_menu ul li {display: inline-block; width: 11%; font-size: 12px;height: 49px; position: relative; vertical-align: top;}</div>\n<div>#behr_colorbox .behr_monitor .behr_color_menu ul li a {display: block; text-align: center; position: absolute; top:0; left:0; width: 100%; bottom:0; }</div>\n<div><br></div>\n<div>#behr_colorbox .behr_inner {width: 540px}</div>\n<div><br></div>\n<div>#behr_colorbox .behr_nav {position: absolute; top:0; left: 15px; height: 52px;}</div>\n<div>#behr_colorbox .behr_nav ul {overflow: hidden; position: absolute; bottom:0; left: 0; width: 582px;}</div>\n<div>#behr_colorbox .behr_nav ul li {float: left; height: 52px; position: relative;width: 108px;}</div>\n<div>#behr_colorbox .behr_nav ul li a {display: block; width: 108px; background: #e6e6e5; text-align: center; position: relative; bottom: 0; position: absolute; left:0; border-radius: 6px 6px 0 0; color:#535353; height: 42px;line-height: 42px; font-size:12px;}</div>\n<div>#behr_colorbox .behr_nav ul li:nth-child(odd) a {background:#f2f2f2;}</div>\n<div>#behr_colorbox .behr_nav ul li a.active {background: #535353; color:#fff; height: 52px; line-height: 58px; font-size: 14px}</div>\n<div><br></div>\n<div>#behr_colorbox .behr_selectColor {width: 240px; float: right; margin-right: 15px;}</div>\n<div>#behr_colorbox .behr_selectColor h3 {height: 52px; background: #535353; color:#fff; font-size: 18px; text-align: center; line-height: 58px; font-weight: 400; border-radius: 5px 5px 0 0}</div>\n<div>#behr_colorbox .behr_palette {background: #e6e6e5; min-height: 850px;} </div>\n<div>#behr_colorbox .behr_palette_guide { font-size: 11px; color: #535353; line-height: 20px; font-weight: 300; padding:12px 11px; border-bottom:1px solid #fff;} </div>\n<div>#behr_colorbox .behr_colorChart {overflow:hidden; overflow-y:scroll; height: 600px;  position: relative;}</div>\n<div>#behr_colorbox .behr_colorChart.bhallcolors {margin-top: 65px;}</div>\n<div>#behr_colorbox .loading {position: absolute; top:160px; left:0; width: 580px; bottom:0; z-index: 998; background: rgba(256,256,256,0.8); text-align: center;}</div>\n<div>#behr_colorbox .loading img {padding-top:45%; }</div>\n<div>#behr_colorbox .cc_submenu a {cursor: pointer;}</div>\n<div>#behr_colorbox .behr_colorChart .cc-box {width: 60px; height: 40px; border-radius: 5px; overflow: hidden; display: inline-block; margin:4px; cursor: pointer;transition: transform 0.2s ease}</div>\n<div>#behr_colorbox .behr_colorChart .cc-box-none {width: 60px; height: 40px; overflow: hidden; display: inline-block; margin:4px;vertical-align: top;}</div>\n<div>#behr_colorbox .behr_colorChart .cc-box-img {width: 540px;  display: inline-block;margin:4px; margin-top: 20px; vertical-align: top;}</div>\n<div>#behr_colorbox .behr_colorChart .cc-box-img img {width: 100% !important;}</div>\n<div>#behr_colorbox .behr_colorChart .cc-box-imgbox {margin-bottom: 4px; height: 274px;}</div>\n<div>#behr_colorbox .behr_colorChart .cc-box-img .cc-box:nth-of-type(2) {margin-left: 0;}</div>\n<div>#behr_colorbox .behr_colorChart .cc-box-img .cc-box:nth-of-type(5) {margin-right: 0;}</div>\n<div>#behr_colorbox .behr_colorChart .cc-box .cc-name {display: none;}</div>\n<div>#behr_colorbox .behr_colorChart .cc-box:hover {transform: scale(1.1); }</div>\n<div>#behr_colorbox .behr_colorChart .cc-box.active {background-image: url(\"https://behr.kr/colorbox/css/../icon/chk.png\") !important; background-position:  50% 50% !important; background-repeat: no-repeat !important;}</div>\n<div>#behr_colorbox .behr_colorChart .cc-box.activeb {background-image: url(\"https://behr.kr/colorbox/css/../icon/chk_b.png\") !important; background-position:  50% 50% !important; background-repeat: no-repeat !important;}</div>\n<div>#behr_colorbox #behr_palette_save .cc-box { position: relative; padding:12px 0; margin:0 12px; border-bottom:1px solid #fff; overflow: hidden; min-height: 57px; box-sizing: border-box; cursor: pointer;}</div>\n<div>#behr_colorbox #behr_palette_save .cc-box .cc-view {display: block; width: 40px; height: 40px;border-radius: 5px; position: absolute; top:12px; left:0; z-index: 3;}</div>\n<div>#behr_colorbox #behr_palette_save .cc-box .cc-name {font-size:12px; padding-left: 52px;padding-top: 1px; color: #535353; padding-right: 40px}</div>\n<div>#behr_colorbox #behr_palette_save .cc-box .cc-name span {display: block; font-size:15px; padding-top: 0px; font-weight: bold;}</div>\n<div>#behr_colorbox #behr_palette_save .cc-box .palette_del {position: absolute; top:24px; right:15px; cursor: pointer; width: 20px; height: 20px; background: url(\"https://behr.kr/colorbox/css/../icon/close.png\") no-repeat 0 0; overflow: hidden; text-align: left; text-indent: -9999px;}</div>\n<div>#behr_colorbox #behr_palette_save .cc-box .palette_del:hover {background-position: 0 -20px;}</div>\n<div>#behr_colorbox .wh-ov {background: #fff; opacity: 0.7; position: fixed; top:0; left:0; bottom:0; right: 0; width: 100%; height: 100%; z-index: 9998; display: none}</div>\n<div>#detailCanvas {background: url(\"https://behr.kr/colorbox/css/../icon/detail_iframe.png\") no-repeat 0 0; width: 1050px; height: 850px; z-index: 9999; position: absolute; top:28px; left: 25px; display: none}</div>\n<div>#detailCanvas a.detailCanvas_close {position: absolute; top:3px; left: 771px; width: 26px; height: 26px; display: block; overflow: hidden; text-indent: -999px; text-align: left; cursor: pointer;}</div>\n<div>#detailCanvas #detailCanvas_list {position: absolute; top:30px; left: 232px; overflow: hidden; height: 60px; width: 540px; padding-top: 5px; padding-left: 5px;}</div>\n<div>#detailCanvas #detailCanvas_list .cc-box {float: left; margin-right: 5px;width: 43px; height: 43px; display: block; position: relative; cursor: pointer;border-radius: 5px; margin-bottom: 5px}</div>\n<div>#detailCanvas #detailCanvas_list .cc-box .cc-view {position: relative;width: 43px; height: 43px; border-radius: 5px; display: block; top:0; left:0;position: absolute;}</div>\n<div>#detailCanvas #detailCanvas_list .cc-box.active .cc-view  {border:4px solid  #3f3e3e;  top:-4px; left:-4px; z-index: 3;}</div>\n<div>#detailCanvas #detailCanvas_list .cc-box:hover .cc-view {transform: scale(1.1);}</div>\n<div>#detailCanvas #detailCanvas_list .cc-box.active:hover .cc-view {transform: scale(1);}</div>\n<div>#detailCanvas #detailCanvas_list .cc-box .cc-name, #detailCanvas #detailCanvas_list .cc-box .palette_del {display:none;}</div>\n<div>#detailCanvas #detailCanvas_view {width: 540px; height: 200px; display: block; position: absolute; top:100px; left: 237px;}</div>\n<div>#detailCanvas #detailCanvas_view .cc-box .cc-view {position: absolute; top:0; left: 0; right: 0; bottom: 0; z-index: -1;}</div>\n<div>#detailCanvas #detailCanvas_view .cc-box .cc-name {padding:30px 35px 18px; font-size:30px; color:#fff; font-weight: bold;}</div>\n<div>#detailCanvas #detailCanvas_view .cc-box .cc-name span {display: block;font-weight: normal; font-size: 22px; color:#fff;}</div>\n<div>#detailCanvas #detailCanvas_view .cc-box[data-tcol=B] .cc-name, </div>\n<div>#detailCanvas #detailCanvas_view .cc-box[data-tcol=B] .cc-name span {color:#333;}</div>\n<div>#detailCanvas #detailCanvas_view .cc-box .palette_del {display: none;}</div>\n<div>#detailCanvas #detailCanvas_view .cc-box .detailColorvs_buyBtn {display: none; bottom:10px; left:233px;}</div>\n<div>#detailCanvas #detailCanvas_view:hover .cc-box .detailColorvs_buyBtn {display: block;}</div>\n<div>#detailCanvas .detailCanvas_btn {display: block;width: 174px; height: 53px; position: absolute; top:319px; cursor: pointer; text-indent: -999px; text-align: left; overflow: hidden; }</div>\n<div>#detailCanvas .detailCanvas_btn01 {left: 237px;}</div>\n<div>#detailCanvas .detailCanvas_btn02 {left: 419px;}</div>\n<div>#detailCanvas .detailCanvas_btn03 {left: 602px;}</div>\n<div>#detailCanvas .detailCanvas_btn:hover {background: url(\"https://behr.kr/colorbox/css/../icon/btn_hover_iframe.gif\") no-repeat 0 0;}</div>\n<div>#detailCanvas .detailCanvas_view {display: block; width: 175px; position: absolute; top:388px; height: 237px;}</div>\n<div>#detailCanvas .detailCanvas_view01 {left: 237px;}</div>\n<div>#detailCanvas .detailCanvas_view02 {left: 419px;}</div>\n<div>#detailCanvas .detailCanvas_view03 {left: 602px;}</div>\n<div>#detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .cc-view {position: absolute; top:0; left: 0; right: 0; bottom: 0; z-index: -1;}</div>\n<div>#detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .cc-name {padding:25px 40px 18px 5px; font-size:16px; color:#fff; font-weight: bold;}</div>\n<div>#detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .cc-name span {display: block;font-weight: normal; font-size: 15px; color:#fff;}</div>\n<div>#detailCanvas #detailCanvas_color .detailCanvas_view .cc-box[data-tcol=B] .cc-name, </div>\n<div>#detailCanvas #detailCanvas_color .detailCanvas_view .cc-box[data-tcol=B] .cc-name span {color:#333;}</div>\n<div>#detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .palette_del {display: none; }</div>\n<div>#detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .detailColorvs_buyBtn {display: none; top:140px;left:50px;}</div>\n<div>#detailCanvas #detailCanvas_color .detailCanvas_view01:hover .cc-box .detailColorvs_buyBtn {display: block;}</div>\n<div>#detailCanvas #detailCanvas_color .detailCanvas_view02:hover .cc-box .detailColorvs_buyBtn {display: block;}</div>\n<div>#detailCanvas #detailCanvas_color .detailCanvas_view03:hover .cc-box .detailColorvs_buyBtn {display: block;}</div>\n<div>#detailCanvas .detailColorvs_buyBtn {cursor: pointer; width: 74px; height: 74px; background: url(\"https://behr.kr/colorbox/css/../icon/cart.png\") no-repeat 0 0; text-align: left; text-indent: -9999px; overflow: hidden; position: absolute; }</div>\n<div><br></div>\n<div>/*검색결과*/</div>\n<div>#behr_colorbox #cc_search_area {display: none; position: absolute; height: 104px; top:54px; left: 17px; width: 540px; background: #fff;}</div>\n<div>#behr_colorbox #cc_search_area .cc_search {display: block; background: url(\"https://behr.kr/colorbox/css/../icon/ccsearch_iframe.jpg\") no-repeat 0 0; width: 500px; height: 50px; position: absolute; top:33px; left:44px;}</div>\n<div>#behr_colorbox #cc_search_area .cc_search label {display: inline-block; width: 100px; line-height: 50px; font-size: 18px; color:#535353; text-align: center; }</div>\n<div>#behr_colorbox #cc_search_area .cc_search input {display: inline-block;width:308px; height: 48px; line-height: 48px; border:0; background: #fff; font-size: 14px; color:#535353; padding: 0 20px; box-sizing: border-box; margin-top: 1px;}</div>\n<div>#behr_colorbox #cckeywordauto {position: absolute; top:92px; width: 550px; text-align: center;}</div>\n<div>#behr_colorbox #cckeywordauto ul {text-align: center; font-size: 0;}</div>\n<div>#behr_colorbox #cckeywordauto ul li {display: inline-block; background: #e6e6e5; border-radius: 5px; padding:5px 8px; font-size:14px; color:#535353; margin:0 2px;}</div>\n<div>#behr_colorbox #cckeywordauto ul li:nth-child(odd) {background: #f2f2f2;}</div>\n<div>#behr_colorbox #cckeywordauto ul li a {cursor: pointer; font-weight: 100}</div>\n<div>#ccsearchOutput {background: #535353; color:#fff; padding:0 14px; line-height: 41px; height: 41px; box-sizing: border-box; position: absolute; top:143px; left:20px; right: 20px;}</div>\n<div>#ccsearchOutput span {vertical-align: bottom; font-size:22px; margin-right: 8px; display: inline-block;}</div>\n<div>#behr_colorbox.namelist .behr_colorChart .cc-box {width: 80px; height: 60px; display: inline-block; overflow: visible; position: relative; margin:10px 175px 10px 20px; position: relative; transition: none;}</div>\n<div>#behr_colorbox.namelist .behr_colorChart .cc-box:before {content: \'\'; display: block; position: absolute; background:#ddd; width: 230px; height: 1px; bottom:-10px; left:0;}</div>\n<div>#behr_colorbox.namelist .behr_colorChart .cc-box:hover {transform: scale(1);}</div>\n<div>#behr_colorbox.namelist .behr_colorChart .cc-name { position: absolute; left: 87px; top:6px; display: block; width: 210px; font-size: 14px; color:#535353;}</div>\n<div>#behr_colorbox.namelist .behr_colorChart .cc-name span {display: block;}</div>\n<div>#behr_colorbox.namelist .behr_colorChart {margin-top: 78px !important; height: 660px !important;}</div>\n<div>#behr_colorbox.namelist .loading {top:238px;}</div>\n<div><br></div>\n<div><br></div>\n<div>#behr_colorbox.all_colors .behr_colorChart {margin-top: 65px;}</div>\n<div><br></div>\n<div>/*메뉴별 모양*/</div>\n<div>#behr_colorbox .behr_color_menu a {color: transparent;}</div>\n<div><br></div>\n<div>/*1.all colors메뉴*/</div>\n<div>#behr_colorbox.all_colors .behr_color_menu a.bh_colornav0 {background: #b1383d;}</div>\n<div>#behr_colorbox.all_colors .behr_color_menu a.bh_colornav1 {background: #d3533a}</div>\n<div>#behr_colorbox.all_colors .behr_color_menu a.bh_colornav2 {background: #ffcb3a}</div>\n<div>#behr_colorbox.all_colors .behr_color_menu a.bh_colornav3 {background: #4f725a}</div>\n<div>#behr_colorbox.all_colors .behr_color_menu a.bh_colornav4 {background: #006993}</div>\n<div>/*#behr_colorbox.all_colors .behr_color_menu a.bh_colornav5 {background: #86b9b2}*/</div>\n<div>#behr_colorbox.all_colors .behr_color_menu a.bh_colornav5 {background: #7f657e}</div>\n<div>#behr_colorbox.all_colors .behr_color_menu a.bh_colornav6 {background: #a99884}</div>\n<div>#behr_colorbox.all_colors .behr_color_menu a.bh_colornav7 {background: #818181}</div>\n<div>#behr_colorbox.all_colors .behr_color_menu a.bh_colornav8 {background: #f1f1f1}</div>\n<div><br></div>\n<div>/*2.best coloes 메뉴*/</div>\n<div>#behr_colorbox.best_colors .behr_color_menu a.bh_colornav0 {background: #b1383d;}</div>\n<div>#behr_colorbox.best_colors .behr_color_menu a.bh_colornav1 {background: #d3533a}</div>\n<div>#behr_colorbox.best_colors .behr_color_menu a.bh_colornav2 {background: #ffcb3a}</div>\n<div>#behr_colorbox.best_colors .behr_color_menu a.bh_colornav3 {background: #4f725a}</div>\n<div>#behr_colorbox.best_colors .behr_color_menu a.bh_colornav4 {background: #006993}</div>\n<div>/*#behr_colorbox.best_colors .behr_color_menu a.bh_colornav5 {background: #86b9b2}*/</div>\n<div>#behr_colorbox.best_colors .behr_color_menu a.bh_colornav5 {background: #7f657e}</div>\n<div>#behr_colorbox.best_colors .behr_color_menu a.bh_colornav6 {background: #a99884}</div>\n<div>#behr_colorbox.best_colors .behr_color_menu a.bh_colornav7 {background: #818181}</div>\n<div>#behr_colorbox.best_colors .behr_color_menu a.bh_colornav8 {background: #f1f1f1}</div>\n<div><br></div>\n<div>/*3. by booms 메뉴*/</div>\n<div>#behr_colorbox.by_rooms .behr_monitor .behr_color_menu ul li {width: 67px;}</div>\n<div>#behr_colorbox.by_rooms .behr_color_menu a {background:#f2f2f2 url(\"https://behr.kr/colorbox/css/../icon/byroom.png\") no-repeat;}</div>\n<div>#behr_colorbox.by_rooms .behr_color_menu ul li:nth-child(odd) a {background-color:#e6e6e6;}</div>\n<div>#behr_colorbox.by_rooms .behr_color_menu a.bh_colornav0 {background-position: 0 0 !important; }</div>\n<div>#behr_colorbox.by_rooms .behr_color_menu a.bh_colornav1 {background-position: -99px 0 !important; }</div>\n<div>#behr_colorbox.by_rooms .behr_color_menu a.bh_colornav2 {background-position: -198px 0 !important; }</div>\n<div>#behr_colorbox.by_rooms .behr_color_menu a.bh_colornav3 {background-position: -297px 0 !important; }</div>\n<div>#behr_colorbox.by_rooms .behr_color_menu a.bh_colornav4 {background-position: -396px 0 !important; }</div>\n<div>#behr_colorbox.by_rooms .behr_color_menu a.bh_colornav5 {background-position: -495px 0 !important; }</div>\n<div>#behr_colorbox.by_rooms .behr_color_menu a.bh_colornav6 {background-position: -594px 0 !important; }</div>\n<div>#behr_colorbox.by_rooms .behr_color_menu a.bh_colornav7 {background-position: -693px 0 !important; }</div>\n<div><br></div>\n<div>/*4. by styles 메뉴*/</div>\n<div>#behr_colorbox.by_styles .behr_monitor .behr_color_menu ul li {width: 67px;}</div>\n<div>#behr_colorbox.by_styles .behr_color_menu a {background:#f2f2f2; position: relative;}</div>\n<div>#behr_colorbox.by_styles .behr_color_menu ul li:nth-child(odd) a {background-color:#e6e6e6;}</div>\n<div>#behr_colorbox.by_styles .behr_color_menu a span {color:#535353; line-height: 49px;font-size: 12px; letter-spacing: -0.02em}</div>\n<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav0 span {color:#9f9480;}</div>\n<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav1 span {color:#4fb3d0;}</div>\n<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav2 span {color:#88a379;}</div>\n<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav3 span {color:#848595;}</div>\n<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav4 span {color:#81242b;}</div>\n<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav5 span {color:#c1a889;}</div>\n<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav6 span {color:#64a093;}</div>\n<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav7 span {color:#839894;}</div>\n<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav0.active {background:#9f9480;}</div>\n<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav1.active {background:#4fb3d0;}</div>\n<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav2.active {background:#88a379;}</div>\n<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav3.active {background:#848595;}</div>\n<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav4.active {background:#81242b;}</div>\n<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav5.active {background:#c1a889;}</div>\n<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav6.active {background:#64a093;}</div>\n<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav7.active {background:#839894;}</div>\n<div>#behr_colorbox.by_styles .behr_color_menu a.active span {color:#fff !important;line-height: 60px;}</div>\n<div>#behr_colorbox.by_styles .behr_color_menu a.active {height: 60px; margin-top: -5px;border-radius: 5px; }</div>\n<div><br></div>\n<div>#behr_colorbox.all_colors .behr_color_menu a.active,</div>\n<div>#behr_colorbox.best_colors .behr_color_menu a.active {background-image: url(\"https://behr.kr/colorbox/css/../icon/check.png\"); background-repeat: no-repeat; background-position: 50% 50%; height: 60px; margin-top: -5px; border-radius: 5px; }</div>\n<div>#behr_colorbox.by_rooms .behr_color_menu ul li a:hover {background-color: #535353; border-radius: 5px; }</div>\n<div>#behr_colorbox.by_rooms .behr_color_menu ul li a span {position: absolute; top:-20px; text-align: center; color:#535353; width: 100%; left: 0; display:none;}</div>\n<div>#behr_colorbox.by_rooms .behr_color_menu ul li a:hover span, #behr_colorbox.by_rooms .behr_color_menu ul li a.active span {position: absolute; top:-20px; text-align: center; display: block; color:#535353; width: 100%; left: 0;}</div>\n<div>#behr_colorbox.by_rooms .behr_color_menu ul li a.active {background-color: #535353; height: 60px; margin-top: -5px; border-radius: 5px;}</div>\n<div>#behr_colorbox.by_rooms .behr_color_menu a.active:after,</div>\n<div>#behr_colorbox.by_styles .behr_color_menu a.active:after {position:absolute; content: \'\';display: block; width: 100%; height: 100%; top:0; left: :0;  background-image: url(\"https://behr.kr/colorbox/css/../icon/check.png\"); background-repeat: no-repeat; background-position: 50% 50%; height: 60px; margin-top: -5px; border-radius: 5px; }</div>\n<div><br></div>\n<div>#behr_colorbox.by_styles .behr_color_menu ul li a u {position: absolute; top:-20px; text-align: center; color:#535353; width: 100%; left: 0; display:none; text-decoration: none;}</div>\n<div>#behr_colorbox.by_styles .behr_color_menu ul li a:hover u, #behr_colorbox.by_styles .behr_color_menu ul li a.active u {position: absolute; top:-20px; text-align: center; display: block; color:#535353; width: 100%; left: 0;}</div>\n<div><br></div>\n<div><br></div>\n<div>#behr_colorbox .cc_more_btn {position: absolute; left:184px; width: 208px; text-align: center;}</div>\n<div>#behr_colorbox .cc_more_btn a {display: block; height: 37px; width: 208px; color: #535353; cursor: pointer;}</div>\n<div>#behr_colorbox .cc_more_btn a i {display: inline-block; width: 35px; height: 35px; border-radius: 50%; background: #f9f9f9; vertical-align: middle; margin:0 10px;}</div>\n<div>#behr_colorbox .cc_more_btn a span {display: inline-block; vertical-align: top; width: 50px; height: 35px; line-height: 31px; text-align: left;text-transform : capitalize}</div>\n<div>#behr_colorbox .cc_more_btn a i.red {background:#b1383d }</div>\n<div>#behr_colorbox .cc_more_btn a i.orange {background:#d3533a }</div>\n<div>#behr_colorbox .cc_more_btn a i.yellow {background: #ffcb3a}</div>\n<div>#behr_colorbox .cc_more_btn a i.green {background: #4f725a}</div>\n<div>#behr_colorbox .cc_more_btn a i.blue {background:#006993 }</div>\n<div>#behr_colorbox .cc_more_btn a i.mint {background: #86b9b2}</div>\n<div>#behr_colorbox .cc_more_btn a i.purple {background: #7f657e}</div>\n<div>#behr_colorbox .cc_more_btn.prev {top:167px;}</div>\n<div>#behr_colorbox .cc_more_btn.next {top:850px;}</div>\n<div>#behr_colorbox .cc_more_btn.prev a i {background-repeat: no-repeat; background-image: url(\"https://behr.kr/colorbox/css/../icon/a_up.png\"); background-position: 50% 50%;}</div>\n<div>#behr_colorbox .cc_more_btn.next a i {background-repeat: no-repeat; background-image: url(\"https://behr.kr/colorbox/css/../icon/a_down.png\"); background-position: 50% 50%;}</div>\n<div>#behr_colorbox.namelist .cc_more_btn {display: none !important}</div>\n<div><br></div>\n<div><br></div>\n<div><br></div>\n<div><br></div>\n<div>/* 20180327 신령주 추가 */</div>\n<div>#behr_colorbox span.cc_zoom {position:absolute; right:-10px; bottom:-5px; display:block; width:21px; height:21px; background:url(\"https://behr.kr/colorbox/css/../icon/zoomin.png\") 0 0 no-repeat;}</div>\n<div>#behr_colorbox .behr_nav ul li a:hover{background: #535353; color:#fff; height: 52px; line-height: 58px; font-size: 18px}</div>\n<div>#behr_colorbox.all_colors .behr_color_menu ul.cc_submenu li a:hover {background-image: url(\"https://behr.kr/colorbox/css/../icon/check.png\"); background-repeat: no-repeat; background-position: 50% 50%; height: 60px; margin-top: -5px; border-radius: 5px; }</div>\n<div>#detailCanvas_list span.cc_zoom {display:none;}</div>\n<div>#behr_colorbox.best_colors .behr_color_menu a:hover {background-image: url(\"https://behr.kr/colorbox/css/../icon/check.png\"); background-repeat: no-repeat; background-position: 50% 50%; height: 60px; margin-top: -5px; border-radius: 5px; }</div>\n<div>#behr_colorbox.by_rooms .behr_color_menu ul li a.active {background:#535353 url(\"https://behr.kr/colorbox/css/../icon/byroom_on.png\") no-repeat;}</div>\n<div>#behr_colorbox.by_rooms .behr_color_menu ul li a:hover {background:#535353 url(\"https://behr.kr/colorbox/css/../icon/byroom_on.png\") no-repeat; height: 60px; margin-top: -5px; border-radius: 5px;}</div>\n<div>#behr_colorbox.by_rooms .behr_color_menu ul li a:hover:after {position:absolute; content: \'\';display: block; width: 100%; height: 100%; top:0; left: :0;  background-image: url(\"https://behr.kr/colorbox/css/../check.png\"); background-repeat: no-repeat; background-position: 50% 50%; height: 60px; margin-top: -5px; border-radius: 5px; }</div>\n<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav0:hover {background:#9f9480;}</div>\n<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav1:hover {background:#4fb3d0;}</div>\n<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav2:hover {background:#88a379;}</div>\n<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav3:hover {background:#848595;}</div>\n<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav4:hover {background:#81242b;}</div>\n<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav5:hover {background:#c1a889;}</div>\n<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav6:hover {background:#64a093;}</div>\n<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav7:hover {background:#839894;}</div>\n<div>#behr_colorbox.by_styles .behr_color_menu a:hover span {color:#fff !important;line-height: 60px;}</div>\n<div>#behr_colorbox.by_styles .behr_color_menu a:hover {height: 60px; margin-top: -5px;border-radius: 5px; }</div>\n<div>#behr_colorbox.by_styles .behr_color_menu a:hover:after {position:absolute; content: \'\';display: block; width: 100%; height: 100%; top:0; left: :0;  background-image: url(\"https://behr.kr/colorbox/css/../icon/check.png\"); background-repeat: no-repeat; background-position: 50% 50%; height: 60px; margin-top: -5px; border-radius: 5px; }</div>\n<div>#behr_colorbox.by_styles .behr_color_menu a {text-transform: capitalize;}</div>\n<div><br></div>\n<div>#detailCanvas_view span.cc_zoom {display:none;}</div>\n<div>#behr_colorbox .detailCanvas_view span.cc_zoom {display:none;}</div>\n<div>#detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .palette_del {position: absolute; top:5px; right:5px; cursor: pointer; width: 20px; height: 20px; background: url(\"https://behr.kr/colorbox/css/../icon/close.png\") no-repeat 0 0; overflow: hidden; text-align: left; text-indent: -9999px; display:block;}</div>\n<div>#detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .palette_del:hover {background-position: 0 -20px;}</div>\n<div>.behr_palette .pal_down {display:block; margin:0 auto !important; cursor:pointer;}</div>\n<div>.behr_palette .pal_up {display:block; margin:0 auto 0 !important; padding-top:5px !important; cursor:pointer;}</div>\n<div>.behr_palette #behr_palette_save {height:720px; overflow:hidden;}</div>\n<div>#detailCanvas #detailCanvas_list.h90 {height:96px;}</div>\n<div>#detailCanvas #detailCanvas_view.h90 {height:164px; top:140px;}&lt;/style&gt;</div>\n<div>\n<span style=\"white-space:pre;\"></span>&lt;script type=\"text/javascript\" src=\"/colorbox/js/colorbox_iframe.js?ver=1\"&gt;&lt;/script&gt;</div>\n<div>\n<span style=\"white-space:pre;\"></span>&lt;script type=\"text/javascript\"&gt;</div>\n<div>\n<span style=\"white-space:pre;\"></span>var buyInput = \"textinput\"; <span style=\"white-space:pre;\"></span>//컬러값 입력하는곳의 아이디입력</div>\n<div>\n<span style=\"white-space:pre;\"></span>var ccDisplay = \"off\"; <span style=\"white-space:pre;\"></span>//컬러값 선택후 컬러챠트 사라는 기능 on/off</div>\n<div>\n<span style=\"white-space:pre;\"></span>var cckwd = new Array(\"coffee\",\"silver\",\"vintage\",\"lemon\",\"red\",\"green\",\"pink\"); <span style=\"white-space:pre;\"></span>//추천키워드 최대 7개</div>\n<div>\n<span style=\"white-space:pre;\"></span>&lt;/script&gt;</div>\n<div>\n<span style=\"white-space:pre;\"></span>&lt;div id=\"behr_colorbox\" class=\"sch_color by_rooms\"&gt;&lt;div class=\"behr_nav\"&gt; <span style=\"white-space:pre;\"></span>&lt;ul&gt; <span style=\"white-space:pre;\"></span>&lt;li&gt;&lt;a class=\"ccsubmenu\" data-cc_category=\"all_colors\"&gt;All Colors&lt;/a&gt;&lt;/li&gt; <span style=\"white-space:pre;\"></span>&lt;li&gt;&lt;a class=\"ccsubmenu\" data-cc_category=\"best_colors\"&gt;Best Colors&lt;/a&gt;&lt;/li&gt; <span style=\"white-space:pre;\"></span>&lt;li&gt;&lt;a class=\"ccsubmenu active\" data-cc_category=\"by_rooms\"&gt;By Rooms&lt;/a&gt;&lt;/li&gt; <span style=\"white-space:pre;\"></span>&lt;li&gt;&lt;a class=\"ccsubmenu\" data-cc_category=\"by_styles\"&gt;By Styles&lt;/a&gt;&lt;/li&gt; <span style=\"white-space:pre;\"></span>&lt;li&gt;&lt;a class=\"ccsearch\"&gt;Search&lt;/a&gt;&lt;/li&gt; <span style=\"white-space:pre;\"></span>&lt;/ul&gt; <span style=\"white-space:pre;\"></span>&lt;/div&gt; <span style=\"white-space:pre;\"></span>&lt;div class=\"behr_monitor\"&gt; <span style=\"white-space:pre;\"></span>&lt;div class=\"behr_inner\"&gt; <span style=\"white-space:pre;\"></span>&lt;div class=\"behr_color_menu\"&gt; <span style=\"white-space:pre;\"></span>&lt;ul class=\"cc_submenu\"&gt;&lt;li&gt;&lt;a data-group=\"BEDROOM\" class=\"bh_colornav0 active\"&gt;&lt;span&gt;침실&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a data-group=\"BATHROOM\" class=\"bh_colornav1\"&gt;&lt;span&gt;욕실&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a data-group=\"KIDSROOM\" class=\"bh_colornav2\"&gt;&lt;span&gt;아이방&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a data-group=\"LIVINGROOM\" class=\"bh_colornav3\"&gt;&lt;span&gt;거실&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a data-group=\"KITCHEN\" class=\"bh_colornav4\"&gt;&lt;span&gt;부엌&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a data-group=\"DININGROOM\" class=\"bh_colornav5\"&gt;&lt;span&gt;주방&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a data-group=\"OFFICE\" class=\"bh_colornav6\"&gt;&lt;span&gt;서재&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a data-group=\"EXTERIOR\" class=\"bh_colornav7\"&gt;&lt;span&gt;실외공간&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt; <span style=\"white-space:pre;\"></span>&lt;/div&gt; <span style=\"white-space:pre;\"></span>&lt;div id=\"cc_search_area\" style=\"display: none;\"&gt; <span style=\"white-space:pre;\"></span>&lt;div class=\"cc_search\"&gt; <span style=\"white-space:pre;\"></span>&lt;label&gt;컬러찾기&lt;/label&gt;&lt;input type=\"text\" id=\"cc_search_btn\" placeholder=\"컬러번호 또는 컬러명으로 검색하세요\"&gt; <span style=\"white-space:pre;\"></span>&lt;/div&gt; <span style=\"white-space:pre;\"></span>&lt;div id=\"cckeywordauto\"&gt; <span style=\"white-space:pre;\"></span>&lt;ul&gt;&lt;li&gt;&lt;a&gt;coffee&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a&gt;silver&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a&gt;vintage&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a&gt;lemon&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a&gt;red&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a&gt;green&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a&gt;pink&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt; <span style=\"white-space:pre;\"></span>&lt;/div&gt; <span style=\"white-space:pre;\"></span>&lt;div id=\"ccsearchOutput\"&gt;&lt;span id=\"cckeyword\"&gt;coffee&lt;/span&gt;검색결과&lt;/div&gt; <span style=\"white-space:pre;\"></span>&lt;/div&gt; <span style=\"white-space:pre;\"></span>&lt;/div&gt; <span style=\"white-space:pre;\"></span>&lt;div class=\"behr_colorChart\" style=\"display: block;\"&gt;&lt;div class=\"cc-box\" data-ccid=\"0\" data-name=\"PALE CORAL\" data-code=\"PPU3-07\" data-rgb=\"#F0D0B5\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#F0D0B5;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;PALE CORAL&lt;span&gt;PPU3-07&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"1\" data-name=\"COCO\" data-code=\"N270-3\" data-rgb=\"#D1BBA2\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#D1BBA2;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;COCO&lt;span&gt;N270-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"2\" data-name=\"STUDIO TAUPE\" data-code=\"PPU5-07\" data-rgb=\"#A5978A\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#A5978A;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;STUDIO TAUPE&lt;span&gt;PPU5-07&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"3\" data-name=\"CHATEAU\" data-code=\"PPU7-06\" data-rgb=\"#B5A18B\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#B5A18B;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;CHATEAU&lt;span&gt;PPU7-06&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"4\" data-name=\"DISTANT LAND\" data-code=\"N260-5\" data-rgb=\"#A68A72\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#A68A72;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;DISTANT LAND&lt;span&gt;N260-5&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"5\" data-name=\"ANTIQUE WHITE\" data-code=\"23\" data-rgb=\"#E8DDCB\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#E8DDCB;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;ANTIQUE WHITE&lt;span&gt;23&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"6\" data-name=\"CURIOUS COLLECTION\" data-code=\"N290-4\" data-rgb=\"#D2BB9A\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#D2BB9A;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;CURIOUS COLLECTION&lt;span&gt;N290-4&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"7\" data-name=\"DOESKIN GRAY\" data-code=\"N200-2\" data-rgb=\"#CCC3BB\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#CCC3BB;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;DOESKIN GRAY&lt;span&gt;N200-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"8\" data-name=\"WASABI POWDER\" data-code=\"PPU9-10\" data-rgb=\"#BDB390\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#BDB390;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;WASABI POWDER&lt;span&gt;PPU9-10&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"9\" data-name=\"MINTED LEMON\" data-code=\"PPU10-08\" data-rgb=\"#C0C6A9\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#C0C6A9;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;MINTED LEMON&lt;span&gt;PPU10-08&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"10\" data-name=\"RIVERDALE\" data-code=\"N410-3\" data-rgb=\"#BEC5BC\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#BEC5BC;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;RIVERDALE&lt;span&gt;N410-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"11\" data-name=\"ZEN\" data-code=\"PPU11-14\" data-rgb=\"#AABAB0\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#AABAB0;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;ZEN&lt;span&gt;PPU11-14&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"12\" data-name=\"ATMOSPHERIC\" data-code=\"PPU12-15\" data-rgb=\"#899698\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#899698;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;ATMOSPHERIC&lt;span&gt;PPU12-15&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"13\" data-name=\"OBSERVATORY\" data-code=\"PPU13-19\" data-rgb=\"#455D66\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#455D66;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;OBSERVATORY&lt;span&gt;PPU13-19&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"14\" data-name=\"FLOWING BREEZE\" data-code=\"N480-2\" data-rgb=\"#B9C6CC\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#B9C6CC;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;FLOWING BREEZE&lt;span&gt;N480-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"15\" data-name=\"FOREVER DENIM\" data-code=\"PPU14-05\" data-rgb=\"#778591\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#778591;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;FOREVER DENIM&lt;span&gt;PPU14-05&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"16\" data-name=\"CATHEDRAL GRAY\" data-code=\"PPU18-14\" data-rgb=\"#ACAAA8\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#ACAAA8;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;CATHEDRAL GRAY&lt;span&gt;PPU18-14&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"17\" data-name=\"SUEDE GRAY\" data-code=\"PPU18-17\" data-rgb=\"#857F7B\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#857F7B;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;SUEDE GRAY&lt;span&gt;PPU18-17&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"18\" data-name=\"FRENCH LILAC\" data-code=\"PPU16-10\" data-rgb=\"#BDB8BB\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#BDB8BB;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;FRENCH LILAC&lt;span&gt;PPU16-10&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"19\" data-name=\"SO MERLOT\" data-code=\"PPU1-15\" data-rgb=\"#84525B\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#84525B;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;SO MERLOT&lt;span&gt;PPU1-15&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"20\" data-name=\"BLACKBERRY JAM\" data-code=\"S100-6\" data-rgb=\"#6F5F71\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#6F5F71;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;BLACKBERRY JAM&lt;span&gt;S100-6&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"21\" data-name=\"LUXE LILAC\" data-code=\"N560-3\" data-rgb=\"#A7A3B2\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#A7A3B2;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;LUXE LILAC&lt;span&gt;N560-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"22\" data-name=\"BLUEPRINT\" data-code=\"S470-5\" data-rgb=\"#5F818F\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#5F818F;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;BLUEPRINT&lt;span&gt;S470-5&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"23\" data-name=\"HALF SEA FOG\" data-code=\"N470-3\" data-rgb=\"#A9B7BC\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#A9B7BC;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;HALF SEA FOG&lt;span&gt;N470-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"24\" data-name=\"SILVER BULLET\" data-code=\"N520-2\" data-rgb=\"#C4C4C4\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#C4C4C4;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;SILVER BULLET&lt;span&gt;N520-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"25\" data-name=\"MINED COAL\" data-code=\"PPU18-18\" data-rgb=\"#6C6A66\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#6C6A66;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;MINED COAL&lt;span&gt;PPU18-18&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"26\" data-name=\"JUNGLE CAMOUFLAGE\" data-code=\"N350-4\" data-rgb=\"#AAA795\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#AAA795;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;JUNGLE CAMOUFLAGE&lt;span&gt;N350-4&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"27\" data-name=\"KINDLING\" data-code=\"N200-6\" data-rgb=\"#7A7069\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#7A7069;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;KINDLING&lt;span&gt;N200-6&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"28\" data-name=\"HARMONIOUS GOLD\" data-code=\"M300-3\" data-rgb=\"#E9CFA4\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#E9CFA4;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;HARMONIOUS GOLD&lt;span&gt;M300-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"29\" data-name=\"LUNAR SURFACE\" data-code=\"N460-3\" data-rgb=\"#B5B9B7\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#B5B9B7;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;LUNAR SURFACE&lt;span&gt;N460-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"30\" data-name=\"CANVAS LUGGAGE\" data-code=\"N300-2\" data-rgb=\"#E1D7C7\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#E1D7C7;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;CANVAS LUGGAGE&lt;span&gt;N300-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"31\" data-name=\"BREATHE\" data-code=\"S360-2\" data-rgb=\"#D1D1B9\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#D1D1B9;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;BREATHE&lt;span&gt;S360-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"32\" data-name=\"METROPOLIS\" data-code=\"N140-3\" data-rgb=\"#B3A9A6\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#B3A9A6;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;METROPOLIS&lt;span&gt;N140-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"33\" data-name=\"LINEN WHITE\" data-code=\"70\" data-rgb=\"#F6ECD8\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#F6ECD8;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;LINEN WHITE&lt;span&gt;70&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"34\" data-name=\"ANONYMOUS\" data-code=\"780F-5\" data-rgb=\"#939392\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#939392;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;ANONYMOUS&lt;span&gt;780F-5&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"35\" data-name=\"DRY BROWN\" data-code=\"N230-5\" data-rgb=\"#968375\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#968375;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;DRY BROWN&lt;span&gt;N230-5&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"36\" data-name=\"PERFECT TAUPE\" data-code=\"PPU18-13\" data-rgb=\"#B5ACA1\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#B5ACA1;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;PERFECT TAUPE&lt;span&gt;PPU18-13&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"37\" data-name=\"STERLING\" data-code=\"780E-3\" data-rgb=\"#D2D4D3\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#D2D4D3;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;STERLING&lt;span&gt;780E-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"38\" data-name=\"SUBTLE TOUCH\" data-code=\"790E-1\" data-rgb=\"#DBDADA\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#DBDADA;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;SUBTLE TOUCH&lt;span&gt;790E-1&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"39\" data-name=\"FRENCH SILVER\" data-code=\"PPU18-05\" data-rgb=\"#B8BCBE\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#B8BCBE;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;FRENCH SILVER&lt;span&gt;PPU18-05&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"40\" data-name=\"FLANNEL GRAY\" data-code=\"N520-3\" data-rgb=\"#ADADAD\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#ADADAD;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;FLANNEL GRAY&lt;span&gt;N520-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"41\" data-name=\"ULTRA PURE WHITE PRW15\" data-code=\"PR-W15\" data-rgb=\"#F8F9F5\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#F8F9F5;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;ULTRA PURE WHITE PRW15&lt;span&gt;PR-W15&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"42\" data-name=\"WHITE METAL\" data-code=\"N520-1\" data-rgb=\"#D0D0D0\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#D0D0D0;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;WHITE METAL&lt;span&gt;N520-1&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"43\" data-name=\"BURNISHED CLAY\" data-code=\"PPU18-09\" data-rgb=\"#D2CCC5\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#D2CCC5;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;BURNISHED CLAY&lt;span&gt;PPU18-09&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"44\" data-name=\"DARK NAVY\" data-code=\"S530-7\" data-rgb=\"#40495B\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#40495B;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;DARK NAVY&lt;span&gt;S530-7&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"45\" data-name=\"DARK PEWTER\" data-code=\"PPU18-04\" data-rgb=\"#8D9397\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#8D9397;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;DARK PEWTER&lt;span&gt;PPU18-04&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"46\" data-name=\"POLAR BEAR\" data-code=\"75\" data-rgb=\"#F5F3ED\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#F5F3ED;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;POLAR BEAR&lt;span&gt;75&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"47\" data-name=\"CHICAGO FOG\" data-code=\"N140-2\" data-rgb=\"#C9C1BE\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#C9C1BE;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;CHICAGO FOG&lt;span&gt;N140-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"48\" data-name=\"SPUN WOOL\" data-code=\"N220-1\" data-rgb=\"#E3DDD6\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#E3DDD6;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;SPUN WOOL&lt;span&gt;N220-1&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"49\" data-name=\"BOOT CUT\" data-code=\"S510-2\" data-rgb=\"#AEC1D0\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#AEC1D0;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;BOOT CUT&lt;span&gt;S510-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;/div&gt;&lt;div class=\"cc-box-img\"&gt;&lt;div class=\"cc-box-imgbox\"&gt;&lt;img src=\"/colorbox/img/byrooms/Bed01.jpg\" alt=\"이미지1번입니다.\"&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"57\" data-name=\"GENTLE SEA\" data-code=\"S470-2\" data-rgb=\"#B0C8D1\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#B0C8D1;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;GENTLE SEA&lt;span&gt;S470-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"58\" data-name=\"POLAR BEAR\" data-code=\"75\" data-rgb=\"#F5F3ED\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#F5F3ED;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;POLAR BEAR&lt;span&gt;75&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class=\"cc-box-img\"&gt;&lt;div class=\"cc-box-imgbox\"&gt;&lt;img src=\"/colorbox/img/byrooms/Bed02.jpg\" alt=\"이미지2번입니다\"&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"63\" data-name=\"UNDINE\" data-code=\"M450-4\" data-rgb=\"#89C0BC\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#89C0BC;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;UNDINE&lt;span&gt;M450-4&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"64\" data-name=\"CARBON\" data-code=\"N520-7\" data-rgb=\"#3D3E3F\" data-tcol=\"W\" data-scroll=\"i\" style=\"background:#3D3E3F;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;CARBON&lt;span&gt;N520-7&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"65\" data-name=\"SPANISH SAND\" data-code=\"OR-W7\" data-rgb=\"#DCD0BE\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#DCD0BE;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;SPANISH SAND&lt;span&gt;OR-W7&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class=\"cc-box-img\"&gt;&lt;div class=\"cc-box-imgbox\"&gt;&lt;img src=\"/colorbox/img/byrooms/Bed03.jpg\" alt=\"이미지3번입니다\"&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"69\" data-name=\"CHATEAU\" data-code=\"PPU7-06\" data-rgb=\"#B5A18B\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#B5A18B;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;CHATEAU&lt;span&gt;PPU7-06&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"70\" data-name=\"POLAR BEAR\" data-code=\"75\" data-rgb=\"#F5F3ED\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#F5F3ED;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;POLAR BEAR&lt;span&gt;75&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"71\" data-name=\"BLACKOUT\" data-code=\"N510-7\" data-rgb=\"#413F3F\" data-tcol=\"W\" data-scroll=\"i\" style=\"background:#413F3F;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;BLACKOUT&lt;span&gt;N510-7&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class=\"cc-box-img\"&gt;&lt;div class=\"cc-box-imgbox\"&gt;&lt;img src=\"/colorbox/img/byrooms/Bed04.jpg\" alt=\"이미지4번입니다\"&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"75\" data-name=\"AGED BEIGE\" data-code=\"PPU7-09\" data-rgb=\"#D7CFC1\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#D7CFC1;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;AGED BEIGE&lt;span&gt;PPU7-09&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"76\" data-name=\"PURE EARTH\" data-code=\"PPU7-05\" data-rgb=\"#A79481\" data-tcol=\"W\" data-scroll=\"i\" style=\"background:#A79481;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;PURE EARTH&lt;span&gt;PPU7-05&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"77\" data-name=\"WHITE\" data-code=\"1852\" data-rgb=\"#EBEAE7\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#EBEAE7;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;WHITE&lt;span&gt;1852&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class=\"cc-box-img\"&gt;&lt;div class=\"cc-box-imgbox\"&gt;&lt;img src=\"/colorbox/img/byrooms/Bed05.jpg\" alt=\"이미지5번입니다\"&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"81\" data-name=\"FUTURE VISION\" data-code=\"N100-3\" data-rgb=\"#BCB5BD\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#BCB5BD;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;FUTURE VISION&lt;span&gt;N100-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"82\" data-name=\"ULTRA PURE WHITE\" data-code=\"PPU18-06\" data-rgb=\"#F8F8F4\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#F8F8F4;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;ULTRA PURE WHITE&lt;span&gt;PPU18-06&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class=\"cc-box-img\"&gt;&lt;div class=\"cc-box-imgbox\"&gt;&lt;img src=\"/colorbox/img/byrooms/Bed06.jpg\" alt=\"이미지6번입니다\"&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"87\" data-name=\"PALE PARSNIP\" data-code=\"S320-2\" data-rgb=\"#E3D7C1\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#E3D7C1;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;PALE PARSNIP&lt;span&gt;S320-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"88\" data-name=\"SLEEK WHITE\" data-code=\"OR-W15\" data-rgb=\"#FAF5EB\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#FAF5EB;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;SLEEK WHITE&lt;span&gt;OR-W15&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"89\" data-name=\"MAUVELOUS\" data-code=\"BNC-12\" data-rgb=\"#B5A49E\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#B5A49E;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;MAUVELOUS&lt;span&gt;BNC-12&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class=\"cc-box-img\"&gt;&lt;div class=\"cc-box-imgbox\"&gt;&lt;img src=\"/colorbox/img/byrooms/Bed07.jpg\" alt=\"이미지7번입니다\"&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"93\" data-name=\"ROMAN PLASTER\" data-code=\"PPU7-10\" data-rgb=\"#DDD1C0\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#DDD1C0;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;ROMAN PLASTER&lt;span&gt;PPU7-10&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"94\" data-name=\"SWISS COFFEE\" data-code=\"12\" data-rgb=\"#F1ECE1\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#F1ECE1;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;SWISS COFFEE&lt;span&gt;12&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"95\" data-name=\"JOURNEYS END\" data-code=\"S520-2\" data-rgb=\"#BAC9D6\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#BAC9D6;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;JOURNEYS END&lt;span&gt;S520-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class=\"cc-box-img\"&gt;&lt;div class=\"cc-box-imgbox\"&gt;&lt;img src=\"/colorbox/img/byrooms/Bed08.jpg\" alt=\"이미지8번입니다\"&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"99\" data-name=\"PARK AVENUE\" data-code=\"MQ2-55\" data-rgb=\"#bbb2a9\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#bbb2a9;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;PARK AVENUE&lt;span&gt;MQ2-55&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"100\" data-name=\"COLD STEEL\" data-code=\"MQ5-20\" data-rgb=\"#808f99\" data-tcol=\"W\" data-scroll=\"i\" style=\"background:#808f99;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;COLD STEEL&lt;span&gt;MQ5-20&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"101\" data-name=\"CREME DE LA CREME\" data-code=\"MQ3-33\" data-rgb=\"#e2ddd8\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#e2ddd8;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;CREME DE LA CREME&lt;span&gt;MQ3-33&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"102\" data-name=\"UNPREDICTABLE HUE\" data-code=\"MQ2-58\" data-rgb=\"#7b746c\" data-tcol=\"W\" data-scroll=\"i\" style=\"background:#7b746c;\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;UNPREDICTABLE HUE&lt;span&gt;MQ2-58&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt; <span style=\"white-space:pre;\"></span>&lt;/div&gt; <span style=\"white-space:pre;\"></span>&lt;div class=\"behr_selectColor\"&gt; <span style=\"white-space:pre;\"></span>&lt;h3&gt;My BEHR Colors&lt;/h3&gt; <span style=\"white-space:pre;\"></span>&lt;div class=\"behr_palette\"&gt; <span style=\"white-space:pre;\"></span>&lt;div class=\"behr_palette_guide\"&gt; <span style=\"white-space:pre;\"></span>크게 보고 싶은 컬러를 눌러 보세요. <span style=\"white-space:pre;\"></span>&lt;/div&gt; <span style=\"white-space:pre;\"></span>&lt;div id=\"behr_palette_save\"&gt; <span style=\"white-space:pre;\"></span>&lt;/div&gt; <span style=\"white-space:pre;\"></span>&lt;/div&gt; <span style=\"white-space:pre;\"></span>&lt;div id=\"detailCanvas\" style=\"display: none;\"&gt;&lt;div id=\"detailCanvas_list\"&gt;&lt;div class=\"cc-box\" data-ccid=\"94\" data-name=\"SWISS COFFEE\" data-code=\"12\" data-rgb=\"#F1ECE1\" data-tcol=\"B\" data-scroll=\"i\" style=\";\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;SWISS COFFEE&lt;span&gt;12&lt;/span&gt;&lt;/p&gt;&lt;a class=\"cc-view\" style=\"background:#F1ECE1;\"&gt;&lt;span class=\"cc_zoom\"&gt;&lt;/span&gt;&lt;/a&gt;&lt;a class=\"palette_del\"&gt;삭제&lt;/a&gt;&lt;/div&gt;&lt;div class=\"cc-box active\" data-ccid=\"95\" data-name=\"JOURNEYS END\" data-code=\"S520-2\" data-rgb=\"#BAC9D6\" data-tcol=\"B\" data-scroll=\"i\" style=\";\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;JOURNEYS END&lt;span&gt;S520-2&lt;/span&gt;&lt;/p&gt;&lt;a class=\"cc-view\" style=\"background:#BAC9D6;\"&gt;&lt;span class=\"cc_zoom\"&gt;&lt;/span&gt;&lt;/a&gt;&lt;a class=\"palette_del\"&gt;삭제&lt;/a&gt;&lt;/div&gt; <span style=\"white-space:pre;\"></span>&lt;/div&gt;&lt;div id=\"detailCanvas_view\"&gt;&lt;div class=\"cc-box active\" data-ccid=\"95\" data-name=\"JOURNEYS END\" data-code=\"S520-2\" data-rgb=\"#BAC9D6\" data-tcol=\"B\" data-scroll=\"i\" style=\";\"&gt; <span style=\"white-space:pre;\"></span>&lt;p class=\"cc-name\"&gt;JOURNEYS END&lt;span&gt;S520-2&lt;/span&gt;&lt;/p&gt;&lt;a class=\"cc-view\" style=\"background:#BAC9D6;\"&gt;&lt;span class=\"cc_zoom\"&gt;&lt;/span&gt;&lt;/a&gt;&lt;a class=\"palette_del\"&gt;삭제&lt;/a&gt;&lt;a class=\"detailColorvs_buyBtn\"&gt;주문하기&lt;/a&gt;&lt;/div&gt;&lt;/div&gt; <span style=\"white-space:pre;\"></span>&lt;div id=\"detailCanvas_color\"&gt; <span style=\"white-space:pre;\"></span>&lt;a class=\"detailCanvas_btn detailCanvas_btn01\" data-index=\"0\"&gt;1번색상선택&lt;/a&gt; <span style=\"white-space:pre;\"></span>&lt;a class=\"detailCanvas_btn detailCanvas_btn02\" data-index=\"1\"&gt;2번색상선택&lt;/a&gt; <span style=\"white-space:pre;\"></span>&lt;a class=\"detailCanvas_btn detailCanvas_btn03\" data-index=\"2\"&gt;3번색상선택&lt;/a&gt; <span style=\"white-space:pre;\"></span>&lt;div class=\"detailCanvas_view detailCanvas_view01\"&gt;&lt;/div&gt; <span style=\"white-space:pre;\"></span>&lt;div class=\"detailCanvas_view detailCanvas_view02\"&gt;&lt;/div&gt; <span style=\"white-space:pre;\"></span>&lt;div class=\"detailCanvas_view detailCanvas_view03\"&gt;&lt;/div&gt; <span style=\"white-space:pre;\"></span>&lt;/div&gt;&lt;a class=\"detailCanvas_close\"&gt;닫기&lt;/a&gt;&lt;/div&gt; <span style=\"white-space:pre;\"></span>&lt;/div&gt; <span style=\"white-space:pre;\"></span>&lt;div class=\"loading\" style=\"display: none;\"&gt;&lt;img src=\"/colorbox/icon/ajax-loader.gif\"&gt;&lt;/div&gt;&lt;div class=\"wh-ov\" style=\"display: none;\"&gt;&lt;/div&gt;&lt;/div&gt;</div>\n<div>\n<span style=\"white-space:pre;\"></span>&lt;!-- } 컬러챠트 삽입 --&gt;&lt;/article&gt;&lt;/body&gt;&lt;/html&gt;</div>\n<div>&lt;/iframe&gt;&lt;/center&gt;</div>\n</div>\n<div><br></div>\n<div><br></div>\n<div><br></div>\n<div><br></div>\n<div><br></div>\n<div><br></div>\n<div><br></div>\n<div><br></div>\n<div>이렇게 넣으면 되는거 아닌가요? ㅠㅠ 안되네요</div>\n					\n\n					\n					\n						\n						\n\n						\n						\n\n						\n						\n					\n				</div>', '1_1040205_428878900', ' 안녕하세요 네이버스토어 상세페이지에 페인트 색상 고를 수 있도록  이런 html 삽입하려고 하는데 잘 안되네요.. https://behr.kr/sub/gallery/studio_iframe.asp 이 페이지를 넣으려면 html 적는 칸에 &lt;center&gt;&lt;iframe src=\"https://behr.kr/sub/gallery/studio_iframe.asp\" width=\"850\" height=\"1000\" frameborder=\"0\" marginwidth=\"0\" marginheight=\"0\" scrolling=\"no\"&gt; &lt;html lang=\"ko\" class=\" -webkit-\"&gt;&lt;head&gt; &lt;meta charset=\"UTF-8\"&gt; &lt;meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\"&gt; &lt;meta name=\"format-detection\" content=\"telephone=no\"&gt; &lt;meta name=\"viewport\" content=\"user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, width=device-width\"&gt; &lt;meta http-equiv=\"Content-Type\" content=\"text/html; charset=utf-8\"&gt; &lt;meta http-equiv=\"Content-Script-Type\" content=\"text/javascript\"&gt; &lt;meta http-equiv=\"Content-Style-Type\" content=\"text/css\"&gt; &lt;style media=\"\" data-href=\"https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700,900\"&gt;/*# sourceURL=https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700,900 */ /*@ sourceURL=https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700,900 */ /* devanagari */ @font-face {   font-family: \'Poppins\';   font-style: normal;   font-weight: 300;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLDz8Z11lFd2JQEl8qw.woff2) format(\'woff2\');   unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB; } /* latin-ext */ @font-face {   font-family: \'Poppins\';   font-style: normal;   font-weight: 300;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLDz8Z1JlFd2JQEl8qw.woff2) format(\'woff2\');   unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face {   font-family: \'Poppins\';   font-style: normal;   font-weight: 300;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLDz8Z1xlFd2JQEk.woff2) format(\'woff2\');   unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* devanagari */ @font-face {   font-family: \'Poppins\';   font-style: normal;   font-weight: 400;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiEyp8kv8JHgFVrJJbecnFHGPezSQ.woff2) format(\'woff2\');   unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB; } /* latin-ext */ @font-face {   font-family: \'Poppins\';   font-style: normal;   font-weight: 400;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiEyp8kv8JHgFVrJJnecnFHGPezSQ.woff2) format(\'woff2\');   unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face {   font-family: \'Poppins\';   font-style: normal;   font-weight: 400;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiEyp8kv8JHgFVrJJfecnFHGPc.woff2) format(\'woff2\');   unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* devanagari */ @font-face {   font-family: \'Poppins\';   font-style: normal;   font-weight: 500;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLGT9Z11lFd2JQEl8qw.woff2) format(\'woff2\');   unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB; } /* latin-ext */ @font-face {   font-family: \'Poppins\';   font-style: normal;   font-weight: 500;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLGT9Z1JlFd2JQEl8qw.woff2) format(\'woff2\');   unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face {   font-family: \'Poppins\';   font-style: normal;   font-weight: 500;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLGT9Z1xlFd2JQEk.woff2) format(\'woff2\');   unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* devanagari */ @font-face {   font-family: \'Poppins\';   font-style: normal;   font-weight: 600;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLEj6Z11lFd2JQEl8qw.woff2) format(\'woff2\');   unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB; } /* latin-ext */ @font-face {   font-family: \'Poppins\';   font-style: normal;   font-weight: 600;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLEj6Z1JlFd2JQEl8qw.woff2) format(\'woff2\');   unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face {   font-family: \'Poppins\';   font-style: normal;   font-weight: 600;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLEj6Z1xlFd2JQEk.woff2) format(\'woff2\');   unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* devanagari */ @font-face {   font-family: \'Poppins\';   font-style: normal;   font-weight: 700;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLCz7Z11lFd2JQEl8qw.woff2) format(\'woff2\');   unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB; } /* latin-ext */ @font-face {   font-family: \'Poppins\';   font-style: normal;   font-weight: 700;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLCz7Z1JlFd2JQEl8qw.woff2) format(\'woff2\');   unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face {   font-family: \'Poppins\';   font-style: normal;   font-weight: 700;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLCz7Z1xlFd2JQEk.woff2) format(\'woff2\');   unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* devanagari */ @font-face {   font-family: \'Poppins\';   font-style: normal;   font-weight: 900;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLBT5Z11lFd2JQEl8qw.woff2) format(\'woff2\');   unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB; } /* latin-ext */ @font-face {   font-family: \'Poppins\';   font-style: normal;   font-weight: 900;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLBT5Z1JlFd2JQEl8qw.woff2) format(\'woff2\');   unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face {   font-family: \'Poppins\';   font-style: normal;   font-weight: 900;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLBT5Z1xlFd2JQEk.woff2) format(\'woff2\');   unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } &lt;/style&gt; &lt;style media=\"\" data-href=\"/css/style.css\"&gt;/*# sourceURL=/css/style.css */ /*@ sourceURL=/css/style.css */ @charset \"utf-8\"; @import url(\"https://behr.kr/css/base.css\"); @import url(\"https://behr.kr/css/common.css\"); @import url(\"https://behr.kr/css/main.css\"); @import url(\"https://behr.kr/css/sub.css\"); /* @import url(\"https://behr.kr/css/gallery.css\"); */&lt;/style&gt; &lt;style media=\"\" data-href=\"//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css\"&gt;/*# sourceURL=//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css */ /*@ sourceURL=//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css */ /*!  *  Font Awesome 4.1.0 by @davegandy - http://fontawesome.io - @fontawesome  *  License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)  */@font-face{font-family:\'FontAwesome\';src:url(\"https://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/../fonts/fontawesome-webfont.eot?v=4.1.0\");src:url(\"https://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/../fonts/fontawesome-webfont.eot?#iefix&amp;v=4.1.0\") format(\'embedded-opentype\'),url(\"https://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/../fonts/fontawesome-webfont.woff?v=4.1.0\") format(\'woff\'),url(\"https://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/../fonts/fontawesome-webfont.ttf?v=4.1.0\") format(\'truetype\'),url(\"https://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/../fonts/fontawesome-webfont.svg?v=4.1.0#fontawesomeregular\") format(\'svg\');font-weight:normal;font-style:normal}.fa{display:inline-block;font-family:FontAwesome;font-style:normal;font-weight:normal;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.fa-lg{font-size:1.33333333em;line-height:.75em;vertical-align:-15%}.fa-2x{font-size:2em}.fa-3x{font-size:3em}.fa-4x{font-size:4em}.fa-5x{font-size:5em}.fa-fw{width:1.28571429em;text-align:center}.fa-ul{padding-left:0;margin-left:2.14285714em;list-style-type:none}.fa-ul&gt;li{position:relative}.fa-li{position:absolute;left:-2.14285714em;width:2.14285714em;top:.14285714em;text-align:center}.fa-li.fa-lg{left:-1.85714286em}.fa-border{padding:.2em .25em .15em;border:solid .08em #eee;border-radius:.1em}.pull-right{float:right}.pull-left{float:left}.fa.pull-left{margin-right:.3em}.fa.pull-right{margin-left:.3em}.fa-spin{-webkit-animation:spin 2s infinite linear;-moz-animation:spin 2s infinite linear;-o-animation:spin 2s infinite linear;animation:spin 2s infinite linear}@-moz-keyframes spin{0%{-moz-transform:rotate(0deg)}100%{-moz-transform:rotate(359deg)}}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg)}100%{-webkit-transform:rotate(359deg)}}@-o-keyframes spin{0%{-o-transform:rotate(0deg)}100%{-o-transform:rotate(359deg)}}@keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}.fa-rotate-90{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=1);-webkit-transform:rotate(90deg);-moz-transform:rotate(90deg);-ms-transform:rotate(90deg);-o-transform:rotate(90deg);transform:rotate(90deg)}.fa-rotate-180{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2);-webkit-transform:rotate(180deg);-moz-transform:rotate(180deg);-ms-transform:rotate(180deg);-o-transform:rotate(180deg);transform:rotate(180deg)}.fa-rotate-270{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);-webkit-transform:rotate(270deg);-moz-transform:rotate(270deg);-ms-transform:rotate(270deg);-o-transform:rotate(270deg);transform:rotate(270deg)}.fa-flip-horizontal{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1);-webkit-transform:scale(-1, 1);-moz-transform:scale(-1, 1);-ms-transform:scale(-1, 1);-o-transform:scale(-1, 1);transform:scale(-1, 1)}.fa-flip-vertical{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1);-webkit-transform:scale(1, -1);-moz-transform:scale(1, -1);-ms-transform:scale(1, -1);-o-transform:scale(1, -1);transform:scale(1, -1)}.fa-stack{position:relative;display:inline-block;width:2em;height:2em;line-height:2em;vertical-align:middle}.fa-stack-1x,.fa-stack-2x{position:absolute;left:0;width:100%;text-align:center}.fa-stack-1x{line-height:inherit}.fa-stack-2x{font-size:2em}.fa-inverse{color:#fff}.fa-glass:before{content:\"\\f000\"}.fa-music:before{content:\"\\f001\"}.fa-search:before{content:\"\\f002\"}.fa-envelope-o:before{content:\"\\f003\"}.fa-heart:before{content:\"\\f004\"}.fa-star:before{content:\"\\f005\"}.fa-star-o:before{content:\"\\f006\"}.fa-user:before{content:\"\\f007\"}.fa-film:before{content:\"\\f008\"}.fa-th-large:before{content:\"\\f009\"}.fa-th:before{content:\"\\f00a\"}.fa-th-list:before{content:\"\\f00b\"}.fa-check:before{content:\"\\f00c\"}.fa-times:before{content:\"\\f00d\"}.fa-search-plus:before{content:\"\\f00e\"}.fa-search-minus:before{content:\"\\f010\"}.fa-power-off:before{content:\"\\f011\"}.fa-signal:before{content:\"\\f012\"}.fa-gear:before,.fa-cog:before{content:\"\\f013\"}.fa-trash-o:before{content:\"\\f014\"}.fa-home:before{content:\"\\f015\"}.fa-file-o:before{content:\"\\f016\"}.fa-clock-o:before{content:\"\\f017\"}.fa-road:before{content:\"\\f018\"}.fa-download:before{content:\"\\f019\"}.fa-arrow-circle-o-down:before{content:\"\\f01a\"}.fa-arrow-circle-o-up:before{content:\"\\f01b\"}.fa-inbox:before{content:\"\\f01c\"}.fa-play-circle-o:before{content:\"\\f01d\"}.fa-rotate-right:before,.fa-repeat:before{content:\"\\f01e\"}.fa-refresh:before{content:\"\\f021\"}.fa-list-alt:before{content:\"\\f022\"}.fa-lock:before{content:\"\\f023\"}.fa-flag:before{content:\"\\f024\"}.fa-headphones:before{content:\"\\f025\"}.fa-volume-off:before{content:\"\\f026\"}.fa-volume-down:before{content:\"\\f027\"}.fa-volume-up:before{content:\"\\f028\"}.fa-qrcode:before{content:\"\\f029\"}.fa-barcode:before{content:\"\\f02a\"}.fa-tag:before{content:\"\\f02b\"}.fa-tags:before{content:\"\\f02c\"}.fa-book:before{content:\"\\f02d\"}.fa-bookmark:before{content:\"\\f02e\"}.fa-print:before{content:\"\\f02f\"}.fa-camera:before{content:\"\\f030\"}.fa-font:before{content:\"\\f031\"}.fa-bold:before{content:\"\\f032\"}.fa-italic:before{content:\"\\f033\"}.fa-text-height:before{content:\"\\f034\"}.fa-text-width:before{content:\"\\f035\"}.fa-align-left:before{content:\"\\f036\"}.fa-align-center:before{content:\"\\f037\"}.fa-align-right:before{content:\"\\f038\"}.fa-align-justify:before{content:\"\\f039\"}.fa-list:before{content:\"\\f03a\"}.fa-dedent:before,.fa-outdent:before{content:\"\\f03b\"}.fa-indent:before{content:\"\\f03c\"}.fa-video-camera:before{content:\"\\f03d\"}.fa-photo:before,.fa-image:before,.fa-picture-o:before{content:\"\\f03e\"}.fa-pencil:before{content:\"\\f040\"}.fa-map-marker:before{content:\"\\f041\"}.fa-adjust:before{content:\"\\f042\"}.fa-tint:before{content:\"\\f043\"}.fa-edit:before,.fa-pencil-square-o:before{content:\"\\f044\"}.fa-share-square-o:before{content:\"\\f045\"}.fa-check-square-o:before{content:\"\\f046\"}.fa-arrows:before{content:\"\\f047\"}.fa-step-backward:before{content:\"\\f048\"}.fa-fast-backward:before{content:\"\\f049\"}.fa-backward:before{content:\"\\f04a\"}.fa-play:before{content:\"\\f04b\"}.fa-pause:before{content:\"\\f04c\"}.fa-stop:before{content:\"\\f04d\"}.fa-forward:before{content:\"\\f04e\"}.fa-fast-forward:before{content:\"\\f050\"}.fa-step-forward:before{content:\"\\f051\"}.fa-eject:before{content:\"\\f052\"}.fa-chevron-left:before{content:\"\\f053\"}.fa-chevron-right:before{content:\"\\f054\"}.fa-plus-circle:before{content:\"\\f055\"}.fa-minus-circle:before{content:\"\\f056\"}.fa-times-circle:before{content:\"\\f057\"}.fa-check-circle:before{content:\"\\f058\"}.fa-question-circle:before{content:\"\\f059\"}.fa-info-circle:before{content:\"\\f05a\"}.fa-crosshairs:before{content:\"\\f05b\"}.fa-times-circle-o:before{content:\"\\f05c\"}.fa-check-circle-o:before{content:\"\\f05d\"}.fa-ban:before{content:\"\\f05e\"}.fa-arrow-left:before{content:\"\\f060\"}.fa-arrow-right:before{content:\"\\f061\"}.fa-arrow-up:before{content:\"\\f062\"}.fa-arrow-down:before{content:\"\\f063\"}.fa-mail-forward:before,.fa-share:before{content:\"\\f064\"}.fa-expand:before{content:\"\\f065\"}.fa-compress:before{content:\"\\f066\"}.fa-plus:before{content:\"\\f067\"}.fa-minus:before{content:\"\\f068\"}.fa-asterisk:before{content:\"\\f069\"}.fa-exclamation-circle:before{content:\"\\f06a\"}.fa-gift:before{content:\"\\f06b\"}.fa-leaf:before{content:\"\\f06c\"}.fa-fire:before{content:\"\\f06d\"}.fa-eye:before{content:\"\\f06e\"}.fa-eye-slash:before{content:\"\\f070\"}.fa-warning:before,.fa-exclamation-triangle:before{content:\"\\f071\"}.fa-plane:before{content:\"\\f072\"}.fa-calendar:before{content:\"\\f073\"}.fa-random:before{content:\"\\f074\"}.fa-comment:before{content:\"\\f075\"}.fa-magnet:before{content:\"\\f076\"}.fa-chevron-up:before{content:\"\\f077\"}.fa-chevron-down:before{content:\"\\f078\"}.fa-retweet:before{content:\"\\f079\"}.fa-shopping-cart:before{content:\"\\f07a\"}.fa-folder:before{content:\"\\f07b\"}.fa-folder-open:before{content:\"\\f07c\"}.fa-arrows-v:before{content:\"\\f07d\"}.fa-arrows-h:before{content:\"\\f07e\"}.fa-bar-chart-o:before{content:\"\\f080\"}.fa-twitter-square:before{content:\"\\f081\"}.fa-facebook-square:before{content:\"\\f082\"}.fa-camera-retro:before{content:\"\\f083\"}.fa-key:before{content:\"\\f084\"}.fa-gears:before,.fa-cogs:before{content:\"\\f085\"}.fa-comments:before{content:\"\\f086\"}.fa-thumbs-o-up:before{content:\"\\f087\"}.fa-thumbs-o-down:before{content:\"\\f088\"}.fa-star-half:before{content:\"\\f089\"}.fa-heart-o:before{content:\"\\f08a\"}.fa-sign-out:before{content:\"\\f08b\"}.fa-linkedin-square:before{content:\"\\f08c\"}.fa-thumb-tack:before{content:\"\\f08d\"}.fa-external-link:before{content:\"\\f08e\"}.fa-sign-in:before{content:\"\\f090\"}.fa-trophy:before{content:\"\\f091\"}.fa-github-square:before{content:\"\\f092\"}.fa-upload:before{content:\"\\f093\"}.fa-lemon-o:before{content:\"\\f094\"}.fa-phone:before{content:\"\\f095\"}.fa-square-o:before{content:\"\\f096\"}.fa-bookmark-o:before{content:\"\\f097\"}.fa-phone-square:before{content:\"\\f098\"}.fa-twitter:before{content:\"\\f099\"}.fa-facebook:before{content:\"\\f09a\"}.fa-github:before{content:\"\\f09b\"}.fa-unlock:before{content:\"\\f09c\"}.fa-credit-card:before{content:\"\\f09d\"}.fa-rss:before{content:\"\\f09e\"}.fa-hdd-o:before{content:\"\\f0a0\"}.fa-bullhorn:before{content:\"\\f0a1\"}.fa-bell:before{content:\"\\f0f3\"}.fa-certificate:before{content:\"\\f0a3\"}.fa-hand-o-right:before{content:\"\\f0a4\"}.fa-hand-o-left:before{content:\"\\f0a5\"}.fa-hand-o-up:before{content:\"\\f0a6\"}.fa-hand-o-down:before{content:\"\\f0a7\"}.fa-arrow-circle-left:before{content:\"\\f0a8\"}.fa-arrow-circle-right:before{content:\"\\f0a9\"}.fa-arrow-circle-up:before{content:\"\\f0aa\"}.fa-arrow-circle-down:before{content:\"\\f0ab\"}.fa-globe:before{content:\"\\f0ac\"}.fa-wrench:before{content:\"\\f0ad\"}.fa-tasks:before{content:\"\\f0ae\"}.fa-filter:before{content:\"\\f0b0\"}.fa-briefcase:before{content:\"\\f0b1\"}.fa-arrows-alt:before{content:\"\\f0b2\"}.fa-group:before,.fa-users:before{content:\"\\f0c0\"}.fa-chain:before,.fa-link:before{content:\"\\f0c1\"}.fa-cloud:before{content:\"\\f0c2\"}.fa-flask:before{content:\"\\f0c3\"}.fa-cut:before,.fa-scissors:before{content:\"\\f0c4\"}.fa-copy:before,.fa-files-o:before{content:\"\\f0c5\"}.fa-paperclip:before{content:\"\\f0c6\"}.fa-save:before,.fa-floppy-o:before{content:\"\\f0c7\"}.fa-square:before{content:\"\\f0c8\"}.fa-navicon:before,.fa-reorder:before,.fa-bars:before{content:\"\\f0c9\"}.fa-list-ul:before{content:\"\\f0ca\"}.fa-list-ol:before{content:\"\\f0cb\"}.fa-strikethrough:before{content:\"\\f0cc\"}.fa-underline:before{content:\"\\f0cd\"}.fa-table:before{content:\"\\f0ce\"}.fa-magic:before{content:\"\\f0d0\"}.fa-truck:before{content:\"\\f0d1\"}.fa-pinterest:before{content:\"\\f0d2\"}.fa-pinterest-square:before{content:\"\\f0d3\"}.fa-google-plus-square:before{content:\"\\f0d4\"}.fa-google-plus:before{content:\"\\f0d5\"}.fa-money:before{content:\"\\f0d6\"}.fa-caret-down:before{content:\"\\f0d7\"}.fa-caret-up:before{content:\"\\f0d8\"}.fa-caret-left:before{content:\"\\f0d9\"}.fa-caret-right:before{content:\"\\f0da\"}.fa-columns:before{content:\"\\f0db\"}.fa-unsorted:before,.fa-sort:before{content:\"\\f0dc\"}.fa-sort-down:before,.fa-sort-desc:before{content:\"\\f0dd\"}.fa-sort-up:before,.fa-sort-asc:before{content:\"\\f0de\"}.fa-envelope:before{content:\"\\f0e0\"}.fa-linkedin:before{content:\"\\f0e1\"}.fa-rotate-left:before,.fa-undo:before{content:\"\\f0e2\"}.fa-legal:before,.fa-gavel:before{content:\"\\f0e3\"}.fa-dashboard:before,.fa-tachometer:before{content:\"\\f0e4\"}.fa-comment-o:before{content:\"\\f0e5\"}.fa-comments-o:before{content:\"\\f0e6\"}.fa-flash:before,.fa-bolt:before{content:\"\\f0e7\"}.fa-sitemap:before{content:\"\\f0e8\"}.fa-umbrella:before{content:\"\\f0e9\"}.fa-paste:before,.fa-clipboard:before{content:\"\\f0ea\"}.fa-lightbulb-o:before{content:\"\\f0eb\"}.fa-exchange:before{content:\"\\f0ec\"}.fa-cloud-download:before{content:\"\\f0ed\"}.fa-cloud-upload:before{content:\"\\f0ee\"}.fa-user-md:before{content:\"\\f0f0\"}.fa-stethoscope:before{content:\"\\f0f1\"}.fa-suitcase:before{content:\"\\f0f2\"}.fa-bell-o:before{content:\"\\f0a2\"}.fa-coffee:before{content:\"\\f0f4\"}.fa-cutlery:before{content:\"\\f0f5\"}.fa-file-text-o:before{content:\"\\f0f6\"}.fa-building-o:before{content:\"\\f0f7\"}.fa-hospital-o:before{content:\"\\f0f8\"}.fa-ambulance:before{content:\"\\f0f9\"}.fa-medkit:before{content:\"\\f0fa\"}.fa-fighter-jet:before{content:\"\\f0fb\"}.fa-beer:before{content:\"\\f0fc\"}.fa-h-square:before{content:\"\\f0fd\"}.fa-plus-square:before{content:\"\\f0fe\"}.fa-angle-double-left:before{content:\"\\f100\"}.fa-angle-double-right:before{content:\"\\f101\"}.fa-angle-double-up:before{content:\"\\f102\"}.fa-angle-double-down:before{content:\"\\f103\"}.fa-angle-left:before{content:\"\\f104\"}.fa-angle-right:before{content:\"\\f105\"}.fa-angle-up:before{content:\"\\f106\"}.fa-angle-down:before{content:\"\\f107\"}.fa-desktop:before{content:\"\\f108\"}.fa-laptop:before{content:\"\\f109\"}.fa-tablet:before{content:\"\\f10a\"}.fa-mobile-phone:before,.fa-mobile:before{content:\"\\f10b\"}.fa-circle-o:before{content:\"\\f10c\"}.fa-quote-left:before{content:\"\\f10d\"}.fa-quote-right:before{content:\"\\f10e\"}.fa-spinner:before{content:\"\\f110\"}.fa-circle:before{content:\"\\f111\"}.fa-mail-reply:before,.fa-reply:before{content:\"\\f112\"}.fa-github-alt:before{content:\"\\f113\"}.fa-folder-o:before{content:\"\\f114\"}.fa-folder-open-o:before{content:\"\\f115\"}.fa-smile-o:before{content:\"\\f118\"}.fa-frown-o:before{content:\"\\f119\"}.fa-meh-o:before{content:\"\\f11a\"}.fa-gamepad:before{content:\"\\f11b\"}.fa-keyboard-o:before{content:\"\\f11c\"}.fa-flag-o:before{content:\"\\f11d\"}.fa-flag-checkered:before{content:\"\\f11e\"}.fa-terminal:before{content:\"\\f120\"}.fa-code:before{content:\"\\f121\"}.fa-mail-reply-all:before,.fa-reply-all:before{content:\"\\f122\"}.fa-star-half-empty:before,.fa-star-half-full:before,.fa-star-half-o:before{content:\"\\f123\"}.fa-location-arrow:before{content:\"\\f124\"}.fa-crop:before{content:\"\\f125\"}.fa-code-fork:before{content:\"\\f126\"}.fa-unlink:before,.fa-chain-broken:before{content:\"\\f127\"}.fa-question:before{content:\"\\f128\"}.fa-info:before{content:\"\\f129\"}.fa-exclamation:before{content:\"\\f12a\"}.fa-superscript:before{content:\"\\f12b\"}.fa-subscript:before{content:\"\\f12c\"}.fa-eraser:before{content:\"\\f12d\"}.fa-puzzle-piece:before{content:\"\\f12e\"}.fa-microphone:before{content:\"\\f130\"}.fa-microphone-slash:before{content:\"\\f131\"}.fa-shield:before{content:\"\\f132\"}.fa-calendar-o:before{content:\"\\f133\"}.fa-fire-extinguisher:before{content:\"\\f134\"}.fa-rocket:before{content:\"\\f135\"}.fa-maxcdn:before{content:\"\\f136\"}.fa-chevron-circle-left:before{content:\"\\f137\"}.fa-chevron-circle-right:before{content:\"\\f138\"}.fa-chevron-circle-up:before{content:\"\\f139\"}.fa-chevron-circle-down:before{content:\"\\f13a\"}.fa-html5:before{content:\"\\f13b\"}.fa-css3:before{content:\"\\f13c\"}.fa-anchor:before{content:\"\\f13d\"}.fa-unlock-alt:before{content:\"\\f13e\"}.fa-bullseye:before{content:\"\\f140\"}.fa-ellipsis-h:before{content:\"\\f141\"}.fa-ellipsis-v:before{content:\"\\f142\"}.fa-rss-square:before{content:\"\\f143\"}.fa-play-circle:before{content:\"\\f144\"}.fa-ticket:before{content:\"\\f145\"}.fa-minus-square:before{content:\"\\f146\"}.fa-minus-square-o:before{content:\"\\f147\"}.fa-level-up:before{content:\"\\f148\"}.fa-level-down:before{content:\"\\f149\"}.fa-check-square:before{content:\"\\f14a\"}.fa-pencil-square:before{content:\"\\f14b\"}.fa-external-link-square:before{content:\"\\f14c\"}.fa-share-square:before{content:\"\\f14d\"}.fa-compass:before{content:\"\\f14e\"}.fa-toggle-down:before,.fa-caret-square-o-down:before{content:\"\\f150\"}.fa-toggle-up:before,.fa-caret-square-o-up:before{content:\"\\f151\"}.fa-toggle-right:before,.fa-caret-square-o-right:before{content:\"\\f152\"}.fa-euro:before,.fa-eur:before{content:\"\\f153\"}.fa-gbp:before{content:\"\\f154\"}.fa-dollar:before,.fa-usd:before{content:\"\\f155\"}.fa-rupee:before,.fa-inr:before{content:\"\\f156\"}.fa-cny:before,.fa-rmb:before,.fa-yen:before,.fa-jpy:before{content:\"\\f157\"}.fa-ruble:before,.fa-rouble:before,.fa-rub:before{content:\"\\f158\"}.fa-won:before,.fa-krw:before{content:\"\\f159\"}.fa-bitcoin:before,.fa-btc:before{content:\"\\f15a\"}.fa-file:before{content:\"\\f15b\"}.fa-file-text:before{content:\"\\f15c\"}.fa-sort-alpha-asc:before{content:\"\\f15d\"}.fa-sort-alpha-desc:before{content:\"\\f15e\"}.fa-sort-amount-asc:before{content:\"\\f160\"}.fa-sort-amount-desc:before{content:\"\\f161\"}.fa-sort-numeric-asc:before{content:\"\\f162\"}.fa-sort-numeric-desc:before{content:\"\\f163\"}.fa-thumbs-up:before{content:\"\\f164\"}.fa-thumbs-down:before{content:\"\\f165\"}.fa-youtube-square:before{content:\"\\f166\"}.fa-youtube:before{content:\"\\f167\"}.fa-xing:before{content:\"\\f168\"}.fa-xing-square:before{content:\"\\f169\"}.fa-youtube-play:before{content:\"\\f16a\"}.fa-dropbox:before{content:\"\\f16b\"}.fa-stack-overflow:before{content:\"\\f16c\"}.fa-instagram:before{content:\"\\f16d\"}.fa-flickr:before{content:\"\\f16e\"}.fa-adn:before{content:\"\\f170\"}.fa-bitbucket:before{content:\"\\f171\"}.fa-bitbucket-square:before{content:\"\\f172\"}.fa-tumblr:before{content:\"\\f173\"}.fa-tumblr-square:before{content:\"\\f174\"}.fa-long-arrow-down:before{content:\"\\f175\"}.fa-long-arrow-up:before{content:\"\\f176\"}.fa-long-arrow-left:before{content:\"\\f177\"}.fa-long-arrow-right:before{content:\"\\f178\"}.fa-apple:before{content:\"\\f179\"}.fa-windows:before{content:\"\\f17a\"}.fa-android:before{content:\"\\f17b\"}.fa-linux:before{content:\"\\f17c\"}.fa-dribbble:before{content:\"\\f17d\"}.fa-skype:before{content:\"\\f17e\"}.fa-foursquare:before{content:\"\\f180\"}.fa-trello:before{content:\"\\f181\"}.fa-female:before{content:\"\\f182\"}.fa-male:before{content:\"\\f183\"}.fa-gittip:before{content:\"\\f184\"}.fa-sun-o:before{content:\"\\f185\"}.fa-moon-o:before{content:\"\\f186\"}.fa-archive:before{content:\"\\f187\"}.fa-bug:before{content:\"\\f188\"}.fa-vk:before{content:\"\\f189\"}.fa-weibo:before{content:\"\\f18a\"}.fa-renren:before{content:\"\\f18b\"}.fa-pagelines:before{content:\"\\f18c\"}.fa-stack-exchange:before{content:\"\\f18d\"}.fa-arrow-circle-o-right:before{content:\"\\f18e\"}.fa-arrow-circle-o-left:before{content:\"\\f190\"}.fa-toggle-left:before,.fa-caret-square-o-left:before{content:\"\\f191\"}.fa-dot-circle-o:before{content:\"\\f192\"}.fa-wheelchair:before{content:\"\\f193\"}.fa-vimeo-square:before{content:\"\\f194\"}.fa-turkish-lira:before,.fa-try:before{content:\"\\f195\"}.fa-plus-square-o:before{content:\"\\f196\"}.fa-space-shuttle:before{content:\"\\f197\"}.fa-slack:before{content:\"\\f198\"}.fa-envelope-square:before{content:\"\\f199\"}.fa-wordpress:before{content:\"\\f19a\"}.fa-openid:before{content:\"\\f19b\"}.fa-institution:before,.fa-bank:before,.fa-university:before{content:\"\\f19c\"}.fa-mortar-board:before,.fa-graduation-cap:before{content:\"\\f19d\"}.fa-yahoo:before{content:\"\\f19e\"}.fa-google:before{content:\"\\f1a0\"}.fa-reddit:before{content:\"\\f1a1\"}.fa-reddit-square:before{content:\"\\f1a2\"}.fa-stumbleupon-circle:before{content:\"\\f1a3\"}.fa-stumbleupon:before{content:\"\\f1a4\"}.fa-delicious:before{content:\"\\f1a5\"}.fa-digg:before{content:\"\\f1a6\"}.fa-pied-piper-square:before,.fa-pied-piper:before{content:\"\\f1a7\"}.fa-pied-piper-alt:before{content:\"\\f1a8\"}.fa-drupal:before{content:\"\\f1a9\"}.fa-joomla:before{content:\"\\f1aa\"}.fa-language:before{content:\"\\f1ab\"}.fa-fax:before{content:\"\\f1ac\"}.fa-building:before{content:\"\\f1ad\"}.fa-child:before{content:\"\\f1ae\"}.fa-paw:before{content:\"\\f1b0\"}.fa-spoon:before{content:\"\\f1b1\"}.fa-cube:before{content:\"\\f1b2\"}.fa-cubes:before{content:\"\\f1b3\"}.fa-behance:before{content:\"\\f1b4\"}.fa-behance-square:before{content:\"\\f1b5\"}.fa-steam:before{content:\"\\f1b6\"}.fa-steam-square:before{content:\"\\f1b7\"}.fa-recycle:before{content:\"\\f1b8\"}.fa-automobile:before,.fa-car:before{content:\"\\f1b9\"}.fa-cab:before,.fa-taxi:before{content:\"\\f1ba\"}.fa-tree:before{content:\"\\f1bb\"}.fa-spotify:before{content:\"\\f1bc\"}.fa-deviantart:before{content:\"\\f1bd\"}.fa-soundcloud:before{content:\"\\f1be\"}.fa-database:before{content:\"\\f1c0\"}.fa-file-pdf-o:before{content:\"\\f1c1\"}.fa-file-word-o:before{content:\"\\f1c2\"}.fa-file-excel-o:before{content:\"\\f1c3\"}.fa-file-powerpoint-o:before{content:\"\\f1c4\"}.fa-file-photo-o:before,.fa-file-picture-o:before,.fa-file-image-o:before{content:\"\\f1c5\"}.fa-file-zip-o:before,.fa-file-archive-o:before{content:\"\\f1c6\"}.fa-file-sound-o:before,.fa-file-audio-o:before{content:\"\\f1c7\"}.fa-file-movie-o:before,.fa-file-video-o:before{content:\"\\f1c8\"}.fa-file-code-o:before{content:\"\\f1c9\"}.fa-vine:before{content:\"\\f1ca\"}.fa-codepen:before{content:\"\\f1cb\"}.fa-jsfiddle:before{content:\"\\f1cc\"}.fa-life-bouy:before,.fa-life-saver:before,.fa-support:before,.fa-life-ring:before{content:\"\\f1cd\"}.fa-circle-o-notch:before{content:\"\\f1ce\"}.fa-ra:before,.fa-rebel:before{content:\"\\f1d0\"}.fa-ge:before,.fa-empire:before{content:\"\\f1d1\"}.fa-git-square:before{content:\"\\f1d2\"}.fa-git:before{content:\"\\f1d3\"}.fa-hacker-news:before{content:\"\\f1d4\"}.fa-tencent-weibo:before{content:\"\\f1d5\"}.fa-qq:before{content:\"\\f1d6\"}.fa-wechat:before,.fa-weixin:before{content:\"\\f1d7\"}.fa-send:before,.fa-paper-plane:before{content:\"\\f1d8\"}.fa-send-o:before,.fa-paper-plane-o:before{content:\"\\f1d9\"}.fa-history:before{content:\"\\f1da\"}.fa-circle-thin:before{content:\"\\f1db\"}.fa-header:before{content:\"\\f1dc\"}.fa-paragraph:before{content:\"\\f1dd\"}.fa-sliders:before{content:\"\\f1de\"}.fa-share-alt:before{content:\"\\f1e0\"}.fa-share-alt-square:before{content:\"\\f1e1\"}.fa-bomb:before{content:\"\\f1e2\"}&lt;/style&gt; &lt;script src=\"/js/jquery-1.8.3.min.js\"&gt;&lt;/script&gt; &lt;script src=\"/js/prefixfree.min.js\"&gt;&lt;/script&gt; &lt;script src=\"/js/common.js\"&gt;&lt;/script&gt; &lt;!--//스크롤--&gt; &lt;script src=\"/js/scrollIt.js\"&gt;&lt;/script&gt; &lt;!--text animation--&gt; &lt;script src=\"/js/jquery.fittext.js\"&gt;&lt;/script&gt; &lt;script src=\"/js/jquery.lettering.js\"&gt;&lt;/script&gt; &lt;script src=\"/js/jquery.textillate.js\"&gt;&lt;/script&gt; &lt;style media=\"\" data-href=\"/css/text_animation.css\"&gt;/*# sourceURL=/css/text_animation.css */ /*@ sourceURL=/css/text_animation.css */ @charset \"UTF-8\"; /* Animate.css - http://daneden.me/animate Licensed under the ☺ license (http://licence.visualidiot.com/) Copyright (c) 2012 Dan Eden Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the \"Software\"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ body { /* Addresses a small issue in webkit: http://bit.ly/NEdoDq */ -webkit-backface-visibility: hidden; } .animated { -webkit-animation-duration: 1s;    -moz-animation-duration: 1s;      -o-animation-duration: 1s;         animation-duration: 1s; -webkit-animation-fill-mode: both;    -moz-animation-fill-mode: both;      -o-animation-fill-mode: both;         animation-fill-mode: both; } .animated.hinge { -webkit-animation-duration: 2s;    -moz-animation-duration: 2s;      -o-animation-duration: 2s;         animation-duration: 2s; } @-webkit-keyframes flash { 0%, 50%, 100% {opacity: 1;} 25%, 75% {opacity: 0;} } @-moz-keyframes flash { 0%, 50%, 100% {opacity: 1;} 25%, 75% {opacity: 0;} } @-o-keyframes flash { 0%, 50%, 100% {opacity: 1;} 25%, 75% {opacity: 0;} } @keyframes flash { 0%, 50%, 100% {opacity: 1;} 25%, 75% {opacity: 0;} } .flash { -webkit-animation-name: flash; -moz-animation-name: flash; -o-animation-name: flash; animation-name: flash; } @-webkit-keyframes shake { 0%, 100% {-webkit-transform: translateX(0);} 10%, 30%, 50%, 70%, 90% {-webkit-transform: translateX(-10px);} 20%, 40%, 60%, 80% {-webkit-transform: translateX(10px);} } @-moz-keyframes shake { 0%, 100% {-moz-transform: translateX(0);} 10%, 30%, 50%, 70%, 90% {-moz-transform: translateX(-10px);} 20%, 40%, 60%, 80% {-moz-transform: translateX(10px);} } @-o-keyframes shake { 0%, 100% {-o-transform: translateX(0);} 10%, 30%, 50%, 70%, 90% {-o-transform: translateX(-10px);} 20%, 40%, 60%, 80% {-o-transform: translateX(10px);} } @keyframes shake { 0%, 100% {transform: translateX(0);} 10%, 30%, 50%, 70%, 90% {transform: translateX(-10px);} 20%, 40%, 60%, 80% {transform: translateX(10px);} } .shake { -webkit-animation-name: shake; -moz-animation-name: shake; -o-animation-name: shake; animation-name: shake; } @-webkit-keyframes bounce { 0%, 20%, 50%, 80%, 100% {-webkit-transform: translateY(0);} 40% {-webkit-transform: translateY(-30px);} 60% {-webkit-transform: translateY(-15px);} } @-moz-keyframes bounce { 0%, 20%, 50%, 80%, 100% {-moz-transform: translateY(0);} 40% {-moz-transform: translateY(-30px);} 60% {-moz-transform: translateY(-15px);} } @-o-keyframes bounce { 0%, 20%, 50%, 80%, 100% {-o-transform: translateY(0);} 40% {-o-transform: translateY(-30px);} 60% {-o-transform: translateY(-15px);} } @keyframes bounce { 0%, 20%, 50%, 80%, 100% {transform: translateY(0);} 40% {transform: translateY(-30px);} 60% {transform: translateY(-15px);} } .bounce { -webkit-animation-name: bounce; -moz-animation-name: bounce; -o-animation-name: bounce; animation-name: bounce; } @-webkit-keyframes tada { 0% {-webkit-transform: scale(1);} 10%, 20% {-webkit-transform: scale(0.9) rotate(-3deg);} 30%, 50%, 70%, 90% {-webkit-transform: scale(1.1) rotate(3deg);} 40%, 60%, 80% {-webkit-transform: scale(1.1) rotate(-3deg);} 100% {-webkit-transform: scale(1) rotate(0);} } @-moz-keyframes tada { 0% {-moz-transform: scale(1);} 10%, 20% {-moz-transform: scale(0.9) rotate(-3deg);} 30%, 50%, 70%, 90% {-moz-transform: scale(1.1) rotate(3deg);} 40%, 60%, 80% {-moz-transform: scale(1.1) rotate(-3deg);} 100% {-moz-transform: scale(1) rotate(0);} } @-o-keyframes tada { 0% {-o-transform: scale(1);} 10%, 20% {-o-transform: scale(0.9) rotate(-3deg);} 30%, 50%, 70%, 90% {-o-transform: scale(1.1) rotate(3deg);} 40%, 60%, 80% {-o-transform: scale(1.1) rotate(-3deg);} 100% {-o-transform: scale(1) rotate(0);} } @keyframes tada { 0% {transform: scale(1);} 10%, 20% {transform: scale(0.9) rotate(-3deg);} 30%, 50%, 70%, 90% {transform: scale(1.1) rotate(3deg);} 40%, 60%, 80% {transform: scale(1.1) rotate(-3deg);} 100% {transform: scale(1) rotate(0);} } .tada { -webkit-animation-name: tada; -moz-animation-name: tada; -o-animation-name: tada; animation-name: tada; } @-webkit-keyframes swing { 20%, 40%, 60%, 80%, 100% { -webkit-transform-origin: top center; } 20% { -webkit-transform: rotate(15deg); } 40% { -webkit-transform: rotate(-10deg); } 60% { -webkit-transform: rotate(5deg); } 80% { -webkit-transform: rotate(-5deg); } 100% { -webkit-transform: rotate(0deg); } } @-moz-keyframes swing { 20% { -moz-transform: rotate(15deg); } 40% { -moz-transform: rotate(-10deg); } 60% { -moz-transform: rotate(5deg); } 80% { -moz-transform: rotate(-5deg); } 100% { -moz-transform: rotate(0deg); } } @-o-keyframes swing { 20% { -o-transform: rotate(15deg); } 40% { -o-transform: rotate(-10deg); } 60% { -o-transform: rotate(5deg); } 80% { -o-transform: rotate(-5deg); } 100% { -o-transform: rotate(0deg); } } @keyframes swing { 20% { transform: rotate(15deg); } 40% { transform: rotate(-10deg); } 60% { transform: rotate(5deg); } 80% { transform: rotate(-5deg); } 100% { transform: rotate(0deg); } } .swing { -webkit-transform-origin: top center; -moz-transform-origin: top center; -o-transform-origin: top center; transform-origin: top center; -webkit-animation-name: swing; -moz-animation-name: swing; -o-animation-name: swing; animation-name: swing; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes wobble {   0% { -webkit-transform: translateX(0%); }   15% { -webkit-transform: translateX(-25%) rotate(-5deg); }   30% { -webkit-transform: translateX(20%) rotate(3deg); }   45% { -webkit-transform: translateX(-15%) rotate(-3deg); }   60% { -webkit-transform: translateX(10%) rotate(2deg); }   75% { -webkit-transform: translateX(-5%) rotate(-1deg); }   100% { -webkit-transform: translateX(0%); } } @-moz-keyframes wobble {   0% { -moz-transform: translateX(0%); }   15% { -moz-transform: translateX(-25%) rotate(-5deg); }   30% { -moz-transform: translateX(20%) rotate(3deg); }   45% { -moz-transform: translateX(-15%) rotate(-3deg); }   60% { -moz-transform: translateX(10%) rotate(2deg); }   75% { -moz-transform: translateX(-5%) rotate(-1deg); }   100% { -moz-transform: translateX(0%); } } @-o-keyframes wobble {   0% { -o-transform: translateX(0%); }   15% { -o-transform: translateX(-25%) rotate(-5deg); }   30% { -o-transform: translateX(20%) rotate(3deg); }   45% { -o-transform: translateX(-15%) rotate(-3deg); }   60% { -o-transform: translateX(10%) rotate(2deg); }   75% { -o-transform: translateX(-5%) rotate(-1deg); }   100% { -o-transform: translateX(0%); } } @keyframes wobble {   0% { transform: translateX(0%); }   15% { transform: translateX(-25%) rotate(-5deg); }   30% { transform: translateX(20%) rotate(3deg); }   45% { transform: translateX(-15%) rotate(-3deg); }   60% { transform: translateX(10%) rotate(2deg); }   75% { transform: translateX(-5%) rotate(-1deg); }   100% { transform: translateX(0%); } } .wobble { -webkit-animation-name: wobble; -moz-animation-name: wobble; -o-animation-name: wobble; animation-name: wobble; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes pulse {     0% { -webkit-transform: scale(1); } 50% { -webkit-transform: scale(1.1); }     100% { -webkit-transform: scale(1); } } @-moz-keyframes pulse {     0% { -moz-transform: scale(1); } 50% { -moz-transform: scale(1.1); }     100% { -moz-transform: scale(1); } } @-o-keyframes pulse {     0% { -o-transform: scale(1); } 50% { -o-transform: scale(1.1); }     100% { -o-transform: scale(1); } } @keyframes pulse {     0% { transform: scale(1); } 50% { transform: scale(1.1); }     100% { transform: scale(1); } } .pulse { -webkit-animation-name: pulse; -moz-animation-name: pulse; -o-animation-name: pulse; animation-name: pulse; } @-webkit-keyframes flip { 0% { -webkit-transform: perspective(400px) rotateY(0); -webkit-animation-timing-function: ease-out; } 40% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg); -webkit-animation-timing-function: ease-out; } 50% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -webkit-animation-timing-function: ease-in; } 80% { -webkit-transform: perspective(400px) rotateY(360deg) scale(.95); -webkit-animation-timing-function: ease-in; } 100% { -webkit-transform: perspective(400px) scale(1); -webkit-animation-timing-function: ease-in; } } @-moz-keyframes flip { 0% { -moz-transform: perspective(400px) rotateY(0); -moz-animation-timing-function: ease-out; } 40% { -moz-transform: perspective(400px) translateZ(150px) rotateY(170deg); -moz-animation-timing-function: ease-out; } 50% { -moz-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -moz-animation-timing-function: ease-in; } 80% { -moz-transform: perspective(400px) rotateY(360deg) scale(.95); -moz-animation-timing-function: ease-in; } 100% { -moz-transform: perspective(400px) scale(1); -moz-animation-timing-function: ease-in; } } @-o-keyframes flip { 0% { -o-transform: perspective(400px) rotateY(0); -o-animation-timing-function: ease-out; } 40% { -o-transform: perspective(400px) translateZ(150px) rotateY(170deg); -o-animation-timing-function: ease-out; } 50% { -o-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -o-animation-timing-function: ease-in; } 80% { -o-transform: perspective(400px) rotateY(360deg) scale(.95); -o-animation-timing-function: ease-in; } 100% { -o-transform: perspective(400px) scale(1); -o-animation-timing-function: ease-in; } } @keyframes flip { 0% { transform: perspective(400px) rotateY(0); animation-timing-function: ease-out; } 40% { transform: perspective(400px) translateZ(150px) rotateY(170deg); animation-timing-function: ease-out; } 50% { transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); animation-timing-function: ease-in; } 80% { transform: perspective(400px) rotateY(360deg) scale(.95); animation-timing-function: ease-in; } 100% { transform: perspective(400px) scale(1); animation-timing-function: ease-in; } } .flip { -webkit-backface-visibility: visible !important; -webkit-animation-name: flip; -moz-backface-visibility: visible !important; -moz-animation-name: flip; -o-backface-visibility: visible !important; -o-animation-name: flip; backface-visibility: visible !important; animation-name: flip; } @-webkit-keyframes flipInX {     0% {         -webkit-transform: perspective(400px) rotateX(90deg);         opacity: 0;     }          40% {         -webkit-transform: perspective(400px) rotateX(-10deg);     }          70% {         -webkit-transform: perspective(400px) rotateX(10deg);     }          100% {         -webkit-transform: perspective(400px) rotateX(0deg);         opacity: 1;     } } @-moz-keyframes flipInX {     0% {         -moz-transform: perspective(400px) rotateX(90deg);         opacity: 0;     }          40% {         -moz-transform: perspective(400px) rotateX(-10deg);     }          70% {         -moz-transform: perspective(400px) rotateX(10deg);     }          100% {         -moz-transform: perspective(400px) rotateX(0deg);         opacity: 1;     } } @-o-keyframes flipInX {     0% {         -o-transform: perspective(400px) rotateX(90deg);         opacity: 0;     }          40% {         -o-transform: perspective(400px) rotateX(-10deg);     }          70% {         -o-transform: perspective(400px) rotateX(10deg);     }          100% {         -o-transform: perspective(400px) rotateX(0deg);         opacity: 1;     } } @keyframes flipInX {     0% {         transform: perspective(400px) rotateX(90deg);         opacity: 0;     }          40% {         transform: perspective(400px) rotateX(-10deg);     }          70% {         transform: perspective(400px) rotateX(10deg);     }          100% {         transform: perspective(400px) rotateX(0deg);         opacity: 1;     } } .flipInX { -webkit-backface-visibility: visible !important; -webkit-animation-name: flipInX; -moz-backface-visibility: visible !important; -moz-animation-name: flipInX; -o-backface-visibility: visible !important; -o-animation-name: flipInX; backface-visibility: visible !important; animation-name: flipInX; } @-webkit-keyframes flipOutX {     0% {         -webkit-transform: perspective(400px) rotateX(0deg);         opacity: 1;     } 100% {         -webkit-transform: perspective(400px) rotateX(90deg);         opacity: 0;     } } @-moz-keyframes flipOutX {     0% {         -moz-transform: perspective(400px) rotateX(0deg);         opacity: 1;     } 100% {         -moz-transform: perspective(400px) rotateX(90deg);         opacity: 0;     } } @-o-keyframes flipOutX {     0% {         -o-transform: perspective(400px) rotateX(0deg);         opacity: 1;     } 100% {         -o-transform: perspective(400px) rotateX(90deg);         opacity: 0;     } } @keyframes flipOutX {     0% {         transform: perspective(400px) rotateX(0deg);         opacity: 1;     } 100% {         transform: perspective(400px) rotateX(90deg);         opacity: 0;     } } .flipOutX { -webkit-animation-name: flipOutX; -webkit-backface-visibility: visible !important; -moz-animation-name: flipOutX; -moz-backface-visibility: visible !important; -o-animation-name: flipOutX; -o-backface-visibility: visible !important; animation-name: flipOutX; backface-visibility: visible !important; } @-webkit-keyframes flipInY {     0% {         -webkit-transform: perspective(400px) rotateY(90deg);         opacity: 0;     }          40% {         -webkit-transform: perspective(400px) rotateY(-10deg);     }          70% {         -webkit-transform: perspective(400px) rotateY(10deg);     }          100% {         -webkit-transform: perspective(400px) rotateY(0deg);         opacity: 1;     } } @-moz-keyframes flipInY {     0% {         -moz-transform: perspective(400px) rotateY(90deg);         opacity: 0;     }          40% {         -moz-transform: perspective(400px) rotateY(-10deg);     }          70% {         -moz-transform: perspective(400px) rotateY(10deg);     }          100% {         -moz-transform: perspective(400px) rotateY(0deg);         opacity: 1;     } } @-o-keyframes flipInY {     0% {         -o-transform: perspective(400px) rotateY(90deg);         opacity: 0;     }          40% {         -o-transform: perspective(400px) rotateY(-10deg);     }          70% {         -o-transform: perspective(400px) rotateY(10deg);     }          100% {         -o-transform: perspective(400px) rotateY(0deg);         opacity: 1;     } } @keyframes flipInY {     0% {         transform: perspective(400px) rotateY(90deg);         opacity: 0;     }          40% {         transform: perspective(400px) rotateY(-10deg);     }          70% {         transform: perspective(400px) rotateY(10deg);     }          100% {         transform: perspective(400px) rotateY(0deg);         opacity: 1;     } } .flipInY { -webkit-backface-visibility: visible !important; -webkit-animation-name: flipInY; -moz-backface-visibility: visible !important; -moz-animation-name: flipInY; -o-backface-visibility: visible !important; -o-animation-name: flipInY; backface-visibility: visible !important; animation-name: flipInY; } @-webkit-keyframes flipOutY {     0% {         -webkit-transform: perspective(400px) rotateY(0deg);         opacity: 1;     } 100% {         -webkit-transform: perspective(400px) rotateY(90deg);         opacity: 0;     } } @-moz-keyframes flipOutY {     0% {         -moz-transform: perspective(400px) rotateY(0deg);         opacity: 1;     } 100% {         -moz-transform: perspective(400px) rotateY(90deg);         opacity: 0;     } } @-o-keyframes flipOutY {     0% {         -o-transform: perspective(400px) rotateY(0deg);         opacity: 1;     } 100% {         -o-transform: perspective(400px) rotateY(90deg);         opacity: 0;     } } @keyframes flipOutY {     0% {         transform: perspective(400px) rotateY(0deg);         opacity: 1;     } 100% {         transform: perspective(400px) rotateY(90deg);         opacity: 0;     } } .flipOutY { -webkit-backface-visibility: visible !important; -webkit-animation-name: flipOutY; -moz-backface-visibility: visible !important; -moz-animation-name: flipOutY; -o-backface-visibility: visible !important; -o-animation-name: flipOutY; backface-visibility: visible !important; animation-name: flipOutY; } @-webkit-keyframes fadeIn { 0% {opacity: 0;} 100% {opacity: 1;} } @-moz-keyframes fadeIn { 0% {opacity: 0;} 100% {opacity: 1;} } @-o-keyframes fadeIn { 0% {opacity: 0;} 100% {opacity: 1;} } @keyframes fadeIn { 0% {opacity: 0;} 100% {opacity: 1;} } .fadeIn { -webkit-animation-name: fadeIn; -moz-animation-name: fadeIn; -o-animation-name: fadeIn; animation-name: fadeIn; } @-webkit-keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translateY(20px); } 100% { opacity: 1; -webkit-transform: translateY(0); } } @-moz-keyframes fadeInUp { 0% { opacity: 0; -moz-transform: translateY(20px); } 100% { opacity: 1; -moz-transform: translateY(0); } } @-o-keyframes fadeInUp { 0% { opacity: 0; -o-transform: translateY(20px); } 100% { opacity: 1; -o-transform: translateY(0); } } @keyframes fadeInUp { 0% { opacity: 0; transform: translateY(20px); } 100% { opacity: 1; transform: translateY(0); } } .fadeInUp { -webkit-animation-name: fadeInUp; -moz-animation-name: fadeInUp; -o-animation-name: fadeInUp; animation-name: fadeInUp; } @-webkit-keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translateY(-20px); } 100% { opacity: 1; -webkit-transform: translateY(0); } } @-moz-keyframes fadeInDown { 0% { opacity: 0; -moz-transform: translateY(-20px); } 100% { opacity: 1; -moz-transform: translateY(0); } } @-o-keyframes fadeInDown { 0% { opacity: 0; -o-transform: translateY(-20px); } 100% { opacity: 1; -o-transform: translateY(0); } } @keyframes fadeInDown { 0% { opacity: 0; transform: translateY(-20px); } 100% { opacity: 1; transform: translateY(0); } } .fadeInDown { -webkit-animation-name: fadeInDown; -moz-animation-name: fadeInDown; -o-animation-name: fadeInDown; animation-name: fadeInDown; } @-webkit-keyframes fadeInLeft { 0% { opacity: 0; -webkit-transform: translateX(-20px); } 100% { opacity: 1; -webkit-transform: translateX(0); } } @-moz-keyframes fadeInLeft { 0% { opacity: 0; -moz-transform: translateX(-20px); } 100% { opacity: 1; -moz-transform: translateX(0); } } @-o-keyframes fadeInLeft { 0% { opacity: 0; -o-transform: translateX(-20px); } 100% { opacity: 1; -o-transform: translateX(0); } } @keyframes fadeInLeft { 0% { opacity: 0; transform: translateX(-20px); } 100% { opacity: 1; transform: translateX(0); } } .fadeInLeft { -webkit-animation-name: fadeInLeft; -moz-animation-name: fadeInLeft; -o-animation-name: fadeInLeft; animation-name: fadeInLeft; } @-webkit-keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translateX(20px); } 100% { opacity: 1; -webkit-transform: translateX(0); } } @-moz-keyframes fadeInRight { 0% { opacity: 0; -moz-transform: translateX(20px); } 100% { opacity: 1; -moz-transform: translateX(0); } } @-o-keyframes fadeInRight { 0% { opacity: 0; -o-transform: translateX(20px); } 100% { opacity: 1; -o-transform: translateX(0); } } @keyframes fadeInRight { 0% { opacity: 0; transform: translateX(20px); } 100% { opacity: 1; transform: translateX(0); } } .fadeInRight { -webkit-animation-name: fadeInRight; -moz-animation-name: fadeInRight; -o-animation-name: fadeInRight; animation-name: fadeInRight; } @-webkit-keyframes fadeInUpBig { 0% { opacity: 0; -webkit-transform: translateY(2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); } } @-moz-keyframes fadeInUpBig { 0% { opacity: 0; -moz-transform: translateY(2000px); } 100% { opacity: 1; -moz-transform: translateY(0); } } @-o-keyframes fadeInUpBig { 0% { opacity: 0; -o-transform: translateY(2000px); } 100% { opacity: 1; -o-transform: translateY(0); } } @keyframes fadeInUpBig { 0% { opacity: 0; transform: translateY(2000px); } 100% { opacity: 1; transform: translateY(0); } } .fadeInUpBig { -webkit-animation-name: fadeInUpBig; -moz-animation-name: fadeInUpBig; -o-animation-name: fadeInUpBig; animation-name: fadeInUpBig; } @-webkit-keyframes fadeInDownBig { 0% { opacity: 0; -webkit-transform: translateY(-2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); } } @-moz-keyframes fadeInDownBig { 0% { opacity: 0; -moz-transform: translateY(-2000px); } 100% { opacity: 1; -moz-transform: translateY(0); } } @-o-keyframes fadeInDownBig { 0% { opacity: 0; -o-transform: translateY(-2000px); } 100% { opacity: 1; -o-transform: translateY(0); } } @keyframes fadeInDownBig { 0% { opacity: 0; transform: translateY(-2000px); } 100% { opacity: 1; transform: translateY(0); } } .fadeInDownBig { -webkit-animation-name: fadeInDownBig; -moz-animation-name: fadeInDownBig; -o-animation-name: fadeInDownBig; animation-name: fadeInDownBig; } @-webkit-keyframes fadeInLeftBig { 0% { opacity: 0; -webkit-transform: translateX(-2000px); } 100% { opacity: 1; -webkit-transform: translateX(0); } } @-moz-keyframes fadeInLeftBig { 0% { opacity: 0; -moz-transform: translateX(-2000px); } 100% { opacity: 1; -moz-transform: translateX(0); } } @-o-keyframes fadeInLeftBig { 0% { opacity: 0; -o-transform: translateX(-2000px); } 100% { opacity: 1; -o-transform: translateX(0); } } @keyframes fadeInLeftBig { 0% { opacity: 0; transform: translateX(-2000px); } 100% { opacity: 1; transform: translateX(0); } } .fadeInLeftBig { -webkit-animation-name: fadeInLeftBig; -moz-animation-name: fadeInLeftBig; -o-animation-name: fadeInLeftBig; animation-name: fadeInLeftBig; } @-webkit-keyframes fadeInRightBig { 0% { opacity: 0; -webkit-transform: translateX(2000px); } 100% { opacity: 1; -webkit-transform: translateX(0); } } @-moz-keyframes fadeInRightBig { 0% { opacity: 0; -moz-transform: translateX(2000px); } 100% { opacity: 1; -moz-transform: translateX(0); } } @-o-keyframes fadeInRightBig { 0% { opacity: 0; -o-transform: translateX(2000px); } 100% { opacity: 1; -o-transform: translateX(0); } } @keyframes fadeInRightBig { 0% { opacity: 0; transform: translateX(2000px); } 100% { opacity: 1; transform: translateX(0); } } .fadeInRightBig { -webkit-animation-name: fadeInRightBig; -moz-animation-name: fadeInRightBig; -o-animation-name: fadeInRightBig; animation-name: fadeInRightBig; } @-webkit-keyframes fadeOut { 0% {opacity: 1;} 100% {opacity: 0;} } @-moz-keyframes fadeOut { 0% {opacity: 1;} 100% {opacity: 0;} } @-o-keyframes fadeOut { 0% {opacity: 1;} 100% {opacity: 0;} } @keyframes fadeOut { 0% {opacity: 1;} 100% {opacity: 0;} } .fadeOut { -webkit-animation-name: fadeOut; -moz-animation-name: fadeOut; -o-animation-name: fadeOut; animation-name: fadeOut; } @-webkit-keyframes fadeOutUp { 0% { opacity: 1; -webkit-transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-20px); } } @-moz-keyframes fadeOutUp { 0% { opacity: 1; -moz-transform: translateY(0); } 100% { opacity: 0; -moz-transform: translateY(-20px); } } @-o-keyframes fadeOutUp { 0% { opacity: 1; -o-transform: translateY(0); } 100% { opacity: 0; -o-transform: translateY(-20px); } } @keyframes fadeOutUp { 0% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; transform: translateY(-20px); } } .fadeOutUp { -webkit-animation-name: fadeOutUp; -moz-animation-name: fadeOutUp; -o-animation-name: fadeOutUp; animation-name: fadeOutUp; } @-webkit-keyframes fadeOutDown { 0% { opacity: 1; -webkit-transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(20px); } } @-moz-keyframes fadeOutDown { 0% { opacity: 1; -moz-transform: translateY(0); } 100% { opacity: 0; -moz-transform: translateY(20px); } } @-o-keyframes fadeOutDown { 0% { opacity: 1; -o-transform: translateY(0); } 100% { opacity: 0; -o-transform: translateY(20px); } } @keyframes fadeOutDown { 0% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; transform: translateY(20px); } } .fadeOutDown { -webkit-animation-name: fadeOutDown; -moz-animation-name: fadeOutDown; -o-animation-name: fadeOutDown; animation-name: fadeOutDown; } @-webkit-keyframes fadeOutLeft { 0% { opacity: 1; -webkit-transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-20px); } } @-moz-keyframes fadeOutLeft { 0% { opacity: 1; -moz-transform: translateX(0); } 100% { opacity: 0; -moz-transform: translateX(-20px); } } @-o-keyframes fadeOutLeft { 0% { opacity: 1; -o-transform: translateX(0); } 100% { opacity: 0; -o-transform: translateX(-20px); } } @keyframes fadeOutLeft { 0% { opacity: 1; transform: translateX(0); } 100% { opacity: 0; transform: translateX(-20px); } } .fadeOutLeft { -webkit-animation-name: fadeOutLeft; -moz-animation-name: fadeOutLeft; -o-animation-name: fadeOutLeft; animation-name: fadeOutLeft; } @-webkit-keyframes fadeOutRight { 0% { opacity: 1; -webkit-transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(20px); } } @-moz-keyframes fadeOutRight { 0% { opacity: 1; -moz-transform: translateX(0); } 100% { opacity: 0; -moz-transform: translateX(20px); } } @-o-keyframes fadeOutRight { 0% { opacity: 1; -o-transform: translateX(0); } 100% { opacity: 0; -o-transform: translateX(20px); } } @keyframes fadeOutRight { 0% { opacity: 1; transform: translateX(0); } 100% { opacity: 0; transform: translateX(20px); } } .fadeOutRight { -webkit-animation-name: fadeOutRight; -moz-animation-name: fadeOutRight; -o-animation-name: fadeOutRight; animation-name: fadeOutRight; } @-webkit-keyframes fadeOutUpBig { 0% { opacity: 1; -webkit-transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); } } @-moz-keyframes fadeOutUpBig { 0% { opacity: 1; -moz-transform: translateY(0); } 100% { opacity: 0; -moz-transform: translateY(-2000px); } } @-o-keyframes fadeOutUpBig { 0% { opacity: 1; -o-transform: translateY(0); } 100% { opacity: 0; -o-transform: translateY(-2000px); } } @keyframes fadeOutUpBig { 0% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; transform: translateY(-2000px); } } .fadeOutUpBig { -webkit-animation-name: fadeOutUpBig; -moz-animation-name: fadeOutUpBig; -o-animation-name: fadeOutUpBig; animation-name: fadeOutUpBig; } @-webkit-keyframes fadeOutDownBig { 0% { opacity: 1; -webkit-transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(2000px); } } @-moz-keyframes fadeOutDownBig { 0% { opacity: 1; -moz-transform: translateY(0); } 100% { opacity: 0; -moz-transform: translateY(2000px); } } @-o-keyframes fadeOutDownBig { 0% { opacity: 1; -o-transform: translateY(0); } 100% { opacity: 0; -o-transform: translateY(2000px); } } @keyframes fadeOutDownBig { 0% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; transform: translateY(2000px); } } .fadeOutDownBig { -webkit-animation-name: fadeOutDownBig; -moz-animation-name: fadeOutDownBig; -o-animation-name: fadeOutDownBig; animation-name: fadeOutDownBig; } @-webkit-keyframes fadeOutLeftBig { 0% { opacity: 1; -webkit-transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); } } @-moz-keyframes fadeOutLeftBig { 0% { opacity: 1; -moz-transform: translateX(0); } 100% { opacity: 0; -moz-transform: translateX(-2000px); } } @-o-keyframes fadeOutLeftBig { 0% { opacity: 1; -o-transform: translateX(0); } 100% { opacity: 0; -o-transform: translateX(-2000px); } } @keyframes fadeOutLeftBig { 0% { opacity: 1; transform: translateX(0); } 100% { opacity: 0; transform: translateX(-2000px); } } .fadeOutLeftBig { -webkit-animation-name: fadeOutLeftBig; -moz-animation-name: fadeOutLeftBig; -o-animation-name: fadeOutLeftBig; animation-name: fadeOutLeftBig; } @-webkit-keyframes fadeOutRightBig { 0% { opacity: 1; -webkit-transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(2000px); } } @-moz-keyframes fadeOutRightBig { 0% { opacity: 1; -moz-transform: translateX(0); } 100% { opacity: 0; -moz-transform: translateX(2000px); } } @-o-keyframes fadeOutRightBig { 0% { opacity: 1; -o-transform: translateX(0); } 100% { opacity: 0; -o-transform: translateX(2000px); } } @keyframes fadeOutRightBig { 0% { opacity: 1; transform: translateX(0); } 100% { opacity: 0; transform: translateX(2000px); } } .fadeOutRightBig { -webkit-animation-name: fadeOutRightBig; -moz-animation-name: fadeOutRightBig; -o-animation-name: fadeOutRightBig; animation-name: fadeOutRightBig; } @-webkit-keyframes bounceIn { 0% { opacity: 0; -webkit-transform: scale(.3); } 50% { opacity: 1; -webkit-transform: scale(1.05); } 70% { -webkit-transform: scale(.9); } 100% { -webkit-transform: scale(1); } } @-moz-keyframes bounceIn { 0% { opacity: 0; -moz-transform: scale(.3); } 50% { opacity: 1; -moz-transform: scale(1.05); } 70% { -moz-transform: scale(.9); } 100% { -moz-transform: scale(1); } } @-o-keyframes bounceIn { 0% { opacity: 0; -o-transform: scale(.3); } 50% { opacity: 1; -o-transform: scale(1.05); } 70% { -o-transform: scale(.9); } 100% { -o-transform: scale(1); } } @keyframes bounceIn { 0% { opacity: 0; transform: scale(.3); } 50% { opacity: 1; transform: scale(1.05); } 70% { transform: scale(.9); } 100% { transform: scale(1); } } .bounceIn { -webkit-animation-name: bounceIn; -moz-animation-name: bounceIn; -o-animation-name: bounceIn; animation-name: bounceIn; } @-webkit-keyframes bounceInUp { 0% { opacity: 0; -webkit-transform: translateY(2000px); } 60% { opacity: 1; -webkit-transform: translateY(-30px); } 80% { -webkit-transform: translateY(10px); } 100% { -webkit-transform: translateY(0); } } @-moz-keyframes bounceInUp { 0% { opacity: 0; -moz-transform: translateY(2000px); } 60% { opacity: 1; -moz-transform: translateY(-30px); } 80% { -moz-transform: translateY(10px); } 100% { -moz-transform: translateY(0); } } @-o-keyframes bounceInUp { 0% { opacity: 0; -o-transform: translateY(2000px); } 60% { opacity: 1; -o-transform: translateY(-30px); } 80% { -o-transform: translateY(10px); } 100% { -o-transform: translateY(0); } } @keyframes bounceInUp { 0% { opacity: 0; transform: translateY(2000px); } 60% { opacity: 1; transform: translateY(-30px); } 80% { transform: translateY(10px); } 100% { transform: translateY(0); } } .bounceInUp { -webkit-animation-name: bounceInUp; -moz-animation-name: bounceInUp; -o-animation-name: bounceInUp; animation-name: bounceInUp; } @-webkit-keyframes bounceInDown { 0% { opacity: 0; -webkit-transform: translateY(-2000px); } 60% { opacity: 1; -webkit-transform: translateY(30px); } 80% { -webkit-transform: translateY(-10px); } 100% { -webkit-transform: translateY(0); } } @-moz-keyframes bounceInDown { 0% { opacity: 0; -moz-transform: translateY(-2000px); } 60% { opacity: 1; -moz-transform: translateY(30px); } 80% { -moz-transform: translateY(-10px); } 100% { -moz-transform: translateY(0); } } @-o-keyframes bounceInDown { 0% { opacity: 0; -o-transform: translateY(-2000px); } 60% { opacity: 1; -o-transform: translateY(30px); } 80% { -o-transform: translateY(-10px); } 100% { -o-transform: translateY(0); } } @keyframes bounceInDown { 0% { opacity: 0; transform: translateY(-2000px); } 60% { opacity: 1; transform: translateY(30px); } 80% { transform: translateY(-10px); } 100% { transform: translateY(0); } } .bounceInDown { -webkit-animation-name: bounceInDown; -moz-animation-name: bounceInDown; -o-animation-name: bounceInDown; animation-name: bounceInDown; } @-webkit-keyframes bounceInLeft { 0% { opacity: 0; -webkit-transform: translateX(-2000px); } 60% { opacity: 1; -webkit-transform: translateX(30px); } 80% { -webkit-transform: translateX(-10px); } 100% { -webkit-transform: translateX(0); } } @-moz-keyframes bounceInLeft { 0% { opacity: 0; -moz-transform: translateX(-2000px); } 60% { opacity: 1; -moz-transform: translateX(30px); } 80% { -moz-transform: translateX(-10px); } 100% { -moz-transform: translateX(0); } } @-o-keyframes bounceInLeft { 0% { opacity: 0; -o-transform: translateX(-2000px); } 60% { opacity: 1; -o-transform: translateX(30px); } 80% { -o-transform: translateX(-10px); } 100% { -o-transform: translateX(0); } } @keyframes bounceInLeft { 0% { opacity: 0; transform: translateX(-2000px); } 60% { opacity: 1; transform: translateX(30px); } 80% { transform: translateX(-10px); } 100% { transform: translateX(0); } } .bounceInLeft { -webkit-animation-name: bounceInLeft; -moz-animation-name: bounceInLeft; -o-animation-name: bounceInLeft; animation-name: bounceInLeft; } @-webkit-keyframes bounceInRight { 0% { opacity: 0; -webkit-transform: translateX(2000px); } 60% { opacity: 1; -webkit-transform: translateX(-30px); } 80% { -webkit-transform: translateX(10px); } 100% { -webkit-transform: translateX(0); } } @-moz-keyframes bounceInRight { 0% { opacity: 0; -moz-transform: translateX(2000px); } 60% { opacity: 1; -moz-transform: translateX(-30px); } 80% { -moz-transform: translateX(10px); } 100% { -moz-transform: translateX(0); } } @-o-keyframes bounceInRight { 0% { opacity: 0; -o-transform: translateX(2000px); } 60% { opacity: 1; -o-transform: translateX(-30px); } 80% { -o-transform: translateX(10px); } 100% { -o-transform: translateX(0); } } @keyframes bounceInRight { 0% { opacity: 0; transform: translateX(2000px); } 60% { opacity: 1; transform: translateX(-30px); } 80% { transform: translateX(10px); } 100% { transform: translateX(0); } } .bounceInRight { -webkit-animation-name: bounceInRight; -moz-animation-name: bounceInRight; -o-animation-name: bounceInRight; animation-name: bounceInRight; } @-webkit-keyframes bounceOut { 0% { -webkit-transform: scale(1); } 25% { -webkit-transform: scale(.95); } 50% { opacity: 1; -webkit-transform: scale(1.1); } 100% { opacity: 0; -webkit-transform: scale(.3); } } @-moz-keyframes bounceOut { 0% { -moz-transform: scale(1); } 25% { -moz-transform: scale(.95); } 50% { opacity: 1; -moz-transform: scale(1.1); } 100% { opacity: 0; -moz-transform: scale(.3); } } @-o-keyframes bounceOut { 0% { -o-transform: scale(1); } 25% { -o-transform: scale(.95); } 50% { opacity: 1; -o-transform: scale(1.1); } 100% { opacity: 0; -o-transform: scale(.3); } } @keyframes bounceOut { 0% { transform: scale(1); } 25% { transform: scale(.95); } 50% { opacity: 1; transform: scale(1.1); } 100% { opacity: 0; transform: scale(.3); } } .bounceOut { -webkit-animation-name: bounceOut; -moz-animation-name: bounceOut; -o-animation-name: bounceOut; animation-name: bounceOut; } @-webkit-keyframes bounceOutUp { 0% { -webkit-transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(20px); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); } } @-moz-keyframes bounceOutUp { 0% { -moz-transform: translateY(0); } 20% { opacity: 1; -moz-transform: translateY(20px); } 100% { opacity: 0; -moz-transform: translateY(-2000px); } } @-o-keyframes bounceOutUp { 0% { -o-transform: translateY(0); } 20% { opacity: 1; -o-transform: translateY(20px); } 100% { opacity: 0; -o-transform: translateY(-2000px); } } @keyframes bounceOutUp { 0% { transform: translateY(0); } 20% { opacity: 1; transform: translateY(20px); } 100% { opacity: 0; transform: translateY(-2000px); } } .bounceOutUp { -webkit-animation-name: bounceOutUp; -moz-animation-name: bounceOutUp; -o-animation-name: bounceOutUp; animation-name: bounceOutUp; } @-webkit-keyframes bounceOutDown { 0% { -webkit-transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(-20px); } 100% { opacity: 0; -webkit-transform: translateY(2000px); } } @-moz-keyframes bounceOutDown { 0% { -moz-transform: translateY(0); } 20% { opacity: 1; -moz-transform: translateY(-20px); } 100% { opacity: 0; -moz-transform: translateY(2000px); } } @-o-keyframes bounceOutDown { 0% { -o-transform: translateY(0); } 20% { opacity: 1; -o-transform: translateY(-20px); } 100% { opacity: 0; -o-transform: translateY(2000px); } } @keyframes bounceOutDown { 0% { transform: translateY(0); } 20% { opacity: 1; transform: translateY(-20px); } 100% { opacity: 0; transform: translateY(2000px); } } .bounceOutDown { -webkit-animation-name: bounceOutDown; -moz-animation-name: bounceOutDown; -o-animation-name: bounceOutDown; animation-name: bounceOutDown; } @-webkit-keyframes bounceOutLeft { 0% { -webkit-transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(20px); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); } } @-moz-keyframes bounceOutLeft { 0% { -moz-transform: translateX(0); } 20% { opacity: 1; -moz-transform: translateX(20px); } 100% { opacity: 0; -moz-transform: translateX(-2000px); } } @-o-keyframes bounceOutLeft { 0% { -o-transform: translateX(0); } 20% { opacity: 1; -o-transform: translateX(20px); } 100% { opacity: 0; -o-transform: translateX(-2000px); } } @keyframes bounceOutLeft { 0% { transform: translateX(0); } 20% { opacity: 1; transform: translateX(20px); } 100% { opacity: 0; transform: translateX(-2000px); } } .bounceOutLeft { -webkit-animation-name: bounceOutLeft; -moz-animation-name: bounceOutLeft; -o-animation-name: bounceOutLeft; animation-name: bounceOutLeft; } @-webkit-keyframes bounceOutRight { 0% { -webkit-transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(-20px); } 100% { opacity: 0; -webkit-transform: translateX(2000px); } } @-moz-keyframes bounceOutRight { 0% { -moz-transform: translateX(0); } 20% { opacity: 1; -moz-transform: translateX(-20px); } 100% { opacity: 0; -moz-transform: translateX(2000px); } } @-o-keyframes bounceOutRight { 0% { -o-transform: translateX(0); } 20% { opacity: 1; -o-transform: translateX(-20px); } 100% { opacity: 0; -o-transform: translateX(2000px); } } @keyframes bounceOutRight { 0% { transform: translateX(0); } 20% { opacity: 1; transform: translateX(-20px); } 100% { opacity: 0; transform: translateX(2000px); } } .bounceOutRight { -webkit-animation-name: bounceOutRight; -moz-animation-name: bounceOutRight; -o-animation-name: bounceOutRight; animation-name: bounceOutRight; } @-webkit-keyframes rotateIn { 0% { -webkit-transform-origin: center center; -webkit-transform: rotate(-200deg); opacity: 0; } 100% { -webkit-transform-origin: center center; -webkit-transform: rotate(0); opacity: 1; } } @-moz-keyframes rotateIn { 0% { -moz-transform-origin: center center; -moz-transform: rotate(-200deg); opacity: 0; } 100% { -moz-transform-origin: center center; -moz-transform: rotate(0); opacity: 1; } } @-o-keyframes rotateIn { 0% { -o-transform-origin: center center; -o-transform: rotate(-200deg); opacity: 0; } 100% { -o-transform-origin: center center; -o-transform: rotate(0); opacity: 1; } } @keyframes rotateIn { 0% { transform-origin: center center; transform: rotate(-200deg); opacity: 0; } 100% { transform-origin: center center; transform: rotate(0); opacity: 1; } } .rotateIn { -webkit-animation-name: rotateIn; -moz-animation-name: rotateIn; -o-animation-name: rotateIn; animation-name: rotateIn; } @-webkit-keyframes rotateInUpLeft { 0% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(90deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(0); opacity: 1; } } @-moz-keyframes rotateInUpLeft { 0% { -moz-transform-origin: left bottom; -moz-transform: rotate(90deg); opacity: 0; } 100% { -moz-transform-origin: left bottom; -moz-transform: rotate(0); opacity: 1; } } @-o-keyframes rotateInUpLeft { 0% { -o-transform-origin: left bottom; -o-transform: rotate(90deg); opacity: 0; } 100% { -o-transform-origin: left bottom; -o-transform: rotate(0); opacity: 1; } } @keyframes rotateInUpLeft { 0% { transform-origin: left bottom; transform: rotate(90deg); opacity: 0; } 100% { transform-origin: left bottom; transform: rotate(0); opacity: 1; } } .rotateInUpLeft { -webkit-animation-name: rotateInUpLeft; -moz-animation-name: rotateInUpLeft; -o-animation-name: rotateInUpLeft; animation-name: rotateInUpLeft; } @-webkit-keyframes rotateInDownLeft { 0% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(-90deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(0); opacity: 1; } } @-moz-keyframes rotateInDownLeft { 0% { -moz-transform-origin: left bottom; -moz-transform: rotate(-90deg); opacity: 0; } 100% { -moz-transform-origin: left bottom; -moz-transform: rotate(0); opacity: 1; } } @-o-keyframes rotateInDownLeft { 0% { -o-transform-origin: left bottom; -o-transform: rotate(-90deg); opacity: 0; } 100% { -o-transform-origin: left bottom; -o-transform: rotate(0); opacity: 1; } } @keyframes rotateInDownLeft { 0% { transform-origin: left bottom; transform: rotate(-90deg); opacity: 0; } 100% { transform-origin: left bottom; transform: rotate(0); opacity: 1; } } .rotateInDownLeft { -webkit-animation-name: rotateInDownLeft; -moz-animation-name: rotateInDownLeft; -o-animation-name: rotateInDownLeft; animation-name: rotateInDownLeft; } @-webkit-keyframes rotateInUpRight { 0% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(-90deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(0); opacity: 1; } } @-moz-keyframes rotateInUpRight { 0% { -moz-transform-origin: right bottom; -moz-transform: rotate(-90deg); opacity: 0; } 100% { -moz-transform-origin: right bottom; -moz-transform: rotate(0); opacity: 1; } } @-o-keyframes rotateInUpRight { 0% { -o-transform-origin: right bottom; -o-transform: rotate(-90deg); opacity: 0; } 100% { -o-transform-origin: right bottom; -o-transform: rotate(0); opacity: 1; } } @keyframes rotateInUpRight { 0% { transform-origin: right bottom; transform: rotate(-90deg); opacity: 0; } 100% { transform-origin: right bottom; transform: rotate(0); opacity: 1; } } .rotateInUpRight { -webkit-animation-name: rotateInUpRight; -moz-animation-name: rotateInUpRight; -o-animation-name: rotateInUpRight; animation-name: rotateInUpRight; } @-webkit-keyframes rotateInDownRight { 0% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(90deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(0); opacity: 1; } } @-moz-keyframes rotateInDownRight { 0% { -moz-transform-origin: right bottom; -moz-transform: rotate(90deg); opacity: 0; } 100% { -moz-transform-origin: right bottom; -moz-transform: rotate(0); opacity: 1; } } @-o-keyframes rotateInDownRight { 0% { -o-transform-origin: right bottom; -o-transform: rotate(90deg); opacity: 0; } 100% { -o-transform-origin: right bottom; -o-transform: rotate(0); opacity: 1; } } @keyframes rotateInDownRight { 0% { transform-origin: right bottom; transform: rotate(90deg); opacity: 0; } 100% { transform-origin: right bottom; transform: rotate(0); opacity: 1; } } .rotateInDownRight { -webkit-animation-name: rotateInDownRight; -moz-animation-name: rotateInDownRight; -o-animation-name: rotateInDownRight; animation-name: rotateInDownRight; } @-webkit-keyframes rotateOut { 0% { -webkit-transform-origin: center center; -webkit-transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: center center; -webkit-transform: rotate(200deg); opacity: 0; } } @-moz-keyframes rotateOut { 0% { -moz-transform-origin: center center; -moz-transform: rotate(0); opacity: 1; } 100% { -moz-transform-origin: center center; -moz-transform: rotate(200deg); opacity: 0; } } @-o-keyframes rotateOut { 0% { -o-transform-origin: center center; -o-transform: rotate(0); opacity: 1; } 100% { -o-transform-origin: center center; -o-transform: rotate(200deg); opacity: 0; } } @keyframes rotateOut { 0% { transform-origin: center center; transform: rotate(0); opacity: 1; } 100% { transform-origin: center center; transform: rotate(200deg); opacity: 0; } } .rotateOut { -webkit-animation-name: rotateOut; -moz-animation-name: rotateOut; -o-animation-name: rotateOut; animation-name: rotateOut; } @-webkit-keyframes rotateOutUpLeft { 0% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(-90deg); opacity: 0; } } @-moz-keyframes rotateOutUpLeft { 0% { -moz-transform-origin: left bottom; -moz-transform: rotate(0); opacity: 1; } 100% { -moz-transform-origin: left bottom; -moz-transform: rotate(-90deg); opacity: 0; } } @-o-keyframes rotateOutUpLeft { 0% { -o-transform-origin: left bottom; -o-transform: rotate(0); opacity: 1; } 100% { -o-transform-origin: left bottom; -o-transform: rotate(-90deg); opacity: 0; } } @keyframes rotateOutUpLeft { 0% { transform-origin: left bottom; transform: rotate(0); opacity: 1; } 100% { transform-origin: left bottom; transform: rotate(-90deg); opacity: 0; } } .rotateOutUpLeft { -webkit-animation-name: rotateOutUpLeft; -moz-animation-name: rotateOutUpLeft; -o-animation-name: rotateOutUpLeft; animation-name: rotateOutUpLeft; } @-webkit-keyframes rotateOutDownLeft { 0% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(90deg); opacity: 0; } } @-moz-keyframes rotateOutDownLeft { 0% { -moz-transform-origin: left bottom; -moz-transform: rotate(0); opacity: 1; } 100% { -moz-transform-origin: left bottom; -moz-transform: rotate(90deg); opacity: 0; } } @-o-keyframes rotateOutDownLeft { 0% { -o-transform-origin: left bottom; -o-transform: rotate(0); opacity: 1; } 100% { -o-transform-origin: left bottom; -o-transform: rotate(90deg); opacity: 0; } } @keyframes rotateOutDownLeft { 0% { transform-origin: left bottom; transform: rotate(0); opacity: 1; } 100% { transform-origin: left bottom; transform: rotate(90deg); opacity: 0; } } .rotateOutDownLeft { -webkit-animation-name: rotateOutDownLeft; -moz-animation-name: rotateOutDownLeft; -o-animation-name: rotateOutDownLeft; animation-name: rotateOutDownLeft; } @-webkit-keyframes rotateOutUpRight { 0% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(90deg); opacity: 0; } } @-moz-keyframes rotateOutUpRight { 0% { -moz-transform-origin: right bottom; -moz-transform: rotate(0); opacity: 1; } 100% { -moz-transform-origin: right bottom; -moz-transform: rotate(90deg); opacity: 0; } } @-o-keyframes rotateOutUpRight { 0% { -o-transform-origin: right bottom; -o-transform: rotate(0); opacity: 1; } 100% { -o-transform-origin: right bottom; -o-transform: rotate(90deg); opacity: 0; } } @keyframes rotateOutUpRight { 0% { transform-origin: right bottom; transform: rotate(0); opacity: 1; } 100% { transform-origin: right bottom; transform: rotate(90deg); opacity: 0; } } .rotateOutUpRight { -webkit-animation-name: rotateOutUpRight; -moz-animation-name: rotateOutUpRight; -o-animation-name: rotateOutUpRight; animation-name: rotateOutUpRight; } @-webkit-keyframes rotateOutDownRight { 0% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(-90deg); opacity: 0; } } @-moz-keyframes rotateOutDownRight { 0% { -moz-transform-origin: right bottom; -moz-transform: rotate(0); opacity: 1; } 100% { -moz-transform-origin: right bottom; -moz-transform: rotate(-90deg); opacity: 0; } } @-o-keyframes rotateOutDownRight { 0% { -o-transform-origin: right bottom; -o-transform: rotate(0); opacity: 1; } 100% { -o-transform-origin: right bottom; -o-transform: rotate(-90deg); opacity: 0; } } @keyframes rotateOutDownRight { 0% { transform-origin: right bottom; transform: rotate(0); opacity: 1; } 100% { transform-origin: right bottom; transform: rotate(-90deg); opacity: 0; } } .rotateOutDownRight { -webkit-animation-name: rotateOutDownRight; -moz-animation-name: rotateOutDownRight; -o-animation-name: rotateOutDownRight; animation-name: rotateOutDownRight; } @-webkit-keyframes hinge { 0% { -webkit-transform: rotate(0); -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; } 20%, 60% { -webkit-transform: rotate(80deg); -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; } 40% { -webkit-transform: rotate(60deg); -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; } 80% { -webkit-transform: rotate(60deg) translateY(0); opacity: 1; -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; } 100% { -webkit-transform: translateY(700px); opacity: 0; } } @-moz-keyframes hinge { 0% { -moz-transform: rotate(0); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; } 20%, 60% { -moz-transform: rotate(80deg); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; } 40% { -moz-transform: rotate(60deg); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; } 80% { -moz-transform: rotate(60deg) translateY(0); opacity: 1; -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; } 100% { -moz-transform: translateY(700px); opacity: 0; } } @-o-keyframes hinge { 0% { -o-transform: rotate(0); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; } 20%, 60% { -o-transform: rotate(80deg); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; } 40% { -o-transform: rotate(60deg); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; } 80% { -o-transform: rotate(60deg) translateY(0); opacity: 1; -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; } 100% { -o-transform: translateY(700px); opacity: 0; } } @keyframes hinge { 0% { transform: rotate(0); transform-origin: top left; animation-timing-function: ease-in-out; } 20%, 60% { transform: rotate(80deg); transform-origin: top left; animation-timing-function: ease-in-out; } 40% { transform: rotate(60deg); transform-origin: top left; animation-timing-function: ease-in-out; } 80% { transform: rotate(60deg) translateY(0); opacity: 1; transform-origin: top left; animation-timing-function: ease-in-out; } 100% { transform: translateY(700px); opacity: 0; } } .hinge { -webkit-animation-name: hinge; -moz-animation-name: hinge; -o-animation-name: hinge; animation-name: hinge; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes rollIn { 0% { opacity: 0; -webkit-transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); } } @-moz-keyframes rollIn { 0% { opacity: 0; -moz-transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -moz-transform: translateX(0px) rotate(0deg); } } @-o-keyframes rollIn { 0% { opacity: 0; -o-transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -o-transform: translateX(0px) rotate(0deg); } } @keyframes rollIn { 0% { opacity: 0; transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; transform: translateX(0px) rotate(0deg); } } .rollIn { -webkit-animation-name: rollIn; -moz-animation-name: rollIn; -o-animation-name: rollIn; animation-name: rollIn; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes rollOut {     0% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); }     100% { opacity: 0; -webkit-transform: translateX(100%) rotate(120deg); } } @-moz-keyframes rollOut {     0% { opacity: 1; -moz-transform: translateX(0px) rotate(0deg); }     100% { opacity: 0; -moz-transform: translateX(100%) rotate(120deg); } } @-o-keyframes rollOut {     0% { opacity: 1; -o-transform: translateX(0px) rotate(0deg); }     100% { opacity: 0; -o-transform: translateX(100%) rotate(120deg); } } @keyframes rollOut {     0% { opacity: 1; transform: translateX(0px) rotate(0deg); }     100% { opacity: 0; transform: translateX(100%) rotate(120deg); } } .rollOut { -webkit-animation-name: rollOut; -moz-animation-name: rollOut; -o-animation-name: rollOut; animation-name: rollOut; } /* originally authored by Angelo Rohit - https://github.com/angelorohit */ @-webkit-keyframes lightSpeedIn { 0% { -webkit-transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% { -webkit-transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% { -webkit-transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% { -webkit-transform: translateX(0%) skewX(0deg); opacity: 1; } } @-moz-keyframes lightSpeedIn { 0% { -moz-transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% { -moz-transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% { -moz-transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% { -moz-transform: translateX(0%) skewX(0deg); opacity: 1; } } @-o-keyframes lightSpeedIn { 0% { -o-transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% { -o-transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% { -o-transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% { -o-transform: translateX(0%) skewX(0deg); opacity: 1; } } @keyframes lightSpeedIn { 0% { transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% { transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% { transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% { transform: translateX(0%) skewX(0deg); opacity: 1; } } .lightSpeedIn {     -webkit-animation-name: lightSpeedIn;     -moz-animation-name: lightSpeedIn;     -o-animation-name: lightSpeedIn;     animation-name: lightSpeedIn;     -webkit-animation-timing-function: ease-out;     -moz-animation-timing-function: ease-out;     -o-animation-timing-function: ease-out;     animation-timing-function: ease-out; } .animated.lightSpeedIn {     -webkit-animation-duration: 0.5s;     -moz-animation-duration: 0.5s;     -o-animation-duration: 0.5s;     animation-duration: 0.5s; } /* originally authored by Angelo Rohit - https://github.com/angelorohit */ @-webkit-keyframes lightSpeedOut {     0% { -webkit-transform: translateX(0%) skewX(0deg); opacity: 1; } 100% { -webkit-transform: translateX(100%) skewX(-30deg); opacity: 0; } } @-moz-keyframes lightSpeedOut { 0% { -moz-transform: translateX(0%) skewX(0deg); opacity: 1; } 100% { -moz-transform: translateX(100%) skewX(-30deg); opacity: 0; } } @-o-keyframes lightSpeedOut { 0% { -o-transform: translateX(0%) skewX(0deg); opacity: 1; } 100% { -o-transform: translateX(100%) skewX(-30deg); opacity: 0; } } @keyframes lightSpeedOut { 0% { transform: translateX(0%) skewX(0deg); opacity: 1; } 100% { transform: translateX(100%) skewX(-30deg); opacity: 0; } } .lightSpeedOut {     -webkit-animation-name: lightSpeedOut;     -moz-animation-name: lightSpeedOut;     -o-animation-name: lightSpeedOut;     animation-name: lightSpeedOut;     -webkit-animation-timing-function: ease-in;     -moz-animation-timing-function: ease-in;     -o-animation-timing-function: ease-in;     animation-timing-function: ease-in; } .animated.lightSpeedOut {     -webkit-animation-duration: 0.25s;     -moz-animation-duration: 0.25s;     -o-animation-duration: 0.25s;     animation-duration: 0.25s; } /* originally authored by Angelo Rohit - https://github.com/angelorohit */ @-webkit-keyframes wiggle {     0% { -webkit-transform: skewX(9deg); }     10% { -webkit-transform: skewX(-8deg); }     20% { -webkit-transform: skewX(7deg); }     30% { -webkit-transform: skewX(-6deg); }     40% { -webkit-transform: skewX(5deg); }     50% { -webkit-transform: skewX(-4deg); }     60% { -webkit-transform: skewX(3deg); }     70% { -webkit-transform: skewX(-2deg); }     80% { -webkit-transform: skewX(1deg); }     90% { -webkit-transform: skewX(0deg); } 100% { -webkit-transform: skewX(0deg); } } @-moz-keyframes wiggle {     0% { -moz-transform: skewX(9deg); }     10% { -moz-transform: skewX(-8deg); }     20% { -moz-transform: skewX(7deg); }     30% { -moz-transform: skewX(-6deg); }     40% { -moz-transform: skewX(5deg); }     50% { -moz-transform: skewX(-4deg); }     60% { -moz-transform: skewX(3deg); }     70% { -moz-transform: skewX(-2deg); }     80% { -moz-transform: skewX(1deg); }     90% { -moz-transform: skewX(0deg); } 100% { -moz-transform: skewX(0deg); } } @-o-keyframes wiggle {     0% { -o-transform: skewX(9deg); }     10% { -o-transform: skewX(-8deg); }     20% { -o-transform: skewX(7deg); }     30% { -o-transform: skewX(-6deg); }     40% { -o-transform: skewX(5deg); }     50% { -o-transform: skewX(-4deg); }     60% { -o-transform: skewX(3deg); }     70% { -o-transform: skewX(-2deg); }     80% { -o-transform: skewX(1deg); }     90% { -o-transform: skewX(0deg); } 100% { -o-transform: skewX(0deg); } } @keyframes wiggle {     0% { transform: skewX(9deg); }     10% { transform: skewX(-8deg); }     20% { transform: skewX(7deg); }     30% { transform: skewX(-6deg); }     40% { transform: skewX(5deg); }     50% { transform: skewX(-4deg); }     60% { transform: skewX(3deg); }     70% { transform: skewX(-2deg); }     80% { transform: skewX(1deg); }     90% { transform: skewX(0deg); } 100% { transform: skewX(0deg); } } .wiggle {     -webkit-animation-name: wiggle;     -moz-animation-name: wiggle;     -o-animation-name: wiggle;     animation-name: wiggle;     -webkit-animation-timing-function: ease-in;     -moz-animation-timing-function: ease-in;     -o-animation-timing-function: ease-in;     animation-timing-function: ease-in; } .animated.wiggle {     -webkit-animation-duration: 0.75s;     -moz-animation-duration: 0.75s;     -o-animation-duration: 0.75s;     animation-duration: 0.75s; }&lt;/style&gt; &lt;!--banner--&gt; &lt;script src=\"/js/jquery.bxslider-rahisified.js\"&gt;&lt;/script&gt; &lt;script src=\"/js/jquery.easing.1.3.js\"&gt;&lt;/script&gt; &lt;!--[if lt IE 9]&gt; &lt;script src=\"/js/html5shiv.js\"&gt;&lt;/script&gt; &lt;![endif]--&gt; &lt;/head&gt; &lt;body marginwidth=\"0\" marginheight=\"0\" class=\"show\"&gt; &lt;article id=\"cont\" class=\"\" style=\"text-align:center; margin:0 auto; padding:30px 0; width: 1100px; ;\"&gt; &lt;!-- 컬러챠트 삽입 { --&gt; &lt;style media=\"\" data-href=\"/colorbox/css/colorbox_iframe.css\"&gt;/*# sourceURL=/colorbox/css/colorbox_iframe.css */ /*@ sourceURL=/colorbox/css/colorbox_iframe.css */ @import url(\"https://cdn.rawgit.com/theeluwin/NotoSansKR-Hestia/master/stylesheets/NotoSansKR-Hestia.css\"); body {margin:0;padding:0;} #behr_colorbox {width:850px; font-family: \"Noto Sans Korean\", \"NotoSans\", sans-serif,\"dotum\"; overflow: hidden;position: relative; font-size: 12px;  line-height: 1.2; text-align: left; z-index: 9999;} #behr_colorbox * {margin:0; padding: 0; vertical-align: top;} #behr_colorbox a {outline: none; text-decoration: none; cursor: pointer;} #behr_colorbox img {border:0;} #behr_colorbox ul {list-style: none;} #behr_colorbox .behr_monitor {width: 570px; border:2px solid #e6e6e5; min-height: 846px; margin-top: 52px; float: left; margin-left: 15px;} #behr_colorbox .behr_monitor .behr_color_menu {padding:33px 2px 25px;} #behr_colorbox .behr_monitor .behr_color_menu ul {font-size: 0} #behr_colorbox .behr_monitor .behr_color_menu ul li {display: inline-block; width: 11%; font-size: 12px;height: 49px; position: relative; vertical-align: top;} #behr_colorbox .behr_monitor .behr_color_menu ul li a {display: block; text-align: center; position: absolute; top:0; left:0; width: 100%; bottom:0; } #behr_colorbox .behr_inner {width: 540px} #behr_colorbox .behr_nav {position: absolute; top:0; left: 15px; height: 52px;} #behr_colorbox .behr_nav ul {overflow: hidden; position: absolute; bottom:0; left: 0; width: 582px;} #behr_colorbox .behr_nav ul li {float: left; height: 52px; position: relative;width: 108px;} #behr_colorbox .behr_nav ul li a {display: block; width: 108px; background: #e6e6e5; text-align: center; position: relative; bottom: 0; position: absolute; left:0; border-radius: 6px 6px 0 0; color:#535353; height: 42px;line-height: 42px; font-size:12px;} #behr_colorbox .behr_nav ul li:nth-child(odd) a {background:#f2f2f2;} #behr_colorbox .behr_nav ul li a.active {background: #535353; color:#fff; height: 52px; line-height: 58px; font-size: 14px} #behr_colorbox .behr_selectColor {width: 240px; float: right; margin-right: 15px;} #behr_colorbox .behr_selectColor h3 {height: 52px; background: #535353; color:#fff; font-size: 18px; text-align: center; line-height: 58px; font-weight: 400; border-radius: 5px 5px 0 0} #behr_colorbox .behr_palette {background: #e6e6e5; min-height: 850px;}  #behr_colorbox .behr_palette_guide { font-size: 11px; color: #535353; line-height: 20px; font-weight: 300; padding:12px 11px; border-bottom:1px solid #fff;}  #behr_colorbox .behr_colorChart {overflow:hidden; overflow-y:scroll; height: 600px;  position: relative;} #behr_colorbox .behr_colorChart.bhallcolors {margin-top: 65px;} #behr_colorbox .loading {position: absolute; top:160px; left:0; width: 580px; bottom:0; z-index: 998; background: rgba(256,256,256,0.8); text-align: center;} #behr_colorbox .loading img {padding-top:45%; } #behr_colorbox .cc_submenu a {cursor: pointer;} #behr_colorbox .behr_colorChart .cc-box {width: 60px; height: 40px; border-radius: 5px; overflow: hidden; display: inline-block; margin:4px; cursor: pointer;transition: transform 0.2s ease} #behr_colorbox .behr_colorChart .cc-box-none {width: 60px; height: 40px; overflow: hidden; display: inline-block; margin:4px;vertical-align: top;} #behr_colorbox .behr_colorChart .cc-box-img {width: 540px;  display: inline-block;margin:4px; margin-top: 20px; vertical-align: top;} #behr_colorbox .behr_colorChart .cc-box-img img {width: 100% !important;} #behr_colorbox .behr_colorChart .cc-box-imgbox {margin-bottom: 4px; height: 274px;} #behr_colorbox .behr_colorChart .cc-box-img .cc-box:nth-of-type(2) {margin-left: 0;} #behr_colorbox .behr_colorChart .cc-box-img .cc-box:nth-of-type(5) {margin-right: 0;} #behr_colorbox .behr_colorChart .cc-box .cc-name {display: none;} #behr_colorbox .behr_colorChart .cc-box:hover {transform: scale(1.1); } #behr_colorbox .behr_colorChart .cc-box.active {background-image: url(\"https://behr.kr/colorbox/css/../icon/chk.png\") !important; background-position:  50% 50% !important; background-repeat: no-repeat !important;} #behr_colorbox .behr_colorChart .cc-box.activeb {background-image: url(\"https://behr.kr/colorbox/css/../icon/chk_b.png\") !important; background-position:  50% 50% !important; background-repeat: no-repeat !important;} #behr_colorbox #behr_palette_save .cc-box { position: relative; padding:12px 0; margin:0 12px; border-bottom:1px solid #fff; overflow: hidden; min-height: 57px; box-sizing: border-box; cursor: pointer;} #behr_colorbox #behr_palette_save .cc-box .cc-view {display: block; width: 40px; height: 40px;border-radius: 5px; position: absolute; top:12px; left:0; z-index: 3;} #behr_colorbox #behr_palette_save .cc-box .cc-name {font-size:12px; padding-left: 52px;padding-top: 1px; color: #535353; padding-right: 40px} #behr_colorbox #behr_palette_save .cc-box .cc-name span {display: block; font-size:15px; padding-top: 0px; font-weight: bold;} #behr_colorbox #behr_palette_save .cc-box .palette_del {position: absolute; top:24px; right:15px; cursor: pointer; width: 20px; height: 20px; background: url(\"https://behr.kr/colorbox/css/../icon/close.png\") no-repeat 0 0; overflow: hidden; text-align: left; text-indent: -9999px;} #behr_colorbox #behr_palette_save .cc-box .palette_del:hover {background-position: 0 -20px;} #behr_colorbox .wh-ov {background: #fff; opacity: 0.7; position: fixed; top:0; left:0; bottom:0; right: 0; width: 100%; height: 100%; z-index: 9998; display: none} #detailCanvas {background: url(\"https://behr.kr/colorbox/css/../icon/detail_iframe.png\") no-repeat 0 0; width: 1050px; height: 850px; z-index: 9999; position: absolute; top:28px; left: 25px; display: none} #detailCanvas a.detailCanvas_close {position: absolute; top:3px; left: 771px; width: 26px; height: 26px; display: block; overflow: hidden; text-indent: -999px; text-align: left; cursor: pointer;} #detailCanvas #detailCanvas_list {position: absolute; top:30px; left: 232px; overflow: hidden; height: 60px; width: 540px; padding-top: 5px; padding-left: 5px;} #detailCanvas #detailCanvas_list .cc-box {float: left; margin-right: 5px;width: 43px; height: 43px; display: block; position: relative; cursor: pointer;border-radius: 5px; margin-bottom: 5px} #detailCanvas #detailCanvas_list .cc-box .cc-view {position: relative;width: 43px; height: 43px; border-radius: 5px; display: block; top:0; left:0;position: absolute;} #detailCanvas #detailCanvas_list .cc-box.active .cc-view  {border:4px solid  #3f3e3e;  top:-4px; left:-4px; z-index: 3;} #detailCanvas #detailCanvas_list .cc-box:hover .cc-view {transform: scale(1.1);} #detailCanvas #detailCanvas_list .cc-box.active:hover .cc-view {transform: scale(1);} #detailCanvas #detailCanvas_list .cc-box .cc-name, #detailCanvas #detailCanvas_list .cc-box .palette_del {display:none;} #detailCanvas #detailCanvas_view {width: 540px; height: 200px; display: block; position: absolute; top:100px; left: 237px;} #detailCanvas #detailCanvas_view .cc-box .cc-view {position: absolute; top:0; left: 0; right: 0; bottom: 0; z-index: -1;} #detailCanvas #detailCanvas_view .cc-box .cc-name {padding:30px 35px 18px; font-size:30px; color:#fff; font-weight: bold;} #detailCanvas #detailCanvas_view .cc-box .cc-name span {display: block;font-weight: normal; font-size: 22px; color:#fff;} #detailCanvas #detailCanvas_view .cc-box[data-tcol=B] .cc-name,  #detailCanvas #detailCanvas_view .cc-box[data-tcol=B] .cc-name span {color:#333;} #detailCanvas #detailCanvas_view .cc-box .palette_del {display: none;} #detailCanvas #detailCanvas_view .cc-box .detailColorvs_buyBtn {display: none; bottom:10px; left:233px;} #detailCanvas #detailCanvas_view:hover .cc-box .detailColorvs_buyBtn {display: block;} #detailCanvas .detailCanvas_btn {display: block;width: 174px; height: 53px; position: absolute; top:319px; cursor: pointer; text-indent: -999px; text-align: left; overflow: hidden; } #detailCanvas .detailCanvas_btn01 {left: 237px;} #detailCanvas .detailCanvas_btn02 {left: 419px;} #detailCanvas .detailCanvas_btn03 {left: 602px;} #detailCanvas .detailCanvas_btn:hover {background: url(\"https://behr.kr/colorbox/css/../icon/btn_hover_iframe.gif\") no-repeat 0 0;} #detailCanvas .detailCanvas_view {display: block; width: 175px; position: absolute; top:388px; height: 237px;} #detailCanvas .detailCanvas_view01 {left: 237px;} #detailCanvas .detailCanvas_view02 {left: 419px;} #detailCanvas .detailCanvas_view03 {left: 602px;} #detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .cc-view {position: absolute; top:0; left: 0; right: 0; bottom: 0; z-index: -1;} #detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .cc-name {padding:25px 40px 18px 5px; font-size:16px; color:#fff; font-weight: bold;} #detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .cc-name span {display: block;font-weight: normal; font-size: 15px; color:#fff;} #detailCanvas #detailCanvas_color .detailCanvas_view .cc-box[data-tcol=B] .cc-name,  #detailCanvas #detailCanvas_color .detailCanvas_view .cc-box[data-tcol=B] .cc-name span {color:#333;} #detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .palette_del {display: none; } #detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .detailColorvs_buyBtn {display: none; top:140px;left:50px;} #detailCanvas #detailCanvas_color .detailCanvas_view01:hover .cc-box .detailColorvs_buyBtn {display: block;} #detailCanvas #detailCanvas_color .detailCanvas_view02:hover .cc-box .detailColorvs_buyBtn {display: block;} #detailCanvas #detailCanvas_color .detailCanvas_view03:hover .cc-box .detailColorvs_buyBtn {display: block;} #detailCanvas .detailColorvs_buyBtn {cursor: pointer; width: 74px; height: 74px; background: url(\"https://behr.kr/colorbox/css/../icon/cart.png\") no-repeat 0 0; text-align: left; text-indent: -9999px; overflow: hidden; position: absolute; } /*검색결과*/ #behr_colorbox #cc_search_area {display: none; position: absolute; height: 104px; top:54px; left: 17px; width: 540px; background: #fff;} #behr_colorbox #cc_search_area .cc_search {display: block; background: url(\"https://behr.kr/colorbox/css/../icon/ccsearch_iframe.jpg\") no-repeat 0 0; width: 500px; height: 50px; position: absolute; top:33px; left:44px;} #behr_colorbox #cc_search_area .cc_search label {display: inline-block; width: 100px; line-height: 50px; font-size: 18px; color:#535353; text-align: center; } #behr_colorbox #cc_search_area .cc_search input {display: inline-block;width:308px; height: 48px; line-height: 48px; border:0; background: #fff; font-size: 14px; color:#535353; padding: 0 20px; box-sizing: border-box; margin-top: 1px;} #behr_colorbox #cckeywordauto {position: absolute; top:92px; width: 550px; text-align: center;} #behr_colorbox #cckeywordauto ul {text-align: center; font-size: 0;} #behr_colorbox #cckeywordauto ul li {display: inline-block; background: #e6e6e5; border-radius: 5px; padding:5px 8px; font-size:14px; color:#535353; margin:0 2px;} #behr_colorbox #cckeywordauto ul li:nth-child(odd) {background: #f2f2f2;} #behr_colorbox #cckeywordauto ul li a {cursor: pointer; font-weight: 100} #ccsearchOutput {background: #535353; color:#fff; padding:0 14px; line-height: 41px; height: 41px; box-sizing: border-box; position: absolute; top:143px; left:20px; right: 20px;} #ccsearchOutput span {vertical-align: bottom; font-size:22px; margin-right: 8px; display: inline-block;} #behr_colorbox.namelist .behr_colorChart .cc-box {width: 80px; height: 60px; display: inline-block; overflow: visible; position: relative; margin:10px 175px 10px 20px; position: relative; transition: none;} #behr_colorbox.namelist .behr_colorChart .cc-box:before {content: \'\'; display: block; position: absolute; background:#ddd; width: 230px; height: 1px; bottom:-10px; left:0;} #behr_colorbox.namelist .behr_colorChart .cc-box:hover {transform: scale(1);} #behr_colorbox.namelist .behr_colorChart .cc-name { position: absolute; left: 87px; top:6px; display: block; width: 210px; font-size: 14px; color:#535353;} #behr_colorbox.namelist .behr_colorChart .cc-name span {display: block;} #behr_colorbox.namelist .behr_colorChart {margin-top: 78px !important; height: 660px !important;} #behr_colorbox.namelist .loading {top:238px;} #behr_colorbox.all_colors .behr_colorChart {margin-top: 65px;} /*메뉴별 모양*/ #behr_colorbox .behr_color_menu a {color: transparent;} /*1.all colors메뉴*/ #behr_colorbox.all_colors .behr_color_menu a.bh_colornav0 {background: #b1383d;} #behr_colorbox.all_colors .behr_color_menu a.bh_colornav1 {background: #d3533a} #behr_colorbox.all_colors .behr_color_menu a.bh_colornav2 {background: #ffcb3a} #behr_colorbox.all_colors .behr_color_menu a.bh_colornav3 {background: #4f725a} #behr_colorbox.all_colors .behr_color_menu a.bh_colornav4 {background: #006993} /*#behr_colorbox.all_colors .behr_color_menu a.bh_colornav5 {background: #86b9b2}*/ #behr_colorbox.all_colors .behr_color_menu a.bh_colornav5 {background: #7f657e} #behr_colorbox.all_colors .behr_color_menu a.bh_colornav6 {background: #a99884} #behr_colorbox.all_colors .behr_color_menu a.bh_colornav7 {background: #818181} #behr_colorbox.all_colors .behr_color_menu a.bh_colornav8 {background: #f1f1f1} /*2.best coloes 메뉴*/ #behr_colorbox.best_colors .behr_color_menu a.bh_colornav0 {background: #b1383d;} #behr_colorbox.best_colors .behr_color_menu a.bh_colornav1 {background: #d3533a} #behr_colorbox.best_colors .behr_color_menu a.bh_colornav2 {background: #ffcb3a} #behr_colorbox.best_colors .behr_color_menu a.bh_colornav3 {background: #4f725a} #behr_colorbox.best_colors .behr_color_menu a.bh_colornav4 {background: #006993} /*#behr_colorbox.best_colors .behr_color_menu a.bh_colornav5 {background: #86b9b2}*/ #behr_colorbox.best_colors .behr_color_menu a.bh_colornav5 {background: #7f657e} #behr_colorbox.best_colors .behr_color_menu a.bh_colornav6 {background: #a99884} #behr_colorbox.best_colors .behr_color_menu a.bh_colornav7 {background: #818181} #behr_colorbox.best_colors .behr_color_menu a.bh_colornav8 {background: #f1f1f1} /*3. by booms 메뉴*/ #behr_colorbox.by_rooms .behr_monitor .behr_color_menu ul li {width: 67px;} #behr_colorbox.by_rooms .behr_color_menu a {background:#f2f2f2 url(\"https://behr.kr/colorbox/css/../icon/byroom.png\") no-repeat;} #behr_colorbox.by_rooms .behr_color_menu ul li:nth-child(odd) a {background-color:#e6e6e6;} #behr_colorbox.by_rooms .behr_color_menu a.bh_colornav0 {background-position: 0 0 !important; } #behr_colorbox.by_rooms .behr_color_menu a.bh_colornav1 {background-position: -99px 0 !important; } #behr_colorbox.by_rooms .behr_color_menu a.bh_colornav2 {background-position: -198px 0 !important; } #behr_colorbox.by_rooms .behr_color_menu a.bh_colornav3 {background-position: -297px 0 !important; } #behr_colorbox.by_rooms .behr_color_menu a.bh_colornav4 {background-position: -396px 0 !important; } #behr_colorbox.by_rooms .behr_color_menu a.bh_colornav5 {background-position: -495px 0 !important; } #behr_colorbox.by_rooms .behr_color_menu a.bh_colornav6 {background-position: -594px 0 !important; } #behr_colorbox.by_rooms .behr_color_menu a.bh_colornav7 {background-position: -693px 0 !important; } /*4. by styles 메뉴*/ #behr_colorbox.by_styles .behr_monitor .behr_color_menu ul li {width: 67px;} #behr_colorbox.by_styles .behr_color_menu a {background:#f2f2f2; position: relative;} #behr_colorbox.by_styles .behr_color_menu ul li:nth-child(odd) a {background-color:#e6e6e6;} #behr_colorbox.by_styles .behr_color_menu a span {color:#535353; line-height: 49px;font-size: 12px; letter-spacing: -0.02em} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav0 span {color:#9f9480;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav1 span {color:#4fb3d0;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav2 span {color:#88a379;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav3 span {color:#848595;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav4 span {color:#81242b;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav5 span {color:#c1a889;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav6 span {color:#64a093;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav7 span {color:#839894;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav0.active {background:#9f9480;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav1.active {background:#4fb3d0;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav2.active {background:#88a379;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav3.active {background:#848595;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav4.active {background:#81242b;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav5.active {background:#c1a889;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav6.active {background:#64a093;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav7.active {background:#839894;} #behr_colorbox.by_styles .behr_color_menu a.active span {color:#fff !important;line-height: 60px;} #behr_colorbox.by_styles .behr_color_menu a.active {height: 60px; margin-top: -5px;border-radius: 5px; } #behr_colorbox.all_colors .behr_color_menu a.active, #behr_colorbox.best_colors .behr_color_menu a.active {background-image: url(\"https://behr.kr/colorbox/css/../icon/check.png\"); background-repeat: no-repeat; background-position: 50% 50%; height: 60px; margin-top: -5px; border-radius: 5px; } #behr_colorbox.by_rooms .behr_color_menu ul li a:hover {background-color: #535353; border-radius: 5px; } #behr_colorbox.by_rooms .behr_color_menu ul li a span {position: absolute; top:-20px; text-align: center; color:#535353; width: 100%; left: 0; display:none;} #behr_colorbox.by_rooms .behr_color_menu ul li a:hover span, #behr_colorbox.by_rooms .behr_color_menu ul li a.active span {position: absolute; top:-20px; text-align: center; display: block; color:#535353; width: 100%; left: 0;} #behr_colorbox.by_rooms .behr_color_menu ul li a.active {background-color: #535353; height: 60px; margin-top: -5px; border-radius: 5px;} #behr_colorbox.by_rooms .behr_color_menu a.active:after, #behr_colorbox.by_styles .behr_color_menu a.active:after {position:absolute; content: \'\';display: block; width: 100%; height: 100%; top:0; left: :0;  background-image: url(\"https://behr.kr/colorbox/css/../icon/check.png\"); background-repeat: no-repeat; background-position: 50% 50%; height: 60px; margin-top: -5px; border-radius: 5px; } #behr_colorbox.by_styles .behr_color_menu ul li a u {position: absolute; top:-20px; text-align: center; color:#535353; width: 100%; left: 0; display:none; text-decoration: none;} #behr_colorbox.by_styles .behr_color_menu ul li a:hover u, #behr_colorbox.by_styles .behr_color_menu ul li a.active u {position: absolute; top:-20px; text-align: center; display: block; color:#535353; width: 100%; left: 0;} #behr_colorbox .cc_more_btn {position: absolute; left:184px; width: 208px; text-align: center;} #behr_colorbox .cc_more_btn a {display: block; height: 37px; width: 208px; color: #535353; cursor: pointer;} #behr_colorbox .cc_more_btn a i {display: inline-block; width: 35px; height: 35px; border-radius: 50%; background: #f9f9f9; vertical-align: middle; margin:0 10px;} #behr_colorbox .cc_more_btn a span {display: inline-block; vertical-align: top; width: 50px; height: 35px; line-height: 31px; text-align: left;text-transform : capitalize} #behr_colorbox .cc_more_btn a i.red {background:#b1383d } #behr_colorbox .cc_more_btn a i.orange {background:#d3533a } #behr_colorbox .cc_more_btn a i.yellow {background: #ffcb3a} #behr_colorbox .cc_more_btn a i.green {background: #4f725a} #behr_colorbox .cc_more_btn a i.blue {background:#006993 } #behr_colorbox .cc_more_btn a i.mint {background: #86b9b2} #behr_colorbox .cc_more_btn a i.purple {background: #7f657e} #behr_colorbox .cc_more_btn.prev {top:167px;} #behr_colorbox .cc_more_btn.next {top:850px;} #behr_colorbox .cc_more_btn.prev a i {background-repeat: no-repeat; background-image: url(\"https://behr.kr/colorbox/css/../icon/a_up.png\"); background-position: 50% 50%;} #behr_colorbox .cc_more_btn.next a i {background-repeat: no-repeat; background-image: url(\"https://behr.kr/colorbox/css/../icon/a_down.png\"); background-position: 50% 50%;} #behr_colorbox.namelist .cc_more_btn {display: none !important} /* 20180327 신령주 추가 */ #behr_colorbox span.cc_zoom {position:absolute; right:-10px; bottom:-5px; display:block; width:21px; height:21px; background:url(\"https://behr.kr/colorbox/css/../icon/zoomin.png\") 0 0 no-repeat;} #behr_colorbox .behr_nav ul li a:hover{background: #535353; color:#fff; height: 52px; line-height: 58px; font-size: 18px} #behr_colorbox.all_colors .behr_color_menu ul.cc_submenu li a:hover {background-image: url(\"https://behr.kr/colorbox/css/../icon/check.png\"); background-repeat: no-repeat; background-position: 50% 50%; height: 60px; margin-top: -5px; border-radius: 5px; } #detailCanvas_list span.cc_zoom {display:none;} #behr_colorbox.best_colors .behr_color_menu a:hover {background-image: url(\"https://behr.kr/colorbox/css/../icon/check.png\"); background-repeat: no-repeat; background-position: 50% 50%; height: 60px; margin-top: -5px; border-radius: 5px; } #behr_colorbox.by_rooms .behr_color_menu ul li a.active {background:#535353 url(\"https://behr.kr/colorbox/css/../icon/byroom_on.png\") no-repeat;} #behr_colorbox.by_rooms .behr_color_menu ul li a:hover {background:#535353 url(\"https://behr.kr/colorbox/css/../icon/byroom_on.png\") no-repeat; height: 60px; margin-top: -5px; border-radius: 5px;} #behr_colorbox.by_rooms .behr_color_menu ul li a:hover:after {position:absolute; content: \'\';display: block; width: 100%; height: 100%; top:0; left: :0;  background-image: url(\"https://behr.kr/colorbox/css/../check.png\"); background-repeat: no-repeat; background-position: 50% 50%; height: 60px; margin-top: -5px; border-radius: 5px; } #behr_colorbox.by_styles .behr_color_menu a.bh_colornav0:hover {background:#9f9480;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav1:hover {background:#4fb3d0;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav2:hover {background:#88a379;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav3:hover {background:#848595;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav4:hover {background:#81242b;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav5:hover {background:#c1a889;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav6:hover {background:#64a093;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav7:hover {background:#839894;} #behr_colorbox.by_styles .behr_color_menu a:hover span {color:#fff !important;line-height: 60px;} #behr_colorbox.by_styles .behr_color_menu a:hover {height: 60px; margin-top: -5px;border-radius: 5px; } #behr_colorbox.by_styles .behr_color_menu a:hover:after {position:absolute; content: \'\';display: block; width: 100%; height: 100%; top:0; left: :0;  background-image: url(\"https://behr.kr/colorbox/css/../icon/check.png\"); background-repeat: no-repeat; background-position: 50% 50%; height: 60px; margin-top: -5px; border-radius: 5px; } #behr_colorbox.by_styles .behr_color_menu a {text-transform: capitalize;} #detailCanvas_view span.cc_zoom {display:none;} #behr_colorbox .detailCanvas_view span.cc_zoom {display:none;} #detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .palette_del {position: absolute; top:5px; right:5px; cursor: pointer; width: 20px; height: 20px; background: url(\"https://behr.kr/colorbox/css/../icon/close.png\") no-repeat 0 0; overflow: hidden; text-align: left; text-indent: -9999px; display:block;} #detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .palette_del:hover {background-position: 0 -20px;} .behr_palette .pal_down {display:block; margin:0 auto !important; cursor:pointer;} .behr_palette .pal_up {display:block; margin:0 auto 0 !important; padding-top:5px !important; cursor:pointer;} .behr_palette #behr_palette_save {height:720px; overflow:hidden;} #detailCanvas #detailCanvas_list.h90 {height:96px;} #detailCanvas #detailCanvas_view.h90 {height:164px; top:140px;}&lt;/style&gt; &lt;script type=\"text/javascript\" src=\"/colorbox/js/colorbox_iframe.js?ver=1\"&gt;&lt;/script&gt; &lt;script type=\"text/javascript\"&gt; var buyInput = \"textinput\"; //컬러값 입력하는곳의 아이디입력 var ccDisplay = \"off\"; //컬러값 선택후 컬러챠트 사라는 기능 on/off var cckwd = new Array(\"coffee\",\"silver\",\"vintage\",\"lemon\",\"red\",\"green\",\"pink\"); //추천키워드 최대 7개 &lt;/script&gt; &lt;div id=\"behr_colorbox\" class=\"sch_color by_rooms\"&gt;&lt;div class=\"behr_nav\"&gt; &lt;ul&gt; &lt;li&gt;&lt;a class=\"ccsubmenu\" data-cc_category=\"all_colors\"&gt;All Colors&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a class=\"ccsubmenu\" data-cc_category=\"best_colors\"&gt;Best Colors&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a class=\"ccsubmenu active\" data-cc_category=\"by_rooms\"&gt;By Rooms&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a class=\"ccsubmenu\" data-cc_category=\"by_styles\"&gt;By Styles&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a class=\"ccsearch\"&gt;Search&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; &lt;div class=\"behr_monitor\"&gt; &lt;div class=\"behr_inner\"&gt; &lt;div class=\"behr_color_menu\"&gt; &lt;ul class=\"cc_submenu\"&gt;&lt;li&gt;&lt;a data-group=\"BEDROOM\" class=\"bh_colornav0 active\"&gt;&lt;span&gt;침실&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a data-group=\"BATHROOM\" class=\"bh_colornav1\"&gt;&lt;span&gt;욕실&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a data-group=\"KIDSROOM\" class=\"bh_colornav2\"&gt;&lt;span&gt;아이방&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a data-group=\"LIVINGROOM\" class=\"bh_colornav3\"&gt;&lt;span&gt;거실&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a data-group=\"KITCHEN\" class=\"bh_colornav4\"&gt;&lt;span&gt;부엌&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a data-group=\"DININGROOM\" class=\"bh_colornav5\"&gt;&lt;span&gt;주방&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a data-group=\"OFFICE\" class=\"bh_colornav6\"&gt;&lt;span&gt;서재&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a data-group=\"EXTERIOR\" class=\"bh_colornav7\"&gt;&lt;span&gt;실외공간&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt; &lt;/div&gt; &lt;div id=\"cc_search_area\" style=\"display: none;\"&gt; &lt;div class=\"cc_search\"&gt; &lt;label&gt;컬러찾기&lt;/label&gt;&lt;input type=\"text\" id=\"cc_search_btn\" placeholder=\"컬러번호 또는 컬러명으로 검색하세요\"&gt; &lt;/div&gt; &lt;div id=\"cckeywordauto\"&gt; &lt;ul&gt;&lt;li&gt;&lt;a&gt;coffee&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a&gt;silver&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a&gt;vintage&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a&gt;lemon&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a&gt;red&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a&gt;green&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a&gt;pink&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt; &lt;/div&gt; &lt;div id=\"ccsearchOutput\"&gt;&lt;span id=\"cckeyword\"&gt;coffee&lt;/span&gt;검색결과&lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;div class=\"behr_colorChart\" style=\"display: block;\"&gt;&lt;div class=\"cc-box\" data-ccid=\"0\" data-name=\"PALE CORAL\" data-code=\"PPU3-07\" data-rgb=\"#F0D0B5\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#F0D0B5;\"&gt; &lt;p class=\"cc-name\"&gt;PALE CORAL&lt;span&gt;PPU3-07&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"1\" data-name=\"COCO\" data-code=\"N270-3\" data-rgb=\"#D1BBA2\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#D1BBA2;\"&gt; &lt;p class=\"cc-name\"&gt;COCO&lt;span&gt;N270-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"2\" data-name=\"STUDIO TAUPE\" data-code=\"PPU5-07\" data-rgb=\"#A5978A\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#A5978A;\"&gt; &lt;p class=\"cc-name\"&gt;STUDIO TAUPE&lt;span&gt;PPU5-07&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"3\" data-name=\"CHATEAU\" data-code=\"PPU7-06\" data-rgb=\"#B5A18B\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#B5A18B;\"&gt; &lt;p class=\"cc-name\"&gt;CHATEAU&lt;span&gt;PPU7-06&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"4\" data-name=\"DISTANT LAND\" data-code=\"N260-5\" data-rgb=\"#A68A72\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#A68A72;\"&gt; &lt;p class=\"cc-name\"&gt;DISTANT LAND&lt;span&gt;N260-5&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"5\" data-name=\"ANTIQUE WHITE\" data-code=\"23\" data-rgb=\"#E8DDCB\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#E8DDCB;\"&gt; &lt;p class=\"cc-name\"&gt;ANTIQUE WHITE&lt;span&gt;23&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"6\" data-name=\"CURIOUS COLLECTION\" data-code=\"N290-4\" data-rgb=\"#D2BB9A\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#D2BB9A;\"&gt; &lt;p class=\"cc-name\"&gt;CURIOUS COLLECTION&lt;span&gt;N290-4&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"7\" data-name=\"DOESKIN GRAY\" data-code=\"N200-2\" data-rgb=\"#CCC3BB\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#CCC3BB;\"&gt; &lt;p class=\"cc-name\"&gt;DOESKIN GRAY&lt;span&gt;N200-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"8\" data-name=\"WASABI POWDER\" data-code=\"PPU9-10\" data-rgb=\"#BDB390\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#BDB390;\"&gt; &lt;p class=\"cc-name\"&gt;WASABI POWDER&lt;span&gt;PPU9-10&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"9\" data-name=\"MINTED LEMON\" data-code=\"PPU10-08\" data-rgb=\"#C0C6A9\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#C0C6A9;\"&gt; &lt;p class=\"cc-name\"&gt;MINTED LEMON&lt;span&gt;PPU10-08&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"10\" data-name=\"RIVERDALE\" data-code=\"N410-3\" data-rgb=\"#BEC5BC\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#BEC5BC;\"&gt; &lt;p class=\"cc-name\"&gt;RIVERDALE&lt;span&gt;N410-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"11\" data-name=\"ZEN\" data-code=\"PPU11-14\" data-rgb=\"#AABAB0\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#AABAB0;\"&gt; &lt;p class=\"cc-name\"&gt;ZEN&lt;span&gt;PPU11-14&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"12\" data-name=\"ATMOSPHERIC\" data-code=\"PPU12-15\" data-rgb=\"#899698\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#899698;\"&gt; &lt;p class=\"cc-name\"&gt;ATMOSPHERIC&lt;span&gt;PPU12-15&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"13\" data-name=\"OBSERVATORY\" data-code=\"PPU13-19\" data-rgb=\"#455D66\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#455D66;\"&gt; &lt;p class=\"cc-name\"&gt;OBSERVATORY&lt;span&gt;PPU13-19&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"14\" data-name=\"FLOWING BREEZE\" data-code=\"N480-2\" data-rgb=\"#B9C6CC\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#B9C6CC;\"&gt; &lt;p class=\"cc-name\"&gt;FLOWING BREEZE&lt;span&gt;N480-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"15\" data-name=\"FOREVER DENIM\" data-code=\"PPU14-05\" data-rgb=\"#778591\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#778591;\"&gt; &lt;p class=\"cc-name\"&gt;FOREVER DENIM&lt;span&gt;PPU14-05&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"16\" data-name=\"CATHEDRAL GRAY\" data-code=\"PPU18-14\" data-rgb=\"#ACAAA8\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#ACAAA8;\"&gt; &lt;p class=\"cc-name\"&gt;CATHEDRAL GRAY&lt;span&gt;PPU18-14&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"17\" data-name=\"SUEDE GRAY\" data-code=\"PPU18-17\" data-rgb=\"#857F7B\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#857F7B;\"&gt; &lt;p class=\"cc-name\"&gt;SUEDE GRAY&lt;span&gt;PPU18-17&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"18\" data-name=\"FRENCH LILAC\" data-code=\"PPU16-10\" data-rgb=\"#BDB8BB\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#BDB8BB;\"&gt; &lt;p class=\"cc-name\"&gt;FRENCH LILAC&lt;span&gt;PPU16-10&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"19\" data-name=\"SO MERLOT\" data-code=\"PPU1-15\" data-rgb=\"#84525B\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#84525B;\"&gt; &lt;p class=\"cc-name\"&gt;SO MERLOT&lt;span&gt;PPU1-15&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"20\" data-name=\"BLACKBERRY JAM\" data-code=\"S100-6\" data-rgb=\"#6F5F71\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#6F5F71;\"&gt; &lt;p class=\"cc-name\"&gt;BLACKBERRY JAM&lt;span&gt;S100-6&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"21\" data-name=\"LUXE LILAC\" data-code=\"N560-3\" data-rgb=\"#A7A3B2\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#A7A3B2;\"&gt; &lt;p class=\"cc-name\"&gt;LUXE LILAC&lt;span&gt;N560-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"22\" data-name=\"BLUEPRINT\" data-code=\"S470-5\" data-rgb=\"#5F818F\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#5F818F;\"&gt; &lt;p class=\"cc-name\"&gt;BLUEPRINT&lt;span&gt;S470-5&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"23\" data-name=\"HALF SEA FOG\" data-code=\"N470-3\" data-rgb=\"#A9B7BC\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#A9B7BC;\"&gt; &lt;p class=\"cc-name\"&gt;HALF SEA FOG&lt;span&gt;N470-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"24\" data-name=\"SILVER BULLET\" data-code=\"N520-2\" data-rgb=\"#C4C4C4\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#C4C4C4;\"&gt; &lt;p class=\"cc-name\"&gt;SILVER BULLET&lt;span&gt;N520-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"25\" data-name=\"MINED COAL\" data-code=\"PPU18-18\" data-rgb=\"#6C6A66\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#6C6A66;\"&gt; &lt;p class=\"cc-name\"&gt;MINED COAL&lt;span&gt;PPU18-18&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"26\" data-name=\"JUNGLE CAMOUFLAGE\" data-code=\"N350-4\" data-rgb=\"#AAA795\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#AAA795;\"&gt; &lt;p class=\"cc-name\"&gt;JUNGLE CAMOUFLAGE&lt;span&gt;N350-4&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"27\" data-name=\"KINDLING\" data-code=\"N200-6\" data-rgb=\"#7A7069\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#7A7069;\"&gt; &lt;p class=\"cc-name\"&gt;KINDLING&lt;span&gt;N200-6&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"28\" data-name=\"HARMONIOUS GOLD\" data-code=\"M300-3\" data-rgb=\"#E9CFA4\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#E9CFA4;\"&gt; &lt;p class=\"cc-name\"&gt;HARMONIOUS GOLD&lt;span&gt;M300-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"29\" data-name=\"LUNAR SURFACE\" data-code=\"N460-3\" data-rgb=\"#B5B9B7\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#B5B9B7;\"&gt; &lt;p class=\"cc-name\"&gt;LUNAR SURFACE&lt;span&gt;N460-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"30\" data-name=\"CANVAS LUGGAGE\" data-code=\"N300-2\" data-rgb=\"#E1D7C7\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#E1D7C7;\"&gt; &lt;p class=\"cc-name\"&gt;CANVAS LUGGAGE&lt;span&gt;N300-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"31\" data-name=\"BREATHE\" data-code=\"S360-2\" data-rgb=\"#D1D1B9\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#D1D1B9;\"&gt; &lt;p class=\"cc-name\"&gt;BREATHE&lt;span&gt;S360-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"32\" data-name=\"METROPOLIS\" data-code=\"N140-3\" data-rgb=\"#B3A9A6\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#B3A9A6;\"&gt; &lt;p class=\"cc-name\"&gt;METROPOLIS&lt;span&gt;N140-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"33\" data-name=\"LINEN WHITE\" data-code=\"70\" data-rgb=\"#F6ECD8\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#F6ECD8;\"&gt; &lt;p class=\"cc-name\"&gt;LINEN WHITE&lt;span&gt;70&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"34\" data-name=\"ANONYMOUS\" data-code=\"780F-5\" data-rgb=\"#939392\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#939392;\"&gt; &lt;p class=\"cc-name\"&gt;ANONYMOUS&lt;span&gt;780F-5&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"35\" data-name=\"DRY BROWN\" data-code=\"N230-5\" data-rgb=\"#968375\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#968375;\"&gt; &lt;p class=\"cc-name\"&gt;DRY BROWN&lt;span&gt;N230-5&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"36\" data-name=\"PERFECT TAUPE\" data-code=\"PPU18-13\" data-rgb=\"#B5ACA1\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#B5ACA1;\"&gt; &lt;p class=\"cc-name\"&gt;PERFECT TAUPE&lt;span&gt;PPU18-13&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"37\" data-name=\"STERLING\" data-code=\"780E-3\" data-rgb=\"#D2D4D3\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#D2D4D3;\"&gt; &lt;p class=\"cc-name\"&gt;STERLING&lt;span&gt;780E-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"38\" data-name=\"SUBTLE TOUCH\" data-code=\"790E-1\" data-rgb=\"#DBDADA\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#DBDADA;\"&gt; &lt;p class=\"cc-name\"&gt;SUBTLE TOUCH&lt;span&gt;790E-1&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"39\" data-name=\"FRENCH SILVER\" data-code=\"PPU18-05\" data-rgb=\"#B8BCBE\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#B8BCBE;\"&gt; &lt;p class=\"cc-name\"&gt;FRENCH SILVER&lt;span&gt;PPU18-05&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"40\" data-name=\"FLANNEL GRAY\" data-code=\"N520-3\" data-rgb=\"#ADADAD\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#ADADAD;\"&gt; &lt;p class=\"cc-name\"&gt;FLANNEL GRAY&lt;span&gt;N520-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"41\" data-name=\"ULTRA PURE WHITE PRW15\" data-code=\"PR-W15\" data-rgb=\"#F8F9F5\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#F8F9F5;\"&gt; &lt;p class=\"cc-name\"&gt;ULTRA PURE WHITE PRW15&lt;span&gt;PR-W15&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"42\" data-name=\"WHITE METAL\" data-code=\"N520-1\" data-rgb=\"#D0D0D0\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#D0D0D0;\"&gt; &lt;p class=\"cc-name\"&gt;WHITE METAL&lt;span&gt;N520-1&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"43\" data-name=\"BURNISHED CLAY\" data-code=\"PPU18-09\" data-rgb=\"#D2CCC5\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#D2CCC5;\"&gt; &lt;p class=\"cc-name\"&gt;BURNISHED CLAY&lt;span&gt;PPU18-09&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"44\" data-name=\"DARK NAVY\" data-code=\"S530-7\" data-rgb=\"#40495B\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#40495B;\"&gt; &lt;p class=\"cc-name\"&gt;DARK NAVY&lt;span&gt;S530-7&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"45\" data-name=\"DARK PEWTER\" data-code=\"PPU18-04\" data-rgb=\"#8D9397\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#8D9397;\"&gt; &lt;p class=\"cc-name\"&gt;DARK PEWTER&lt;span&gt;PPU18-04&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"46\" data-name=\"POLAR BEAR\" data-code=\"75\" data-rgb=\"#F5F3ED\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#F5F3ED;\"&gt; &lt;p class=\"cc-name\"&gt;POLAR BEAR&lt;span&gt;75&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"47\" data-name=\"CHICAGO FOG\" data-code=\"N140-2\" data-rgb=\"#C9C1BE\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#C9C1BE;\"&gt; &lt;p class=\"cc-name\"&gt;CHICAGO FOG&lt;span&gt;N140-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"48\" data-name=\"SPUN WOOL\" data-code=\"N220-1\" data-rgb=\"#E3DDD6\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#E3DDD6;\"&gt; &lt;p class=\"cc-name\"&gt;SPUN WOOL&lt;span&gt;N220-1&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"49\" data-name=\"BOOT CUT\" data-code=\"S510-2\" data-rgb=\"#AEC1D0\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#AEC1D0;\"&gt; &lt;p class=\"cc-name\"&gt;BOOT CUT&lt;span&gt;S510-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;/div&gt;&lt;div class=\"cc-box-img\"&gt;&lt;div class=\"cc-box-imgbox\"&gt;&lt;img src=\"/colorbox/img/byrooms/Bed01.jpg\" alt=\"이미지1번입니다.\"&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"57\" data-name=\"GENTLE SEA\" data-code=\"S470-2\" data-rgb=\"#B0C8D1\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#B0C8D1;\"&gt; &lt;p class=\"cc-name\"&gt;GENTLE SEA&lt;span&gt;S470-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"58\" data-name=\"POLAR BEAR\" data-code=\"75\" data-rgb=\"#F5F3ED\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#F5F3ED;\"&gt; &lt;p class=\"cc-name\"&gt;POLAR BEAR&lt;span&gt;75&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class=\"cc-box-img\"&gt;&lt;div class=\"cc-box-imgbox\"&gt;&lt;img src=\"/colorbox/img/byrooms/Bed02.jpg\" alt=\"이미지2번입니다\"&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"63\" data-name=\"UNDINE\" data-code=\"M450-4\" data-rgb=\"#89C0BC\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#89C0BC;\"&gt; &lt;p class=\"cc-name\"&gt;UNDINE&lt;span&gt;M450-4&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"64\" data-name=\"CARBON\" data-code=\"N520-7\" data-rgb=\"#3D3E3F\" data-tcol=\"W\" data-scroll=\"i\" style=\"background:#3D3E3F;\"&gt; &lt;p class=\"cc-name\"&gt;CARBON&lt;span&gt;N520-7&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"65\" data-name=\"SPANISH SAND\" data-code=\"OR-W7\" data-rgb=\"#DCD0BE\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#DCD0BE;\"&gt; &lt;p class=\"cc-name\"&gt;SPANISH SAND&lt;span&gt;OR-W7&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class=\"cc-box-img\"&gt;&lt;div class=\"cc-box-imgbox\"&gt;&lt;img src=\"/colorbox/img/byrooms/Bed03.jpg\" alt=\"이미지3번입니다\"&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"69\" data-name=\"CHATEAU\" data-code=\"PPU7-06\" data-rgb=\"#B5A18B\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#B5A18B;\"&gt; &lt;p class=\"cc-name\"&gt;CHATEAU&lt;span&gt;PPU7-06&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"70\" data-name=\"POLAR BEAR\" data-code=\"75\" data-rgb=\"#F5F3ED\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#F5F3ED;\"&gt; &lt;p class=\"cc-name\"&gt;POLAR BEAR&lt;span&gt;75&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"71\" data-name=\"BLACKOUT\" data-code=\"N510-7\" data-rgb=\"#413F3F\" data-tcol=\"W\" data-scroll=\"i\" style=\"background:#413F3F;\"&gt; &lt;p class=\"cc-name\"&gt;BLACKOUT&lt;span&gt;N510-7&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class=\"cc-box-img\"&gt;&lt;div class=\"cc-box-imgbox\"&gt;&lt;img src=\"/colorbox/img/byrooms/Bed04.jpg\" alt=\"이미지4번입니다\"&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"75\" data-name=\"AGED BEIGE\" data-code=\"PPU7-09\" data-rgb=\"#D7CFC1\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#D7CFC1;\"&gt; &lt;p class=\"cc-name\"&gt;AGED BEIGE&lt;span&gt;PPU7-09&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"76\" data-name=\"PURE EARTH\" data-code=\"PPU7-05\" data-rgb=\"#A79481\" data-tcol=\"W\" data-scroll=\"i\" style=\"background:#A79481;\"&gt; &lt;p class=\"cc-name\"&gt;PURE EARTH&lt;span&gt;PPU7-05&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"77\" data-name=\"WHITE\" data-code=\"1852\" data-rgb=\"#EBEAE7\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#EBEAE7;\"&gt; &lt;p class=\"cc-name\"&gt;WHITE&lt;span&gt;1852&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class=\"cc-box-img\"&gt;&lt;div class=\"cc-box-imgbox\"&gt;&lt;img src=\"/colorbox/img/byrooms/Bed05.jpg\" alt=\"이미지5번입니다\"&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"81\" data-name=\"FUTURE VISION\" data-code=\"N100-3\" data-rgb=\"#BCB5BD\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#BCB5BD;\"&gt; &lt;p class=\"cc-name\"&gt;FUTURE VISION&lt;span&gt;N100-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"82\" data-name=\"ULTRA PURE WHITE\" data-code=\"PPU18-06\" data-rgb=\"#F8F8F4\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#F8F8F4;\"&gt; &lt;p class=\"cc-name\"&gt;ULTRA PURE WHITE&lt;span&gt;PPU18-06&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class=\"cc-box-img\"&gt;&lt;div class=\"cc-box-imgbox\"&gt;&lt;img src=\"/colorbox/img/byrooms/Bed06.jpg\" alt=\"이미지6번입니다\"&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"87\" data-name=\"PALE PARSNIP\" data-code=\"S320-2\" data-rgb=\"#E3D7C1\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#E3D7C1;\"&gt; &lt;p class=\"cc-name\"&gt;PALE PARSNIP&lt;span&gt;S320-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"88\" data-name=\"SLEEK WHITE\" data-code=\"OR-W15\" data-rgb=\"#FAF5EB\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#FAF5EB;\"&gt; &lt;p class=\"cc-name\"&gt;SLEEK WHITE&lt;span&gt;OR-W15&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"89\" data-name=\"MAUVELOUS\" data-code=\"BNC-12\" data-rgb=\"#B5A49E\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#B5A49E;\"&gt; &lt;p class=\"cc-name\"&gt;MAUVELOUS&lt;span&gt;BNC-12&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class=\"cc-box-img\"&gt;&lt;div class=\"cc-box-imgbox\"&gt;&lt;img src=\"/colorbox/img/byrooms/Bed07.jpg\" alt=\"이미지7번입니다\"&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"93\" data-name=\"ROMAN PLASTER\" data-code=\"PPU7-10\" data-rgb=\"#DDD1C0\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#DDD1C0;\"&gt; &lt;p class=\"cc-name\"&gt;ROMAN PLASTER&lt;span&gt;PPU7-10&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"94\" data-name=\"SWISS COFFEE\" data-code=\"12\" data-rgb=\"#F1ECE1\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#F1ECE1;\"&gt; &lt;p class=\"cc-name\"&gt;SWISS COFFEE&lt;span&gt;12&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"95\" data-name=\"JOURNEYS END\" data-code=\"S520-2\" data-rgb=\"#BAC9D6\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#BAC9D6;\"&gt; &lt;p class=\"cc-name\"&gt;JOURNEYS END&lt;span&gt;S520-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class=\"cc-box-img\"&gt;&lt;div class=\"cc-box-imgbox\"&gt;&lt;img src=\"/colorbox/img/byrooms/Bed08.jpg\" alt=\"이미지8번입니다\"&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"99\" data-name=\"PARK AVENUE\" data-code=\"MQ2-55\" data-rgb=\"#bbb2a9\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#bbb2a9;\"&gt; &lt;p class=\"cc-name\"&gt;PARK AVENUE&lt;span&gt;MQ2-55&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"100\" data-name=\"COLD STEEL\" data-code=\"MQ5-20\" data-rgb=\"#808f99\" data-tcol=\"W\" data-scroll=\"i\" style=\"background:#808f99;\"&gt; &lt;p class=\"cc-name\"&gt;COLD STEEL&lt;span&gt;MQ5-20&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"101\" data-name=\"CREME DE LA CREME\" data-code=\"MQ3-33\" data-rgb=\"#e2ddd8\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#e2ddd8;\"&gt; &lt;p class=\"cc-name\"&gt;CREME DE LA CREME&lt;span&gt;MQ3-33&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class=\"cc-box\" data-ccid=\"102\" data-name=\"UNPREDICTABLE HUE\" data-code=\"MQ2-58\" data-rgb=\"#7b746c\" data-tcol=\"W\" data-scroll=\"i\" style=\"background:#7b746c;\"&gt; &lt;p class=\"cc-name\"&gt;UNPREDICTABLE HUE&lt;span&gt;MQ2-58&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt; &lt;/div&gt; &lt;div class=\"behr_selectColor\"&gt; &lt;h3&gt;My BEHR Colors&lt;/h3&gt; &lt;div class=\"behr_palette\"&gt; &lt;div class=\"behr_palette_guide\"&gt; 크게 보고 싶은 컬러를 눌러 보세요. &lt;/div&gt; &lt;div id=\"behr_palette_save\"&gt; &lt;/div&gt; &lt;/div&gt; &lt;div id=\"detailCanvas\" style=\"display: none;\"&gt;&lt;div id=\"detailCanvas_list\"&gt;&lt;div class=\"cc-box\" data-ccid=\"94\" data-name=\"SWISS COFFEE\" data-code=\"12\" data-rgb=\"#F1ECE1\" data-tcol=\"B\" data-scroll=\"i\" style=\";\"&gt; &lt;p class=\"cc-name\"&gt;SWISS COFFEE&lt;span&gt;12&lt;/span&gt;&lt;/p&gt;&lt;a class=\"cc-view\" style=\"background:#F1ECE1;\"&gt;&lt;span class=\"cc_zoom\"&gt;&lt;/span&gt;&lt;/a&gt;&lt;a class=\"palette_del\"&gt;삭제&lt;/a&gt;&lt;/div&gt;&lt;div class=\"cc-box active\" data-ccid=\"95\" data-name=\"JOURNEYS END\" data-code=\"S520-2\" data-rgb=\"#BAC9D6\" data-tcol=\"B\" data-scroll=\"i\" style=\";\"&gt; &lt;p class=\"cc-name\"&gt;JOURNEYS END&lt;span&gt;S520-2&lt;/span&gt;&lt;/p&gt;&lt;a class=\"cc-view\" style=\"background:#BAC9D6;\"&gt;&lt;span class=\"cc_zoom\"&gt;&lt;/span&gt;&lt;/a&gt;&lt;a class=\"palette_del\"&gt;삭제&lt;/a&gt;&lt;/div&gt; &lt;/div&gt;&lt;div id=\"detailCanvas_view\"&gt;&lt;div class=\"cc-box active\" data-ccid=\"95\" data-name=\"JOURNEYS END\" data-code=\"S520-2\" data-rgb=\"#BAC9D6\" data-tcol=\"B\" data-scroll=\"i\" style=\";\"&gt; &lt;p class=\"cc-name\"&gt;JOURNEYS END&lt;span&gt;S520-2&lt;/span&gt;&lt;/p&gt;&lt;a class=\"cc-view\" style=\"background:#BAC9D6;\"&gt;&lt;span class=\"cc_zoom\"&gt;&lt;/span&gt;&lt;/a&gt;&lt;a class=\"palette_del\"&gt;삭제&lt;/a&gt;&lt;a class=\"detailColorvs_buyBtn\"&gt;주문하기&lt;/a&gt;&lt;/div&gt;&lt;/div&gt; &lt;div id=\"detailCanvas_color\"&gt; &lt;a class=\"detailCanvas_btn detailCanvas_btn01\" data-index=\"0\"&gt;1번색상선택&lt;/a&gt; &lt;a class=\"detailCanvas_btn detailCanvas_btn02\" data-index=\"1\"&gt;2번색상선택&lt;/a&gt; &lt;a class=\"detailCanvas_btn detailCanvas_btn03\" data-index=\"2\"&gt;3번색상선택&lt;/a&gt; &lt;div class=\"detailCanvas_view detailCanvas_view01\"&gt;&lt;/div&gt; &lt;div class=\"detailCanvas_view detailCanvas_view02\"&gt;&lt;/div&gt; &lt;div class=\"detailCanvas_view detailCanvas_view03\"&gt;&lt;/div&gt; &lt;/div&gt;&lt;a class=\"detailCanvas_close\"&gt;닫기&lt;/a&gt;&lt;/div&gt; &lt;/div&gt; &lt;div class=\"loading\" style=\"display: none;\"&gt;&lt;img src=\"/colorbox/icon/ajax-loader.gif\"&gt;&lt;/div&gt;&lt;div class=\"wh-ov\" style=\"display: none;\"&gt;&lt;/div&gt;&lt;/div&gt; &lt;!-- } 컬러챠트 삽입 --&gt;&lt;/article&gt;&lt;/body&gt;&lt;/html&gt; &lt;/iframe&gt;&lt;/center&gt; 이렇게 넣으면 되는거 아닌가요? ㅠㅠ 안되네요 ', 'https://cboard.net/sitemap/og_image.php?text=네이버스토어 html 삽입&link=https://cboard.net/k/1_1040205_428878900', '2022.09.22')<br>Data too long for column 'content' at row 1<!doctype html>
<html lang=ko>
<head>
<meta charset=utf-8>
<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=0,maximum-scale=10,user-scalable=yes">
<meta name="HandheldFriendly" content="true">
<meta name="format-detection" content="telephone=no">
<meta http-equiv="X-UA-Compatible" content="IE=10,chrome=1">
<title>네이버스토어 html 삽입</title>
<link rel="stylesheet" href="/all4_new.css" type="text/css" media="all">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" type="text/css" media="all">

<meta property="og:locale" content="ko_KR">
<meta name="content-language" content="kr">
<meta name="author" content="시보드">
<meta property="og:site_name" content="시보드" />
<meta name="apple-mobile-web-app-title" content="시보드" />
<meta name="Copyright" content="시보드" />

<meta name="description" content=" 안녕하세요 네이버스토어 상세페이지에 페인트 색상 고를 수 있도록  이런 html 삽입하려고 하는데 잘 안되네요.. https://behr.kr/sub/gallery/studio_iframe.asp 이 페이지를 넣으려면 html 적는 칸에 &lt;center&gt;&lt;iframe src="https://behr.kr/sub/gallery/studio_iframe.asp" width="850" height="1000" frameborder="0" marginwidth="0" marginheight="0" scrolling="no"&gt; &lt;html lang="ko" class=" -webkit-"&gt;&lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;meta http-equiv="X-UA-Compatible" content="IE=edge"&gt; &lt;meta name="format-detection" content="telephone=no"&gt; &lt;meta name="viewport" content="user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, width=device-width"&gt; &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8"&gt; &lt;meta http-equiv="Content-Script-Type" content="text/javascript"&gt; &lt;meta http-equiv="Content-Style-Type" content="text/css"&gt; &lt;style media="" data-href="https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700,900"&gt;/*# sourceURL=https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700,900 */ /*@ sourceURL=https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700,900 */ /* devanagari */ @font-face {   font-family: 'Poppins';   font-style: normal;   font-weight: 300;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLDz8Z11lFd2JQEl8qw.woff2) format('woff2');   unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB; } /* latin-ext */ @font-face {   font-family: 'Poppins';   font-style: normal;   font-weight: 300;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLDz8Z1JlFd2JQEl8qw.woff2) format('woff2');   unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face {   font-family: 'Poppins';   font-style: normal;   font-weight: 300;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLDz8Z1xlFd2JQEk.woff2) format('woff2');   unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* devanagari */ @font-face {   font-family: 'Poppins';   font-style: normal;   font-weight: 400;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiEyp8kv8JHgFVrJJbecnFHGPezSQ.woff2) format('woff2');   unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB; } /* latin-ext */ @font-face {   font-family: 'Poppins';   font-style: normal;   font-weight: 400;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiEyp8kv8JHgFVrJJnecnFHGPezSQ.woff2) format('woff2');   unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face {   font-family: 'Poppins';   font-style: normal;   font-weight: 400;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiEyp8kv8JHgFVrJJfecnFHGPc.woff2) format('woff2');   unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* devanagari */ @font-face {   font-family: 'Poppins';   font-style: normal;   font-weight: 500;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLGT9Z11lFd2JQEl8qw.woff2) format('woff2');   unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB; } /* latin-ext */ @font-face {   font-family: 'Poppins';   font-style: normal;   font-weight: 500;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLGT9Z1JlFd2JQEl8qw.woff2) format('woff2');   unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face {   font-family: 'Poppins';   font-style: normal;   font-weight: 500;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLGT9Z1xlFd2JQEk.woff2) format('woff2');   unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* devanagari */ @font-face {   font-family: 'Poppins';   font-style: normal;   font-weight: 600;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLEj6Z11lFd2JQEl8qw.woff2) format('woff2');   unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB; } /* latin-ext */ @font-face {   font-family: 'Poppins';   font-style: normal;   font-weight: 600;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLEj6Z1JlFd2JQEl8qw.woff2) format('woff2');   unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face {   font-family: 'Poppins';   font-style: normal;   font-weight: 600;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLEj6Z1xlFd2JQEk.woff2) format('woff2');   unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* devanagari */ @font-face {   font-family: 'Poppins';   font-style: normal;   font-weight: 700;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLCz7Z11lFd2JQEl8qw.woff2) format('woff2');   unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB; } /* latin-ext */ @font-face {   font-family: 'Poppins';   font-style: normal;   font-weight: 700;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLCz7Z1JlFd2JQEl8qw.woff2) format('woff2');   unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face {   font-family: 'Poppins';   font-style: normal;   font-weight: 700;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLCz7Z1xlFd2JQEk.woff2) format('woff2');   unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* devanagari */ @font-face {   font-family: 'Poppins';   font-style: normal;   font-weight: 900;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLBT5Z11lFd2JQEl8qw.woff2) format('woff2');   unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB; } /* latin-ext */ @font-face {   font-family: 'Poppins';   font-style: normal;   font-weight: 900;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLBT5Z1JlFd2JQEl8qw.woff2) format('woff2');   unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face {   font-family: 'Poppins';   font-style: normal;   font-weight: 900;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLBT5Z1xlFd2JQEk.woff2) format('woff2');   unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } &lt;/style&gt; &lt;style media="" data-href="/css/style.css"&gt;/*# sourceURL=/css/style.css */ /*@ sourceURL=/css/style.css */ @charset "utf-8"; @import url("https://behr.kr/css/base.css"); @import url("https://behr.kr/css/common.css"); @import url("https://behr.kr/css/main.css"); @import url("https://behr.kr/css/sub.css"); /* @import url("https://behr.kr/css/gallery.css"); */&lt;/style&gt; &lt;style media="" data-href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css"&gt;/*# sourceURL=//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css */ /*@ sourceURL=//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css */ /*!  *  Font Awesome 4.1.0 by @davegandy - http://fontawesome.io - @fontawesome  *  License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)  */@font-face{font-family:'FontAwesome';src:url("https://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/../fonts/fontawesome-webfont.eot?v=4.1.0");src:url("https://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/../fonts/fontawesome-webfont.eot?#iefix&amp;v=4.1.0") format('embedded-opentype'),url("https://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/../fonts/fontawesome-webfont.woff?v=4.1.0") format('woff'),url("https://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/../fonts/fontawesome-webfont.ttf?v=4.1.0") format('truetype'),url("https://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/../fonts/fontawesome-webfont.svg?v=4.1.0#fontawesomeregular") format('svg');font-weight:normal;font-style:normal}.fa{display:inline-block;font-family:FontAwesome;font-style:normal;font-weight:normal;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.fa-lg{font-size:1.33333333em;line-height:.75em;vertical-align:-15%}.fa-2x{font-size:2em}.fa-3x{font-size:3em}.fa-4x{font-size:4em}.fa-5x{font-size:5em}.fa-fw{width:1.28571429em;text-align:center}.fa-ul{padding-left:0;margin-left:2.14285714em;list-style-type:none}.fa-ul&gt;li{position:relative}.fa-li{position:absolute;left:-2.14285714em;width:2.14285714em;top:.14285714em;text-align:center}.fa-li.fa-lg{left:-1.85714286em}.fa-border{padding:.2em .25em .15em;border:solid .08em #eee;border-radius:.1em}.pull-right{float:right}.pull-left{float:left}.fa.pull-left{margin-right:.3em}.fa.pull-right{margin-left:.3em}.fa-spin{-webkit-animation:spin 2s infinite linear;-moz-animation:spin 2s infinite linear;-o-animation:spin 2s infinite linear;animation:spin 2s infinite linear}@-moz-keyframes spin{0%{-moz-transform:rotate(0deg)}100%{-moz-transform:rotate(359deg)}}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg)}100%{-webkit-transform:rotate(359deg)}}@-o-keyframes spin{0%{-o-transform:rotate(0deg)}100%{-o-transform:rotate(359deg)}}@keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}.fa-rotate-90{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=1);-webkit-transform:rotate(90deg);-moz-transform:rotate(90deg);-ms-transform:rotate(90deg);-o-transform:rotate(90deg);transform:rotate(90deg)}.fa-rotate-180{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2);-webkit-transform:rotate(180deg);-moz-transform:rotate(180deg);-ms-transform:rotate(180deg);-o-transform:rotate(180deg);transform:rotate(180deg)}.fa-rotate-270{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);-webkit-transform:rotate(270deg);-moz-transform:rotate(270deg);-ms-transform:rotate(270deg);-o-transform:rotate(270deg);transform:rotate(270deg)}.fa-flip-horizontal{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1);-webkit-transform:scale(-1, 1);-moz-transform:scale(-1, 1);-ms-transform:scale(-1, 1);-o-transform:scale(-1, 1);transform:scale(-1, 1)}.fa-flip-vertical{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1);-webkit-transform:scale(1, -1);-moz-transform:scale(1, -1);-ms-transform:scale(1, -1);-o-transform:scale(1, -1);transform:scale(1, -1)}.fa-stack{position:relative;display:inline-block;width:2em;height:2em;line-height:2em;vertical-align:middle}.fa-stack-1x,.fa-stack-2x{position:absolute;left:0;width:100%;text-align:center}.fa-stack-1x{line-height:inherit}.fa-stack-2x{font-size:2em}.fa-inverse{color:#fff}.fa-glass:before{content:"\f000"}.fa-music:before{content:"\f001"}.fa-search:before{content:"\f002"}.fa-envelope-o:before{content:"\f003"}.fa-heart:before{content:"\f004"}.fa-star:before{content:"\f005"}.fa-star-o:before{content:"\f006"}.fa-user:before{content:"\f007"}.fa-film:before{content:"\f008"}.fa-th-large:before{content:"\f009"}.fa-th:before{content:"\f00a"}.fa-th-list:before{content:"\f00b"}.fa-check:before{content:"\f00c"}.fa-times:before{content:"\f00d"}.fa-search-plus:before{content:"\f00e"}.fa-search-minus:before{content:"\f010"}.fa-power-off:before{content:"\f011"}.fa-signal:before{content:"\f012"}.fa-gear:before,.fa-cog:before{content:"\f013"}.fa-trash-o:before{content:"\f014"}.fa-home:before{content:"\f015"}.fa-file-o:before{content:"\f016"}.fa-clock-o:before{content:"\f017"}.fa-road:before{content:"\f018"}.fa-download:before{content:"\f019"}.fa-arrow-circle-o-down:before{content:"\f01a"}.fa-arrow-circle-o-up:before{content:"\f01b"}.fa-inbox:before{content:"\f01c"}.fa-play-circle-o:before{content:"\f01d"}.fa-rotate-right:before,.fa-repeat:before{content:"\f01e"}.fa-refresh:before{content:"\f021"}.fa-list-alt:before{content:"\f022"}.fa-lock:before{content:"\f023"}.fa-flag:before{content:"\f024"}.fa-headphones:before{content:"\f025"}.fa-volume-off:before{content:"\f026"}.fa-volume-down:before{content:"\f027"}.fa-volume-up:before{content:"\f028"}.fa-qrcode:before{content:"\f029"}.fa-barcode:before{content:"\f02a"}.fa-tag:before{content:"\f02b"}.fa-tags:before{content:"\f02c"}.fa-book:before{content:"\f02d"}.fa-bookmark:before{content:"\f02e"}.fa-print:before{content:"\f02f"}.fa-camera:before{content:"\f030"}.fa-font:before{content:"\f031"}.fa-bold:before{content:"\f032"}.fa-italic:before{content:"\f033"}.fa-text-height:before{content:"\f034"}.fa-text-width:before{content:"\f035"}.fa-align-left:before{content:"\f036"}.fa-align-center:before{content:"\f037"}.fa-align-right:before{content:"\f038"}.fa-align-justify:before{content:"\f039"}.fa-list:before{content:"\f03a"}.fa-dedent:before,.fa-outdent:before{content:"\f03b"}.fa-indent:before{content:"\f03c"}.fa-video-camera:before{content:"\f03d"}.fa-photo:before,.fa-image:before,.fa-picture-o:before{content:"\f03e"}.fa-pencil:before{content:"\f040"}.fa-map-marker:before{content:"\f041"}.fa-adjust:before{content:"\f042"}.fa-tint:before{content:"\f043"}.fa-edit:before,.fa-pencil-square-o:before{content:"\f044"}.fa-share-square-o:before{content:"\f045"}.fa-check-square-o:before{content:"\f046"}.fa-arrows:before{content:"\f047"}.fa-step-backward:before{content:"\f048"}.fa-fast-backward:before{content:"\f049"}.fa-backward:before{content:"\f04a"}.fa-play:before{content:"\f04b"}.fa-pause:before{content:"\f04c"}.fa-stop:before{content:"\f04d"}.fa-forward:before{content:"\f04e"}.fa-fast-forward:before{content:"\f050"}.fa-step-forward:before{content:"\f051"}.fa-eject:before{content:"\f052"}.fa-chevron-left:before{content:"\f053"}.fa-chevron-right:before{content:"\f054"}.fa-plus-circle:before{content:"\f055"}.fa-minus-circle:before{content:"\f056"}.fa-times-circle:before{content:"\f057"}.fa-check-circle:before{content:"\f058"}.fa-question-circle:before{content:"\f059"}.fa-info-circle:before{content:"\f05a"}.fa-crosshairs:before{content:"\f05b"}.fa-times-circle-o:before{content:"\f05c"}.fa-check-circle-o:before{content:"\f05d"}.fa-ban:before{content:"\f05e"}.fa-arrow-left:before{content:"\f060"}.fa-arrow-right:before{content:"\f061"}.fa-arrow-up:before{content:"\f062"}.fa-arrow-down:before{content:"\f063"}.fa-mail-forward:before,.fa-share:before{content:"\f064"}.fa-expand:before{content:"\f065"}.fa-compress:before{content:"\f066"}.fa-plus:before{content:"\f067"}.fa-minus:before{content:"\f068"}.fa-asterisk:before{content:"\f069"}.fa-exclamation-circle:before{content:"\f06a"}.fa-gift:before{content:"\f06b"}.fa-leaf:before{content:"\f06c"}.fa-fire:before{content:"\f06d"}.fa-eye:before{content:"\f06e"}.fa-eye-slash:before{content:"\f070"}.fa-warning:before,.fa-exclamation-triangle:before{content:"\f071"}.fa-plane:before{content:"\f072"}.fa-calendar:before{content:"\f073"}.fa-random:before{content:"\f074"}.fa-comment:before{content:"\f075"}.fa-magnet:before{content:"\f076"}.fa-chevron-up:before{content:"\f077"}.fa-chevron-down:before{content:"\f078"}.fa-retweet:before{content:"\f079"}.fa-shopping-cart:before{content:"\f07a"}.fa-folder:before{content:"\f07b"}.fa-folder-open:before{content:"\f07c"}.fa-arrows-v:before{content:"\f07d"}.fa-arrows-h:before{content:"\f07e"}.fa-bar-chart-o:before{content:"\f080"}.fa-twitter-square:before{content:"\f081"}.fa-facebook-square:before{content:"\f082"}.fa-camera-retro:before{content:"\f083"}.fa-key:before{content:"\f084"}.fa-gears:before,.fa-cogs:before{content:"\f085"}.fa-comments:before{content:"\f086"}.fa-thumbs-o-up:before{content:"\f087"}.fa-thumbs-o-down:before{content:"\f088"}.fa-star-half:before{content:"\f089"}.fa-heart-o:before{content:"\f08a"}.fa-sign-out:before{content:"\f08b"}.fa-linkedin-square:before{content:"\f08c"}.fa-thumb-tack:before{content:"\f08d"}.fa-external-link:before{content:"\f08e"}.fa-sign-in:before{content:"\f090"}.fa-trophy:before{content:"\f091"}.fa-github-square:before{content:"\f092"}.fa-upload:before{content:"\f093"}.fa-lemon-o:before{content:"\f094"}.fa-phone:before{content:"\f095"}.fa-square-o:before{content:"\f096"}.fa-bookmark-o:before{content:"\f097"}.fa-phone-square:before{content:"\f098"}.fa-twitter:before{content:"\f099"}.fa-facebook:before{content:"\f09a"}.fa-github:before{content:"\f09b"}.fa-unlock:before{content:"\f09c"}.fa-credit-card:before{content:"\f09d"}.fa-rss:before{content:"\f09e"}.fa-hdd-o:before{content:"\f0a0"}.fa-bullhorn:before{content:"\f0a1"}.fa-bell:before{content:"\f0f3"}.fa-certificate:before{content:"\f0a3"}.fa-hand-o-right:before{content:"\f0a4"}.fa-hand-o-left:before{content:"\f0a5"}.fa-hand-o-up:before{content:"\f0a6"}.fa-hand-o-down:before{content:"\f0a7"}.fa-arrow-circle-left:before{content:"\f0a8"}.fa-arrow-circle-right:before{content:"\f0a9"}.fa-arrow-circle-up:before{content:"\f0aa"}.fa-arrow-circle-down:before{content:"\f0ab"}.fa-globe:before{content:"\f0ac"}.fa-wrench:before{content:"\f0ad"}.fa-tasks:before{content:"\f0ae"}.fa-filter:before{content:"\f0b0"}.fa-briefcase:before{content:"\f0b1"}.fa-arrows-alt:before{content:"\f0b2"}.fa-group:before,.fa-users:before{content:"\f0c0"}.fa-chain:before,.fa-link:before{content:"\f0c1"}.fa-cloud:before{content:"\f0c2"}.fa-flask:before{content:"\f0c3"}.fa-cut:before,.fa-scissors:before{content:"\f0c4"}.fa-copy:before,.fa-files-o:before{content:"\f0c5"}.fa-paperclip:before{content:"\f0c6"}.fa-save:before,.fa-floppy-o:before{content:"\f0c7"}.fa-square:before{content:"\f0c8"}.fa-navicon:before,.fa-reorder:before,.fa-bars:before{content:"\f0c9"}.fa-list-ul:before{content:"\f0ca"}.fa-list-ol:before{content:"\f0cb"}.fa-strikethrough:before{content:"\f0cc"}.fa-underline:before{content:"\f0cd"}.fa-table:before{content:"\f0ce"}.fa-magic:before{content:"\f0d0"}.fa-truck:before{content:"\f0d1"}.fa-pinterest:before{content:"\f0d2"}.fa-pinterest-square:before{content:"\f0d3"}.fa-google-plus-square:before{content:"\f0d4"}.fa-google-plus:before{content:"\f0d5"}.fa-money:before{content:"\f0d6"}.fa-caret-down:before{content:"\f0d7"}.fa-caret-up:before{content:"\f0d8"}.fa-caret-left:before{content:"\f0d9"}.fa-caret-right:before{content:"\f0da"}.fa-columns:before{content:"\f0db"}.fa-unsorted:before,.fa-sort:before{content:"\f0dc"}.fa-sort-down:before,.fa-sort-desc:before{content:"\f0dd"}.fa-sort-up:before,.fa-sort-asc:before{content:"\f0de"}.fa-envelope:before{content:"\f0e0"}.fa-linkedin:before{content:"\f0e1"}.fa-rotate-left:before,.fa-undo:before{content:"\f0e2"}.fa-legal:before,.fa-gavel:before{content:"\f0e3"}.fa-dashboard:before,.fa-tachometer:before{content:"\f0e4"}.fa-comment-o:before{content:"\f0e5"}.fa-comments-o:before{content:"\f0e6"}.fa-flash:before,.fa-bolt:before{content:"\f0e7"}.fa-sitemap:before{content:"\f0e8"}.fa-umbrella:before{content:"\f0e9"}.fa-paste:before,.fa-clipboard:before{content:"\f0ea"}.fa-lightbulb-o:before{content:"\f0eb"}.fa-exchange:before{content:"\f0ec"}.fa-cloud-download:before{content:"\f0ed"}.fa-cloud-upload:before{content:"\f0ee"}.fa-user-md:before{content:"\f0f0"}.fa-stethoscope:before{content:"\f0f1"}.fa-suitcase:before{content:"\f0f2"}.fa-bell-o:before{content:"\f0a2"}.fa-coffee:before{content:"\f0f4"}.fa-cutlery:before{content:"\f0f5"}.fa-file-text-o:before{content:"\f0f6"}.fa-building-o:before{content:"\f0f7"}.fa-hospital-o:before{content:"\f0f8"}.fa-ambulance:before{content:"\f0f9"}.fa-medkit:before{content:"\f0fa"}.fa-fighter-jet:before{content:"\f0fb"}.fa-beer:before{content:"\f0fc"}.fa-h-square:before{content:"\f0fd"}.fa-plus-square:before{content:"\f0fe"}.fa-angle-double-left:before{content:"\f100"}.fa-angle-double-right:before{content:"\f101"}.fa-angle-double-up:before{content:"\f102"}.fa-angle-double-down:before{content:"\f103"}.fa-angle-left:before{content:"\f104"}.fa-angle-right:before{content:"\f105"}.fa-angle-up:before{content:"\f106"}.fa-angle-down:before{content:"\f107"}.fa-desktop:before{content:"\f108"}.fa-laptop:before{content:"\f109"}.fa-tablet:before{content:"\f10a"}.fa-mobile-phone:before,.fa-mobile:before{content:"\f10b"}.fa-circle-o:before{content:"\f10c"}.fa-quote-left:before{content:"\f10d"}.fa-quote-right:before{content:"\f10e"}.fa-spinner:before{content:"\f110"}.fa-circle:before{content:"\f111"}.fa-mail-reply:before,.fa-reply:before{content:"\f112"}.fa-github-alt:before{content:"\f113"}.fa-folder-o:before{content:"\f114"}.fa-folder-open-o:before{content:"\f115"}.fa-smile-o:before{content:"\f118"}.fa-frown-o:before{content:"\f119"}.fa-meh-o:before{content:"\f11a"}.fa-gamepad:before{content:"\f11b"}.fa-keyboard-o:before{content:"\f11c"}.fa-flag-o:before{content:"\f11d"}.fa-flag-checkered:before{content:"\f11e"}.fa-terminal:before{content:"\f120"}.fa-code:before{content:"\f121"}.fa-mail-reply-all:before,.fa-reply-all:before{content:"\f122"}.fa-star-half-empty:before,.fa-star-half-full:before,.fa-star-half-o:before{content:"\f123"}.fa-location-arrow:before{content:"\f124"}.fa-crop:before{content:"\f125"}.fa-code-fork:before{content:"\f126"}.fa-unlink:before,.fa-chain-broken:before{content:"\f127"}.fa-question:before{content:"\f128"}.fa-info:before{content:"\f129"}.fa-exclamation:before{content:"\f12a"}.fa-superscript:before{content:"\f12b"}.fa-subscript:before{content:"\f12c"}.fa-eraser:before{content:"\f12d"}.fa-puzzle-piece:before{content:"\f12e"}.fa-microphone:before{content:"\f130"}.fa-microphone-slash:before{content:"\f131"}.fa-shield:before{content:"\f132"}.fa-calendar-o:before{content:"\f133"}.fa-fire-extinguisher:before{content:"\f134"}.fa-rocket:before{content:"\f135"}.fa-maxcdn:before{content:"\f136"}.fa-chevron-circle-left:before{content:"\f137"}.fa-chevron-circle-right:before{content:"\f138"}.fa-chevron-circle-up:before{content:"\f139"}.fa-chevron-circle-down:before{content:"\f13a"}.fa-html5:before{content:"\f13b"}.fa-css3:before{content:"\f13c"}.fa-anchor:before{content:"\f13d"}.fa-unlock-alt:before{content:"\f13e"}.fa-bullseye:before{content:"\f140"}.fa-ellipsis-h:before{content:"\f141"}.fa-ellipsis-v:before{content:"\f142"}.fa-rss-square:before{content:"\f143"}.fa-play-circle:before{content:"\f144"}.fa-ticket:before{content:"\f145"}.fa-minus-square:before{content:"\f146"}.fa-minus-square-o:before{content:"\f147"}.fa-level-up:before{content:"\f148"}.fa-level-down:before{content:"\f149"}.fa-check-square:before{content:"\f14a"}.fa-pencil-square:before{content:"\f14b"}.fa-external-link-square:before{content:"\f14c"}.fa-share-square:before{content:"\f14d"}.fa-compass:before{content:"\f14e"}.fa-toggle-down:before,.fa-caret-square-o-down:before{content:"\f150"}.fa-toggle-up:before,.fa-caret-square-o-up:before{content:"\f151"}.fa-toggle-right:before,.fa-caret-square-o-right:before{content:"\f152"}.fa-euro:before,.fa-eur:before{content:"\f153"}.fa-gbp:before{content:"\f154"}.fa-dollar:before,.fa-usd:before{content:"\f155"}.fa-rupee:before,.fa-inr:before{content:"\f156"}.fa-cny:before,.fa-rmb:before,.fa-yen:before,.fa-jpy:before{content:"\f157"}.fa-ruble:before,.fa-rouble:before,.fa-rub:before{content:"\f158"}.fa-won:before,.fa-krw:before{content:"\f159"}.fa-bitcoin:before,.fa-btc:before{content:"\f15a"}.fa-file:before{content:"\f15b"}.fa-file-text:before{content:"\f15c"}.fa-sort-alpha-asc:before{content:"\f15d"}.fa-sort-alpha-desc:before{content:"\f15e"}.fa-sort-amount-asc:before{content:"\f160"}.fa-sort-amount-desc:before{content:"\f161"}.fa-sort-numeric-asc:before{content:"\f162"}.fa-sort-numeric-desc:before{content:"\f163"}.fa-thumbs-up:before{content:"\f164"}.fa-thumbs-down:before{content:"\f165"}.fa-youtube-square:before{content:"\f166"}.fa-youtube:before{content:"\f167"}.fa-xing:before{content:"\f168"}.fa-xing-square:before{content:"\f169"}.fa-youtube-play:before{content:"\f16a"}.fa-dropbox:before{content:"\f16b"}.fa-stack-overflow:before{content:"\f16c"}.fa-instagram:before{content:"\f16d"}.fa-flickr:before{content:"\f16e"}.fa-adn:before{content:"\f170"}.fa-bitbucket:before{content:"\f171"}.fa-bitbucket-square:before{content:"\f172"}.fa-tumblr:before{content:"\f173"}.fa-tumblr-square:before{content:"\f174"}.fa-long-arrow-down:before{content:"\f175"}.fa-long-arrow-up:before{content:"\f176"}.fa-long-arrow-left:before{content:"\f177"}.fa-long-arrow-right:before{content:"\f178"}.fa-apple:before{content:"\f179"}.fa-windows:before{content:"\f17a"}.fa-android:before{content:"\f17b"}.fa-linux:before{content:"\f17c"}.fa-dribbble:before{content:"\f17d"}.fa-skype:before{content:"\f17e"}.fa-foursquare:before{content:"\f180"}.fa-trello:before{content:"\f181"}.fa-female:before{content:"\f182"}.fa-male:before{content:"\f183"}.fa-gittip:before{content:"\f184"}.fa-sun-o:before{content:"\f185"}.fa-moon-o:before{content:"\f186"}.fa-archive:before{content:"\f187"}.fa-bug:before{content:"\f188"}.fa-vk:before{content:"\f189"}.fa-weibo:before{content:"\f18a"}.fa-renren:before{content:"\f18b"}.fa-pagelines:before{content:"\f18c"}.fa-stack-exchange:before{content:"\f18d"}.fa-arrow-circle-o-right:before{content:"\f18e"}.fa-arrow-circle-o-left:before{content:"\f190"}.fa-toggle-left:before,.fa-caret-square-o-left:before{content:"\f191"}.fa-dot-circle-o:before{content:"\f192"}.fa-wheelchair:before{content:"\f193"}.fa-vimeo-square:before{content:"\f194"}.fa-turkish-lira:before,.fa-try:before{content:"\f195"}.fa-plus-square-o:before{content:"\f196"}.fa-space-shuttle:before{content:"\f197"}.fa-slack:before{content:"\f198"}.fa-envelope-square:before{content:"\f199"}.fa-wordpress:before{content:"\f19a"}.fa-openid:before{content:"\f19b"}.fa-institution:before,.fa-bank:before,.fa-university:before{content:"\f19c"}.fa-mortar-board:before,.fa-graduation-cap:before{content:"\f19d"}.fa-yahoo:before{content:"\f19e"}.fa-google:before{content:"\f1a0"}.fa-reddit:before{content:"\f1a1"}.fa-reddit-square:before{content:"\f1a2"}.fa-stumbleupon-circle:before{content:"\f1a3"}.fa-stumbleupon:before{content:"\f1a4"}.fa-delicious:before{content:"\f1a5"}.fa-digg:before{content:"\f1a6"}.fa-pied-piper-square:before,.fa-pied-piper:before{content:"\f1a7"}.fa-pied-piper-alt:before{content:"\f1a8"}.fa-drupal:before{content:"\f1a9"}.fa-joomla:before{content:"\f1aa"}.fa-language:before{content:"\f1ab"}.fa-fax:before{content:"\f1ac"}.fa-building:before{content:"\f1ad"}.fa-child:before{content:"\f1ae"}.fa-paw:before{content:"\f1b0"}.fa-spoon:before{content:"\f1b1"}.fa-cube:before{content:"\f1b2"}.fa-cubes:before{content:"\f1b3"}.fa-behance:before{content:"\f1b4"}.fa-behance-square:before{content:"\f1b5"}.fa-steam:before{content:"\f1b6"}.fa-steam-square:before{content:"\f1b7"}.fa-recycle:before{content:"\f1b8"}.fa-automobile:before,.fa-car:before{content:"\f1b9"}.fa-cab:before,.fa-taxi:before{content:"\f1ba"}.fa-tree:before{content:"\f1bb"}.fa-spotify:before{content:"\f1bc"}.fa-deviantart:before{content:"\f1bd"}.fa-soundcloud:before{content:"\f1be"}.fa-database:before{content:"\f1c0"}.fa-file-pdf-o:before{content:"\f1c1"}.fa-file-word-o:before{content:"\f1c2"}.fa-file-excel-o:before{content:"\f1c3"}.fa-file-powerpoint-o:before{content:"\f1c4"}.fa-file-photo-o:before,.fa-file-picture-o:before,.fa-file-image-o:before{content:"\f1c5"}.fa-file-zip-o:before,.fa-file-archive-o:before{content:"\f1c6"}.fa-file-sound-o:before,.fa-file-audio-o:before{content:"\f1c7"}.fa-file-movie-o:before,.fa-file-video-o:before{content:"\f1c8"}.fa-file-code-o:before{content:"\f1c9"}.fa-vine:before{content:"\f1ca"}.fa-codepen:before{content:"\f1cb"}.fa-jsfiddle:before{content:"\f1cc"}.fa-life-bouy:before,.fa-life-saver:before,.fa-support:before,.fa-life-ring:before{content:"\f1cd"}.fa-circle-o-notch:before{content:"\f1ce"}.fa-ra:before,.fa-rebel:before{content:"\f1d0"}.fa-ge:before,.fa-empire:before{content:"\f1d1"}.fa-git-square:before{content:"\f1d2"}.fa-git:before{content:"\f1d3"}.fa-hacker-news:before{content:"\f1d4"}.fa-tencent-weibo:before{content:"\f1d5"}.fa-qq:before{content:"\f1d6"}.fa-wechat:before,.fa-weixin:before{content:"\f1d7"}.fa-send:before,.fa-paper-plane:before{content:"\f1d8"}.fa-send-o:before,.fa-paper-plane-o:before{content:"\f1d9"}.fa-history:before{content:"\f1da"}.fa-circle-thin:before{content:"\f1db"}.fa-header:before{content:"\f1dc"}.fa-paragraph:before{content:"\f1dd"}.fa-sliders:before{content:"\f1de"}.fa-share-alt:before{content:"\f1e0"}.fa-share-alt-square:before{content:"\f1e1"}.fa-bomb:before{content:"\f1e2"}&lt;/style&gt; &lt;script src="/js/jquery-1.8.3.min.js"&gt;&lt;/script&gt; &lt;script src="/js/prefixfree.min.js"&gt;&lt;/script&gt; &lt;script src="/js/common.js"&gt;&lt;/script&gt; &lt;!--//스크롤--&gt; &lt;script src="/js/scrollIt.js"&gt;&lt;/script&gt; &lt;!--text animation--&gt; &lt;script src="/js/jquery.fittext.js"&gt;&lt;/script&gt; &lt;script src="/js/jquery.lettering.js"&gt;&lt;/script&gt; &lt;script src="/js/jquery.textillate.js"&gt;&lt;/script&gt; &lt;style media="" data-href="/css/text_animation.css"&gt;/*# sourceURL=/css/text_animation.css */ /*@ sourceURL=/css/text_animation.css */ @charset "UTF-8"; /* Animate.css - http://daneden.me/animate Licensed under the ☺ license (http://licence.visualidiot.com/) Copyright (c) 2012 Dan Eden Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ body { /* Addresses a small issue in webkit: http://bit.ly/NEdoDq */ -webkit-backface-visibility: hidden; } .animated { -webkit-animation-duration: 1s;    -moz-animation-duration: 1s;      -o-animation-duration: 1s;         animation-duration: 1s; -webkit-animation-fill-mode: both;    -moz-animation-fill-mode: both;      -o-animation-fill-mode: both;         animation-fill-mode: both; } .animated.hinge { -webkit-animation-duration: 2s;    -moz-animation-duration: 2s;      -o-animation-duration: 2s;         animation-duration: 2s; } @-webkit-keyframes flash { 0%, 50%, 100% {opacity: 1;} 25%, 75% {opacity: 0;} } @-moz-keyframes flash { 0%, 50%, 100% {opacity: 1;} 25%, 75% {opacity: 0;} } @-o-keyframes flash { 0%, 50%, 100% {opacity: 1;} 25%, 75% {opacity: 0;} } @keyframes flash { 0%, 50%, 100% {opacity: 1;} 25%, 75% {opacity: 0;} } .flash { -webkit-animation-name: flash; -moz-animation-name: flash; -o-animation-name: flash; animation-name: flash; } @-webkit-keyframes shake { 0%, 100% {-webkit-transform: translateX(0);} 10%, 30%, 50%, 70%, 90% {-webkit-transform: translateX(-10px);} 20%, 40%, 60%, 80% {-webkit-transform: translateX(10px);} } @-moz-keyframes shake { 0%, 100% {-moz-transform: translateX(0);} 10%, 30%, 50%, 70%, 90% {-moz-transform: translateX(-10px);} 20%, 40%, 60%, 80% {-moz-transform: translateX(10px);} } @-o-keyframes shake { 0%, 100% {-o-transform: translateX(0);} 10%, 30%, 50%, 70%, 90% {-o-transform: translateX(-10px);} 20%, 40%, 60%, 80% {-o-transform: translateX(10px);} } @keyframes shake { 0%, 100% {transform: translateX(0);} 10%, 30%, 50%, 70%, 90% {transform: translateX(-10px);} 20%, 40%, 60%, 80% {transform: translateX(10px);} } .shake { -webkit-animation-name: shake; -moz-animation-name: shake; -o-animation-name: shake; animation-name: shake; } @-webkit-keyframes bounce { 0%, 20%, 50%, 80%, 100% {-webkit-transform: translateY(0);} 40% {-webkit-transform: translateY(-30px);} 60% {-webkit-transform: translateY(-15px);} } @-moz-keyframes bounce { 0%, 20%, 50%, 80%, 100% {-moz-transform: translateY(0);} 40% {-moz-transform: translateY(-30px);} 60% {-moz-transform: translateY(-15px);} } @-o-keyframes bounce { 0%, 20%, 50%, 80%, 100% {-o-transform: translateY(0);} 40% {-o-transform: translateY(-30px);} 60% {-o-transform: translateY(-15px);} } @keyframes bounce { 0%, 20%, 50%, 80%, 100% {transform: translateY(0);} 40% {transform: translateY(-30px);} 60% {transform: translateY(-15px);} } .bounce { -webkit-animation-name: bounce; -moz-animation-name: bounce; -o-animation-name: bounce; animation-name: bounce; } @-webkit-keyframes tada { 0% {-webkit-transform: scale(1);} 10%, 20% {-webkit-transform: scale(0.9) rotate(-3deg);} 30%, 50%, 70%, 90% {-webkit-transform: scale(1.1) rotate(3deg);} 40%, 60%, 80% {-webkit-transform: scale(1.1) rotate(-3deg);} 100% {-webkit-transform: scale(1) rotate(0);} } @-moz-keyframes tada { 0% {-moz-transform: scale(1);} 10%, 20% {-moz-transform: scale(0.9) rotate(-3deg);} 30%, 50%, 70%, 90% {-moz-transform: scale(1.1) rotate(3deg);} 40%, 60%, 80% {-moz-transform: scale(1.1) rotate(-3deg);} 100% {-moz-transform: scale(1) rotate(0);} } @-o-keyframes tada { 0% {-o-transform: scale(1);} 10%, 20% {-o-transform: scale(0.9) rotate(-3deg);} 30%, 50%, 70%, 90% {-o-transform: scale(1.1) rotate(3deg);} 40%, 60%, 80% {-o-transform: scale(1.1) rotate(-3deg);} 100% {-o-transform: scale(1) rotate(0);} } @keyframes tada { 0% {transform: scale(1);} 10%, 20% {transform: scale(0.9) rotate(-3deg);} 30%, 50%, 70%, 90% {transform: scale(1.1) rotate(3deg);} 40%, 60%, 80% {transform: scale(1.1) rotate(-3deg);} 100% {transform: scale(1) rotate(0);} } .tada { -webkit-animation-name: tada; -moz-animation-name: tada; -o-animation-name: tada; animation-name: tada; } @-webkit-keyframes swing { 20%, 40%, 60%, 80%, 100% { -webkit-transform-origin: top center; } 20% { -webkit-transform: rotate(15deg); } 40% { -webkit-transform: rotate(-10deg); } 60% { -webkit-transform: rotate(5deg); } 80% { -webkit-transform: rotate(-5deg); } 100% { -webkit-transform: rotate(0deg); } } @-moz-keyframes swing { 20% { -moz-transform: rotate(15deg); } 40% { -moz-transform: rotate(-10deg); } 60% { -moz-transform: rotate(5deg); } 80% { -moz-transform: rotate(-5deg); } 100% { -moz-transform: rotate(0deg); } } @-o-keyframes swing { 20% { -o-transform: rotate(15deg); } 40% { -o-transform: rotate(-10deg); } 60% { -o-transform: rotate(5deg); } 80% { -o-transform: rotate(-5deg); } 100% { -o-transform: rotate(0deg); } } @keyframes swing { 20% { transform: rotate(15deg); } 40% { transform: rotate(-10deg); } 60% { transform: rotate(5deg); } 80% { transform: rotate(-5deg); } 100% { transform: rotate(0deg); } } .swing { -webkit-transform-origin: top center; -moz-transform-origin: top center; -o-transform-origin: top center; transform-origin: top center; -webkit-animation-name: swing; -moz-animation-name: swing; -o-animation-name: swing; animation-name: swing; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes wobble {   0% { -webkit-transform: translateX(0%); }   15% { -webkit-transform: translateX(-25%) rotate(-5deg); }   30% { -webkit-transform: translateX(20%) rotate(3deg); }   45% { -webkit-transform: translateX(-15%) rotate(-3deg); }   60% { -webkit-transform: translateX(10%) rotate(2deg); }   75% { -webkit-transform: translateX(-5%) rotate(-1deg); }   100% { -webkit-transform: translateX(0%); } } @-moz-keyframes wobble {   0% { -moz-transform: translateX(0%); }   15% { -moz-transform: translateX(-25%) rotate(-5deg); }   30% { -moz-transform: translateX(20%) rotate(3deg); }   45% { -moz-transform: translateX(-15%) rotate(-3deg); }   60% { -moz-transform: translateX(10%) rotate(2deg); }   75% { -moz-transform: translateX(-5%) rotate(-1deg); }   100% { -moz-transform: translateX(0%); } } @-o-keyframes wobble {   0% { -o-transform: translateX(0%); }   15% { -o-transform: translateX(-25%) rotate(-5deg); }   30% { -o-transform: translateX(20%) rotate(3deg); }   45% { -o-transform: translateX(-15%) rotate(-3deg); }   60% { -o-transform: translateX(10%) rotate(2deg); }   75% { -o-transform: translateX(-5%) rotate(-1deg); }   100% { -o-transform: translateX(0%); } } @keyframes wobble {   0% { transform: translateX(0%); }   15% { transform: translateX(-25%) rotate(-5deg); }   30% { transform: translateX(20%) rotate(3deg); }   45% { transform: translateX(-15%) rotate(-3deg); }   60% { transform: translateX(10%) rotate(2deg); }   75% { transform: translateX(-5%) rotate(-1deg); }   100% { transform: translateX(0%); } } .wobble { -webkit-animation-name: wobble; -moz-animation-name: wobble; -o-animation-name: wobble; animation-name: wobble; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes pulse {     0% { -webkit-transform: scale(1); } 50% { -webkit-transform: scale(1.1); }     100% { -webkit-transform: scale(1); } } @-moz-keyframes pulse {     0% { -moz-transform: scale(1); } 50% { -moz-transform: scale(1.1); }     100% { -moz-transform: scale(1); } } @-o-keyframes pulse {     0% { -o-transform: scale(1); } 50% { -o-transform: scale(1.1); }     100% { -o-transform: scale(1); } } @keyframes pulse {     0% { transform: scale(1); } 50% { transform: scale(1.1); }     100% { transform: scale(1); } } .pulse { -webkit-animation-name: pulse; -moz-animation-name: pulse; -o-animation-name: pulse; animation-name: pulse; } @-webkit-keyframes flip { 0% { -webkit-transform: perspective(400px) rotateY(0); -webkit-animation-timing-function: ease-out; } 40% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg); -webkit-animation-timing-function: ease-out; } 50% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -webkit-animation-timing-function: ease-in; } 80% { -webkit-transform: perspective(400px) rotateY(360deg) scale(.95); -webkit-animation-timing-function: ease-in; } 100% { -webkit-transform: perspective(400px) scale(1); -webkit-animation-timing-function: ease-in; } } @-moz-keyframes flip { 0% { -moz-transform: perspective(400px) rotateY(0); -moz-animation-timing-function: ease-out; } 40% { -moz-transform: perspective(400px) translateZ(150px) rotateY(170deg); -moz-animation-timing-function: ease-out; } 50% { -moz-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -moz-animation-timing-function: ease-in; } 80% { -moz-transform: perspective(400px) rotateY(360deg) scale(.95); -moz-animation-timing-function: ease-in; } 100% { -moz-transform: perspective(400px) scale(1); -moz-animation-timing-function: ease-in; } } @-o-keyframes flip { 0% { -o-transform: perspective(400px) rotateY(0); -o-animation-timing-function: ease-out; } 40% { -o-transform: perspective(400px) translateZ(150px) rotateY(170deg); -o-animation-timing-function: ease-out; } 50% { -o-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -o-animation-timing-function: ease-in; } 80% { -o-transform: perspective(400px) rotateY(360deg) scale(.95); -o-animation-timing-function: ease-in; } 100% { -o-transform: perspective(400px) scale(1); -o-animation-timing-function: ease-in; } } @keyframes flip { 0% { transform: perspective(400px) rotateY(0); animation-timing-function: ease-out; } 40% { transform: perspective(400px) translateZ(150px) rotateY(170deg); animation-timing-function: ease-out; } 50% { transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); animation-timing-function: ease-in; } 80% { transform: perspective(400px) rotateY(360deg) scale(.95); animation-timing-function: ease-in; } 100% { transform: perspective(400px) scale(1); animation-timing-function: ease-in; } } .flip { -webkit-backface-visibility: visible !important; -webkit-animation-name: flip; -moz-backface-visibility: visible !important; -moz-animation-name: flip; -o-backface-visibility: visible !important; -o-animation-name: flip; backface-visibility: visible !important; animation-name: flip; } @-webkit-keyframes flipInX {     0% {         -webkit-transform: perspective(400px) rotateX(90deg);         opacity: 0;     }          40% {         -webkit-transform: perspective(400px) rotateX(-10deg);     }          70% {         -webkit-transform: perspective(400px) rotateX(10deg);     }          100% {         -webkit-transform: perspective(400px) rotateX(0deg);         opacity: 1;     } } @-moz-keyframes flipInX {     0% {         -moz-transform: perspective(400px) rotateX(90deg);         opacity: 0;     }          40% {         -moz-transform: perspective(400px) rotateX(-10deg);     }          70% {         -moz-transform: perspective(400px) rotateX(10deg);     }          100% {         -moz-transform: perspective(400px) rotateX(0deg);         opacity: 1;     } } @-o-keyframes flipInX {     0% {         -o-transform: perspective(400px) rotateX(90deg);         opacity: 0;     }          40% {         -o-transform: perspective(400px) rotateX(-10deg);     }          70% {         -o-transform: perspective(400px) rotateX(10deg);     }          100% {         -o-transform: perspective(400px) rotateX(0deg);         opacity: 1;     } } @keyframes flipInX {     0% {         transform: perspective(400px) rotateX(90deg);         opacity: 0;     }          40% {         transform: perspective(400px) rotateX(-10deg);     }          70% {         transform: perspective(400px) rotateX(10deg);     }          100% {         transform: perspective(400px) rotateX(0deg);         opacity: 1;     } } .flipInX { -webkit-backface-visibility: visible !important; -webkit-animation-name: flipInX; -moz-backface-visibility: visible !important; -moz-animation-name: flipInX; -o-backface-visibility: visible !important; -o-animation-name: flipInX; backface-visibility: visible !important; animation-name: flipInX; } @-webkit-keyframes flipOutX {     0% {         -webkit-transform: perspective(400px) rotateX(0deg);         opacity: 1;     } 100% {         -webkit-transform: perspective(400px) rotateX(90deg);         opacity: 0;     } } @-moz-keyframes flipOutX {     0% {         -moz-transform: perspective(400px) rotateX(0deg);         opacity: 1;     } 100% {         -moz-transform: perspective(400px) rotateX(90deg);         opacity: 0;     } } @-o-keyframes flipOutX {     0% {         -o-transform: perspective(400px) rotateX(0deg);         opacity: 1;     } 100% {         -o-transform: perspective(400px) rotateX(90deg);         opacity: 0;     } } @keyframes flipOutX {     0% {         transform: perspective(400px) rotateX(0deg);         opacity: 1;     } 100% {         transform: perspective(400px) rotateX(90deg);         opacity: 0;     } } .flipOutX { -webkit-animation-name: flipOutX; -webkit-backface-visibility: visible !important; -moz-animation-name: flipOutX; -moz-backface-visibility: visible !important; -o-animation-name: flipOutX; -o-backface-visibility: visible !important; animation-name: flipOutX; backface-visibility: visible !important; } @-webkit-keyframes flipInY {     0% {         -webkit-transform: perspective(400px) rotateY(90deg);         opacity: 0;     }          40% {         -webkit-transform: perspective(400px) rotateY(-10deg);     }          70% {         -webkit-transform: perspective(400px) rotateY(10deg);     }          100% {         -webkit-transform: perspective(400px) rotateY(0deg);         opacity: 1;     } } @-moz-keyframes flipInY {     0% {         -moz-transform: perspective(400px) rotateY(90deg);         opacity: 0;     }          40% {         -moz-transform: perspective(400px) rotateY(-10deg);     }          70% {         -moz-transform: perspective(400px) rotateY(10deg);     }          100% {         -moz-transform: perspective(400px) rotateY(0deg);         opacity: 1;     } } @-o-keyframes flipInY {     0% {         -o-transform: perspective(400px) rotateY(90deg);         opacity: 0;     }          40% {         -o-transform: perspective(400px) rotateY(-10deg);     }          70% {         -o-transform: perspective(400px) rotateY(10deg);     }          100% {         -o-transform: perspective(400px) rotateY(0deg);         opacity: 1;     } } @keyframes flipInY {     0% {         transform: perspective(400px) rotateY(90deg);         opacity: 0;     }          40% {         transform: perspective(400px) rotateY(-10deg);     }          70% {         transform: perspective(400px) rotateY(10deg);     }          100% {         transform: perspective(400px) rotateY(0deg);         opacity: 1;     } } .flipInY { -webkit-backface-visibility: visible !important; -webkit-animation-name: flipInY; -moz-backface-visibility: visible !important; -moz-animation-name: flipInY; -o-backface-visibility: visible !important; -o-animation-name: flipInY; backface-visibility: visible !important; animation-name: flipInY; } @-webkit-keyframes flipOutY {     0% {         -webkit-transform: perspective(400px) rotateY(0deg);         opacity: 1;     } 100% {         -webkit-transform: perspective(400px) rotateY(90deg);         opacity: 0;     } } @-moz-keyframes flipOutY {     0% {         -moz-transform: perspective(400px) rotateY(0deg);         opacity: 1;     } 100% {         -moz-transform: perspective(400px) rotateY(90deg);         opacity: 0;     } } @-o-keyframes flipOutY {     0% {         -o-transform: perspective(400px) rotateY(0deg);         opacity: 1;     } 100% {         -o-transform: perspective(400px) rotateY(90deg);         opacity: 0;     } } @keyframes flipOutY {     0% {         transform: perspective(400px) rotateY(0deg);         opacity: 1;     } 100% {         transform: perspective(400px) rotateY(90deg);         opacity: 0;     } } .flipOutY { -webkit-backface-visibility: visible !important; -webkit-animation-name: flipOutY; -moz-backface-visibility: visible !important; -moz-animation-name: flipOutY; -o-backface-visibility: visible !important; -o-animation-name: flipOutY; backface-visibility: visible !important; animation-name: flipOutY; } @-webkit-keyframes fadeIn { 0% {opacity: 0;} 100% {opacity: 1;} } @-moz-keyframes fadeIn { 0% {opacity: 0;} 100% {opacity: 1;} } @-o-keyframes fadeIn { 0% {opacity: 0;} 100% {opacity: 1;} } @keyframes fadeIn { 0% {opacity: 0;} 100% {opacity: 1;} } .fadeIn { -webkit-animation-name: fadeIn; -moz-animation-name: fadeIn; -o-animation-name: fadeIn; animation-name: fadeIn; } @-webkit-keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translateY(20px); } 100% { opacity: 1; -webkit-transform: translateY(0); } } @-moz-keyframes fadeInUp { 0% { opacity: 0; -moz-transform: translateY(20px); } 100% { opacity: 1; -moz-transform: translateY(0); } } @-o-keyframes fadeInUp { 0% { opacity: 0; -o-transform: translateY(20px); } 100% { opacity: 1; -o-transform: translateY(0); } } @keyframes fadeInUp { 0% { opacity: 0; transform: translateY(20px); } 100% { opacity: 1; transform: translateY(0); } } .fadeInUp { -webkit-animation-name: fadeInUp; -moz-animation-name: fadeInUp; -o-animation-name: fadeInUp; animation-name: fadeInUp; } @-webkit-keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translateY(-20px); } 100% { opacity: 1; -webkit-transform: translateY(0); } } @-moz-keyframes fadeInDown { 0% { opacity: 0; -moz-transform: translateY(-20px); } 100% { opacity: 1; -moz-transform: translateY(0); } } @-o-keyframes fadeInDown { 0% { opacity: 0; -o-transform: translateY(-20px); } 100% { opacity: 1; -o-transform: translateY(0); } } @keyframes fadeInDown { 0% { opacity: 0; transform: translateY(-20px); } 100% { opacity: 1; transform: translateY(0); } } .fadeInDown { -webkit-animation-name: fadeInDown; -moz-animation-name: fadeInDown; -o-animation-name: fadeInDown; animation-name: fadeInDown; } @-webkit-keyframes fadeInLeft { 0% { opacity: 0; -webkit-transform: translateX(-20px); } 100% { opacity: 1; -webkit-transform: translateX(0); } } @-moz-keyframes fadeInLeft { 0% { opacity: 0; -moz-transform: translateX(-20px); } 100% { opacity: 1; -moz-transform: translateX(0); } } @-o-keyframes fadeInLeft { 0% { opacity: 0; -o-transform: translateX(-20px); } 100% { opacity: 1; -o-transform: translateX(0); } } @keyframes fadeInLeft { 0% { opacity: 0; transform: translateX(-20px); } 100% { opacity: 1; transform: translateX(0); } } .fadeInLeft { -webkit-animation-name: fadeInLeft; -moz-animation-name: fadeInLeft; -o-animation-name: fadeInLeft; animation-name: fadeInLeft; } @-webkit-keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translateX(20px); } 100% { opacity: 1; -webkit-transform: translateX(0); } } @-moz-keyframes fadeInRight { 0% { opacity: 0; -moz-transform: translateX(20px); } 100% { opacity: 1; -moz-transform: translateX(0); } } @-o-keyframes fadeInRight { 0% { opacity: 0; -o-transform: translateX(20px); } 100% { opacity: 1; -o-transform: translateX(0); } } @keyframes fadeInRight { 0% { opacity: 0; transform: translateX(20px); } 100% { opacity: 1; transform: translateX(0); } } .fadeInRight { -webkit-animation-name: fadeInRight; -moz-animation-name: fadeInRight; -o-animation-name: fadeInRight; animation-name: fadeInRight; } @-webkit-keyframes fadeInUpBig { 0% { opacity: 0; -webkit-transform: translateY(2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); } } @-moz-keyframes fadeInUpBig { 0% { opacity: 0; -moz-transform: translateY(2000px); } 100% { opacity: 1; -moz-transform: translateY(0); } } @-o-keyframes fadeInUpBig { 0% { opacity: 0; -o-transform: translateY(2000px); } 100% { opacity: 1; -o-transform: translateY(0); } } @keyframes fadeInUpBig { 0% { opacity: 0; transform: translateY(2000px); } 100% { opacity: 1; transform: translateY(0); } } .fadeInUpBig { -webkit-animation-name: fadeInUpBig; -moz-animation-name: fadeInUpBig; -o-animation-name: fadeInUpBig; animation-name: fadeInUpBig; } @-webkit-keyframes fadeInDownBig { 0% { opacity: 0; -webkit-transform: translateY(-2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); } } @-moz-keyframes fadeInDownBig { 0% { opacity: 0; -moz-transform: translateY(-2000px); } 100% { opacity: 1; -moz-transform: translateY(0); } } @-o-keyframes fadeInDownBig { 0% { opacity: 0; -o-transform: translateY(-2000px); } 100% { opacity: 1; -o-transform: translateY(0); } } @keyframes fadeInDownBig { 0% { opacity: 0; transform: translateY(-2000px); } 100% { opacity: 1; transform: translateY(0); } } .fadeInDownBig { -webkit-animation-name: fadeInDownBig; -moz-animation-name: fadeInDownBig; -o-animation-name: fadeInDownBig; animation-name: fadeInDownBig; } @-webkit-keyframes fadeInLeftBig { 0% { opacity: 0; -webkit-transform: translateX(-2000px); } 100% { opacity: 1; -webkit-transform: translateX(0); } } @-moz-keyframes fadeInLeftBig { 0% { opacity: 0; -moz-transform: translateX(-2000px); } 100% { opacity: 1; -moz-transform: translateX(0); } } @-o-keyframes fadeInLeftBig { 0% { opacity: 0; -o-transform: translateX(-2000px); } 100% { opacity: 1; -o-transform: translateX(0); } } @keyframes fadeInLeftBig { 0% { opacity: 0; transform: translateX(-2000px); } 100% { opacity: 1; transform: translateX(0); } } .fadeInLeftBig { -webkit-animation-name: fadeInLeftBig; -moz-animation-name: fadeInLeftBig; -o-animation-name: fadeInLeftBig; animation-name: fadeInLeftBig; } @-webkit-keyframes fadeInRightBig { 0% { opacity: 0; -webkit-transform: translateX(2000px); } 100% { opacity: 1; -webkit-transform: translateX(0); } } @-moz-keyframes fadeInRightBig { 0% { opacity: 0; -moz-transform: translateX(2000px); } 100% { opacity: 1; -moz-transform: translateX(0); } } @-o-keyframes fadeInRightBig { 0% { opacity: 0; -o-transform: translateX(2000px); } 100% { opacity: 1; -o-transform: translateX(0); } } @keyframes fadeInRightBig { 0% { opacity: 0; transform: translateX(2000px); } 100% { opacity: 1; transform: translateX(0); } } .fadeInRightBig { -webkit-animation-name: fadeInRightBig; -moz-animation-name: fadeInRightBig; -o-animation-name: fadeInRightBig; animation-name: fadeInRightBig; } @-webkit-keyframes fadeOut { 0% {opacity: 1;} 100% {opacity: 0;} } @-moz-keyframes fadeOut { 0% {opacity: 1;} 100% {opacity: 0;} } @-o-keyframes fadeOut { 0% {opacity: 1;} 100% {opacity: 0;} } @keyframes fadeOut { 0% {opacity: 1;} 100% {opacity: 0;} } .fadeOut { -webkit-animation-name: fadeOut; -moz-animation-name: fadeOut; -o-animation-name: fadeOut; animation-name: fadeOut; } @-webkit-keyframes fadeOutUp { 0% { opacity: 1; -webkit-transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-20px); } } @-moz-keyframes fadeOutUp { 0% { opacity: 1; -moz-transform: translateY(0); } 100% { opacity: 0; -moz-transform: translateY(-20px); } } @-o-keyframes fadeOutUp { 0% { opacity: 1; -o-transform: translateY(0); } 100% { opacity: 0; -o-transform: translateY(-20px); } } @keyframes fadeOutUp { 0% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; transform: translateY(-20px); } } .fadeOutUp { -webkit-animation-name: fadeOutUp; -moz-animation-name: fadeOutUp; -o-animation-name: fadeOutUp; animation-name: fadeOutUp; } @-webkit-keyframes fadeOutDown { 0% { opacity: 1; -webkit-transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(20px); } } @-moz-keyframes fadeOutDown { 0% { opacity: 1; -moz-transform: translateY(0); } 100% { opacity: 0; -moz-transform: translateY(20px); } } @-o-keyframes fadeOutDown { 0% { opacity: 1; -o-transform: translateY(0); } 100% { opacity: 0; -o-transform: translateY(20px); } } @keyframes fadeOutDown { 0% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; transform: translateY(20px); } } .fadeOutDown { -webkit-animation-name: fadeOutDown; -moz-animation-name: fadeOutDown; -o-animation-name: fadeOutDown; animation-name: fadeOutDown; } @-webkit-keyframes fadeOutLeft { 0% { opacity: 1; -webkit-transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-20px); } } @-moz-keyframes fadeOutLeft { 0% { opacity: 1; -moz-transform: translateX(0); } 100% { opacity: 0; -moz-transform: translateX(-20px); } } @-o-keyframes fadeOutLeft { 0% { opacity: 1; -o-transform: translateX(0); } 100% { opacity: 0; -o-transform: translateX(-20px); } } @keyframes fadeOutLeft { 0% { opacity: 1; transform: translateX(0); } 100% { opacity: 0; transform: translateX(-20px); } } .fadeOutLeft { -webkit-animation-name: fadeOutLeft; -moz-animation-name: fadeOutLeft; -o-animation-name: fadeOutLeft; animation-name: fadeOutLeft; } @-webkit-keyframes fadeOutRight { 0% { opacity: 1; -webkit-transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(20px); } } @-moz-keyframes fadeOutRight { 0% { opacity: 1; -moz-transform: translateX(0); } 100% { opacity: 0; -moz-transform: translateX(20px); } } @-o-keyframes fadeOutRight { 0% { opacity: 1; -o-transform: translateX(0); } 100% { opacity: 0; -o-transform: translateX(20px); } } @keyframes fadeOutRight { 0% { opacity: 1; transform: translateX(0); } 100% { opacity: 0; transform: translateX(20px); } } .fadeOutRight { -webkit-animation-name: fadeOutRight; -moz-animation-name: fadeOutRight; -o-animation-name: fadeOutRight; animation-name: fadeOutRight; } @-webkit-keyframes fadeOutUpBig { 0% { opacity: 1; -webkit-transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); } } @-moz-keyframes fadeOutUpBig { 0% { opacity: 1; -moz-transform: translateY(0); } 100% { opacity: 0; -moz-transform: translateY(-2000px); } } @-o-keyframes fadeOutUpBig { 0% { opacity: 1; -o-transform: translateY(0); } 100% { opacity: 0; -o-transform: translateY(-2000px); } } @keyframes fadeOutUpBig { 0% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; transform: translateY(-2000px); } } .fadeOutUpBig { -webkit-animation-name: fadeOutUpBig; -moz-animation-name: fadeOutUpBig; -o-animation-name: fadeOutUpBig; animation-name: fadeOutUpBig; } @-webkit-keyframes fadeOutDownBig { 0% { opacity: 1; -webkit-transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(2000px); } } @-moz-keyframes fadeOutDownBig { 0% { opacity: 1; -moz-transform: translateY(0); } 100% { opacity: 0; -moz-transform: translateY(2000px); } } @-o-keyframes fadeOutDownBig { 0% { opacity: 1; -o-transform: translateY(0); } 100% { opacity: 0; -o-transform: translateY(2000px); } } @keyframes fadeOutDownBig { 0% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; transform: translateY(2000px); } } .fadeOutDownBig { -webkit-animation-name: fadeOutDownBig; -moz-animation-name: fadeOutDownBig; -o-animation-name: fadeOutDownBig; animation-name: fadeOutDownBig; } @-webkit-keyframes fadeOutLeftBig { 0% { opacity: 1; -webkit-transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); } } @-moz-keyframes fadeOutLeftBig { 0% { opacity: 1; -moz-transform: translateX(0); } 100% { opacity: 0; -moz-transform: translateX(-2000px); } } @-o-keyframes fadeOutLeftBig { 0% { opacity: 1; -o-transform: translateX(0); } 100% { opacity: 0; -o-transform: translateX(-2000px); } } @keyframes fadeOutLeftBig { 0% { opacity: 1; transform: translateX(0); } 100% { opacity: 0; transform: translateX(-2000px); } } .fadeOutLeftBig { -webkit-animation-name: fadeOutLeftBig; -moz-animation-name: fadeOutLeftBig; -o-animation-name: fadeOutLeftBig; animation-name: fadeOutLeftBig; } @-webkit-keyframes fadeOutRightBig { 0% { opacity: 1; -webkit-transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(2000px); } } @-moz-keyframes fadeOutRightBig { 0% { opacity: 1; -moz-transform: translateX(0); } 100% { opacity: 0; -moz-transform: translateX(2000px); } } @-o-keyframes fadeOutRightBig { 0% { opacity: 1; -o-transform: translateX(0); } 100% { opacity: 0; -o-transform: translateX(2000px); } } @keyframes fadeOutRightBig { 0% { opacity: 1; transform: translateX(0); } 100% { opacity: 0; transform: translateX(2000px); } } .fadeOutRightBig { -webkit-animation-name: fadeOutRightBig; -moz-animation-name: fadeOutRightBig; -o-animation-name: fadeOutRightBig; animation-name: fadeOutRightBig; } @-webkit-keyframes bounceIn { 0% { opacity: 0; -webkit-transform: scale(.3); } 50% { opacity: 1; -webkit-transform: scale(1.05); } 70% { -webkit-transform: scale(.9); } 100% { -webkit-transform: scale(1); } } @-moz-keyframes bounceIn { 0% { opacity: 0; -moz-transform: scale(.3); } 50% { opacity: 1; -moz-transform: scale(1.05); } 70% { -moz-transform: scale(.9); } 100% { -moz-transform: scale(1); } } @-o-keyframes bounceIn { 0% { opacity: 0; -o-transform: scale(.3); } 50% { opacity: 1; -o-transform: scale(1.05); } 70% { -o-transform: scale(.9); } 100% { -o-transform: scale(1); } } @keyframes bounceIn { 0% { opacity: 0; transform: scale(.3); } 50% { opacity: 1; transform: scale(1.05); } 70% { transform: scale(.9); } 100% { transform: scale(1); } } .bounceIn { -webkit-animation-name: bounceIn; -moz-animation-name: bounceIn; -o-animation-name: bounceIn; animation-name: bounceIn; } @-webkit-keyframes bounceInUp { 0% { opacity: 0; -webkit-transform: translateY(2000px); } 60% { opacity: 1; -webkit-transform: translateY(-30px); } 80% { -webkit-transform: translateY(10px); } 100% { -webkit-transform: translateY(0); } } @-moz-keyframes bounceInUp { 0% { opacity: 0; -moz-transform: translateY(2000px); } 60% { opacity: 1; -moz-transform: translateY(-30px); } 80% { -moz-transform: translateY(10px); } 100% { -moz-transform: translateY(0); } } @-o-keyframes bounceInUp { 0% { opacity: 0; -o-transform: translateY(2000px); } 60% { opacity: 1; -o-transform: translateY(-30px); } 80% { -o-transform: translateY(10px); } 100% { -o-transform: translateY(0); } } @keyframes bounceInUp { 0% { opacity: 0; transform: translateY(2000px); } 60% { opacity: 1; transform: translateY(-30px); } 80% { transform: translateY(10px); } 100% { transform: translateY(0); } } .bounceInUp { -webkit-animation-name: bounceInUp; -moz-animation-name: bounceInUp; -o-animation-name: bounceInUp; animation-name: bounceInUp; } @-webkit-keyframes bounceInDown { 0% { opacity: 0; -webkit-transform: translateY(-2000px); } 60% { opacity: 1; -webkit-transform: translateY(30px); } 80% { -webkit-transform: translateY(-10px); } 100% { -webkit-transform: translateY(0); } } @-moz-keyframes bounceInDown { 0% { opacity: 0; -moz-transform: translateY(-2000px); } 60% { opacity: 1; -moz-transform: translateY(30px); } 80% { -moz-transform: translateY(-10px); } 100% { -moz-transform: translateY(0); } } @-o-keyframes bounceInDown { 0% { opacity: 0; -o-transform: translateY(-2000px); } 60% { opacity: 1; -o-transform: translateY(30px); } 80% { -o-transform: translateY(-10px); } 100% { -o-transform: translateY(0); } } @keyframes bounceInDown { 0% { opacity: 0; transform: translateY(-2000px); } 60% { opacity: 1; transform: translateY(30px); } 80% { transform: translateY(-10px); } 100% { transform: translateY(0); } } .bounceInDown { -webkit-animation-name: bounceInDown; -moz-animation-name: bounceInDown; -o-animation-name: bounceInDown; animation-name: bounceInDown; } @-webkit-keyframes bounceInLeft { 0% { opacity: 0; -webkit-transform: translateX(-2000px); } 60% { opacity: 1; -webkit-transform: translateX(30px); } 80% { -webkit-transform: translateX(-10px); } 100% { -webkit-transform: translateX(0); } } @-moz-keyframes bounceInLeft { 0% { opacity: 0; -moz-transform: translateX(-2000px); } 60% { opacity: 1; -moz-transform: translateX(30px); } 80% { -moz-transform: translateX(-10px); } 100% { -moz-transform: translateX(0); } } @-o-keyframes bounceInLeft { 0% { opacity: 0; -o-transform: translateX(-2000px); } 60% { opacity: 1; -o-transform: translateX(30px); } 80% { -o-transform: translateX(-10px); } 100% { -o-transform: translateX(0); } } @keyframes bounceInLeft { 0% { opacity: 0; transform: translateX(-2000px); } 60% { opacity: 1; transform: translateX(30px); } 80% { transform: translateX(-10px); } 100% { transform: translateX(0); } } .bounceInLeft { -webkit-animation-name: bounceInLeft; -moz-animation-name: bounceInLeft; -o-animation-name: bounceInLeft; animation-name: bounceInLeft; } @-webkit-keyframes bounceInRight { 0% { opacity: 0; -webkit-transform: translateX(2000px); } 60% { opacity: 1; -webkit-transform: translateX(-30px); } 80% { -webkit-transform: translateX(10px); } 100% { -webkit-transform: translateX(0); } } @-moz-keyframes bounceInRight { 0% { opacity: 0; -moz-transform: translateX(2000px); } 60% { opacity: 1; -moz-transform: translateX(-30px); } 80% { -moz-transform: translateX(10px); } 100% { -moz-transform: translateX(0); } } @-o-keyframes bounceInRight { 0% { opacity: 0; -o-transform: translateX(2000px); } 60% { opacity: 1; -o-transform: translateX(-30px); } 80% { -o-transform: translateX(10px); } 100% { -o-transform: translateX(0); } } @keyframes bounceInRight { 0% { opacity: 0; transform: translateX(2000px); } 60% { opacity: 1; transform: translateX(-30px); } 80% { transform: translateX(10px); } 100% { transform: translateX(0); } } .bounceInRight { -webkit-animation-name: bounceInRight; -moz-animation-name: bounceInRight; -o-animation-name: bounceInRight; animation-name: bounceInRight; } @-webkit-keyframes bounceOut { 0% { -webkit-transform: scale(1); } 25% { -webkit-transform: scale(.95); } 50% { opacity: 1; -webkit-transform: scale(1.1); } 100% { opacity: 0; -webkit-transform: scale(.3); } } @-moz-keyframes bounceOut { 0% { -moz-transform: scale(1); } 25% { -moz-transform: scale(.95); } 50% { opacity: 1; -moz-transform: scale(1.1); } 100% { opacity: 0; -moz-transform: scale(.3); } } @-o-keyframes bounceOut { 0% { -o-transform: scale(1); } 25% { -o-transform: scale(.95); } 50% { opacity: 1; -o-transform: scale(1.1); } 100% { opacity: 0; -o-transform: scale(.3); } } @keyframes bounceOut { 0% { transform: scale(1); } 25% { transform: scale(.95); } 50% { opacity: 1; transform: scale(1.1); } 100% { opacity: 0; transform: scale(.3); } } .bounceOut { -webkit-animation-name: bounceOut; -moz-animation-name: bounceOut; -o-animation-name: bounceOut; animation-name: bounceOut; } @-webkit-keyframes bounceOutUp { 0% { -webkit-transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(20px); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); } } @-moz-keyframes bounceOutUp { 0% { -moz-transform: translateY(0); } 20% { opacity: 1; -moz-transform: translateY(20px); } 100% { opacity: 0; -moz-transform: translateY(-2000px); } } @-o-keyframes bounceOutUp { 0% { -o-transform: translateY(0); } 20% { opacity: 1; -o-transform: translateY(20px); } 100% { opacity: 0; -o-transform: translateY(-2000px); } } @keyframes bounceOutUp { 0% { transform: translateY(0); } 20% { opacity: 1; transform: translateY(20px); } 100% { opacity: 0; transform: translateY(-2000px); } } .bounceOutUp { -webkit-animation-name: bounceOutUp; -moz-animation-name: bounceOutUp; -o-animation-name: bounceOutUp; animation-name: bounceOutUp; } @-webkit-keyframes bounceOutDown { 0% { -webkit-transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(-20px); } 100% { opacity: 0; -webkit-transform: translateY(2000px); } } @-moz-keyframes bounceOutDown { 0% { -moz-transform: translateY(0); } 20% { opacity: 1; -moz-transform: translateY(-20px); } 100% { opacity: 0; -moz-transform: translateY(2000px); } } @-o-keyframes bounceOutDown { 0% { -o-transform: translateY(0); } 20% { opacity: 1; -o-transform: translateY(-20px); } 100% { opacity: 0; -o-transform: translateY(2000px); } } @keyframes bounceOutDown { 0% { transform: translateY(0); } 20% { opacity: 1; transform: translateY(-20px); } 100% { opacity: 0; transform: translateY(2000px); } } .bounceOutDown { -webkit-animation-name: bounceOutDown; -moz-animation-name: bounceOutDown; -o-animation-name: bounceOutDown; animation-name: bounceOutDown; } @-webkit-keyframes bounceOutLeft { 0% { -webkit-transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(20px); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); } } @-moz-keyframes bounceOutLeft { 0% { -moz-transform: translateX(0); } 20% { opacity: 1; -moz-transform: translateX(20px); } 100% { opacity: 0; -moz-transform: translateX(-2000px); } } @-o-keyframes bounceOutLeft { 0% { -o-transform: translateX(0); } 20% { opacity: 1; -o-transform: translateX(20px); } 100% { opacity: 0; -o-transform: translateX(-2000px); } } @keyframes bounceOutLeft { 0% { transform: translateX(0); } 20% { opacity: 1; transform: translateX(20px); } 100% { opacity: 0; transform: translateX(-2000px); } } .bounceOutLeft { -webkit-animation-name: bounceOutLeft; -moz-animation-name: bounceOutLeft; -o-animation-name: bounceOutLeft; animation-name: bounceOutLeft; } @-webkit-keyframes bounceOutRight { 0% { -webkit-transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(-20px); } 100% { opacity: 0; -webkit-transform: translateX(2000px); } } @-moz-keyframes bounceOutRight { 0% { -moz-transform: translateX(0); } 20% { opacity: 1; -moz-transform: translateX(-20px); } 100% { opacity: 0; -moz-transform: translateX(2000px); } } @-o-keyframes bounceOutRight { 0% { -o-transform: translateX(0); } 20% { opacity: 1; -o-transform: translateX(-20px); } 100% { opacity: 0; -o-transform: translateX(2000px); } } @keyframes bounceOutRight { 0% { transform: translateX(0); } 20% { opacity: 1; transform: translateX(-20px); } 100% { opacity: 0; transform: translateX(2000px); } } .bounceOutRight { -webkit-animation-name: bounceOutRight; -moz-animation-name: bounceOutRight; -o-animation-name: bounceOutRight; animation-name: bounceOutRight; } @-webkit-keyframes rotateIn { 0% { -webkit-transform-origin: center center; -webkit-transform: rotate(-200deg); opacity: 0; } 100% { -webkit-transform-origin: center center; -webkit-transform: rotate(0); opacity: 1; } } @-moz-keyframes rotateIn { 0% { -moz-transform-origin: center center; -moz-transform: rotate(-200deg); opacity: 0; } 100% { -moz-transform-origin: center center; -moz-transform: rotate(0); opacity: 1; } } @-o-keyframes rotateIn { 0% { -o-transform-origin: center center; -o-transform: rotate(-200deg); opacity: 0; } 100% { -o-transform-origin: center center; -o-transform: rotate(0); opacity: 1; } } @keyframes rotateIn { 0% { transform-origin: center center; transform: rotate(-200deg); opacity: 0; } 100% { transform-origin: center center; transform: rotate(0); opacity: 1; } } .rotateIn { -webkit-animation-name: rotateIn; -moz-animation-name: rotateIn; -o-animation-name: rotateIn; animation-name: rotateIn; } @-webkit-keyframes rotateInUpLeft { 0% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(90deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(0); opacity: 1; } } @-moz-keyframes rotateInUpLeft { 0% { -moz-transform-origin: left bottom; -moz-transform: rotate(90deg); opacity: 0; } 100% { -moz-transform-origin: left bottom; -moz-transform: rotate(0); opacity: 1; } } @-o-keyframes rotateInUpLeft { 0% { -o-transform-origin: left bottom; -o-transform: rotate(90deg); opacity: 0; } 100% { -o-transform-origin: left bottom; -o-transform: rotate(0); opacity: 1; } } @keyframes rotateInUpLeft { 0% { transform-origin: left bottom; transform: rotate(90deg); opacity: 0; } 100% { transform-origin: left bottom; transform: rotate(0); opacity: 1; } } .rotateInUpLeft { -webkit-animation-name: rotateInUpLeft; -moz-animation-name: rotateInUpLeft; -o-animation-name: rotateInUpLeft; animation-name: rotateInUpLeft; } @-webkit-keyframes rotateInDownLeft { 0% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(-90deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(0); opacity: 1; } } @-moz-keyframes rotateInDownLeft { 0% { -moz-transform-origin: left bottom; -moz-transform: rotate(-90deg); opacity: 0; } 100% { -moz-transform-origin: left bottom; -moz-transform: rotate(0); opacity: 1; } } @-o-keyframes rotateInDownLeft { 0% { -o-transform-origin: left bottom; -o-transform: rotate(-90deg); opacity: 0; } 100% { -o-transform-origin: left bottom; -o-transform: rotate(0); opacity: 1; } } @keyframes rotateInDownLeft { 0% { transform-origin: left bottom; transform: rotate(-90deg); opacity: 0; } 100% { transform-origin: left bottom; transform: rotate(0); opacity: 1; } } .rotateInDownLeft { -webkit-animation-name: rotateInDownLeft; -moz-animation-name: rotateInDownLeft; -o-animation-name: rotateInDownLeft; animation-name: rotateInDownLeft; } @-webkit-keyframes rotateInUpRight { 0% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(-90deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(0); opacity: 1; } } @-moz-keyframes rotateInUpRight { 0% { -moz-transform-origin: right bottom; -moz-transform: rotate(-90deg); opacity: 0; } 100% { -moz-transform-origin: right bottom; -moz-transform: rotate(0); opacity: 1; } } @-o-keyframes rotateInUpRight { 0% { -o-transform-origin: right bottom; -o-transform: rotate(-90deg); opacity: 0; } 100% { -o-transform-origin: right bottom; -o-transform: rotate(0); opacity: 1; } } @keyframes rotateInUpRight { 0% { transform-origin: right bottom; transform: rotate(-90deg); opacity: 0; } 100% { transform-origin: right bottom; transform: rotate(0); opacity: 1; } } .rotateInUpRight { -webkit-animation-name: rotateInUpRight; -moz-animation-name: rotateInUpRight; -o-animation-name: rotateInUpRight; animation-name: rotateInUpRight; } @-webkit-keyframes rotateInDownRight { 0% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(90deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(0); opacity: 1; } } @-moz-keyframes rotateInDownRight { 0% { -moz-transform-origin: right bottom; -moz-transform: rotate(90deg); opacity: 0; } 100% { -moz-transform-origin: right bottom; -moz-transform: rotate(0); opacity: 1; } } @-o-keyframes rotateInDownRight { 0% { -o-transform-origin: right bottom; -o-transform: rotate(90deg); opacity: 0; } 100% { -o-transform-origin: right bottom; -o-transform: rotate(0); opacity: 1; } } @keyframes rotateInDownRight { 0% { transform-origin: right bottom; transform: rotate(90deg); opacity: 0; } 100% { transform-origin: right bottom; transform: rotate(0); opacity: 1; } } .rotateInDownRight { -webkit-animation-name: rotateInDownRight; -moz-animation-name: rotateInDownRight; -o-animation-name: rotateInDownRight; animation-name: rotateInDownRight; } @-webkit-keyframes rotateOut { 0% { -webkit-transform-origin: center center; -webkit-transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: center center; -webkit-transform: rotate(200deg); opacity: 0; } } @-moz-keyframes rotateOut { 0% { -moz-transform-origin: center center; -moz-transform: rotate(0); opacity: 1; } 100% { -moz-transform-origin: center center; -moz-transform: rotate(200deg); opacity: 0; } } @-o-keyframes rotateOut { 0% { -o-transform-origin: center center; -o-transform: rotate(0); opacity: 1; } 100% { -o-transform-origin: center center; -o-transform: rotate(200deg); opacity: 0; } } @keyframes rotateOut { 0% { transform-origin: center center; transform: rotate(0); opacity: 1; } 100% { transform-origin: center center; transform: rotate(200deg); opacity: 0; } } .rotateOut { -webkit-animation-name: rotateOut; -moz-animation-name: rotateOut; -o-animation-name: rotateOut; animation-name: rotateOut; } @-webkit-keyframes rotateOutUpLeft { 0% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(-90deg); opacity: 0; } } @-moz-keyframes rotateOutUpLeft { 0% { -moz-transform-origin: left bottom; -moz-transform: rotate(0); opacity: 1; } 100% { -moz-transform-origin: left bottom; -moz-transform: rotate(-90deg); opacity: 0; } } @-o-keyframes rotateOutUpLeft { 0% { -o-transform-origin: left bottom; -o-transform: rotate(0); opacity: 1; } 100% { -o-transform-origin: left bottom; -o-transform: rotate(-90deg); opacity: 0; } } @keyframes rotateOutUpLeft { 0% { transform-origin: left bottom; transform: rotate(0); opacity: 1; } 100% { transform-origin: left bottom; transform: rotate(-90deg); opacity: 0; } } .rotateOutUpLeft { -webkit-animation-name: rotateOutUpLeft; -moz-animation-name: rotateOutUpLeft; -o-animation-name: rotateOutUpLeft; animation-name: rotateOutUpLeft; } @-webkit-keyframes rotateOutDownLeft { 0% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(90deg); opacity: 0; } } @-moz-keyframes rotateOutDownLeft { 0% { -moz-transform-origin: left bottom; -moz-transform: rotate(0); opacity: 1; } 100% { -moz-transform-origin: left bottom; -moz-transform: rotate(90deg); opacity: 0; } } @-o-keyframes rotateOutDownLeft { 0% { -o-transform-origin: left bottom; -o-transform: rotate(0); opacity: 1; } 100% { -o-transform-origin: left bottom; -o-transform: rotate(90deg); opacity: 0; } } @keyframes rotateOutDownLeft { 0% { transform-origin: left bottom; transform: rotate(0); opacity: 1; } 100% { transform-origin: left bottom; transform: rotate(90deg); opacity: 0; } } .rotateOutDownLeft { -webkit-animation-name: rotateOutDownLeft; -moz-animation-name: rotateOutDownLeft; -o-animation-name: rotateOutDownLeft; animation-name: rotateOutDownLeft; } @-webkit-keyframes rotateOutUpRight { 0% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(90deg); opacity: 0; } } @-moz-keyframes rotateOutUpRight { 0% { -moz-transform-origin: right bottom; -moz-transform: rotate(0); opacity: 1; } 100% { -moz-transform-origin: right bottom; -moz-transform: rotate(90deg); opacity: 0; } } @-o-keyframes rotateOutUpRight { 0% { -o-transform-origin: right bottom; -o-transform: rotate(0); opacity: 1; } 100% { -o-transform-origin: right bottom; -o-transform: rotate(90deg); opacity: 0; } } @keyframes rotateOutUpRight { 0% { transform-origin: right bottom; transform: rotate(0); opacity: 1; } 100% { transform-origin: right bottom; transform: rotate(90deg); opacity: 0; } } .rotateOutUpRight { -webkit-animation-name: rotateOutUpRight; -moz-animation-name: rotateOutUpRight; -o-animation-name: rotateOutUpRight; animation-name: rotateOutUpRight; } @-webkit-keyframes rotateOutDownRight { 0% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(-90deg); opacity: 0; } } @-moz-keyframes rotateOutDownRight { 0% { -moz-transform-origin: right bottom; -moz-transform: rotate(0); opacity: 1; } 100% { -moz-transform-origin: right bottom; -moz-transform: rotate(-90deg); opacity: 0; } } @-o-keyframes rotateOutDownRight { 0% { -o-transform-origin: right bottom; -o-transform: rotate(0); opacity: 1; } 100% { -o-transform-origin: right bottom; -o-transform: rotate(-90deg); opacity: 0; } } @keyframes rotateOutDownRight { 0% { transform-origin: right bottom; transform: rotate(0); opacity: 1; } 100% { transform-origin: right bottom; transform: rotate(-90deg); opacity: 0; } } .rotateOutDownRight { -webkit-animation-name: rotateOutDownRight; -moz-animation-name: rotateOutDownRight; -o-animation-name: rotateOutDownRight; animation-name: rotateOutDownRight; } @-webkit-keyframes hinge { 0% { -webkit-transform: rotate(0); -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; } 20%, 60% { -webkit-transform: rotate(80deg); -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; } 40% { -webkit-transform: rotate(60deg); -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; } 80% { -webkit-transform: rotate(60deg) translateY(0); opacity: 1; -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; } 100% { -webkit-transform: translateY(700px); opacity: 0; } } @-moz-keyframes hinge { 0% { -moz-transform: rotate(0); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; } 20%, 60% { -moz-transform: rotate(80deg); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; } 40% { -moz-transform: rotate(60deg); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; } 80% { -moz-transform: rotate(60deg) translateY(0); opacity: 1; -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; } 100% { -moz-transform: translateY(700px); opacity: 0; } } @-o-keyframes hinge { 0% { -o-transform: rotate(0); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; } 20%, 60% { -o-transform: rotate(80deg); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; } 40% { -o-transform: rotate(60deg); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; } 80% { -o-transform: rotate(60deg) translateY(0); opacity: 1; -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; } 100% { -o-transform: translateY(700px); opacity: 0; } } @keyframes hinge { 0% { transform: rotate(0); transform-origin: top left; animation-timing-function: ease-in-out; } 20%, 60% { transform: rotate(80deg); transform-origin: top left; animation-timing-function: ease-in-out; } 40% { transform: rotate(60deg); transform-origin: top left; animation-timing-function: ease-in-out; } 80% { transform: rotate(60deg) translateY(0); opacity: 1; transform-origin: top left; animation-timing-function: ease-in-out; } 100% { transform: translateY(700px); opacity: 0; } } .hinge { -webkit-animation-name: hinge; -moz-animation-name: hinge; -o-animation-name: hinge; animation-name: hinge; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes rollIn { 0% { opacity: 0; -webkit-transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); } } @-moz-keyframes rollIn { 0% { opacity: 0; -moz-transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -moz-transform: translateX(0px) rotate(0deg); } } @-o-keyframes rollIn { 0% { opacity: 0; -o-transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -o-transform: translateX(0px) rotate(0deg); } } @keyframes rollIn { 0% { opacity: 0; transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; transform: translateX(0px) rotate(0deg); } } .rollIn { -webkit-animation-name: rollIn; -moz-animation-name: rollIn; -o-animation-name: rollIn; animation-name: rollIn; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes rollOut {     0% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); }     100% { opacity: 0; -webkit-transform: translateX(100%) rotate(120deg); } } @-moz-keyframes rollOut {     0% { opacity: 1; -moz-transform: translateX(0px) rotate(0deg); }     100% { opacity: 0; -moz-transform: translateX(100%) rotate(120deg); } } @-o-keyframes rollOut {     0% { opacity: 1; -o-transform: translateX(0px) rotate(0deg); }     100% { opacity: 0; -o-transform: translateX(100%) rotate(120deg); } } @keyframes rollOut {     0% { opacity: 1; transform: translateX(0px) rotate(0deg); }     100% { opacity: 0; transform: translateX(100%) rotate(120deg); } } .rollOut { -webkit-animation-name: rollOut; -moz-animation-name: rollOut; -o-animation-name: rollOut; animation-name: rollOut; } /* originally authored by Angelo Rohit - https://github.com/angelorohit */ @-webkit-keyframes lightSpeedIn { 0% { -webkit-transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% { -webkit-transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% { -webkit-transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% { -webkit-transform: translateX(0%) skewX(0deg); opacity: 1; } } @-moz-keyframes lightSpeedIn { 0% { -moz-transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% { -moz-transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% { -moz-transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% { -moz-transform: translateX(0%) skewX(0deg); opacity: 1; } } @-o-keyframes lightSpeedIn { 0% { -o-transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% { -o-transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% { -o-transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% { -o-transform: translateX(0%) skewX(0deg); opacity: 1; } } @keyframes lightSpeedIn { 0% { transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% { transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% { transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% { transform: translateX(0%) skewX(0deg); opacity: 1; } } .lightSpeedIn {     -webkit-animation-name: lightSpeedIn;     -moz-animation-name: lightSpeedIn;     -o-animation-name: lightSpeedIn;     animation-name: lightSpeedIn;     -webkit-animation-timing-function: ease-out;     -moz-animation-timing-function: ease-out;     -o-animation-timing-function: ease-out;     animation-timing-function: ease-out; } .animated.lightSpeedIn {     -webkit-animation-duration: 0.5s;     -moz-animation-duration: 0.5s;     -o-animation-duration: 0.5s;     animation-duration: 0.5s; } /* originally authored by Angelo Rohit - https://github.com/angelorohit */ @-webkit-keyframes lightSpeedOut {     0% { -webkit-transform: translateX(0%) skewX(0deg); opacity: 1; } 100% { -webkit-transform: translateX(100%) skewX(-30deg); opacity: 0; } } @-moz-keyframes lightSpeedOut { 0% { -moz-transform: translateX(0%) skewX(0deg); opacity: 1; } 100% { -moz-transform: translateX(100%) skewX(-30deg); opacity: 0; } } @-o-keyframes lightSpeedOut { 0% { -o-transform: translateX(0%) skewX(0deg); opacity: 1; } 100% { -o-transform: translateX(100%) skewX(-30deg); opacity: 0; } } @keyframes lightSpeedOut { 0% { transform: translateX(0%) skewX(0deg); opacity: 1; } 100% { transform: translateX(100%) skewX(-30deg); opacity: 0; } } .lightSpeedOut {     -webkit-animation-name: lightSpeedOut;     -moz-animation-name: lightSpeedOut;     -o-animation-name: lightSpeedOut;     animation-name: lightSpeedOut;     -webkit-animation-timing-function: ease-in;     -moz-animation-timing-function: ease-in;     -o-animation-timing-function: ease-in;     animation-timing-function: ease-in; } .animated.lightSpeedOut {     -webkit-animation-duration: 0.25s;     -moz-animation-duration: 0.25s;     -o-animation-duration: 0.25s;     animation-duration: 0.25s; } /* originally authored by Angelo Rohit - https://github.com/angelorohit */ @-webkit-keyframes wiggle {     0% { -webkit-transform: skewX(9deg); }     10% { -webkit-transform: skewX(-8deg); }     20% { -webkit-transform: skewX(7deg); }     30% { -webkit-transform: skewX(-6deg); }     40% { -webkit-transform: skewX(5deg); }     50% { -webkit-transform: skewX(-4deg); }     60% { -webkit-transform: skewX(3deg); }     70% { -webkit-transform: skewX(-2deg); }     80% { -webkit-transform: skewX(1deg); }     90% { -webkit-transform: skewX(0deg); } 100% { -webkit-transform: skewX(0deg); } } @-moz-keyframes wiggle {     0% { -moz-transform: skewX(9deg); }     10% { -moz-transform: skewX(-8deg); }     20% { -moz-transform: skewX(7deg); }     30% { -moz-transform: skewX(-6deg); }     40% { -moz-transform: skewX(5deg); }     50% { -moz-transform: skewX(-4deg); }     60% { -moz-transform: skewX(3deg); }     70% { -moz-transform: skewX(-2deg); }     80% { -moz-transform: skewX(1deg); }     90% { -moz-transform: skewX(0deg); } 100% { -moz-transform: skewX(0deg); } } @-o-keyframes wiggle {     0% { -o-transform: skewX(9deg); }     10% { -o-transform: skewX(-8deg); }     20% { -o-transform: skewX(7deg); }     30% { -o-transform: skewX(-6deg); }     40% { -o-transform: skewX(5deg); }     50% { -o-transform: skewX(-4deg); }     60% { -o-transform: skewX(3deg); }     70% { -o-transform: skewX(-2deg); }     80% { -o-transform: skewX(1deg); }     90% { -o-transform: skewX(0deg); } 100% { -o-transform: skewX(0deg); } } @keyframes wiggle {     0% { transform: skewX(9deg); }     10% { transform: skewX(-8deg); }     20% { transform: skewX(7deg); }     30% { transform: skewX(-6deg); }     40% { transform: skewX(5deg); }     50% { transform: skewX(-4deg); }     60% { transform: skewX(3deg); }     70% { transform: skewX(-2deg); }     80% { transform: skewX(1deg); }     90% { transform: skewX(0deg); } 100% { transform: skewX(0deg); } } .wiggle {     -webkit-animation-name: wiggle;     -moz-animation-name: wiggle;     -o-animation-name: wiggle;     animation-name: wiggle;     -webkit-animation-timing-function: ease-in;     -moz-animation-timing-function: ease-in;     -o-animation-timing-function: ease-in;     animation-timing-function: ease-in; } .animated.wiggle {     -webkit-animation-duration: 0.75s;     -moz-animation-duration: 0.75s;     -o-animation-duration: 0.75s;     animation-duration: 0.75s; }&lt;/style&gt; &lt;!--banner--&gt; &lt;script src="/js/jquery.bxslider-rahisified.js"&gt;&lt;/script&gt; &lt;script src="/js/jquery.easing.1.3.js"&gt;&lt;/script&gt; &lt;!--[if lt IE 9]&gt; &lt;script src="/js/html5shiv.js"&gt;&lt;/script&gt; &lt;![endif]--&gt; &lt;/head&gt; &lt;body marginwidth="0" marginheight="0" class="show"&gt; &lt;article id="cont" class="" style="text-align:center; margin:0 auto; padding:30px 0; width: 1100px; ;"&gt; &lt;!-- 컬러챠트 삽입 { --&gt; &lt;style media="" data-href="/colorbox/css/colorbox_iframe.css"&gt;/*# sourceURL=/colorbox/css/colorbox_iframe.css */ /*@ sourceURL=/colorbox/css/colorbox_iframe.css */ @import url("https://cdn.rawgit.com/theeluwin/NotoSansKR-Hestia/master/stylesheets/NotoSansKR-Hestia.css"); body {margin:0;padding:0;} #behr_colorbox {width:850px; font-family: "Noto Sans Korean", "NotoSans", sans-serif,"dotum"; overflow: hidden;position: relative; font-size: 12px;  line-height: 1.2; text-align: left; z-index: 9999;} #behr_colorbox * {margin:0; padding: 0; vertical-align: top;} #behr_colorbox a {outline: none; text-decoration: none; cursor: pointer;} #behr_colorbox img {border:0;} #behr_colorbox ul {list-style: none;} #behr_colorbox .behr_monitor {width: 570px; border:2px solid #e6e6e5; min-height: 846px; margin-top: 52px; float: left; margin-left: 15px;} #behr_colorbox .behr_monitor .behr_color_menu {padding:33px 2px 25px;} #behr_colorbox .behr_monitor .behr_color_menu ul {font-size: 0} #behr_colorbox .behr_monitor .behr_color_menu ul li {display: inline-block; width: 11%; font-size: 12px;height: 49px; position: relative; vertical-align: top;} #behr_colorbox .behr_monitor .behr_color_menu ul li a {display: block; text-align: center; position: absolute; top:0; left:0; width: 100%; bottom:0; } #behr_colorbox .behr_inner {width: 540px} #behr_colorbox .behr_nav {position: absolute; top:0; left: 15px; height: 52px;} #behr_colorbox .behr_nav ul {overflow: hidden; position: absolute; bottom:0; left: 0; width: 582px;} #behr_colorbox .behr_nav ul li {float: left; height: 52px; position: relative;width: 108px;} #behr_colorbox .behr_nav ul li a {display: block; width: 108px; background: #e6e6e5; text-align: center; position: relative; bottom: 0; position: absolute; left:0; border-radius: 6px 6px 0 0; color:#535353; height: 42px;line-height: 42px; font-size:12px;} #behr_colorbox .behr_nav ul li:nth-child(odd) a {background:#f2f2f2;} #behr_colorbox .behr_nav ul li a.active {background: #535353; color:#fff; height: 52px; line-height: 58px; font-size: 14px} #behr_colorbox .behr_selectColor {width: 240px; float: right; margin-right: 15px;} #behr_colorbox .behr_selectColor h3 {height: 52px; background: #535353; color:#fff; font-size: 18px; text-align: center; line-height: 58px; font-weight: 400; border-radius: 5px 5px 0 0} #behr_colorbox .behr_palette {background: #e6e6e5; min-height: 850px;}  #behr_colorbox .behr_palette_guide { font-size: 11px; color: #535353; line-height: 20px; font-weight: 300; padding:12px 11px; border-bottom:1px solid #fff;}  #behr_colorbox .behr_colorChart {overflow:hidden; overflow-y:scroll; height: 600px;  position: relative;} #behr_colorbox .behr_colorChart.bhallcolors {margin-top: 65px;} #behr_colorbox .loading {position: absolute; top:160px; left:0; width: 580px; bottom:0; z-index: 998; background: rgba(256,256,256,0.8); text-align: center;} #behr_colorbox .loading img {padding-top:45%; } #behr_colorbox .cc_submenu a {cursor: pointer;} #behr_colorbox .behr_colorChart .cc-box {width: 60px; height: 40px; border-radius: 5px; overflow: hidden; display: inline-block; margin:4px; cursor: pointer;transition: transform 0.2s ease} #behr_colorbox .behr_colorChart .cc-box-none {width: 60px; height: 40px; overflow: hidden; display: inline-block; margin:4px;vertical-align: top;} #behr_colorbox .behr_colorChart .cc-box-img {width: 540px;  display: inline-block;margin:4px; margin-top: 20px; vertical-align: top;} #behr_colorbox .behr_colorChart .cc-box-img img {width: 100% !important;} #behr_colorbox .behr_colorChart .cc-box-imgbox {margin-bottom: 4px; height: 274px;} #behr_colorbox .behr_colorChart .cc-box-img .cc-box:nth-of-type(2) {margin-left: 0;} #behr_colorbox .behr_colorChart .cc-box-img .cc-box:nth-of-type(5) {margin-right: 0;} #behr_colorbox .behr_colorChart .cc-box .cc-name {display: none;} #behr_colorbox .behr_colorChart .cc-box:hover {transform: scale(1.1); } #behr_colorbox .behr_colorChart .cc-box.active {background-image: url("https://behr.kr/colorbox/css/../icon/chk.png") !important; background-position:  50% 50% !important; background-repeat: no-repeat !important;} #behr_colorbox .behr_colorChart .cc-box.activeb {background-image: url("https://behr.kr/colorbox/css/../icon/chk_b.png") !important; background-position:  50% 50% !important; background-repeat: no-repeat !important;} #behr_colorbox #behr_palette_save .cc-box { position: relative; padding:12px 0; margin:0 12px; border-bottom:1px solid #fff; overflow: hidden; min-height: 57px; box-sizing: border-box; cursor: pointer;} #behr_colorbox #behr_palette_save .cc-box .cc-view {display: block; width: 40px; height: 40px;border-radius: 5px; position: absolute; top:12px; left:0; z-index: 3;} #behr_colorbox #behr_palette_save .cc-box .cc-name {font-size:12px; padding-left: 52px;padding-top: 1px; color: #535353; padding-right: 40px} #behr_colorbox #behr_palette_save .cc-box .cc-name span {display: block; font-size:15px; padding-top: 0px; font-weight: bold;} #behr_colorbox #behr_palette_save .cc-box .palette_del {position: absolute; top:24px; right:15px; cursor: pointer; width: 20px; height: 20px; background: url("https://behr.kr/colorbox/css/../icon/close.png") no-repeat 0 0; overflow: hidden; text-align: left; text-indent: -9999px;} #behr_colorbox #behr_palette_save .cc-box .palette_del:hover {background-position: 0 -20px;} #behr_colorbox .wh-ov {background: #fff; opacity: 0.7; position: fixed; top:0; left:0; bottom:0; right: 0; width: 100%; height: 100%; z-index: 9998; display: none} #detailCanvas {background: url("https://behr.kr/colorbox/css/../icon/detail_iframe.png") no-repeat 0 0; width: 1050px; height: 850px; z-index: 9999; position: absolute; top:28px; left: 25px; display: none} #detailCanvas a.detailCanvas_close {position: absolute; top:3px; left: 771px; width: 26px; height: 26px; display: block; overflow: hidden; text-indent: -999px; text-align: left; cursor: pointer;} #detailCanvas #detailCanvas_list {position: absolute; top:30px; left: 232px; overflow: hidden; height: 60px; width: 540px; padding-top: 5px; padding-left: 5px;} #detailCanvas #detailCanvas_list .cc-box {float: left; margin-right: 5px;width: 43px; height: 43px; display: block; position: relative; cursor: pointer;border-radius: 5px; margin-bottom: 5px} #detailCanvas #detailCanvas_list .cc-box .cc-view {position: relative;width: 43px; height: 43px; border-radius: 5px; display: block; top:0; left:0;position: absolute;} #detailCanvas #detailCanvas_list .cc-box.active .cc-view  {border:4px solid  #3f3e3e;  top:-4px; left:-4px; z-index: 3;} #detailCanvas #detailCanvas_list .cc-box:hover .cc-view {transform: scale(1.1);} #detailCanvas #detailCanvas_list .cc-box.active:hover .cc-view {transform: scale(1);} #detailCanvas #detailCanvas_list .cc-box .cc-name, #detailCanvas #detailCanvas_list .cc-box .palette_del {display:none;} #detailCanvas #detailCanvas_view {width: 540px; height: 200px; display: block; position: absolute; top:100px; left: 237px;} #detailCanvas #detailCanvas_view .cc-box .cc-view {position: absolute; top:0; left: 0; right: 0; bottom: 0; z-index: -1;} #detailCanvas #detailCanvas_view .cc-box .cc-name {padding:30px 35px 18px; font-size:30px; color:#fff; font-weight: bold;} #detailCanvas #detailCanvas_view .cc-box .cc-name span {display: block;font-weight: normal; font-size: 22px; color:#fff;} #detailCanvas #detailCanvas_view .cc-box[data-tcol=B] .cc-name,  #detailCanvas #detailCanvas_view .cc-box[data-tcol=B] .cc-name span {color:#333;} #detailCanvas #detailCanvas_view .cc-box .palette_del {display: none;} #detailCanvas #detailCanvas_view .cc-box .detailColorvs_buyBtn {display: none; bottom:10px; left:233px;} #detailCanvas #detailCanvas_view:hover .cc-box .detailColorvs_buyBtn {display: block;} #detailCanvas .detailCanvas_btn {display: block;width: 174px; height: 53px; position: absolute; top:319px; cursor: pointer; text-indent: -999px; text-align: left; overflow: hidden; } #detailCanvas .detailCanvas_btn01 {left: 237px;} #detailCanvas .detailCanvas_btn02 {left: 419px;} #detailCanvas .detailCanvas_btn03 {left: 602px;} #detailCanvas .detailCanvas_btn:hover {background: url("https://behr.kr/colorbox/css/../icon/btn_hover_iframe.gif") no-repeat 0 0;} #detailCanvas .detailCanvas_view {display: block; width: 175px; position: absolute; top:388px; height: 237px;} #detailCanvas .detailCanvas_view01 {left: 237px;} #detailCanvas .detailCanvas_view02 {left: 419px;} #detailCanvas .detailCanvas_view03 {left: 602px;} #detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .cc-view {position: absolute; top:0; left: 0; right: 0; bottom: 0; z-index: -1;} #detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .cc-name {padding:25px 40px 18px 5px; font-size:16px; color:#fff; font-weight: bold;} #detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .cc-name span {display: block;font-weight: normal; font-size: 15px; color:#fff;} #detailCanvas #detailCanvas_color .detailCanvas_view .cc-box[data-tcol=B] .cc-name,  #detailCanvas #detailCanvas_color .detailCanvas_view .cc-box[data-tcol=B] .cc-name span {color:#333;} #detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .palette_del {display: none; } #detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .detailColorvs_buyBtn {display: none; top:140px;left:50px;} #detailCanvas #detailCanvas_color .detailCanvas_view01:hover .cc-box .detailColorvs_buyBtn {display: block;} #detailCanvas #detailCanvas_color .detailCanvas_view02:hover .cc-box .detailColorvs_buyBtn {display: block;} #detailCanvas #detailCanvas_color .detailCanvas_view03:hover .cc-box .detailColorvs_buyBtn {display: block;} #detailCanvas .detailColorvs_buyBtn {cursor: pointer; width: 74px; height: 74px; background: url("https://behr.kr/colorbox/css/../icon/cart.png") no-repeat 0 0; text-align: left; text-indent: -9999px; overflow: hidden; position: absolute; } /*검색결과*/ #behr_colorbox #cc_search_area {display: none; position: absolute; height: 104px; top:54px; left: 17px; width: 540px; background: #fff;} #behr_colorbox #cc_search_area .cc_search {display: block; background: url("https://behr.kr/colorbox/css/../icon/ccsearch_iframe.jpg") no-repeat 0 0; width: 500px; height: 50px; position: absolute; top:33px; left:44px;} #behr_colorbox #cc_search_area .cc_search label {display: inline-block; width: 100px; line-height: 50px; font-size: 18px; color:#535353; text-align: center; } #behr_colorbox #cc_search_area .cc_search input {display: inline-block;width:308px; height: 48px; line-height: 48px; border:0; background: #fff; font-size: 14px; color:#535353; padding: 0 20px; box-sizing: border-box; margin-top: 1px;} #behr_colorbox #cckeywordauto {position: absolute; top:92px; width: 550px; text-align: center;} #behr_colorbox #cckeywordauto ul {text-align: center; font-size: 0;} #behr_colorbox #cckeywordauto ul li {display: inline-block; background: #e6e6e5; border-radius: 5px; padding:5px 8px; font-size:14px; color:#535353; margin:0 2px;} #behr_colorbox #cckeywordauto ul li:nth-child(odd) {background: #f2f2f2;} #behr_colorbox #cckeywordauto ul li a {cursor: pointer; font-weight: 100} #ccsearchOutput {background: #535353; color:#fff; padding:0 14px; line-height: 41px; height: 41px; box-sizing: border-box; position: absolute; top:143px; left:20px; right: 20px;} #ccsearchOutput span {vertical-align: bottom; font-size:22px; margin-right: 8px; display: inline-block;} #behr_colorbox.namelist .behr_colorChart .cc-box {width: 80px; height: 60px; display: inline-block; overflow: visible; position: relative; margin:10px 175px 10px 20px; position: relative; transition: none;} #behr_colorbox.namelist .behr_colorChart .cc-box:before {content: ''; display: block; position: absolute; background:#ddd; width: 230px; height: 1px; bottom:-10px; left:0;} #behr_colorbox.namelist .behr_colorChart .cc-box:hover {transform: scale(1);} #behr_colorbox.namelist .behr_colorChart .cc-name { position: absolute; left: 87px; top:6px; display: block; width: 210px; font-size: 14px; color:#535353;} #behr_colorbox.namelist .behr_colorChart .cc-name span {display: block;} #behr_colorbox.namelist .behr_colorChart {margin-top: 78px !important; height: 660px !important;} #behr_colorbox.namelist .loading {top:238px;} #behr_colorbox.all_colors .behr_colorChart {margin-top: 65px;} /*메뉴별 모양*/ #behr_colorbox .behr_color_menu a {color: transparent;} /*1.all colors메뉴*/ #behr_colorbox.all_colors .behr_color_menu a.bh_colornav0 {background: #b1383d;} #behr_colorbox.all_colors .behr_color_menu a.bh_colornav1 {background: #d3533a} #behr_colorbox.all_colors .behr_color_menu a.bh_colornav2 {background: #ffcb3a} #behr_colorbox.all_colors .behr_color_menu a.bh_colornav3 {background: #4f725a} #behr_colorbox.all_colors .behr_color_menu a.bh_colornav4 {background: #006993} /*#behr_colorbox.all_colors .behr_color_menu a.bh_colornav5 {background: #86b9b2}*/ #behr_colorbox.all_colors .behr_color_menu a.bh_colornav5 {background: #7f657e} #behr_colorbox.all_colors .behr_color_menu a.bh_colornav6 {background: #a99884} #behr_colorbox.all_colors .behr_color_menu a.bh_colornav7 {background: #818181} #behr_colorbox.all_colors .behr_color_menu a.bh_colornav8 {background: #f1f1f1} /*2.best coloes 메뉴*/ #behr_colorbox.best_colors .behr_color_menu a.bh_colornav0 {background: #b1383d;} #behr_colorbox.best_colors .behr_color_menu a.bh_colornav1 {background: #d3533a} #behr_colorbox.best_colors .behr_color_menu a.bh_colornav2 {background: #ffcb3a} #behr_colorbox.best_colors .behr_color_menu a.bh_colornav3 {background: #4f725a} #behr_colorbox.best_colors .behr_color_menu a.bh_colornav4 {background: #006993} /*#behr_colorbox.best_colors .behr_color_menu a.bh_colornav5 {background: #86b9b2}*/ #behr_colorbox.best_colors .behr_color_menu a.bh_colornav5 {background: #7f657e} #behr_colorbox.best_colors .behr_color_menu a.bh_colornav6 {background: #a99884} #behr_colorbox.best_colors .behr_color_menu a.bh_colornav7 {background: #818181} #behr_colorbox.best_colors .behr_color_menu a.bh_colornav8 {background: #f1f1f1} /*3. by booms 메뉴*/ #behr_colorbox.by_rooms .behr_monitor .behr_color_menu ul li {width: 67px;} #behr_colorbox.by_rooms .behr_color_menu a {background:#f2f2f2 url("https://behr.kr/colorbox/css/../icon/byroom.png") no-repeat;} #behr_colorbox.by_rooms .behr_color_menu ul li:nth-child(odd) a {background-color:#e6e6e6;} #behr_colorbox.by_rooms .behr_color_menu a.bh_colornav0 {background-position: 0 0 !important; } #behr_colorbox.by_rooms .behr_color_menu a.bh_colornav1 {background-position: -99px 0 !important; } #behr_colorbox.by_rooms .behr_color_menu a.bh_colornav2 {background-position: -198px 0 !important; } #behr_colorbox.by_rooms .behr_color_menu a.bh_colornav3 {background-position: -297px 0 !important; } #behr_colorbox.by_rooms .behr_color_menu a.bh_colornav4 {background-position: -396px 0 !important; } #behr_colorbox.by_rooms .behr_color_menu a.bh_colornav5 {background-position: -495px 0 !important; } #behr_colorbox.by_rooms .behr_color_menu a.bh_colornav6 {background-position: -594px 0 !important; } #behr_colorbox.by_rooms .behr_color_menu a.bh_colornav7 {background-position: -693px 0 !important; } /*4. by styles 메뉴*/ #behr_colorbox.by_styles .behr_monitor .behr_color_menu ul li {width: 67px;} #behr_colorbox.by_styles .behr_color_menu a {background:#f2f2f2; position: relative;} #behr_colorbox.by_styles .behr_color_menu ul li:nth-child(odd) a {background-color:#e6e6e6;} #behr_colorbox.by_styles .behr_color_menu a span {color:#535353; line-height: 49px;font-size: 12px; letter-spacing: -0.02em} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav0 span {color:#9f9480;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav1 span {color:#4fb3d0;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav2 span {color:#88a379;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav3 span {color:#848595;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav4 span {color:#81242b;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav5 span {color:#c1a889;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav6 span {color:#64a093;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav7 span {color:#839894;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav0.active {background:#9f9480;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav1.active {background:#4fb3d0;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav2.active {background:#88a379;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav3.active {background:#848595;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav4.active {background:#81242b;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav5.active {background:#c1a889;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav6.active {background:#64a093;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav7.active {background:#839894;} #behr_colorbox.by_styles .behr_color_menu a.active span {color:#fff !important;line-height: 60px;} #behr_colorbox.by_styles .behr_color_menu a.active {height: 60px; margin-top: -5px;border-radius: 5px; } #behr_colorbox.all_colors .behr_color_menu a.active, #behr_colorbox.best_colors .behr_color_menu a.active {background-image: url("https://behr.kr/colorbox/css/../icon/check.png"); background-repeat: no-repeat; background-position: 50% 50%; height: 60px; margin-top: -5px; border-radius: 5px; } #behr_colorbox.by_rooms .behr_color_menu ul li a:hover {background-color: #535353; border-radius: 5px; } #behr_colorbox.by_rooms .behr_color_menu ul li a span {position: absolute; top:-20px; text-align: center; color:#535353; width: 100%; left: 0; display:none;} #behr_colorbox.by_rooms .behr_color_menu ul li a:hover span, #behr_colorbox.by_rooms .behr_color_menu ul li a.active span {position: absolute; top:-20px; text-align: center; display: block; color:#535353; width: 100%; left: 0;} #behr_colorbox.by_rooms .behr_color_menu ul li a.active {background-color: #535353; height: 60px; margin-top: -5px; border-radius: 5px;} #behr_colorbox.by_rooms .behr_color_menu a.active:after, #behr_colorbox.by_styles .behr_color_menu a.active:after {position:absolute; content: '';display: block; width: 100%; height: 100%; top:0; left: :0;  background-image: url("https://behr.kr/colorbox/css/../icon/check.png"); background-repeat: no-repeat; background-position: 50% 50%; height: 60px; margin-top: -5px; border-radius: 5px; } #behr_colorbox.by_styles .behr_color_menu ul li a u {position: absolute; top:-20px; text-align: center; color:#535353; width: 100%; left: 0; display:none; text-decoration: none;} #behr_colorbox.by_styles .behr_color_menu ul li a:hover u, #behr_colorbox.by_styles .behr_color_menu ul li a.active u {position: absolute; top:-20px; text-align: center; display: block; color:#535353; width: 100%; left: 0;} #behr_colorbox .cc_more_btn {position: absolute; left:184px; width: 208px; text-align: center;} #behr_colorbox .cc_more_btn a {display: block; height: 37px; width: 208px; color: #535353; cursor: pointer;} #behr_colorbox .cc_more_btn a i {display: inline-block; width: 35px; height: 35px; border-radius: 50%; background: #f9f9f9; vertical-align: middle; margin:0 10px;} #behr_colorbox .cc_more_btn a span {display: inline-block; vertical-align: top; width: 50px; height: 35px; line-height: 31px; text-align: left;text-transform : capitalize} #behr_colorbox .cc_more_btn a i.red {background:#b1383d } #behr_colorbox .cc_more_btn a i.orange {background:#d3533a } #behr_colorbox .cc_more_btn a i.yellow {background: #ffcb3a} #behr_colorbox .cc_more_btn a i.green {background: #4f725a} #behr_colorbox .cc_more_btn a i.blue {background:#006993 } #behr_colorbox .cc_more_btn a i.mint {background: #86b9b2} #behr_colorbox .cc_more_btn a i.purple {background: #7f657e} #behr_colorbox .cc_more_btn.prev {top:167px;} #behr_colorbox .cc_more_btn.next {top:850px;} #behr_colorbox .cc_more_btn.prev a i {background-repeat: no-repeat; background-image: url("https://behr.kr/colorbox/css/../icon/a_up.png"); background-position: 50% 50%;} #behr_colorbox .cc_more_btn.next a i {background-repeat: no-repeat; background-image: url("https://behr.kr/colorbox/css/../icon/a_down.png"); background-position: 50% 50%;} #behr_colorbox.namelist .cc_more_btn {display: none !important} /* 20180327 신령주 추가 */ #behr_colorbox span.cc_zoom {position:absolute; right:-10px; bottom:-5px; display:block; width:21px; height:21px; background:url("https://behr.kr/colorbox/css/../icon/zoomin.png") 0 0 no-repeat;} #behr_colorbox .behr_nav ul li a:hover{background: #535353; color:#fff; height: 52px; line-height: 58px; font-size: 18px} #behr_colorbox.all_colors .behr_color_menu ul.cc_submenu li a:hover {background-image: url("https://behr.kr/colorbox/css/../icon/check.png"); background-repeat: no-repeat; background-position: 50% 50%; height: 60px; margin-top: -5px; border-radius: 5px; } #detailCanvas_list span.cc_zoom {display:none;} #behr_colorbox.best_colors .behr_color_menu a:hover {background-image: url("https://behr.kr/colorbox/css/../icon/check.png"); background-repeat: no-repeat; background-position: 50% 50%; height: 60px; margin-top: -5px; border-radius: 5px; } #behr_colorbox.by_rooms .behr_color_menu ul li a.active {background:#535353 url("https://behr.kr/colorbox/css/../icon/byroom_on.png") no-repeat;} #behr_colorbox.by_rooms .behr_color_menu ul li a:hover {background:#535353 url("https://behr.kr/colorbox/css/../icon/byroom_on.png") no-repeat; height: 60px; margin-top: -5px; border-radius: 5px;} #behr_colorbox.by_rooms .behr_color_menu ul li a:hover:after {position:absolute; content: '';display: block; width: 100%; height: 100%; top:0; left: :0;  background-image: url("https://behr.kr/colorbox/css/../check.png"); background-repeat: no-repeat; background-position: 50% 50%; height: 60px; margin-top: -5px; border-radius: 5px; } #behr_colorbox.by_styles .behr_color_menu a.bh_colornav0:hover {background:#9f9480;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav1:hover {background:#4fb3d0;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav2:hover {background:#88a379;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav3:hover {background:#848595;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav4:hover {background:#81242b;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav5:hover {background:#c1a889;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav6:hover {background:#64a093;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav7:hover {background:#839894;} #behr_colorbox.by_styles .behr_color_menu a:hover span {color:#fff !important;line-height: 60px;} #behr_colorbox.by_styles .behr_color_menu a:hover {height: 60px; margin-top: -5px;border-radius: 5px; } #behr_colorbox.by_styles .behr_color_menu a:hover:after {position:absolute; content: '';display: block; width: 100%; height: 100%; top:0; left: :0;  background-image: url("https://behr.kr/colorbox/css/../icon/check.png"); background-repeat: no-repeat; background-position: 50% 50%; height: 60px; margin-top: -5px; border-radius: 5px; } #behr_colorbox.by_styles .behr_color_menu a {text-transform: capitalize;} #detailCanvas_view span.cc_zoom {display:none;} #behr_colorbox .detailCanvas_view span.cc_zoom {display:none;} #detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .palette_del {position: absolute; top:5px; right:5px; cursor: pointer; width: 20px; height: 20px; background: url("https://behr.kr/colorbox/css/../icon/close.png") no-repeat 0 0; overflow: hidden; text-align: left; text-indent: -9999px; display:block;} #detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .palette_del:hover {background-position: 0 -20px;} .behr_palette .pal_down {display:block; margin:0 auto !important; cursor:pointer;} .behr_palette .pal_up {display:block; margin:0 auto 0 !important; padding-top:5px !important; cursor:pointer;} .behr_palette #behr_palette_save {height:720px; overflow:hidden;} #detailCanvas #detailCanvas_list.h90 {height:96px;} #detailCanvas #detailCanvas_view.h90 {height:164px; top:140px;}&lt;/style&gt; &lt;script type="text/javascript" src="/colorbox/js/colorbox_iframe.js?ver=1"&gt;&lt;/script&gt; &lt;script type="text/javascript"&gt; var buyInput = "textinput"; //컬러값 입력하는곳의 아이디입력 var ccDisplay = "off"; //컬러값 선택후 컬러챠트 사라는 기능 on/off var cckwd = new Array("coffee","silver","vintage","lemon","red","green","pink"); //추천키워드 최대 7개 &lt;/script&gt; &lt;div id="behr_colorbox" class="sch_color by_rooms"&gt;&lt;div class="behr_nav"&gt; &lt;ul&gt; &lt;li&gt;&lt;a class="ccsubmenu" data-cc_category="all_colors"&gt;All Colors&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a class="ccsubmenu" data-cc_category="best_colors"&gt;Best Colors&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a class="ccsubmenu active" data-cc_category="by_rooms"&gt;By Rooms&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a class="ccsubmenu" data-cc_category="by_styles"&gt;By Styles&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a class="ccsearch"&gt;Search&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; &lt;div class="behr_monitor"&gt; &lt;div class="behr_inner"&gt; &lt;div class="behr_color_menu"&gt; &lt;ul class="cc_submenu"&gt;&lt;li&gt;&lt;a data-group="BEDROOM" class="bh_colornav0 active"&gt;&lt;span&gt;침실&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a data-group="BATHROOM" class="bh_colornav1"&gt;&lt;span&gt;욕실&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a data-group="KIDSROOM" class="bh_colornav2"&gt;&lt;span&gt;아이방&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a data-group="LIVINGROOM" class="bh_colornav3"&gt;&lt;span&gt;거실&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a data-group="KITCHEN" class="bh_colornav4"&gt;&lt;span&gt;부엌&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a data-group="DININGROOM" class="bh_colornav5"&gt;&lt;span&gt;주방&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a data-group="OFFICE" class="bh_colornav6"&gt;&lt;span&gt;서재&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a data-group="EXTERIOR" class="bh_colornav7"&gt;&lt;span&gt;실외공간&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt; &lt;/div&gt; &lt;div id="cc_search_area" style="display: none;"&gt; &lt;div class="cc_search"&gt; &lt;label&gt;컬러찾기&lt;/label&gt;&lt;input type="text" id="cc_search_btn" placeholder="컬러번호 또는 컬러명으로 검색하세요"&gt; &lt;/div&gt; &lt;div id="cckeywordauto"&gt; &lt;ul&gt;&lt;li&gt;&lt;a&gt;coffee&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a&gt;silver&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a&gt;vintage&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a&gt;lemon&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a&gt;red&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a&gt;green&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a&gt;pink&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt; &lt;/div&gt; &lt;div id="ccsearchOutput"&gt;&lt;span id="cckeyword"&gt;coffee&lt;/span&gt;검색결과&lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;div class="behr_colorChart" style="display: block;"&gt;&lt;div class="cc-box" data-ccid="0" data-name="PALE CORAL" data-code="PPU3-07" data-rgb="#F0D0B5" data-tcol="B" data-scroll="0" style="background:#F0D0B5;"&gt; &lt;p class="cc-name"&gt;PALE CORAL&lt;span&gt;PPU3-07&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="1" data-name="COCO" data-code="N270-3" data-rgb="#D1BBA2" data-tcol="B" data-scroll="0" style="background:#D1BBA2;"&gt; &lt;p class="cc-name"&gt;COCO&lt;span&gt;N270-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="2" data-name="STUDIO TAUPE" data-code="PPU5-07" data-rgb="#A5978A" data-tcol="W" data-scroll="0" style="background:#A5978A;"&gt; &lt;p class="cc-name"&gt;STUDIO TAUPE&lt;span&gt;PPU5-07&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="3" data-name="CHATEAU" data-code="PPU7-06" data-rgb="#B5A18B" data-tcol="B" data-scroll="0" style="background:#B5A18B;"&gt; &lt;p class="cc-name"&gt;CHATEAU&lt;span&gt;PPU7-06&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="4" data-name="DISTANT LAND" data-code="N260-5" data-rgb="#A68A72" data-tcol="W" data-scroll="0" style="background:#A68A72;"&gt; &lt;p class="cc-name"&gt;DISTANT LAND&lt;span&gt;N260-5&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="5" data-name="ANTIQUE WHITE" data-code="23" data-rgb="#E8DDCB" data-tcol="B" data-scroll="0" style="background:#E8DDCB;"&gt; &lt;p class="cc-name"&gt;ANTIQUE WHITE&lt;span&gt;23&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="6" data-name="CURIOUS COLLECTION" data-code="N290-4" data-rgb="#D2BB9A" data-tcol="B" data-scroll="0" style="background:#D2BB9A;"&gt; &lt;p class="cc-name"&gt;CURIOUS COLLECTION&lt;span&gt;N290-4&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="7" data-name="DOESKIN GRAY" data-code="N200-2" data-rgb="#CCC3BB" data-tcol="B" data-scroll="0" style="background:#CCC3BB;"&gt; &lt;p class="cc-name"&gt;DOESKIN GRAY&lt;span&gt;N200-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="8" data-name="WASABI POWDER" data-code="PPU9-10" data-rgb="#BDB390" data-tcol="B" data-scroll="0" style="background:#BDB390;"&gt; &lt;p class="cc-name"&gt;WASABI POWDER&lt;span&gt;PPU9-10&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="9" data-name="MINTED LEMON" data-code="PPU10-08" data-rgb="#C0C6A9" data-tcol="B" data-scroll="0" style="background:#C0C6A9;"&gt; &lt;p class="cc-name"&gt;MINTED LEMON&lt;span&gt;PPU10-08&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="10" data-name="RIVERDALE" data-code="N410-3" data-rgb="#BEC5BC" data-tcol="B" data-scroll="0" style="background:#BEC5BC;"&gt; &lt;p class="cc-name"&gt;RIVERDALE&lt;span&gt;N410-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="11" data-name="ZEN" data-code="PPU11-14" data-rgb="#AABAB0" data-tcol="B" data-scroll="0" style="background:#AABAB0;"&gt; &lt;p class="cc-name"&gt;ZEN&lt;span&gt;PPU11-14&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="12" data-name="ATMOSPHERIC" data-code="PPU12-15" data-rgb="#899698" data-tcol="B" data-scroll="0" style="background:#899698;"&gt; &lt;p class="cc-name"&gt;ATMOSPHERIC&lt;span&gt;PPU12-15&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="13" data-name="OBSERVATORY" data-code="PPU13-19" data-rgb="#455D66" data-tcol="W" data-scroll="0" style="background:#455D66;"&gt; &lt;p class="cc-name"&gt;OBSERVATORY&lt;span&gt;PPU13-19&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="14" data-name="FLOWING BREEZE" data-code="N480-2" data-rgb="#B9C6CC" data-tcol="B" data-scroll="0" style="background:#B9C6CC;"&gt; &lt;p class="cc-name"&gt;FLOWING BREEZE&lt;span&gt;N480-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="15" data-name="FOREVER DENIM" data-code="PPU14-05" data-rgb="#778591" data-tcol="W" data-scroll="0" style="background:#778591;"&gt; &lt;p class="cc-name"&gt;FOREVER DENIM&lt;span&gt;PPU14-05&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="16" data-name="CATHEDRAL GRAY" data-code="PPU18-14" data-rgb="#ACAAA8" data-tcol="B" data-scroll="0" style="background:#ACAAA8;"&gt; &lt;p class="cc-name"&gt;CATHEDRAL GRAY&lt;span&gt;PPU18-14&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="17" data-name="SUEDE GRAY" data-code="PPU18-17" data-rgb="#857F7B" data-tcol="W" data-scroll="0" style="background:#857F7B;"&gt; &lt;p class="cc-name"&gt;SUEDE GRAY&lt;span&gt;PPU18-17&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="18" data-name="FRENCH LILAC" data-code="PPU16-10" data-rgb="#BDB8BB" data-tcol="B" data-scroll="0" style="background:#BDB8BB;"&gt; &lt;p class="cc-name"&gt;FRENCH LILAC&lt;span&gt;PPU16-10&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="19" data-name="SO MERLOT" data-code="PPU1-15" data-rgb="#84525B" data-tcol="W" data-scroll="0" style="background:#84525B;"&gt; &lt;p class="cc-name"&gt;SO MERLOT&lt;span&gt;PPU1-15&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="20" data-name="BLACKBERRY JAM" data-code="S100-6" data-rgb="#6F5F71" data-tcol="W" data-scroll="0" style="background:#6F5F71;"&gt; &lt;p class="cc-name"&gt;BLACKBERRY JAM&lt;span&gt;S100-6&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="21" data-name="LUXE LILAC" data-code="N560-3" data-rgb="#A7A3B2" data-tcol="B" data-scroll="0" style="background:#A7A3B2;"&gt; &lt;p class="cc-name"&gt;LUXE LILAC&lt;span&gt;N560-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="22" data-name="BLUEPRINT" data-code="S470-5" data-rgb="#5F818F" data-tcol="W" data-scroll="0" style="background:#5F818F;"&gt; &lt;p class="cc-name"&gt;BLUEPRINT&lt;span&gt;S470-5&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="23" data-name="HALF SEA FOG" data-code="N470-3" data-rgb="#A9B7BC" data-tcol="B" data-scroll="0" style="background:#A9B7BC;"&gt; &lt;p class="cc-name"&gt;HALF SEA FOG&lt;span&gt;N470-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="24" data-name="SILVER BULLET" data-code="N520-2" data-rgb="#C4C4C4" data-tcol="B" data-scroll="0" style="background:#C4C4C4;"&gt; &lt;p class="cc-name"&gt;SILVER BULLET&lt;span&gt;N520-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="25" data-name="MINED COAL" data-code="PPU18-18" data-rgb="#6C6A66" data-tcol="W" data-scroll="0" style="background:#6C6A66;"&gt; &lt;p class="cc-name"&gt;MINED COAL&lt;span&gt;PPU18-18&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="26" data-name="JUNGLE CAMOUFLAGE" data-code="N350-4" data-rgb="#AAA795" data-tcol="B" data-scroll="0" style="background:#AAA795;"&gt; &lt;p class="cc-name"&gt;JUNGLE CAMOUFLAGE&lt;span&gt;N350-4&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="27" data-name="KINDLING" data-code="N200-6" data-rgb="#7A7069" data-tcol="W" data-scroll="0" style="background:#7A7069;"&gt; &lt;p class="cc-name"&gt;KINDLING&lt;span&gt;N200-6&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="28" data-name="HARMONIOUS GOLD" data-code="M300-3" data-rgb="#E9CFA4" data-tcol="B" data-scroll="0" style="background:#E9CFA4;"&gt; &lt;p class="cc-name"&gt;HARMONIOUS GOLD&lt;span&gt;M300-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="29" data-name="LUNAR SURFACE" data-code="N460-3" data-rgb="#B5B9B7" data-tcol="B" data-scroll="0" style="background:#B5B9B7;"&gt; &lt;p class="cc-name"&gt;LUNAR SURFACE&lt;span&gt;N460-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="30" data-name="CANVAS LUGGAGE" data-code="N300-2" data-rgb="#E1D7C7" data-tcol="B" data-scroll="0" style="background:#E1D7C7;"&gt; &lt;p class="cc-name"&gt;CANVAS LUGGAGE&lt;span&gt;N300-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="31" data-name="BREATHE" data-code="S360-2" data-rgb="#D1D1B9" data-tcol="B" data-scroll="0" style="background:#D1D1B9;"&gt; &lt;p class="cc-name"&gt;BREATHE&lt;span&gt;S360-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="32" data-name="METROPOLIS" data-code="N140-3" data-rgb="#B3A9A6" data-tcol="B" data-scroll="0" style="background:#B3A9A6;"&gt; &lt;p class="cc-name"&gt;METROPOLIS&lt;span&gt;N140-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="33" data-name="LINEN WHITE" data-code="70" data-rgb="#F6ECD8" data-tcol="B" data-scroll="0" style="background:#F6ECD8;"&gt; &lt;p class="cc-name"&gt;LINEN WHITE&lt;span&gt;70&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="34" data-name="ANONYMOUS" data-code="780F-5" data-rgb="#939392" data-tcol="W" data-scroll="0" style="background:#939392;"&gt; &lt;p class="cc-name"&gt;ANONYMOUS&lt;span&gt;780F-5&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="35" data-name="DRY BROWN" data-code="N230-5" data-rgb="#968375" data-tcol="W" data-scroll="0" style="background:#968375;"&gt; &lt;p class="cc-name"&gt;DRY BROWN&lt;span&gt;N230-5&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="36" data-name="PERFECT TAUPE" data-code="PPU18-13" data-rgb="#B5ACA1" data-tcol="B" data-scroll="0" style="background:#B5ACA1;"&gt; &lt;p class="cc-name"&gt;PERFECT TAUPE&lt;span&gt;PPU18-13&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="37" data-name="STERLING" data-code="780E-3" data-rgb="#D2D4D3" data-tcol="B" data-scroll="0" style="background:#D2D4D3;"&gt; &lt;p class="cc-name"&gt;STERLING&lt;span&gt;780E-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="38" data-name="SUBTLE TOUCH" data-code="790E-1" data-rgb="#DBDADA" data-tcol="B" data-scroll="0" style="background:#DBDADA;"&gt; &lt;p class="cc-name"&gt;SUBTLE TOUCH&lt;span&gt;790E-1&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="39" data-name="FRENCH SILVER" data-code="PPU18-05" data-rgb="#B8BCBE" data-tcol="B" data-scroll="0" style="background:#B8BCBE;"&gt; &lt;p class="cc-name"&gt;FRENCH SILVER&lt;span&gt;PPU18-05&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="40" data-name="FLANNEL GRAY" data-code="N520-3" data-rgb="#ADADAD" data-tcol="B" data-scroll="0" style="background:#ADADAD;"&gt; &lt;p class="cc-name"&gt;FLANNEL GRAY&lt;span&gt;N520-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="41" data-name="ULTRA PURE WHITE PRW15" data-code="PR-W15" data-rgb="#F8F9F5" data-tcol="B" data-scroll="0" style="background:#F8F9F5;"&gt; &lt;p class="cc-name"&gt;ULTRA PURE WHITE PRW15&lt;span&gt;PR-W15&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="42" data-name="WHITE METAL" data-code="N520-1" data-rgb="#D0D0D0" data-tcol="B" data-scroll="0" style="background:#D0D0D0;"&gt; &lt;p class="cc-name"&gt;WHITE METAL&lt;span&gt;N520-1&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="43" data-name="BURNISHED CLAY" data-code="PPU18-09" data-rgb="#D2CCC5" data-tcol="B" data-scroll="0" style="background:#D2CCC5;"&gt; &lt;p class="cc-name"&gt;BURNISHED CLAY&lt;span&gt;PPU18-09&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="44" data-name="DARK NAVY" data-code="S530-7" data-rgb="#40495B" data-tcol="W" data-scroll="0" style="background:#40495B;"&gt; &lt;p class="cc-name"&gt;DARK NAVY&lt;span&gt;S530-7&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="45" data-name="DARK PEWTER" data-code="PPU18-04" data-rgb="#8D9397" data-tcol="W" data-scroll="0" style="background:#8D9397;"&gt; &lt;p class="cc-name"&gt;DARK PEWTER&lt;span&gt;PPU18-04&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="46" data-name="POLAR BEAR" data-code="75" data-rgb="#F5F3ED" data-tcol="B" data-scroll="0" style="background:#F5F3ED;"&gt; &lt;p class="cc-name"&gt;POLAR BEAR&lt;span&gt;75&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="47" data-name="CHICAGO FOG" data-code="N140-2" data-rgb="#C9C1BE" data-tcol="B" data-scroll="0" style="background:#C9C1BE;"&gt; &lt;p class="cc-name"&gt;CHICAGO FOG&lt;span&gt;N140-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="48" data-name="SPUN WOOL" data-code="N220-1" data-rgb="#E3DDD6" data-tcol="B" data-scroll="0" style="background:#E3DDD6;"&gt; &lt;p class="cc-name"&gt;SPUN WOOL&lt;span&gt;N220-1&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="49" data-name="BOOT CUT" data-code="S510-2" data-rgb="#AEC1D0" data-tcol="B" data-scroll="0" style="background:#AEC1D0;"&gt; &lt;p class="cc-name"&gt;BOOT CUT&lt;span&gt;S510-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;div class="cc-box-img"&gt;&lt;div class="cc-box-imgbox"&gt;&lt;img src="/colorbox/img/byrooms/Bed01.jpg" alt="이미지1번입니다."&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="57" data-name="GENTLE SEA" data-code="S470-2" data-rgb="#B0C8D1" data-tcol="B" data-scroll="i" style="background:#B0C8D1;"&gt; &lt;p class="cc-name"&gt;GENTLE SEA&lt;span&gt;S470-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="58" data-name="POLAR BEAR" data-code="75" data-rgb="#F5F3ED" data-tcol="B" data-scroll="i" style="background:#F5F3ED;"&gt; &lt;p class="cc-name"&gt;POLAR BEAR&lt;span&gt;75&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class="cc-box-img"&gt;&lt;div class="cc-box-imgbox"&gt;&lt;img src="/colorbox/img/byrooms/Bed02.jpg" alt="이미지2번입니다"&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="63" data-name="UNDINE" data-code="M450-4" data-rgb="#89C0BC" data-tcol="B" data-scroll="i" style="background:#89C0BC;"&gt; &lt;p class="cc-name"&gt;UNDINE&lt;span&gt;M450-4&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="64" data-name="CARBON" data-code="N520-7" data-rgb="#3D3E3F" data-tcol="W" data-scroll="i" style="background:#3D3E3F;"&gt; &lt;p class="cc-name"&gt;CARBON&lt;span&gt;N520-7&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="65" data-name="SPANISH SAND" data-code="OR-W7" data-rgb="#DCD0BE" data-tcol="B" data-scroll="i" style="background:#DCD0BE;"&gt; &lt;p class="cc-name"&gt;SPANISH SAND&lt;span&gt;OR-W7&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class="cc-box-img"&gt;&lt;div class="cc-box-imgbox"&gt;&lt;img src="/colorbox/img/byrooms/Bed03.jpg" alt="이미지3번입니다"&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="69" data-name="CHATEAU" data-code="PPU7-06" data-rgb="#B5A18B" data-tcol="B" data-scroll="i" style="background:#B5A18B;"&gt; &lt;p class="cc-name"&gt;CHATEAU&lt;span&gt;PPU7-06&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="70" data-name="POLAR BEAR" data-code="75" data-rgb="#F5F3ED" data-tcol="B" data-scroll="i" style="background:#F5F3ED;"&gt; &lt;p class="cc-name"&gt;POLAR BEAR&lt;span&gt;75&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="71" data-name="BLACKOUT" data-code="N510-7" data-rgb="#413F3F" data-tcol="W" data-scroll="i" style="background:#413F3F;"&gt; &lt;p class="cc-name"&gt;BLACKOUT&lt;span&gt;N510-7&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class="cc-box-img"&gt;&lt;div class="cc-box-imgbox"&gt;&lt;img src="/colorbox/img/byrooms/Bed04.jpg" alt="이미지4번입니다"&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="75" data-name="AGED BEIGE" data-code="PPU7-09" data-rgb="#D7CFC1" data-tcol="B" data-scroll="i" style="background:#D7CFC1;"&gt; &lt;p class="cc-name"&gt;AGED BEIGE&lt;span&gt;PPU7-09&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="76" data-name="PURE EARTH" data-code="PPU7-05" data-rgb="#A79481" data-tcol="W" data-scroll="i" style="background:#A79481;"&gt; &lt;p class="cc-name"&gt;PURE EARTH&lt;span&gt;PPU7-05&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="77" data-name="WHITE" data-code="1852" data-rgb="#EBEAE7" data-tcol="B" data-scroll="i" style="background:#EBEAE7;"&gt; &lt;p class="cc-name"&gt;WHITE&lt;span&gt;1852&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class="cc-box-img"&gt;&lt;div class="cc-box-imgbox"&gt;&lt;img src="/colorbox/img/byrooms/Bed05.jpg" alt="이미지5번입니다"&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="81" data-name="FUTURE VISION" data-code="N100-3" data-rgb="#BCB5BD" data-tcol="B" data-scroll="i" style="background:#BCB5BD;"&gt; &lt;p class="cc-name"&gt;FUTURE VISION&lt;span&gt;N100-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="82" data-name="ULTRA PURE WHITE" data-code="PPU18-06" data-rgb="#F8F8F4" data-tcol="B" data-scroll="i" style="background:#F8F8F4;"&gt; &lt;p class="cc-name"&gt;ULTRA PURE WHITE&lt;span&gt;PPU18-06&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class="cc-box-img"&gt;&lt;div class="cc-box-imgbox"&gt;&lt;img src="/colorbox/img/byrooms/Bed06.jpg" alt="이미지6번입니다"&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="87" data-name="PALE PARSNIP" data-code="S320-2" data-rgb="#E3D7C1" data-tcol="B" data-scroll="i" style="background:#E3D7C1;"&gt; &lt;p class="cc-name"&gt;PALE PARSNIP&lt;span&gt;S320-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="88" data-name="SLEEK WHITE" data-code="OR-W15" data-rgb="#FAF5EB" data-tcol="B" data-scroll="i" style="background:#FAF5EB;"&gt; &lt;p class="cc-name"&gt;SLEEK WHITE&lt;span&gt;OR-W15&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="89" data-name="MAUVELOUS" data-code="BNC-12" data-rgb="#B5A49E" data-tcol="B" data-scroll="i" style="background:#B5A49E;"&gt; &lt;p class="cc-name"&gt;MAUVELOUS&lt;span&gt;BNC-12&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class="cc-box-img"&gt;&lt;div class="cc-box-imgbox"&gt;&lt;img src="/colorbox/img/byrooms/Bed07.jpg" alt="이미지7번입니다"&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="93" data-name="ROMAN PLASTER" data-code="PPU7-10" data-rgb="#DDD1C0" data-tcol="B" data-scroll="i" style="background:#DDD1C0;"&gt; &lt;p class="cc-name"&gt;ROMAN PLASTER&lt;span&gt;PPU7-10&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="94" data-name="SWISS COFFEE" data-code="12" data-rgb="#F1ECE1" data-tcol="B" data-scroll="i" style="background:#F1ECE1;"&gt; &lt;p class="cc-name"&gt;SWISS COFFEE&lt;span&gt;12&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="95" data-name="JOURNEYS END" data-code="S520-2" data-rgb="#BAC9D6" data-tcol="B" data-scroll="i" style="background:#BAC9D6;"&gt; &lt;p class="cc-name"&gt;JOURNEYS END&lt;span&gt;S520-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class="cc-box-img"&gt;&lt;div class="cc-box-imgbox"&gt;&lt;img src="/colorbox/img/byrooms/Bed08.jpg" alt="이미지8번입니다"&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="99" data-name="PARK AVENUE" data-code="MQ2-55" data-rgb="#bbb2a9" data-tcol="B" data-scroll="i" style="background:#bbb2a9;"&gt; &lt;p class="cc-name"&gt;PARK AVENUE&lt;span&gt;MQ2-55&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="100" data-name="COLD STEEL" data-code="MQ5-20" data-rgb="#808f99" data-tcol="W" data-scroll="i" style="background:#808f99;"&gt; &lt;p class="cc-name"&gt;COLD STEEL&lt;span&gt;MQ5-20&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="101" data-name="CREME DE LA CREME" data-code="MQ3-33" data-rgb="#e2ddd8" data-tcol="B" data-scroll="i" style="background:#e2ddd8;"&gt; &lt;p class="cc-name"&gt;CREME DE LA CREME&lt;span&gt;MQ3-33&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="102" data-name="UNPREDICTABLE HUE" data-code="MQ2-58" data-rgb="#7b746c" data-tcol="W" data-scroll="i" style="background:#7b746c;"&gt; &lt;p class="cc-name"&gt;UNPREDICTABLE HUE&lt;span&gt;MQ2-58&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt; &lt;/div&gt; &lt;div class="behr_selectColor"&gt; &lt;h3&gt;My BEHR Colors&lt;/h3&gt; &lt;div class="behr_palette"&gt; &lt;div class="behr_palette_guide"&gt; 크게 보고 싶은 컬러를 눌러 보세요. &lt;/div&gt; &lt;div id="behr_palette_save"&gt; &lt;/div&gt; &lt;/div&gt; &lt;div id="detailCanvas" style="display: none;"&gt;&lt;div id="detailCanvas_list"&gt;&lt;div class="cc-box" data-ccid="94" data-name="SWISS COFFEE" data-code="12" data-rgb="#F1ECE1" data-tcol="B" data-scroll="i" style=";"&gt; &lt;p class="cc-name"&gt;SWISS COFFEE&lt;span&gt;12&lt;/span&gt;&lt;/p&gt;&lt;a class="cc-view" style="background:#F1ECE1;"&gt;&lt;span class="cc_zoom"&gt;&lt;/span&gt;&lt;/a&gt;&lt;a class="palette_del"&gt;삭제&lt;/a&gt;&lt;/div&gt;&lt;div class="cc-box active" data-ccid="95" data-name="JOURNEYS END" data-code="S520-2" data-rgb="#BAC9D6" data-tcol="B" data-scroll="i" style=";"&gt; &lt;p class="cc-name"&gt;JOURNEYS END&lt;span&gt;S520-2&lt;/span&gt;&lt;/p&gt;&lt;a class="cc-view" style="background:#BAC9D6;"&gt;&lt;span class="cc_zoom"&gt;&lt;/span&gt;&lt;/a&gt;&lt;a class="palette_del"&gt;삭제&lt;/a&gt;&lt;/div&gt; &lt;/div&gt;&lt;div id="detailCanvas_view"&gt;&lt;div class="cc-box active" data-ccid="95" data-name="JOURNEYS END" data-code="S520-2" data-rgb="#BAC9D6" data-tcol="B" data-scroll="i" style=";"&gt; &lt;p class="cc-name"&gt;JOURNEYS END&lt;span&gt;S520-2&lt;/span&gt;&lt;/p&gt;&lt;a class="cc-view" style="background:#BAC9D6;"&gt;&lt;span class="cc_zoom"&gt;&lt;/span&gt;&lt;/a&gt;&lt;a class="palette_del"&gt;삭제&lt;/a&gt;&lt;a class="detailColorvs_buyBtn"&gt;주문하기&lt;/a&gt;&lt;/div&gt;&lt;/div&gt; &lt;div id="detailCanvas_color"&gt; &lt;a class="detailCanvas_btn detailCanvas_btn01" data-index="0"&gt;1번색상선택&lt;/a&gt; &lt;a class="detailCanvas_btn detailCanvas_btn02" data-index="1"&gt;2번색상선택&lt;/a&gt; &lt;a class="detailCanvas_btn detailCanvas_btn03" data-index="2"&gt;3번색상선택&lt;/a&gt; &lt;div class="detailCanvas_view detailCanvas_view01"&gt;&lt;/div&gt; &lt;div class="detailCanvas_view detailCanvas_view02"&gt;&lt;/div&gt; &lt;div class="detailCanvas_view detailCanvas_view03"&gt;&lt;/div&gt; &lt;/div&gt;&lt;a class="detailCanvas_close"&gt;닫기&lt;/a&gt;&lt;/div&gt; &lt;/div&gt; &lt;div class="loading" style="display: none;"&gt;&lt;img src="/colorbox/icon/ajax-loader.gif"&gt;&lt;/div&gt;&lt;div class="wh-ov" style="display: none;"&gt;&lt;/div&gt;&lt;/div&gt; &lt;!-- } 컬러챠트 삽입 --&gt;&lt;/article&gt;&lt;/body&gt;&lt;/html&gt; &lt;/iframe&gt;&lt;/center&gt; 이렇게 넣으면 되는거 아닌가요? ㅠㅠ 안되네요 ">
<meta name="keywords" content="네이버스토어 html 삽입">
<meta property="og:title" content="네이버스토어 html 삽입">
<meta property="og:url" content="https://cboard.net/k/1_1040205_428878900">
<meta property="og:type" content="website">
<meta property="og:description" content=" 안녕하세요 네이버스토어 상세페이지에 페인트 색상 고를 수 있도록  이런 html 삽입하려고 하는데 잘 안되네요.. https://behr.kr/sub/gallery/studio_iframe.asp 이 페이지를 넣으려면 html 적는 칸에 &lt;center&gt;&lt;iframe src="https://behr.kr/sub/gallery/studio_iframe.asp" width="850" height="1000" frameborder="0" marginwidth="0" marginheight="0" scrolling="no"&gt; &lt;html lang="ko" class=" -webkit-"&gt;&lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;meta http-equiv="X-UA-Compatible" content="IE=edge"&gt; &lt;meta name="format-detection" content="telephone=no"&gt; &lt;meta name="viewport" content="user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, width=device-width"&gt; &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8"&gt; &lt;meta http-equiv="Content-Script-Type" content="text/javascript"&gt; &lt;meta http-equiv="Content-Style-Type" content="text/css"&gt; &lt;style media="" data-href="https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700,900"&gt;/*# sourceURL=https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700,900 */ /*@ sourceURL=https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700,900 */ /* devanagari */ @font-face {   font-family: 'Poppins';   font-style: normal;   font-weight: 300;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLDz8Z11lFd2JQEl8qw.woff2) format('woff2');   unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB; } /* latin-ext */ @font-face {   font-family: 'Poppins';   font-style: normal;   font-weight: 300;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLDz8Z1JlFd2JQEl8qw.woff2) format('woff2');   unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face {   font-family: 'Poppins';   font-style: normal;   font-weight: 300;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLDz8Z1xlFd2JQEk.woff2) format('woff2');   unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* devanagari */ @font-face {   font-family: 'Poppins';   font-style: normal;   font-weight: 400;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiEyp8kv8JHgFVrJJbecnFHGPezSQ.woff2) format('woff2');   unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB; } /* latin-ext */ @font-face {   font-family: 'Poppins';   font-style: normal;   font-weight: 400;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiEyp8kv8JHgFVrJJnecnFHGPezSQ.woff2) format('woff2');   unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face {   font-family: 'Poppins';   font-style: normal;   font-weight: 400;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiEyp8kv8JHgFVrJJfecnFHGPc.woff2) format('woff2');   unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* devanagari */ @font-face {   font-family: 'Poppins';   font-style: normal;   font-weight: 500;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLGT9Z11lFd2JQEl8qw.woff2) format('woff2');   unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB; } /* latin-ext */ @font-face {   font-family: 'Poppins';   font-style: normal;   font-weight: 500;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLGT9Z1JlFd2JQEl8qw.woff2) format('woff2');   unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face {   font-family: 'Poppins';   font-style: normal;   font-weight: 500;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLGT9Z1xlFd2JQEk.woff2) format('woff2');   unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* devanagari */ @font-face {   font-family: 'Poppins';   font-style: normal;   font-weight: 600;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLEj6Z11lFd2JQEl8qw.woff2) format('woff2');   unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB; } /* latin-ext */ @font-face {   font-family: 'Poppins';   font-style: normal;   font-weight: 600;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLEj6Z1JlFd2JQEl8qw.woff2) format('woff2');   unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face {   font-family: 'Poppins';   font-style: normal;   font-weight: 600;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLEj6Z1xlFd2JQEk.woff2) format('woff2');   unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* devanagari */ @font-face {   font-family: 'Poppins';   font-style: normal;   font-weight: 700;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLCz7Z11lFd2JQEl8qw.woff2) format('woff2');   unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB; } /* latin-ext */ @font-face {   font-family: 'Poppins';   font-style: normal;   font-weight: 700;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLCz7Z1JlFd2JQEl8qw.woff2) format('woff2');   unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face {   font-family: 'Poppins';   font-style: normal;   font-weight: 700;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLCz7Z1xlFd2JQEk.woff2) format('woff2');   unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* devanagari */ @font-face {   font-family: 'Poppins';   font-style: normal;   font-weight: 900;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLBT5Z11lFd2JQEl8qw.woff2) format('woff2');   unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB; } /* latin-ext */ @font-face {   font-family: 'Poppins';   font-style: normal;   font-weight: 900;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLBT5Z1JlFd2JQEl8qw.woff2) format('woff2');   unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face {   font-family: 'Poppins';   font-style: normal;   font-weight: 900;   src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLBT5Z1xlFd2JQEk.woff2) format('woff2');   unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } &lt;/style&gt; &lt;style media="" data-href="/css/style.css"&gt;/*# sourceURL=/css/style.css */ /*@ sourceURL=/css/style.css */ @charset "utf-8"; @import url("https://behr.kr/css/base.css"); @import url("https://behr.kr/css/common.css"); @import url("https://behr.kr/css/main.css"); @import url("https://behr.kr/css/sub.css"); /* @import url("https://behr.kr/css/gallery.css"); */&lt;/style&gt; &lt;style media="" data-href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css"&gt;/*# sourceURL=//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css */ /*@ sourceURL=//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css */ /*!  *  Font Awesome 4.1.0 by @davegandy - http://fontawesome.io - @fontawesome  *  License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)  */@font-face{font-family:'FontAwesome';src:url("https://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/../fonts/fontawesome-webfont.eot?v=4.1.0");src:url("https://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/../fonts/fontawesome-webfont.eot?#iefix&amp;v=4.1.0") format('embedded-opentype'),url("https://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/../fonts/fontawesome-webfont.woff?v=4.1.0") format('woff'),url("https://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/../fonts/fontawesome-webfont.ttf?v=4.1.0") format('truetype'),url("https://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/../fonts/fontawesome-webfont.svg?v=4.1.0#fontawesomeregular") format('svg');font-weight:normal;font-style:normal}.fa{display:inline-block;font-family:FontAwesome;font-style:normal;font-weight:normal;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.fa-lg{font-size:1.33333333em;line-height:.75em;vertical-align:-15%}.fa-2x{font-size:2em}.fa-3x{font-size:3em}.fa-4x{font-size:4em}.fa-5x{font-size:5em}.fa-fw{width:1.28571429em;text-align:center}.fa-ul{padding-left:0;margin-left:2.14285714em;list-style-type:none}.fa-ul&gt;li{position:relative}.fa-li{position:absolute;left:-2.14285714em;width:2.14285714em;top:.14285714em;text-align:center}.fa-li.fa-lg{left:-1.85714286em}.fa-border{padding:.2em .25em .15em;border:solid .08em #eee;border-radius:.1em}.pull-right{float:right}.pull-left{float:left}.fa.pull-left{margin-right:.3em}.fa.pull-right{margin-left:.3em}.fa-spin{-webkit-animation:spin 2s infinite linear;-moz-animation:spin 2s infinite linear;-o-animation:spin 2s infinite linear;animation:spin 2s infinite linear}@-moz-keyframes spin{0%{-moz-transform:rotate(0deg)}100%{-moz-transform:rotate(359deg)}}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg)}100%{-webkit-transform:rotate(359deg)}}@-o-keyframes spin{0%{-o-transform:rotate(0deg)}100%{-o-transform:rotate(359deg)}}@keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}.fa-rotate-90{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=1);-webkit-transform:rotate(90deg);-moz-transform:rotate(90deg);-ms-transform:rotate(90deg);-o-transform:rotate(90deg);transform:rotate(90deg)}.fa-rotate-180{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2);-webkit-transform:rotate(180deg);-moz-transform:rotate(180deg);-ms-transform:rotate(180deg);-o-transform:rotate(180deg);transform:rotate(180deg)}.fa-rotate-270{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);-webkit-transform:rotate(270deg);-moz-transform:rotate(270deg);-ms-transform:rotate(270deg);-o-transform:rotate(270deg);transform:rotate(270deg)}.fa-flip-horizontal{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1);-webkit-transform:scale(-1, 1);-moz-transform:scale(-1, 1);-ms-transform:scale(-1, 1);-o-transform:scale(-1, 1);transform:scale(-1, 1)}.fa-flip-vertical{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1);-webkit-transform:scale(1, -1);-moz-transform:scale(1, -1);-ms-transform:scale(1, -1);-o-transform:scale(1, -1);transform:scale(1, -1)}.fa-stack{position:relative;display:inline-block;width:2em;height:2em;line-height:2em;vertical-align:middle}.fa-stack-1x,.fa-stack-2x{position:absolute;left:0;width:100%;text-align:center}.fa-stack-1x{line-height:inherit}.fa-stack-2x{font-size:2em}.fa-inverse{color:#fff}.fa-glass:before{content:"\f000"}.fa-music:before{content:"\f001"}.fa-search:before{content:"\f002"}.fa-envelope-o:before{content:"\f003"}.fa-heart:before{content:"\f004"}.fa-star:before{content:"\f005"}.fa-star-o:before{content:"\f006"}.fa-user:before{content:"\f007"}.fa-film:before{content:"\f008"}.fa-th-large:before{content:"\f009"}.fa-th:before{content:"\f00a"}.fa-th-list:before{content:"\f00b"}.fa-check:before{content:"\f00c"}.fa-times:before{content:"\f00d"}.fa-search-plus:before{content:"\f00e"}.fa-search-minus:before{content:"\f010"}.fa-power-off:before{content:"\f011"}.fa-signal:before{content:"\f012"}.fa-gear:before,.fa-cog:before{content:"\f013"}.fa-trash-o:before{content:"\f014"}.fa-home:before{content:"\f015"}.fa-file-o:before{content:"\f016"}.fa-clock-o:before{content:"\f017"}.fa-road:before{content:"\f018"}.fa-download:before{content:"\f019"}.fa-arrow-circle-o-down:before{content:"\f01a"}.fa-arrow-circle-o-up:before{content:"\f01b"}.fa-inbox:before{content:"\f01c"}.fa-play-circle-o:before{content:"\f01d"}.fa-rotate-right:before,.fa-repeat:before{content:"\f01e"}.fa-refresh:before{content:"\f021"}.fa-list-alt:before{content:"\f022"}.fa-lock:before{content:"\f023"}.fa-flag:before{content:"\f024"}.fa-headphones:before{content:"\f025"}.fa-volume-off:before{content:"\f026"}.fa-volume-down:before{content:"\f027"}.fa-volume-up:before{content:"\f028"}.fa-qrcode:before{content:"\f029"}.fa-barcode:before{content:"\f02a"}.fa-tag:before{content:"\f02b"}.fa-tags:before{content:"\f02c"}.fa-book:before{content:"\f02d"}.fa-bookmark:before{content:"\f02e"}.fa-print:before{content:"\f02f"}.fa-camera:before{content:"\f030"}.fa-font:before{content:"\f031"}.fa-bold:before{content:"\f032"}.fa-italic:before{content:"\f033"}.fa-text-height:before{content:"\f034"}.fa-text-width:before{content:"\f035"}.fa-align-left:before{content:"\f036"}.fa-align-center:before{content:"\f037"}.fa-align-right:before{content:"\f038"}.fa-align-justify:before{content:"\f039"}.fa-list:before{content:"\f03a"}.fa-dedent:before,.fa-outdent:before{content:"\f03b"}.fa-indent:before{content:"\f03c"}.fa-video-camera:before{content:"\f03d"}.fa-photo:before,.fa-image:before,.fa-picture-o:before{content:"\f03e"}.fa-pencil:before{content:"\f040"}.fa-map-marker:before{content:"\f041"}.fa-adjust:before{content:"\f042"}.fa-tint:before{content:"\f043"}.fa-edit:before,.fa-pencil-square-o:before{content:"\f044"}.fa-share-square-o:before{content:"\f045"}.fa-check-square-o:before{content:"\f046"}.fa-arrows:before{content:"\f047"}.fa-step-backward:before{content:"\f048"}.fa-fast-backward:before{content:"\f049"}.fa-backward:before{content:"\f04a"}.fa-play:before{content:"\f04b"}.fa-pause:before{content:"\f04c"}.fa-stop:before{content:"\f04d"}.fa-forward:before{content:"\f04e"}.fa-fast-forward:before{content:"\f050"}.fa-step-forward:before{content:"\f051"}.fa-eject:before{content:"\f052"}.fa-chevron-left:before{content:"\f053"}.fa-chevron-right:before{content:"\f054"}.fa-plus-circle:before{content:"\f055"}.fa-minus-circle:before{content:"\f056"}.fa-times-circle:before{content:"\f057"}.fa-check-circle:before{content:"\f058"}.fa-question-circle:before{content:"\f059"}.fa-info-circle:before{content:"\f05a"}.fa-crosshairs:before{content:"\f05b"}.fa-times-circle-o:before{content:"\f05c"}.fa-check-circle-o:before{content:"\f05d"}.fa-ban:before{content:"\f05e"}.fa-arrow-left:before{content:"\f060"}.fa-arrow-right:before{content:"\f061"}.fa-arrow-up:before{content:"\f062"}.fa-arrow-down:before{content:"\f063"}.fa-mail-forward:before,.fa-share:before{content:"\f064"}.fa-expand:before{content:"\f065"}.fa-compress:before{content:"\f066"}.fa-plus:before{content:"\f067"}.fa-minus:before{content:"\f068"}.fa-asterisk:before{content:"\f069"}.fa-exclamation-circle:before{content:"\f06a"}.fa-gift:before{content:"\f06b"}.fa-leaf:before{content:"\f06c"}.fa-fire:before{content:"\f06d"}.fa-eye:before{content:"\f06e"}.fa-eye-slash:before{content:"\f070"}.fa-warning:before,.fa-exclamation-triangle:before{content:"\f071"}.fa-plane:before{content:"\f072"}.fa-calendar:before{content:"\f073"}.fa-random:before{content:"\f074"}.fa-comment:before{content:"\f075"}.fa-magnet:before{content:"\f076"}.fa-chevron-up:before{content:"\f077"}.fa-chevron-down:before{content:"\f078"}.fa-retweet:before{content:"\f079"}.fa-shopping-cart:before{content:"\f07a"}.fa-folder:before{content:"\f07b"}.fa-folder-open:before{content:"\f07c"}.fa-arrows-v:before{content:"\f07d"}.fa-arrows-h:before{content:"\f07e"}.fa-bar-chart-o:before{content:"\f080"}.fa-twitter-square:before{content:"\f081"}.fa-facebook-square:before{content:"\f082"}.fa-camera-retro:before{content:"\f083"}.fa-key:before{content:"\f084"}.fa-gears:before,.fa-cogs:before{content:"\f085"}.fa-comments:before{content:"\f086"}.fa-thumbs-o-up:before{content:"\f087"}.fa-thumbs-o-down:before{content:"\f088"}.fa-star-half:before{content:"\f089"}.fa-heart-o:before{content:"\f08a"}.fa-sign-out:before{content:"\f08b"}.fa-linkedin-square:before{content:"\f08c"}.fa-thumb-tack:before{content:"\f08d"}.fa-external-link:before{content:"\f08e"}.fa-sign-in:before{content:"\f090"}.fa-trophy:before{content:"\f091"}.fa-github-square:before{content:"\f092"}.fa-upload:before{content:"\f093"}.fa-lemon-o:before{content:"\f094"}.fa-phone:before{content:"\f095"}.fa-square-o:before{content:"\f096"}.fa-bookmark-o:before{content:"\f097"}.fa-phone-square:before{content:"\f098"}.fa-twitter:before{content:"\f099"}.fa-facebook:before{content:"\f09a"}.fa-github:before{content:"\f09b"}.fa-unlock:before{content:"\f09c"}.fa-credit-card:before{content:"\f09d"}.fa-rss:before{content:"\f09e"}.fa-hdd-o:before{content:"\f0a0"}.fa-bullhorn:before{content:"\f0a1"}.fa-bell:before{content:"\f0f3"}.fa-certificate:before{content:"\f0a3"}.fa-hand-o-right:before{content:"\f0a4"}.fa-hand-o-left:before{content:"\f0a5"}.fa-hand-o-up:before{content:"\f0a6"}.fa-hand-o-down:before{content:"\f0a7"}.fa-arrow-circle-left:before{content:"\f0a8"}.fa-arrow-circle-right:before{content:"\f0a9"}.fa-arrow-circle-up:before{content:"\f0aa"}.fa-arrow-circle-down:before{content:"\f0ab"}.fa-globe:before{content:"\f0ac"}.fa-wrench:before{content:"\f0ad"}.fa-tasks:before{content:"\f0ae"}.fa-filter:before{content:"\f0b0"}.fa-briefcase:before{content:"\f0b1"}.fa-arrows-alt:before{content:"\f0b2"}.fa-group:before,.fa-users:before{content:"\f0c0"}.fa-chain:before,.fa-link:before{content:"\f0c1"}.fa-cloud:before{content:"\f0c2"}.fa-flask:before{content:"\f0c3"}.fa-cut:before,.fa-scissors:before{content:"\f0c4"}.fa-copy:before,.fa-files-o:before{content:"\f0c5"}.fa-paperclip:before{content:"\f0c6"}.fa-save:before,.fa-floppy-o:before{content:"\f0c7"}.fa-square:before{content:"\f0c8"}.fa-navicon:before,.fa-reorder:before,.fa-bars:before{content:"\f0c9"}.fa-list-ul:before{content:"\f0ca"}.fa-list-ol:before{content:"\f0cb"}.fa-strikethrough:before{content:"\f0cc"}.fa-underline:before{content:"\f0cd"}.fa-table:before{content:"\f0ce"}.fa-magic:before{content:"\f0d0"}.fa-truck:before{content:"\f0d1"}.fa-pinterest:before{content:"\f0d2"}.fa-pinterest-square:before{content:"\f0d3"}.fa-google-plus-square:before{content:"\f0d4"}.fa-google-plus:before{content:"\f0d5"}.fa-money:before{content:"\f0d6"}.fa-caret-down:before{content:"\f0d7"}.fa-caret-up:before{content:"\f0d8"}.fa-caret-left:before{content:"\f0d9"}.fa-caret-right:before{content:"\f0da"}.fa-columns:before{content:"\f0db"}.fa-unsorted:before,.fa-sort:before{content:"\f0dc"}.fa-sort-down:before,.fa-sort-desc:before{content:"\f0dd"}.fa-sort-up:before,.fa-sort-asc:before{content:"\f0de"}.fa-envelope:before{content:"\f0e0"}.fa-linkedin:before{content:"\f0e1"}.fa-rotate-left:before,.fa-undo:before{content:"\f0e2"}.fa-legal:before,.fa-gavel:before{content:"\f0e3"}.fa-dashboard:before,.fa-tachometer:before{content:"\f0e4"}.fa-comment-o:before{content:"\f0e5"}.fa-comments-o:before{content:"\f0e6"}.fa-flash:before,.fa-bolt:before{content:"\f0e7"}.fa-sitemap:before{content:"\f0e8"}.fa-umbrella:before{content:"\f0e9"}.fa-paste:before,.fa-clipboard:before{content:"\f0ea"}.fa-lightbulb-o:before{content:"\f0eb"}.fa-exchange:before{content:"\f0ec"}.fa-cloud-download:before{content:"\f0ed"}.fa-cloud-upload:before{content:"\f0ee"}.fa-user-md:before{content:"\f0f0"}.fa-stethoscope:before{content:"\f0f1"}.fa-suitcase:before{content:"\f0f2"}.fa-bell-o:before{content:"\f0a2"}.fa-coffee:before{content:"\f0f4"}.fa-cutlery:before{content:"\f0f5"}.fa-file-text-o:before{content:"\f0f6"}.fa-building-o:before{content:"\f0f7"}.fa-hospital-o:before{content:"\f0f8"}.fa-ambulance:before{content:"\f0f9"}.fa-medkit:before{content:"\f0fa"}.fa-fighter-jet:before{content:"\f0fb"}.fa-beer:before{content:"\f0fc"}.fa-h-square:before{content:"\f0fd"}.fa-plus-square:before{content:"\f0fe"}.fa-angle-double-left:before{content:"\f100"}.fa-angle-double-right:before{content:"\f101"}.fa-angle-double-up:before{content:"\f102"}.fa-angle-double-down:before{content:"\f103"}.fa-angle-left:before{content:"\f104"}.fa-angle-right:before{content:"\f105"}.fa-angle-up:before{content:"\f106"}.fa-angle-down:before{content:"\f107"}.fa-desktop:before{content:"\f108"}.fa-laptop:before{content:"\f109"}.fa-tablet:before{content:"\f10a"}.fa-mobile-phone:before,.fa-mobile:before{content:"\f10b"}.fa-circle-o:before{content:"\f10c"}.fa-quote-left:before{content:"\f10d"}.fa-quote-right:before{content:"\f10e"}.fa-spinner:before{content:"\f110"}.fa-circle:before{content:"\f111"}.fa-mail-reply:before,.fa-reply:before{content:"\f112"}.fa-github-alt:before{content:"\f113"}.fa-folder-o:before{content:"\f114"}.fa-folder-open-o:before{content:"\f115"}.fa-smile-o:before{content:"\f118"}.fa-frown-o:before{content:"\f119"}.fa-meh-o:before{content:"\f11a"}.fa-gamepad:before{content:"\f11b"}.fa-keyboard-o:before{content:"\f11c"}.fa-flag-o:before{content:"\f11d"}.fa-flag-checkered:before{content:"\f11e"}.fa-terminal:before{content:"\f120"}.fa-code:before{content:"\f121"}.fa-mail-reply-all:before,.fa-reply-all:before{content:"\f122"}.fa-star-half-empty:before,.fa-star-half-full:before,.fa-star-half-o:before{content:"\f123"}.fa-location-arrow:before{content:"\f124"}.fa-crop:before{content:"\f125"}.fa-code-fork:before{content:"\f126"}.fa-unlink:before,.fa-chain-broken:before{content:"\f127"}.fa-question:before{content:"\f128"}.fa-info:before{content:"\f129"}.fa-exclamation:before{content:"\f12a"}.fa-superscript:before{content:"\f12b"}.fa-subscript:before{content:"\f12c"}.fa-eraser:before{content:"\f12d"}.fa-puzzle-piece:before{content:"\f12e"}.fa-microphone:before{content:"\f130"}.fa-microphone-slash:before{content:"\f131"}.fa-shield:before{content:"\f132"}.fa-calendar-o:before{content:"\f133"}.fa-fire-extinguisher:before{content:"\f134"}.fa-rocket:before{content:"\f135"}.fa-maxcdn:before{content:"\f136"}.fa-chevron-circle-left:before{content:"\f137"}.fa-chevron-circle-right:before{content:"\f138"}.fa-chevron-circle-up:before{content:"\f139"}.fa-chevron-circle-down:before{content:"\f13a"}.fa-html5:before{content:"\f13b"}.fa-css3:before{content:"\f13c"}.fa-anchor:before{content:"\f13d"}.fa-unlock-alt:before{content:"\f13e"}.fa-bullseye:before{content:"\f140"}.fa-ellipsis-h:before{content:"\f141"}.fa-ellipsis-v:before{content:"\f142"}.fa-rss-square:before{content:"\f143"}.fa-play-circle:before{content:"\f144"}.fa-ticket:before{content:"\f145"}.fa-minus-square:before{content:"\f146"}.fa-minus-square-o:before{content:"\f147"}.fa-level-up:before{content:"\f148"}.fa-level-down:before{content:"\f149"}.fa-check-square:before{content:"\f14a"}.fa-pencil-square:before{content:"\f14b"}.fa-external-link-square:before{content:"\f14c"}.fa-share-square:before{content:"\f14d"}.fa-compass:before{content:"\f14e"}.fa-toggle-down:before,.fa-caret-square-o-down:before{content:"\f150"}.fa-toggle-up:before,.fa-caret-square-o-up:before{content:"\f151"}.fa-toggle-right:before,.fa-caret-square-o-right:before{content:"\f152"}.fa-euro:before,.fa-eur:before{content:"\f153"}.fa-gbp:before{content:"\f154"}.fa-dollar:before,.fa-usd:before{content:"\f155"}.fa-rupee:before,.fa-inr:before{content:"\f156"}.fa-cny:before,.fa-rmb:before,.fa-yen:before,.fa-jpy:before{content:"\f157"}.fa-ruble:before,.fa-rouble:before,.fa-rub:before{content:"\f158"}.fa-won:before,.fa-krw:before{content:"\f159"}.fa-bitcoin:before,.fa-btc:before{content:"\f15a"}.fa-file:before{content:"\f15b"}.fa-file-text:before{content:"\f15c"}.fa-sort-alpha-asc:before{content:"\f15d"}.fa-sort-alpha-desc:before{content:"\f15e"}.fa-sort-amount-asc:before{content:"\f160"}.fa-sort-amount-desc:before{content:"\f161"}.fa-sort-numeric-asc:before{content:"\f162"}.fa-sort-numeric-desc:before{content:"\f163"}.fa-thumbs-up:before{content:"\f164"}.fa-thumbs-down:before{content:"\f165"}.fa-youtube-square:before{content:"\f166"}.fa-youtube:before{content:"\f167"}.fa-xing:before{content:"\f168"}.fa-xing-square:before{content:"\f169"}.fa-youtube-play:before{content:"\f16a"}.fa-dropbox:before{content:"\f16b"}.fa-stack-overflow:before{content:"\f16c"}.fa-instagram:before{content:"\f16d"}.fa-flickr:before{content:"\f16e"}.fa-adn:before{content:"\f170"}.fa-bitbucket:before{content:"\f171"}.fa-bitbucket-square:before{content:"\f172"}.fa-tumblr:before{content:"\f173"}.fa-tumblr-square:before{content:"\f174"}.fa-long-arrow-down:before{content:"\f175"}.fa-long-arrow-up:before{content:"\f176"}.fa-long-arrow-left:before{content:"\f177"}.fa-long-arrow-right:before{content:"\f178"}.fa-apple:before{content:"\f179"}.fa-windows:before{content:"\f17a"}.fa-android:before{content:"\f17b"}.fa-linux:before{content:"\f17c"}.fa-dribbble:before{content:"\f17d"}.fa-skype:before{content:"\f17e"}.fa-foursquare:before{content:"\f180"}.fa-trello:before{content:"\f181"}.fa-female:before{content:"\f182"}.fa-male:before{content:"\f183"}.fa-gittip:before{content:"\f184"}.fa-sun-o:before{content:"\f185"}.fa-moon-o:before{content:"\f186"}.fa-archive:before{content:"\f187"}.fa-bug:before{content:"\f188"}.fa-vk:before{content:"\f189"}.fa-weibo:before{content:"\f18a"}.fa-renren:before{content:"\f18b"}.fa-pagelines:before{content:"\f18c"}.fa-stack-exchange:before{content:"\f18d"}.fa-arrow-circle-o-right:before{content:"\f18e"}.fa-arrow-circle-o-left:before{content:"\f190"}.fa-toggle-left:before,.fa-caret-square-o-left:before{content:"\f191"}.fa-dot-circle-o:before{content:"\f192"}.fa-wheelchair:before{content:"\f193"}.fa-vimeo-square:before{content:"\f194"}.fa-turkish-lira:before,.fa-try:before{content:"\f195"}.fa-plus-square-o:before{content:"\f196"}.fa-space-shuttle:before{content:"\f197"}.fa-slack:before{content:"\f198"}.fa-envelope-square:before{content:"\f199"}.fa-wordpress:before{content:"\f19a"}.fa-openid:before{content:"\f19b"}.fa-institution:before,.fa-bank:before,.fa-university:before{content:"\f19c"}.fa-mortar-board:before,.fa-graduation-cap:before{content:"\f19d"}.fa-yahoo:before{content:"\f19e"}.fa-google:before{content:"\f1a0"}.fa-reddit:before{content:"\f1a1"}.fa-reddit-square:before{content:"\f1a2"}.fa-stumbleupon-circle:before{content:"\f1a3"}.fa-stumbleupon:before{content:"\f1a4"}.fa-delicious:before{content:"\f1a5"}.fa-digg:before{content:"\f1a6"}.fa-pied-piper-square:before,.fa-pied-piper:before{content:"\f1a7"}.fa-pied-piper-alt:before{content:"\f1a8"}.fa-drupal:before{content:"\f1a9"}.fa-joomla:before{content:"\f1aa"}.fa-language:before{content:"\f1ab"}.fa-fax:before{content:"\f1ac"}.fa-building:before{content:"\f1ad"}.fa-child:before{content:"\f1ae"}.fa-paw:before{content:"\f1b0"}.fa-spoon:before{content:"\f1b1"}.fa-cube:before{content:"\f1b2"}.fa-cubes:before{content:"\f1b3"}.fa-behance:before{content:"\f1b4"}.fa-behance-square:before{content:"\f1b5"}.fa-steam:before{content:"\f1b6"}.fa-steam-square:before{content:"\f1b7"}.fa-recycle:before{content:"\f1b8"}.fa-automobile:before,.fa-car:before{content:"\f1b9"}.fa-cab:before,.fa-taxi:before{content:"\f1ba"}.fa-tree:before{content:"\f1bb"}.fa-spotify:before{content:"\f1bc"}.fa-deviantart:before{content:"\f1bd"}.fa-soundcloud:before{content:"\f1be"}.fa-database:before{content:"\f1c0"}.fa-file-pdf-o:before{content:"\f1c1"}.fa-file-word-o:before{content:"\f1c2"}.fa-file-excel-o:before{content:"\f1c3"}.fa-file-powerpoint-o:before{content:"\f1c4"}.fa-file-photo-o:before,.fa-file-picture-o:before,.fa-file-image-o:before{content:"\f1c5"}.fa-file-zip-o:before,.fa-file-archive-o:before{content:"\f1c6"}.fa-file-sound-o:before,.fa-file-audio-o:before{content:"\f1c7"}.fa-file-movie-o:before,.fa-file-video-o:before{content:"\f1c8"}.fa-file-code-o:before{content:"\f1c9"}.fa-vine:before{content:"\f1ca"}.fa-codepen:before{content:"\f1cb"}.fa-jsfiddle:before{content:"\f1cc"}.fa-life-bouy:before,.fa-life-saver:before,.fa-support:before,.fa-life-ring:before{content:"\f1cd"}.fa-circle-o-notch:before{content:"\f1ce"}.fa-ra:before,.fa-rebel:before{content:"\f1d0"}.fa-ge:before,.fa-empire:before{content:"\f1d1"}.fa-git-square:before{content:"\f1d2"}.fa-git:before{content:"\f1d3"}.fa-hacker-news:before{content:"\f1d4"}.fa-tencent-weibo:before{content:"\f1d5"}.fa-qq:before{content:"\f1d6"}.fa-wechat:before,.fa-weixin:before{content:"\f1d7"}.fa-send:before,.fa-paper-plane:before{content:"\f1d8"}.fa-send-o:before,.fa-paper-plane-o:before{content:"\f1d9"}.fa-history:before{content:"\f1da"}.fa-circle-thin:before{content:"\f1db"}.fa-header:before{content:"\f1dc"}.fa-paragraph:before{content:"\f1dd"}.fa-sliders:before{content:"\f1de"}.fa-share-alt:before{content:"\f1e0"}.fa-share-alt-square:before{content:"\f1e1"}.fa-bomb:before{content:"\f1e2"}&lt;/style&gt; &lt;script src="/js/jquery-1.8.3.min.js"&gt;&lt;/script&gt; &lt;script src="/js/prefixfree.min.js"&gt;&lt;/script&gt; &lt;script src="/js/common.js"&gt;&lt;/script&gt; &lt;!--//스크롤--&gt; &lt;script src="/js/scrollIt.js"&gt;&lt;/script&gt; &lt;!--text animation--&gt; &lt;script src="/js/jquery.fittext.js"&gt;&lt;/script&gt; &lt;script src="/js/jquery.lettering.js"&gt;&lt;/script&gt; &lt;script src="/js/jquery.textillate.js"&gt;&lt;/script&gt; &lt;style media="" data-href="/css/text_animation.css"&gt;/*# sourceURL=/css/text_animation.css */ /*@ sourceURL=/css/text_animation.css */ @charset "UTF-8"; /* Animate.css - http://daneden.me/animate Licensed under the ☺ license (http://licence.visualidiot.com/) Copyright (c) 2012 Dan Eden Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ body { /* Addresses a small issue in webkit: http://bit.ly/NEdoDq */ -webkit-backface-visibility: hidden; } .animated { -webkit-animation-duration: 1s;    -moz-animation-duration: 1s;      -o-animation-duration: 1s;         animation-duration: 1s; -webkit-animation-fill-mode: both;    -moz-animation-fill-mode: both;      -o-animation-fill-mode: both;         animation-fill-mode: both; } .animated.hinge { -webkit-animation-duration: 2s;    -moz-animation-duration: 2s;      -o-animation-duration: 2s;         animation-duration: 2s; } @-webkit-keyframes flash { 0%, 50%, 100% {opacity: 1;} 25%, 75% {opacity: 0;} } @-moz-keyframes flash { 0%, 50%, 100% {opacity: 1;} 25%, 75% {opacity: 0;} } @-o-keyframes flash { 0%, 50%, 100% {opacity: 1;} 25%, 75% {opacity: 0;} } @keyframes flash { 0%, 50%, 100% {opacity: 1;} 25%, 75% {opacity: 0;} } .flash { -webkit-animation-name: flash; -moz-animation-name: flash; -o-animation-name: flash; animation-name: flash; } @-webkit-keyframes shake { 0%, 100% {-webkit-transform: translateX(0);} 10%, 30%, 50%, 70%, 90% {-webkit-transform: translateX(-10px);} 20%, 40%, 60%, 80% {-webkit-transform: translateX(10px);} } @-moz-keyframes shake { 0%, 100% {-moz-transform: translateX(0);} 10%, 30%, 50%, 70%, 90% {-moz-transform: translateX(-10px);} 20%, 40%, 60%, 80% {-moz-transform: translateX(10px);} } @-o-keyframes shake { 0%, 100% {-o-transform: translateX(0);} 10%, 30%, 50%, 70%, 90% {-o-transform: translateX(-10px);} 20%, 40%, 60%, 80% {-o-transform: translateX(10px);} } @keyframes shake { 0%, 100% {transform: translateX(0);} 10%, 30%, 50%, 70%, 90% {transform: translateX(-10px);} 20%, 40%, 60%, 80% {transform: translateX(10px);} } .shake { -webkit-animation-name: shake; -moz-animation-name: shake; -o-animation-name: shake; animation-name: shake; } @-webkit-keyframes bounce { 0%, 20%, 50%, 80%, 100% {-webkit-transform: translateY(0);} 40% {-webkit-transform: translateY(-30px);} 60% {-webkit-transform: translateY(-15px);} } @-moz-keyframes bounce { 0%, 20%, 50%, 80%, 100% {-moz-transform: translateY(0);} 40% {-moz-transform: translateY(-30px);} 60% {-moz-transform: translateY(-15px);} } @-o-keyframes bounce { 0%, 20%, 50%, 80%, 100% {-o-transform: translateY(0);} 40% {-o-transform: translateY(-30px);} 60% {-o-transform: translateY(-15px);} } @keyframes bounce { 0%, 20%, 50%, 80%, 100% {transform: translateY(0);} 40% {transform: translateY(-30px);} 60% {transform: translateY(-15px);} } .bounce { -webkit-animation-name: bounce; -moz-animation-name: bounce; -o-animation-name: bounce; animation-name: bounce; } @-webkit-keyframes tada { 0% {-webkit-transform: scale(1);} 10%, 20% {-webkit-transform: scale(0.9) rotate(-3deg);} 30%, 50%, 70%, 90% {-webkit-transform: scale(1.1) rotate(3deg);} 40%, 60%, 80% {-webkit-transform: scale(1.1) rotate(-3deg);} 100% {-webkit-transform: scale(1) rotate(0);} } @-moz-keyframes tada { 0% {-moz-transform: scale(1);} 10%, 20% {-moz-transform: scale(0.9) rotate(-3deg);} 30%, 50%, 70%, 90% {-moz-transform: scale(1.1) rotate(3deg);} 40%, 60%, 80% {-moz-transform: scale(1.1) rotate(-3deg);} 100% {-moz-transform: scale(1) rotate(0);} } @-o-keyframes tada { 0% {-o-transform: scale(1);} 10%, 20% {-o-transform: scale(0.9) rotate(-3deg);} 30%, 50%, 70%, 90% {-o-transform: scale(1.1) rotate(3deg);} 40%, 60%, 80% {-o-transform: scale(1.1) rotate(-3deg);} 100% {-o-transform: scale(1) rotate(0);} } @keyframes tada { 0% {transform: scale(1);} 10%, 20% {transform: scale(0.9) rotate(-3deg);} 30%, 50%, 70%, 90% {transform: scale(1.1) rotate(3deg);} 40%, 60%, 80% {transform: scale(1.1) rotate(-3deg);} 100% {transform: scale(1) rotate(0);} } .tada { -webkit-animation-name: tada; -moz-animation-name: tada; -o-animation-name: tada; animation-name: tada; } @-webkit-keyframes swing { 20%, 40%, 60%, 80%, 100% { -webkit-transform-origin: top center; } 20% { -webkit-transform: rotate(15deg); } 40% { -webkit-transform: rotate(-10deg); } 60% { -webkit-transform: rotate(5deg); } 80% { -webkit-transform: rotate(-5deg); } 100% { -webkit-transform: rotate(0deg); } } @-moz-keyframes swing { 20% { -moz-transform: rotate(15deg); } 40% { -moz-transform: rotate(-10deg); } 60% { -moz-transform: rotate(5deg); } 80% { -moz-transform: rotate(-5deg); } 100% { -moz-transform: rotate(0deg); } } @-o-keyframes swing { 20% { -o-transform: rotate(15deg); } 40% { -o-transform: rotate(-10deg); } 60% { -o-transform: rotate(5deg); } 80% { -o-transform: rotate(-5deg); } 100% { -o-transform: rotate(0deg); } } @keyframes swing { 20% { transform: rotate(15deg); } 40% { transform: rotate(-10deg); } 60% { transform: rotate(5deg); } 80% { transform: rotate(-5deg); } 100% { transform: rotate(0deg); } } .swing { -webkit-transform-origin: top center; -moz-transform-origin: top center; -o-transform-origin: top center; transform-origin: top center; -webkit-animation-name: swing; -moz-animation-name: swing; -o-animation-name: swing; animation-name: swing; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes wobble {   0% { -webkit-transform: translateX(0%); }   15% { -webkit-transform: translateX(-25%) rotate(-5deg); }   30% { -webkit-transform: translateX(20%) rotate(3deg); }   45% { -webkit-transform: translateX(-15%) rotate(-3deg); }   60% { -webkit-transform: translateX(10%) rotate(2deg); }   75% { -webkit-transform: translateX(-5%) rotate(-1deg); }   100% { -webkit-transform: translateX(0%); } } @-moz-keyframes wobble {   0% { -moz-transform: translateX(0%); }   15% { -moz-transform: translateX(-25%) rotate(-5deg); }   30% { -moz-transform: translateX(20%) rotate(3deg); }   45% { -moz-transform: translateX(-15%) rotate(-3deg); }   60% { -moz-transform: translateX(10%) rotate(2deg); }   75% { -moz-transform: translateX(-5%) rotate(-1deg); }   100% { -moz-transform: translateX(0%); } } @-o-keyframes wobble {   0% { -o-transform: translateX(0%); }   15% { -o-transform: translateX(-25%) rotate(-5deg); }   30% { -o-transform: translateX(20%) rotate(3deg); }   45% { -o-transform: translateX(-15%) rotate(-3deg); }   60% { -o-transform: translateX(10%) rotate(2deg); }   75% { -o-transform: translateX(-5%) rotate(-1deg); }   100% { -o-transform: translateX(0%); } } @keyframes wobble {   0% { transform: translateX(0%); }   15% { transform: translateX(-25%) rotate(-5deg); }   30% { transform: translateX(20%) rotate(3deg); }   45% { transform: translateX(-15%) rotate(-3deg); }   60% { transform: translateX(10%) rotate(2deg); }   75% { transform: translateX(-5%) rotate(-1deg); }   100% { transform: translateX(0%); } } .wobble { -webkit-animation-name: wobble; -moz-animation-name: wobble; -o-animation-name: wobble; animation-name: wobble; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes pulse {     0% { -webkit-transform: scale(1); } 50% { -webkit-transform: scale(1.1); }     100% { -webkit-transform: scale(1); } } @-moz-keyframes pulse {     0% { -moz-transform: scale(1); } 50% { -moz-transform: scale(1.1); }     100% { -moz-transform: scale(1); } } @-o-keyframes pulse {     0% { -o-transform: scale(1); } 50% { -o-transform: scale(1.1); }     100% { -o-transform: scale(1); } } @keyframes pulse {     0% { transform: scale(1); } 50% { transform: scale(1.1); }     100% { transform: scale(1); } } .pulse { -webkit-animation-name: pulse; -moz-animation-name: pulse; -o-animation-name: pulse; animation-name: pulse; } @-webkit-keyframes flip { 0% { -webkit-transform: perspective(400px) rotateY(0); -webkit-animation-timing-function: ease-out; } 40% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg); -webkit-animation-timing-function: ease-out; } 50% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -webkit-animation-timing-function: ease-in; } 80% { -webkit-transform: perspective(400px) rotateY(360deg) scale(.95); -webkit-animation-timing-function: ease-in; } 100% { -webkit-transform: perspective(400px) scale(1); -webkit-animation-timing-function: ease-in; } } @-moz-keyframes flip { 0% { -moz-transform: perspective(400px) rotateY(0); -moz-animation-timing-function: ease-out; } 40% { -moz-transform: perspective(400px) translateZ(150px) rotateY(170deg); -moz-animation-timing-function: ease-out; } 50% { -moz-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -moz-animation-timing-function: ease-in; } 80% { -moz-transform: perspective(400px) rotateY(360deg) scale(.95); -moz-animation-timing-function: ease-in; } 100% { -moz-transform: perspective(400px) scale(1); -moz-animation-timing-function: ease-in; } } @-o-keyframes flip { 0% { -o-transform: perspective(400px) rotateY(0); -o-animation-timing-function: ease-out; } 40% { -o-transform: perspective(400px) translateZ(150px) rotateY(170deg); -o-animation-timing-function: ease-out; } 50% { -o-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -o-animation-timing-function: ease-in; } 80% { -o-transform: perspective(400px) rotateY(360deg) scale(.95); -o-animation-timing-function: ease-in; } 100% { -o-transform: perspective(400px) scale(1); -o-animation-timing-function: ease-in; } } @keyframes flip { 0% { transform: perspective(400px) rotateY(0); animation-timing-function: ease-out; } 40% { transform: perspective(400px) translateZ(150px) rotateY(170deg); animation-timing-function: ease-out; } 50% { transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); animation-timing-function: ease-in; } 80% { transform: perspective(400px) rotateY(360deg) scale(.95); animation-timing-function: ease-in; } 100% { transform: perspective(400px) scale(1); animation-timing-function: ease-in; } } .flip { -webkit-backface-visibility: visible !important; -webkit-animation-name: flip; -moz-backface-visibility: visible !important; -moz-animation-name: flip; -o-backface-visibility: visible !important; -o-animation-name: flip; backface-visibility: visible !important; animation-name: flip; } @-webkit-keyframes flipInX {     0% {         -webkit-transform: perspective(400px) rotateX(90deg);         opacity: 0;     }          40% {         -webkit-transform: perspective(400px) rotateX(-10deg);     }          70% {         -webkit-transform: perspective(400px) rotateX(10deg);     }          100% {         -webkit-transform: perspective(400px) rotateX(0deg);         opacity: 1;     } } @-moz-keyframes flipInX {     0% {         -moz-transform: perspective(400px) rotateX(90deg);         opacity: 0;     }          40% {         -moz-transform: perspective(400px) rotateX(-10deg);     }          70% {         -moz-transform: perspective(400px) rotateX(10deg);     }          100% {         -moz-transform: perspective(400px) rotateX(0deg);         opacity: 1;     } } @-o-keyframes flipInX {     0% {         -o-transform: perspective(400px) rotateX(90deg);         opacity: 0;     }          40% {         -o-transform: perspective(400px) rotateX(-10deg);     }          70% {         -o-transform: perspective(400px) rotateX(10deg);     }          100% {         -o-transform: perspective(400px) rotateX(0deg);         opacity: 1;     } } @keyframes flipInX {     0% {         transform: perspective(400px) rotateX(90deg);         opacity: 0;     }          40% {         transform: perspective(400px) rotateX(-10deg);     }          70% {         transform: perspective(400px) rotateX(10deg);     }          100% {         transform: perspective(400px) rotateX(0deg);         opacity: 1;     } } .flipInX { -webkit-backface-visibility: visible !important; -webkit-animation-name: flipInX; -moz-backface-visibility: visible !important; -moz-animation-name: flipInX; -o-backface-visibility: visible !important; -o-animation-name: flipInX; backface-visibility: visible !important; animation-name: flipInX; } @-webkit-keyframes flipOutX {     0% {         -webkit-transform: perspective(400px) rotateX(0deg);         opacity: 1;     } 100% {         -webkit-transform: perspective(400px) rotateX(90deg);         opacity: 0;     } } @-moz-keyframes flipOutX {     0% {         -moz-transform: perspective(400px) rotateX(0deg);         opacity: 1;     } 100% {         -moz-transform: perspective(400px) rotateX(90deg);         opacity: 0;     } } @-o-keyframes flipOutX {     0% {         -o-transform: perspective(400px) rotateX(0deg);         opacity: 1;     } 100% {         -o-transform: perspective(400px) rotateX(90deg);         opacity: 0;     } } @keyframes flipOutX {     0% {         transform: perspective(400px) rotateX(0deg);         opacity: 1;     } 100% {         transform: perspective(400px) rotateX(90deg);         opacity: 0;     } } .flipOutX { -webkit-animation-name: flipOutX; -webkit-backface-visibility: visible !important; -moz-animation-name: flipOutX; -moz-backface-visibility: visible !important; -o-animation-name: flipOutX; -o-backface-visibility: visible !important; animation-name: flipOutX; backface-visibility: visible !important; } @-webkit-keyframes flipInY {     0% {         -webkit-transform: perspective(400px) rotateY(90deg);         opacity: 0;     }          40% {         -webkit-transform: perspective(400px) rotateY(-10deg);     }          70% {         -webkit-transform: perspective(400px) rotateY(10deg);     }          100% {         -webkit-transform: perspective(400px) rotateY(0deg);         opacity: 1;     } } @-moz-keyframes flipInY {     0% {         -moz-transform: perspective(400px) rotateY(90deg);         opacity: 0;     }          40% {         -moz-transform: perspective(400px) rotateY(-10deg);     }          70% {         -moz-transform: perspective(400px) rotateY(10deg);     }          100% {         -moz-transform: perspective(400px) rotateY(0deg);         opacity: 1;     } } @-o-keyframes flipInY {     0% {         -o-transform: perspective(400px) rotateY(90deg);         opacity: 0;     }          40% {         -o-transform: perspective(400px) rotateY(-10deg);     }          70% {         -o-transform: perspective(400px) rotateY(10deg);     }          100% {         -o-transform: perspective(400px) rotateY(0deg);         opacity: 1;     } } @keyframes flipInY {     0% {         transform: perspective(400px) rotateY(90deg);         opacity: 0;     }          40% {         transform: perspective(400px) rotateY(-10deg);     }          70% {         transform: perspective(400px) rotateY(10deg);     }          100% {         transform: perspective(400px) rotateY(0deg);         opacity: 1;     } } .flipInY { -webkit-backface-visibility: visible !important; -webkit-animation-name: flipInY; -moz-backface-visibility: visible !important; -moz-animation-name: flipInY; -o-backface-visibility: visible !important; -o-animation-name: flipInY; backface-visibility: visible !important; animation-name: flipInY; } @-webkit-keyframes flipOutY {     0% {         -webkit-transform: perspective(400px) rotateY(0deg);         opacity: 1;     } 100% {         -webkit-transform: perspective(400px) rotateY(90deg);         opacity: 0;     } } @-moz-keyframes flipOutY {     0% {         -moz-transform: perspective(400px) rotateY(0deg);         opacity: 1;     } 100% {         -moz-transform: perspective(400px) rotateY(90deg);         opacity: 0;     } } @-o-keyframes flipOutY {     0% {         -o-transform: perspective(400px) rotateY(0deg);         opacity: 1;     } 100% {         -o-transform: perspective(400px) rotateY(90deg);         opacity: 0;     } } @keyframes flipOutY {     0% {         transform: perspective(400px) rotateY(0deg);         opacity: 1;     } 100% {         transform: perspective(400px) rotateY(90deg);         opacity: 0;     } } .flipOutY { -webkit-backface-visibility: visible !important; -webkit-animation-name: flipOutY; -moz-backface-visibility: visible !important; -moz-animation-name: flipOutY; -o-backface-visibility: visible !important; -o-animation-name: flipOutY; backface-visibility: visible !important; animation-name: flipOutY; } @-webkit-keyframes fadeIn { 0% {opacity: 0;} 100% {opacity: 1;} } @-moz-keyframes fadeIn { 0% {opacity: 0;} 100% {opacity: 1;} } @-o-keyframes fadeIn { 0% {opacity: 0;} 100% {opacity: 1;} } @keyframes fadeIn { 0% {opacity: 0;} 100% {opacity: 1;} } .fadeIn { -webkit-animation-name: fadeIn; -moz-animation-name: fadeIn; -o-animation-name: fadeIn; animation-name: fadeIn; } @-webkit-keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translateY(20px); } 100% { opacity: 1; -webkit-transform: translateY(0); } } @-moz-keyframes fadeInUp { 0% { opacity: 0; -moz-transform: translateY(20px); } 100% { opacity: 1; -moz-transform: translateY(0); } } @-o-keyframes fadeInUp { 0% { opacity: 0; -o-transform: translateY(20px); } 100% { opacity: 1; -o-transform: translateY(0); } } @keyframes fadeInUp { 0% { opacity: 0; transform: translateY(20px); } 100% { opacity: 1; transform: translateY(0); } } .fadeInUp { -webkit-animation-name: fadeInUp; -moz-animation-name: fadeInUp; -o-animation-name: fadeInUp; animation-name: fadeInUp; } @-webkit-keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translateY(-20px); } 100% { opacity: 1; -webkit-transform: translateY(0); } } @-moz-keyframes fadeInDown { 0% { opacity: 0; -moz-transform: translateY(-20px); } 100% { opacity: 1; -moz-transform: translateY(0); } } @-o-keyframes fadeInDown { 0% { opacity: 0; -o-transform: translateY(-20px); } 100% { opacity: 1; -o-transform: translateY(0); } } @keyframes fadeInDown { 0% { opacity: 0; transform: translateY(-20px); } 100% { opacity: 1; transform: translateY(0); } } .fadeInDown { -webkit-animation-name: fadeInDown; -moz-animation-name: fadeInDown; -o-animation-name: fadeInDown; animation-name: fadeInDown; } @-webkit-keyframes fadeInLeft { 0% { opacity: 0; -webkit-transform: translateX(-20px); } 100% { opacity: 1; -webkit-transform: translateX(0); } } @-moz-keyframes fadeInLeft { 0% { opacity: 0; -moz-transform: translateX(-20px); } 100% { opacity: 1; -moz-transform: translateX(0); } } @-o-keyframes fadeInLeft { 0% { opacity: 0; -o-transform: translateX(-20px); } 100% { opacity: 1; -o-transform: translateX(0); } } @keyframes fadeInLeft { 0% { opacity: 0; transform: translateX(-20px); } 100% { opacity: 1; transform: translateX(0); } } .fadeInLeft { -webkit-animation-name: fadeInLeft; -moz-animation-name: fadeInLeft; -o-animation-name: fadeInLeft; animation-name: fadeInLeft; } @-webkit-keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translateX(20px); } 100% { opacity: 1; -webkit-transform: translateX(0); } } @-moz-keyframes fadeInRight { 0% { opacity: 0; -moz-transform: translateX(20px); } 100% { opacity: 1; -moz-transform: translateX(0); } } @-o-keyframes fadeInRight { 0% { opacity: 0; -o-transform: translateX(20px); } 100% { opacity: 1; -o-transform: translateX(0); } } @keyframes fadeInRight { 0% { opacity: 0; transform: translateX(20px); } 100% { opacity: 1; transform: translateX(0); } } .fadeInRight { -webkit-animation-name: fadeInRight; -moz-animation-name: fadeInRight; -o-animation-name: fadeInRight; animation-name: fadeInRight; } @-webkit-keyframes fadeInUpBig { 0% { opacity: 0; -webkit-transform: translateY(2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); } } @-moz-keyframes fadeInUpBig { 0% { opacity: 0; -moz-transform: translateY(2000px); } 100% { opacity: 1; -moz-transform: translateY(0); } } @-o-keyframes fadeInUpBig { 0% { opacity: 0; -o-transform: translateY(2000px); } 100% { opacity: 1; -o-transform: translateY(0); } } @keyframes fadeInUpBig { 0% { opacity: 0; transform: translateY(2000px); } 100% { opacity: 1; transform: translateY(0); } } .fadeInUpBig { -webkit-animation-name: fadeInUpBig; -moz-animation-name: fadeInUpBig; -o-animation-name: fadeInUpBig; animation-name: fadeInUpBig; } @-webkit-keyframes fadeInDownBig { 0% { opacity: 0; -webkit-transform: translateY(-2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); } } @-moz-keyframes fadeInDownBig { 0% { opacity: 0; -moz-transform: translateY(-2000px); } 100% { opacity: 1; -moz-transform: translateY(0); } } @-o-keyframes fadeInDownBig { 0% { opacity: 0; -o-transform: translateY(-2000px); } 100% { opacity: 1; -o-transform: translateY(0); } } @keyframes fadeInDownBig { 0% { opacity: 0; transform: translateY(-2000px); } 100% { opacity: 1; transform: translateY(0); } } .fadeInDownBig { -webkit-animation-name: fadeInDownBig; -moz-animation-name: fadeInDownBig; -o-animation-name: fadeInDownBig; animation-name: fadeInDownBig; } @-webkit-keyframes fadeInLeftBig { 0% { opacity: 0; -webkit-transform: translateX(-2000px); } 100% { opacity: 1; -webkit-transform: translateX(0); } } @-moz-keyframes fadeInLeftBig { 0% { opacity: 0; -moz-transform: translateX(-2000px); } 100% { opacity: 1; -moz-transform: translateX(0); } } @-o-keyframes fadeInLeftBig { 0% { opacity: 0; -o-transform: translateX(-2000px); } 100% { opacity: 1; -o-transform: translateX(0); } } @keyframes fadeInLeftBig { 0% { opacity: 0; transform: translateX(-2000px); } 100% { opacity: 1; transform: translateX(0); } } .fadeInLeftBig { -webkit-animation-name: fadeInLeftBig; -moz-animation-name: fadeInLeftBig; -o-animation-name: fadeInLeftBig; animation-name: fadeInLeftBig; } @-webkit-keyframes fadeInRightBig { 0% { opacity: 0; -webkit-transform: translateX(2000px); } 100% { opacity: 1; -webkit-transform: translateX(0); } } @-moz-keyframes fadeInRightBig { 0% { opacity: 0; -moz-transform: translateX(2000px); } 100% { opacity: 1; -moz-transform: translateX(0); } } @-o-keyframes fadeInRightBig { 0% { opacity: 0; -o-transform: translateX(2000px); } 100% { opacity: 1; -o-transform: translateX(0); } } @keyframes fadeInRightBig { 0% { opacity: 0; transform: translateX(2000px); } 100% { opacity: 1; transform: translateX(0); } } .fadeInRightBig { -webkit-animation-name: fadeInRightBig; -moz-animation-name: fadeInRightBig; -o-animation-name: fadeInRightBig; animation-name: fadeInRightBig; } @-webkit-keyframes fadeOut { 0% {opacity: 1;} 100% {opacity: 0;} } @-moz-keyframes fadeOut { 0% {opacity: 1;} 100% {opacity: 0;} } @-o-keyframes fadeOut { 0% {opacity: 1;} 100% {opacity: 0;} } @keyframes fadeOut { 0% {opacity: 1;} 100% {opacity: 0;} } .fadeOut { -webkit-animation-name: fadeOut; -moz-animation-name: fadeOut; -o-animation-name: fadeOut; animation-name: fadeOut; } @-webkit-keyframes fadeOutUp { 0% { opacity: 1; -webkit-transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-20px); } } @-moz-keyframes fadeOutUp { 0% { opacity: 1; -moz-transform: translateY(0); } 100% { opacity: 0; -moz-transform: translateY(-20px); } } @-o-keyframes fadeOutUp { 0% { opacity: 1; -o-transform: translateY(0); } 100% { opacity: 0; -o-transform: translateY(-20px); } } @keyframes fadeOutUp { 0% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; transform: translateY(-20px); } } .fadeOutUp { -webkit-animation-name: fadeOutUp; -moz-animation-name: fadeOutUp; -o-animation-name: fadeOutUp; animation-name: fadeOutUp; } @-webkit-keyframes fadeOutDown { 0% { opacity: 1; -webkit-transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(20px); } } @-moz-keyframes fadeOutDown { 0% { opacity: 1; -moz-transform: translateY(0); } 100% { opacity: 0; -moz-transform: translateY(20px); } } @-o-keyframes fadeOutDown { 0% { opacity: 1; -o-transform: translateY(0); } 100% { opacity: 0; -o-transform: translateY(20px); } } @keyframes fadeOutDown { 0% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; transform: translateY(20px); } } .fadeOutDown { -webkit-animation-name: fadeOutDown; -moz-animation-name: fadeOutDown; -o-animation-name: fadeOutDown; animation-name: fadeOutDown; } @-webkit-keyframes fadeOutLeft { 0% { opacity: 1; -webkit-transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-20px); } } @-moz-keyframes fadeOutLeft { 0% { opacity: 1; -moz-transform: translateX(0); } 100% { opacity: 0; -moz-transform: translateX(-20px); } } @-o-keyframes fadeOutLeft { 0% { opacity: 1; -o-transform: translateX(0); } 100% { opacity: 0; -o-transform: translateX(-20px); } } @keyframes fadeOutLeft { 0% { opacity: 1; transform: translateX(0); } 100% { opacity: 0; transform: translateX(-20px); } } .fadeOutLeft { -webkit-animation-name: fadeOutLeft; -moz-animation-name: fadeOutLeft; -o-animation-name: fadeOutLeft; animation-name: fadeOutLeft; } @-webkit-keyframes fadeOutRight { 0% { opacity: 1; -webkit-transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(20px); } } @-moz-keyframes fadeOutRight { 0% { opacity: 1; -moz-transform: translateX(0); } 100% { opacity: 0; -moz-transform: translateX(20px); } } @-o-keyframes fadeOutRight { 0% { opacity: 1; -o-transform: translateX(0); } 100% { opacity: 0; -o-transform: translateX(20px); } } @keyframes fadeOutRight { 0% { opacity: 1; transform: translateX(0); } 100% { opacity: 0; transform: translateX(20px); } } .fadeOutRight { -webkit-animation-name: fadeOutRight; -moz-animation-name: fadeOutRight; -o-animation-name: fadeOutRight; animation-name: fadeOutRight; } @-webkit-keyframes fadeOutUpBig { 0% { opacity: 1; -webkit-transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); } } @-moz-keyframes fadeOutUpBig { 0% { opacity: 1; -moz-transform: translateY(0); } 100% { opacity: 0; -moz-transform: translateY(-2000px); } } @-o-keyframes fadeOutUpBig { 0% { opacity: 1; -o-transform: translateY(0); } 100% { opacity: 0; -o-transform: translateY(-2000px); } } @keyframes fadeOutUpBig { 0% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; transform: translateY(-2000px); } } .fadeOutUpBig { -webkit-animation-name: fadeOutUpBig; -moz-animation-name: fadeOutUpBig; -o-animation-name: fadeOutUpBig; animation-name: fadeOutUpBig; } @-webkit-keyframes fadeOutDownBig { 0% { opacity: 1; -webkit-transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(2000px); } } @-moz-keyframes fadeOutDownBig { 0% { opacity: 1; -moz-transform: translateY(0); } 100% { opacity: 0; -moz-transform: translateY(2000px); } } @-o-keyframes fadeOutDownBig { 0% { opacity: 1; -o-transform: translateY(0); } 100% { opacity: 0; -o-transform: translateY(2000px); } } @keyframes fadeOutDownBig { 0% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; transform: translateY(2000px); } } .fadeOutDownBig { -webkit-animation-name: fadeOutDownBig; -moz-animation-name: fadeOutDownBig; -o-animation-name: fadeOutDownBig; animation-name: fadeOutDownBig; } @-webkit-keyframes fadeOutLeftBig { 0% { opacity: 1; -webkit-transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); } } @-moz-keyframes fadeOutLeftBig { 0% { opacity: 1; -moz-transform: translateX(0); } 100% { opacity: 0; -moz-transform: translateX(-2000px); } } @-o-keyframes fadeOutLeftBig { 0% { opacity: 1; -o-transform: translateX(0); } 100% { opacity: 0; -o-transform: translateX(-2000px); } } @keyframes fadeOutLeftBig { 0% { opacity: 1; transform: translateX(0); } 100% { opacity: 0; transform: translateX(-2000px); } } .fadeOutLeftBig { -webkit-animation-name: fadeOutLeftBig; -moz-animation-name: fadeOutLeftBig; -o-animation-name: fadeOutLeftBig; animation-name: fadeOutLeftBig; } @-webkit-keyframes fadeOutRightBig { 0% { opacity: 1; -webkit-transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(2000px); } } @-moz-keyframes fadeOutRightBig { 0% { opacity: 1; -moz-transform: translateX(0); } 100% { opacity: 0; -moz-transform: translateX(2000px); } } @-o-keyframes fadeOutRightBig { 0% { opacity: 1; -o-transform: translateX(0); } 100% { opacity: 0; -o-transform: translateX(2000px); } } @keyframes fadeOutRightBig { 0% { opacity: 1; transform: translateX(0); } 100% { opacity: 0; transform: translateX(2000px); } } .fadeOutRightBig { -webkit-animation-name: fadeOutRightBig; -moz-animation-name: fadeOutRightBig; -o-animation-name: fadeOutRightBig; animation-name: fadeOutRightBig; } @-webkit-keyframes bounceIn { 0% { opacity: 0; -webkit-transform: scale(.3); } 50% { opacity: 1; -webkit-transform: scale(1.05); } 70% { -webkit-transform: scale(.9); } 100% { -webkit-transform: scale(1); } } @-moz-keyframes bounceIn { 0% { opacity: 0; -moz-transform: scale(.3); } 50% { opacity: 1; -moz-transform: scale(1.05); } 70% { -moz-transform: scale(.9); } 100% { -moz-transform: scale(1); } } @-o-keyframes bounceIn { 0% { opacity: 0; -o-transform: scale(.3); } 50% { opacity: 1; -o-transform: scale(1.05); } 70% { -o-transform: scale(.9); } 100% { -o-transform: scale(1); } } @keyframes bounceIn { 0% { opacity: 0; transform: scale(.3); } 50% { opacity: 1; transform: scale(1.05); } 70% { transform: scale(.9); } 100% { transform: scale(1); } } .bounceIn { -webkit-animation-name: bounceIn; -moz-animation-name: bounceIn; -o-animation-name: bounceIn; animation-name: bounceIn; } @-webkit-keyframes bounceInUp { 0% { opacity: 0; -webkit-transform: translateY(2000px); } 60% { opacity: 1; -webkit-transform: translateY(-30px); } 80% { -webkit-transform: translateY(10px); } 100% { -webkit-transform: translateY(0); } } @-moz-keyframes bounceInUp { 0% { opacity: 0; -moz-transform: translateY(2000px); } 60% { opacity: 1; -moz-transform: translateY(-30px); } 80% { -moz-transform: translateY(10px); } 100% { -moz-transform: translateY(0); } } @-o-keyframes bounceInUp { 0% { opacity: 0; -o-transform: translateY(2000px); } 60% { opacity: 1; -o-transform: translateY(-30px); } 80% { -o-transform: translateY(10px); } 100% { -o-transform: translateY(0); } } @keyframes bounceInUp { 0% { opacity: 0; transform: translateY(2000px); } 60% { opacity: 1; transform: translateY(-30px); } 80% { transform: translateY(10px); } 100% { transform: translateY(0); } } .bounceInUp { -webkit-animation-name: bounceInUp; -moz-animation-name: bounceInUp; -o-animation-name: bounceInUp; animation-name: bounceInUp; } @-webkit-keyframes bounceInDown { 0% { opacity: 0; -webkit-transform: translateY(-2000px); } 60% { opacity: 1; -webkit-transform: translateY(30px); } 80% { -webkit-transform: translateY(-10px); } 100% { -webkit-transform: translateY(0); } } @-moz-keyframes bounceInDown { 0% { opacity: 0; -moz-transform: translateY(-2000px); } 60% { opacity: 1; -moz-transform: translateY(30px); } 80% { -moz-transform: translateY(-10px); } 100% { -moz-transform: translateY(0); } } @-o-keyframes bounceInDown { 0% { opacity: 0; -o-transform: translateY(-2000px); } 60% { opacity: 1; -o-transform: translateY(30px); } 80% { -o-transform: translateY(-10px); } 100% { -o-transform: translateY(0); } } @keyframes bounceInDown { 0% { opacity: 0; transform: translateY(-2000px); } 60% { opacity: 1; transform: translateY(30px); } 80% { transform: translateY(-10px); } 100% { transform: translateY(0); } } .bounceInDown { -webkit-animation-name: bounceInDown; -moz-animation-name: bounceInDown; -o-animation-name: bounceInDown; animation-name: bounceInDown; } @-webkit-keyframes bounceInLeft { 0% { opacity: 0; -webkit-transform: translateX(-2000px); } 60% { opacity: 1; -webkit-transform: translateX(30px); } 80% { -webkit-transform: translateX(-10px); } 100% { -webkit-transform: translateX(0); } } @-moz-keyframes bounceInLeft { 0% { opacity: 0; -moz-transform: translateX(-2000px); } 60% { opacity: 1; -moz-transform: translateX(30px); } 80% { -moz-transform: translateX(-10px); } 100% { -moz-transform: translateX(0); } } @-o-keyframes bounceInLeft { 0% { opacity: 0; -o-transform: translateX(-2000px); } 60% { opacity: 1; -o-transform: translateX(30px); } 80% { -o-transform: translateX(-10px); } 100% { -o-transform: translateX(0); } } @keyframes bounceInLeft { 0% { opacity: 0; transform: translateX(-2000px); } 60% { opacity: 1; transform: translateX(30px); } 80% { transform: translateX(-10px); } 100% { transform: translateX(0); } } .bounceInLeft { -webkit-animation-name: bounceInLeft; -moz-animation-name: bounceInLeft; -o-animation-name: bounceInLeft; animation-name: bounceInLeft; } @-webkit-keyframes bounceInRight { 0% { opacity: 0; -webkit-transform: translateX(2000px); } 60% { opacity: 1; -webkit-transform: translateX(-30px); } 80% { -webkit-transform: translateX(10px); } 100% { -webkit-transform: translateX(0); } } @-moz-keyframes bounceInRight { 0% { opacity: 0; -moz-transform: translateX(2000px); } 60% { opacity: 1; -moz-transform: translateX(-30px); } 80% { -moz-transform: translateX(10px); } 100% { -moz-transform: translateX(0); } } @-o-keyframes bounceInRight { 0% { opacity: 0; -o-transform: translateX(2000px); } 60% { opacity: 1; -o-transform: translateX(-30px); } 80% { -o-transform: translateX(10px); } 100% { -o-transform: translateX(0); } } @keyframes bounceInRight { 0% { opacity: 0; transform: translateX(2000px); } 60% { opacity: 1; transform: translateX(-30px); } 80% { transform: translateX(10px); } 100% { transform: translateX(0); } } .bounceInRight { -webkit-animation-name: bounceInRight; -moz-animation-name: bounceInRight; -o-animation-name: bounceInRight; animation-name: bounceInRight; } @-webkit-keyframes bounceOut { 0% { -webkit-transform: scale(1); } 25% { -webkit-transform: scale(.95); } 50% { opacity: 1; -webkit-transform: scale(1.1); } 100% { opacity: 0; -webkit-transform: scale(.3); } } @-moz-keyframes bounceOut { 0% { -moz-transform: scale(1); } 25% { -moz-transform: scale(.95); } 50% { opacity: 1; -moz-transform: scale(1.1); } 100% { opacity: 0; -moz-transform: scale(.3); } } @-o-keyframes bounceOut { 0% { -o-transform: scale(1); } 25% { -o-transform: scale(.95); } 50% { opacity: 1; -o-transform: scale(1.1); } 100% { opacity: 0; -o-transform: scale(.3); } } @keyframes bounceOut { 0% { transform: scale(1); } 25% { transform: scale(.95); } 50% { opacity: 1; transform: scale(1.1); } 100% { opacity: 0; transform: scale(.3); } } .bounceOut { -webkit-animation-name: bounceOut; -moz-animation-name: bounceOut; -o-animation-name: bounceOut; animation-name: bounceOut; } @-webkit-keyframes bounceOutUp { 0% { -webkit-transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(20px); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); } } @-moz-keyframes bounceOutUp { 0% { -moz-transform: translateY(0); } 20% { opacity: 1; -moz-transform: translateY(20px); } 100% { opacity: 0; -moz-transform: translateY(-2000px); } } @-o-keyframes bounceOutUp { 0% { -o-transform: translateY(0); } 20% { opacity: 1; -o-transform: translateY(20px); } 100% { opacity: 0; -o-transform: translateY(-2000px); } } @keyframes bounceOutUp { 0% { transform: translateY(0); } 20% { opacity: 1; transform: translateY(20px); } 100% { opacity: 0; transform: translateY(-2000px); } } .bounceOutUp { -webkit-animation-name: bounceOutUp; -moz-animation-name: bounceOutUp; -o-animation-name: bounceOutUp; animation-name: bounceOutUp; } @-webkit-keyframes bounceOutDown { 0% { -webkit-transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(-20px); } 100% { opacity: 0; -webkit-transform: translateY(2000px); } } @-moz-keyframes bounceOutDown { 0% { -moz-transform: translateY(0); } 20% { opacity: 1; -moz-transform: translateY(-20px); } 100% { opacity: 0; -moz-transform: translateY(2000px); } } @-o-keyframes bounceOutDown { 0% { -o-transform: translateY(0); } 20% { opacity: 1; -o-transform: translateY(-20px); } 100% { opacity: 0; -o-transform: translateY(2000px); } } @keyframes bounceOutDown { 0% { transform: translateY(0); } 20% { opacity: 1; transform: translateY(-20px); } 100% { opacity: 0; transform: translateY(2000px); } } .bounceOutDown { -webkit-animation-name: bounceOutDown; -moz-animation-name: bounceOutDown; -o-animation-name: bounceOutDown; animation-name: bounceOutDown; } @-webkit-keyframes bounceOutLeft { 0% { -webkit-transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(20px); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); } } @-moz-keyframes bounceOutLeft { 0% { -moz-transform: translateX(0); } 20% { opacity: 1; -moz-transform: translateX(20px); } 100% { opacity: 0; -moz-transform: translateX(-2000px); } } @-o-keyframes bounceOutLeft { 0% { -o-transform: translateX(0); } 20% { opacity: 1; -o-transform: translateX(20px); } 100% { opacity: 0; -o-transform: translateX(-2000px); } } @keyframes bounceOutLeft { 0% { transform: translateX(0); } 20% { opacity: 1; transform: translateX(20px); } 100% { opacity: 0; transform: translateX(-2000px); } } .bounceOutLeft { -webkit-animation-name: bounceOutLeft; -moz-animation-name: bounceOutLeft; -o-animation-name: bounceOutLeft; animation-name: bounceOutLeft; } @-webkit-keyframes bounceOutRight { 0% { -webkit-transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(-20px); } 100% { opacity: 0; -webkit-transform: translateX(2000px); } } @-moz-keyframes bounceOutRight { 0% { -moz-transform: translateX(0); } 20% { opacity: 1; -moz-transform: translateX(-20px); } 100% { opacity: 0; -moz-transform: translateX(2000px); } } @-o-keyframes bounceOutRight { 0% { -o-transform: translateX(0); } 20% { opacity: 1; -o-transform: translateX(-20px); } 100% { opacity: 0; -o-transform: translateX(2000px); } } @keyframes bounceOutRight { 0% { transform: translateX(0); } 20% { opacity: 1; transform: translateX(-20px); } 100% { opacity: 0; transform: translateX(2000px); } } .bounceOutRight { -webkit-animation-name: bounceOutRight; -moz-animation-name: bounceOutRight; -o-animation-name: bounceOutRight; animation-name: bounceOutRight; } @-webkit-keyframes rotateIn { 0% { -webkit-transform-origin: center center; -webkit-transform: rotate(-200deg); opacity: 0; } 100% { -webkit-transform-origin: center center; -webkit-transform: rotate(0); opacity: 1; } } @-moz-keyframes rotateIn { 0% { -moz-transform-origin: center center; -moz-transform: rotate(-200deg); opacity: 0; } 100% { -moz-transform-origin: center center; -moz-transform: rotate(0); opacity: 1; } } @-o-keyframes rotateIn { 0% { -o-transform-origin: center center; -o-transform: rotate(-200deg); opacity: 0; } 100% { -o-transform-origin: center center; -o-transform: rotate(0); opacity: 1; } } @keyframes rotateIn { 0% { transform-origin: center center; transform: rotate(-200deg); opacity: 0; } 100% { transform-origin: center center; transform: rotate(0); opacity: 1; } } .rotateIn { -webkit-animation-name: rotateIn; -moz-animation-name: rotateIn; -o-animation-name: rotateIn; animation-name: rotateIn; } @-webkit-keyframes rotateInUpLeft { 0% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(90deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(0); opacity: 1; } } @-moz-keyframes rotateInUpLeft { 0% { -moz-transform-origin: left bottom; -moz-transform: rotate(90deg); opacity: 0; } 100% { -moz-transform-origin: left bottom; -moz-transform: rotate(0); opacity: 1; } } @-o-keyframes rotateInUpLeft { 0% { -o-transform-origin: left bottom; -o-transform: rotate(90deg); opacity: 0; } 100% { -o-transform-origin: left bottom; -o-transform: rotate(0); opacity: 1; } } @keyframes rotateInUpLeft { 0% { transform-origin: left bottom; transform: rotate(90deg); opacity: 0; } 100% { transform-origin: left bottom; transform: rotate(0); opacity: 1; } } .rotateInUpLeft { -webkit-animation-name: rotateInUpLeft; -moz-animation-name: rotateInUpLeft; -o-animation-name: rotateInUpLeft; animation-name: rotateInUpLeft; } @-webkit-keyframes rotateInDownLeft { 0% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(-90deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(0); opacity: 1; } } @-moz-keyframes rotateInDownLeft { 0% { -moz-transform-origin: left bottom; -moz-transform: rotate(-90deg); opacity: 0; } 100% { -moz-transform-origin: left bottom; -moz-transform: rotate(0); opacity: 1; } } @-o-keyframes rotateInDownLeft { 0% { -o-transform-origin: left bottom; -o-transform: rotate(-90deg); opacity: 0; } 100% { -o-transform-origin: left bottom; -o-transform: rotate(0); opacity: 1; } } @keyframes rotateInDownLeft { 0% { transform-origin: left bottom; transform: rotate(-90deg); opacity: 0; } 100% { transform-origin: left bottom; transform: rotate(0); opacity: 1; } } .rotateInDownLeft { -webkit-animation-name: rotateInDownLeft; -moz-animation-name: rotateInDownLeft; -o-animation-name: rotateInDownLeft; animation-name: rotateInDownLeft; } @-webkit-keyframes rotateInUpRight { 0% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(-90deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(0); opacity: 1; } } @-moz-keyframes rotateInUpRight { 0% { -moz-transform-origin: right bottom; -moz-transform: rotate(-90deg); opacity: 0; } 100% { -moz-transform-origin: right bottom; -moz-transform: rotate(0); opacity: 1; } } @-o-keyframes rotateInUpRight { 0% { -o-transform-origin: right bottom; -o-transform: rotate(-90deg); opacity: 0; } 100% { -o-transform-origin: right bottom; -o-transform: rotate(0); opacity: 1; } } @keyframes rotateInUpRight { 0% { transform-origin: right bottom; transform: rotate(-90deg); opacity: 0; } 100% { transform-origin: right bottom; transform: rotate(0); opacity: 1; } } .rotateInUpRight { -webkit-animation-name: rotateInUpRight; -moz-animation-name: rotateInUpRight; -o-animation-name: rotateInUpRight; animation-name: rotateInUpRight; } @-webkit-keyframes rotateInDownRight { 0% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(90deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(0); opacity: 1; } } @-moz-keyframes rotateInDownRight { 0% { -moz-transform-origin: right bottom; -moz-transform: rotate(90deg); opacity: 0; } 100% { -moz-transform-origin: right bottom; -moz-transform: rotate(0); opacity: 1; } } @-o-keyframes rotateInDownRight { 0% { -o-transform-origin: right bottom; -o-transform: rotate(90deg); opacity: 0; } 100% { -o-transform-origin: right bottom; -o-transform: rotate(0); opacity: 1; } } @keyframes rotateInDownRight { 0% { transform-origin: right bottom; transform: rotate(90deg); opacity: 0; } 100% { transform-origin: right bottom; transform: rotate(0); opacity: 1; } } .rotateInDownRight { -webkit-animation-name: rotateInDownRight; -moz-animation-name: rotateInDownRight; -o-animation-name: rotateInDownRight; animation-name: rotateInDownRight; } @-webkit-keyframes rotateOut { 0% { -webkit-transform-origin: center center; -webkit-transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: center center; -webkit-transform: rotate(200deg); opacity: 0; } } @-moz-keyframes rotateOut { 0% { -moz-transform-origin: center center; -moz-transform: rotate(0); opacity: 1; } 100% { -moz-transform-origin: center center; -moz-transform: rotate(200deg); opacity: 0; } } @-o-keyframes rotateOut { 0% { -o-transform-origin: center center; -o-transform: rotate(0); opacity: 1; } 100% { -o-transform-origin: center center; -o-transform: rotate(200deg); opacity: 0; } } @keyframes rotateOut { 0% { transform-origin: center center; transform: rotate(0); opacity: 1; } 100% { transform-origin: center center; transform: rotate(200deg); opacity: 0; } } .rotateOut { -webkit-animation-name: rotateOut; -moz-animation-name: rotateOut; -o-animation-name: rotateOut; animation-name: rotateOut; } @-webkit-keyframes rotateOutUpLeft { 0% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(-90deg); opacity: 0; } } @-moz-keyframes rotateOutUpLeft { 0% { -moz-transform-origin: left bottom; -moz-transform: rotate(0); opacity: 1; } 100% { -moz-transform-origin: left bottom; -moz-transform: rotate(-90deg); opacity: 0; } } @-o-keyframes rotateOutUpLeft { 0% { -o-transform-origin: left bottom; -o-transform: rotate(0); opacity: 1; } 100% { -o-transform-origin: left bottom; -o-transform: rotate(-90deg); opacity: 0; } } @keyframes rotateOutUpLeft { 0% { transform-origin: left bottom; transform: rotate(0); opacity: 1; } 100% { transform-origin: left bottom; transform: rotate(-90deg); opacity: 0; } } .rotateOutUpLeft { -webkit-animation-name: rotateOutUpLeft; -moz-animation-name: rotateOutUpLeft; -o-animation-name: rotateOutUpLeft; animation-name: rotateOutUpLeft; } @-webkit-keyframes rotateOutDownLeft { 0% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(90deg); opacity: 0; } } @-moz-keyframes rotateOutDownLeft { 0% { -moz-transform-origin: left bottom; -moz-transform: rotate(0); opacity: 1; } 100% { -moz-transform-origin: left bottom; -moz-transform: rotate(90deg); opacity: 0; } } @-o-keyframes rotateOutDownLeft { 0% { -o-transform-origin: left bottom; -o-transform: rotate(0); opacity: 1; } 100% { -o-transform-origin: left bottom; -o-transform: rotate(90deg); opacity: 0; } } @keyframes rotateOutDownLeft { 0% { transform-origin: left bottom; transform: rotate(0); opacity: 1; } 100% { transform-origin: left bottom; transform: rotate(90deg); opacity: 0; } } .rotateOutDownLeft { -webkit-animation-name: rotateOutDownLeft; -moz-animation-name: rotateOutDownLeft; -o-animation-name: rotateOutDownLeft; animation-name: rotateOutDownLeft; } @-webkit-keyframes rotateOutUpRight { 0% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(90deg); opacity: 0; } } @-moz-keyframes rotateOutUpRight { 0% { -moz-transform-origin: right bottom; -moz-transform: rotate(0); opacity: 1; } 100% { -moz-transform-origin: right bottom; -moz-transform: rotate(90deg); opacity: 0; } } @-o-keyframes rotateOutUpRight { 0% { -o-transform-origin: right bottom; -o-transform: rotate(0); opacity: 1; } 100% { -o-transform-origin: right bottom; -o-transform: rotate(90deg); opacity: 0; } } @keyframes rotateOutUpRight { 0% { transform-origin: right bottom; transform: rotate(0); opacity: 1; } 100% { transform-origin: right bottom; transform: rotate(90deg); opacity: 0; } } .rotateOutUpRight { -webkit-animation-name: rotateOutUpRight; -moz-animation-name: rotateOutUpRight; -o-animation-name: rotateOutUpRight; animation-name: rotateOutUpRight; } @-webkit-keyframes rotateOutDownRight { 0% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(-90deg); opacity: 0; } } @-moz-keyframes rotateOutDownRight { 0% { -moz-transform-origin: right bottom; -moz-transform: rotate(0); opacity: 1; } 100% { -moz-transform-origin: right bottom; -moz-transform: rotate(-90deg); opacity: 0; } } @-o-keyframes rotateOutDownRight { 0% { -o-transform-origin: right bottom; -o-transform: rotate(0); opacity: 1; } 100% { -o-transform-origin: right bottom; -o-transform: rotate(-90deg); opacity: 0; } } @keyframes rotateOutDownRight { 0% { transform-origin: right bottom; transform: rotate(0); opacity: 1; } 100% { transform-origin: right bottom; transform: rotate(-90deg); opacity: 0; } } .rotateOutDownRight { -webkit-animation-name: rotateOutDownRight; -moz-animation-name: rotateOutDownRight; -o-animation-name: rotateOutDownRight; animation-name: rotateOutDownRight; } @-webkit-keyframes hinge { 0% { -webkit-transform: rotate(0); -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; } 20%, 60% { -webkit-transform: rotate(80deg); -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; } 40% { -webkit-transform: rotate(60deg); -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; } 80% { -webkit-transform: rotate(60deg) translateY(0); opacity: 1; -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; } 100% { -webkit-transform: translateY(700px); opacity: 0; } } @-moz-keyframes hinge { 0% { -moz-transform: rotate(0); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; } 20%, 60% { -moz-transform: rotate(80deg); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; } 40% { -moz-transform: rotate(60deg); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; } 80% { -moz-transform: rotate(60deg) translateY(0); opacity: 1; -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; } 100% { -moz-transform: translateY(700px); opacity: 0; } } @-o-keyframes hinge { 0% { -o-transform: rotate(0); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; } 20%, 60% { -o-transform: rotate(80deg); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; } 40% { -o-transform: rotate(60deg); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; } 80% { -o-transform: rotate(60deg) translateY(0); opacity: 1; -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; } 100% { -o-transform: translateY(700px); opacity: 0; } } @keyframes hinge { 0% { transform: rotate(0); transform-origin: top left; animation-timing-function: ease-in-out; } 20%, 60% { transform: rotate(80deg); transform-origin: top left; animation-timing-function: ease-in-out; } 40% { transform: rotate(60deg); transform-origin: top left; animation-timing-function: ease-in-out; } 80% { transform: rotate(60deg) translateY(0); opacity: 1; transform-origin: top left; animation-timing-function: ease-in-out; } 100% { transform: translateY(700px); opacity: 0; } } .hinge { -webkit-animation-name: hinge; -moz-animation-name: hinge; -o-animation-name: hinge; animation-name: hinge; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes rollIn { 0% { opacity: 0; -webkit-transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); } } @-moz-keyframes rollIn { 0% { opacity: 0; -moz-transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -moz-transform: translateX(0px) rotate(0deg); } } @-o-keyframes rollIn { 0% { opacity: 0; -o-transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -o-transform: translateX(0px) rotate(0deg); } } @keyframes rollIn { 0% { opacity: 0; transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; transform: translateX(0px) rotate(0deg); } } .rollIn { -webkit-animation-name: rollIn; -moz-animation-name: rollIn; -o-animation-name: rollIn; animation-name: rollIn; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes rollOut {     0% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); }     100% { opacity: 0; -webkit-transform: translateX(100%) rotate(120deg); } } @-moz-keyframes rollOut {     0% { opacity: 1; -moz-transform: translateX(0px) rotate(0deg); }     100% { opacity: 0; -moz-transform: translateX(100%) rotate(120deg); } } @-o-keyframes rollOut {     0% { opacity: 1; -o-transform: translateX(0px) rotate(0deg); }     100% { opacity: 0; -o-transform: translateX(100%) rotate(120deg); } } @keyframes rollOut {     0% { opacity: 1; transform: translateX(0px) rotate(0deg); }     100% { opacity: 0; transform: translateX(100%) rotate(120deg); } } .rollOut { -webkit-animation-name: rollOut; -moz-animation-name: rollOut; -o-animation-name: rollOut; animation-name: rollOut; } /* originally authored by Angelo Rohit - https://github.com/angelorohit */ @-webkit-keyframes lightSpeedIn { 0% { -webkit-transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% { -webkit-transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% { -webkit-transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% { -webkit-transform: translateX(0%) skewX(0deg); opacity: 1; } } @-moz-keyframes lightSpeedIn { 0% { -moz-transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% { -moz-transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% { -moz-transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% { -moz-transform: translateX(0%) skewX(0deg); opacity: 1; } } @-o-keyframes lightSpeedIn { 0% { -o-transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% { -o-transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% { -o-transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% { -o-transform: translateX(0%) skewX(0deg); opacity: 1; } } @keyframes lightSpeedIn { 0% { transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% { transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% { transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% { transform: translateX(0%) skewX(0deg); opacity: 1; } } .lightSpeedIn {     -webkit-animation-name: lightSpeedIn;     -moz-animation-name: lightSpeedIn;     -o-animation-name: lightSpeedIn;     animation-name: lightSpeedIn;     -webkit-animation-timing-function: ease-out;     -moz-animation-timing-function: ease-out;     -o-animation-timing-function: ease-out;     animation-timing-function: ease-out; } .animated.lightSpeedIn {     -webkit-animation-duration: 0.5s;     -moz-animation-duration: 0.5s;     -o-animation-duration: 0.5s;     animation-duration: 0.5s; } /* originally authored by Angelo Rohit - https://github.com/angelorohit */ @-webkit-keyframes lightSpeedOut {     0% { -webkit-transform: translateX(0%) skewX(0deg); opacity: 1; } 100% { -webkit-transform: translateX(100%) skewX(-30deg); opacity: 0; } } @-moz-keyframes lightSpeedOut { 0% { -moz-transform: translateX(0%) skewX(0deg); opacity: 1; } 100% { -moz-transform: translateX(100%) skewX(-30deg); opacity: 0; } } @-o-keyframes lightSpeedOut { 0% { -o-transform: translateX(0%) skewX(0deg); opacity: 1; } 100% { -o-transform: translateX(100%) skewX(-30deg); opacity: 0; } } @keyframes lightSpeedOut { 0% { transform: translateX(0%) skewX(0deg); opacity: 1; } 100% { transform: translateX(100%) skewX(-30deg); opacity: 0; } } .lightSpeedOut {     -webkit-animation-name: lightSpeedOut;     -moz-animation-name: lightSpeedOut;     -o-animation-name: lightSpeedOut;     animation-name: lightSpeedOut;     -webkit-animation-timing-function: ease-in;     -moz-animation-timing-function: ease-in;     -o-animation-timing-function: ease-in;     animation-timing-function: ease-in; } .animated.lightSpeedOut {     -webkit-animation-duration: 0.25s;     -moz-animation-duration: 0.25s;     -o-animation-duration: 0.25s;     animation-duration: 0.25s; } /* originally authored by Angelo Rohit - https://github.com/angelorohit */ @-webkit-keyframes wiggle {     0% { -webkit-transform: skewX(9deg); }     10% { -webkit-transform: skewX(-8deg); }     20% { -webkit-transform: skewX(7deg); }     30% { -webkit-transform: skewX(-6deg); }     40% { -webkit-transform: skewX(5deg); }     50% { -webkit-transform: skewX(-4deg); }     60% { -webkit-transform: skewX(3deg); }     70% { -webkit-transform: skewX(-2deg); }     80% { -webkit-transform: skewX(1deg); }     90% { -webkit-transform: skewX(0deg); } 100% { -webkit-transform: skewX(0deg); } } @-moz-keyframes wiggle {     0% { -moz-transform: skewX(9deg); }     10% { -moz-transform: skewX(-8deg); }     20% { -moz-transform: skewX(7deg); }     30% { -moz-transform: skewX(-6deg); }     40% { -moz-transform: skewX(5deg); }     50% { -moz-transform: skewX(-4deg); }     60% { -moz-transform: skewX(3deg); }     70% { -moz-transform: skewX(-2deg); }     80% { -moz-transform: skewX(1deg); }     90% { -moz-transform: skewX(0deg); } 100% { -moz-transform: skewX(0deg); } } @-o-keyframes wiggle {     0% { -o-transform: skewX(9deg); }     10% { -o-transform: skewX(-8deg); }     20% { -o-transform: skewX(7deg); }     30% { -o-transform: skewX(-6deg); }     40% { -o-transform: skewX(5deg); }     50% { -o-transform: skewX(-4deg); }     60% { -o-transform: skewX(3deg); }     70% { -o-transform: skewX(-2deg); }     80% { -o-transform: skewX(1deg); }     90% { -o-transform: skewX(0deg); } 100% { -o-transform: skewX(0deg); } } @keyframes wiggle {     0% { transform: skewX(9deg); }     10% { transform: skewX(-8deg); }     20% { transform: skewX(7deg); }     30% { transform: skewX(-6deg); }     40% { transform: skewX(5deg); }     50% { transform: skewX(-4deg); }     60% { transform: skewX(3deg); }     70% { transform: skewX(-2deg); }     80% { transform: skewX(1deg); }     90% { transform: skewX(0deg); } 100% { transform: skewX(0deg); } } .wiggle {     -webkit-animation-name: wiggle;     -moz-animation-name: wiggle;     -o-animation-name: wiggle;     animation-name: wiggle;     -webkit-animation-timing-function: ease-in;     -moz-animation-timing-function: ease-in;     -o-animation-timing-function: ease-in;     animation-timing-function: ease-in; } .animated.wiggle {     -webkit-animation-duration: 0.75s;     -moz-animation-duration: 0.75s;     -o-animation-duration: 0.75s;     animation-duration: 0.75s; }&lt;/style&gt; &lt;!--banner--&gt; &lt;script src="/js/jquery.bxslider-rahisified.js"&gt;&lt;/script&gt; &lt;script src="/js/jquery.easing.1.3.js"&gt;&lt;/script&gt; &lt;!--[if lt IE 9]&gt; &lt;script src="/js/html5shiv.js"&gt;&lt;/script&gt; &lt;![endif]--&gt; &lt;/head&gt; &lt;body marginwidth="0" marginheight="0" class="show"&gt; &lt;article id="cont" class="" style="text-align:center; margin:0 auto; padding:30px 0; width: 1100px; ;"&gt; &lt;!-- 컬러챠트 삽입 { --&gt; &lt;style media="" data-href="/colorbox/css/colorbox_iframe.css"&gt;/*# sourceURL=/colorbox/css/colorbox_iframe.css */ /*@ sourceURL=/colorbox/css/colorbox_iframe.css */ @import url("https://cdn.rawgit.com/theeluwin/NotoSansKR-Hestia/master/stylesheets/NotoSansKR-Hestia.css"); body {margin:0;padding:0;} #behr_colorbox {width:850px; font-family: "Noto Sans Korean", "NotoSans", sans-serif,"dotum"; overflow: hidden;position: relative; font-size: 12px;  line-height: 1.2; text-align: left; z-index: 9999;} #behr_colorbox * {margin:0; padding: 0; vertical-align: top;} #behr_colorbox a {outline: none; text-decoration: none; cursor: pointer;} #behr_colorbox img {border:0;} #behr_colorbox ul {list-style: none;} #behr_colorbox .behr_monitor {width: 570px; border:2px solid #e6e6e5; min-height: 846px; margin-top: 52px; float: left; margin-left: 15px;} #behr_colorbox .behr_monitor .behr_color_menu {padding:33px 2px 25px;} #behr_colorbox .behr_monitor .behr_color_menu ul {font-size: 0} #behr_colorbox .behr_monitor .behr_color_menu ul li {display: inline-block; width: 11%; font-size: 12px;height: 49px; position: relative; vertical-align: top;} #behr_colorbox .behr_monitor .behr_color_menu ul li a {display: block; text-align: center; position: absolute; top:0; left:0; width: 100%; bottom:0; } #behr_colorbox .behr_inner {width: 540px} #behr_colorbox .behr_nav {position: absolute; top:0; left: 15px; height: 52px;} #behr_colorbox .behr_nav ul {overflow: hidden; position: absolute; bottom:0; left: 0; width: 582px;} #behr_colorbox .behr_nav ul li {float: left; height: 52px; position: relative;width: 108px;} #behr_colorbox .behr_nav ul li a {display: block; width: 108px; background: #e6e6e5; text-align: center; position: relative; bottom: 0; position: absolute; left:0; border-radius: 6px 6px 0 0; color:#535353; height: 42px;line-height: 42px; font-size:12px;} #behr_colorbox .behr_nav ul li:nth-child(odd) a {background:#f2f2f2;} #behr_colorbox .behr_nav ul li a.active {background: #535353; color:#fff; height: 52px; line-height: 58px; font-size: 14px} #behr_colorbox .behr_selectColor {width: 240px; float: right; margin-right: 15px;} #behr_colorbox .behr_selectColor h3 {height: 52px; background: #535353; color:#fff; font-size: 18px; text-align: center; line-height: 58px; font-weight: 400; border-radius: 5px 5px 0 0} #behr_colorbox .behr_palette {background: #e6e6e5; min-height: 850px;}  #behr_colorbox .behr_palette_guide { font-size: 11px; color: #535353; line-height: 20px; font-weight: 300; padding:12px 11px; border-bottom:1px solid #fff;}  #behr_colorbox .behr_colorChart {overflow:hidden; overflow-y:scroll; height: 600px;  position: relative;} #behr_colorbox .behr_colorChart.bhallcolors {margin-top: 65px;} #behr_colorbox .loading {position: absolute; top:160px; left:0; width: 580px; bottom:0; z-index: 998; background: rgba(256,256,256,0.8); text-align: center;} #behr_colorbox .loading img {padding-top:45%; } #behr_colorbox .cc_submenu a {cursor: pointer;} #behr_colorbox .behr_colorChart .cc-box {width: 60px; height: 40px; border-radius: 5px; overflow: hidden; display: inline-block; margin:4px; cursor: pointer;transition: transform 0.2s ease} #behr_colorbox .behr_colorChart .cc-box-none {width: 60px; height: 40px; overflow: hidden; display: inline-block; margin:4px;vertical-align: top;} #behr_colorbox .behr_colorChart .cc-box-img {width: 540px;  display: inline-block;margin:4px; margin-top: 20px; vertical-align: top;} #behr_colorbox .behr_colorChart .cc-box-img img {width: 100% !important;} #behr_colorbox .behr_colorChart .cc-box-imgbox {margin-bottom: 4px; height: 274px;} #behr_colorbox .behr_colorChart .cc-box-img .cc-box:nth-of-type(2) {margin-left: 0;} #behr_colorbox .behr_colorChart .cc-box-img .cc-box:nth-of-type(5) {margin-right: 0;} #behr_colorbox .behr_colorChart .cc-box .cc-name {display: none;} #behr_colorbox .behr_colorChart .cc-box:hover {transform: scale(1.1); } #behr_colorbox .behr_colorChart .cc-box.active {background-image: url("https://behr.kr/colorbox/css/../icon/chk.png") !important; background-position:  50% 50% !important; background-repeat: no-repeat !important;} #behr_colorbox .behr_colorChart .cc-box.activeb {background-image: url("https://behr.kr/colorbox/css/../icon/chk_b.png") !important; background-position:  50% 50% !important; background-repeat: no-repeat !important;} #behr_colorbox #behr_palette_save .cc-box { position: relative; padding:12px 0; margin:0 12px; border-bottom:1px solid #fff; overflow: hidden; min-height: 57px; box-sizing: border-box; cursor: pointer;} #behr_colorbox #behr_palette_save .cc-box .cc-view {display: block; width: 40px; height: 40px;border-radius: 5px; position: absolute; top:12px; left:0; z-index: 3;} #behr_colorbox #behr_palette_save .cc-box .cc-name {font-size:12px; padding-left: 52px;padding-top: 1px; color: #535353; padding-right: 40px} #behr_colorbox #behr_palette_save .cc-box .cc-name span {display: block; font-size:15px; padding-top: 0px; font-weight: bold;} #behr_colorbox #behr_palette_save .cc-box .palette_del {position: absolute; top:24px; right:15px; cursor: pointer; width: 20px; height: 20px; background: url("https://behr.kr/colorbox/css/../icon/close.png") no-repeat 0 0; overflow: hidden; text-align: left; text-indent: -9999px;} #behr_colorbox #behr_palette_save .cc-box .palette_del:hover {background-position: 0 -20px;} #behr_colorbox .wh-ov {background: #fff; opacity: 0.7; position: fixed; top:0; left:0; bottom:0; right: 0; width: 100%; height: 100%; z-index: 9998; display: none} #detailCanvas {background: url("https://behr.kr/colorbox/css/../icon/detail_iframe.png") no-repeat 0 0; width: 1050px; height: 850px; z-index: 9999; position: absolute; top:28px; left: 25px; display: none} #detailCanvas a.detailCanvas_close {position: absolute; top:3px; left: 771px; width: 26px; height: 26px; display: block; overflow: hidden; text-indent: -999px; text-align: left; cursor: pointer;} #detailCanvas #detailCanvas_list {position: absolute; top:30px; left: 232px; overflow: hidden; height: 60px; width: 540px; padding-top: 5px; padding-left: 5px;} #detailCanvas #detailCanvas_list .cc-box {float: left; margin-right: 5px;width: 43px; height: 43px; display: block; position: relative; cursor: pointer;border-radius: 5px; margin-bottom: 5px} #detailCanvas #detailCanvas_list .cc-box .cc-view {position: relative;width: 43px; height: 43px; border-radius: 5px; display: block; top:0; left:0;position: absolute;} #detailCanvas #detailCanvas_list .cc-box.active .cc-view  {border:4px solid  #3f3e3e;  top:-4px; left:-4px; z-index: 3;} #detailCanvas #detailCanvas_list .cc-box:hover .cc-view {transform: scale(1.1);} #detailCanvas #detailCanvas_list .cc-box.active:hover .cc-view {transform: scale(1);} #detailCanvas #detailCanvas_list .cc-box .cc-name, #detailCanvas #detailCanvas_list .cc-box .palette_del {display:none;} #detailCanvas #detailCanvas_view {width: 540px; height: 200px; display: block; position: absolute; top:100px; left: 237px;} #detailCanvas #detailCanvas_view .cc-box .cc-view {position: absolute; top:0; left: 0; right: 0; bottom: 0; z-index: -1;} #detailCanvas #detailCanvas_view .cc-box .cc-name {padding:30px 35px 18px; font-size:30px; color:#fff; font-weight: bold;} #detailCanvas #detailCanvas_view .cc-box .cc-name span {display: block;font-weight: normal; font-size: 22px; color:#fff;} #detailCanvas #detailCanvas_view .cc-box[data-tcol=B] .cc-name,  #detailCanvas #detailCanvas_view .cc-box[data-tcol=B] .cc-name span {color:#333;} #detailCanvas #detailCanvas_view .cc-box .palette_del {display: none;} #detailCanvas #detailCanvas_view .cc-box .detailColorvs_buyBtn {display: none; bottom:10px; left:233px;} #detailCanvas #detailCanvas_view:hover .cc-box .detailColorvs_buyBtn {display: block;} #detailCanvas .detailCanvas_btn {display: block;width: 174px; height: 53px; position: absolute; top:319px; cursor: pointer; text-indent: -999px; text-align: left; overflow: hidden; } #detailCanvas .detailCanvas_btn01 {left: 237px;} #detailCanvas .detailCanvas_btn02 {left: 419px;} #detailCanvas .detailCanvas_btn03 {left: 602px;} #detailCanvas .detailCanvas_btn:hover {background: url("https://behr.kr/colorbox/css/../icon/btn_hover_iframe.gif") no-repeat 0 0;} #detailCanvas .detailCanvas_view {display: block; width: 175px; position: absolute; top:388px; height: 237px;} #detailCanvas .detailCanvas_view01 {left: 237px;} #detailCanvas .detailCanvas_view02 {left: 419px;} #detailCanvas .detailCanvas_view03 {left: 602px;} #detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .cc-view {position: absolute; top:0; left: 0; right: 0; bottom: 0; z-index: -1;} #detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .cc-name {padding:25px 40px 18px 5px; font-size:16px; color:#fff; font-weight: bold;} #detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .cc-name span {display: block;font-weight: normal; font-size: 15px; color:#fff;} #detailCanvas #detailCanvas_color .detailCanvas_view .cc-box[data-tcol=B] .cc-name,  #detailCanvas #detailCanvas_color .detailCanvas_view .cc-box[data-tcol=B] .cc-name span {color:#333;} #detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .palette_del {display: none; } #detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .detailColorvs_buyBtn {display: none; top:140px;left:50px;} #detailCanvas #detailCanvas_color .detailCanvas_view01:hover .cc-box .detailColorvs_buyBtn {display: block;} #detailCanvas #detailCanvas_color .detailCanvas_view02:hover .cc-box .detailColorvs_buyBtn {display: block;} #detailCanvas #detailCanvas_color .detailCanvas_view03:hover .cc-box .detailColorvs_buyBtn {display: block;} #detailCanvas .detailColorvs_buyBtn {cursor: pointer; width: 74px; height: 74px; background: url("https://behr.kr/colorbox/css/../icon/cart.png") no-repeat 0 0; text-align: left; text-indent: -9999px; overflow: hidden; position: absolute; } /*검색결과*/ #behr_colorbox #cc_search_area {display: none; position: absolute; height: 104px; top:54px; left: 17px; width: 540px; background: #fff;} #behr_colorbox #cc_search_area .cc_search {display: block; background: url("https://behr.kr/colorbox/css/../icon/ccsearch_iframe.jpg") no-repeat 0 0; width: 500px; height: 50px; position: absolute; top:33px; left:44px;} #behr_colorbox #cc_search_area .cc_search label {display: inline-block; width: 100px; line-height: 50px; font-size: 18px; color:#535353; text-align: center; } #behr_colorbox #cc_search_area .cc_search input {display: inline-block;width:308px; height: 48px; line-height: 48px; border:0; background: #fff; font-size: 14px; color:#535353; padding: 0 20px; box-sizing: border-box; margin-top: 1px;} #behr_colorbox #cckeywordauto {position: absolute; top:92px; width: 550px; text-align: center;} #behr_colorbox #cckeywordauto ul {text-align: center; font-size: 0;} #behr_colorbox #cckeywordauto ul li {display: inline-block; background: #e6e6e5; border-radius: 5px; padding:5px 8px; font-size:14px; color:#535353; margin:0 2px;} #behr_colorbox #cckeywordauto ul li:nth-child(odd) {background: #f2f2f2;} #behr_colorbox #cckeywordauto ul li a {cursor: pointer; font-weight: 100} #ccsearchOutput {background: #535353; color:#fff; padding:0 14px; line-height: 41px; height: 41px; box-sizing: border-box; position: absolute; top:143px; left:20px; right: 20px;} #ccsearchOutput span {vertical-align: bottom; font-size:22px; margin-right: 8px; display: inline-block;} #behr_colorbox.namelist .behr_colorChart .cc-box {width: 80px; height: 60px; display: inline-block; overflow: visible; position: relative; margin:10px 175px 10px 20px; position: relative; transition: none;} #behr_colorbox.namelist .behr_colorChart .cc-box:before {content: ''; display: block; position: absolute; background:#ddd; width: 230px; height: 1px; bottom:-10px; left:0;} #behr_colorbox.namelist .behr_colorChart .cc-box:hover {transform: scale(1);} #behr_colorbox.namelist .behr_colorChart .cc-name { position: absolute; left: 87px; top:6px; display: block; width: 210px; font-size: 14px; color:#535353;} #behr_colorbox.namelist .behr_colorChart .cc-name span {display: block;} #behr_colorbox.namelist .behr_colorChart {margin-top: 78px !important; height: 660px !important;} #behr_colorbox.namelist .loading {top:238px;} #behr_colorbox.all_colors .behr_colorChart {margin-top: 65px;} /*메뉴별 모양*/ #behr_colorbox .behr_color_menu a {color: transparent;} /*1.all colors메뉴*/ #behr_colorbox.all_colors .behr_color_menu a.bh_colornav0 {background: #b1383d;} #behr_colorbox.all_colors .behr_color_menu a.bh_colornav1 {background: #d3533a} #behr_colorbox.all_colors .behr_color_menu a.bh_colornav2 {background: #ffcb3a} #behr_colorbox.all_colors .behr_color_menu a.bh_colornav3 {background: #4f725a} #behr_colorbox.all_colors .behr_color_menu a.bh_colornav4 {background: #006993} /*#behr_colorbox.all_colors .behr_color_menu a.bh_colornav5 {background: #86b9b2}*/ #behr_colorbox.all_colors .behr_color_menu a.bh_colornav5 {background: #7f657e} #behr_colorbox.all_colors .behr_color_menu a.bh_colornav6 {background: #a99884} #behr_colorbox.all_colors .behr_color_menu a.bh_colornav7 {background: #818181} #behr_colorbox.all_colors .behr_color_menu a.bh_colornav8 {background: #f1f1f1} /*2.best coloes 메뉴*/ #behr_colorbox.best_colors .behr_color_menu a.bh_colornav0 {background: #b1383d;} #behr_colorbox.best_colors .behr_color_menu a.bh_colornav1 {background: #d3533a} #behr_colorbox.best_colors .behr_color_menu a.bh_colornav2 {background: #ffcb3a} #behr_colorbox.best_colors .behr_color_menu a.bh_colornav3 {background: #4f725a} #behr_colorbox.best_colors .behr_color_menu a.bh_colornav4 {background: #006993} /*#behr_colorbox.best_colors .behr_color_menu a.bh_colornav5 {background: #86b9b2}*/ #behr_colorbox.best_colors .behr_color_menu a.bh_colornav5 {background: #7f657e} #behr_colorbox.best_colors .behr_color_menu a.bh_colornav6 {background: #a99884} #behr_colorbox.best_colors .behr_color_menu a.bh_colornav7 {background: #818181} #behr_colorbox.best_colors .behr_color_menu a.bh_colornav8 {background: #f1f1f1} /*3. by booms 메뉴*/ #behr_colorbox.by_rooms .behr_monitor .behr_color_menu ul li {width: 67px;} #behr_colorbox.by_rooms .behr_color_menu a {background:#f2f2f2 url("https://behr.kr/colorbox/css/../icon/byroom.png") no-repeat;} #behr_colorbox.by_rooms .behr_color_menu ul li:nth-child(odd) a {background-color:#e6e6e6;} #behr_colorbox.by_rooms .behr_color_menu a.bh_colornav0 {background-position: 0 0 !important; } #behr_colorbox.by_rooms .behr_color_menu a.bh_colornav1 {background-position: -99px 0 !important; } #behr_colorbox.by_rooms .behr_color_menu a.bh_colornav2 {background-position: -198px 0 !important; } #behr_colorbox.by_rooms .behr_color_menu a.bh_colornav3 {background-position: -297px 0 !important; } #behr_colorbox.by_rooms .behr_color_menu a.bh_colornav4 {background-position: -396px 0 !important; } #behr_colorbox.by_rooms .behr_color_menu a.bh_colornav5 {background-position: -495px 0 !important; } #behr_colorbox.by_rooms .behr_color_menu a.bh_colornav6 {background-position: -594px 0 !important; } #behr_colorbox.by_rooms .behr_color_menu a.bh_colornav7 {background-position: -693px 0 !important; } /*4. by styles 메뉴*/ #behr_colorbox.by_styles .behr_monitor .behr_color_menu ul li {width: 67px;} #behr_colorbox.by_styles .behr_color_menu a {background:#f2f2f2; position: relative;} #behr_colorbox.by_styles .behr_color_menu ul li:nth-child(odd) a {background-color:#e6e6e6;} #behr_colorbox.by_styles .behr_color_menu a span {color:#535353; line-height: 49px;font-size: 12px; letter-spacing: -0.02em} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav0 span {color:#9f9480;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav1 span {color:#4fb3d0;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav2 span {color:#88a379;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav3 span {color:#848595;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav4 span {color:#81242b;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav5 span {color:#c1a889;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav6 span {color:#64a093;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav7 span {color:#839894;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav0.active {background:#9f9480;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav1.active {background:#4fb3d0;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav2.active {background:#88a379;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav3.active {background:#848595;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav4.active {background:#81242b;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav5.active {background:#c1a889;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav6.active {background:#64a093;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav7.active {background:#839894;} #behr_colorbox.by_styles .behr_color_menu a.active span {color:#fff !important;line-height: 60px;} #behr_colorbox.by_styles .behr_color_menu a.active {height: 60px; margin-top: -5px;border-radius: 5px; } #behr_colorbox.all_colors .behr_color_menu a.active, #behr_colorbox.best_colors .behr_color_menu a.active {background-image: url("https://behr.kr/colorbox/css/../icon/check.png"); background-repeat: no-repeat; background-position: 50% 50%; height: 60px; margin-top: -5px; border-radius: 5px; } #behr_colorbox.by_rooms .behr_color_menu ul li a:hover {background-color: #535353; border-radius: 5px; } #behr_colorbox.by_rooms .behr_color_menu ul li a span {position: absolute; top:-20px; text-align: center; color:#535353; width: 100%; left: 0; display:none;} #behr_colorbox.by_rooms .behr_color_menu ul li a:hover span, #behr_colorbox.by_rooms .behr_color_menu ul li a.active span {position: absolute; top:-20px; text-align: center; display: block; color:#535353; width: 100%; left: 0;} #behr_colorbox.by_rooms .behr_color_menu ul li a.active {background-color: #535353; height: 60px; margin-top: -5px; border-radius: 5px;} #behr_colorbox.by_rooms .behr_color_menu a.active:after, #behr_colorbox.by_styles .behr_color_menu a.active:after {position:absolute; content: '';display: block; width: 100%; height: 100%; top:0; left: :0;  background-image: url("https://behr.kr/colorbox/css/../icon/check.png"); background-repeat: no-repeat; background-position: 50% 50%; height: 60px; margin-top: -5px; border-radius: 5px; } #behr_colorbox.by_styles .behr_color_menu ul li a u {position: absolute; top:-20px; text-align: center; color:#535353; width: 100%; left: 0; display:none; text-decoration: none;} #behr_colorbox.by_styles .behr_color_menu ul li a:hover u, #behr_colorbox.by_styles .behr_color_menu ul li a.active u {position: absolute; top:-20px; text-align: center; display: block; color:#535353; width: 100%; left: 0;} #behr_colorbox .cc_more_btn {position: absolute; left:184px; width: 208px; text-align: center;} #behr_colorbox .cc_more_btn a {display: block; height: 37px; width: 208px; color: #535353; cursor: pointer;} #behr_colorbox .cc_more_btn a i {display: inline-block; width: 35px; height: 35px; border-radius: 50%; background: #f9f9f9; vertical-align: middle; margin:0 10px;} #behr_colorbox .cc_more_btn a span {display: inline-block; vertical-align: top; width: 50px; height: 35px; line-height: 31px; text-align: left;text-transform : capitalize} #behr_colorbox .cc_more_btn a i.red {background:#b1383d } #behr_colorbox .cc_more_btn a i.orange {background:#d3533a } #behr_colorbox .cc_more_btn a i.yellow {background: #ffcb3a} #behr_colorbox .cc_more_btn a i.green {background: #4f725a} #behr_colorbox .cc_more_btn a i.blue {background:#006993 } #behr_colorbox .cc_more_btn a i.mint {background: #86b9b2} #behr_colorbox .cc_more_btn a i.purple {background: #7f657e} #behr_colorbox .cc_more_btn.prev {top:167px;} #behr_colorbox .cc_more_btn.next {top:850px;} #behr_colorbox .cc_more_btn.prev a i {background-repeat: no-repeat; background-image: url("https://behr.kr/colorbox/css/../icon/a_up.png"); background-position: 50% 50%;} #behr_colorbox .cc_more_btn.next a i {background-repeat: no-repeat; background-image: url("https://behr.kr/colorbox/css/../icon/a_down.png"); background-position: 50% 50%;} #behr_colorbox.namelist .cc_more_btn {display: none !important} /* 20180327 신령주 추가 */ #behr_colorbox span.cc_zoom {position:absolute; right:-10px; bottom:-5px; display:block; width:21px; height:21px; background:url("https://behr.kr/colorbox/css/../icon/zoomin.png") 0 0 no-repeat;} #behr_colorbox .behr_nav ul li a:hover{background: #535353; color:#fff; height: 52px; line-height: 58px; font-size: 18px} #behr_colorbox.all_colors .behr_color_menu ul.cc_submenu li a:hover {background-image: url("https://behr.kr/colorbox/css/../icon/check.png"); background-repeat: no-repeat; background-position: 50% 50%; height: 60px; margin-top: -5px; border-radius: 5px; } #detailCanvas_list span.cc_zoom {display:none;} #behr_colorbox.best_colors .behr_color_menu a:hover {background-image: url("https://behr.kr/colorbox/css/../icon/check.png"); background-repeat: no-repeat; background-position: 50% 50%; height: 60px; margin-top: -5px; border-radius: 5px; } #behr_colorbox.by_rooms .behr_color_menu ul li a.active {background:#535353 url("https://behr.kr/colorbox/css/../icon/byroom_on.png") no-repeat;} #behr_colorbox.by_rooms .behr_color_menu ul li a:hover {background:#535353 url("https://behr.kr/colorbox/css/../icon/byroom_on.png") no-repeat; height: 60px; margin-top: -5px; border-radius: 5px;} #behr_colorbox.by_rooms .behr_color_menu ul li a:hover:after {position:absolute; content: '';display: block; width: 100%; height: 100%; top:0; left: :0;  background-image: url("https://behr.kr/colorbox/css/../check.png"); background-repeat: no-repeat; background-position: 50% 50%; height: 60px; margin-top: -5px; border-radius: 5px; } #behr_colorbox.by_styles .behr_color_menu a.bh_colornav0:hover {background:#9f9480;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav1:hover {background:#4fb3d0;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav2:hover {background:#88a379;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav3:hover {background:#848595;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav4:hover {background:#81242b;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav5:hover {background:#c1a889;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav6:hover {background:#64a093;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav7:hover {background:#839894;} #behr_colorbox.by_styles .behr_color_menu a:hover span {color:#fff !important;line-height: 60px;} #behr_colorbox.by_styles .behr_color_menu a:hover {height: 60px; margin-top: -5px;border-radius: 5px; } #behr_colorbox.by_styles .behr_color_menu a:hover:after {position:absolute; content: '';display: block; width: 100%; height: 100%; top:0; left: :0;  background-image: url("https://behr.kr/colorbox/css/../icon/check.png"); background-repeat: no-repeat; background-position: 50% 50%; height: 60px; margin-top: -5px; border-radius: 5px; } #behr_colorbox.by_styles .behr_color_menu a {text-transform: capitalize;} #detailCanvas_view span.cc_zoom {display:none;} #behr_colorbox .detailCanvas_view span.cc_zoom {display:none;} #detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .palette_del {position: absolute; top:5px; right:5px; cursor: pointer; width: 20px; height: 20px; background: url("https://behr.kr/colorbox/css/../icon/close.png") no-repeat 0 0; overflow: hidden; text-align: left; text-indent: -9999px; display:block;} #detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .palette_del:hover {background-position: 0 -20px;} .behr_palette .pal_down {display:block; margin:0 auto !important; cursor:pointer;} .behr_palette .pal_up {display:block; margin:0 auto 0 !important; padding-top:5px !important; cursor:pointer;} .behr_palette #behr_palette_save {height:720px; overflow:hidden;} #detailCanvas #detailCanvas_list.h90 {height:96px;} #detailCanvas #detailCanvas_view.h90 {height:164px; top:140px;}&lt;/style&gt; &lt;script type="text/javascript" src="/colorbox/js/colorbox_iframe.js?ver=1"&gt;&lt;/script&gt; &lt;script type="text/javascript"&gt; var buyInput = "textinput"; //컬러값 입력하는곳의 아이디입력 var ccDisplay = "off"; //컬러값 선택후 컬러챠트 사라는 기능 on/off var cckwd = new Array("coffee","silver","vintage","lemon","red","green","pink"); //추천키워드 최대 7개 &lt;/script&gt; &lt;div id="behr_colorbox" class="sch_color by_rooms"&gt;&lt;div class="behr_nav"&gt; &lt;ul&gt; &lt;li&gt;&lt;a class="ccsubmenu" data-cc_category="all_colors"&gt;All Colors&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a class="ccsubmenu" data-cc_category="best_colors"&gt;Best Colors&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a class="ccsubmenu active" data-cc_category="by_rooms"&gt;By Rooms&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a class="ccsubmenu" data-cc_category="by_styles"&gt;By Styles&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a class="ccsearch"&gt;Search&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; &lt;div class="behr_monitor"&gt; &lt;div class="behr_inner"&gt; &lt;div class="behr_color_menu"&gt; &lt;ul class="cc_submenu"&gt;&lt;li&gt;&lt;a data-group="BEDROOM" class="bh_colornav0 active"&gt;&lt;span&gt;침실&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a data-group="BATHROOM" class="bh_colornav1"&gt;&lt;span&gt;욕실&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a data-group="KIDSROOM" class="bh_colornav2"&gt;&lt;span&gt;아이방&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a data-group="LIVINGROOM" class="bh_colornav3"&gt;&lt;span&gt;거실&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a data-group="KITCHEN" class="bh_colornav4"&gt;&lt;span&gt;부엌&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a data-group="DININGROOM" class="bh_colornav5"&gt;&lt;span&gt;주방&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a data-group="OFFICE" class="bh_colornav6"&gt;&lt;span&gt;서재&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a data-group="EXTERIOR" class="bh_colornav7"&gt;&lt;span&gt;실외공간&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt; &lt;/div&gt; &lt;div id="cc_search_area" style="display: none;"&gt; &lt;div class="cc_search"&gt; &lt;label&gt;컬러찾기&lt;/label&gt;&lt;input type="text" id="cc_search_btn" placeholder="컬러번호 또는 컬러명으로 검색하세요"&gt; &lt;/div&gt; &lt;div id="cckeywordauto"&gt; &lt;ul&gt;&lt;li&gt;&lt;a&gt;coffee&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a&gt;silver&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a&gt;vintage&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a&gt;lemon&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a&gt;red&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a&gt;green&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a&gt;pink&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt; &lt;/div&gt; &lt;div id="ccsearchOutput"&gt;&lt;span id="cckeyword"&gt;coffee&lt;/span&gt;검색결과&lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;div class="behr_colorChart" style="display: block;"&gt;&lt;div class="cc-box" data-ccid="0" data-name="PALE CORAL" data-code="PPU3-07" data-rgb="#F0D0B5" data-tcol="B" data-scroll="0" style="background:#F0D0B5;"&gt; &lt;p class="cc-name"&gt;PALE CORAL&lt;span&gt;PPU3-07&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="1" data-name="COCO" data-code="N270-3" data-rgb="#D1BBA2" data-tcol="B" data-scroll="0" style="background:#D1BBA2;"&gt; &lt;p class="cc-name"&gt;COCO&lt;span&gt;N270-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="2" data-name="STUDIO TAUPE" data-code="PPU5-07" data-rgb="#A5978A" data-tcol="W" data-scroll="0" style="background:#A5978A;"&gt; &lt;p class="cc-name"&gt;STUDIO TAUPE&lt;span&gt;PPU5-07&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="3" data-name="CHATEAU" data-code="PPU7-06" data-rgb="#B5A18B" data-tcol="B" data-scroll="0" style="background:#B5A18B;"&gt; &lt;p class="cc-name"&gt;CHATEAU&lt;span&gt;PPU7-06&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="4" data-name="DISTANT LAND" data-code="N260-5" data-rgb="#A68A72" data-tcol="W" data-scroll="0" style="background:#A68A72;"&gt; &lt;p class="cc-name"&gt;DISTANT LAND&lt;span&gt;N260-5&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="5" data-name="ANTIQUE WHITE" data-code="23" data-rgb="#E8DDCB" data-tcol="B" data-scroll="0" style="background:#E8DDCB;"&gt; &lt;p class="cc-name"&gt;ANTIQUE WHITE&lt;span&gt;23&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="6" data-name="CURIOUS COLLECTION" data-code="N290-4" data-rgb="#D2BB9A" data-tcol="B" data-scroll="0" style="background:#D2BB9A;"&gt; &lt;p class="cc-name"&gt;CURIOUS COLLECTION&lt;span&gt;N290-4&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="7" data-name="DOESKIN GRAY" data-code="N200-2" data-rgb="#CCC3BB" data-tcol="B" data-scroll="0" style="background:#CCC3BB;"&gt; &lt;p class="cc-name"&gt;DOESKIN GRAY&lt;span&gt;N200-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="8" data-name="WASABI POWDER" data-code="PPU9-10" data-rgb="#BDB390" data-tcol="B" data-scroll="0" style="background:#BDB390;"&gt; &lt;p class="cc-name"&gt;WASABI POWDER&lt;span&gt;PPU9-10&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="9" data-name="MINTED LEMON" data-code="PPU10-08" data-rgb="#C0C6A9" data-tcol="B" data-scroll="0" style="background:#C0C6A9;"&gt; &lt;p class="cc-name"&gt;MINTED LEMON&lt;span&gt;PPU10-08&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="10" data-name="RIVERDALE" data-code="N410-3" data-rgb="#BEC5BC" data-tcol="B" data-scroll="0" style="background:#BEC5BC;"&gt; &lt;p class="cc-name"&gt;RIVERDALE&lt;span&gt;N410-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="11" data-name="ZEN" data-code="PPU11-14" data-rgb="#AABAB0" data-tcol="B" data-scroll="0" style="background:#AABAB0;"&gt; &lt;p class="cc-name"&gt;ZEN&lt;span&gt;PPU11-14&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="12" data-name="ATMOSPHERIC" data-code="PPU12-15" data-rgb="#899698" data-tcol="B" data-scroll="0" style="background:#899698;"&gt; &lt;p class="cc-name"&gt;ATMOSPHERIC&lt;span&gt;PPU12-15&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="13" data-name="OBSERVATORY" data-code="PPU13-19" data-rgb="#455D66" data-tcol="W" data-scroll="0" style="background:#455D66;"&gt; &lt;p class="cc-name"&gt;OBSERVATORY&lt;span&gt;PPU13-19&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="14" data-name="FLOWING BREEZE" data-code="N480-2" data-rgb="#B9C6CC" data-tcol="B" data-scroll="0" style="background:#B9C6CC;"&gt; &lt;p class="cc-name"&gt;FLOWING BREEZE&lt;span&gt;N480-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="15" data-name="FOREVER DENIM" data-code="PPU14-05" data-rgb="#778591" data-tcol="W" data-scroll="0" style="background:#778591;"&gt; &lt;p class="cc-name"&gt;FOREVER DENIM&lt;span&gt;PPU14-05&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="16" data-name="CATHEDRAL GRAY" data-code="PPU18-14" data-rgb="#ACAAA8" data-tcol="B" data-scroll="0" style="background:#ACAAA8;"&gt; &lt;p class="cc-name"&gt;CATHEDRAL GRAY&lt;span&gt;PPU18-14&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="17" data-name="SUEDE GRAY" data-code="PPU18-17" data-rgb="#857F7B" data-tcol="W" data-scroll="0" style="background:#857F7B;"&gt; &lt;p class="cc-name"&gt;SUEDE GRAY&lt;span&gt;PPU18-17&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="18" data-name="FRENCH LILAC" data-code="PPU16-10" data-rgb="#BDB8BB" data-tcol="B" data-scroll="0" style="background:#BDB8BB;"&gt; &lt;p class="cc-name"&gt;FRENCH LILAC&lt;span&gt;PPU16-10&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="19" data-name="SO MERLOT" data-code="PPU1-15" data-rgb="#84525B" data-tcol="W" data-scroll="0" style="background:#84525B;"&gt; &lt;p class="cc-name"&gt;SO MERLOT&lt;span&gt;PPU1-15&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="20" data-name="BLACKBERRY JAM" data-code="S100-6" data-rgb="#6F5F71" data-tcol="W" data-scroll="0" style="background:#6F5F71;"&gt; &lt;p class="cc-name"&gt;BLACKBERRY JAM&lt;span&gt;S100-6&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="21" data-name="LUXE LILAC" data-code="N560-3" data-rgb="#A7A3B2" data-tcol="B" data-scroll="0" style="background:#A7A3B2;"&gt; &lt;p class="cc-name"&gt;LUXE LILAC&lt;span&gt;N560-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="22" data-name="BLUEPRINT" data-code="S470-5" data-rgb="#5F818F" data-tcol="W" data-scroll="0" style="background:#5F818F;"&gt; &lt;p class="cc-name"&gt;BLUEPRINT&lt;span&gt;S470-5&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="23" data-name="HALF SEA FOG" data-code="N470-3" data-rgb="#A9B7BC" data-tcol="B" data-scroll="0" style="background:#A9B7BC;"&gt; &lt;p class="cc-name"&gt;HALF SEA FOG&lt;span&gt;N470-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="24" data-name="SILVER BULLET" data-code="N520-2" data-rgb="#C4C4C4" data-tcol="B" data-scroll="0" style="background:#C4C4C4;"&gt; &lt;p class="cc-name"&gt;SILVER BULLET&lt;span&gt;N520-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="25" data-name="MINED COAL" data-code="PPU18-18" data-rgb="#6C6A66" data-tcol="W" data-scroll="0" style="background:#6C6A66;"&gt; &lt;p class="cc-name"&gt;MINED COAL&lt;span&gt;PPU18-18&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="26" data-name="JUNGLE CAMOUFLAGE" data-code="N350-4" data-rgb="#AAA795" data-tcol="B" data-scroll="0" style="background:#AAA795;"&gt; &lt;p class="cc-name"&gt;JUNGLE CAMOUFLAGE&lt;span&gt;N350-4&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="27" data-name="KINDLING" data-code="N200-6" data-rgb="#7A7069" data-tcol="W" data-scroll="0" style="background:#7A7069;"&gt; &lt;p class="cc-name"&gt;KINDLING&lt;span&gt;N200-6&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="28" data-name="HARMONIOUS GOLD" data-code="M300-3" data-rgb="#E9CFA4" data-tcol="B" data-scroll="0" style="background:#E9CFA4;"&gt; &lt;p class="cc-name"&gt;HARMONIOUS GOLD&lt;span&gt;M300-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="29" data-name="LUNAR SURFACE" data-code="N460-3" data-rgb="#B5B9B7" data-tcol="B" data-scroll="0" style="background:#B5B9B7;"&gt; &lt;p class="cc-name"&gt;LUNAR SURFACE&lt;span&gt;N460-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="30" data-name="CANVAS LUGGAGE" data-code="N300-2" data-rgb="#E1D7C7" data-tcol="B" data-scroll="0" style="background:#E1D7C7;"&gt; &lt;p class="cc-name"&gt;CANVAS LUGGAGE&lt;span&gt;N300-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="31" data-name="BREATHE" data-code="S360-2" data-rgb="#D1D1B9" data-tcol="B" data-scroll="0" style="background:#D1D1B9;"&gt; &lt;p class="cc-name"&gt;BREATHE&lt;span&gt;S360-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="32" data-name="METROPOLIS" data-code="N140-3" data-rgb="#B3A9A6" data-tcol="B" data-scroll="0" style="background:#B3A9A6;"&gt; &lt;p class="cc-name"&gt;METROPOLIS&lt;span&gt;N140-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="33" data-name="LINEN WHITE" data-code="70" data-rgb="#F6ECD8" data-tcol="B" data-scroll="0" style="background:#F6ECD8;"&gt; &lt;p class="cc-name"&gt;LINEN WHITE&lt;span&gt;70&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="34" data-name="ANONYMOUS" data-code="780F-5" data-rgb="#939392" data-tcol="W" data-scroll="0" style="background:#939392;"&gt; &lt;p class="cc-name"&gt;ANONYMOUS&lt;span&gt;780F-5&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="35" data-name="DRY BROWN" data-code="N230-5" data-rgb="#968375" data-tcol="W" data-scroll="0" style="background:#968375;"&gt; &lt;p class="cc-name"&gt;DRY BROWN&lt;span&gt;N230-5&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="36" data-name="PERFECT TAUPE" data-code="PPU18-13" data-rgb="#B5ACA1" data-tcol="B" data-scroll="0" style="background:#B5ACA1;"&gt; &lt;p class="cc-name"&gt;PERFECT TAUPE&lt;span&gt;PPU18-13&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="37" data-name="STERLING" data-code="780E-3" data-rgb="#D2D4D3" data-tcol="B" data-scroll="0" style="background:#D2D4D3;"&gt; &lt;p class="cc-name"&gt;STERLING&lt;span&gt;780E-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="38" data-name="SUBTLE TOUCH" data-code="790E-1" data-rgb="#DBDADA" data-tcol="B" data-scroll="0" style="background:#DBDADA;"&gt; &lt;p class="cc-name"&gt;SUBTLE TOUCH&lt;span&gt;790E-1&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="39" data-name="FRENCH SILVER" data-code="PPU18-05" data-rgb="#B8BCBE" data-tcol="B" data-scroll="0" style="background:#B8BCBE;"&gt; &lt;p class="cc-name"&gt;FRENCH SILVER&lt;span&gt;PPU18-05&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="40" data-name="FLANNEL GRAY" data-code="N520-3" data-rgb="#ADADAD" data-tcol="B" data-scroll="0" style="background:#ADADAD;"&gt; &lt;p class="cc-name"&gt;FLANNEL GRAY&lt;span&gt;N520-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="41" data-name="ULTRA PURE WHITE PRW15" data-code="PR-W15" data-rgb="#F8F9F5" data-tcol="B" data-scroll="0" style="background:#F8F9F5;"&gt; &lt;p class="cc-name"&gt;ULTRA PURE WHITE PRW15&lt;span&gt;PR-W15&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="42" data-name="WHITE METAL" data-code="N520-1" data-rgb="#D0D0D0" data-tcol="B" data-scroll="0" style="background:#D0D0D0;"&gt; &lt;p class="cc-name"&gt;WHITE METAL&lt;span&gt;N520-1&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="43" data-name="BURNISHED CLAY" data-code="PPU18-09" data-rgb="#D2CCC5" data-tcol="B" data-scroll="0" style="background:#D2CCC5;"&gt; &lt;p class="cc-name"&gt;BURNISHED CLAY&lt;span&gt;PPU18-09&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="44" data-name="DARK NAVY" data-code="S530-7" data-rgb="#40495B" data-tcol="W" data-scroll="0" style="background:#40495B;"&gt; &lt;p class="cc-name"&gt;DARK NAVY&lt;span&gt;S530-7&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="45" data-name="DARK PEWTER" data-code="PPU18-04" data-rgb="#8D9397" data-tcol="W" data-scroll="0" style="background:#8D9397;"&gt; &lt;p class="cc-name"&gt;DARK PEWTER&lt;span&gt;PPU18-04&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="46" data-name="POLAR BEAR" data-code="75" data-rgb="#F5F3ED" data-tcol="B" data-scroll="0" style="background:#F5F3ED;"&gt; &lt;p class="cc-name"&gt;POLAR BEAR&lt;span&gt;75&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="47" data-name="CHICAGO FOG" data-code="N140-2" data-rgb="#C9C1BE" data-tcol="B" data-scroll="0" style="background:#C9C1BE;"&gt; &lt;p class="cc-name"&gt;CHICAGO FOG&lt;span&gt;N140-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="48" data-name="SPUN WOOL" data-code="N220-1" data-rgb="#E3DDD6" data-tcol="B" data-scroll="0" style="background:#E3DDD6;"&gt; &lt;p class="cc-name"&gt;SPUN WOOL&lt;span&gt;N220-1&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="49" data-name="BOOT CUT" data-code="S510-2" data-rgb="#AEC1D0" data-tcol="B" data-scroll="0" style="background:#AEC1D0;"&gt; &lt;p class="cc-name"&gt;BOOT CUT&lt;span&gt;S510-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;div class="cc-box-img"&gt;&lt;div class="cc-box-imgbox"&gt;&lt;img src="/colorbox/img/byrooms/Bed01.jpg" alt="이미지1번입니다."&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="57" data-name="GENTLE SEA" data-code="S470-2" data-rgb="#B0C8D1" data-tcol="B" data-scroll="i" style="background:#B0C8D1;"&gt; &lt;p class="cc-name"&gt;GENTLE SEA&lt;span&gt;S470-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="58" data-name="POLAR BEAR" data-code="75" data-rgb="#F5F3ED" data-tcol="B" data-scroll="i" style="background:#F5F3ED;"&gt; &lt;p class="cc-name"&gt;POLAR BEAR&lt;span&gt;75&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class="cc-box-img"&gt;&lt;div class="cc-box-imgbox"&gt;&lt;img src="/colorbox/img/byrooms/Bed02.jpg" alt="이미지2번입니다"&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="63" data-name="UNDINE" data-code="M450-4" data-rgb="#89C0BC" data-tcol="B" data-scroll="i" style="background:#89C0BC;"&gt; &lt;p class="cc-name"&gt;UNDINE&lt;span&gt;M450-4&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="64" data-name="CARBON" data-code="N520-7" data-rgb="#3D3E3F" data-tcol="W" data-scroll="i" style="background:#3D3E3F;"&gt; &lt;p class="cc-name"&gt;CARBON&lt;span&gt;N520-7&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="65" data-name="SPANISH SAND" data-code="OR-W7" data-rgb="#DCD0BE" data-tcol="B" data-scroll="i" style="background:#DCD0BE;"&gt; &lt;p class="cc-name"&gt;SPANISH SAND&lt;span&gt;OR-W7&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class="cc-box-img"&gt;&lt;div class="cc-box-imgbox"&gt;&lt;img src="/colorbox/img/byrooms/Bed03.jpg" alt="이미지3번입니다"&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="69" data-name="CHATEAU" data-code="PPU7-06" data-rgb="#B5A18B" data-tcol="B" data-scroll="i" style="background:#B5A18B;"&gt; &lt;p class="cc-name"&gt;CHATEAU&lt;span&gt;PPU7-06&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="70" data-name="POLAR BEAR" data-code="75" data-rgb="#F5F3ED" data-tcol="B" data-scroll="i" style="background:#F5F3ED;"&gt; &lt;p class="cc-name"&gt;POLAR BEAR&lt;span&gt;75&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="71" data-name="BLACKOUT" data-code="N510-7" data-rgb="#413F3F" data-tcol="W" data-scroll="i" style="background:#413F3F;"&gt; &lt;p class="cc-name"&gt;BLACKOUT&lt;span&gt;N510-7&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class="cc-box-img"&gt;&lt;div class="cc-box-imgbox"&gt;&lt;img src="/colorbox/img/byrooms/Bed04.jpg" alt="이미지4번입니다"&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="75" data-name="AGED BEIGE" data-code="PPU7-09" data-rgb="#D7CFC1" data-tcol="B" data-scroll="i" style="background:#D7CFC1;"&gt; &lt;p class="cc-name"&gt;AGED BEIGE&lt;span&gt;PPU7-09&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="76" data-name="PURE EARTH" data-code="PPU7-05" data-rgb="#A79481" data-tcol="W" data-scroll="i" style="background:#A79481;"&gt; &lt;p class="cc-name"&gt;PURE EARTH&lt;span&gt;PPU7-05&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="77" data-name="WHITE" data-code="1852" data-rgb="#EBEAE7" data-tcol="B" data-scroll="i" style="background:#EBEAE7;"&gt; &lt;p class="cc-name"&gt;WHITE&lt;span&gt;1852&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class="cc-box-img"&gt;&lt;div class="cc-box-imgbox"&gt;&lt;img src="/colorbox/img/byrooms/Bed05.jpg" alt="이미지5번입니다"&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="81" data-name="FUTURE VISION" data-code="N100-3" data-rgb="#BCB5BD" data-tcol="B" data-scroll="i" style="background:#BCB5BD;"&gt; &lt;p class="cc-name"&gt;FUTURE VISION&lt;span&gt;N100-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="82" data-name="ULTRA PURE WHITE" data-code="PPU18-06" data-rgb="#F8F8F4" data-tcol="B" data-scroll="i" style="background:#F8F8F4;"&gt; &lt;p class="cc-name"&gt;ULTRA PURE WHITE&lt;span&gt;PPU18-06&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class="cc-box-img"&gt;&lt;div class="cc-box-imgbox"&gt;&lt;img src="/colorbox/img/byrooms/Bed06.jpg" alt="이미지6번입니다"&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="87" data-name="PALE PARSNIP" data-code="S320-2" data-rgb="#E3D7C1" data-tcol="B" data-scroll="i" style="background:#E3D7C1;"&gt; &lt;p class="cc-name"&gt;PALE PARSNIP&lt;span&gt;S320-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="88" data-name="SLEEK WHITE" data-code="OR-W15" data-rgb="#FAF5EB" data-tcol="B" data-scroll="i" style="background:#FAF5EB;"&gt; &lt;p class="cc-name"&gt;SLEEK WHITE&lt;span&gt;OR-W15&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="89" data-name="MAUVELOUS" data-code="BNC-12" data-rgb="#B5A49E" data-tcol="B" data-scroll="i" style="background:#B5A49E;"&gt; &lt;p class="cc-name"&gt;MAUVELOUS&lt;span&gt;BNC-12&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class="cc-box-img"&gt;&lt;div class="cc-box-imgbox"&gt;&lt;img src="/colorbox/img/byrooms/Bed07.jpg" alt="이미지7번입니다"&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="93" data-name="ROMAN PLASTER" data-code="PPU7-10" data-rgb="#DDD1C0" data-tcol="B" data-scroll="i" style="background:#DDD1C0;"&gt; &lt;p class="cc-name"&gt;ROMAN PLASTER&lt;span&gt;PPU7-10&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="94" data-name="SWISS COFFEE" data-code="12" data-rgb="#F1ECE1" data-tcol="B" data-scroll="i" style="background:#F1ECE1;"&gt; &lt;p class="cc-name"&gt;SWISS COFFEE&lt;span&gt;12&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="95" data-name="JOURNEYS END" data-code="S520-2" data-rgb="#BAC9D6" data-tcol="B" data-scroll="i" style="background:#BAC9D6;"&gt; &lt;p class="cc-name"&gt;JOURNEYS END&lt;span&gt;S520-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class="cc-box-img"&gt;&lt;div class="cc-box-imgbox"&gt;&lt;img src="/colorbox/img/byrooms/Bed08.jpg" alt="이미지8번입니다"&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="99" data-name="PARK AVENUE" data-code="MQ2-55" data-rgb="#bbb2a9" data-tcol="B" data-scroll="i" style="background:#bbb2a9;"&gt; &lt;p class="cc-name"&gt;PARK AVENUE&lt;span&gt;MQ2-55&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="100" data-name="COLD STEEL" data-code="MQ5-20" data-rgb="#808f99" data-tcol="W" data-scroll="i" style="background:#808f99;"&gt; &lt;p class="cc-name"&gt;COLD STEEL&lt;span&gt;MQ5-20&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="101" data-name="CREME DE LA CREME" data-code="MQ3-33" data-rgb="#e2ddd8" data-tcol="B" data-scroll="i" style="background:#e2ddd8;"&gt; &lt;p class="cc-name"&gt;CREME DE LA CREME&lt;span&gt;MQ3-33&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="102" data-name="UNPREDICTABLE HUE" data-code="MQ2-58" data-rgb="#7b746c" data-tcol="W" data-scroll="i" style="background:#7b746c;"&gt; &lt;p class="cc-name"&gt;UNPREDICTABLE HUE&lt;span&gt;MQ2-58&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt; &lt;/div&gt; &lt;div class="behr_selectColor"&gt; &lt;h3&gt;My BEHR Colors&lt;/h3&gt; &lt;div class="behr_palette"&gt; &lt;div class="behr_palette_guide"&gt; 크게 보고 싶은 컬러를 눌러 보세요. &lt;/div&gt; &lt;div id="behr_palette_save"&gt; &lt;/div&gt; &lt;/div&gt; &lt;div id="detailCanvas" style="display: none;"&gt;&lt;div id="detailCanvas_list"&gt;&lt;div class="cc-box" data-ccid="94" data-name="SWISS COFFEE" data-code="12" data-rgb="#F1ECE1" data-tcol="B" data-scroll="i" style=";"&gt; &lt;p class="cc-name"&gt;SWISS COFFEE&lt;span&gt;12&lt;/span&gt;&lt;/p&gt;&lt;a class="cc-view" style="background:#F1ECE1;"&gt;&lt;span class="cc_zoom"&gt;&lt;/span&gt;&lt;/a&gt;&lt;a class="palette_del"&gt;삭제&lt;/a&gt;&lt;/div&gt;&lt;div class="cc-box active" data-ccid="95" data-name="JOURNEYS END" data-code="S520-2" data-rgb="#BAC9D6" data-tcol="B" data-scroll="i" style=";"&gt; &lt;p class="cc-name"&gt;JOURNEYS END&lt;span&gt;S520-2&lt;/span&gt;&lt;/p&gt;&lt;a class="cc-view" style="background:#BAC9D6;"&gt;&lt;span class="cc_zoom"&gt;&lt;/span&gt;&lt;/a&gt;&lt;a class="palette_del"&gt;삭제&lt;/a&gt;&lt;/div&gt; &lt;/div&gt;&lt;div id="detailCanvas_view"&gt;&lt;div class="cc-box active" data-ccid="95" data-name="JOURNEYS END" data-code="S520-2" data-rgb="#BAC9D6" data-tcol="B" data-scroll="i" style=";"&gt; &lt;p class="cc-name"&gt;JOURNEYS END&lt;span&gt;S520-2&lt;/span&gt;&lt;/p&gt;&lt;a class="cc-view" style="background:#BAC9D6;"&gt;&lt;span class="cc_zoom"&gt;&lt;/span&gt;&lt;/a&gt;&lt;a class="palette_del"&gt;삭제&lt;/a&gt;&lt;a class="detailColorvs_buyBtn"&gt;주문하기&lt;/a&gt;&lt;/div&gt;&lt;/div&gt; &lt;div id="detailCanvas_color"&gt; &lt;a class="detailCanvas_btn detailCanvas_btn01" data-index="0"&gt;1번색상선택&lt;/a&gt; &lt;a class="detailCanvas_btn detailCanvas_btn02" data-index="1"&gt;2번색상선택&lt;/a&gt; &lt;a class="detailCanvas_btn detailCanvas_btn03" data-index="2"&gt;3번색상선택&lt;/a&gt; &lt;div class="detailCanvas_view detailCanvas_view01"&gt;&lt;/div&gt; &lt;div class="detailCanvas_view detailCanvas_view02"&gt;&lt;/div&gt; &lt;div class="detailCanvas_view detailCanvas_view03"&gt;&lt;/div&gt; &lt;/div&gt;&lt;a class="detailCanvas_close"&gt;닫기&lt;/a&gt;&lt;/div&gt; &lt;/div&gt; &lt;div class="loading" style="display: none;"&gt;&lt;img src="/colorbox/icon/ajax-loader.gif"&gt;&lt;/div&gt;&lt;div class="wh-ov" style="display: none;"&gt;&lt;/div&gt;&lt;/div&gt; &lt;!-- } 컬러챠트 삽입 --&gt;&lt;/article&gt;&lt;/body&gt;&lt;/html&gt; &lt;/iframe&gt;&lt;/center&gt; 이렇게 넣으면 되는거 아닌가요? ㅠㅠ 안되네요 ">

<meta property="og:image" content="https://cboard.net/sitemap/og_image.php?text=네이버스토어 html 삽입&link=https://cboard.net/k/1_1040205_428878900">
<link rel="canonical" href="https://cboard.net/k/1_1040205_428878900">

<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />
<meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1" />

<link rel="icon" href="https://cboard.net/favicon_32x32.png" sizes="32x32" />
<link rel="icon" href="https://cboard.net/favicon_192x192.png" sizes="192x192" />
<link rel="apple-touch-icon" href="https://cboard.net/favicon_180x180.png" />
<meta name="msapplication-TileImage" content="https://cboard.net/favicon_192x192.png" />

<link rel="alternate" type="application/rss+xml" title="cboard search sitemap" href="https://cboard.net/sitemap/kin.php?q=%EB%84%A4%EC%9D%B4%EB%B2%84%EC%8A%A4%ED%86%A0%EC%96%B4+html+%EC%82%BD%EC%9E%85" />
<link rel="sitemap" type="application/rss+xml" title="sitemap" href="https://cboard.net/sitemap/kin.php?q=%EB%84%A4%EC%9D%B4%EB%B2%84%EC%8A%A4%ED%86%A0%EC%96%B4+html+%EC%82%BD%EC%9E%85" />

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cboard.net/js/jquery.menu.js"></script>
<script src="https://cboard.net/js/common.js"></script>
<script src="https://cboard.net/js/wrest.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/placeholders/4.0.1/placeholders.min.js"></script>
<script src="https://cboard.net/theme/cboard/js/waterfall-light.js"></script>

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-9176212351894019"
     crossorigin="anonymous"></script>

<script type="text/javascript">
  window._taboola = window._taboola || [];
  _taboola.push({article:'auto'});
  !function (e, f, u, i) {
    if (!document.getElementById(i)){
      e.async = 1;
      e.src = u;
      e.id = i;
      f.parentNode.insertBefore(e, f);
    }
  }(document.createElement('script'),
  document.getElementsByTagName('script')[0],
  '//cdn.taboola.com/libtrc/cboardkorea/loader.js',
  'tb_loader_script');
  if(window.performance && typeof window.performance.mark == 'function')
    {window.performance.mark('tbl_ic');}
</script>

<script src="https://cdn.onesignal.com/sdks/web/v16/OneSignalSDK.page.js" defer></script>
<script>
  window.OneSignalDeferred = window.OneSignalDeferred || [];
  OneSignalDeferred.push(function(OneSignal) {
    OneSignal.init({
      appId: "c2b27b38-5695-45f6-8e8c-1df998c33369",
    });
  });
</script>

</head>
<body>
<link rel="stylesheet" type="text/css" href="/css/extend4.css">
<script>
    $(document).ready(function () {
        window.onscroll = function() {myFunction()};


        var $rstk = $("#right-ba");
        var sticky_top = $rstk[0].offsetTop+$("header#hd").outerHeight();


        var $lstk = $("#left-ba");
        var sticky_top2 = $lstk[0].offsetTop;


        function myFunction() {


            if (window.pageYOffset > sticky_top) {

                if(window.pageYOffset+$rstk.outerHeight() > $("body>.container").outerHeight()-$("#ft").outerHeight()){

                    $rstk.css({"bottom":$("#ft").outerHeight()+'px','top':'auto'});

                }else{
                    $rstk.css({"bottom":'auto','top':window.pageYOffset-$("header#hd").outerHeight()-10+'px'});
                    $rstk.addClass("sticky");
                }

            } else {

                $rstk.removeClass("sticky");
            }

            if (window.pageYOffset > sticky_top2) {
                $lstk.css({"bottom":'auto','top':window.pageYOffset+'px'});
                $lstk.addClass("sticky");
            } else {

                $lstk.removeClass("sticky");
            }
        }


    })
</script>


<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "QAPage",
  "mainEntity": {
    "@type": "Question",
    "name": "네이버스토어 html 삽입",
    "text": " \uc548\ub155\ud558\uc138\uc694 \ub124\uc774\ubc84\uc2a4\ud1a0\uc5b4 \uc0c1\uc138\ud398\uc774\uc9c0\uc5d0 \ud398\uc778\ud2b8 \uc0c9\uc0c1 \uace0\ub97c \uc218 \uc788\ub3c4\ub85d\u00a0 \uc774\ub7f0 html \uc0bd\uc785\ud558\ub824\uace0 \ud558\ub294\ub370 \uc798 \uc548\ub418\ub124\uc694.. https:\/\/behr.kr\/sub\/gallery\/studio_iframe.asp \uc774 \ud398\uc774\uc9c0\ub97c \ub123\uc73c\ub824\uba74 html \uc801\ub294 \uce78\uc5d0 &lt;center&gt;&lt;iframe src=\"https:\/\/behr.kr\/sub\/gallery\/studio_iframe.asp\" width=\"850\" height=\"1000\" frameborder=\"0\" marginwidth=\"0\" marginheight=\"0\" scrolling=\"no\"&gt; &lt;html lang=\"ko\" class=\" -webkit-\"&gt;&lt;head&gt; &lt;meta charset=\"UTF-8\"&gt; &lt;meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\"&gt; &lt;meta name=\"format-detection\" content=\"telephone=no\"&gt; &lt;meta name=\"viewport\" content=\"user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, width=device-width\"&gt; &lt;meta http-equiv=\"Content-Type\" content=\"text\/html; charset=utf-8\"&gt; &lt;meta http-equiv=\"Content-Script-Type\" content=\"text\/javascript\"&gt; &lt;meta http-equiv=\"Content-Style-Type\" content=\"text\/css\"&gt; &lt;style media=\"\" data-href=\"https:\/\/fonts.googleapis.com\/css?family=Poppins:300,400,500,600,700,900\"&gt;\/*# sourceURL=https:\/\/fonts.googleapis.com\/css?family=Poppins:300,400,500,600,700,900 *\/ \/*@ sourceURL=https:\/\/fonts.googleapis.com\/css?family=Poppins:300,400,500,600,700,900 *\/ \/* devanagari *\/ @font-face { \u00a0 font-family: 'Poppins'; \u00a0 font-style: normal; \u00a0 font-weight: 300; \u00a0 src: url(https:\/\/fonts.gstatic.com\/s\/poppins\/v20\/pxiByp8kv8JHgFVrLDz8Z11lFd2JQEl8qw.woff2) format('woff2'); \u00a0 unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB; } \/* latin-ext *\/ @font-face { \u00a0 font-family: 'Poppins'; \u00a0 font-style: normal; \u00a0 font-weight: 300; \u00a0 src: url(https:\/\/fonts.gstatic.com\/s\/poppins\/v20\/pxiByp8kv8JHgFVrLDz8Z1JlFd2JQEl8qw.woff2) format('woff2'); \u00a0 unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } \/* latin *\/ @font-face { \u00a0 font-family: 'Poppins'; \u00a0 font-style: normal; \u00a0 font-weight: 300; \u00a0 src: url(https:\/\/fonts.gstatic.com\/s\/poppins\/v20\/pxiByp8kv8JHgFVrLDz8Z1xlFd2JQEk.woff2) format('woff2'); \u00a0 unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } \/* devanagari *\/ @font-face { \u00a0 font-family: 'Poppins'; \u00a0 font-style: normal; \u00a0 font-weight: 400; \u00a0 src: url(https:\/\/fonts.gstatic.com\/s\/poppins\/v20\/pxiEyp8kv8JHgFVrJJbecnFHGPezSQ.woff2) format('woff2'); \u00a0 unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB; } \/* latin-ext *\/ @font-face { \u00a0 font-family: 'Poppins'; \u00a0 font-style: normal; \u00a0 font-weight: 400; \u00a0 src: url(https:\/\/fonts.gstatic.com\/s\/poppins\/v20\/pxiEyp8kv8JHgFVrJJnecnFHGPezSQ.woff2) format('woff2'); \u00a0 unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } \/* latin *\/ @font-face { \u00a0 font-family: 'Poppins'; \u00a0 font-style: normal; \u00a0 font-weight: 400; \u00a0 src: url(https:\/\/fonts.gstatic.com\/s\/poppins\/v20\/pxiEyp8kv8JHgFVrJJfecnFHGPc.woff2) format('woff2'); \u00a0 unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } \/* devanagari *\/ @font-face { \u00a0 font-family: 'Poppins'; \u00a0 font-style: normal; \u00a0 font-weight: 500; \u00a0 src: url(https:\/\/fonts.gstatic.com\/s\/poppins\/v20\/pxiByp8kv8JHgFVrLGT9Z11lFd2JQEl8qw.woff2) format('woff2'); \u00a0 unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB; } \/* latin-ext *\/ @font-face { \u00a0 font-family: 'Poppins'; \u00a0 font-style: normal; \u00a0 font-weight: 500; \u00a0 src: url(https:\/\/fonts.gstatic.com\/s\/poppins\/v20\/pxiByp8kv8JHgFVrLGT9Z1JlFd2JQEl8qw.woff2) format('woff2'); \u00a0 unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } \/* latin *\/ @font-face { \u00a0 font-family: 'Poppins'; \u00a0 font-style: normal; \u00a0 font-weight: 500; \u00a0 src: url(https:\/\/fonts.gstatic.com\/s\/poppins\/v20\/pxiByp8kv8JHgFVrLGT9Z1xlFd2JQEk.woff2) format('woff2'); \u00a0 unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } \/* devanagari *\/ @font-face { \u00a0 font-family: 'Poppins'; \u00a0 font-style: normal; \u00a0 font-weight: 600; \u00a0 src: url(https:\/\/fonts.gstatic.com\/s\/poppins\/v20\/pxiByp8kv8JHgFVrLEj6Z11lFd2JQEl8qw.woff2) format('woff2'); \u00a0 unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB; } \/* latin-ext *\/ @font-face { \u00a0 font-family: 'Poppins'; \u00a0 font-style: normal; \u00a0 font-weight: 600; \u00a0 src: url(https:\/\/fonts.gstatic.com\/s\/poppins\/v20\/pxiByp8kv8JHgFVrLEj6Z1JlFd2JQEl8qw.woff2) format('woff2'); \u00a0 unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } \/* latin *\/ @font-face { \u00a0 font-family: 'Poppins'; \u00a0 font-style: normal; \u00a0 font-weight: 600; \u00a0 src: url(https:\/\/fonts.gstatic.com\/s\/poppins\/v20\/pxiByp8kv8JHgFVrLEj6Z1xlFd2JQEk.woff2) format('woff2'); \u00a0 unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } \/* devanagari *\/ @font-face { \u00a0 font-family: 'Poppins'; \u00a0 font-style: normal; \u00a0 font-weight: 700; \u00a0 src: url(https:\/\/fonts.gstatic.com\/s\/poppins\/v20\/pxiByp8kv8JHgFVrLCz7Z11lFd2JQEl8qw.woff2) format('woff2'); \u00a0 unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB; } \/* latin-ext *\/ @font-face { \u00a0 font-family: 'Poppins'; \u00a0 font-style: normal; \u00a0 font-weight: 700; \u00a0 src: url(https:\/\/fonts.gstatic.com\/s\/poppins\/v20\/pxiByp8kv8JHgFVrLCz7Z1JlFd2JQEl8qw.woff2) format('woff2'); \u00a0 unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } \/* latin *\/ @font-face { \u00a0 font-family: 'Poppins'; \u00a0 font-style: normal; \u00a0 font-weight: 700; \u00a0 src: url(https:\/\/fonts.gstatic.com\/s\/poppins\/v20\/pxiByp8kv8JHgFVrLCz7Z1xlFd2JQEk.woff2) format('woff2'); \u00a0 unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } \/* devanagari *\/ @font-face { \u00a0 font-family: 'Poppins'; \u00a0 font-style: normal; \u00a0 font-weight: 900; \u00a0 src: url(https:\/\/fonts.gstatic.com\/s\/poppins\/v20\/pxiByp8kv8JHgFVrLBT5Z11lFd2JQEl8qw.woff2) format('woff2'); \u00a0 unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB; } \/* latin-ext *\/ @font-face { \u00a0 font-family: 'Poppins'; \u00a0 font-style: normal; \u00a0 font-weight: 900; \u00a0 src: url(https:\/\/fonts.gstatic.com\/s\/poppins\/v20\/pxiByp8kv8JHgFVrLBT5Z1JlFd2JQEl8qw.woff2) format('woff2'); \u00a0 unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } \/* latin *\/ @font-face { \u00a0 font-family: 'Poppins'; \u00a0 font-style: normal; \u00a0 font-weight: 900; \u00a0 src: url(https:\/\/fonts.gstatic.com\/s\/poppins\/v20\/pxiByp8kv8JHgFVrLBT5Z1xlFd2JQEk.woff2) format('woff2'); \u00a0 unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } &lt;\/style&gt; &lt;style media=\"\" data-href=\"\/css\/style.css\"&gt;\/*# sourceURL=\/css\/style.css *\/ \/*@ sourceURL=\/css\/style.css *\/ @charset \"utf-8\"; @import url(\"https:\/\/behr.kr\/css\/base.css\"); @import url(\"https:\/\/behr.kr\/css\/common.css\"); @import url(\"https:\/\/behr.kr\/css\/main.css\"); @import url(\"https:\/\/behr.kr\/css\/sub.css\"); \/* @import url(\"https:\/\/behr.kr\/css\/gallery.css\"); *\/&lt;\/style&gt; &lt;style media=\"\" data-href=\"\/\/maxcdn.bootstrapcdn.com\/font-awesome\/4.1.0\/css\/font-awesome.min.css\"&gt;\/*# sourceURL=\/\/maxcdn.bootstrapcdn.com\/font-awesome\/4.1.0\/css\/font-awesome.min.css *\/ \/*@ sourceURL=\/\/maxcdn.bootstrapcdn.com\/font-awesome\/4.1.0\/css\/font-awesome.min.css *\/ \/*! \u00a0*\u00a0 Font Awesome 4.1.0 by @davegandy - http:\/\/fontawesome.io - @fontawesome \u00a0*\u00a0 License - http:\/\/fontawesome.io\/license (Font: SIL OFL 1.1, CSS: MIT License) \u00a0*\/@font-face{font-family:'FontAwesome';src:url(\"https:\/\/maxcdn.bootstrapcdn.com\/font-awesome\/4.1.0\/css\/..\/fonts\/fontawesome-webfont.eot?v=4.1.0\");src:url(\"https:\/\/maxcdn.bootstrapcdn.com\/font-awesome\/4.1.0\/css\/..\/fonts\/fontawesome-webfont.eot?#iefix&amp;v=4.1.0\") format('embedded-opentype'),url(\"https:\/\/maxcdn.bootstrapcdn.com\/font-awesome\/4.1.0\/css\/..\/fonts\/fontawesome-webfont.woff?v=4.1.0\") format('woff'),url(\"https:\/\/maxcdn.bootstrapcdn.com\/font-awesome\/4.1.0\/css\/..\/fonts\/fontawesome-webfont.ttf?v=4.1.0\") format('truetype'),url(\"https:\/\/maxcdn.bootstrapcdn.com\/font-awesome\/4.1.0\/css\/..\/fonts\/fontawesome-webfont.svg?v=4.1.0#fontawesomeregular\") format('svg');font-weight:normal;font-style:normal}.fa{display:inline-block;font-family:FontAwesome;font-style:normal;font-weight:normal;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.fa-lg{font-size:1.33333333em;line-height:.75em;vertical-align:-15%}.fa-2x{font-size:2em}.fa-3x{font-size:3em}.fa-4x{font-size:4em}.fa-5x{font-size:5em}.fa-fw{width:1.28571429em;text-align:center}.fa-ul{padding-left:0;margin-left:2.14285714em;list-style-type:none}.fa-ul&gt;li{position:relative}.fa-li{position:absolute;left:-2.14285714em;width:2.14285714em;top:.14285714em;text-align:center}.fa-li.fa-lg{left:-1.85714286em}.fa-border{padding:.2em .25em .15em;border:solid .08em #eee;border-radius:.1em}.pull-right{float:right}.pull-left{float:left}.fa.pull-left{margin-right:.3em}.fa.pull-right{margin-left:.3em}.fa-spin{-webkit-animation:spin 2s infinite linear;-moz-animation:spin 2s infinite linear;-o-animation:spin 2s infinite linear;animation:spin 2s infinite linear}@-moz-keyframes spin{0%{-moz-transform:rotate(0deg)}100%{-moz-transform:rotate(359deg)}}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg)}100%{-webkit-transform:rotate(359deg)}}@-o-keyframes spin{0%{-o-transform:rotate(0deg)}100%{-o-transform:rotate(359deg)}}@keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}.fa-rotate-90{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=1);-webkit-transform:rotate(90deg);-moz-transform:rotate(90deg);-ms-transform:rotate(90deg);-o-transform:rotate(90deg);transform:rotate(90deg)}.fa-rotate-180{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2);-webkit-transform:rotate(180deg);-moz-transform:rotate(180deg);-ms-transform:rotate(180deg);-o-transform:rotate(180deg);transform:rotate(180deg)}.fa-rotate-270{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);-webkit-transform:rotate(270deg);-moz-transform:rotate(270deg);-ms-transform:rotate(270deg);-o-transform:rotate(270deg);transform:rotate(270deg)}.fa-flip-horizontal{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1);-webkit-transform:scale(-1, 1);-moz-transform:scale(-1, 1);-ms-transform:scale(-1, 1);-o-transform:scale(-1, 1);transform:scale(-1, 1)}.fa-flip-vertical{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1);-webkit-transform:scale(1, -1);-moz-transform:scale(1, -1);-ms-transform:scale(1, -1);-o-transform:scale(1, -1);transform:scale(1, -1)}.fa-stack{position:relative;display:inline-block;width:2em;height:2em;line-height:2em;vertical-align:middle}.fa-stack-1x,.fa-stack-2x{position:absolute;left:0;width:100%;text-align:center}.fa-stack-1x{line-height:inherit}.fa-stack-2x{font-size:2em}.fa-inverse{color:#fff}.fa-glass:before{content:\"\\f000\"}.fa-music:before{content:\"\\f001\"}.fa-search:before{content:\"\\f002\"}.fa-envelope-o:before{content:\"\\f003\"}.fa-heart:before{content:\"\\f004\"}.fa-star:before{content:\"\\f005\"}.fa-star-o:before{content:\"\\f006\"}.fa-user:before{content:\"\\f007\"}.fa-film:before{content:\"\\f008\"}.fa-th-large:before{content:\"\\f009\"}.fa-th:before{content:\"\\f00a\"}.fa-th-list:before{content:\"\\f00b\"}.fa-check:before{content:\"\\f00c\"}.fa-times:before{content:\"\\f00d\"}.fa-search-plus:before{content:\"\\f00e\"}.fa-search-minus:before{content:\"\\f010\"}.fa-power-off:before{content:\"\\f011\"}.fa-signal:before{content:\"\\f012\"}.fa-gear:before,.fa-cog:before{content:\"\\f013\"}.fa-trash-o:before{content:\"\\f014\"}.fa-home:before{content:\"\\f015\"}.fa-file-o:before{content:\"\\f016\"}.fa-clock-o:before{content:\"\\f017\"}.fa-road:before{content:\"\\f018\"}.fa-download:before{content:\"\\f019\"}.fa-arrow-circle-o-down:before{content:\"\\f01a\"}.fa-arrow-circle-o-up:before{content:\"\\f01b\"}.fa-inbox:before{content:\"\\f01c\"}.fa-play-circle-o:before{content:\"\\f01d\"}.fa-rotate-right:before,.fa-repeat:before{content:\"\\f01e\"}.fa-refresh:before{content:\"\\f021\"}.fa-list-alt:before{content:\"\\f022\"}.fa-lock:before{content:\"\\f023\"}.fa-flag:before{content:\"\\f024\"}.fa-headphones:before{content:\"\\f025\"}.fa-volume-off:before{content:\"\\f026\"}.fa-volume-down:before{content:\"\\f027\"}.fa-volume-up:before{content:\"\\f028\"}.fa-qrcode:before{content:\"\\f029\"}.fa-barcode:before{content:\"\\f02a\"}.fa-tag:before{content:\"\\f02b\"}.fa-tags:before{content:\"\\f02c\"}.fa-book:before{content:\"\\f02d\"}.fa-bookmark:before{content:\"\\f02e\"}.fa-print:before{content:\"\\f02f\"}.fa-camera:before{content:\"\\f030\"}.fa-font:before{content:\"\\f031\"}.fa-bold:before{content:\"\\f032\"}.fa-italic:before{content:\"\\f033\"}.fa-text-height:before{content:\"\\f034\"}.fa-text-width:before{content:\"\\f035\"}.fa-align-left:before{content:\"\\f036\"}.fa-align-center:before{content:\"\\f037\"}.fa-align-right:before{content:\"\\f038\"}.fa-align-justify:before{content:\"\\f039\"}.fa-list:before{content:\"\\f03a\"}.fa-dedent:before,.fa-outdent:before{content:\"\\f03b\"}.fa-indent:before{content:\"\\f03c\"}.fa-video-camera:before{content:\"\\f03d\"}.fa-photo:before,.fa-image:before,.fa-picture-o:before{content:\"\\f03e\"}.fa-pencil:before{content:\"\\f040\"}.fa-map-marker:before{content:\"\\f041\"}.fa-adjust:before{content:\"\\f042\"}.fa-tint:before{content:\"\\f043\"}.fa-edit:before,.fa-pencil-square-o:before{content:\"\\f044\"}.fa-share-square-o:before{content:\"\\f045\"}.fa-check-square-o:before{content:\"\\f046\"}.fa-arrows:before{content:\"\\f047\"}.fa-step-backward:before{content:\"\\f048\"}.fa-fast-backward:before{content:\"\\f049\"}.fa-backward:before{content:\"\\f04a\"}.fa-play:before{content:\"\\f04b\"}.fa-pause:before{content:\"\\f04c\"}.fa-stop:before{content:\"\\f04d\"}.fa-forward:before{content:\"\\f04e\"}.fa-fast-forward:before{content:\"\\f050\"}.fa-step-forward:before{content:\"\\f051\"}.fa-eject:before{content:\"\\f052\"}.fa-chevron-left:before{content:\"\\f053\"}.fa-chevron-right:before{content:\"\\f054\"}.fa-plus-circle:before{content:\"\\f055\"}.fa-minus-circle:before{content:\"\\f056\"}.fa-times-circle:before{content:\"\\f057\"}.fa-check-circle:before{content:\"\\f058\"}.fa-question-circle:before{content:\"\\f059\"}.fa-info-circle:before{content:\"\\f05a\"}.fa-crosshairs:before{content:\"\\f05b\"}.fa-times-circle-o:before{content:\"\\f05c\"}.fa-check-circle-o:before{content:\"\\f05d\"}.fa-ban:before{content:\"\\f05e\"}.fa-arrow-left:before{content:\"\\f060\"}.fa-arrow-right:before{content:\"\\f061\"}.fa-arrow-up:before{content:\"\\f062\"}.fa-arrow-down:before{content:\"\\f063\"}.fa-mail-forward:before,.fa-share:before{content:\"\\f064\"}.fa-expand:before{content:\"\\f065\"}.fa-compress:before{content:\"\\f066\"}.fa-plus:before{content:\"\\f067\"}.fa-minus:before{content:\"\\f068\"}.fa-asterisk:before{content:\"\\f069\"}.fa-exclamation-circle:before{content:\"\\f06a\"}.fa-gift:before{content:\"\\f06b\"}.fa-leaf:before{content:\"\\f06c\"}.fa-fire:before{content:\"\\f06d\"}.fa-eye:before{content:\"\\f06e\"}.fa-eye-slash:before{content:\"\\f070\"}.fa-warning:before,.fa-exclamation-triangle:before{content:\"\\f071\"}.fa-plane:before{content:\"\\f072\"}.fa-calendar:before{content:\"\\f073\"}.fa-random:before{content:\"\\f074\"}.fa-comment:before{content:\"\\f075\"}.fa-magnet:before{content:\"\\f076\"}.fa-chevron-up:before{content:\"\\f077\"}.fa-chevron-down:before{content:\"\\f078\"}.fa-retweet:before{content:\"\\f079\"}.fa-shopping-cart:before{content:\"\\f07a\"}.fa-folder:before{content:\"\\f07b\"}.fa-folder-open:before{content:\"\\f07c\"}.fa-arrows-v:before{content:\"\\f07d\"}.fa-arrows-h:before{content:\"\\f07e\"}.fa-bar-chart-o:before{content:\"\\f080\"}.fa-twitter-square:before{content:\"\\f081\"}.fa-facebook-square:before{content:\"\\f082\"}.fa-camera-retro:before{content:\"\\f083\"}.fa-key:before{content:\"\\f084\"}.fa-gears:before,.fa-cogs:before{content:\"\\f085\"}.fa-comments:before{content:\"\\f086\"}.fa-thumbs-o-up:before{content:\"\\f087\"}.fa-thumbs-o-down:before{content:\"\\f088\"}.fa-star-half:before{content:\"\\f089\"}.fa-heart-o:before{content:\"\\f08a\"}.fa-sign-out:before{content:\"\\f08b\"}.fa-linkedin-square:before{content:\"\\f08c\"}.fa-thumb-tack:before{content:\"\\f08d\"}.fa-external-link:before{content:\"\\f08e\"}.fa-sign-in:before{content:\"\\f090\"}.fa-trophy:before{content:\"\\f091\"}.fa-github-square:before{content:\"\\f092\"}.fa-upload:before{content:\"\\f093\"}.fa-lemon-o:before{content:\"\\f094\"}.fa-phone:before{content:\"\\f095\"}.fa-square-o:before{content:\"\\f096\"}.fa-bookmark-o:before{content:\"\\f097\"}.fa-phone-square:before{content:\"\\f098\"}.fa-twitter:before{content:\"\\f099\"}.fa-facebook:before{content:\"\\f09a\"}.fa-github:before{content:\"\\f09b\"}.fa-unlock:before{content:\"\\f09c\"}.fa-credit-card:before{content:\"\\f09d\"}.fa-rss:before{content:\"\\f09e\"}.fa-hdd-o:before{content:\"\\f0a0\"}.fa-bullhorn:before{content:\"\\f0a1\"}.fa-bell:before{content:\"\\f0f3\"}.fa-certificate:before{content:\"\\f0a3\"}.fa-hand-o-right:before{content:\"\\f0a4\"}.fa-hand-o-left:before{content:\"\\f0a5\"}.fa-hand-o-up:before{content:\"\\f0a6\"}.fa-hand-o-down:before{content:\"\\f0a7\"}.fa-arrow-circle-left:before{content:\"\\f0a8\"}.fa-arrow-circle-right:before{content:\"\\f0a9\"}.fa-arrow-circle-up:before{content:\"\\f0aa\"}.fa-arrow-circle-down:before{content:\"\\f0ab\"}.fa-globe:before{content:\"\\f0ac\"}.fa-wrench:before{content:\"\\f0ad\"}.fa-tasks:before{content:\"\\f0ae\"}.fa-filter:before{content:\"\\f0b0\"}.fa-briefcase:before{content:\"\\f0b1\"}.fa-arrows-alt:before{content:\"\\f0b2\"}.fa-group:before,.fa-users:before{content:\"\\f0c0\"}.fa-chain:before,.fa-link:before{content:\"\\f0c1\"}.fa-cloud:before{content:\"\\f0c2\"}.fa-flask:before{content:\"\\f0c3\"}.fa-cut:before,.fa-scissors:before{content:\"\\f0c4\"}.fa-copy:before,.fa-files-o:before{content:\"\\f0c5\"}.fa-paperclip:before{content:\"\\f0c6\"}.fa-save:before,.fa-floppy-o:before{content:\"\\f0c7\"}.fa-square:before{content:\"\\f0c8\"}.fa-navicon:before,.fa-reorder:before,.fa-bars:before{content:\"\\f0c9\"}.fa-list-ul:before{content:\"\\f0ca\"}.fa-list-ol:before{content:\"\\f0cb\"}.fa-strikethrough:before{content:\"\\f0cc\"}.fa-underline:before{content:\"\\f0cd\"}.fa-table:before{content:\"\\f0ce\"}.fa-magic:before{content:\"\\f0d0\"}.fa-truck:before{content:\"\\f0d1\"}.fa-pinterest:before{content:\"\\f0d2\"}.fa-pinterest-square:before{content:\"\\f0d3\"}.fa-google-plus-square:before{content:\"\\f0d4\"}.fa-google-plus:before{content:\"\\f0d5\"}.fa-money:before{content:\"\\f0d6\"}.fa-caret-down:before{content:\"\\f0d7\"}.fa-caret-up:before{content:\"\\f0d8\"}.fa-caret-left:before{content:\"\\f0d9\"}.fa-caret-right:before{content:\"\\f0da\"}.fa-columns:before{content:\"\\f0db\"}.fa-unsorted:before,.fa-sort:before{content:\"\\f0dc\"}.fa-sort-down:before,.fa-sort-desc:before{content:\"\\f0dd\"}.fa-sort-up:before,.fa-sort-asc:before{content:\"\\f0de\"}.fa-envelope:before{content:\"\\f0e0\"}.fa-linkedin:before{content:\"\\f0e1\"}.fa-rotate-left:before,.fa-undo:before{content:\"\\f0e2\"}.fa-legal:before,.fa-gavel:before{content:\"\\f0e3\"}.fa-dashboard:before,.fa-tachometer:before{content:\"\\f0e4\"}.fa-comment-o:before{content:\"\\f0e5\"}.fa-comments-o:before{content:\"\\f0e6\"}.fa-flash:before,.fa-bolt:before{content:\"\\f0e7\"}.fa-sitemap:before{content:\"\\f0e8\"}.fa-umbrella:before{content:\"\\f0e9\"}.fa-paste:before,.fa-clipboard:before{content:\"\\f0ea\"}.fa-lightbulb-o:before{content:\"\\f0eb\"}.fa-exchange:before{content:\"\\f0ec\"}.fa-cloud-download:before{content:\"\\f0ed\"}.fa-cloud-upload:before{content:\"\\f0ee\"}.fa-user-md:before{content:\"\\f0f0\"}.fa-stethoscope:before{content:\"\\f0f1\"}.fa-suitcase:before{content:\"\\f0f2\"}.fa-bell-o:before{content:\"\\f0a2\"}.fa-coffee:before{content:\"\\f0f4\"}.fa-cutlery:before{content:\"\\f0f5\"}.fa-file-text-o:before{content:\"\\f0f6\"}.fa-building-o:before{content:\"\\f0f7\"}.fa-hospital-o:before{content:\"\\f0f8\"}.fa-ambulance:before{content:\"\\f0f9\"}.fa-medkit:before{content:\"\\f0fa\"}.fa-fighter-jet:before{content:\"\\f0fb\"}.fa-beer:before{content:\"\\f0fc\"}.fa-h-square:before{content:\"\\f0fd\"}.fa-plus-square:before{content:\"\\f0fe\"}.fa-angle-double-left:before{content:\"\\f100\"}.fa-angle-double-right:before{content:\"\\f101\"}.fa-angle-double-up:before{content:\"\\f102\"}.fa-angle-double-down:before{content:\"\\f103\"}.fa-angle-left:before{content:\"\\f104\"}.fa-angle-right:before{content:\"\\f105\"}.fa-angle-up:before{content:\"\\f106\"}.fa-angle-down:before{content:\"\\f107\"}.fa-desktop:before{content:\"\\f108\"}.fa-laptop:before{content:\"\\f109\"}.fa-tablet:before{content:\"\\f10a\"}.fa-mobile-phone:before,.fa-mobile:before{content:\"\\f10b\"}.fa-circle-o:before{content:\"\\f10c\"}.fa-quote-left:before{content:\"\\f10d\"}.fa-quote-right:before{content:\"\\f10e\"}.fa-spinner:before{content:\"\\f110\"}.fa-circle:before{content:\"\\f111\"}.fa-mail-reply:before,.fa-reply:before{content:\"\\f112\"}.fa-github-alt:before{content:\"\\f113\"}.fa-folder-o:before{content:\"\\f114\"}.fa-folder-open-o:before{content:\"\\f115\"}.fa-smile-o:before{content:\"\\f118\"}.fa-frown-o:before{content:\"\\f119\"}.fa-meh-o:before{content:\"\\f11a\"}.fa-gamepad:before{content:\"\\f11b\"}.fa-keyboard-o:before{content:\"\\f11c\"}.fa-flag-o:before{content:\"\\f11d\"}.fa-flag-checkered:before{content:\"\\f11e\"}.fa-terminal:before{content:\"\\f120\"}.fa-code:before{content:\"\\f121\"}.fa-mail-reply-all:before,.fa-reply-all:before{content:\"\\f122\"}.fa-star-half-empty:before,.fa-star-half-full:before,.fa-star-half-o:before{content:\"\\f123\"}.fa-location-arrow:before{content:\"\\f124\"}.fa-crop:before{content:\"\\f125\"}.fa-code-fork:before{content:\"\\f126\"}.fa-unlink:before,.fa-chain-broken:before{content:\"\\f127\"}.fa-question:before{content:\"\\f128\"}.fa-info:before{content:\"\\f129\"}.fa-exclamation:before{content:\"\\f12a\"}.fa-superscript:before{content:\"\\f12b\"}.fa-subscript:before{content:\"\\f12c\"}.fa-eraser:before{content:\"\\f12d\"}.fa-puzzle-piece:before{content:\"\\f12e\"}.fa-microphone:before{content:\"\\f130\"}.fa-microphone-slash:before{content:\"\\f131\"}.fa-shield:before{content:\"\\f132\"}.fa-calendar-o:before{content:\"\\f133\"}.fa-fire-extinguisher:before{content:\"\\f134\"}.fa-rocket:before{content:\"\\f135\"}.fa-maxcdn:before{content:\"\\f136\"}.fa-chevron-circle-left:before{content:\"\\f137\"}.fa-chevron-circle-right:before{content:\"\\f138\"}.fa-chevron-circle-up:before{content:\"\\f139\"}.fa-chevron-circle-down:before{content:\"\\f13a\"}.fa-html5:before{content:\"\\f13b\"}.fa-css3:before{content:\"\\f13c\"}.fa-anchor:before{content:\"\\f13d\"}.fa-unlock-alt:before{content:\"\\f13e\"}.fa-bullseye:before{content:\"\\f140\"}.fa-ellipsis-h:before{content:\"\\f141\"}.fa-ellipsis-v:before{content:\"\\f142\"}.fa-rss-square:before{content:\"\\f143\"}.fa-play-circle:before{content:\"\\f144\"}.fa-ticket:before{content:\"\\f145\"}.fa-minus-square:before{content:\"\\f146\"}.fa-minus-square-o:before{content:\"\\f147\"}.fa-level-up:before{content:\"\\f148\"}.fa-level-down:before{content:\"\\f149\"}.fa-check-square:before{content:\"\\f14a\"}.fa-pencil-square:before{content:\"\\f14b\"}.fa-external-link-square:before{content:\"\\f14c\"}.fa-share-square:before{content:\"\\f14d\"}.fa-compass:before{content:\"\\f14e\"}.fa-toggle-down:before,.fa-caret-square-o-down:before{content:\"\\f150\"}.fa-toggle-up:before,.fa-caret-square-o-up:before{content:\"\\f151\"}.fa-toggle-right:before,.fa-caret-square-o-right:before{content:\"\\f152\"}.fa-euro:before,.fa-eur:before{content:\"\\f153\"}.fa-gbp:before{content:\"\\f154\"}.fa-dollar:before,.fa-usd:before{content:\"\\f155\"}.fa-rupee:before,.fa-inr:before{content:\"\\f156\"}.fa-cny:before,.fa-rmb:before,.fa-yen:before,.fa-jpy:before{content:\"\\f157\"}.fa-ruble:before,.fa-rouble:before,.fa-rub:before{content:\"\\f158\"}.fa-won:before,.fa-krw:before{content:\"\\f159\"}.fa-bitcoin:before,.fa-btc:before{content:\"\\f15a\"}.fa-file:before{content:\"\\f15b\"}.fa-file-text:before{content:\"\\f15c\"}.fa-sort-alpha-asc:before{content:\"\\f15d\"}.fa-sort-alpha-desc:before{content:\"\\f15e\"}.fa-sort-amount-asc:before{content:\"\\f160\"}.fa-sort-amount-desc:before{content:\"\\f161\"}.fa-sort-numeric-asc:before{content:\"\\f162\"}.fa-sort-numeric-desc:before{content:\"\\f163\"}.fa-thumbs-up:before{content:\"\\f164\"}.fa-thumbs-down:before{content:\"\\f165\"}.fa-youtube-square:before{content:\"\\f166\"}.fa-youtube:before{content:\"\\f167\"}.fa-xing:before{content:\"\\f168\"}.fa-xing-square:before{content:\"\\f169\"}.fa-youtube-play:before{content:\"\\f16a\"}.fa-dropbox:before{content:\"\\f16b\"}.fa-stack-overflow:before{content:\"\\f16c\"}.fa-instagram:before{content:\"\\f16d\"}.fa-flickr:before{content:\"\\f16e\"}.fa-adn:before{content:\"\\f170\"}.fa-bitbucket:before{content:\"\\f171\"}.fa-bitbucket-square:before{content:\"\\f172\"}.fa-tumblr:before{content:\"\\f173\"}.fa-tumblr-square:before{content:\"\\f174\"}.fa-long-arrow-down:before{content:\"\\f175\"}.fa-long-arrow-up:before{content:\"\\f176\"}.fa-long-arrow-left:before{content:\"\\f177\"}.fa-long-arrow-right:before{content:\"\\f178\"}.fa-apple:before{content:\"\\f179\"}.fa-windows:before{content:\"\\f17a\"}.fa-android:before{content:\"\\f17b\"}.fa-linux:before{content:\"\\f17c\"}.fa-dribbble:before{content:\"\\f17d\"}.fa-skype:before{content:\"\\f17e\"}.fa-foursquare:before{content:\"\\f180\"}.fa-trello:before{content:\"\\f181\"}.fa-female:before{content:\"\\f182\"}.fa-male:before{content:\"\\f183\"}.fa-gittip:before{content:\"\\f184\"}.fa-sun-o:before{content:\"\\f185\"}.fa-moon-o:before{content:\"\\f186\"}.fa-archive:before{content:\"\\f187\"}.fa-bug:before{content:\"\\f188\"}.fa-vk:before{content:\"\\f189\"}.fa-weibo:before{content:\"\\f18a\"}.fa-renren:before{content:\"\\f18b\"}.fa-pagelines:before{content:\"\\f18c\"}.fa-stack-exchange:before{content:\"\\f18d\"}.fa-arrow-circle-o-right:before{content:\"\\f18e\"}.fa-arrow-circle-o-left:before{content:\"\\f190\"}.fa-toggle-left:before,.fa-caret-square-o-left:before{content:\"\\f191\"}.fa-dot-circle-o:before{content:\"\\f192\"}.fa-wheelchair:before{content:\"\\f193\"}.fa-vimeo-square:before{content:\"\\f194\"}.fa-turkish-lira:before,.fa-try:before{content:\"\\f195\"}.fa-plus-square-o:before{content:\"\\f196\"}.fa-space-shuttle:before{content:\"\\f197\"}.fa-slack:before{content:\"\\f198\"}.fa-envelope-square:before{content:\"\\f199\"}.fa-wordpress:before{content:\"\\f19a\"}.fa-openid:before{content:\"\\f19b\"}.fa-institution:before,.fa-bank:before,.fa-university:before{content:\"\\f19c\"}.fa-mortar-board:before,.fa-graduation-cap:before{content:\"\\f19d\"}.fa-yahoo:before{content:\"\\f19e\"}.fa-google:before{content:\"\\f1a0\"}.fa-reddit:before{content:\"\\f1a1\"}.fa-reddit-square:before{content:\"\\f1a2\"}.fa-stumbleupon-circle:before{content:\"\\f1a3\"}.fa-stumbleupon:before{content:\"\\f1a4\"}.fa-delicious:before{content:\"\\f1a5\"}.fa-digg:before{content:\"\\f1a6\"}.fa-pied-piper-square:before,.fa-pied-piper:before{content:\"\\f1a7\"}.fa-pied-piper-alt:before{content:\"\\f1a8\"}.fa-drupal:before{content:\"\\f1a9\"}.fa-joomla:before{content:\"\\f1aa\"}.fa-language:before{content:\"\\f1ab\"}.fa-fax:before{content:\"\\f1ac\"}.fa-building:before{content:\"\\f1ad\"}.fa-child:before{content:\"\\f1ae\"}.fa-paw:before{content:\"\\f1b0\"}.fa-spoon:before{content:\"\\f1b1\"}.fa-cube:before{content:\"\\f1b2\"}.fa-cubes:before{content:\"\\f1b3\"}.fa-behance:before{content:\"\\f1b4\"}.fa-behance-square:before{content:\"\\f1b5\"}.fa-steam:before{content:\"\\f1b6\"}.fa-steam-square:before{content:\"\\f1b7\"}.fa-recycle:before{content:\"\\f1b8\"}.fa-automobile:before,.fa-car:before{content:\"\\f1b9\"}.fa-cab:before,.fa-taxi:before{content:\"\\f1ba\"}.fa-tree:before{content:\"\\f1bb\"}.fa-spotify:before{content:\"\\f1bc\"}.fa-deviantart:before{content:\"\\f1bd\"}.fa-soundcloud:before{content:\"\\f1be\"}.fa-database:before{content:\"\\f1c0\"}.fa-file-pdf-o:before{content:\"\\f1c1\"}.fa-file-word-o:before{content:\"\\f1c2\"}.fa-file-excel-o:before{content:\"\\f1c3\"}.fa-file-powerpoint-o:before{content:\"\\f1c4\"}.fa-file-photo-o:before,.fa-file-picture-o:before,.fa-file-image-o:before{content:\"\\f1c5\"}.fa-file-zip-o:before,.fa-file-archive-o:before{content:\"\\f1c6\"}.fa-file-sound-o:before,.fa-file-audio-o:before{content:\"\\f1c7\"}.fa-file-movie-o:before,.fa-file-video-o:before{content:\"\\f1c8\"}.fa-file-code-o:before{content:\"\\f1c9\"}.fa-vine:before{content:\"\\f1ca\"}.fa-codepen:before{content:\"\\f1cb\"}.fa-jsfiddle:before{content:\"\\f1cc\"}.fa-life-bouy:before,.fa-life-saver:before,.fa-support:before,.fa-life-ring:before{content:\"\\f1cd\"}.fa-circle-o-notch:before{content:\"\\f1ce\"}.fa-ra:before,.fa-rebel:before{content:\"\\f1d0\"}.fa-ge:before,.fa-empire:before{content:\"\\f1d1\"}.fa-git-square:before{content:\"\\f1d2\"}.fa-git:before{content:\"\\f1d3\"}.fa-hacker-news:before{content:\"\\f1d4\"}.fa-tencent-weibo:before{content:\"\\f1d5\"}.fa-qq:before{content:\"\\f1d6\"}.fa-wechat:before,.fa-weixin:before{content:\"\\f1d7\"}.fa-send:before,.fa-paper-plane:before{content:\"\\f1d8\"}.fa-send-o:before,.fa-paper-plane-o:before{content:\"\\f1d9\"}.fa-history:before{content:\"\\f1da\"}.fa-circle-thin:before{content:\"\\f1db\"}.fa-header:before{content:\"\\f1dc\"}.fa-paragraph:before{content:\"\\f1dd\"}.fa-sliders:before{content:\"\\f1de\"}.fa-share-alt:before{content:\"\\f1e0\"}.fa-share-alt-square:before{content:\"\\f1e1\"}.fa-bomb:before{content:\"\\f1e2\"}&lt;\/style&gt; &lt;script src=\"\/js\/jquery-1.8.3.min.js\"&gt;&lt;\/script&gt; &lt;script src=\"\/js\/prefixfree.min.js\"&gt;&lt;\/script&gt; &lt;script src=\"\/js\/common.js\"&gt;&lt;\/script&gt; &lt;!--\/\/\uc2a4\ud06c\ub864--&gt; &lt;script src=\"\/js\/scrollIt.js\"&gt;&lt;\/script&gt; &lt;!--text animation--&gt; &lt;script src=\"\/js\/jquery.fittext.js\"&gt;&lt;\/script&gt; &lt;script src=\"\/js\/jquery.lettering.js\"&gt;&lt;\/script&gt; &lt;script src=\"\/js\/jquery.textillate.js\"&gt;&lt;\/script&gt; &lt;style media=\"\" data-href=\"\/css\/text_animation.css\"&gt;\/*# sourceURL=\/css\/text_animation.css *\/ \/*@ sourceURL=\/css\/text_animation.css *\/ @charset \"UTF-8\"; \/* Animate.css - http:\/\/daneden.me\/animate Licensed under the \u263a license (http:\/\/licence.visualidiot.com\/) Copyright (c) 2012 Dan Eden Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the \"Software\"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and\/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. *\/ body { \/* Addresses a small issue in webkit: http:\/\/bit.ly\/NEdoDq *\/ -webkit-backface-visibility: hidden; } .animated { -webkit-animation-duration: 1s; \u00a0 \u00a0-moz-animation-duration: 1s; \u00a0 \u00a0 \u00a0-o-animation-duration: 1s; \u00a0 \u00a0 \u00a0 \u00a0 animation-duration: 1s; -webkit-animation-fill-mode: both; \u00a0 \u00a0-moz-animation-fill-mode: both; \u00a0 \u00a0 \u00a0-o-animation-fill-mode: both; \u00a0 \u00a0 \u00a0 \u00a0 animation-fill-mode: both; } .animated.hinge { -webkit-animation-duration: 2s; \u00a0 \u00a0-moz-animation-duration: 2s; \u00a0 \u00a0 \u00a0-o-animation-duration: 2s; \u00a0 \u00a0 \u00a0 \u00a0 animation-duration: 2s; } @-webkit-keyframes flash { 0%, 50%, 100% {opacity: 1;} 25%, 75% {opacity: 0;} } @-moz-keyframes flash { 0%, 50%, 100% {opacity: 1;} 25%, 75% {opacity: 0;} } @-o-keyframes flash { 0%, 50%, 100% {opacity: 1;} 25%, 75% {opacity: 0;} } @keyframes flash { 0%, 50%, 100% {opacity: 1;} 25%, 75% {opacity: 0;} } .flash { -webkit-animation-name: flash; -moz-animation-name: flash; -o-animation-name: flash; animation-name: flash; } @-webkit-keyframes shake { 0%, 100% {-webkit-transform: translateX(0);} 10%, 30%, 50%, 70%, 90% {-webkit-transform: translateX(-10px);} 20%, 40%, 60%, 80% {-webkit-transform: translateX(10px);} } @-moz-keyframes shake { 0%, 100% {-moz-transform: translateX(0);} 10%, 30%, 50%, 70%, 90% {-moz-transform: translateX(-10px);} 20%, 40%, 60%, 80% {-moz-transform: translateX(10px);} } @-o-keyframes shake { 0%, 100% {-o-transform: translateX(0);} 10%, 30%, 50%, 70%, 90% {-o-transform: translateX(-10px);} 20%, 40%, 60%, 80% {-o-transform: translateX(10px);} } @keyframes shake { 0%, 100% {transform: translateX(0);} 10%, 30%, 50%, 70%, 90% {transform: translateX(-10px);} 20%, 40%, 60%, 80% {transform: translateX(10px);} } .shake { -webkit-animation-name: shake; -moz-animation-name: shake; -o-animation-name: shake; animation-name: shake; } @-webkit-keyframes bounce { 0%, 20%, 50%, 80%, 100% {-webkit-transform: translateY(0);} 40% {-webkit-transform: translateY(-30px);} 60% {-webkit-transform: translateY(-15px);} } @-moz-keyframes bounce { 0%, 20%, 50%, 80%, 100% {-moz-transform: translateY(0);} 40% {-moz-transform: translateY(-30px);} 60% {-moz-transform: translateY(-15px);} } @-o-keyframes bounce { 0%, 20%, 50%, 80%, 100% {-o-transform: translateY(0);} 40% {-o-transform: translateY(-30px);} 60% {-o-transform: translateY(-15px);} } @keyframes bounce { 0%, 20%, 50%, 80%, 100% {transform: translateY(0);} 40% {transform: translateY(-30px);} 60% {transform: translateY(-15px);} } .bounce { -webkit-animation-name: bounce; -moz-animation-name: bounce; -o-animation-name: bounce; animation-name: bounce; } @-webkit-keyframes tada { 0% {-webkit-transform: scale(1);} 10%, 20% {-webkit-transform: scale(0.9) rotate(-3deg);} 30%, 50%, 70%, 90% {-webkit-transform: scale(1.1) rotate(3deg);} 40%, 60%, 80% {-webkit-transform: scale(1.1) rotate(-3deg);} 100% {-webkit-transform: scale(1) rotate(0);} } @-moz-keyframes tada { 0% {-moz-transform: scale(1);} 10%, 20% {-moz-transform: scale(0.9) rotate(-3deg);} 30%, 50%, 70%, 90% {-moz-transform: scale(1.1) rotate(3deg);} 40%, 60%, 80% {-moz-transform: scale(1.1) rotate(-3deg);} 100% {-moz-transform: scale(1) rotate(0);} } @-o-keyframes tada { 0% {-o-transform: scale(1);} 10%, 20% {-o-transform: scale(0.9) rotate(-3deg);} 30%, 50%, 70%, 90% {-o-transform: scale(1.1) rotate(3deg);} 40%, 60%, 80% {-o-transform: scale(1.1) rotate(-3deg);} 100% {-o-transform: scale(1) rotate(0);} } @keyframes tada { 0% {transform: scale(1);} 10%, 20% {transform: scale(0.9) rotate(-3deg);} 30%, 50%, 70%, 90% {transform: scale(1.1) rotate(3deg);} 40%, 60%, 80% {transform: scale(1.1) rotate(-3deg);} 100% {transform: scale(1) rotate(0);} } .tada { -webkit-animation-name: tada; -moz-animation-name: tada; -o-animation-name: tada; animation-name: tada; } @-webkit-keyframes swing { 20%, 40%, 60%, 80%, 100% { -webkit-transform-origin: top center; } 20% { -webkit-transform: rotate(15deg); } 40% { -webkit-transform: rotate(-10deg); } 60% { -webkit-transform: rotate(5deg); } 80% { -webkit-transform: rotate(-5deg); } 100% { -webkit-transform: rotate(0deg); } } @-moz-keyframes swing { 20% { -moz-transform: rotate(15deg); } 40% { -moz-transform: rotate(-10deg); } 60% { -moz-transform: rotate(5deg); } 80% { -moz-transform: rotate(-5deg); } 100% { -moz-transform: rotate(0deg); } } @-o-keyframes swing { 20% { -o-transform: rotate(15deg); } 40% { -o-transform: rotate(-10deg); } 60% { -o-transform: rotate(5deg); } 80% { -o-transform: rotate(-5deg); } 100% { -o-transform: rotate(0deg); } } @keyframes swing { 20% { transform: rotate(15deg); } 40% { transform: rotate(-10deg); } 60% { transform: rotate(5deg); } 80% { transform: rotate(-5deg); } 100% { transform: rotate(0deg); } } .swing { -webkit-transform-origin: top center; -moz-transform-origin: top center; -o-transform-origin: top center; transform-origin: top center; -webkit-animation-name: swing; -moz-animation-name: swing; -o-animation-name: swing; animation-name: swing; } \/* originally authored by Nick Pettit - https:\/\/github.com\/nickpettit\/glide *\/ @-webkit-keyframes wobble { \u00a0 0% { -webkit-transform: translateX(0%); } \u00a0 15% { -webkit-transform: translateX(-25%) rotate(-5deg); } \u00a0 30% { -webkit-transform: translateX(20%) rotate(3deg); } \u00a0 45% { -webkit-transform: translateX(-15%) rotate(-3deg); } \u00a0 60% { -webkit-transform: translateX(10%) rotate(2deg); } \u00a0 75% { -webkit-transform: translateX(-5%) rotate(-1deg); } \u00a0 100% { -webkit-transform: translateX(0%); } } @-moz-keyframes wobble { \u00a0 0% { -moz-transform: translateX(0%); } \u00a0 15% { -moz-transform: translateX(-25%) rotate(-5deg); } \u00a0 30% { -moz-transform: translateX(20%) rotate(3deg); } \u00a0 45% { -moz-transform: translateX(-15%) rotate(-3deg); } \u00a0 60% { -moz-transform: translateX(10%) rotate(2deg); } \u00a0 75% { -moz-transform: translateX(-5%) rotate(-1deg); } \u00a0 100% { -moz-transform: translateX(0%); } } @-o-keyframes wobble { \u00a0 0% { -o-transform: translateX(0%); } \u00a0 15% { -o-transform: translateX(-25%) rotate(-5deg); } \u00a0 30% { -o-transform: translateX(20%) rotate(3deg); } \u00a0 45% { -o-transform: translateX(-15%) rotate(-3deg); } \u00a0 60% { -o-transform: translateX(10%) rotate(2deg); } \u00a0 75% { -o-transform: translateX(-5%) rotate(-1deg); } \u00a0 100% { -o-transform: translateX(0%); } } @keyframes wobble { \u00a0 0% { transform: translateX(0%); } \u00a0 15% { transform: translateX(-25%) rotate(-5deg); } \u00a0 30% { transform: translateX(20%) rotate(3deg); } \u00a0 45% { transform: translateX(-15%) rotate(-3deg); } \u00a0 60% { transform: translateX(10%) rotate(2deg); } \u00a0 75% { transform: translateX(-5%) rotate(-1deg); } \u00a0 100% { transform: translateX(0%); } } .wobble { -webkit-animation-name: wobble; -moz-animation-name: wobble; -o-animation-name: wobble; animation-name: wobble; } \/* originally authored by Nick Pettit - https:\/\/github.com\/nickpettit\/glide *\/ @-webkit-keyframes pulse { \u00a0 \u00a0 0% { -webkit-transform: scale(1); } 50% { -webkit-transform: scale(1.1); } \u00a0 \u00a0 100% { -webkit-transform: scale(1); } } @-moz-keyframes pulse { \u00a0 \u00a0 0% { -moz-transform: scale(1); } 50% { -moz-transform: scale(1.1); } \u00a0 \u00a0 100% { -moz-transform: scale(1); } } @-o-keyframes pulse { \u00a0 \u00a0 0% { -o-transform: scale(1); } 50% { -o-transform: scale(1.1); } \u00a0 \u00a0 100% { -o-transform: scale(1); } } @keyframes pulse { \u00a0 \u00a0 0% { transform: scale(1); } 50% { transform: scale(1.1); } \u00a0 \u00a0 100% { transform: scale(1); } } .pulse { -webkit-animation-name: pulse; -moz-animation-name: pulse; -o-animation-name: pulse; animation-name: pulse; } @-webkit-keyframes flip { 0% { -webkit-transform: perspective(400px) rotateY(0); -webkit-animation-timing-function: ease-out; } 40% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg); -webkit-animation-timing-function: ease-out; } 50% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -webkit-animation-timing-function: ease-in; } 80% { -webkit-transform: perspective(400px) rotateY(360deg) scale(.95); -webkit-animation-timing-function: ease-in; } 100% { -webkit-transform: perspective(400px) scale(1); -webkit-animation-timing-function: ease-in; } } @-moz-keyframes flip { 0% { -moz-transform: perspective(400px) rotateY(0); -moz-animation-timing-function: ease-out; } 40% { -moz-transform: perspective(400px) translateZ(150px) rotateY(170deg); -moz-animation-timing-function: ease-out; } 50% { -moz-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -moz-animation-timing-function: ease-in; } 80% { -moz-transform: perspective(400px) rotateY(360deg) scale(.95); -moz-animation-timing-function: ease-in; } 100% { -moz-transform: perspective(400px) scale(1); -moz-animation-timing-function: ease-in; } } @-o-keyframes flip { 0% { -o-transform: perspective(400px) rotateY(0); -o-animation-timing-function: ease-out; } 40% { -o-transform: perspective(400px) translateZ(150px) rotateY(170deg); -o-animation-timing-function: ease-out; } 50% { -o-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -o-animation-timing-function: ease-in; } 80% { -o-transform: perspective(400px) rotateY(360deg) scale(.95); -o-animation-timing-function: ease-in; } 100% { -o-transform: perspective(400px) scale(1); -o-animation-timing-function: ease-in; } } @keyframes flip { 0% { transform: perspective(400px) rotateY(0); animation-timing-function: ease-out; } 40% { transform: perspective(400px) translateZ(150px) rotateY(170deg); animation-timing-function: ease-out; } 50% { transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); animation-timing-function: ease-in; } 80% { transform: perspective(400px) rotateY(360deg) scale(.95); animation-timing-function: ease-in; } 100% { transform: perspective(400px) scale(1); animation-timing-function: ease-in; } } .flip { -webkit-backface-visibility: visible !important; -webkit-animation-name: flip; -moz-backface-visibility: visible !important; -moz-animation-name: flip; -o-backface-visibility: visible !important; -o-animation-name: flip; backface-visibility: visible !important; animation-name: flip; } @-webkit-keyframes flipInX { \u00a0 \u00a0 0% { \u00a0 \u00a0 \u00a0 \u00a0 -webkit-transform: perspective(400px) rotateX(90deg); \u00a0 \u00a0 \u00a0 \u00a0 opacity: 0; \u00a0 \u00a0 } \u00a0 \u00a0\u00a0 \u00a0 \u00a0 40% { \u00a0 \u00a0 \u00a0 \u00a0 -webkit-transform: perspective(400px) rotateX(-10deg); \u00a0 \u00a0 } \u00a0 \u00a0\u00a0 \u00a0 \u00a0 70% { \u00a0 \u00a0 \u00a0 \u00a0 -webkit-transform: perspective(400px) rotateX(10deg); \u00a0 \u00a0 } \u00a0 \u00a0\u00a0 \u00a0 \u00a0 100% { \u00a0 \u00a0 \u00a0 \u00a0 -webkit-transform: perspective(400px) rotateX(0deg); \u00a0 \u00a0 \u00a0 \u00a0 opacity: 1; \u00a0 \u00a0 } } @-moz-keyframes flipInX { \u00a0 \u00a0 0% { \u00a0 \u00a0 \u00a0 \u00a0 -moz-transform: perspective(400px) rotateX(90deg); \u00a0 \u00a0 \u00a0 \u00a0 opacity: 0; \u00a0 \u00a0 } \u00a0 \u00a0\u00a0 \u00a0 \u00a0 40% { \u00a0 \u00a0 \u00a0 \u00a0 -moz-transform: perspective(400px) rotateX(-10deg); \u00a0 \u00a0 } \u00a0 \u00a0\u00a0 \u00a0 \u00a0 70% { \u00a0 \u00a0 \u00a0 \u00a0 -moz-transform: perspective(400px) rotateX(10deg); \u00a0 \u00a0 } \u00a0 \u00a0\u00a0 \u00a0 \u00a0 100% { \u00a0 \u00a0 \u00a0 \u00a0 -moz-transform: perspective(400px) rotateX(0deg); \u00a0 \u00a0 \u00a0 \u00a0 opacity: 1; \u00a0 \u00a0 } } @-o-keyframes flipInX { \u00a0 \u00a0 0% { \u00a0 \u00a0 \u00a0 \u00a0 -o-transform: perspective(400px) rotateX(90deg); \u00a0 \u00a0 \u00a0 \u00a0 opacity: 0; \u00a0 \u00a0 } \u00a0 \u00a0\u00a0 \u00a0 \u00a0 40% { \u00a0 \u00a0 \u00a0 \u00a0 -o-transform: perspective(400px) rotateX(-10deg); \u00a0 \u00a0 } \u00a0 \u00a0\u00a0 \u00a0 \u00a0 70% { \u00a0 \u00a0 \u00a0 \u00a0 -o-transform: perspective(400px) rotateX(10deg); \u00a0 \u00a0 } \u00a0 \u00a0\u00a0 \u00a0 \u00a0 100% { \u00a0 \u00a0 \u00a0 \u00a0 -o-transform: perspective(400px) rotateX(0deg); \u00a0 \u00a0 \u00a0 \u00a0 opacity: 1; \u00a0 \u00a0 } } @keyframes flipInX { \u00a0 \u00a0 0% { \u00a0 \u00a0 \u00a0 \u00a0 transform: perspective(400px) rotateX(90deg); \u00a0 \u00a0 \u00a0 \u00a0 opacity: 0; \u00a0 \u00a0 } \u00a0 \u00a0\u00a0 \u00a0 \u00a0 40% { \u00a0 \u00a0 \u00a0 \u00a0 transform: perspective(400px) rotateX(-10deg); \u00a0 \u00a0 } \u00a0 \u00a0\u00a0 \u00a0 \u00a0 70% { \u00a0 \u00a0 \u00a0 \u00a0 transform: perspective(400px) rotateX(10deg); \u00a0 \u00a0 } \u00a0 \u00a0\u00a0 \u00a0 \u00a0 100% { \u00a0 \u00a0 \u00a0 \u00a0 transform: perspective(400px) rotateX(0deg); \u00a0 \u00a0 \u00a0 \u00a0 opacity: 1; \u00a0 \u00a0 } } .flipInX { -webkit-backface-visibility: visible !important; -webkit-animation-name: flipInX; -moz-backface-visibility: visible !important; -moz-animation-name: flipInX; -o-backface-visibility: visible !important; -o-animation-name: flipInX; backface-visibility: visible !important; animation-name: flipInX; } @-webkit-keyframes flipOutX { \u00a0 \u00a0 0% { \u00a0 \u00a0 \u00a0 \u00a0 -webkit-transform: perspective(400px) rotateX(0deg); \u00a0 \u00a0 \u00a0 \u00a0 opacity: 1; \u00a0 \u00a0 } 100% { \u00a0 \u00a0 \u00a0 \u00a0 -webkit-transform: perspective(400px) rotateX(90deg); \u00a0 \u00a0 \u00a0 \u00a0 opacity: 0; \u00a0 \u00a0 } } @-moz-keyframes flipOutX { \u00a0 \u00a0 0% { \u00a0 \u00a0 \u00a0 \u00a0 -moz-transform: perspective(400px) rotateX(0deg); \u00a0 \u00a0 \u00a0 \u00a0 opacity: 1; \u00a0 \u00a0 } 100% { \u00a0 \u00a0 \u00a0 \u00a0 -moz-transform: perspective(400px) rotateX(90deg); \u00a0 \u00a0 \u00a0 \u00a0 opacity: 0; \u00a0 \u00a0 } } @-o-keyframes flipOutX { \u00a0 \u00a0 0% { \u00a0 \u00a0 \u00a0 \u00a0 -o-transform: perspective(400px) rotateX(0deg); \u00a0 \u00a0 \u00a0 \u00a0 opacity: 1; \u00a0 \u00a0 } 100% { \u00a0 \u00a0 \u00a0 \u00a0 -o-transform: perspective(400px) rotateX(90deg); \u00a0 \u00a0 \u00a0 \u00a0 opacity: 0; \u00a0 \u00a0 } } @keyframes flipOutX { \u00a0 \u00a0 0% { \u00a0 \u00a0 \u00a0 \u00a0 transform: perspective(400px) rotateX(0deg); \u00a0 \u00a0 \u00a0 \u00a0 opacity: 1; \u00a0 \u00a0 } 100% { \u00a0 \u00a0 \u00a0 \u00a0 transform: perspective(400px) rotateX(90deg); \u00a0 \u00a0 \u00a0 \u00a0 opacity: 0; \u00a0 \u00a0 } } .flipOutX { -webkit-animation-name: flipOutX; -webkit-backface-visibility: visible !important; -moz-animation-name: flipOutX; -moz-backface-visibility: visible !important; -o-animation-name: flipOutX; -o-backface-visibility: visible !important; animation-name: flipOutX; backface-visibility: visible !important; } @-webkit-keyframes flipInY { \u00a0 \u00a0 0% { \u00a0 \u00a0 \u00a0 \u00a0 -webkit-transform: perspective(400px) rotateY(90deg); \u00a0 \u00a0 \u00a0 \u00a0 opacity: 0; \u00a0 \u00a0 } \u00a0 \u00a0\u00a0 \u00a0 \u00a0 40% { \u00a0 \u00a0 \u00a0 \u00a0 -webkit-transform: perspective(400px) rotateY(-10deg); \u00a0 \u00a0 } \u00a0 \u00a0\u00a0 \u00a0 \u00a0 70% { \u00a0 \u00a0 \u00a0 \u00a0 -webkit-transform: perspective(400px) rotateY(10deg); \u00a0 \u00a0 } \u00a0 \u00a0\u00a0 \u00a0 \u00a0 100% { \u00a0 \u00a0 \u00a0 \u00a0 -webkit-transform: perspective(400px) rotateY(0deg); \u00a0 \u00a0 \u00a0 \u00a0 opacity: 1; \u00a0 \u00a0 } } @-moz-keyframes flipInY { \u00a0 \u00a0 0% { \u00a0 \u00a0 \u00a0 \u00a0 -moz-transform: perspective(400px) rotateY(90deg); \u00a0 \u00a0 \u00a0 \u00a0 opacity: 0; \u00a0 \u00a0 } \u00a0 \u00a0\u00a0 \u00a0 \u00a0 40% { \u00a0 \u00a0 \u00a0 \u00a0 -moz-transform: perspective(400px) rotateY(-10deg); \u00a0 \u00a0 } \u00a0 \u00a0\u00a0 \u00a0 \u00a0 70% { \u00a0 \u00a0 \u00a0 \u00a0 -moz-transform: perspective(400px) rotateY(10deg); \u00a0 \u00a0 } \u00a0 \u00a0\u00a0 \u00a0 \u00a0 100% { \u00a0 \u00a0 \u00a0 \u00a0 -moz-transform: perspective(400px) rotateY(0deg); \u00a0 \u00a0 \u00a0 \u00a0 opacity: 1; \u00a0 \u00a0 } } @-o-keyframes flipInY { \u00a0 \u00a0 0% { \u00a0 \u00a0 \u00a0 \u00a0 -o-transform: perspective(400px) rotateY(90deg); \u00a0 \u00a0 \u00a0 \u00a0 opacity: 0; \u00a0 \u00a0 } \u00a0 \u00a0\u00a0 \u00a0 \u00a0 40% { \u00a0 \u00a0 \u00a0 \u00a0 -o-transform: perspective(400px) rotateY(-10deg); \u00a0 \u00a0 } \u00a0 \u00a0\u00a0 \u00a0 \u00a0 70% { \u00a0 \u00a0 \u00a0 \u00a0 -o-transform: perspective(400px) rotateY(10deg); \u00a0 \u00a0 } \u00a0 \u00a0\u00a0 \u00a0 \u00a0 100% { \u00a0 \u00a0 \u00a0 \u00a0 -o-transform: perspective(400px) rotateY(0deg); \u00a0 \u00a0 \u00a0 \u00a0 opacity: 1; \u00a0 \u00a0 } } @keyframes flipInY { \u00a0 \u00a0 0% { \u00a0 \u00a0 \u00a0 \u00a0 transform: perspective(400px) rotateY(90deg); \u00a0 \u00a0 \u00a0 \u00a0 opacity: 0; \u00a0 \u00a0 } \u00a0 \u00a0\u00a0 \u00a0 \u00a0 40% { \u00a0 \u00a0 \u00a0 \u00a0 transform: perspective(400px) rotateY(-10deg); \u00a0 \u00a0 } \u00a0 \u00a0\u00a0 \u00a0 \u00a0 70% { \u00a0 \u00a0 \u00a0 \u00a0 transform: perspective(400px) rotateY(10deg); \u00a0 \u00a0 } \u00a0 \u00a0\u00a0 \u00a0 \u00a0 100% { \u00a0 \u00a0 \u00a0 \u00a0 transform: perspective(400px) rotateY(0deg); \u00a0 \u00a0 \u00a0 \u00a0 opacity: 1; \u00a0 \u00a0 } } .flipInY { -webkit-backface-visibility: visible !important; -webkit-animation-name: flipInY; -moz-backface-visibility: visible !important; -moz-animation-name: flipInY; -o-backface-visibility: visible !important; -o-animation-name: flipInY; backface-visibility: visible !important; animation-name: flipInY; } @-webkit-keyframes flipOutY { \u00a0 \u00a0 0% { \u00a0 \u00a0 \u00a0 \u00a0 -webkit-transform: perspective(400px) rotateY(0deg); \u00a0 \u00a0 \u00a0 \u00a0 opacity: 1; \u00a0 \u00a0 } 100% { \u00a0 \u00a0 \u00a0 \u00a0 -webkit-transform: perspective(400px) rotateY(90deg); \u00a0 \u00a0 \u00a0 \u00a0 opacity: 0; \u00a0 \u00a0 } } @-moz-keyframes flipOutY { \u00a0 \u00a0 0% { \u00a0 \u00a0 \u00a0 \u00a0 -moz-transform: perspective(400px) rotateY(0deg); \u00a0 \u00a0 \u00a0 \u00a0 opacity: 1; \u00a0 \u00a0 } 100% { \u00a0 \u00a0 \u00a0 \u00a0 -moz-transform: perspective(400px) rotateY(90deg); \u00a0 \u00a0 \u00a0 \u00a0 opacity: 0; \u00a0 \u00a0 } } @-o-keyframes flipOutY { \u00a0 \u00a0 0% { \u00a0 \u00a0 \u00a0 \u00a0 -o-transform: perspective(400px) rotateY(0deg); \u00a0 \u00a0 \u00a0 \u00a0 opacity: 1; \u00a0 \u00a0 } 100% { \u00a0 \u00a0 \u00a0 \u00a0 -o-transform: perspective(400px) rotateY(90deg); \u00a0 \u00a0 \u00a0 \u00a0 opacity: 0; \u00a0 \u00a0 } } @keyframes flipOutY { \u00a0 \u00a0 0% { \u00a0 \u00a0 \u00a0 \u00a0 transform: perspective(400px) rotateY(0deg); \u00a0 \u00a0 \u00a0 \u00a0 opacity: 1; \u00a0 \u00a0 } 100% { \u00a0 \u00a0 \u00a0 \u00a0 transform: perspective(400px) rotateY(90deg); \u00a0 \u00a0 \u00a0 \u00a0 opacity: 0; \u00a0 \u00a0 } } .flipOutY { -webkit-backface-visibility: visible !important; -webkit-animation-name: flipOutY; -moz-backface-visibility: visible !important; -moz-animation-name: flipOutY; -o-backface-visibility: visible !important; -o-animation-name: flipOutY; backface-visibility: visible !important; animation-name: flipOutY; } @-webkit-keyframes fadeIn { 0% {opacity: 0;} 100% {opacity: 1;} } @-moz-keyframes fadeIn { 0% {opacity: 0;} 100% {opacity: 1;} } @-o-keyframes fadeIn { 0% {opacity: 0;} 100% {opacity: 1;} } @keyframes fadeIn { 0% {opacity: 0;} 100% {opacity: 1;} } .fadeIn { -webkit-animation-name: fadeIn; -moz-animation-name: fadeIn; -o-animation-name: fadeIn; animation-name: fadeIn; } @-webkit-keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translateY(20px); } 100% { opacity: 1; -webkit-transform: translateY(0); } } @-moz-keyframes fadeInUp { 0% { opacity: 0; -moz-transform: translateY(20px); } 100% { opacity: 1; -moz-transform: translateY(0); } } @-o-keyframes fadeInUp { 0% { opacity: 0; -o-transform: translateY(20px); } 100% { opacity: 1; -o-transform: translateY(0); } } @keyframes fadeInUp { 0% { opacity: 0; transform: translateY(20px); } 100% { opacity: 1; transform: translateY(0); } } .fadeInUp { -webkit-animation-name: fadeInUp; -moz-animation-name: fadeInUp; -o-animation-name: fadeInUp; animation-name: fadeInUp; } @-webkit-keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translateY(-20px); } 100% { opacity: 1; -webkit-transform: translateY(0); } } @-moz-keyframes fadeInDown { 0% { opacity: 0; -moz-transform: translateY(-20px); } 100% { opacity: 1; -moz-transform: translateY(0); } } @-o-keyframes fadeInDown { 0% { opacity: 0; -o-transform: translateY(-20px); } 100% { opacity: 1; -o-transform: translateY(0); } } @keyframes fadeInDown { 0% { opacity: 0; transform: translateY(-20px); } 100% { opacity: 1; transform: translateY(0); } } .fadeInDown { -webkit-animation-name: fadeInDown; -moz-animation-name: fadeInDown; -o-animation-name: fadeInDown; animation-name: fadeInDown; } @-webkit-keyframes fadeInLeft { 0% { opacity: 0; -webkit-transform: translateX(-20px); } 100% { opacity: 1; -webkit-transform: translateX(0); } } @-moz-keyframes fadeInLeft { 0% { opacity: 0; -moz-transform: translateX(-20px); } 100% { opacity: 1; -moz-transform: translateX(0); } } @-o-keyframes fadeInLeft { 0% { opacity: 0; -o-transform: translateX(-20px); } 100% { opacity: 1; -o-transform: translateX(0); } } @keyframes fadeInLeft { 0% { opacity: 0; transform: translateX(-20px); } 100% { opacity: 1; transform: translateX(0); } } .fadeInLeft { -webkit-animation-name: fadeInLeft; -moz-animation-name: fadeInLeft; -o-animation-name: fadeInLeft; animation-name: fadeInLeft; } @-webkit-keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translateX(20px); } 100% { opacity: 1; -webkit-transform: translateX(0); } } @-moz-keyframes fadeInRight { 0% { opacity: 0; -moz-transform: translateX(20px); } 100% { opacity: 1; -moz-transform: translateX(0); } } @-o-keyframes fadeInRight { 0% { opacity: 0; -o-transform: translateX(20px); } 100% { opacity: 1; -o-transform: translateX(0); } } @keyframes fadeInRight { 0% { opacity: 0; transform: translateX(20px); } 100% { opacity: 1; transform: translateX(0); } } .fadeInRight { -webkit-animation-name: fadeInRight; -moz-animation-name: fadeInRight; -o-animation-name: fadeInRight; animation-name: fadeInRight; } @-webkit-keyframes fadeInUpBig { 0% { opacity: 0; -webkit-transform: translateY(2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); } } @-moz-keyframes fadeInUpBig { 0% { opacity: 0; -moz-transform: translateY(2000px); } 100% { opacity: 1; -moz-transform: translateY(0); } } @-o-keyframes fadeInUpBig { 0% { opacity: 0; -o-transform: translateY(2000px); } 100% { opacity: 1; -o-transform: translateY(0); } } @keyframes fadeInUpBig { 0% { opacity: 0; transform: translateY(2000px); } 100% { opacity: 1; transform: translateY(0); } } .fadeInUpBig { -webkit-animation-name: fadeInUpBig; -moz-animation-name: fadeInUpBig; -o-animation-name: fadeInUpBig; animation-name: fadeInUpBig; } @-webkit-keyframes fadeInDownBig { 0% { opacity: 0; -webkit-transform: translateY(-2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); } } @-moz-keyframes fadeInDownBig { 0% { opacity: 0; -moz-transform: translateY(-2000px); } 100% { opacity: 1; -moz-transform: translateY(0); } } @-o-keyframes fadeInDownBig { 0% { opacity: 0; -o-transform: translateY(-2000px); } 100% { opacity: 1; -o-transform: translateY(0); } } @keyframes fadeInDownBig { 0% { opacity: 0; transform: translateY(-2000px); } 100% { opacity: 1; transform: translateY(0); } } .fadeInDownBig { -webkit-animation-name: fadeInDownBig; -moz-animation-name: fadeInDownBig; -o-animation-name: fadeInDownBig; animation-name: fadeInDownBig; } @-webkit-keyframes fadeInLeftBig { 0% { opacity: 0; -webkit-transform: translateX(-2000px); } 100% { opacity: 1; -webkit-transform: translateX(0); } } @-moz-keyframes fadeInLeftBig { 0% { opacity: 0; -moz-transform: translateX(-2000px); } 100% { opacity: 1; -moz-transform: translateX(0); } } @-o-keyframes fadeInLeftBig { 0% { opacity: 0; -o-transform: translateX(-2000px); } 100% { opacity: 1; -o-transform: translateX(0); } } @keyframes fadeInLeftBig { 0% { opacity: 0; transform: translateX(-2000px); } 100% { opacity: 1; transform: translateX(0); } } .fadeInLeftBig { -webkit-animation-name: fadeInLeftBig; -moz-animation-name: fadeInLeftBig; -o-animation-name: fadeInLeftBig; animation-name: fadeInLeftBig; } @-webkit-keyframes fadeInRightBig { 0% { opacity: 0; -webkit-transform: translateX(2000px); } 100% { opacity: 1; -webkit-transform: translateX(0); } } @-moz-keyframes fadeInRightBig { 0% { opacity: 0; -moz-transform: translateX(2000px); } 100% { opacity: 1; -moz-transform: translateX(0); } } @-o-keyframes fadeInRightBig { 0% { opacity: 0; -o-transform: translateX(2000px); } 100% { opacity: 1; -o-transform: translateX(0); } } @keyframes fadeInRightBig { 0% { opacity: 0; transform: translateX(2000px); } 100% { opacity: 1; transform: translateX(0); } } .fadeInRightBig { -webkit-animation-name: fadeInRightBig; -moz-animation-name: fadeInRightBig; -o-animation-name: fadeInRightBig; animation-name: fadeInRightBig; } @-webkit-keyframes fadeOut { 0% {opacity: 1;} 100% {opacity: 0;} } @-moz-keyframes fadeOut { 0% {opacity: 1;} 100% {opacity: 0;} } @-o-keyframes fadeOut { 0% {opacity: 1;} 100% {opacity: 0;} } @keyframes fadeOut { 0% {opacity: 1;} 100% {opacity: 0;} } .fadeOut { -webkit-animation-name: fadeOut; -moz-animation-name: fadeOut; -o-animation-name: fadeOut; animation-name: fadeOut; } @-webkit-keyframes fadeOutUp { 0% { opacity: 1; -webkit-transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-20px); } } @-moz-keyframes fadeOutUp { 0% { opacity: 1; -moz-transform: translateY(0); } 100% { opacity: 0; -moz-transform: translateY(-20px); } } @-o-keyframes fadeOutUp { 0% { opacity: 1; -o-transform: translateY(0); } 100% { opacity: 0; -o-transform: translateY(-20px); } } @keyframes fadeOutUp { 0% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; transform: translateY(-20px); } } .fadeOutUp { -webkit-animation-name: fadeOutUp; -moz-animation-name: fadeOutUp; -o-animation-name: fadeOutUp; animation-name: fadeOutUp; } @-webkit-keyframes fadeOutDown { 0% { opacity: 1; -webkit-transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(20px); } } @-moz-keyframes fadeOutDown { 0% { opacity: 1; -moz-transform: translateY(0); } 100% { opacity: 0; -moz-transform: translateY(20px); } } @-o-keyframes fadeOutDown { 0% { opacity: 1; -o-transform: translateY(0); } 100% { opacity: 0; -o-transform: translateY(20px); } } @keyframes fadeOutDown { 0% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; transform: translateY(20px); } } .fadeOutDown { -webkit-animation-name: fadeOutDown; -moz-animation-name: fadeOutDown; -o-animation-name: fadeOutDown; animation-name: fadeOutDown; } @-webkit-keyframes fadeOutLeft { 0% { opacity: 1; -webkit-transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-20px); } } @-moz-keyframes fadeOutLeft { 0% { opacity: 1; -moz-transform: translateX(0); } 100% { opacity: 0; -moz-transform: translateX(-20px); } } @-o-keyframes fadeOutLeft { 0% { opacity: 1; -o-transform: translateX(0); } 100% { opacity: 0; -o-transform: translateX(-20px); } } @keyframes fadeOutLeft { 0% { opacity: 1; transform: translateX(0); } 100% { opacity: 0; transform: translateX(-20px); } } .fadeOutLeft { -webkit-animation-name: fadeOutLeft; -moz-animation-name: fadeOutLeft; -o-animation-name: fadeOutLeft; animation-name: fadeOutLeft; } @-webkit-keyframes fadeOutRight { 0% { opacity: 1; -webkit-transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(20px); } } @-moz-keyframes fadeOutRight { 0% { opacity: 1; -moz-transform: translateX(0); } 100% { opacity: 0; -moz-transform: translateX(20px); } } @-o-keyframes fadeOutRight { 0% { opacity: 1; -o-transform: translateX(0); } 100% { opacity: 0; -o-transform: translateX(20px); } } @keyframes fadeOutRight { 0% { opacity: 1; transform: translateX(0); } 100% { opacity: 0; transform: translateX(20px); } } .fadeOutRight { -webkit-animation-name: fadeOutRight; -moz-animation-name: fadeOutRight; -o-animation-name: fadeOutRight; animation-name: fadeOutRight; } @-webkit-keyframes fadeOutUpBig { 0% { opacity: 1; -webkit-transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); } } @-moz-keyframes fadeOutUpBig { 0% { opacity: 1; -moz-transform: translateY(0); } 100% { opacity: 0; -moz-transform: translateY(-2000px); } } @-o-keyframes fadeOutUpBig { 0% { opacity: 1; -o-transform: translateY(0); } 100% { opacity: 0; -o-transform: translateY(-2000px); } } @keyframes fadeOutUpBig { 0% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; transform: translateY(-2000px); } } .fadeOutUpBig { -webkit-animation-name: fadeOutUpBig; -moz-animation-name: fadeOutUpBig; -o-animation-name: fadeOutUpBig; animation-name: fadeOutUpBig; } @-webkit-keyframes fadeOutDownBig { 0% { opacity: 1; -webkit-transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(2000px); } } @-moz-keyframes fadeOutDownBig { 0% { opacity: 1; -moz-transform: translateY(0); } 100% { opacity: 0; -moz-transform: translateY(2000px); } } @-o-keyframes fadeOutDownBig { 0% { opacity: 1; -o-transform: translateY(0); } 100% { opacity: 0; -o-transform: translateY(2000px); } } @keyframes fadeOutDownBig { 0% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; transform: translateY(2000px); } } .fadeOutDownBig { -webkit-animation-name: fadeOutDownBig; -moz-animation-name: fadeOutDownBig; -o-animation-name: fadeOutDownBig; animation-name: fadeOutDownBig; } @-webkit-keyframes fadeOutLeftBig { 0% { opacity: 1; -webkit-transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); } } @-moz-keyframes fadeOutLeftBig { 0% { opacity: 1; -moz-transform: translateX(0); } 100% { opacity: 0; -moz-transform: translateX(-2000px); } } @-o-keyframes fadeOutLeftBig { 0% { opacity: 1; -o-transform: translateX(0); } 100% { opacity: 0; -o-transform: translateX(-2000px); } } @keyframes fadeOutLeftBig { 0% { opacity: 1; transform: translateX(0); } 100% { opacity: 0; transform: translateX(-2000px); } } .fadeOutLeftBig { -webkit-animation-name: fadeOutLeftBig; -moz-animation-name: fadeOutLeftBig; -o-animation-name: fadeOutLeftBig; animation-name: fadeOutLeftBig; } @-webkit-keyframes fadeOutRightBig { 0% { opacity: 1; -webkit-transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(2000px); } } @-moz-keyframes fadeOutRightBig { 0% { opacity: 1; -moz-transform: translateX(0); } 100% { opacity: 0; -moz-transform: translateX(2000px); } } @-o-keyframes fadeOutRightBig { 0% { opacity: 1; -o-transform: translateX(0); } 100% { opacity: 0; -o-transform: translateX(2000px); } } @keyframes fadeOutRightBig { 0% { opacity: 1; transform: translateX(0); } 100% { opacity: 0; transform: translateX(2000px); } } .fadeOutRightBig { -webkit-animation-name: fadeOutRightBig; -moz-animation-name: fadeOutRightBig; -o-animation-name: fadeOutRightBig; animation-name: fadeOutRightBig; } @-webkit-keyframes bounceIn { 0% { opacity: 0; -webkit-transform: scale(.3); } 50% { opacity: 1; -webkit-transform: scale(1.05); } 70% { -webkit-transform: scale(.9); } 100% { -webkit-transform: scale(1); } } @-moz-keyframes bounceIn { 0% { opacity: 0; -moz-transform: scale(.3); } 50% { opacity: 1; -moz-transform: scale(1.05); } 70% { -moz-transform: scale(.9); } 100% { -moz-transform: scale(1); } } @-o-keyframes bounceIn { 0% { opacity: 0; -o-transform: scale(.3); } 50% { opacity: 1; -o-transform: scale(1.05); } 70% { -o-transform: scale(.9); } 100% { -o-transform: scale(1); } } @keyframes bounceIn { 0% { opacity: 0; transform: scale(.3); } 50% { opacity: 1; transform: scale(1.05); } 70% { transform: scale(.9); } 100% { transform: scale(1); } } .bounceIn { -webkit-animation-name: bounceIn; -moz-animation-name: bounceIn; -o-animation-name: bounceIn; animation-name: bounceIn; } @-webkit-keyframes bounceInUp { 0% { opacity: 0; -webkit-transform: translateY(2000px); } 60% { opacity: 1; -webkit-transform: translateY(-30px); } 80% { -webkit-transform: translateY(10px); } 100% { -webkit-transform: translateY(0); } } @-moz-keyframes bounceInUp { 0% { opacity: 0; -moz-transform: translateY(2000px); } 60% { opacity: 1; -moz-transform: translateY(-30px); } 80% { -moz-transform: translateY(10px); } 100% { -moz-transform: translateY(0); } } @-o-keyframes bounceInUp { 0% { opacity: 0; -o-transform: translateY(2000px); } 60% { opacity: 1; -o-transform: translateY(-30px); } 80% { -o-transform: translateY(10px); } 100% { -o-transform: translateY(0); } } @keyframes bounceInUp { 0% { opacity: 0; transform: translateY(2000px); } 60% { opacity: 1; transform: translateY(-30px); } 80% { transform: translateY(10px); } 100% { transform: translateY(0); } } .bounceInUp { -webkit-animation-name: bounceInUp; -moz-animation-name: bounceInUp; -o-animation-name: bounceInUp; animation-name: bounceInUp; } @-webkit-keyframes bounceInDown { 0% { opacity: 0; -webkit-transform: translateY(-2000px); } 60% { opacity: 1; -webkit-transform: translateY(30px); } 80% { -webkit-transform: translateY(-10px); } 100% { -webkit-transform: translateY(0); } } @-moz-keyframes bounceInDown { 0% { opacity: 0; -moz-transform: translateY(-2000px); } 60% { opacity: 1; -moz-transform: translateY(30px); } 80% { -moz-transform: translateY(-10px); } 100% { -moz-transform: translateY(0); } } @-o-keyframes bounceInDown { 0% { opacity: 0; -o-transform: translateY(-2000px); } 60% { opacity: 1; -o-transform: translateY(30px); } 80% { -o-transform: translateY(-10px); } 100% { -o-transform: translateY(0); } } @keyframes bounceInDown { 0% { opacity: 0; transform: translateY(-2000px); } 60% { opacity: 1; transform: translateY(30px); } 80% { transform: translateY(-10px); } 100% { transform: translateY(0); } } .bounceInDown { -webkit-animation-name: bounceInDown; -moz-animation-name: bounceInDown; -o-animation-name: bounceInDown; animation-name: bounceInDown; } @-webkit-keyframes bounceInLeft { 0% { opacity: 0; -webkit-transform: translateX(-2000px); } 60% { opacity: 1; -webkit-transform: translateX(30px); } 80% { -webkit-transform: translateX(-10px); } 100% { -webkit-transform: translateX(0); } } @-moz-keyframes bounceInLeft { 0% { opacity: 0; -moz-transform: translateX(-2000px); } 60% { opacity: 1; -moz-transform: translateX(30px); } 80% { -moz-transform: translateX(-10px); } 100% { -moz-transform: translateX(0); } } @-o-keyframes bounceInLeft { 0% { opacity: 0; -o-transform: translateX(-2000px); } 60% { opacity: 1; -o-transform: translateX(30px); } 80% { -o-transform: translateX(-10px); } 100% { -o-transform: translateX(0); } } @keyframes bounceInLeft { 0% { opacity: 0; transform: translateX(-2000px); } 60% { opacity: 1; transform: translateX(30px); } 80% { transform: translateX(-10px); } 100% { transform: translateX(0); } } .bounceInLeft { -webkit-animation-name: bounceInLeft; -moz-animation-name: bounceInLeft; -o-animation-name: bounceInLeft; animation-name: bounceInLeft; } @-webkit-keyframes bounceInRight { 0% { opacity: 0; -webkit-transform: translateX(2000px); } 60% { opacity: 1; -webkit-transform: translateX(-30px); } 80% { -webkit-transform: translateX(10px); } 100% { -webkit-transform: translateX(0); } } @-moz-keyframes bounceInRight { 0% { opacity: 0; -moz-transform: translateX(2000px); } 60% { opacity: 1; -moz-transform: translateX(-30px); } 80% { -moz-transform: translateX(10px); } 100% { -moz-transform: translateX(0); } } @-o-keyframes bounceInRight { 0% { opacity: 0; -o-transform: translateX(2000px); } 60% { opacity: 1; -o-transform: translateX(-30px); } 80% { -o-transform: translateX(10px); } 100% { -o-transform: translateX(0); } } @keyframes bounceInRight { 0% { opacity: 0; transform: translateX(2000px); } 60% { opacity: 1; transform: translateX(-30px); } 80% { transform: translateX(10px); } 100% { transform: translateX(0); } } .bounceInRight { -webkit-animation-name: bounceInRight; -moz-animation-name: bounceInRight; -o-animation-name: bounceInRight; animation-name: bounceInRight; } @-webkit-keyframes bounceOut { 0% { -webkit-transform: scale(1); } 25% { -webkit-transform: scale(.95); } 50% { opacity: 1; -webkit-transform: scale(1.1); } 100% { opacity: 0; -webkit-transform: scale(.3); } } @-moz-keyframes bounceOut { 0% { -moz-transform: scale(1); } 25% { -moz-transform: scale(.95); } 50% { opacity: 1; -moz-transform: scale(1.1); } 100% { opacity: 0; -moz-transform: scale(.3); } } @-o-keyframes bounceOut { 0% { -o-transform: scale(1); } 25% { -o-transform: scale(.95); } 50% { opacity: 1; -o-transform: scale(1.1); } 100% { opacity: 0; -o-transform: scale(.3); } } @keyframes bounceOut { 0% { transform: scale(1); } 25% { transform: scale(.95); } 50% { opacity: 1; transform: scale(1.1); } 100% { opacity: 0; transform: scale(.3); } } .bounceOut { -webkit-animation-name: bounceOut; -moz-animation-name: bounceOut; -o-animation-name: bounceOut; animation-name: bounceOut; } @-webkit-keyframes bounceOutUp { 0% { -webkit-transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(20px); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); } } @-moz-keyframes bounceOutUp { 0% { -moz-transform: translateY(0); } 20% { opacity: 1; -moz-transform: translateY(20px); } 100% { opacity: 0; -moz-transform: translateY(-2000px); } } @-o-keyframes bounceOutUp { 0% { -o-transform: translateY(0); } 20% { opacity: 1; -o-transform: translateY(20px); } 100% { opacity: 0; -o-transform: translateY(-2000px); } } @keyframes bounceOutUp { 0% { transform: translateY(0); } 20% { opacity: 1; transform: translateY(20px); } 100% { opacity: 0; transform: translateY(-2000px); } } .bounceOutUp { -webkit-animation-name: bounceOutUp; -moz-animation-name: bounceOutUp; -o-animation-name: bounceOutUp; animation-name: bounceOutUp; } @-webkit-keyframes bounceOutDown { 0% { -webkit-transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(-20px); } 100% { opacity: 0; -webkit-transform: translateY(2000px); } } @-moz-keyframes bounceOutDown { 0% { -moz-transform: translateY(0); } 20% { opacity: 1; -moz-transform: translateY(-20px); } 100% { opacity: 0; -moz-transform: translateY(2000px); } } @-o-keyframes bounceOutDown { 0% { -o-transform: translateY(0); } 20% { opacity: 1; -o-transform: translateY(-20px); } 100% { opacity: 0; -o-transform: translateY(2000px); } } @keyframes bounceOutDown { 0% { transform: translateY(0); } 20% { opacity: 1; transform: translateY(-20px); } 100% { opacity: 0; transform: translateY(2000px); } } .bounceOutDown { -webkit-animation-name: bounceOutDown; -moz-animation-name: bounceOutDown; -o-animation-name: bounceOutDown; animation-name: bounceOutDown; } @-webkit-keyframes bounceOutLeft { 0% { -webkit-transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(20px); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); } } @-moz-keyframes bounceOutLeft { 0% { -moz-transform: translateX(0); } 20% { opacity: 1; -moz-transform: translateX(20px); } 100% { opacity: 0; -moz-transform: translateX(-2000px); } } @-o-keyframes bounceOutLeft { 0% { -o-transform: translateX(0); } 20% { opacity: 1; -o-transform: translateX(20px); } 100% { opacity: 0; -o-transform: translateX(-2000px); } } @keyframes bounceOutLeft { 0% { transform: translateX(0); } 20% { opacity: 1; transform: translateX(20px); } 100% { opacity: 0; transform: translateX(-2000px); } } .bounceOutLeft { -webkit-animation-name: bounceOutLeft; -moz-animation-name: bounceOutLeft; -o-animation-name: bounceOutLeft; animation-name: bounceOutLeft; } @-webkit-keyframes bounceOutRight { 0% { -webkit-transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(-20px); } 100% { opacity: 0; -webkit-transform: translateX(2000px); } } @-moz-keyframes bounceOutRight { 0% { -moz-transform: translateX(0); } 20% { opacity: 1; -moz-transform: translateX(-20px); } 100% { opacity: 0; -moz-transform: translateX(2000px); } } @-o-keyframes bounceOutRight { 0% { -o-transform: translateX(0); } 20% { opacity: 1; -o-transform: translateX(-20px); } 100% { opacity: 0; -o-transform: translateX(2000px); } } @keyframes bounceOutRight { 0% { transform: translateX(0); } 20% { opacity: 1; transform: translateX(-20px); } 100% { opacity: 0; transform: translateX(2000px); } } .bounceOutRight { -webkit-animation-name: bounceOutRight; -moz-animation-name: bounceOutRight; -o-animation-name: bounceOutRight; animation-name: bounceOutRight; } @-webkit-keyframes rotateIn { 0% { -webkit-transform-origin: center center; -webkit-transform: rotate(-200deg); opacity: 0; } 100% { -webkit-transform-origin: center center; -webkit-transform: rotate(0); opacity: 1; } } @-moz-keyframes rotateIn { 0% { -moz-transform-origin: center center; -moz-transform: rotate(-200deg); opacity: 0; } 100% { -moz-transform-origin: center center; -moz-transform: rotate(0); opacity: 1; } } @-o-keyframes rotateIn { 0% { -o-transform-origin: center center; -o-transform: rotate(-200deg); opacity: 0; } 100% { -o-transform-origin: center center; -o-transform: rotate(0); opacity: 1; } } @keyframes rotateIn { 0% { transform-origin: center center; transform: rotate(-200deg); opacity: 0; } 100% { transform-origin: center center; transform: rotate(0); opacity: 1; } } .rotateIn { -webkit-animation-name: rotateIn; -moz-animation-name: rotateIn; -o-animation-name: rotateIn; animation-name: rotateIn; } @-webkit-keyframes rotateInUpLeft { 0% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(90deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(0); opacity: 1; } } @-moz-keyframes rotateInUpLeft { 0% { -moz-transform-origin: left bottom; -moz-transform: rotate(90deg); opacity: 0; } 100% { -moz-transform-origin: left bottom; -moz-transform: rotate(0); opacity: 1; } } @-o-keyframes rotateInUpLeft { 0% { -o-transform-origin: left bottom; -o-transform: rotate(90deg); opacity: 0; } 100% { -o-transform-origin: left bottom; -o-transform: rotate(0); opacity: 1; } } @keyframes rotateInUpLeft { 0% { transform-origin: left bottom; transform: rotate(90deg); opacity: 0; } 100% { transform-origin: left bottom; transform: rotate(0); opacity: 1; } } .rotateInUpLeft { -webkit-animation-name: rotateInUpLeft; -moz-animation-name: rotateInUpLeft; -o-animation-name: rotateInUpLeft; animation-name: rotateInUpLeft; } @-webkit-keyframes rotateInDownLeft { 0% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(-90deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(0); opacity: 1; } } @-moz-keyframes rotateInDownLeft { 0% { -moz-transform-origin: left bottom; -moz-transform: rotate(-90deg); opacity: 0; } 100% { -moz-transform-origin: left bottom; -moz-transform: rotate(0); opacity: 1; } } @-o-keyframes rotateInDownLeft { 0% { -o-transform-origin: left bottom; -o-transform: rotate(-90deg); opacity: 0; } 100% { -o-transform-origin: left bottom; -o-transform: rotate(0); opacity: 1; } } @keyframes rotateInDownLeft { 0% { transform-origin: left bottom; transform: rotate(-90deg); opacity: 0; } 100% { transform-origin: left bottom; transform: rotate(0); opacity: 1; } } .rotateInDownLeft { -webkit-animation-name: rotateInDownLeft; -moz-animation-name: rotateInDownLeft; -o-animation-name: rotateInDownLeft; animation-name: rotateInDownLeft; } @-webkit-keyframes rotateInUpRight { 0% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(-90deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(0); opacity: 1; } } @-moz-keyframes rotateInUpRight { 0% { -moz-transform-origin: right bottom; -moz-transform: rotate(-90deg); opacity: 0; } 100% { -moz-transform-origin: right bottom; -moz-transform: rotate(0); opacity: 1; } } @-o-keyframes rotateInUpRight { 0% { -o-transform-origin: right bottom; -o-transform: rotate(-90deg); opacity: 0; } 100% { -o-transform-origin: right bottom; -o-transform: rotate(0); opacity: 1; } } @keyframes rotateInUpRight { 0% { transform-origin: right bottom; transform: rotate(-90deg); opacity: 0; } 100% { transform-origin: right bottom; transform: rotate(0); opacity: 1; } } .rotateInUpRight { -webkit-animation-name: rotateInUpRight; -moz-animation-name: rotateInUpRight; -o-animation-name: rotateInUpRight; animation-name: rotateInUpRight; } @-webkit-keyframes rotateInDownRight { 0% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(90deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(0); opacity: 1; } } @-moz-keyframes rotateInDownRight { 0% { -moz-transform-origin: right bottom; -moz-transform: rotate(90deg); opacity: 0; } 100% { -moz-transform-origin: right bottom; -moz-transform: rotate(0); opacity: 1; } } @-o-keyframes rotateInDownRight { 0% { -o-transform-origin: right bottom; -o-transform: rotate(90deg); opacity: 0; } 100% { -o-transform-origin: right bottom; -o-transform: rotate(0); opacity: 1; } } @keyframes rotateInDownRight { 0% { transform-origin: right bottom; transform: rotate(90deg); opacity: 0; } 100% { transform-origin: right bottom; transform: rotate(0); opacity: 1; } } .rotateInDownRight { -webkit-animation-name: rotateInDownRight; -moz-animation-name: rotateInDownRight; -o-animation-name: rotateInDownRight; animation-name: rotateInDownRight; } @-webkit-keyframes rotateOut { 0% { -webkit-transform-origin: center center; -webkit-transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: center center; -webkit-transform: rotate(200deg); opacity: 0; } } @-moz-keyframes rotateOut { 0% { -moz-transform-origin: center center; -moz-transform: rotate(0); opacity: 1; } 100% { -moz-transform-origin: center center; -moz-transform: rotate(200deg); opacity: 0; } } @-o-keyframes rotateOut { 0% { -o-transform-origin: center center; -o-transform: rotate(0); opacity: 1; } 100% { -o-transform-origin: center center; -o-transform: rotate(200deg); opacity: 0; } } @keyframes rotateOut { 0% { transform-origin: center center; transform: rotate(0); opacity: 1; } 100% { transform-origin: center center; transform: rotate(200deg); opacity: 0; } } .rotateOut { -webkit-animation-name: rotateOut; -moz-animation-name: rotateOut; -o-animation-name: rotateOut; animation-name: rotateOut; } @-webkit-keyframes rotateOutUpLeft { 0% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(-90deg); opacity: 0; } } @-moz-keyframes rotateOutUpLeft { 0% { -moz-transform-origin: left bottom; -moz-transform: rotate(0); opacity: 1; } 100% { -moz-transform-origin: left bottom; -moz-transform: rotate(-90deg); opacity: 0; } } @-o-keyframes rotateOutUpLeft { 0% { -o-transform-origin: left bottom; -o-transform: rotate(0); opacity: 1; } 100% { -o-transform-origin: left bottom; -o-transform: rotate(-90deg); opacity: 0; } } @keyframes rotateOutUpLeft { 0% { transform-origin: left bottom; transform: rotate(0); opacity: 1; } 100% { transform-origin: left bottom; transform: rotate(-90deg); opacity: 0; } } .rotateOutUpLeft { -webkit-animation-name: rotateOutUpLeft; -moz-animation-name: rotateOutUpLeft; -o-animation-name: rotateOutUpLeft; animation-name: rotateOutUpLeft; } @-webkit-keyframes rotateOutDownLeft { 0% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(90deg); opacity: 0; } } @-moz-keyframes rotateOutDownLeft { 0% { -moz-transform-origin: left bottom; -moz-transform: rotate(0); opacity: 1; } 100% { -moz-transform-origin: left bottom; -moz-transform: rotate(90deg); opacity: 0; } } @-o-keyframes rotateOutDownLeft { 0% { -o-transform-origin: left bottom; -o-transform: rotate(0); opacity: 1; } 100% { -o-transform-origin: left bottom; -o-transform: rotate(90deg); opacity: 0; } } @keyframes rotateOutDownLeft { 0% { transform-origin: left bottom; transform: rotate(0); opacity: 1; } 100% { transform-origin: left bottom; transform: rotate(90deg); opacity: 0; } } .rotateOutDownLeft { -webkit-animation-name: rotateOutDownLeft; -moz-animation-name: rotateOutDownLeft; -o-animation-name: rotateOutDownLeft; animation-name: rotateOutDownLeft; } @-webkit-keyframes rotateOutUpRight { 0% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(90deg); opacity: 0; } } @-moz-keyframes rotateOutUpRight { 0% { -moz-transform-origin: right bottom; -moz-transform: rotate(0); opacity: 1; } 100% { -moz-transform-origin: right bottom; -moz-transform: rotate(90deg); opacity: 0; } } @-o-keyframes rotateOutUpRight { 0% { -o-transform-origin: right bottom; -o-transform: rotate(0); opacity: 1; } 100% { -o-transform-origin: right bottom; -o-transform: rotate(90deg); opacity: 0; } } @keyframes rotateOutUpRight { 0% { transform-origin: right bottom; transform: rotate(0); opacity: 1; } 100% { transform-origin: right bottom; transform: rotate(90deg); opacity: 0; } } .rotateOutUpRight { -webkit-animation-name: rotateOutUpRight; -moz-animation-name: rotateOutUpRight; -o-animation-name: rotateOutUpRight; animation-name: rotateOutUpRight; } @-webkit-keyframes rotateOutDownRight { 0% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(-90deg); opacity: 0; } } @-moz-keyframes rotateOutDownRight { 0% { -moz-transform-origin: right bottom; -moz-transform: rotate(0); opacity: 1; } 100% { -moz-transform-origin: right bottom; -moz-transform: rotate(-90deg); opacity: 0; } } @-o-keyframes rotateOutDownRight { 0% { -o-transform-origin: right bottom; -o-transform: rotate(0); opacity: 1; } 100% { -o-transform-origin: right bottom; -o-transform: rotate(-90deg); opacity: 0; } } @keyframes rotateOutDownRight { 0% { transform-origin: right bottom; transform: rotate(0); opacity: 1; } 100% { transform-origin: right bottom; transform: rotate(-90deg); opacity: 0; } } .rotateOutDownRight { -webkit-animation-name: rotateOutDownRight; -moz-animation-name: rotateOutDownRight; -o-animation-name: rotateOutDownRight; animation-name: rotateOutDownRight; } @-webkit-keyframes hinge { 0% { -webkit-transform: rotate(0); -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; } 20%, 60% { -webkit-transform: rotate(80deg); -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; } 40% { -webkit-transform: rotate(60deg); -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; } 80% { -webkit-transform: rotate(60deg) translateY(0); opacity: 1; -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; } 100% { -webkit-transform: translateY(700px); opacity: 0; } } @-moz-keyframes hinge { 0% { -moz-transform: rotate(0); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; } 20%, 60% { -moz-transform: rotate(80deg); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; } 40% { -moz-transform: rotate(60deg); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; } 80% { -moz-transform: rotate(60deg) translateY(0); opacity: 1; -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; } 100% { -moz-transform: translateY(700px); opacity: 0; } } @-o-keyframes hinge { 0% { -o-transform: rotate(0); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; } 20%, 60% { -o-transform: rotate(80deg); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; } 40% { -o-transform: rotate(60deg); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; } 80% { -o-transform: rotate(60deg) translateY(0); opacity: 1; -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; } 100% { -o-transform: translateY(700px); opacity: 0; } } @keyframes hinge { 0% { transform: rotate(0); transform-origin: top left; animation-timing-function: ease-in-out; } 20%, 60% { transform: rotate(80deg); transform-origin: top left; animation-timing-function: ease-in-out; } 40% { transform: rotate(60deg); transform-origin: top left; animation-timing-function: ease-in-out; } 80% { transform: rotate(60deg) translateY(0); opacity: 1; transform-origin: top left; animation-timing-function: ease-in-out; } 100% { transform: translateY(700px); opacity: 0; } } .hinge { -webkit-animation-name: hinge; -moz-animation-name: hinge; -o-animation-name: hinge; animation-name: hinge; } \/* originally authored by Nick Pettit - https:\/\/github.com\/nickpettit\/glide *\/ @-webkit-keyframes rollIn { 0% { opacity: 0; -webkit-transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); } } @-moz-keyframes rollIn { 0% { opacity: 0; -moz-transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -moz-transform: translateX(0px) rotate(0deg); } } @-o-keyframes rollIn { 0% { opacity: 0; -o-transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -o-transform: translateX(0px) rotate(0deg); } } @keyframes rollIn { 0% { opacity: 0; transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; transform: translateX(0px) rotate(0deg); } } .rollIn { -webkit-animation-name: rollIn; -moz-animation-name: rollIn; -o-animation-name: rollIn; animation-name: rollIn; } \/* originally authored by Nick Pettit - https:\/\/github.com\/nickpettit\/glide *\/ @-webkit-keyframes rollOut { \u00a0 \u00a0 0% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); } \u00a0 \u00a0 100% { opacity: 0; -webkit-transform: translateX(100%) rotate(120deg); } } @-moz-keyframes rollOut { \u00a0 \u00a0 0% { opacity: 1; -moz-transform: translateX(0px) rotate(0deg); } \u00a0 \u00a0 100% { opacity: 0; -moz-transform: translateX(100%) rotate(120deg); } } @-o-keyframes rollOut { \u00a0 \u00a0 0% { opacity: 1; -o-transform: translateX(0px) rotate(0deg); } \u00a0 \u00a0 100% { opacity: 0; -o-transform: translateX(100%) rotate(120deg); } } @keyframes rollOut { \u00a0 \u00a0 0% { opacity: 1; transform: translateX(0px) rotate(0deg); } \u00a0 \u00a0 100% { opacity: 0; transform: translateX(100%) rotate(120deg); } } .rollOut { -webkit-animation-name: rollOut; -moz-animation-name: rollOut; -o-animation-name: rollOut; animation-name: rollOut; } \/* originally authored by Angelo Rohit - https:\/\/github.com\/angelorohit *\/ @-webkit-keyframes lightSpeedIn { 0% { -webkit-transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% { -webkit-transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% { -webkit-transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% { -webkit-transform: translateX(0%) skewX(0deg); opacity: 1; } } @-moz-keyframes lightSpeedIn { 0% { -moz-transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% { -moz-transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% { -moz-transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% { -moz-transform: translateX(0%) skewX(0deg); opacity: 1; } } @-o-keyframes lightSpeedIn { 0% { -o-transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% { -o-transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% { -o-transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% { -o-transform: translateX(0%) skewX(0deg); opacity: 1; } } @keyframes lightSpeedIn { 0% { transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% { transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% { transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% { transform: translateX(0%) skewX(0deg); opacity: 1; } } .lightSpeedIn { \u00a0 \u00a0 -webkit-animation-name: lightSpeedIn; \u00a0 \u00a0 -moz-animation-name: lightSpeedIn; \u00a0 \u00a0 -o-animation-name: lightSpeedIn; \u00a0 \u00a0 animation-name: lightSpeedIn; \u00a0 \u00a0 -webkit-animation-timing-function: ease-out; \u00a0 \u00a0 -moz-animation-timing-function: ease-out; \u00a0 \u00a0 -o-animation-timing-function: ease-out; \u00a0 \u00a0 animation-timing-function: ease-out; } .animated.lightSpeedIn { \u00a0 \u00a0 -webkit-animation-duration: 0.5s; \u00a0 \u00a0 -moz-animation-duration: 0.5s; \u00a0 \u00a0 -o-animation-duration: 0.5s; \u00a0 \u00a0 animation-duration: 0.5s; } \/* originally authored by Angelo Rohit - https:\/\/github.com\/angelorohit *\/ @-webkit-keyframes lightSpeedOut { \u00a0 \u00a0 0% { -webkit-transform: translateX(0%) skewX(0deg); opacity: 1; } 100% { -webkit-transform: translateX(100%) skewX(-30deg); opacity: 0; } } @-moz-keyframes lightSpeedOut { 0% { -moz-transform: translateX(0%) skewX(0deg); opacity: 1; } 100% { -moz-transform: translateX(100%) skewX(-30deg); opacity: 0; } } @-o-keyframes lightSpeedOut { 0% { -o-transform: translateX(0%) skewX(0deg); opacity: 1; } 100% { -o-transform: translateX(100%) skewX(-30deg); opacity: 0; } } @keyframes lightSpeedOut { 0% { transform: translateX(0%) skewX(0deg); opacity: 1; } 100% { transform: translateX(100%) skewX(-30deg); opacity: 0; } } .lightSpeedOut { \u00a0 \u00a0 -webkit-animation-name: lightSpeedOut; \u00a0 \u00a0 -moz-animation-name: lightSpeedOut; \u00a0 \u00a0 -o-animation-name: lightSpeedOut; \u00a0 \u00a0 animation-name: lightSpeedOut; \u00a0 \u00a0 -webkit-animation-timing-function: ease-in; \u00a0 \u00a0 -moz-animation-timing-function: ease-in; \u00a0 \u00a0 -o-animation-timing-function: ease-in; \u00a0 \u00a0 animation-timing-function: ease-in; } .animated.lightSpeedOut { \u00a0 \u00a0 -webkit-animation-duration: 0.25s; \u00a0 \u00a0 -moz-animation-duration: 0.25s; \u00a0 \u00a0 -o-animation-duration: 0.25s; \u00a0 \u00a0 animation-duration: 0.25s; } \/* originally authored by Angelo Rohit - https:\/\/github.com\/angelorohit *\/ @-webkit-keyframes wiggle { \u00a0 \u00a0 0% { -webkit-transform: skewX(9deg); } \u00a0 \u00a0 10% { -webkit-transform: skewX(-8deg); } \u00a0 \u00a0 20% { -webkit-transform: skewX(7deg); } \u00a0 \u00a0 30% { -webkit-transform: skewX(-6deg); } \u00a0 \u00a0 40% { -webkit-transform: skewX(5deg); } \u00a0 \u00a0 50% { -webkit-transform: skewX(-4deg); } \u00a0 \u00a0 60% { -webkit-transform: skewX(3deg); } \u00a0 \u00a0 70% { -webkit-transform: skewX(-2deg); } \u00a0 \u00a0 80% { -webkit-transform: skewX(1deg); } \u00a0 \u00a0 90% { -webkit-transform: skewX(0deg); } 100% { -webkit-transform: skewX(0deg); } } @-moz-keyframes wiggle { \u00a0 \u00a0 0% { -moz-transform: skewX(9deg); } \u00a0 \u00a0 10% { -moz-transform: skewX(-8deg); } \u00a0 \u00a0 20% { -moz-transform: skewX(7deg); } \u00a0 \u00a0 30% { -moz-transform: skewX(-6deg); } \u00a0 \u00a0 40% { -moz-transform: skewX(5deg); } \u00a0 \u00a0 50% { -moz-transform: skewX(-4deg); } \u00a0 \u00a0 60% { -moz-transform: skewX(3deg); } \u00a0 \u00a0 70% { -moz-transform: skewX(-2deg); } \u00a0 \u00a0 80% { -moz-transform: skewX(1deg); } \u00a0 \u00a0 90% { -moz-transform: skewX(0deg); } 100% { -moz-transform: skewX(0deg); } } @-o-keyframes wiggle { \u00a0 \u00a0 0% { -o-transform: skewX(9deg); } \u00a0 \u00a0 10% { -o-transform: skewX(-8deg); } \u00a0 \u00a0 20% { -o-transform: skewX(7deg); } \u00a0 \u00a0 30% { -o-transform: skewX(-6deg); } \u00a0 \u00a0 40% { -o-transform: skewX(5deg); } \u00a0 \u00a0 50% { -o-transform: skewX(-4deg); } \u00a0 \u00a0 60% { -o-transform: skewX(3deg); } \u00a0 \u00a0 70% { -o-transform: skewX(-2deg); } \u00a0 \u00a0 80% { -o-transform: skewX(1deg); } \u00a0 \u00a0 90% { -o-transform: skewX(0deg); } 100% { -o-transform: skewX(0deg); } } @keyframes wiggle { \u00a0 \u00a0 0% { transform: skewX(9deg); } \u00a0 \u00a0 10% { transform: skewX(-8deg); } \u00a0 \u00a0 20% { transform: skewX(7deg); } \u00a0 \u00a0 30% { transform: skewX(-6deg); } \u00a0 \u00a0 40% { transform: skewX(5deg); } \u00a0 \u00a0 50% { transform: skewX(-4deg); } \u00a0 \u00a0 60% { transform: skewX(3deg); } \u00a0 \u00a0 70% { transform: skewX(-2deg); } \u00a0 \u00a0 80% { transform: skewX(1deg); } \u00a0 \u00a0 90% { transform: skewX(0deg); } 100% { transform: skewX(0deg); } } .wiggle { \u00a0 \u00a0 -webkit-animation-name: wiggle; \u00a0 \u00a0 -moz-animation-name: wiggle; \u00a0 \u00a0 -o-animation-name: wiggle; \u00a0 \u00a0 animation-name: wiggle; \u00a0 \u00a0 -webkit-animation-timing-function: ease-in; \u00a0 \u00a0 -moz-animation-timing-function: ease-in; \u00a0 \u00a0 -o-animation-timing-function: ease-in; \u00a0 \u00a0 animation-timing-function: ease-in; } .animated.wiggle { \u00a0 \u00a0 -webkit-animation-duration: 0.75s; \u00a0 \u00a0 -moz-animation-duration: 0.75s; \u00a0 \u00a0 -o-animation-duration: 0.75s; \u00a0 \u00a0 animation-duration: 0.75s; }&lt;\/style&gt; &lt;!--banner--&gt; &lt;script src=\"\/js\/jquery.bxslider-rahisified.js\"&gt;&lt;\/script&gt; &lt;script src=\"\/js\/jquery.easing.1.3.js\"&gt;&lt;\/script&gt; &lt;!--[if lt IE 9]&gt; &lt;script src=\"\/js\/html5shiv.js\"&gt;&lt;\/script&gt; &lt;![endif]--&gt; &lt;\/head&gt; &lt;body marginwidth=\"0\" marginheight=\"0\" class=\"show\"&gt; &lt;article id=\"cont\" class=\"\" style=\"text-align:center; margin:0 auto; padding:30px 0; width: 1100px; ;\"&gt; &lt;!-- \uceec\ub7ec\ucc60\ud2b8 \uc0bd\uc785 { --&gt; &lt;style media=\"\" data-href=\"\/colorbox\/css\/colorbox_iframe.css\"&gt;\/*# sourceURL=\/colorbox\/css\/colorbox_iframe.css *\/ \/*@ sourceURL=\/colorbox\/css\/colorbox_iframe.css *\/ @import url(\"https:\/\/cdn.rawgit.com\/theeluwin\/NotoSansKR-Hestia\/master\/stylesheets\/NotoSansKR-Hestia.css\"); body {margin:0;padding:0;} #behr_colorbox {width:850px; font-family: \"Noto Sans Korean\", \"NotoSans\", sans-serif,\"dotum\"; overflow: hidden;position: relative; font-size: 12px;\u00a0 line-height: 1.2; text-align: left; z-index: 9999;} #behr_colorbox * {margin:0; padding: 0; vertical-align: top;} #behr_colorbox a {outline: none; text-decoration: none; cursor: pointer;} #behr_colorbox img {border:0;} #behr_colorbox ul {list-style: none;} #behr_colorbox .behr_monitor {width: 570px; border:2px solid #e6e6e5; min-height: 846px; margin-top: 52px; float: left; margin-left: 15px;} #behr_colorbox .behr_monitor .behr_color_menu {padding:33px 2px 25px;} #behr_colorbox .behr_monitor .behr_color_menu ul {font-size: 0} #behr_colorbox .behr_monitor .behr_color_menu ul li {display: inline-block; width: 11%; font-size: 12px;height: 49px; position: relative; vertical-align: top;} #behr_colorbox .behr_monitor .behr_color_menu ul li a {display: block; text-align: center; position: absolute; top:0; left:0; width: 100%; bottom:0; } #behr_colorbox .behr_inner {width: 540px} #behr_colorbox .behr_nav {position: absolute; top:0; left: 15px; height: 52px;} #behr_colorbox .behr_nav ul {overflow: hidden; position: absolute; bottom:0; left: 0; width: 582px;} #behr_colorbox .behr_nav ul li {float: left; height: 52px; position: relative;width: 108px;} #behr_colorbox .behr_nav ul li a {display: block; width: 108px; background: #e6e6e5; text-align: center; position: relative; bottom: 0; position: absolute; left:0; border-radius: 6px 6px 0 0; color:#535353; height: 42px;line-height: 42px; font-size:12px;} #behr_colorbox .behr_nav ul li:nth-child(odd) a {background:#f2f2f2;} #behr_colorbox .behr_nav ul li a.active {background: #535353; color:#fff; height: 52px; line-height: 58px; font-size: 14px} #behr_colorbox .behr_selectColor {width: 240px; float: right; margin-right: 15px;} #behr_colorbox .behr_selectColor h3 {height: 52px; background: #535353; color:#fff; font-size: 18px; text-align: center; line-height: 58px; font-weight: 400; border-radius: 5px 5px 0 0} #behr_colorbox .behr_palette {background: #e6e6e5; min-height: 850px;}\u00a0 #behr_colorbox .behr_palette_guide { font-size: 11px; color: #535353; line-height: 20px; font-weight: 300; padding:12px 11px; border-bottom:1px solid #fff;}\u00a0 #behr_colorbox .behr_colorChart {overflow:hidden; overflow-y:scroll; height: 600px;\u00a0 position: relative;} #behr_colorbox .behr_colorChart.bhallcolors {margin-top: 65px;} #behr_colorbox .loading {position: absolute; top:160px; left:0; width: 580px; bottom:0; z-index: 998; background: rgba(256,256,256,0.8); text-align: center;} #behr_colorbox .loading img {padding-top:45%; } #behr_colorbox .cc_submenu a {cursor: pointer;} #behr_colorbox .behr_colorChart .cc-box {width: 60px; height: 40px; border-radius: 5px; overflow: hidden; display: inline-block; margin:4px; cursor: pointer;transition: transform 0.2s ease} #behr_colorbox .behr_colorChart .cc-box-none {width: 60px; height: 40px; overflow: hidden; display: inline-block; margin:4px;vertical-align: top;} #behr_colorbox .behr_colorChart .cc-box-img {width: 540px;\u00a0 display: inline-block;margin:4px; margin-top: 20px; vertical-align: top;} #behr_colorbox .behr_colorChart .cc-box-img img {width: 100% !important;} #behr_colorbox .behr_colorChart .cc-box-imgbox {margin-bottom: 4px; height: 274px;} #behr_colorbox .behr_colorChart .cc-box-img .cc-box:nth-of-type(2) {margin-left: 0;} #behr_colorbox .behr_colorChart .cc-box-img .cc-box:nth-of-type(5) {margin-right: 0;} #behr_colorbox .behr_colorChart .cc-box .cc-name {display: none;} #behr_colorbox .behr_colorChart .cc-box:hover {transform: scale(1.1); } #behr_colorbox .behr_colorChart .cc-box.active {background-image: url(\"https:\/\/behr.kr\/colorbox\/css\/..\/icon\/chk.png\") !important; background-position:\u00a0 50% 50% !important; background-repeat: no-repeat !important;} #behr_colorbox .behr_colorChart .cc-box.activeb {background-image: url(\"https:\/\/behr.kr\/colorbox\/css\/..\/icon\/chk_b.png\") !important; background-position:\u00a0 50% 50% !important; background-repeat: no-repeat !important;} #behr_colorbox #behr_palette_save .cc-box { position: relative; padding:12px 0; margin:0 12px; border-bottom:1px solid #fff; overflow: hidden; min-height: 57px; box-sizing: border-box; cursor: pointer;} #behr_colorbox #behr_palette_save .cc-box .cc-view {display: block; width: 40px; height: 40px;border-radius: 5px; position: absolute; top:12px; left:0; z-index: 3;} #behr_colorbox #behr_palette_save .cc-box .cc-name {font-size:12px; padding-left: 52px;padding-top: 1px; color: #535353; padding-right: 40px} #behr_colorbox #behr_palette_save .cc-box .cc-name span {display: block; font-size:15px; padding-top: 0px; font-weight: bold;} #behr_colorbox #behr_palette_save .cc-box .palette_del {position: absolute; top:24px; right:15px; cursor: pointer; width: 20px; height: 20px; background: url(\"https:\/\/behr.kr\/colorbox\/css\/..\/icon\/close.png\") no-repeat 0 0; overflow: hidden; text-align: left; text-indent: -9999px;} #behr_colorbox #behr_palette_save .cc-box .palette_del:hover {background-position: 0 -20px;} #behr_colorbox .wh-ov {background: #fff; opacity: 0.7; position: fixed; top:0; left:0; bottom:0; right: 0; width: 100%; height: 100%; z-index: 9998; display: none} #detailCanvas {background: url(\"https:\/\/behr.kr\/colorbox\/css\/..\/icon\/detail_iframe.png\") no-repeat 0 0; width: 1050px; height: 850px; z-index: 9999; position: absolute; top:28px; left: 25px; display: none} #detailCanvas a.detailCanvas_close {position: absolute; top:3px; left: 771px; width: 26px; height: 26px; display: block; overflow: hidden; text-indent: -999px; text-align: left; cursor: pointer;} #detailCanvas #detailCanvas_list {position: absolute; top:30px; left: 232px; overflow: hidden; height: 60px; width: 540px; padding-top: 5px; padding-left: 5px;} #detailCanvas #detailCanvas_list .cc-box {float: left; margin-right: 5px;width: 43px; height: 43px; display: block; position: relative; cursor: pointer;border-radius: 5px; margin-bottom: 5px} #detailCanvas #detailCanvas_list .cc-box .cc-view {position: relative;width: 43px; height: 43px; border-radius: 5px; display: block; top:0; left:0;position: absolute;} #detailCanvas #detailCanvas_list .cc-box.active .cc-view\u00a0 {border:4px solid\u00a0 #3f3e3e;\u00a0 top:-4px; left:-4px; z-index: 3;} #detailCanvas #detailCanvas_list .cc-box:hover .cc-view {transform: scale(1.1);} #detailCanvas #detailCanvas_list .cc-box.active:hover .cc-view {transform: scale(1);} #detailCanvas #detailCanvas_list .cc-box .cc-name, #detailCanvas #detailCanvas_list .cc-box .palette_del {display:none;} #detailCanvas #detailCanvas_view {width: 540px; height: 200px; display: block; position: absolute; top:100px; left: 237px;} #detailCanvas #detailCanvas_view .cc-box .cc-view {position: absolute; top:0; left: 0; right: 0; bottom: 0; z-index: -1;} #detailCanvas #detailCanvas_view .cc-box .cc-name {padding:30px 35px 18px; font-size:30px; color:#fff; font-weight: bold;} #detailCanvas #detailCanvas_view .cc-box .cc-name span {display: block;font-weight: normal; font-size: 22px; color:#fff;} #detailCanvas #detailCanvas_view .cc-box[data-tcol=B] .cc-name,\u00a0 #detailCanvas #detailCanvas_view .cc-box[data-tcol=B] .cc-name span {color:#333;} #detailCanvas #detailCanvas_view .cc-box .palette_del {display: none;} #detailCanvas #detailCanvas_view .cc-box .detailColorvs_buyBtn {display: none; bottom:10px; left:233px;} #detailCanvas #detailCanvas_view:hover .cc-box .detailColorvs_buyBtn {display: block;} #detailCanvas .detailCanvas_btn {display: block;width: 174px; height: 53px; position: absolute; top:319px; cursor: pointer; text-indent: -999px; text-align: left; overflow: hidden; } #detailCanvas .detailCanvas_btn01 {left: 237px;} #detailCanvas .detailCanvas_btn02 {left: 419px;} #detailCanvas .detailCanvas_btn03 {left: 602px;} #detailCanvas .detailCanvas_btn:hover {background: url(\"https:\/\/behr.kr\/colorbox\/css\/..\/icon\/btn_hover_iframe.gif\") no-repeat 0 0;} #detailCanvas .detailCanvas_view {display: block; width: 175px; position: absolute; top:388px; height: 237px;} #detailCanvas .detailCanvas_view01 {left: 237px;} #detailCanvas .detailCanvas_view02 {left: 419px;} #detailCanvas .detailCanvas_view03 {left: 602px;} #detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .cc-view {position: absolute; top:0; left: 0; right: 0; bottom: 0; z-index: -1;} #detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .cc-name {padding:25px 40px 18px 5px; font-size:16px; color:#fff; font-weight: bold;} #detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .cc-name span {display: block;font-weight: normal; font-size: 15px; color:#fff;} #detailCanvas #detailCanvas_color .detailCanvas_view .cc-box[data-tcol=B] .cc-name,\u00a0 #detailCanvas #detailCanvas_color .detailCanvas_view .cc-box[data-tcol=B] .cc-name span {color:#333;} #detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .palette_del {display: none; } #detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .detailColorvs_buyBtn {display: none; top:140px;left:50px;} #detailCanvas #detailCanvas_color .detailCanvas_view01:hover .cc-box .detailColorvs_buyBtn {display: block;} #detailCanvas #detailCanvas_color .detailCanvas_view02:hover .cc-box .detailColorvs_buyBtn {display: block;} #detailCanvas #detailCanvas_color .detailCanvas_view03:hover .cc-box .detailColorvs_buyBtn {display: block;} #detailCanvas .detailColorvs_buyBtn {cursor: pointer; width: 74px; height: 74px; background: url(\"https:\/\/behr.kr\/colorbox\/css\/..\/icon\/cart.png\") no-repeat 0 0; text-align: left; text-indent: -9999px; overflow: hidden; position: absolute; } \/*\uac80\uc0c9\uacb0\uacfc*\/ #behr_colorbox #cc_search_area {display: none; position: absolute; height: 104px; top:54px; left: 17px; width: 540px; background: #fff;} #behr_colorbox #cc_search_area .cc_search {display: block; background: url(\"https:\/\/behr.kr\/colorbox\/css\/..\/icon\/ccsearch_iframe.jpg\") no-repeat 0 0; width: 500px; height: 50px; position: absolute; top:33px; left:44px;} #behr_colorbox #cc_search_area .cc_search label {display: inline-block; width: 100px; line-height: 50px; font-size: 18px; color:#535353; text-align: center; } #behr_colorbox #cc_search_area .cc_search input {display: inline-block;width:308px; height: 48px; line-height: 48px; border:0; background: #fff; font-size: 14px; color:#535353; padding: 0 20px; box-sizing: border-box; margin-top: 1px;} #behr_colorbox #cckeywordauto {position: absolute; top:92px; width: 550px; text-align: center;} #behr_colorbox #cckeywordauto ul {text-align: center; font-size: 0;} #behr_colorbox #cckeywordauto ul li {display: inline-block; background: #e6e6e5; border-radius: 5px; padding:5px 8px; font-size:14px; color:#535353; margin:0 2px;} #behr_colorbox #cckeywordauto ul li:nth-child(odd) {background: #f2f2f2;} #behr_colorbox #cckeywordauto ul li a {cursor: pointer; font-weight: 100} #ccsearchOutput {background: #535353; color:#fff; padding:0 14px; line-height: 41px; height: 41px; box-sizing: border-box; position: absolute; top:143px; left:20px; right: 20px;} #ccsearchOutput span {vertical-align: bottom; font-size:22px; margin-right: 8px; display: inline-block;} #behr_colorbox.namelist .behr_colorChart .cc-box {width: 80px; height: 60px; display: inline-block; overflow: visible; position: relative; margin:10px 175px 10px 20px; position: relative; transition: none;} #behr_colorbox.namelist .behr_colorChart .cc-box:before {content: ''; display: block; position: absolute; background:#ddd; width: 230px; height: 1px; bottom:-10px; left:0;} #behr_colorbox.namelist .behr_colorChart .cc-box:hover {transform: scale(1);} #behr_colorbox.namelist .behr_colorChart .cc-name { position: absolute; left: 87px; top:6px; display: block; width: 210px; font-size: 14px; color:#535353;} #behr_colorbox.namelist .behr_colorChart .cc-name span {display: block;} #behr_colorbox.namelist .behr_colorChart {margin-top: 78px !important; height: 660px !important;} #behr_colorbox.namelist .loading {top:238px;} #behr_colorbox.all_colors .behr_colorChart {margin-top: 65px;} \/*\uba54\ub274\ubcc4 \ubaa8\uc591*\/ #behr_colorbox .behr_color_menu a {color: transparent;} \/*1.all colors\uba54\ub274*\/ #behr_colorbox.all_colors .behr_color_menu a.bh_colornav0 {background: #b1383d;} #behr_colorbox.all_colors .behr_color_menu a.bh_colornav1 {background: #d3533a} #behr_colorbox.all_colors .behr_color_menu a.bh_colornav2 {background: #ffcb3a} #behr_colorbox.all_colors .behr_color_menu a.bh_colornav3 {background: #4f725a} #behr_colorbox.all_colors .behr_color_menu a.bh_colornav4 {background: #006993} \/*#behr_colorbox.all_colors .behr_color_menu a.bh_colornav5 {background: #86b9b2}*\/ #behr_colorbox.all_colors .behr_color_menu a.bh_colornav5 {background: #7f657e} #behr_colorbox.all_colors .behr_color_menu a.bh_colornav6 {background: #a99884} #behr_colorbox.all_colors .behr_color_menu a.bh_colornav7 {background: #818181} #behr_colorbox.all_colors .behr_color_menu a.bh_colornav8 {background: #f1f1f1} \/*2.best coloes \uba54\ub274*\/ #behr_colorbox.best_colors .behr_color_menu a.bh_colornav0 {background: #b1383d;} #behr_colorbox.best_colors .behr_color_menu a.bh_colornav1 {background: #d3533a} #behr_colorbox.best_colors .behr_color_menu a.bh_colornav2 {background: #ffcb3a} #behr_colorbox.best_colors .behr_color_menu a.bh_colornav3 {background: #4f725a} #behr_colorbox.best_colors .behr_color_menu a.bh_colornav4 {background: #006993} \/*#behr_colorbox.best_colors .behr_color_menu a.bh_colornav5 {background: #86b9b2}*\/ #behr_colorbox.best_colors .behr_color_menu a.bh_colornav5 {background: #7f657e} #behr_colorbox.best_colors .behr_color_menu a.bh_colornav6 {background: #a99884} #behr_colorbox.best_colors .behr_color_menu a.bh_colornav7 {background: #818181} #behr_colorbox.best_colors .behr_color_menu a.bh_colornav8 {background: #f1f1f1} \/*3. by booms \uba54\ub274*\/ #behr_colorbox.by_rooms .behr_monitor .behr_color_menu ul li {width: 67px;} #behr_colorbox.by_rooms .behr_color_menu a {background:#f2f2f2 url(\"https:\/\/behr.kr\/colorbox\/css\/..\/icon\/byroom.png\") no-repeat;} #behr_colorbox.by_rooms .behr_color_menu ul li:nth-child(odd) a {background-color:#e6e6e6;} #behr_colorbox.by_rooms .behr_color_menu a.bh_colornav0 {background-position: 0 0 !important; } #behr_colorbox.by_rooms .behr_color_menu a.bh_colornav1 {background-position: -99px 0 !important; } #behr_colorbox.by_rooms .behr_color_menu a.bh_colornav2 {background-position: -198px 0 !important; } #behr_colorbox.by_rooms .behr_color_menu a.bh_colornav3 {background-position: -297px 0 !important; } #behr_colorbox.by_rooms .behr_color_menu a.bh_colornav4 {background-position: -396px 0 !important; } #behr_colorbox.by_rooms .behr_color_menu a.bh_colornav5 {background-position: -495px 0 !important; } #behr_colorbox.by_rooms .behr_color_menu a.bh_colornav6 {background-position: -594px 0 !important; } #behr_colorbox.by_rooms .behr_color_menu a.bh_colornav7 {background-position: -693px 0 !important; } \/*4. by styles \uba54\ub274*\/ #behr_colorbox.by_styles .behr_monitor .behr_color_menu ul li {width: 67px;} #behr_colorbox.by_styles .behr_color_menu a {background:#f2f2f2; position: relative;} #behr_colorbox.by_styles .behr_color_menu ul li:nth-child(odd) a {background-color:#e6e6e6;} #behr_colorbox.by_styles .behr_color_menu a span {color:#535353; line-height: 49px;font-size: 12px; letter-spacing: -0.02em} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav0 span {color:#9f9480;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav1 span {color:#4fb3d0;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav2 span {color:#88a379;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav3 span {color:#848595;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav4 span {color:#81242b;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav5 span {color:#c1a889;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav6 span {color:#64a093;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav7 span {color:#839894;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav0.active {background:#9f9480;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav1.active {background:#4fb3d0;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav2.active {background:#88a379;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav3.active {background:#848595;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav4.active {background:#81242b;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav5.active {background:#c1a889;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav6.active {background:#64a093;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav7.active {background:#839894;} #behr_colorbox.by_styles .behr_color_menu a.active span {color:#fff !important;line-height: 60px;} #behr_colorbox.by_styles .behr_color_menu a.active {height: 60px; margin-top: -5px;border-radius: 5px; } #behr_colorbox.all_colors .behr_color_menu a.active, #behr_colorbox.best_colors .behr_color_menu a.active {background-image: url(\"https:\/\/behr.kr\/colorbox\/css\/..\/icon\/check.png\"); background-repeat: no-repeat; background-position: 50% 50%; height: 60px; margin-top: -5px; border-radius: 5px; } #behr_colorbox.by_rooms .behr_color_menu ul li a:hover {background-color: #535353; border-radius: 5px; } #behr_colorbox.by_rooms .behr_color_menu ul li a span {position: absolute; top:-20px; text-align: center; color:#535353; width: 100%; left: 0; display:none;} #behr_colorbox.by_rooms .behr_color_menu ul li a:hover span, #behr_colorbox.by_rooms .behr_color_menu ul li a.active span {position: absolute; top:-20px; text-align: center; display: block; color:#535353; width: 100%; left: 0;} #behr_colorbox.by_rooms .behr_color_menu ul li a.active {background-color: #535353; height: 60px; margin-top: -5px; border-radius: 5px;} #behr_colorbox.by_rooms .behr_color_menu a.active:after, #behr_colorbox.by_styles .behr_color_menu a.active:after {position:absolute; content: '';display: block; width: 100%; height: 100%; top:0; left: :0;\u00a0 background-image: url(\"https:\/\/behr.kr\/colorbox\/css\/..\/icon\/check.png\"); background-repeat: no-repeat; background-position: 50% 50%; height: 60px; margin-top: -5px; border-radius: 5px; } #behr_colorbox.by_styles .behr_color_menu ul li a u {position: absolute; top:-20px; text-align: center; color:#535353; width: 100%; left: 0; display:none; text-decoration: none;} #behr_colorbox.by_styles .behr_color_menu ul li a:hover u, #behr_colorbox.by_styles .behr_color_menu ul li a.active u {position: absolute; top:-20px; text-align: center; display: block; color:#535353; width: 100%; left: 0;} #behr_colorbox .cc_more_btn {position: absolute; left:184px; width: 208px; text-align: center;} #behr_colorbox .cc_more_btn a {display: block; height: 37px; width: 208px; color: #535353; cursor: pointer;} #behr_colorbox .cc_more_btn a i {display: inline-block; width: 35px; height: 35px; border-radius: 50%; background: #f9f9f9; vertical-align: middle; margin:0 10px;} #behr_colorbox .cc_more_btn a span {display: inline-block; vertical-align: top; width: 50px; height: 35px; line-height: 31px; text-align: left;text-transform : capitalize} #behr_colorbox .cc_more_btn a i.red {background:#b1383d } #behr_colorbox .cc_more_btn a i.orange {background:#d3533a } #behr_colorbox .cc_more_btn a i.yellow {background: #ffcb3a} #behr_colorbox .cc_more_btn a i.green {background: #4f725a} #behr_colorbox .cc_more_btn a i.blue {background:#006993 } #behr_colorbox .cc_more_btn a i.mint {background: #86b9b2} #behr_colorbox .cc_more_btn a i.purple {background: #7f657e} #behr_colorbox .cc_more_btn.prev {top:167px;} #behr_colorbox .cc_more_btn.next {top:850px;} #behr_colorbox .cc_more_btn.prev a i {background-repeat: no-repeat; background-image: url(\"https:\/\/behr.kr\/colorbox\/css\/..\/icon\/a_up.png\"); background-position: 50% 50%;} #behr_colorbox .cc_more_btn.next a i {background-repeat: no-repeat; background-image: url(\"https:\/\/behr.kr\/colorbox\/css\/..\/icon\/a_down.png\"); background-position: 50% 50%;} #behr_colorbox.namelist .cc_more_btn {display: none !important} \/* 20180327 \uc2e0\ub839\uc8fc \ucd94\uac00 *\/ #behr_colorbox span.cc_zoom {position:absolute; right:-10px; bottom:-5px; display:block; width:21px; height:21px; background:url(\"https:\/\/behr.kr\/colorbox\/css\/..\/icon\/zoomin.png\") 0 0 no-repeat;} #behr_colorbox .behr_nav ul li a:hover{background: #535353; color:#fff; height: 52px; line-height: 58px; font-size: 18px} #behr_colorbox.all_colors .behr_color_menu ul.cc_submenu li a:hover {background-image: url(\"https:\/\/behr.kr\/colorbox\/css\/..\/icon\/check.png\"); background-repeat: no-repeat; background-position: 50% 50%; height: 60px; margin-top: -5px; border-radius: 5px; } #detailCanvas_list span.cc_zoom {display:none;} #behr_colorbox.best_colors .behr_color_menu a:hover {background-image: url(\"https:\/\/behr.kr\/colorbox\/css\/..\/icon\/check.png\"); background-repeat: no-repeat; background-position: 50% 50%; height: 60px; margin-top: -5px; border-radius: 5px; } #behr_colorbox.by_rooms .behr_color_menu ul li a.active {background:#535353 url(\"https:\/\/behr.kr\/colorbox\/css\/..\/icon\/byroom_on.png\") no-repeat;} #behr_colorbox.by_rooms .behr_color_menu ul li a:hover {background:#535353 url(\"https:\/\/behr.kr\/colorbox\/css\/..\/icon\/byroom_on.png\") no-repeat; height: 60px; margin-top: -5px; border-radius: 5px;} #behr_colorbox.by_rooms .behr_color_menu ul li a:hover:after {position:absolute; content: '';display: block; width: 100%; height: 100%; top:0; left: :0;\u00a0 background-image: url(\"https:\/\/behr.kr\/colorbox\/css\/..\/check.png\"); background-repeat: no-repeat; background-position: 50% 50%; height: 60px; margin-top: -5px; border-radius: 5px; } #behr_colorbox.by_styles .behr_color_menu a.bh_colornav0:hover {background:#9f9480;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav1:hover {background:#4fb3d0;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav2:hover {background:#88a379;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav3:hover {background:#848595;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav4:hover {background:#81242b;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav5:hover {background:#c1a889;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav6:hover {background:#64a093;} #behr_colorbox.by_styles .behr_color_menu a.bh_colornav7:hover {background:#839894;} #behr_colorbox.by_styles .behr_color_menu a:hover span {color:#fff !important;line-height: 60px;} #behr_colorbox.by_styles .behr_color_menu a:hover {height: 60px; margin-top: -5px;border-radius: 5px; } #behr_colorbox.by_styles .behr_color_menu a:hover:after {position:absolute; content: '';display: block; width: 100%; height: 100%; top:0; left: :0;\u00a0 background-image: url(\"https:\/\/behr.kr\/colorbox\/css\/..\/icon\/check.png\"); background-repeat: no-repeat; background-position: 50% 50%; height: 60px; margin-top: -5px; border-radius: 5px; } #behr_colorbox.by_styles .behr_color_menu a {text-transform: capitalize;} #detailCanvas_view span.cc_zoom {display:none;} #behr_colorbox .detailCanvas_view span.cc_zoom {display:none;} #detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .palette_del {position: absolute; top:5px; right:5px; cursor: pointer; width: 20px; height: 20px; background: url(\"https:\/\/behr.kr\/colorbox\/css\/..\/icon\/close.png\") no-repeat 0 0; overflow: hidden; text-align: left; text-indent: -9999px; display:block;} #detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .palette_del:hover {background-position: 0 -20px;} .behr_palette .pal_down {display:block; margin:0 auto !important; cursor:pointer;} .behr_palette .pal_up {display:block; margin:0 auto 0 !important; padding-top:5px !important; cursor:pointer;} .behr_palette #behr_palette_save {height:720px; overflow:hidden;} #detailCanvas #detailCanvas_list.h90 {height:96px;} #detailCanvas #detailCanvas_view.h90 {height:164px; top:140px;}&lt;\/style&gt; &lt;script type=\"text\/javascript\" src=\"\/colorbox\/js\/colorbox_iframe.js?ver=1\"&gt;&lt;\/script&gt; &lt;script type=\"text\/javascript\"&gt; var buyInput = \"textinput\"; \/\/\uceec\ub7ec\uac12 \uc785\ub825\ud558\ub294\uacf3\uc758 \uc544\uc774\ub514\uc785\ub825 var ccDisplay = \"off\"; \/\/\uceec\ub7ec\uac12 \uc120\ud0dd\ud6c4 \uceec\ub7ec\ucc60\ud2b8 \uc0ac\ub77c\ub294 \uae30\ub2a5 on\/off var cckwd = new Array(\"coffee\",\"silver\",\"vintage\",\"lemon\",\"red\",\"green\",\"pink\"); \/\/\ucd94\ucc9c\ud0a4\uc6cc\ub4dc \ucd5c\ub300 7\uac1c &lt;\/script&gt; &lt;div id=\"behr_colorbox\" class=\"sch_color by_rooms\"&gt;&lt;div class=\"behr_nav\"&gt; &lt;ul&gt; &lt;li&gt;&lt;a class=\"ccsubmenu\" data-cc_category=\"all_colors\"&gt;All Colors&lt;\/a&gt;&lt;\/li&gt; &lt;li&gt;&lt;a class=\"ccsubmenu\" data-cc_category=\"best_colors\"&gt;Best Colors&lt;\/a&gt;&lt;\/li&gt; &lt;li&gt;&lt;a class=\"ccsubmenu active\" data-cc_category=\"by_rooms\"&gt;By Rooms&lt;\/a&gt;&lt;\/li&gt; &lt;li&gt;&lt;a class=\"ccsubmenu\" data-cc_category=\"by_styles\"&gt;By Styles&lt;\/a&gt;&lt;\/li&gt; &lt;li&gt;&lt;a class=\"ccsearch\"&gt;Search&lt;\/a&gt;&lt;\/li&gt; &lt;\/ul&gt; &lt;\/div&gt; &lt;div class=\"behr_monitor\"&gt; &lt;div class=\"behr_inner\"&gt; &lt;div class=\"behr_color_menu\"&gt; &lt;ul class=\"cc_submenu\"&gt;&lt;li&gt;&lt;a data-group=\"BEDROOM\" class=\"bh_colornav0 active\"&gt;&lt;span&gt;\uce68\uc2e4&lt;\/span&gt;&lt;\/a&gt;&lt;\/li&gt;&lt;li&gt;&lt;a data-group=\"BATHROOM\" class=\"bh_colornav1\"&gt;&lt;span&gt;\uc695\uc2e4&lt;\/span&gt;&lt;\/a&gt;&lt;\/li&gt;&lt;li&gt;&lt;a data-group=\"KIDSROOM\" class=\"bh_colornav2\"&gt;&lt;span&gt;\uc544\uc774\ubc29&lt;\/span&gt;&lt;\/a&gt;&lt;\/li&gt;&lt;li&gt;&lt;a data-group=\"LIVINGROOM\" class=\"bh_colornav3\"&gt;&lt;span&gt;\uac70\uc2e4&lt;\/span&gt;&lt;\/a&gt;&lt;\/li&gt;&lt;li&gt;&lt;a data-group=\"KITCHEN\" class=\"bh_colornav4\"&gt;&lt;span&gt;\ubd80\uc5cc&lt;\/span&gt;&lt;\/a&gt;&lt;\/li&gt;&lt;li&gt;&lt;a data-group=\"DININGROOM\" class=\"bh_colornav5\"&gt;&lt;span&gt;\uc8fc\ubc29&lt;\/span&gt;&lt;\/a&gt;&lt;\/li&gt;&lt;li&gt;&lt;a data-group=\"OFFICE\" class=\"bh_colornav6\"&gt;&lt;span&gt;\uc11c\uc7ac&lt;\/span&gt;&lt;\/a&gt;&lt;\/li&gt;&lt;li&gt;&lt;a data-group=\"EXTERIOR\" class=\"bh_colornav7\"&gt;&lt;span&gt;\uc2e4\uc678\uacf5\uac04&lt;\/span&gt;&lt;\/a&gt;&lt;\/li&gt;&lt;\/ul&gt; &lt;\/div&gt; &lt;div id=\"cc_search_area\" style=\"display: none;\"&gt; &lt;div class=\"cc_search\"&gt; &lt;label&gt;\uceec\ub7ec\ucc3e\uae30&lt;\/label&gt;&lt;input type=\"text\" id=\"cc_search_btn\" placeholder=\"\uceec\ub7ec\ubc88\ud638 \ub610\ub294 \uceec\ub7ec\uba85\uc73c\ub85c \uac80\uc0c9\ud558\uc138\uc694\"&gt; &lt;\/div&gt; &lt;div id=\"cckeywordauto\"&gt; &lt;ul&gt;&lt;li&gt;&lt;a&gt;coffee&lt;\/a&gt;&lt;\/li&gt;&lt;li&gt;&lt;a&gt;silver&lt;\/a&gt;&lt;\/li&gt;&lt;li&gt;&lt;a&gt;vintage&lt;\/a&gt;&lt;\/li&gt;&lt;li&gt;&lt;a&gt;lemon&lt;\/a&gt;&lt;\/li&gt;&lt;li&gt;&lt;a&gt;red&lt;\/a&gt;&lt;\/li&gt;&lt;li&gt;&lt;a&gt;green&lt;\/a&gt;&lt;\/li&gt;&lt;li&gt;&lt;a&gt;pink&lt;\/a&gt;&lt;\/li&gt;&lt;\/ul&gt; &lt;\/div&gt; &lt;div id=\"ccsearchOutput\"&gt;&lt;span id=\"cckeyword\"&gt;coffee&lt;\/span&gt;\uac80\uc0c9\uacb0\uacfc&lt;\/div&gt; &lt;\/div&gt; &lt;\/div&gt; &lt;div class=\"behr_colorChart\" style=\"display: block;\"&gt;&lt;div class=\"cc-box\" data-ccid=\"0\" data-name=\"PALE CORAL\" data-code=\"PPU3-07\" data-rgb=\"#F0D0B5\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#F0D0B5;\"&gt; &lt;p class=\"cc-name\"&gt;PALE CORAL&lt;span&gt;PPU3-07&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"1\" data-name=\"COCO\" data-code=\"N270-3\" data-rgb=\"#D1BBA2\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#D1BBA2;\"&gt; &lt;p class=\"cc-name\"&gt;COCO&lt;span&gt;N270-3&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"2\" data-name=\"STUDIO TAUPE\" data-code=\"PPU5-07\" data-rgb=\"#A5978A\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#A5978A;\"&gt; &lt;p class=\"cc-name\"&gt;STUDIO TAUPE&lt;span&gt;PPU5-07&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"3\" data-name=\"CHATEAU\" data-code=\"PPU7-06\" data-rgb=\"#B5A18B\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#B5A18B;\"&gt; &lt;p class=\"cc-name\"&gt;CHATEAU&lt;span&gt;PPU7-06&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"4\" data-name=\"DISTANT LAND\" data-code=\"N260-5\" data-rgb=\"#A68A72\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#A68A72;\"&gt; &lt;p class=\"cc-name\"&gt;DISTANT LAND&lt;span&gt;N260-5&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"5\" data-name=\"ANTIQUE WHITE\" data-code=\"23\" data-rgb=\"#E8DDCB\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#E8DDCB;\"&gt; &lt;p class=\"cc-name\"&gt;ANTIQUE WHITE&lt;span&gt;23&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"6\" data-name=\"CURIOUS COLLECTION\" data-code=\"N290-4\" data-rgb=\"#D2BB9A\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#D2BB9A;\"&gt; &lt;p class=\"cc-name\"&gt;CURIOUS COLLECTION&lt;span&gt;N290-4&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"7\" data-name=\"DOESKIN GRAY\" data-code=\"N200-2\" data-rgb=\"#CCC3BB\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#CCC3BB;\"&gt; &lt;p class=\"cc-name\"&gt;DOESKIN GRAY&lt;span&gt;N200-2&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"8\" data-name=\"WASABI POWDER\" data-code=\"PPU9-10\" data-rgb=\"#BDB390\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#BDB390;\"&gt; &lt;p class=\"cc-name\"&gt;WASABI POWDER&lt;span&gt;PPU9-10&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"9\" data-name=\"MINTED LEMON\" data-code=\"PPU10-08\" data-rgb=\"#C0C6A9\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#C0C6A9;\"&gt; &lt;p class=\"cc-name\"&gt;MINTED LEMON&lt;span&gt;PPU10-08&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"10\" data-name=\"RIVERDALE\" data-code=\"N410-3\" data-rgb=\"#BEC5BC\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#BEC5BC;\"&gt; &lt;p class=\"cc-name\"&gt;RIVERDALE&lt;span&gt;N410-3&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"11\" data-name=\"ZEN\" data-code=\"PPU11-14\" data-rgb=\"#AABAB0\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#AABAB0;\"&gt; &lt;p class=\"cc-name\"&gt;ZEN&lt;span&gt;PPU11-14&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"12\" data-name=\"ATMOSPHERIC\" data-code=\"PPU12-15\" data-rgb=\"#899698\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#899698;\"&gt; &lt;p class=\"cc-name\"&gt;ATMOSPHERIC&lt;span&gt;PPU12-15&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"13\" data-name=\"OBSERVATORY\" data-code=\"PPU13-19\" data-rgb=\"#455D66\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#455D66;\"&gt; &lt;p class=\"cc-name\"&gt;OBSERVATORY&lt;span&gt;PPU13-19&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"14\" data-name=\"FLOWING BREEZE\" data-code=\"N480-2\" data-rgb=\"#B9C6CC\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#B9C6CC;\"&gt; &lt;p class=\"cc-name\"&gt;FLOWING BREEZE&lt;span&gt;N480-2&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"15\" data-name=\"FOREVER DENIM\" data-code=\"PPU14-05\" data-rgb=\"#778591\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#778591;\"&gt; &lt;p class=\"cc-name\"&gt;FOREVER DENIM&lt;span&gt;PPU14-05&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"16\" data-name=\"CATHEDRAL GRAY\" data-code=\"PPU18-14\" data-rgb=\"#ACAAA8\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#ACAAA8;\"&gt; &lt;p class=\"cc-name\"&gt;CATHEDRAL GRAY&lt;span&gt;PPU18-14&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"17\" data-name=\"SUEDE GRAY\" data-code=\"PPU18-17\" data-rgb=\"#857F7B\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#857F7B;\"&gt; &lt;p class=\"cc-name\"&gt;SUEDE GRAY&lt;span&gt;PPU18-17&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"18\" data-name=\"FRENCH LILAC\" data-code=\"PPU16-10\" data-rgb=\"#BDB8BB\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#BDB8BB;\"&gt; &lt;p class=\"cc-name\"&gt;FRENCH LILAC&lt;span&gt;PPU16-10&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"19\" data-name=\"SO MERLOT\" data-code=\"PPU1-15\" data-rgb=\"#84525B\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#84525B;\"&gt; &lt;p class=\"cc-name\"&gt;SO MERLOT&lt;span&gt;PPU1-15&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"20\" data-name=\"BLACKBERRY JAM\" data-code=\"S100-6\" data-rgb=\"#6F5F71\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#6F5F71;\"&gt; &lt;p class=\"cc-name\"&gt;BLACKBERRY JAM&lt;span&gt;S100-6&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"21\" data-name=\"LUXE LILAC\" data-code=\"N560-3\" data-rgb=\"#A7A3B2\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#A7A3B2;\"&gt; &lt;p class=\"cc-name\"&gt;LUXE LILAC&lt;span&gt;N560-3&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"22\" data-name=\"BLUEPRINT\" data-code=\"S470-5\" data-rgb=\"#5F818F\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#5F818F;\"&gt; &lt;p class=\"cc-name\"&gt;BLUEPRINT&lt;span&gt;S470-5&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"23\" data-name=\"HALF SEA FOG\" data-code=\"N470-3\" data-rgb=\"#A9B7BC\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#A9B7BC;\"&gt; &lt;p class=\"cc-name\"&gt;HALF SEA FOG&lt;span&gt;N470-3&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"24\" data-name=\"SILVER BULLET\" data-code=\"N520-2\" data-rgb=\"#C4C4C4\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#C4C4C4;\"&gt; &lt;p class=\"cc-name\"&gt;SILVER BULLET&lt;span&gt;N520-2&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"25\" data-name=\"MINED COAL\" data-code=\"PPU18-18\" data-rgb=\"#6C6A66\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#6C6A66;\"&gt; &lt;p class=\"cc-name\"&gt;MINED COAL&lt;span&gt;PPU18-18&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"26\" data-name=\"JUNGLE CAMOUFLAGE\" data-code=\"N350-4\" data-rgb=\"#AAA795\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#AAA795;\"&gt; &lt;p class=\"cc-name\"&gt;JUNGLE CAMOUFLAGE&lt;span&gt;N350-4&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"27\" data-name=\"KINDLING\" data-code=\"N200-6\" data-rgb=\"#7A7069\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#7A7069;\"&gt; &lt;p class=\"cc-name\"&gt;KINDLING&lt;span&gt;N200-6&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"28\" data-name=\"HARMONIOUS GOLD\" data-code=\"M300-3\" data-rgb=\"#E9CFA4\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#E9CFA4;\"&gt; &lt;p class=\"cc-name\"&gt;HARMONIOUS GOLD&lt;span&gt;M300-3&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"29\" data-name=\"LUNAR SURFACE\" data-code=\"N460-3\" data-rgb=\"#B5B9B7\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#B5B9B7;\"&gt; &lt;p class=\"cc-name\"&gt;LUNAR SURFACE&lt;span&gt;N460-3&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"30\" data-name=\"CANVAS LUGGAGE\" data-code=\"N300-2\" data-rgb=\"#E1D7C7\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#E1D7C7;\"&gt; &lt;p class=\"cc-name\"&gt;CANVAS LUGGAGE&lt;span&gt;N300-2&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"31\" data-name=\"BREATHE\" data-code=\"S360-2\" data-rgb=\"#D1D1B9\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#D1D1B9;\"&gt; &lt;p class=\"cc-name\"&gt;BREATHE&lt;span&gt;S360-2&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"32\" data-name=\"METROPOLIS\" data-code=\"N140-3\" data-rgb=\"#B3A9A6\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#B3A9A6;\"&gt; &lt;p class=\"cc-name\"&gt;METROPOLIS&lt;span&gt;N140-3&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"33\" data-name=\"LINEN WHITE\" data-code=\"70\" data-rgb=\"#F6ECD8\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#F6ECD8;\"&gt; &lt;p class=\"cc-name\"&gt;LINEN WHITE&lt;span&gt;70&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"34\" data-name=\"ANONYMOUS\" data-code=\"780F-5\" data-rgb=\"#939392\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#939392;\"&gt; &lt;p class=\"cc-name\"&gt;ANONYMOUS&lt;span&gt;780F-5&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"35\" data-name=\"DRY BROWN\" data-code=\"N230-5\" data-rgb=\"#968375\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#968375;\"&gt; &lt;p class=\"cc-name\"&gt;DRY BROWN&lt;span&gt;N230-5&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"36\" data-name=\"PERFECT TAUPE\" data-code=\"PPU18-13\" data-rgb=\"#B5ACA1\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#B5ACA1;\"&gt; &lt;p class=\"cc-name\"&gt;PERFECT TAUPE&lt;span&gt;PPU18-13&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"37\" data-name=\"STERLING\" data-code=\"780E-3\" data-rgb=\"#D2D4D3\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#D2D4D3;\"&gt; &lt;p class=\"cc-name\"&gt;STERLING&lt;span&gt;780E-3&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"38\" data-name=\"SUBTLE TOUCH\" data-code=\"790E-1\" data-rgb=\"#DBDADA\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#DBDADA;\"&gt; &lt;p class=\"cc-name\"&gt;SUBTLE TOUCH&lt;span&gt;790E-1&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"39\" data-name=\"FRENCH SILVER\" data-code=\"PPU18-05\" data-rgb=\"#B8BCBE\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#B8BCBE;\"&gt; &lt;p class=\"cc-name\"&gt;FRENCH SILVER&lt;span&gt;PPU18-05&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"40\" data-name=\"FLANNEL GRAY\" data-code=\"N520-3\" data-rgb=\"#ADADAD\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#ADADAD;\"&gt; &lt;p class=\"cc-name\"&gt;FLANNEL GRAY&lt;span&gt;N520-3&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"41\" data-name=\"ULTRA PURE WHITE PRW15\" data-code=\"PR-W15\" data-rgb=\"#F8F9F5\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#F8F9F5;\"&gt; &lt;p class=\"cc-name\"&gt;ULTRA PURE WHITE PRW15&lt;span&gt;PR-W15&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"42\" data-name=\"WHITE METAL\" data-code=\"N520-1\" data-rgb=\"#D0D0D0\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#D0D0D0;\"&gt; &lt;p class=\"cc-name\"&gt;WHITE METAL&lt;span&gt;N520-1&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"43\" data-name=\"BURNISHED CLAY\" data-code=\"PPU18-09\" data-rgb=\"#D2CCC5\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#D2CCC5;\"&gt; &lt;p class=\"cc-name\"&gt;BURNISHED CLAY&lt;span&gt;PPU18-09&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"44\" data-name=\"DARK NAVY\" data-code=\"S530-7\" data-rgb=\"#40495B\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#40495B;\"&gt; &lt;p class=\"cc-name\"&gt;DARK NAVY&lt;span&gt;S530-7&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"45\" data-name=\"DARK PEWTER\" data-code=\"PPU18-04\" data-rgb=\"#8D9397\" data-tcol=\"W\" data-scroll=\"0\" style=\"background:#8D9397;\"&gt; &lt;p class=\"cc-name\"&gt;DARK PEWTER&lt;span&gt;PPU18-04&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"46\" data-name=\"POLAR BEAR\" data-code=\"75\" data-rgb=\"#F5F3ED\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#F5F3ED;\"&gt; &lt;p class=\"cc-name\"&gt;POLAR BEAR&lt;span&gt;75&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"47\" data-name=\"CHICAGO FOG\" data-code=\"N140-2\" data-rgb=\"#C9C1BE\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#C9C1BE;\"&gt; &lt;p class=\"cc-name\"&gt;CHICAGO FOG&lt;span&gt;N140-2&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"48\" data-name=\"SPUN WOOL\" data-code=\"N220-1\" data-rgb=\"#E3DDD6\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#E3DDD6;\"&gt; &lt;p class=\"cc-name\"&gt;SPUN WOOL&lt;span&gt;N220-1&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"49\" data-name=\"BOOT CUT\" data-code=\"S510-2\" data-rgb=\"#AEC1D0\" data-tcol=\"B\" data-scroll=\"0\" style=\"background:#AEC1D0;\"&gt; &lt;p class=\"cc-name\"&gt;BOOT CUT&lt;span&gt;S510-2&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;\/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;\/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;\/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;\/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;\/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;\/div&gt;&lt;div class=\"cc-box-img\"&gt;&lt;div class=\"cc-box-imgbox\"&gt;&lt;img src=\"\/colorbox\/img\/byrooms\/Bed01.jpg\" alt=\"\uc774\ubbf8\uc9c01\ubc88\uc785\ub2c8\ub2e4.\"&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"57\" data-name=\"GENTLE SEA\" data-code=\"S470-2\" data-rgb=\"#B0C8D1\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#B0C8D1;\"&gt; &lt;p class=\"cc-name\"&gt;GENTLE SEA&lt;span&gt;S470-2&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"58\" data-name=\"POLAR BEAR\" data-code=\"75\" data-rgb=\"#F5F3ED\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#F5F3ED;\"&gt; &lt;p class=\"cc-name\"&gt;POLAR BEAR&lt;span&gt;75&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;\/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;\/div&gt;&lt;\/div&gt;&lt;div class=\"cc-box-img\"&gt;&lt;div class=\"cc-box-imgbox\"&gt;&lt;img src=\"\/colorbox\/img\/byrooms\/Bed02.jpg\" alt=\"\uc774\ubbf8\uc9c02\ubc88\uc785\ub2c8\ub2e4\"&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"63\" data-name=\"UNDINE\" data-code=\"M450-4\" data-rgb=\"#89C0BC\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#89C0BC;\"&gt; &lt;p class=\"cc-name\"&gt;UNDINE&lt;span&gt;M450-4&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"64\" data-name=\"CARBON\" data-code=\"N520-7\" data-rgb=\"#3D3E3F\" data-tcol=\"W\" data-scroll=\"i\" style=\"background:#3D3E3F;\"&gt; &lt;p class=\"cc-name\"&gt;CARBON&lt;span&gt;N520-7&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"65\" data-name=\"SPANISH SAND\" data-code=\"OR-W7\" data-rgb=\"#DCD0BE\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#DCD0BE;\"&gt; &lt;p class=\"cc-name\"&gt;SPANISH SAND&lt;span&gt;OR-W7&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;\/div&gt;&lt;\/div&gt;&lt;div class=\"cc-box-img\"&gt;&lt;div class=\"cc-box-imgbox\"&gt;&lt;img src=\"\/colorbox\/img\/byrooms\/Bed03.jpg\" alt=\"\uc774\ubbf8\uc9c03\ubc88\uc785\ub2c8\ub2e4\"&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"69\" data-name=\"CHATEAU\" data-code=\"PPU7-06\" data-rgb=\"#B5A18B\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#B5A18B;\"&gt; &lt;p class=\"cc-name\"&gt;CHATEAU&lt;span&gt;PPU7-06&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"70\" data-name=\"POLAR BEAR\" data-code=\"75\" data-rgb=\"#F5F3ED\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#F5F3ED;\"&gt; &lt;p class=\"cc-name\"&gt;POLAR BEAR&lt;span&gt;75&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"71\" data-name=\"BLACKOUT\" data-code=\"N510-7\" data-rgb=\"#413F3F\" data-tcol=\"W\" data-scroll=\"i\" style=\"background:#413F3F;\"&gt; &lt;p class=\"cc-name\"&gt;BLACKOUT&lt;span&gt;N510-7&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;\/div&gt;&lt;\/div&gt;&lt;div class=\"cc-box-img\"&gt;&lt;div class=\"cc-box-imgbox\"&gt;&lt;img src=\"\/colorbox\/img\/byrooms\/Bed04.jpg\" alt=\"\uc774\ubbf8\uc9c04\ubc88\uc785\ub2c8\ub2e4\"&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"75\" data-name=\"AGED BEIGE\" data-code=\"PPU7-09\" data-rgb=\"#D7CFC1\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#D7CFC1;\"&gt; &lt;p class=\"cc-name\"&gt;AGED BEIGE&lt;span&gt;PPU7-09&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"76\" data-name=\"PURE EARTH\" data-code=\"PPU7-05\" data-rgb=\"#A79481\" data-tcol=\"W\" data-scroll=\"i\" style=\"background:#A79481;\"&gt; &lt;p class=\"cc-name\"&gt;PURE EARTH&lt;span&gt;PPU7-05&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"77\" data-name=\"WHITE\" data-code=\"1852\" data-rgb=\"#EBEAE7\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#EBEAE7;\"&gt; &lt;p class=\"cc-name\"&gt;WHITE&lt;span&gt;1852&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;\/div&gt;&lt;\/div&gt;&lt;div class=\"cc-box-img\"&gt;&lt;div class=\"cc-box-imgbox\"&gt;&lt;img src=\"\/colorbox\/img\/byrooms\/Bed05.jpg\" alt=\"\uc774\ubbf8\uc9c05\ubc88\uc785\ub2c8\ub2e4\"&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"81\" data-name=\"FUTURE VISION\" data-code=\"N100-3\" data-rgb=\"#BCB5BD\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#BCB5BD;\"&gt; &lt;p class=\"cc-name\"&gt;FUTURE VISION&lt;span&gt;N100-3&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"82\" data-name=\"ULTRA PURE WHITE\" data-code=\"PPU18-06\" data-rgb=\"#F8F8F4\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#F8F8F4;\"&gt; &lt;p class=\"cc-name\"&gt;ULTRA PURE WHITE&lt;span&gt;PPU18-06&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;\/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;\/div&gt;&lt;\/div&gt;&lt;div class=\"cc-box-img\"&gt;&lt;div class=\"cc-box-imgbox\"&gt;&lt;img src=\"\/colorbox\/img\/byrooms\/Bed06.jpg\" alt=\"\uc774\ubbf8\uc9c06\ubc88\uc785\ub2c8\ub2e4\"&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"87\" data-name=\"PALE PARSNIP\" data-code=\"S320-2\" data-rgb=\"#E3D7C1\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#E3D7C1;\"&gt; &lt;p class=\"cc-name\"&gt;PALE PARSNIP&lt;span&gt;S320-2&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"88\" data-name=\"SLEEK WHITE\" data-code=\"OR-W15\" data-rgb=\"#FAF5EB\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#FAF5EB;\"&gt; &lt;p class=\"cc-name\"&gt;SLEEK WHITE&lt;span&gt;OR-W15&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"89\" data-name=\"MAUVELOUS\" data-code=\"BNC-12\" data-rgb=\"#B5A49E\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#B5A49E;\"&gt; &lt;p class=\"cc-name\"&gt;MAUVELOUS&lt;span&gt;BNC-12&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;\/div&gt;&lt;\/div&gt;&lt;div class=\"cc-box-img\"&gt;&lt;div class=\"cc-box-imgbox\"&gt;&lt;img src=\"\/colorbox\/img\/byrooms\/Bed07.jpg\" alt=\"\uc774\ubbf8\uc9c07\ubc88\uc785\ub2c8\ub2e4\"&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"93\" data-name=\"ROMAN PLASTER\" data-code=\"PPU7-10\" data-rgb=\"#DDD1C0\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#DDD1C0;\"&gt; &lt;p class=\"cc-name\"&gt;ROMAN PLASTER&lt;span&gt;PPU7-10&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"94\" data-name=\"SWISS COFFEE\" data-code=\"12\" data-rgb=\"#F1ECE1\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#F1ECE1;\"&gt; &lt;p class=\"cc-name\"&gt;SWISS COFFEE&lt;span&gt;12&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"95\" data-name=\"JOURNEYS END\" data-code=\"S520-2\" data-rgb=\"#BAC9D6\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#BAC9D6;\"&gt; &lt;p class=\"cc-name\"&gt;JOURNEYS END&lt;span&gt;S520-2&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box-none\"&gt;&lt;\/div&gt;&lt;\/div&gt;&lt;div class=\"cc-box-img\"&gt;&lt;div class=\"cc-box-imgbox\"&gt;&lt;img src=\"\/colorbox\/img\/byrooms\/Bed08.jpg\" alt=\"\uc774\ubbf8\uc9c08\ubc88\uc785\ub2c8\ub2e4\"&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"99\" data-name=\"PARK AVENUE\" data-code=\"MQ2-55\" data-rgb=\"#bbb2a9\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#bbb2a9;\"&gt; &lt;p class=\"cc-name\"&gt;PARK AVENUE&lt;span&gt;MQ2-55&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"100\" data-name=\"COLD STEEL\" data-code=\"MQ5-20\" data-rgb=\"#808f99\" data-tcol=\"W\" data-scroll=\"i\" style=\"background:#808f99;\"&gt; &lt;p class=\"cc-name\"&gt;COLD STEEL&lt;span&gt;MQ5-20&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"101\" data-name=\"CREME DE LA CREME\" data-code=\"MQ3-33\" data-rgb=\"#e2ddd8\" data-tcol=\"B\" data-scroll=\"i\" style=\"background:#e2ddd8;\"&gt; &lt;p class=\"cc-name\"&gt;CREME DE LA CREME&lt;span&gt;MQ3-33&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;div class=\"cc-box\" data-ccid=\"102\" data-name=\"UNPREDICTABLE HUE\" data-code=\"MQ2-58\" data-rgb=\"#7b746c\" data-tcol=\"W\" data-scroll=\"i\" style=\"background:#7b746c;\"&gt; &lt;p class=\"cc-name\"&gt;UNPREDICTABLE HUE&lt;span&gt;MQ2-58&lt;\/span&gt;&lt;\/p&gt;&lt;\/div&gt;&lt;\/div&gt;&lt;\/div&gt; &lt;\/div&gt; &lt;div class=\"behr_selectColor\"&gt; &lt;h3&gt;My BEHR Colors&lt;\/h3&gt; &lt;div class=\"behr_palette\"&gt; &lt;div class=\"behr_palette_guide\"&gt; \ud06c\uac8c \ubcf4\uace0 \uc2f6\uc740 \uceec\ub7ec\ub97c \ub20c\ub7ec \ubcf4\uc138\uc694. &lt;\/div&gt; &lt;div id=\"behr_palette_save\"&gt; &lt;\/div&gt; &lt;\/div&gt; &lt;div id=\"detailCanvas\" style=\"display: none;\"&gt;&lt;div id=\"detailCanvas_list\"&gt;&lt;div class=\"cc-box\" data-ccid=\"94\" data-name=\"SWISS COFFEE\" data-code=\"12\" data-rgb=\"#F1ECE1\" data-tcol=\"B\" data-scroll=\"i\" style=\";\"&gt; &lt;p class=\"cc-name\"&gt;SWISS COFFEE&lt;span&gt;12&lt;\/span&gt;&lt;\/p&gt;&lt;a class=\"cc-view\" style=\"background:#F1ECE1;\"&gt;&lt;span class=\"cc_zoom\"&gt;&lt;\/span&gt;&lt;\/a&gt;&lt;a class=\"palette_del\"&gt;\uc0ad\uc81c&lt;\/a&gt;&lt;\/div&gt;&lt;div class=\"cc-box active\" data-ccid=\"95\" data-name=\"JOURNEYS END\" data-code=\"S520-2\" data-rgb=\"#BAC9D6\" data-tcol=\"B\" data-scroll=\"i\" style=\";\"&gt; &lt;p class=\"cc-name\"&gt;JOURNEYS END&lt;span&gt;S520-2&lt;\/span&gt;&lt;\/p&gt;&lt;a class=\"cc-view\" style=\"background:#BAC9D6;\"&gt;&lt;span class=\"cc_zoom\"&gt;&lt;\/span&gt;&lt;\/a&gt;&lt;a class=\"palette_del\"&gt;\uc0ad\uc81c&lt;\/a&gt;&lt;\/div&gt; &lt;\/div&gt;&lt;div id=\"detailCanvas_view\"&gt;&lt;div class=\"cc-box active\" data-ccid=\"95\" data-name=\"JOURNEYS END\" data-code=\"S520-2\" data-rgb=\"#BAC9D6\" data-tcol=\"B\" data-scroll=\"i\" style=\";\"&gt; &lt;p class=\"cc-name\"&gt;JOURNEYS END&lt;span&gt;S520-2&lt;\/span&gt;&lt;\/p&gt;&lt;a class=\"cc-view\" style=\"background:#BAC9D6;\"&gt;&lt;span class=\"cc_zoom\"&gt;&lt;\/span&gt;&lt;\/a&gt;&lt;a class=\"palette_del\"&gt;\uc0ad\uc81c&lt;\/a&gt;&lt;a class=\"detailColorvs_buyBtn\"&gt;\uc8fc\ubb38\ud558\uae30&lt;\/a&gt;&lt;\/div&gt;&lt;\/div&gt; &lt;div id=\"detailCanvas_color\"&gt; &lt;a class=\"detailCanvas_btn detailCanvas_btn01\" data-index=\"0\"&gt;1\ubc88\uc0c9\uc0c1\uc120\ud0dd&lt;\/a&gt; &lt;a class=\"detailCanvas_btn detailCanvas_btn02\" data-index=\"1\"&gt;2\ubc88\uc0c9\uc0c1\uc120\ud0dd&lt;\/a&gt; &lt;a class=\"detailCanvas_btn detailCanvas_btn03\" data-index=\"2\"&gt;3\ubc88\uc0c9\uc0c1\uc120\ud0dd&lt;\/a&gt; &lt;div class=\"detailCanvas_view detailCanvas_view01\"&gt;&lt;\/div&gt; &lt;div class=\"detailCanvas_view detailCanvas_view02\"&gt;&lt;\/div&gt; &lt;div class=\"detailCanvas_view detailCanvas_view03\"&gt;&lt;\/div&gt; &lt;\/div&gt;&lt;a class=\"detailCanvas_close\"&gt;\ub2eb\uae30&lt;\/a&gt;&lt;\/div&gt; &lt;\/div&gt; &lt;div class=\"loading\" style=\"display: none;\"&gt;&lt;img src=\"\/colorbox\/icon\/ajax-loader.gif\"&gt;&lt;\/div&gt;&lt;div class=\"wh-ov\" style=\"display: none;\"&gt;&lt;\/div&gt;&lt;\/div&gt; &lt;!-- } \uceec\ub7ec\ucc60\ud2b8 \uc0bd\uc785 --&gt;&lt;\/article&gt;&lt;\/body&gt;&lt;\/html&gt; &lt;\/iframe&gt;&lt;\/center&gt; \uc774\ub807\uac8c \ub123\uc73c\uba74 \ub418\ub294\uac70 \uc544\ub2cc\uac00\uc694? \u3160\u3160 \uc548\ub418\ub124\uc694 ",
    "answerCount": "1",
    "acceptedAnswer": {
      "@type": "Answer",
      "upvoteCount": "0",
      "url": "https://cboard.net/k/1_1040205_428878900",
      "text": "\uc8c4\uc1a1\ud55c\ub370 \uc774\ub807\uac8c \uc9c8\ubb38\ud558\uba74 \ubabb \uc54c\uc544\ubd05\ub2c8\ub2e4..\u3160\u3160 \uae43\ud5c8\ube0c\ub098 hastebin\uc5d0 \uc18c\uc2a4 \uc62c\ub9ac\uc154\uc11c \uc598\uae30\ud574\uc8fc\uc2dc\uba74 \ud3b8\ud560 \uac83 \uac19\uc2b5\ub2c8\ub2e4."    },
    "suggestedAnswer": [
          ]
  }
}
</script>

<link rel="stylesheet" type="text/css" href="/css/common.css">
<link rel="stylesheet" type="text/css" href="/css/desc.css">
<div class="container px-0" style="position:relative">
<div id="left-ba" class="g-ba">
<!-- 좌측 레이어 -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-9176212351894019"
     data-ad-slot="2471880472"
     data-ad-format="auto"
     data-full-width-responsive="true"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script>
<!-- 좌측 레이어 -->
</div>
<header id="hd">
<h1 id="hd_h1">네이버스토어 html 삽입</h1>
<div class="to_content"><a href="#container">본문 바로가기</a></div>
<div id="hd_wrapper">
<div id="logo">
<a href="/"><img src="/img/logo.png" width="180" height="60" alt="시보드"></a>
</div>
<ul id="tnb" class="pc_view">
<li><a href="https://cboard.net/bbs/login.php" rel="nofollow">로그인</a></li>
<li><a href="https://cboard.net/bbs/register.php" rel="nofollow">회원가입</a></li>
</ul>
<button type="button" id="gnb_open" class="m_view"><b>〓</b><span class="sound_only"> 메뉴열기</span></button>
<button type="button" id="user_open" class="m_view"><span class="sound_only"> 유저메뉴열기</span></button>
</div>
<div id="gnb">
<div class="gnb_bg"></div>
<div class="gnb_wr">
<button type="button" id="gnb_close" class="m_view"><b>X</b><span class="sound_only">메뉴 닫기</span></button>
<ul class="gnb_login m_view">
<li><a href="https://cboard.net/bbs/register.php" rel="nofollow">회원가입</a></li>
<li><a href="https://cboard.net/bbs/login.php" rel="nofollow">로그인</a></li>
</ul>
<ul id="gnb_1dul">
  <li class="gnb_1dli">
    <a href="/bbs/group.php?gr_id=community" target="_self" class="gnb_1da">
      <i class="fa fa-commenting" aria-hidden="true"></i> 커뮤니티
    </a>
    <button type="button" class="btn_gnb_op">하위분류</button>
    <ul class="gnb_2dul">
      <li class="gnb_2dli">
        <a href="/hit3" target="_self" class="gnb_2da">
          <i class="fa fa-fire" aria-hidden="true"></i> 인기 게시물
        </a>
      </li>
      <li class="gnb_2dli">
        <a href="/free_01" target="_self" class="gnb_2da">자유게시판</a>
      </li>
      <li class="gnb_2dli">
        <a href="/an" target="_self" class="gnb_2da">익명게시판</a>
      </li>
	  <li class="gnb_2dli">
        <a href="/qna_4" target="_self" class="gnb_2da">질문 답변</a>
      </li>
      <li class="gnb_2dli">
        <a href="/notice" target="_self" class="gnb_2da">공지사항</a>
      </li>
    </ul>
  </li>
  <li class="gnb_1dli">
    <a href="/bbs/group.php?gr_id=game_board" target="_self" class="gnb_1da">
      <i class="fa fa-gamepad" aria-hidden="true"></i> 게임 게시판
    </a>
    <button type="button" class="btn_gnb_op">하위분류</button>
    <ul class="gnb_2dul">
      <li class="gnb_2dli">
        <a href="/leagueoflegends" target="_self" class="gnb_2da">리그오브레전드</a>
      </li>
      <li class="gnb_2dli">
        <a href="/maplestory" target="_self" class="gnb_2da">메이플스토리</a>
      </li>
	        <li class="gnb_2dli">
        <a href="/battlegrounds" target="_self" class="gnb_2da">배틀그라운드</a>
      </li>
	  <li class="gnb_2dli">
        <a href="/fifaonline" target="_self" class="gnb_2da">피파온라인</a>
      </li>
	  <li class="gnb_2dli">
        <a href="/game_etc" target="_self" class="gnb_2da">기타게임</a>
      </li>
    </ul>
  </li>
  <li class="gnb_1dli">
    <a href="/bbs/group.php?gr_id=sports" target="_self" class="gnb_1da">
      <i class="fa fa-baseball" aria-hidden="true"></i> 스포츠 게시판
    </a>
    <button type="button" class="btn_gnb_op">하위분류</button>
    <ul class="gnb_2dul">
      <li class="gnb_2dli">
        <a href="/soccer" target="_self" class="gnb_2da">축구</a>
      </li>
      <li class="gnb_2dli">
        <a href="/baseball" target="_self" class="gnb_2da">야구</a>
      </li>
      <li class="gnb_2dli">
        <a href="/etc_sports" target="_self" class="gnb_2da">기타 스포츠</a>
      </li>
    </ul>
  </li>
  <li class="gnb_1dli">
    <a href="/bbs/group.php?gr_id=etc_board" target="_self" class="gnb_1da">기타 게시판</a>
    <button type="button" class="btn_gnb_op">하위분류</button>
    <ul class="gnb_2dul">
      <li class="gnb_2dli">
        <a href="/stock_23_07" target="_self" class="gnb_2da">주식</a>
      </li>
	  <li class="gnb_2dli">
        <a href="/coin_new" target="_self" class="gnb_2da">코인</a>
      </li>
	  <li class="gnb_2dli">
        <a href="/wiki" target="_self" class="gnb_2da">위키</a>
      </li>
    </ul>
  </li>
  <!--
  <li class="gnb_1dli">
    <a href="/gift.php" target="_self" class="gnb_1da">기프티콘샵</a>
  </li>
  -->
</ul>
<button type="button" class="pc_view" id="sch_op_btn"><span class="sound_only">검색열기</span><i class="fa fa-search"></i></button>
<div id="hd_sch">
<form>
<input type="text" id="sch_stx" placeholder="검색어(필수)" required maxlength="20">
<button type="submit" onclick="window.location.href='https://cboard.net/s/' + document.getElementById('sch_stx').value; return false;" value="검색" id="sch_submit"><i class="fa fa-search"></i><span class="sound_only">검색</span></button>
</form>
<script>/*<![CDATA[*/function fsearchbox_submit(c){if(c.stx.value.length<2){alert("검색어는 두글자 이상 입력하십시오.");c.stx.select();c.stx.focus();return false}var b=0;for(var a=0;a<c.stx.value.length;a++){if(c.stx.value.charAt(a)==" "){b++}}if(b>1){alert("빠른 검색을 위하여 검색어에 공백은 한개만 입력할 수 있습니다.");c.stx.select();c.stx.focus();return false}return true};/*]]>*/</script>
<button type="button" class="sch_cl_btn pc_view"><span class="sound_only">닫기</span><i class="fa fa-close"></i></button>
</div>

</div>
</div>
</header>
<div id="wrapper">
<div id="container">
<div id="idx_left">

<script src="https://cboard.net/js/viewimageresize.js"></script>
<article id="bo_v" style="width:100%">
<header>
<p style="font-weight: bold; font-size: 1em;" id="bo_v_title">
<span class="bo_v_tit">
네이버스토어 html 삽입</span>
</p>
</header>
<section id="bo_v_info">

<noscript class="sv_nojs"><span class="sv">
<!--
<a href="https://cboard.net/bbs/memo_form.php?me_recv_mb_id=" rel="nofollow" onclick="win_memo(this.href); return false;">쪽지보내기</a>
<a href="https://cboard.net/leagueoflegends?sca=&amp;sfl=wr_name,1&amp;stx=THE ONLY WAY IS…" rel="nofollow">이름으로 검색</a>
-->
</span>
</noscript></span> <span class="ip"></span>
<span class="sound_only">작성일</span><i class="fa fa-clock-o" aria-hidden="true"></i> 2022.09.22<span class="sound_only">댓글</span><strong><i class="fa fa-commenting" aria-hidden="true"></i> 1건</strong>
<div id="bo_v_edit">
<button type="button" class="edit_op_btn view_btn" onclick="window.open('https://cboard.net/cc/kin_remove.php?q=https://cboard.net/k/1_1040205_428878900', '_blank')">
    <i class="fa fa-ellipsis-v" aria-hidden="true"></i>
    <span class="sound_only">게시판 내용수정</span> 
</button>
<ul class="bo_v_left">
게시물 수정 , 삭제는 로그인 필요
</ul>
</div>
<script>
            /*<![CDATA[*/
            $(function() {
                $(".edit_op_btn").click(function() {
                    $(".bo_v_left").toggle()
                });
                $(document).mouseup(function(b) {
                    var a = $(".bo_v_left");
                    if (!a.is(b.target) && a.has(b.target).length === 0) {
                        a.css("display", "none")
                    }
                })
            }); /*]]>*/
        </script>
</section>
<section id="bo_v_atc">

<div id="bo_v_share">

</div>
<div id="bo_v_img">
</div>
<div id="bo_v_con">
<style>
			h2 {
    font-weight: normal;
}
</style>
<h2><div class="questionDetail">
					
						
						안녕하세요 네이버스토어 상세페이지에 페인트 색상 고를 수 있도록  <div><br></div>
<div>이런 html 삽입하려고 하는데 잘 안되네요..</div>
<div><br></div>
<div>https://behr.kr/sub/gallery/studio_iframe.asp</div>
<div><br></div>
<div>이 페이지를 넣으려면</div>
<div><br></div>
<div><br></div>
<div>html 적는 칸에</div>
<div><br></div>
<div><br></div>
<div>
<div>&lt;center&gt;&lt;iframe src="https://behr.kr/sub/gallery/studio_iframe.asp" width="850" height="1000" frameborder="0" marginwidth="0" marginheight="0" scrolling="no"&gt;</div>
<div>&lt;html lang="ko" class=" -webkit-"&gt;&lt;head&gt;</div>
<div>
<span style="white-space:pre;"></span>&lt;meta charset="UTF-8"&gt;</div>
<div>
<span style="white-space:pre;"></span>&lt;meta http-equiv="X-UA-Compatible" content="IE=edge"&gt;</div>
<div>
<span style="white-space:pre;"></span>&lt;meta name="format-detection" content="telephone=no"&gt;</div>
<div>
<span style="white-space:pre;"></span>&lt;meta name="viewport" content="user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, width=device-width"&gt;</div>
<div>
<span style="white-space:pre;"></span>&lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8"&gt;</div>
<div>
<span style="white-space:pre;"></span>&lt;meta http-equiv="Content-Script-Type" content="text/javascript"&gt;</div>
<div>
<span style="white-space:pre;"></span>&lt;meta http-equiv="Content-Style-Type" content="text/css"&gt;</div>
<div><br></div>
<div>
<span style="white-space:pre;"></span>&lt;style media="" data-href="https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700,900"&gt;/*# sourceURL=https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700,900 */</div>
<div>/*@ sourceURL=https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700,900 */</div>
<div>/* devanagari */</div>
<div>@font-face {</div>
<div>  font-family: 'Poppins';</div>
<div>  font-style: normal;</div>
<div>  font-weight: 300;</div>
<div>  src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLDz8Z11lFd2JQEl8qw.woff2) format('woff2');</div>
<div>  unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB;</div>
<div>}</div>
<div>/* latin-ext */</div>
<div>@font-face {</div>
<div>  font-family: 'Poppins';</div>
<div>  font-style: normal;</div>
<div>  font-weight: 300;</div>
<div>  src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLDz8Z1JlFd2JQEl8qw.woff2) format('woff2');</div>
<div>  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;</div>
<div>}</div>
<div>/* latin */</div>
<div>@font-face {</div>
<div>  font-family: 'Poppins';</div>
<div>  font-style: normal;</div>
<div>  font-weight: 300;</div>
<div>  src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLDz8Z1xlFd2JQEk.woff2) format('woff2');</div>
<div>  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;</div>
<div>}</div>
<div>/* devanagari */</div>
<div>@font-face {</div>
<div>  font-family: 'Poppins';</div>
<div>  font-style: normal;</div>
<div>  font-weight: 400;</div>
<div>  src: url(https://fonts.gstatic.com/s/poppins/v20/pxiEyp8kv8JHgFVrJJbecnFHGPezSQ.woff2) format('woff2');</div>
<div>  unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB;</div>
<div>}</div>
<div>/* latin-ext */</div>
<div>@font-face {</div>
<div>  font-family: 'Poppins';</div>
<div>  font-style: normal;</div>
<div>  font-weight: 400;</div>
<div>  src: url(https://fonts.gstatic.com/s/poppins/v20/pxiEyp8kv8JHgFVrJJnecnFHGPezSQ.woff2) format('woff2');</div>
<div>  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;</div>
<div>}</div>
<div>/* latin */</div>
<div>@font-face {</div>
<div>  font-family: 'Poppins';</div>
<div>  font-style: normal;</div>
<div>  font-weight: 400;</div>
<div>  src: url(https://fonts.gstatic.com/s/poppins/v20/pxiEyp8kv8JHgFVrJJfecnFHGPc.woff2) format('woff2');</div>
<div>  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;</div>
<div>}</div>
<div>/* devanagari */</div>
<div>@font-face {</div>
<div>  font-family: 'Poppins';</div>
<div>  font-style: normal;</div>
<div>  font-weight: 500;</div>
<div>  src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLGT9Z11lFd2JQEl8qw.woff2) format('woff2');</div>
<div>  unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB;</div>
<div>}</div>
<div>/* latin-ext */</div>
<div>@font-face {</div>
<div>  font-family: 'Poppins';</div>
<div>  font-style: normal;</div>
<div>  font-weight: 500;</div>
<div>  src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLGT9Z1JlFd2JQEl8qw.woff2) format('woff2');</div>
<div>  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;</div>
<div>}</div>
<div>/* latin */</div>
<div>@font-face {</div>
<div>  font-family: 'Poppins';</div>
<div>  font-style: normal;</div>
<div>  font-weight: 500;</div>
<div>  src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLGT9Z1xlFd2JQEk.woff2) format('woff2');</div>
<div>  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;</div>
<div>}</div>
<div>/* devanagari */</div>
<div>@font-face {</div>
<div>  font-family: 'Poppins';</div>
<div>  font-style: normal;</div>
<div>  font-weight: 600;</div>
<div>  src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLEj6Z11lFd2JQEl8qw.woff2) format('woff2');</div>
<div>  unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB;</div>
<div>}</div>
<div>/* latin-ext */</div>
<div>@font-face {</div>
<div>  font-family: 'Poppins';</div>
<div>  font-style: normal;</div>
<div>  font-weight: 600;</div>
<div>  src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLEj6Z1JlFd2JQEl8qw.woff2) format('woff2');</div>
<div>  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;</div>
<div>}</div>
<div>/* latin */</div>
<div>@font-face {</div>
<div>  font-family: 'Poppins';</div>
<div>  font-style: normal;</div>
<div>  font-weight: 600;</div>
<div>  src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLEj6Z1xlFd2JQEk.woff2) format('woff2');</div>
<div>  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;</div>
<div>}</div>
<div>/* devanagari */</div>
<div>@font-face {</div>
<div>  font-family: 'Poppins';</div>
<div>  font-style: normal;</div>
<div>  font-weight: 700;</div>
<div>  src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLCz7Z11lFd2JQEl8qw.woff2) format('woff2');</div>
<div>  unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB;</div>
<div>}</div>
<div>/* latin-ext */</div>
<div>@font-face {</div>
<div>  font-family: 'Poppins';</div>
<div>  font-style: normal;</div>
<div>  font-weight: 700;</div>
<div>  src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLCz7Z1JlFd2JQEl8qw.woff2) format('woff2');</div>
<div>  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;</div>
<div>}</div>
<div>/* latin */</div>
<div>@font-face {</div>
<div>  font-family: 'Poppins';</div>
<div>  font-style: normal;</div>
<div>  font-weight: 700;</div>
<div>  src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLCz7Z1xlFd2JQEk.woff2) format('woff2');</div>
<div>  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;</div>
<div>}</div>
<div>/* devanagari */</div>
<div>@font-face {</div>
<div>  font-family: 'Poppins';</div>
<div>  font-style: normal;</div>
<div>  font-weight: 900;</div>
<div>  src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLBT5Z11lFd2JQEl8qw.woff2) format('woff2');</div>
<div>  unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB;</div>
<div>}</div>
<div>/* latin-ext */</div>
<div>@font-face {</div>
<div>  font-family: 'Poppins';</div>
<div>  font-style: normal;</div>
<div>  font-weight: 900;</div>
<div>  src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLBT5Z1JlFd2JQEl8qw.woff2) format('woff2');</div>
<div>  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;</div>
<div>}</div>
<div>/* latin */</div>
<div>@font-face {</div>
<div>  font-family: 'Poppins';</div>
<div>  font-style: normal;</div>
<div>  font-weight: 900;</div>
<div>  src: url(https://fonts.gstatic.com/s/poppins/v20/pxiByp8kv8JHgFVrLBT5Z1xlFd2JQEk.woff2) format('woff2');</div>
<div>  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;</div>
<div>}</div>
<div>&lt;/style&gt;</div>
<div><br></div>
<div>
<span style="white-space:pre;"></span>&lt;style media="" data-href="/css/style.css"&gt;/*# sourceURL=/css/style.css */</div>
<div>/*@ sourceURL=/css/style.css */</div>
<div>@charset "utf-8";</div>
<div>@import url("https://behr.kr/css/base.css");</div>
<div>@import url("https://behr.kr/css/common.css");</div>
<div>@import url("https://behr.kr/css/main.css");</div>
<div>@import url("https://behr.kr/css/sub.css");</div>
<div>/* @import url("https://behr.kr/css/gallery.css"); */&lt;/style&gt;</div>
<div>
<span style="white-space:pre;"></span>&lt;style media="" data-href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css"&gt;/*# sourceURL=//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css */</div>
<div>/*@ sourceURL=//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css */</div>
<div>/*!</div>
<div> *  Font Awesome 4.1.0 by @davegandy - http://fontawesome.io - @fontawesome</div>
<div> *  License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)</div>
<div> */@font-face{font-family:'FontAwesome';src:url("https://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/../fonts/fontawesome-webfont.eot?v=4.1.0");src:url("https://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/../fonts/fontawesome-webfont.eot?#iefix&amp;v=4.1.0") format('embedded-opentype'),url("https://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/../fonts/fontawesome-webfont.woff?v=4.1.0") format('woff'),url("https://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/../fonts/fontawesome-webfont.ttf?v=4.1.0") format('truetype'),url("https://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/../fonts/fontawesome-webfont.svg?v=4.1.0#fontawesomeregular") format('svg');font-weight:normal;font-style:normal}.fa{display:inline-block;font-family:FontAwesome;font-style:normal;font-weight:normal;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.fa-lg{font-size:1.33333333em;line-height:.75em;vertical-align:-15%}.fa-2x{font-size:2em}.fa-3x{font-size:3em}.fa-4x{font-size:4em}.fa-5x{font-size:5em}.fa-fw{width:1.28571429em;text-align:center}.fa-ul{padding-left:0;margin-left:2.14285714em;list-style-type:none}.fa-ul&gt;li{position:relative}.fa-li{position:absolute;left:-2.14285714em;width:2.14285714em;top:.14285714em;text-align:center}.fa-li.fa-lg{left:-1.85714286em}.fa-border{padding:.2em .25em .15em;border:solid .08em #eee;border-radius:.1em}.pull-right{float:right}.pull-left{float:left}.fa.pull-left{margin-right:.3em}.fa.pull-right{margin-left:.3em}.fa-spin{-webkit-animation:spin 2s infinite linear;-moz-animation:spin 2s infinite linear;-o-animation:spin 2s infinite linear;animation:spin 2s infinite linear}@-moz-keyframes spin{0%{-moz-transform:rotate(0deg)}100%{-moz-transform:rotate(359deg)}}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg)}100%{-webkit-transform:rotate(359deg)}}@-o-keyframes spin{0%{-o-transform:rotate(0deg)}100%{-o-transform:rotate(359deg)}}@keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}.fa-rotate-90{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=1);-webkit-transform:rotate(90deg);-moz-transform:rotate(90deg);-ms-transform:rotate(90deg);-o-transform:rotate(90deg);transform:rotate(90deg)}.fa-rotate-180{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2);-webkit-transform:rotate(180deg);-moz-transform:rotate(180deg);-ms-transform:rotate(180deg);-o-transform:rotate(180deg);transform:rotate(180deg)}.fa-rotate-270{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);-webkit-transform:rotate(270deg);-moz-transform:rotate(270deg);-ms-transform:rotate(270deg);-o-transform:rotate(270deg);transform:rotate(270deg)}.fa-flip-horizontal{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1);-webkit-transform:scale(-1, 1);-moz-transform:scale(-1, 1);-ms-transform:scale(-1, 1);-o-transform:scale(-1, 1);transform:scale(-1, 1)}.fa-flip-vertical{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1);-webkit-transform:scale(1, -1);-moz-transform:scale(1, -1);-ms-transform:scale(1, -1);-o-transform:scale(1, -1);transform:scale(1, -1)}.fa-stack{position:relative;display:inline-block;width:2em;height:2em;line-height:2em;vertical-align:middle}.fa-stack-1x,.fa-stack-2x{position:absolute;left:0;width:100%;text-align:center}.fa-stack-1x{line-height:inherit}.fa-stack-2x{font-size:2em}.fa-inverse{color:#fff}.fa-glass:before{content:"\f000"}.fa-music:before{content:"\f001"}.fa-search:before{content:"\f002"}.fa-envelope-o:before{content:"\f003"}.fa-heart:before{content:"\f004"}.fa-star:before{content:"\f005"}.fa-star-o:before{content:"\f006"}.fa-user:before{content:"\f007"}.fa-film:before{content:"\f008"}.fa-th-large:before{content:"\f009"}.fa-th:before{content:"\f00a"}.fa-th-list:before{content:"\f00b"}.fa-check:before{content:"\f00c"}.fa-times:before{content:"\f00d"}.fa-search-plus:before{content:"\f00e"}.fa-search-minus:before{content:"\f010"}.fa-power-off:before{content:"\f011"}.fa-signal:before{content:"\f012"}.fa-gear:before,.fa-cog:before{content:"\f013"}.fa-trash-o:before{content:"\f014"}.fa-home:before{content:"\f015"}.fa-file-o:before{content:"\f016"}.fa-clock-o:before{content:"\f017"}.fa-road:before{content:"\f018"}.fa-download:before{content:"\f019"}.fa-arrow-circle-o-down:before{content:"\f01a"}.fa-arrow-circle-o-up:before{content:"\f01b"}.fa-inbox:before{content:"\f01c"}.fa-play-circle-o:before{content:"\f01d"}.fa-rotate-right:before,.fa-repeat:before{content:"\f01e"}.fa-refresh:before{content:"\f021"}.fa-list-alt:before{content:"\f022"}.fa-lock:before{content:"\f023"}.fa-flag:before{content:"\f024"}.fa-headphones:before{content:"\f025"}.fa-volume-off:before{content:"\f026"}.fa-volume-down:before{content:"\f027"}.fa-volume-up:before{content:"\f028"}.fa-qrcode:before{content:"\f029"}.fa-barcode:before{content:"\f02a"}.fa-tag:before{content:"\f02b"}.fa-tags:before{content:"\f02c"}.fa-book:before{content:"\f02d"}.fa-bookmark:before{content:"\f02e"}.fa-print:before{content:"\f02f"}.fa-camera:before{content:"\f030"}.fa-font:before{content:"\f031"}.fa-bold:before{content:"\f032"}.fa-italic:before{content:"\f033"}.fa-text-height:before{content:"\f034"}.fa-text-width:before{content:"\f035"}.fa-align-left:before{content:"\f036"}.fa-align-center:before{content:"\f037"}.fa-align-right:before{content:"\f038"}.fa-align-justify:before{content:"\f039"}.fa-list:before{content:"\f03a"}.fa-dedent:before,.fa-outdent:before{content:"\f03b"}.fa-indent:before{content:"\f03c"}.fa-video-camera:before{content:"\f03d"}.fa-photo:before,.fa-image:before,.fa-picture-o:before{content:"\f03e"}.fa-pencil:before{content:"\f040"}.fa-map-marker:before{content:"\f041"}.fa-adjust:before{content:"\f042"}.fa-tint:before{content:"\f043"}.fa-edit:before,.fa-pencil-square-o:before{content:"\f044"}.fa-share-square-o:before{content:"\f045"}.fa-check-square-o:before{content:"\f046"}.fa-arrows:before{content:"\f047"}.fa-step-backward:before{content:"\f048"}.fa-fast-backward:before{content:"\f049"}.fa-backward:before{content:"\f04a"}.fa-play:before{content:"\f04b"}.fa-pause:before{content:"\f04c"}.fa-stop:before{content:"\f04d"}.fa-forward:before{content:"\f04e"}.fa-fast-forward:before{content:"\f050"}.fa-step-forward:before{content:"\f051"}.fa-eject:before{content:"\f052"}.fa-chevron-left:before{content:"\f053"}.fa-chevron-right:before{content:"\f054"}.fa-plus-circle:before{content:"\f055"}.fa-minus-circle:before{content:"\f056"}.fa-times-circle:before{content:"\f057"}.fa-check-circle:before{content:"\f058"}.fa-question-circle:before{content:"\f059"}.fa-info-circle:before{content:"\f05a"}.fa-crosshairs:before{content:"\f05b"}.fa-times-circle-o:before{content:"\f05c"}.fa-check-circle-o:before{content:"\f05d"}.fa-ban:before{content:"\f05e"}.fa-arrow-left:before{content:"\f060"}.fa-arrow-right:before{content:"\f061"}.fa-arrow-up:before{content:"\f062"}.fa-arrow-down:before{content:"\f063"}.fa-mail-forward:before,.fa-share:before{content:"\f064"}.fa-expand:before{content:"\f065"}.fa-compress:before{content:"\f066"}.fa-plus:before{content:"\f067"}.fa-minus:before{content:"\f068"}.fa-asterisk:before{content:"\f069"}.fa-exclamation-circle:before{content:"\f06a"}.fa-gift:before{content:"\f06b"}.fa-leaf:before{content:"\f06c"}.fa-fire:before{content:"\f06d"}.fa-eye:before{content:"\f06e"}.fa-eye-slash:before{content:"\f070"}.fa-warning:before,.fa-exclamation-triangle:before{content:"\f071"}.fa-plane:before{content:"\f072"}.fa-calendar:before{content:"\f073"}.fa-random:before{content:"\f074"}.fa-comment:before{content:"\f075"}.fa-magnet:before{content:"\f076"}.fa-chevron-up:before{content:"\f077"}.fa-chevron-down:before{content:"\f078"}.fa-retweet:before{content:"\f079"}.fa-shopping-cart:before{content:"\f07a"}.fa-folder:before{content:"\f07b"}.fa-folder-open:before{content:"\f07c"}.fa-arrows-v:before{content:"\f07d"}.fa-arrows-h:before{content:"\f07e"}.fa-bar-chart-o:before{content:"\f080"}.fa-twitter-square:before{content:"\f081"}.fa-facebook-square:before{content:"\f082"}.fa-camera-retro:before{content:"\f083"}.fa-key:before{content:"\f084"}.fa-gears:before,.fa-cogs:before{content:"\f085"}.fa-comments:before{content:"\f086"}.fa-thumbs-o-up:before{content:"\f087"}.fa-thumbs-o-down:before{content:"\f088"}.fa-star-half:before{content:"\f089"}.fa-heart-o:before{content:"\f08a"}.fa-sign-out:before{content:"\f08b"}.fa-linkedin-square:before{content:"\f08c"}.fa-thumb-tack:before{content:"\f08d"}.fa-external-link:before{content:"\f08e"}.fa-sign-in:before{content:"\f090"}.fa-trophy:before{content:"\f091"}.fa-github-square:before{content:"\f092"}.fa-upload:before{content:"\f093"}.fa-lemon-o:before{content:"\f094"}.fa-phone:before{content:"\f095"}.fa-square-o:before{content:"\f096"}.fa-bookmark-o:before{content:"\f097"}.fa-phone-square:before{content:"\f098"}.fa-twitter:before{content:"\f099"}.fa-facebook:before{content:"\f09a"}.fa-github:before{content:"\f09b"}.fa-unlock:before{content:"\f09c"}.fa-credit-card:before{content:"\f09d"}.fa-rss:before{content:"\f09e"}.fa-hdd-o:before{content:"\f0a0"}.fa-bullhorn:before{content:"\f0a1"}.fa-bell:before{content:"\f0f3"}.fa-certificate:before{content:"\f0a3"}.fa-hand-o-right:before{content:"\f0a4"}.fa-hand-o-left:before{content:"\f0a5"}.fa-hand-o-up:before{content:"\f0a6"}.fa-hand-o-down:before{content:"\f0a7"}.fa-arrow-circle-left:before{content:"\f0a8"}.fa-arrow-circle-right:before{content:"\f0a9"}.fa-arrow-circle-up:before{content:"\f0aa"}.fa-arrow-circle-down:before{content:"\f0ab"}.fa-globe:before{content:"\f0ac"}.fa-wrench:before{content:"\f0ad"}.fa-tasks:before{content:"\f0ae"}.fa-filter:before{content:"\f0b0"}.fa-briefcase:before{content:"\f0b1"}.fa-arrows-alt:before{content:"\f0b2"}.fa-group:before,.fa-users:before{content:"\f0c0"}.fa-chain:before,.fa-link:before{content:"\f0c1"}.fa-cloud:before{content:"\f0c2"}.fa-flask:before{content:"\f0c3"}.fa-cut:before,.fa-scissors:before{content:"\f0c4"}.fa-copy:before,.fa-files-o:before{content:"\f0c5"}.fa-paperclip:before{content:"\f0c6"}.fa-save:before,.fa-floppy-o:before{content:"\f0c7"}.fa-square:before{content:"\f0c8"}.fa-navicon:before,.fa-reorder:before,.fa-bars:before{content:"\f0c9"}.fa-list-ul:before{content:"\f0ca"}.fa-list-ol:before{content:"\f0cb"}.fa-strikethrough:before{content:"\f0cc"}.fa-underline:before{content:"\f0cd"}.fa-table:before{content:"\f0ce"}.fa-magic:before{content:"\f0d0"}.fa-truck:before{content:"\f0d1"}.fa-pinterest:before{content:"\f0d2"}.fa-pinterest-square:before{content:"\f0d3"}.fa-google-plus-square:before{content:"\f0d4"}.fa-google-plus:before{content:"\f0d5"}.fa-money:before{content:"\f0d6"}.fa-caret-down:before{content:"\f0d7"}.fa-caret-up:before{content:"\f0d8"}.fa-caret-left:before{content:"\f0d9"}.fa-caret-right:before{content:"\f0da"}.fa-columns:before{content:"\f0db"}.fa-unsorted:before,.fa-sort:before{content:"\f0dc"}.fa-sort-down:before,.fa-sort-desc:before{content:"\f0dd"}.fa-sort-up:before,.fa-sort-asc:before{content:"\f0de"}.fa-envelope:before{content:"\f0e0"}.fa-linkedin:before{content:"\f0e1"}.fa-rotate-left:before,.fa-undo:before{content:"\f0e2"}.fa-legal:before,.fa-gavel:before{content:"\f0e3"}.fa-dashboard:before,.fa-tachometer:before{content:"\f0e4"}.fa-comment-o:before{content:"\f0e5"}.fa-comments-o:before{content:"\f0e6"}.fa-flash:before,.fa-bolt:before{content:"\f0e7"}.fa-sitemap:before{content:"\f0e8"}.fa-umbrella:before{content:"\f0e9"}.fa-paste:before,.fa-clipboard:before{content:"\f0ea"}.fa-lightbulb-o:before{content:"\f0eb"}.fa-exchange:before{content:"\f0ec"}.fa-cloud-download:before{content:"\f0ed"}.fa-cloud-upload:before{content:"\f0ee"}.fa-user-md:before{content:"\f0f0"}.fa-stethoscope:before{content:"\f0f1"}.fa-suitcase:before{content:"\f0f2"}.fa-bell-o:before{content:"\f0a2"}.fa-coffee:before{content:"\f0f4"}.fa-cutlery:before{content:"\f0f5"}.fa-file-text-o:before{content:"\f0f6"}.fa-building-o:before{content:"\f0f7"}.fa-hospital-o:before{content:"\f0f8"}.fa-ambulance:before{content:"\f0f9"}.fa-medkit:before{content:"\f0fa"}.fa-fighter-jet:before{content:"\f0fb"}.fa-beer:before{content:"\f0fc"}.fa-h-square:before{content:"\f0fd"}.fa-plus-square:before{content:"\f0fe"}.fa-angle-double-left:before{content:"\f100"}.fa-angle-double-right:before{content:"\f101"}.fa-angle-double-up:before{content:"\f102"}.fa-angle-double-down:before{content:"\f103"}.fa-angle-left:before{content:"\f104"}.fa-angle-right:before{content:"\f105"}.fa-angle-up:before{content:"\f106"}.fa-angle-down:before{content:"\f107"}.fa-desktop:before{content:"\f108"}.fa-laptop:before{content:"\f109"}.fa-tablet:before{content:"\f10a"}.fa-mobile-phone:before,.fa-mobile:before{content:"\f10b"}.fa-circle-o:before{content:"\f10c"}.fa-quote-left:before{content:"\f10d"}.fa-quote-right:before{content:"\f10e"}.fa-spinner:before{content:"\f110"}.fa-circle:before{content:"\f111"}.fa-mail-reply:before,.fa-reply:before{content:"\f112"}.fa-github-alt:before{content:"\f113"}.fa-folder-o:before{content:"\f114"}.fa-folder-open-o:before{content:"\f115"}.fa-smile-o:before{content:"\f118"}.fa-frown-o:before{content:"\f119"}.fa-meh-o:before{content:"\f11a"}.fa-gamepad:before{content:"\f11b"}.fa-keyboard-o:before{content:"\f11c"}.fa-flag-o:before{content:"\f11d"}.fa-flag-checkered:before{content:"\f11e"}.fa-terminal:before{content:"\f120"}.fa-code:before{content:"\f121"}.fa-mail-reply-all:before,.fa-reply-all:before{content:"\f122"}.fa-star-half-empty:before,.fa-star-half-full:before,.fa-star-half-o:before{content:"\f123"}.fa-location-arrow:before{content:"\f124"}.fa-crop:before{content:"\f125"}.fa-code-fork:before{content:"\f126"}.fa-unlink:before,.fa-chain-broken:before{content:"\f127"}.fa-question:before{content:"\f128"}.fa-info:before{content:"\f129"}.fa-exclamation:before{content:"\f12a"}.fa-superscript:before{content:"\f12b"}.fa-subscript:before{content:"\f12c"}.fa-eraser:before{content:"\f12d"}.fa-puzzle-piece:before{content:"\f12e"}.fa-microphone:before{content:"\f130"}.fa-microphone-slash:before{content:"\f131"}.fa-shield:before{content:"\f132"}.fa-calendar-o:before{content:"\f133"}.fa-fire-extinguisher:before{content:"\f134"}.fa-rocket:before{content:"\f135"}.fa-maxcdn:before{content:"\f136"}.fa-chevron-circle-left:before{content:"\f137"}.fa-chevron-circle-right:before{content:"\f138"}.fa-chevron-circle-up:before{content:"\f139"}.fa-chevron-circle-down:before{content:"\f13a"}.fa-html5:before{content:"\f13b"}.fa-css3:before{content:"\f13c"}.fa-anchor:before{content:"\f13d"}.fa-unlock-alt:before{content:"\f13e"}.fa-bullseye:before{content:"\f140"}.fa-ellipsis-h:before{content:"\f141"}.fa-ellipsis-v:before{content:"\f142"}.fa-rss-square:before{content:"\f143"}.fa-play-circle:before{content:"\f144"}.fa-ticket:before{content:"\f145"}.fa-minus-square:before{content:"\f146"}.fa-minus-square-o:before{content:"\f147"}.fa-level-up:before{content:"\f148"}.fa-level-down:before{content:"\f149"}.fa-check-square:before{content:"\f14a"}.fa-pencil-square:before{content:"\f14b"}.fa-external-link-square:before{content:"\f14c"}.fa-share-square:before{content:"\f14d"}.fa-compass:before{content:"\f14e"}.fa-toggle-down:before,.fa-caret-square-o-down:before{content:"\f150"}.fa-toggle-up:before,.fa-caret-square-o-up:before{content:"\f151"}.fa-toggle-right:before,.fa-caret-square-o-right:before{content:"\f152"}.fa-euro:before,.fa-eur:before{content:"\f153"}.fa-gbp:before{content:"\f154"}.fa-dollar:before,.fa-usd:before{content:"\f155"}.fa-rupee:before,.fa-inr:before{content:"\f156"}.fa-cny:before,.fa-rmb:before,.fa-yen:before,.fa-jpy:before{content:"\f157"}.fa-ruble:before,.fa-rouble:before,.fa-rub:before{content:"\f158"}.fa-won:before,.fa-krw:before{content:"\f159"}.fa-bitcoin:before,.fa-btc:before{content:"\f15a"}.fa-file:before{content:"\f15b"}.fa-file-text:before{content:"\f15c"}.fa-sort-alpha-asc:before{content:"\f15d"}.fa-sort-alpha-desc:before{content:"\f15e"}.fa-sort-amount-asc:before{content:"\f160"}.fa-sort-amount-desc:before{content:"\f161"}.fa-sort-numeric-asc:before{content:"\f162"}.fa-sort-numeric-desc:before{content:"\f163"}.fa-thumbs-up:before{content:"\f164"}.fa-thumbs-down:before{content:"\f165"}.fa-youtube-square:before{content:"\f166"}.fa-youtube:before{content:"\f167"}.fa-xing:before{content:"\f168"}.fa-xing-square:before{content:"\f169"}.fa-youtube-play:before{content:"\f16a"}.fa-dropbox:before{content:"\f16b"}.fa-stack-overflow:before{content:"\f16c"}.fa-instagram:before{content:"\f16d"}.fa-flickr:before{content:"\f16e"}.fa-adn:before{content:"\f170"}.fa-bitbucket:before{content:"\f171"}.fa-bitbucket-square:before{content:"\f172"}.fa-tumblr:before{content:"\f173"}.fa-tumblr-square:before{content:"\f174"}.fa-long-arrow-down:before{content:"\f175"}.fa-long-arrow-up:before{content:"\f176"}.fa-long-arrow-left:before{content:"\f177"}.fa-long-arrow-right:before{content:"\f178"}.fa-apple:before{content:"\f179"}.fa-windows:before{content:"\f17a"}.fa-android:before{content:"\f17b"}.fa-linux:before{content:"\f17c"}.fa-dribbble:before{content:"\f17d"}.fa-skype:before{content:"\f17e"}.fa-foursquare:before{content:"\f180"}.fa-trello:before{content:"\f181"}.fa-female:before{content:"\f182"}.fa-male:before{content:"\f183"}.fa-gittip:before{content:"\f184"}.fa-sun-o:before{content:"\f185"}.fa-moon-o:before{content:"\f186"}.fa-archive:before{content:"\f187"}.fa-bug:before{content:"\f188"}.fa-vk:before{content:"\f189"}.fa-weibo:before{content:"\f18a"}.fa-renren:before{content:"\f18b"}.fa-pagelines:before{content:"\f18c"}.fa-stack-exchange:before{content:"\f18d"}.fa-arrow-circle-o-right:before{content:"\f18e"}.fa-arrow-circle-o-left:before{content:"\f190"}.fa-toggle-left:before,.fa-caret-square-o-left:before{content:"\f191"}.fa-dot-circle-o:before{content:"\f192"}.fa-wheelchair:before{content:"\f193"}.fa-vimeo-square:before{content:"\f194"}.fa-turkish-lira:before,.fa-try:before{content:"\f195"}.fa-plus-square-o:before{content:"\f196"}.fa-space-shuttle:before{content:"\f197"}.fa-slack:before{content:"\f198"}.fa-envelope-square:before{content:"\f199"}.fa-wordpress:before{content:"\f19a"}.fa-openid:before{content:"\f19b"}.fa-institution:before,.fa-bank:before,.fa-university:before{content:"\f19c"}.fa-mortar-board:before,.fa-graduation-cap:before{content:"\f19d"}.fa-yahoo:before{content:"\f19e"}.fa-google:before{content:"\f1a0"}.fa-reddit:before{content:"\f1a1"}.fa-reddit-square:before{content:"\f1a2"}.fa-stumbleupon-circle:before{content:"\f1a3"}.fa-stumbleupon:before{content:"\f1a4"}.fa-delicious:before{content:"\f1a5"}.fa-digg:before{content:"\f1a6"}.fa-pied-piper-square:before,.fa-pied-piper:before{content:"\f1a7"}.fa-pied-piper-alt:before{content:"\f1a8"}.fa-drupal:before{content:"\f1a9"}.fa-joomla:before{content:"\f1aa"}.fa-language:before{content:"\f1ab"}.fa-fax:before{content:"\f1ac"}.fa-building:before{content:"\f1ad"}.fa-child:before{content:"\f1ae"}.fa-paw:before{content:"\f1b0"}.fa-spoon:before{content:"\f1b1"}.fa-cube:before{content:"\f1b2"}.fa-cubes:before{content:"\f1b3"}.fa-behance:before{content:"\f1b4"}.fa-behance-square:before{content:"\f1b5"}.fa-steam:before{content:"\f1b6"}.fa-steam-square:before{content:"\f1b7"}.fa-recycle:before{content:"\f1b8"}.fa-automobile:before,.fa-car:before{content:"\f1b9"}.fa-cab:before,.fa-taxi:before{content:"\f1ba"}.fa-tree:before{content:"\f1bb"}.fa-spotify:before{content:"\f1bc"}.fa-deviantart:before{content:"\f1bd"}.fa-soundcloud:before{content:"\f1be"}.fa-database:before{content:"\f1c0"}.fa-file-pdf-o:before{content:"\f1c1"}.fa-file-word-o:before{content:"\f1c2"}.fa-file-excel-o:before{content:"\f1c3"}.fa-file-powerpoint-o:before{content:"\f1c4"}.fa-file-photo-o:before,.fa-file-picture-o:before,.fa-file-image-o:before{content:"\f1c5"}.fa-file-zip-o:before,.fa-file-archive-o:before{content:"\f1c6"}.fa-file-sound-o:before,.fa-file-audio-o:before{content:"\f1c7"}.fa-file-movie-o:before,.fa-file-video-o:before{content:"\f1c8"}.fa-file-code-o:before{content:"\f1c9"}.fa-vine:before{content:"\f1ca"}.fa-codepen:before{content:"\f1cb"}.fa-jsfiddle:before{content:"\f1cc"}.fa-life-bouy:before,.fa-life-saver:before,.fa-support:before,.fa-life-ring:before{content:"\f1cd"}.fa-circle-o-notch:before{content:"\f1ce"}.fa-ra:before,.fa-rebel:before{content:"\f1d0"}.fa-ge:before,.fa-empire:before{content:"\f1d1"}.fa-git-square:before{content:"\f1d2"}.fa-git:before{content:"\f1d3"}.fa-hacker-news:before{content:"\f1d4"}.fa-tencent-weibo:before{content:"\f1d5"}.fa-qq:before{content:"\f1d6"}.fa-wechat:before,.fa-weixin:before{content:"\f1d7"}.fa-send:before,.fa-paper-plane:before{content:"\f1d8"}.fa-send-o:before,.fa-paper-plane-o:before{content:"\f1d9"}.fa-history:before{content:"\f1da"}.fa-circle-thin:before{content:"\f1db"}.fa-header:before{content:"\f1dc"}.fa-paragraph:before{content:"\f1dd"}.fa-sliders:before{content:"\f1de"}.fa-share-alt:before{content:"\f1e0"}.fa-share-alt-square:before{content:"\f1e1"}.fa-bomb:before{content:"\f1e2"}&lt;/style&gt;</div>
<div><br></div>
<div>
<span style="white-space:pre;"></span>&lt;script src="/js/jquery-1.8.3.min.js"&gt;&lt;/script&gt;</div>
<div>
<span style="white-space:pre;"></span>&lt;script src="/js/prefixfree.min.js"&gt;&lt;/script&gt;</div>
<div>
<span style="white-space:pre;"></span>&lt;script src="/js/common.js"&gt;&lt;/script&gt;</div>
<div>
<span style="white-space:pre;"></span>&lt;!--//스크롤--&gt;</div>
<div>
<span style="white-space:pre;"></span>&lt;script src="/js/scrollIt.js"&gt;&lt;/script&gt;</div>
<div><br></div>
<div>
<span style="white-space:pre;"></span>&lt;!--text animation--&gt;</div>
<div>
<span style="white-space:pre;"></span>&lt;script src="/js/jquery.fittext.js"&gt;&lt;/script&gt;</div>
<div>
<span style="white-space:pre;"></span>&lt;script src="/js/jquery.lettering.js"&gt;&lt;/script&gt;</div>
<div>
<span style="white-space:pre;"></span>&lt;script src="/js/jquery.textillate.js"&gt;&lt;/script&gt;</div>
<div>
<span style="white-space:pre;"></span>&lt;style media="" data-href="/css/text_animation.css"&gt;/*# sourceURL=/css/text_animation.css */</div>
<div>/*@ sourceURL=/css/text_animation.css */</div>
<div><br></div>
<div><br></div>
<div>@charset "UTF-8";</div>
<div>/*</div>
<div>Animate.css - http://daneden.me/animate</div>
<div>Licensed under the ☺ license (http://licence.visualidiot.com/)</div>
<div><br></div>
<div>Copyright (c) 2012 Dan Eden</div>
<div><br></div>
<div>Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:</div>
<div><br></div>
<div>The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.</div>
<div><br></div>
<div>THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.</div>
<div>*/</div>
<div>body { /* Addresses a small issue in webkit: http://bit.ly/NEdoDq */</div>
<div>
<span style="white-space:pre;"></span>-webkit-backface-visibility: hidden;</div>
<div>}</div>
<div>.animated {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-duration: 1s;</div>
<div>
<span style="white-space:pre;"></span>   -moz-animation-duration: 1s;</div>
<div>
<span style="white-space:pre;"></span>     -o-animation-duration: 1s;</div>
<div>
<span style="white-space:pre;"></span>        animation-duration: 1s;</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-fill-mode: both;</div>
<div>
<span style="white-space:pre;"></span>   -moz-animation-fill-mode: both;</div>
<div>
<span style="white-space:pre;"></span>     -o-animation-fill-mode: both;</div>
<div>
<span style="white-space:pre;"></span>        animation-fill-mode: both;</div>
<div>}</div>
<div><br></div>
<div>.animated.hinge {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-duration: 2s;</div>
<div>
<span style="white-space:pre;"></span>   -moz-animation-duration: 2s;</div>
<div>
<span style="white-space:pre;"></span>     -o-animation-duration: 2s;</div>
<div>
<span style="white-space:pre;"></span>        animation-duration: 2s;</div>
<div>}</div>
<div><br></div>
<div>@-webkit-keyframes flash {</div>
<div>
<span style="white-space:pre;"></span>0%, 50%, 100% {opacity: 1;} <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>25%, 75% {opacity: 0;}</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes flash {</div>
<div>
<span style="white-space:pre;"></span>0%, 50%, 100% {opacity: 1;} <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>25%, 75% {opacity: 0;}</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes flash {</div>
<div>
<span style="white-space:pre;"></span>0%, 50%, 100% {opacity: 1;} <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>25%, 75% {opacity: 0;}</div>
<div>}</div>
<div><br></div>
<div>@keyframes flash {</div>
<div>
<span style="white-space:pre;"></span>0%, 50%, 100% {opacity: 1;} <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>25%, 75% {opacity: 0;}</div>
<div>}</div>
<div><br></div>
<div>.flash {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: flash;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: flash;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: flash;</div>
<div>
<span style="white-space:pre;"></span>animation-name: flash;</div>
<div>}</div>
<div>@-webkit-keyframes shake {</div>
<div>
<span style="white-space:pre;"></span>0%, 100% {-webkit-transform: translateX(0);}</div>
<div>
<span style="white-space:pre;"></span>10%, 30%, 50%, 70%, 90% {-webkit-transform: translateX(-10px);}</div>
<div>
<span style="white-space:pre;"></span>20%, 40%, 60%, 80% {-webkit-transform: translateX(10px);}</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes shake {</div>
<div>
<span style="white-space:pre;"></span>0%, 100% {-moz-transform: translateX(0);}</div>
<div>
<span style="white-space:pre;"></span>10%, 30%, 50%, 70%, 90% {-moz-transform: translateX(-10px);}</div>
<div>
<span style="white-space:pre;"></span>20%, 40%, 60%, 80% {-moz-transform: translateX(10px);}</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes shake {</div>
<div>
<span style="white-space:pre;"></span>0%, 100% {-o-transform: translateX(0);}</div>
<div>
<span style="white-space:pre;"></span>10%, 30%, 50%, 70%, 90% {-o-transform: translateX(-10px);}</div>
<div>
<span style="white-space:pre;"></span>20%, 40%, 60%, 80% {-o-transform: translateX(10px);}</div>
<div>}</div>
<div><br></div>
<div>@keyframes shake {</div>
<div>
<span style="white-space:pre;"></span>0%, 100% {transform: translateX(0);}</div>
<div>
<span style="white-space:pre;"></span>10%, 30%, 50%, 70%, 90% {transform: translateX(-10px);}</div>
<div>
<span style="white-space:pre;"></span>20%, 40%, 60%, 80% {transform: translateX(10px);}</div>
<div>}</div>
<div><br></div>
<div>.shake {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: shake;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: shake;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: shake;</div>
<div>
<span style="white-space:pre;"></span>animation-name: shake;</div>
<div>}</div>
<div>@-webkit-keyframes bounce {</div>
<div>
<span style="white-space:pre;"></span>0%, 20%, 50%, 80%, 100% {-webkit-transform: translateY(0);}</div>
<div>
<span style="white-space:pre;"></span>40% {-webkit-transform: translateY(-30px);}</div>
<div>
<span style="white-space:pre;"></span>60% {-webkit-transform: translateY(-15px);}</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes bounce {</div>
<div>
<span style="white-space:pre;"></span>0%, 20%, 50%, 80%, 100% {-moz-transform: translateY(0);}</div>
<div>
<span style="white-space:pre;"></span>40% {-moz-transform: translateY(-30px);}</div>
<div>
<span style="white-space:pre;"></span>60% {-moz-transform: translateY(-15px);}</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes bounce {</div>
<div>
<span style="white-space:pre;"></span>0%, 20%, 50%, 80%, 100% {-o-transform: translateY(0);}</div>
<div>
<span style="white-space:pre;"></span>40% {-o-transform: translateY(-30px);}</div>
<div>
<span style="white-space:pre;"></span>60% {-o-transform: translateY(-15px);}</div>
<div>}</div>
<div>@keyframes bounce {</div>
<div>
<span style="white-space:pre;"></span>0%, 20%, 50%, 80%, 100% {transform: translateY(0);}</div>
<div>
<span style="white-space:pre;"></span>40% {transform: translateY(-30px);}</div>
<div>
<span style="white-space:pre;"></span>60% {transform: translateY(-15px);}</div>
<div>}</div>
<div><br></div>
<div>.bounce {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: bounce;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: bounce;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: bounce;</div>
<div>
<span style="white-space:pre;"></span>animation-name: bounce;</div>
<div>}</div>
<div>@-webkit-keyframes tada {</div>
<div>
<span style="white-space:pre;"></span>0% {-webkit-transform: scale(1);} <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>10%, 20% {-webkit-transform: scale(0.9) rotate(-3deg);}</div>
<div>
<span style="white-space:pre;"></span>30%, 50%, 70%, 90% {-webkit-transform: scale(1.1) rotate(3deg);}</div>
<div>
<span style="white-space:pre;"></span>40%, 60%, 80% {-webkit-transform: scale(1.1) rotate(-3deg);}</div>
<div>
<span style="white-space:pre;"></span>100% {-webkit-transform: scale(1) rotate(0);}</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes tada {</div>
<div>
<span style="white-space:pre;"></span>0% {-moz-transform: scale(1);} <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>10%, 20% {-moz-transform: scale(0.9) rotate(-3deg);}</div>
<div>
<span style="white-space:pre;"></span>30%, 50%, 70%, 90% {-moz-transform: scale(1.1) rotate(3deg);}</div>
<div>
<span style="white-space:pre;"></span>40%, 60%, 80% {-moz-transform: scale(1.1) rotate(-3deg);}</div>
<div>
<span style="white-space:pre;"></span>100% {-moz-transform: scale(1) rotate(0);}</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes tada {</div>
<div>
<span style="white-space:pre;"></span>0% {-o-transform: scale(1);} <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>10%, 20% {-o-transform: scale(0.9) rotate(-3deg);}</div>
<div>
<span style="white-space:pre;"></span>30%, 50%, 70%, 90% {-o-transform: scale(1.1) rotate(3deg);}</div>
<div>
<span style="white-space:pre;"></span>40%, 60%, 80% {-o-transform: scale(1.1) rotate(-3deg);}</div>
<div>
<span style="white-space:pre;"></span>100% {-o-transform: scale(1) rotate(0);}</div>
<div>}</div>
<div><br></div>
<div>@keyframes tada {</div>
<div>
<span style="white-space:pre;"></span>0% {transform: scale(1);} <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>10%, 20% {transform: scale(0.9) rotate(-3deg);}</div>
<div>
<span style="white-space:pre;"></span>30%, 50%, 70%, 90% {transform: scale(1.1) rotate(3deg);}</div>
<div>
<span style="white-space:pre;"></span>40%, 60%, 80% {transform: scale(1.1) rotate(-3deg);}</div>
<div>
<span style="white-space:pre;"></span>100% {transform: scale(1) rotate(0);}</div>
<div>}</div>
<div><br></div>
<div>.tada {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: tada;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: tada;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: tada;</div>
<div>
<span style="white-space:pre;"></span>animation-name: tada;</div>
<div>}</div>
<div>@-webkit-keyframes swing {</div>
<div>
<span style="white-space:pre;"></span>20%, 40%, 60%, 80%, 100% { -webkit-transform-origin: top center; }</div>
<div>
<span style="white-space:pre;"></span>20% { -webkit-transform: rotate(15deg); } <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>40% { -webkit-transform: rotate(-10deg); }</div>
<div>
<span style="white-space:pre;"></span>60% { -webkit-transform: rotate(5deg); } <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>80% { -webkit-transform: rotate(-5deg); } <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>100% { -webkit-transform: rotate(0deg); }</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes swing {</div>
<div>
<span style="white-space:pre;"></span>20% { -moz-transform: rotate(15deg); } <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>40% { -moz-transform: rotate(-10deg); }</div>
<div>
<span style="white-space:pre;"></span>60% { -moz-transform: rotate(5deg); } <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>80% { -moz-transform: rotate(-5deg); } <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>100% { -moz-transform: rotate(0deg); }</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes swing {</div>
<div>
<span style="white-space:pre;"></span>20% { -o-transform: rotate(15deg); } <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>40% { -o-transform: rotate(-10deg); }</div>
<div>
<span style="white-space:pre;"></span>60% { -o-transform: rotate(5deg); } <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>80% { -o-transform: rotate(-5deg); } <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>100% { -o-transform: rotate(0deg); }</div>
<div>}</div>
<div><br></div>
<div>@keyframes swing {</div>
<div>
<span style="white-space:pre;"></span>20% { transform: rotate(15deg); } <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>40% { transform: rotate(-10deg); }</div>
<div>
<span style="white-space:pre;"></span>60% { transform: rotate(5deg); } <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>80% { transform: rotate(-5deg); } <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>100% { transform: rotate(0deg); }</div>
<div>}</div>
<div><br></div>
<div>.swing {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform-origin: top center;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform-origin: top center;</div>
<div>
<span style="white-space:pre;"></span>-o-transform-origin: top center;</div>
<div>
<span style="white-space:pre;"></span>transform-origin: top center;</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: swing;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: swing;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: swing;</div>
<div>
<span style="white-space:pre;"></span>animation-name: swing;</div>
<div>}</div>
<div>/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */</div>
<div><br></div>
<div>@-webkit-keyframes wobble {</div>
<div>  0% { -webkit-transform: translateX(0%); }</div>
<div>  15% { -webkit-transform: translateX(-25%) rotate(-5deg); }</div>
<div>  30% { -webkit-transform: translateX(20%) rotate(3deg); }</div>
<div>  45% { -webkit-transform: translateX(-15%) rotate(-3deg); }</div>
<div>  60% { -webkit-transform: translateX(10%) rotate(2deg); }</div>
<div>  75% { -webkit-transform: translateX(-5%) rotate(-1deg); }</div>
<div>  100% { -webkit-transform: translateX(0%); }</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes wobble {</div>
<div>  0% { -moz-transform: translateX(0%); }</div>
<div>  15% { -moz-transform: translateX(-25%) rotate(-5deg); }</div>
<div>  30% { -moz-transform: translateX(20%) rotate(3deg); }</div>
<div>  45% { -moz-transform: translateX(-15%) rotate(-3deg); }</div>
<div>  60% { -moz-transform: translateX(10%) rotate(2deg); }</div>
<div>  75% { -moz-transform: translateX(-5%) rotate(-1deg); }</div>
<div>  100% { -moz-transform: translateX(0%); }</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes wobble {</div>
<div>  0% { -o-transform: translateX(0%); }</div>
<div>  15% { -o-transform: translateX(-25%) rotate(-5deg); }</div>
<div>  30% { -o-transform: translateX(20%) rotate(3deg); }</div>
<div>  45% { -o-transform: translateX(-15%) rotate(-3deg); }</div>
<div>  60% { -o-transform: translateX(10%) rotate(2deg); }</div>
<div>  75% { -o-transform: translateX(-5%) rotate(-1deg); }</div>
<div>  100% { -o-transform: translateX(0%); }</div>
<div>}</div>
<div><br></div>
<div>@keyframes wobble {</div>
<div>  0% { transform: translateX(0%); }</div>
<div>  15% { transform: translateX(-25%) rotate(-5deg); }</div>
<div>  30% { transform: translateX(20%) rotate(3deg); }</div>
<div>  45% { transform: translateX(-15%) rotate(-3deg); }</div>
<div>  60% { transform: translateX(10%) rotate(2deg); }</div>
<div>  75% { transform: translateX(-5%) rotate(-1deg); }</div>
<div>  100% { transform: translateX(0%); }</div>
<div>}</div>
<div><br></div>
<div>.wobble {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: wobble;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: wobble;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: wobble;</div>
<div>
<span style="white-space:pre;"></span>animation-name: wobble;</div>
<div>}</div>
<div>/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */</div>
<div><br></div>
<div>@-webkit-keyframes pulse {</div>
<div>    0% { -webkit-transform: scale(1); } <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>50% { -webkit-transform: scale(1.1); }</div>
<div>    100% { -webkit-transform: scale(1); }</div>
<div>}</div>
<div>@-moz-keyframes pulse {</div>
<div>    0% { -moz-transform: scale(1); } <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>50% { -moz-transform: scale(1.1); }</div>
<div>    100% { -moz-transform: scale(1); }</div>
<div>}</div>
<div>@-o-keyframes pulse {</div>
<div>    0% { -o-transform: scale(1); } <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>50% { -o-transform: scale(1.1); }</div>
<div>    100% { -o-transform: scale(1); }</div>
<div>}</div>
<div>@keyframes pulse {</div>
<div>    0% { transform: scale(1); } <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>50% { transform: scale(1.1); }</div>
<div>    100% { transform: scale(1); }</div>
<div>}</div>
<div><br></div>
<div>.pulse {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: pulse;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: pulse;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: pulse;</div>
<div>
<span style="white-space:pre;"></span>animation-name: pulse;</div>
<div>}</div>
<div>@-webkit-keyframes flip {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: perspective(400px) rotateY(0);</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-timing-function: ease-out;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>
<span style="white-space:pre;"></span>40% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg);</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-timing-function: ease-out;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>
<span style="white-space:pre;"></span>50% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-timing-function: ease-in;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>
<span style="white-space:pre;"></span>80% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: perspective(400px) rotateY(360deg) scale(.95);</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-timing-function: ease-in;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: perspective(400px) scale(1);</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-timing-function: ease-in;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div>@-moz-keyframes flip {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: perspective(400px) rotateY(0);</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-timing-function: ease-out;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>
<span style="white-space:pre;"></span>40% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: perspective(400px) translateZ(150px) rotateY(170deg);</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-timing-function: ease-out;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>
<span style="white-space:pre;"></span>50% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-timing-function: ease-in;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>
<span style="white-space:pre;"></span>80% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: perspective(400px) rotateY(360deg) scale(.95);</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-timing-function: ease-in;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: perspective(400px) scale(1);</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-timing-function: ease-in;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div>@-o-keyframes flip {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform: perspective(400px) rotateY(0);</div>
<div>
<span style="white-space:pre;"></span>-o-animation-timing-function: ease-out;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>
<span style="white-space:pre;"></span>40% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform: perspective(400px) translateZ(150px) rotateY(170deg);</div>
<div>
<span style="white-space:pre;"></span>-o-animation-timing-function: ease-out;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>
<span style="white-space:pre;"></span>50% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);</div>
<div>
<span style="white-space:pre;"></span>-o-animation-timing-function: ease-in;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>
<span style="white-space:pre;"></span>80% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform: perspective(400px) rotateY(360deg) scale(.95);</div>
<div>
<span style="white-space:pre;"></span>-o-animation-timing-function: ease-in;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform: perspective(400px) scale(1);</div>
<div>
<span style="white-space:pre;"></span>-o-animation-timing-function: ease-in;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div>@keyframes flip {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>transform: perspective(400px) rotateY(0);</div>
<div>
<span style="white-space:pre;"></span>animation-timing-function: ease-out;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>
<span style="white-space:pre;"></span>40% {</div>
<div>
<span style="white-space:pre;"></span>transform: perspective(400px) translateZ(150px) rotateY(170deg);</div>
<div>
<span style="white-space:pre;"></span>animation-timing-function: ease-out;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>
<span style="white-space:pre;"></span>50% {</div>
<div>
<span style="white-space:pre;"></span>transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);</div>
<div>
<span style="white-space:pre;"></span>animation-timing-function: ease-in;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>
<span style="white-space:pre;"></span>80% {</div>
<div>
<span style="white-space:pre;"></span>transform: perspective(400px) rotateY(360deg) scale(.95);</div>
<div>
<span style="white-space:pre;"></span>animation-timing-function: ease-in;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>transform: perspective(400px) scale(1);</div>
<div>
<span style="white-space:pre;"></span>animation-timing-function: ease-in;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>.flip {</div>
<div>
<span style="white-space:pre;"></span>-webkit-backface-visibility: visible !important;</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: flip;</div>
<div>
<span style="white-space:pre;"></span>-moz-backface-visibility: visible !important;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: flip;</div>
<div>
<span style="white-space:pre;"></span>-o-backface-visibility: visible !important;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: flip;</div>
<div>
<span style="white-space:pre;"></span>backface-visibility: visible !important;</div>
<div>
<span style="white-space:pre;"></span>animation-name: flip;</div>
<div>}</div>
<div>@-webkit-keyframes flipInX {</div>
<div>    0% {</div>
<div>        -webkit-transform: perspective(400px) rotateX(90deg);</div>
<div>        opacity: 0;</div>
<div>    }</div>
<div>    </div>
<div>    40% {</div>
<div>        -webkit-transform: perspective(400px) rotateX(-10deg);</div>
<div>    }</div>
<div>    </div>
<div>    70% {</div>
<div>        -webkit-transform: perspective(400px) rotateX(10deg);</div>
<div>    }</div>
<div>    </div>
<div>    100% {</div>
<div>        -webkit-transform: perspective(400px) rotateX(0deg);</div>
<div>        opacity: 1;</div>
<div>    }</div>
<div>}</div>
<div>@-moz-keyframes flipInX {</div>
<div>    0% {</div>
<div>        -moz-transform: perspective(400px) rotateX(90deg);</div>
<div>        opacity: 0;</div>
<div>    }</div>
<div>    </div>
<div>    40% {</div>
<div>        -moz-transform: perspective(400px) rotateX(-10deg);</div>
<div>    }</div>
<div>    </div>
<div>    70% {</div>
<div>        -moz-transform: perspective(400px) rotateX(10deg);</div>
<div>    }</div>
<div>    </div>
<div>    100% {</div>
<div>        -moz-transform: perspective(400px) rotateX(0deg);</div>
<div>        opacity: 1;</div>
<div>    }</div>
<div>}</div>
<div>@-o-keyframes flipInX {</div>
<div>    0% {</div>
<div>        -o-transform: perspective(400px) rotateX(90deg);</div>
<div>        opacity: 0;</div>
<div>    }</div>
<div>    </div>
<div>    40% {</div>
<div>        -o-transform: perspective(400px) rotateX(-10deg);</div>
<div>    }</div>
<div>    </div>
<div>    70% {</div>
<div>        -o-transform: perspective(400px) rotateX(10deg);</div>
<div>    }</div>
<div>    </div>
<div>    100% {</div>
<div>        -o-transform: perspective(400px) rotateX(0deg);</div>
<div>        opacity: 1;</div>
<div>    }</div>
<div>}</div>
<div>@keyframes flipInX {</div>
<div>    0% {</div>
<div>        transform: perspective(400px) rotateX(90deg);</div>
<div>        opacity: 0;</div>
<div>    }</div>
<div>    </div>
<div>    40% {</div>
<div>        transform: perspective(400px) rotateX(-10deg);</div>
<div>    }</div>
<div>    </div>
<div>    70% {</div>
<div>        transform: perspective(400px) rotateX(10deg);</div>
<div>    }</div>
<div>    </div>
<div>    100% {</div>
<div>        transform: perspective(400px) rotateX(0deg);</div>
<div>        opacity: 1;</div>
<div>    }</div>
<div>}</div>
<div><br></div>
<div>.flipInX {</div>
<div>
<span style="white-space:pre;"></span>-webkit-backface-visibility: visible !important;</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: flipInX;</div>
<div>
<span style="white-space:pre;"></span>-moz-backface-visibility: visible !important;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: flipInX;</div>
<div>
<span style="white-space:pre;"></span>-o-backface-visibility: visible !important;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: flipInX;</div>
<div>
<span style="white-space:pre;"></span>backface-visibility: visible !important;</div>
<div>
<span style="white-space:pre;"></span>animation-name: flipInX;</div>
<div>}</div>
<div>@-webkit-keyframes flipOutX {</div>
<div>    0% {</div>
<div>        -webkit-transform: perspective(400px) rotateX(0deg);</div>
<div>        opacity: 1;</div>
<div>    }</div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>        -webkit-transform: perspective(400px) rotateX(90deg);</div>
<div>        opacity: 0;</div>
<div>    }</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes flipOutX {</div>
<div>    0% {</div>
<div>        -moz-transform: perspective(400px) rotateX(0deg);</div>
<div>        opacity: 1;</div>
<div>    }</div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>        -moz-transform: perspective(400px) rotateX(90deg);</div>
<div>        opacity: 0;</div>
<div>    }</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes flipOutX {</div>
<div>    0% {</div>
<div>        -o-transform: perspective(400px) rotateX(0deg);</div>
<div>        opacity: 1;</div>
<div>    }</div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>        -o-transform: perspective(400px) rotateX(90deg);</div>
<div>        opacity: 0;</div>
<div>    }</div>
<div>}</div>
<div><br></div>
<div>@keyframes flipOutX {</div>
<div>    0% {</div>
<div>        transform: perspective(400px) rotateX(0deg);</div>
<div>        opacity: 1;</div>
<div>    }</div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>        transform: perspective(400px) rotateX(90deg);</div>
<div>        opacity: 0;</div>
<div>    }</div>
<div>}</div>
<div><br></div>
<div>.flipOutX {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: flipOutX;</div>
<div>
<span style="white-space:pre;"></span>-webkit-backface-visibility: visible !important;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: flipOutX;</div>
<div>
<span style="white-space:pre;"></span>-moz-backface-visibility: visible !important;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: flipOutX;</div>
<div>
<span style="white-space:pre;"></span>-o-backface-visibility: visible !important;</div>
<div>
<span style="white-space:pre;"></span>animation-name: flipOutX;</div>
<div>
<span style="white-space:pre;"></span>backface-visibility: visible !important;</div>
<div>}</div>
<div>@-webkit-keyframes flipInY {</div>
<div>    0% {</div>
<div>        -webkit-transform: perspective(400px) rotateY(90deg);</div>
<div>        opacity: 0;</div>
<div>    }</div>
<div>    </div>
<div>    40% {</div>
<div>        -webkit-transform: perspective(400px) rotateY(-10deg);</div>
<div>    }</div>
<div>    </div>
<div>    70% {</div>
<div>        -webkit-transform: perspective(400px) rotateY(10deg);</div>
<div>    }</div>
<div>    </div>
<div>    100% {</div>
<div>        -webkit-transform: perspective(400px) rotateY(0deg);</div>
<div>        opacity: 1;</div>
<div>    }</div>
<div>}</div>
<div>@-moz-keyframes flipInY {</div>
<div>    0% {</div>
<div>        -moz-transform: perspective(400px) rotateY(90deg);</div>
<div>        opacity: 0;</div>
<div>    }</div>
<div>    </div>
<div>    40% {</div>
<div>        -moz-transform: perspective(400px) rotateY(-10deg);</div>
<div>    }</div>
<div>    </div>
<div>    70% {</div>
<div>        -moz-transform: perspective(400px) rotateY(10deg);</div>
<div>    }</div>
<div>    </div>
<div>    100% {</div>
<div>        -moz-transform: perspective(400px) rotateY(0deg);</div>
<div>        opacity: 1;</div>
<div>    }</div>
<div>}</div>
<div>@-o-keyframes flipInY {</div>
<div>    0% {</div>
<div>        -o-transform: perspective(400px) rotateY(90deg);</div>
<div>        opacity: 0;</div>
<div>    }</div>
<div>    </div>
<div>    40% {</div>
<div>        -o-transform: perspective(400px) rotateY(-10deg);</div>
<div>    }</div>
<div>    </div>
<div>    70% {</div>
<div>        -o-transform: perspective(400px) rotateY(10deg);</div>
<div>    }</div>
<div>    </div>
<div>    100% {</div>
<div>        -o-transform: perspective(400px) rotateY(0deg);</div>
<div>        opacity: 1;</div>
<div>    }</div>
<div>}</div>
<div>@keyframes flipInY {</div>
<div>    0% {</div>
<div>        transform: perspective(400px) rotateY(90deg);</div>
<div>        opacity: 0;</div>
<div>    }</div>
<div>    </div>
<div>    40% {</div>
<div>        transform: perspective(400px) rotateY(-10deg);</div>
<div>    }</div>
<div>    </div>
<div>    70% {</div>
<div>        transform: perspective(400px) rotateY(10deg);</div>
<div>    }</div>
<div>    </div>
<div>    100% {</div>
<div>        transform: perspective(400px) rotateY(0deg);</div>
<div>        opacity: 1;</div>
<div>    }</div>
<div>}</div>
<div><br></div>
<div>.flipInY {</div>
<div>
<span style="white-space:pre;"></span>-webkit-backface-visibility: visible !important;</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: flipInY;</div>
<div>
<span style="white-space:pre;"></span>-moz-backface-visibility: visible !important;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: flipInY;</div>
<div>
<span style="white-space:pre;"></span>-o-backface-visibility: visible !important;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: flipInY;</div>
<div>
<span style="white-space:pre;"></span>backface-visibility: visible !important;</div>
<div>
<span style="white-space:pre;"></span>animation-name: flipInY;</div>
<div>}</div>
<div>@-webkit-keyframes flipOutY {</div>
<div>    0% {</div>
<div>        -webkit-transform: perspective(400px) rotateY(0deg);</div>
<div>        opacity: 1;</div>
<div>    }</div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>        -webkit-transform: perspective(400px) rotateY(90deg);</div>
<div>        opacity: 0;</div>
<div>    }</div>
<div>}</div>
<div>@-moz-keyframes flipOutY {</div>
<div>    0% {</div>
<div>        -moz-transform: perspective(400px) rotateY(0deg);</div>
<div>        opacity: 1;</div>
<div>    }</div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>        -moz-transform: perspective(400px) rotateY(90deg);</div>
<div>        opacity: 0;</div>
<div>    }</div>
<div>}</div>
<div>@-o-keyframes flipOutY {</div>
<div>    0% {</div>
<div>        -o-transform: perspective(400px) rotateY(0deg);</div>
<div>        opacity: 1;</div>
<div>    }</div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>        -o-transform: perspective(400px) rotateY(90deg);</div>
<div>        opacity: 0;</div>
<div>    }</div>
<div>}</div>
<div>@keyframes flipOutY {</div>
<div>    0% {</div>
<div>        transform: perspective(400px) rotateY(0deg);</div>
<div>        opacity: 1;</div>
<div>    }</div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>        transform: perspective(400px) rotateY(90deg);</div>
<div>        opacity: 0;</div>
<div>    }</div>
<div>}</div>
<div><br></div>
<div>.flipOutY {</div>
<div>
<span style="white-space:pre;"></span>-webkit-backface-visibility: visible !important;</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: flipOutY;</div>
<div>
<span style="white-space:pre;"></span>-moz-backface-visibility: visible !important;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: flipOutY;</div>
<div>
<span style="white-space:pre;"></span>-o-backface-visibility: visible !important;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: flipOutY;</div>
<div>
<span style="white-space:pre;"></span>backface-visibility: visible !important;</div>
<div>
<span style="white-space:pre;"></span>animation-name: flipOutY;</div>
<div>}</div>
<div>@-webkit-keyframes fadeIn {</div>
<div>
<span style="white-space:pre;"></span>0% {opacity: 0;} <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>100% {opacity: 1;}</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes fadeIn {</div>
<div>
<span style="white-space:pre;"></span>0% {opacity: 0;} <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>100% {opacity: 1;}</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes fadeIn {</div>
<div>
<span style="white-space:pre;"></span>0% {opacity: 0;} <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>100% {opacity: 1;}</div>
<div>}</div>
<div><br></div>
<div>@keyframes fadeIn {</div>
<div>
<span style="white-space:pre;"></span>0% {opacity: 0;} <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>100% {opacity: 1;}</div>
<div>}</div>
<div><br></div>
<div>.fadeIn {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: fadeIn;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: fadeIn;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: fadeIn;</div>
<div>
<span style="white-space:pre;"></span>animation-name: fadeIn;</div>
<div>}</div>
<div>@-webkit-keyframes fadeInUp {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateY(20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes fadeInUp {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateY(20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes fadeInUp {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateY(20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@keyframes fadeInUp {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>transform: translateY(20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>.fadeInUp {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: fadeInUp;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: fadeInUp;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: fadeInUp;</div>
<div>
<span style="white-space:pre;"></span>animation-name: fadeInUp;</div>
<div>}</div>
<div>@-webkit-keyframes fadeInDown {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateY(-20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes fadeInDown {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateY(-20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes fadeInDown {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateY(-20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@keyframes fadeInDown {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>transform: translateY(-20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>.fadeInDown {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: fadeInDown;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: fadeInDown;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: fadeInDown;</div>
<div>
<span style="white-space:pre;"></span>animation-name: fadeInDown;</div>
<div>}</div>
<div>@-webkit-keyframes fadeInLeft {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateX(-20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes fadeInLeft {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateX(-20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes fadeInLeft {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateX(-20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@keyframes fadeInLeft {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>transform: translateX(-20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>.fadeInLeft {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: fadeInLeft;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: fadeInLeft;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: fadeInLeft;</div>
<div>
<span style="white-space:pre;"></span>animation-name: fadeInLeft;</div>
<div>}</div>
<div>@-webkit-keyframes fadeInRight {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateX(20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes fadeInRight {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateX(20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes fadeInRight {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateX(20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@keyframes fadeInRight {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>transform: translateX(20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>.fadeInRight {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: fadeInRight;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: fadeInRight;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: fadeInRight;</div>
<div>
<span style="white-space:pre;"></span>animation-name: fadeInRight;</div>
<div>}</div>
<div>@-webkit-keyframes fadeInUpBig {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateY(2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes fadeInUpBig {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateY(2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes fadeInUpBig {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateY(2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@keyframes fadeInUpBig {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>transform: translateY(2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>.fadeInUpBig {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: fadeInUpBig;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: fadeInUpBig;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: fadeInUpBig;</div>
<div>
<span style="white-space:pre;"></span>animation-name: fadeInUpBig;</div>
<div>}</div>
<div>@-webkit-keyframes fadeInDownBig {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateY(-2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes fadeInDownBig {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateY(-2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes fadeInDownBig {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateY(-2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@keyframes fadeInDownBig {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>transform: translateY(-2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>.fadeInDownBig {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: fadeInDownBig;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: fadeInDownBig;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: fadeInDownBig;</div>
<div>
<span style="white-space:pre;"></span>animation-name: fadeInDownBig;</div>
<div>}</div>
<div>@-webkit-keyframes fadeInLeftBig {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateX(-2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div>@-moz-keyframes fadeInLeftBig {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateX(-2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div>@-o-keyframes fadeInLeftBig {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateX(-2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div>@keyframes fadeInLeftBig {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>transform: translateX(-2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>.fadeInLeftBig {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: fadeInLeftBig;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: fadeInLeftBig;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: fadeInLeftBig;</div>
<div>
<span style="white-space:pre;"></span>animation-name: fadeInLeftBig;</div>
<div>}</div>
<div>@-webkit-keyframes fadeInRightBig {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateX(2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes fadeInRightBig {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateX(2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes fadeInRightBig {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateX(2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@keyframes fadeInRightBig {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>transform: translateX(2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>.fadeInRightBig {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: fadeInRightBig;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: fadeInRightBig;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: fadeInRightBig;</div>
<div>
<span style="white-space:pre;"></span>animation-name: fadeInRightBig;</div>
<div>}</div>
<div>@-webkit-keyframes fadeOut {</div>
<div>
<span style="white-space:pre;"></span>0% {opacity: 1;}</div>
<div>
<span style="white-space:pre;"></span>100% {opacity: 0;}</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes fadeOut {</div>
<div>
<span style="white-space:pre;"></span>0% {opacity: 1;}</div>
<div>
<span style="white-space:pre;"></span>100% {opacity: 0;}</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes fadeOut {</div>
<div>
<span style="white-space:pre;"></span>0% {opacity: 1;}</div>
<div>
<span style="white-space:pre;"></span>100% {opacity: 0;}</div>
<div>}</div>
<div><br></div>
<div>@keyframes fadeOut {</div>
<div>
<span style="white-space:pre;"></span>0% {opacity: 1;}</div>
<div>
<span style="white-space:pre;"></span>100% {opacity: 0;}</div>
<div>}</div>
<div><br></div>
<div>.fadeOut {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: fadeOut;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: fadeOut;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: fadeOut;</div>
<div>
<span style="white-space:pre;"></span>animation-name: fadeOut;</div>
<div>}</div>
<div>@-webkit-keyframes fadeOutUp {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateY(-20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div>@-moz-keyframes fadeOutUp {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateY(-20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div>@-o-keyframes fadeOutUp {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateY(-20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div>@keyframes fadeOutUp {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>transform: translateY(-20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>.fadeOutUp {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: fadeOutUp;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: fadeOutUp;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: fadeOutUp;</div>
<div>
<span style="white-space:pre;"></span>animation-name: fadeOutUp;</div>
<div>}</div>
<div>@-webkit-keyframes fadeOutDown {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateY(20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes fadeOutDown {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateY(20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes fadeOutDown {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateY(20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@keyframes fadeOutDown {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>transform: translateY(20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>.fadeOutDown {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: fadeOutDown;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: fadeOutDown;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: fadeOutDown;</div>
<div>
<span style="white-space:pre;"></span>animation-name: fadeOutDown;</div>
<div>}</div>
<div>@-webkit-keyframes fadeOutLeft {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateX(-20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes fadeOutLeft {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateX(-20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes fadeOutLeft {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateX(-20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@keyframes fadeOutLeft {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>transform: translateX(-20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>.fadeOutLeft {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: fadeOutLeft;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: fadeOutLeft;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: fadeOutLeft;</div>
<div>
<span style="white-space:pre;"></span>animation-name: fadeOutLeft;</div>
<div>}</div>
<div>@-webkit-keyframes fadeOutRight {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateX(20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes fadeOutRight {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateX(20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes fadeOutRight {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateX(20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@keyframes fadeOutRight {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>transform: translateX(20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>.fadeOutRight {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: fadeOutRight;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: fadeOutRight;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: fadeOutRight;</div>
<div>
<span style="white-space:pre;"></span>animation-name: fadeOutRight;</div>
<div>}</div>
<div>@-webkit-keyframes fadeOutUpBig {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateY(-2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes fadeOutUpBig {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateY(-2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes fadeOutUpBig {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateY(-2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@keyframes fadeOutUpBig {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>transform: translateY(-2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>.fadeOutUpBig {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: fadeOutUpBig;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: fadeOutUpBig;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: fadeOutUpBig;</div>
<div>
<span style="white-space:pre;"></span>animation-name: fadeOutUpBig;</div>
<div>}</div>
<div>@-webkit-keyframes fadeOutDownBig {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateY(2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes fadeOutDownBig {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateY(2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes fadeOutDownBig {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateY(2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@keyframes fadeOutDownBig {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>transform: translateY(2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>.fadeOutDownBig {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: fadeOutDownBig;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: fadeOutDownBig;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: fadeOutDownBig;</div>
<div>
<span style="white-space:pre;"></span>animation-name: fadeOutDownBig;</div>
<div>}</div>
<div>@-webkit-keyframes fadeOutLeftBig {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateX(-2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes fadeOutLeftBig {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateX(-2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes fadeOutLeftBig {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateX(-2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@keyframes fadeOutLeftBig {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>transform: translateX(-2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>.fadeOutLeftBig {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: fadeOutLeftBig;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: fadeOutLeftBig;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: fadeOutLeftBig;</div>
<div>
<span style="white-space:pre;"></span>animation-name: fadeOutLeftBig;</div>
<div>}</div>
<div>@-webkit-keyframes fadeOutRightBig {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateX(2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div>@-moz-keyframes fadeOutRightBig {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateX(2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div>@-o-keyframes fadeOutRightBig {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateX(2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div>@keyframes fadeOutRightBig {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>transform: translateX(2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>.fadeOutRightBig {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: fadeOutRightBig;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: fadeOutRightBig;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: fadeOutRightBig;</div>
<div>
<span style="white-space:pre;"></span>animation-name: fadeOutRightBig;</div>
<div>}</div>
<div>@-webkit-keyframes bounceIn {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: scale(.3);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>50% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: scale(1.05);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>70% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: scale(.9);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: scale(1);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes bounceIn {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: scale(.3);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>50% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: scale(1.05);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>70% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: scale(.9);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: scale(1);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes bounceIn {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: scale(.3);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>50% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: scale(1.05);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>70% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform: scale(.9);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform: scale(1);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@keyframes bounceIn {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>transform: scale(.3);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>50% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>transform: scale(1.05);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>70% {</div>
<div>
<span style="white-space:pre;"></span>transform: scale(.9);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>transform: scale(1);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>.bounceIn {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: bounceIn;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: bounceIn;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: bounceIn;</div>
<div>
<span style="white-space:pre;"></span>animation-name: bounceIn;</div>
<div>}</div>
<div>@-webkit-keyframes bounceInUp {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateY(2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>60% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateY(-30px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>80% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateY(10px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div>@-moz-keyframes bounceInUp {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateY(2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>60% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateY(-30px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>80% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateY(10px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes bounceInUp {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateY(2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>60% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateY(-30px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>80% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateY(10px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@keyframes bounceInUp {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>transform: translateY(2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>60% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>transform: translateY(-30px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>80% {</div>
<div>
<span style="white-space:pre;"></span>transform: translateY(10px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>.bounceInUp {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: bounceInUp;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: bounceInUp;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: bounceInUp;</div>
<div>
<span style="white-space:pre;"></span>animation-name: bounceInUp;</div>
<div>}</div>
<div>@-webkit-keyframes bounceInDown {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateY(-2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>60% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateY(30px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>80% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateY(-10px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes bounceInDown {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateY(-2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>60% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateY(30px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>80% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateY(-10px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes bounceInDown {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateY(-2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>60% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateY(30px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>80% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateY(-10px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@keyframes bounceInDown {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>transform: translateY(-2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>60% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>transform: translateY(30px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>80% {</div>
<div>
<span style="white-space:pre;"></span>transform: translateY(-10px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>.bounceInDown {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: bounceInDown;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: bounceInDown;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: bounceInDown;</div>
<div>
<span style="white-space:pre;"></span>animation-name: bounceInDown;</div>
<div>}</div>
<div>@-webkit-keyframes bounceInLeft {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateX(-2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>60% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateX(30px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>80% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateX(-10px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes bounceInLeft {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateX(-2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>60% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateX(30px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>80% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateX(-10px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes bounceInLeft {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateX(-2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>60% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateX(30px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>80% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateX(-10px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@keyframes bounceInLeft {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>transform: translateX(-2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>60% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>transform: translateX(30px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>80% {</div>
<div>
<span style="white-space:pre;"></span>transform: translateX(-10px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>.bounceInLeft {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: bounceInLeft;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: bounceInLeft;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: bounceInLeft;</div>
<div>
<span style="white-space:pre;"></span>animation-name: bounceInLeft;</div>
<div>}</div>
<div>@-webkit-keyframes bounceInRight {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateX(2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>60% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateX(-30px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>80% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateX(10px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes bounceInRight {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateX(2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>60% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateX(-30px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>80% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateX(10px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes bounceInRight {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateX(2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>60% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateX(-30px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>80% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateX(10px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@keyframes bounceInRight {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>transform: translateX(2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>60% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>transform: translateX(-30px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>80% {</div>
<div>
<span style="white-space:pre;"></span>transform: translateX(10px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>.bounceInRight {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: bounceInRight;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: bounceInRight;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: bounceInRight;</div>
<div>
<span style="white-space:pre;"></span>animation-name: bounceInRight;</div>
<div>}</div>
<div>@-webkit-keyframes bounceOut {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: scale(1);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>25% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: scale(.95);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>50% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: scale(1.1);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: scale(.3);</div>
<div>
<span style="white-space:pre;"></span>} <span style="white-space:pre;"></span>
</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes bounceOut {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: scale(1);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>25% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: scale(.95);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>50% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: scale(1.1);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: scale(.3);</div>
<div>
<span style="white-space:pre;"></span>} <span style="white-space:pre;"></span>
</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes bounceOut {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform: scale(1);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>25% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform: scale(.95);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>50% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: scale(1.1);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: scale(.3);</div>
<div>
<span style="white-space:pre;"></span>} <span style="white-space:pre;"></span>
</div>
<div>}</div>
<div><br></div>
<div>@keyframes bounceOut {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>transform: scale(1);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>25% {</div>
<div>
<span style="white-space:pre;"></span>transform: scale(.95);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>50% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>transform: scale(1.1);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>transform: scale(.3);</div>
<div>
<span style="white-space:pre;"></span>} <span style="white-space:pre;"></span>
</div>
<div>}</div>
<div><br></div>
<div>.bounceOut {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: bounceOut;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: bounceOut;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: bounceOut;</div>
<div>
<span style="white-space:pre;"></span>animation-name: bounceOut;</div>
<div>}</div>
<div>@-webkit-keyframes bounceOutUp {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>20% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateY(20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateY(-2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes bounceOutUp {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>20% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateY(20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateY(-2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes bounceOutUp {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>20% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateY(20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateY(-2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@keyframes bounceOutUp {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>20% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>transform: translateY(20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>transform: translateY(-2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>.bounceOutUp {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: bounceOutUp;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: bounceOutUp;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: bounceOutUp;</div>
<div>
<span style="white-space:pre;"></span>animation-name: bounceOutUp;</div>
<div>}</div>
<div>@-webkit-keyframes bounceOutDown {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>20% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateY(-20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateY(2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes bounceOutDown {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>20% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateY(-20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateY(2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes bounceOutDown {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>20% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateY(-20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateY(2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@keyframes bounceOutDown {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>transform: translateY(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>20% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>transform: translateY(-20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>transform: translateY(2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>.bounceOutDown {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: bounceOutDown;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: bounceOutDown;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: bounceOutDown;</div>
<div>
<span style="white-space:pre;"></span>animation-name: bounceOutDown;</div>
<div>}</div>
<div>@-webkit-keyframes bounceOutLeft {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>20% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateX(20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateX(-2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes bounceOutLeft {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>20% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateX(20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateX(-2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes bounceOutLeft {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>20% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateX(20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateX(-2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@keyframes bounceOutLeft {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>20% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>transform: translateX(20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>transform: translateX(-2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>.bounceOutLeft {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: bounceOutLeft;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: bounceOutLeft;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: bounceOutLeft;</div>
<div>
<span style="white-space:pre;"></span>animation-name: bounceOutLeft;</div>
<div>}</div>
<div>@-webkit-keyframes bounceOutRight {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>20% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateX(-20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateX(2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes bounceOutRight {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>20% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateX(-20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateX(2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes bounceOutRight {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>20% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateX(-20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateX(2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@keyframes bounceOutRight {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>transform: translateX(0);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>20% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>transform: translateX(-20px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>transform: translateX(2000px);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>.bounceOutRight {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: bounceOutRight;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: bounceOutRight;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: bounceOutRight;</div>
<div>
<span style="white-space:pre;"></span>animation-name: bounceOutRight;</div>
<div>}</div>
<div>@-webkit-keyframes rotateIn {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform-origin: center center;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: rotate(-200deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform-origin: center center;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div>@-moz-keyframes rotateIn {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform-origin: center center;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: rotate(-200deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform-origin: center center;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div>@-o-keyframes rotateIn {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform-origin: center center;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: rotate(-200deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform-origin: center center;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div>@keyframes rotateIn {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>transform-origin: center center;</div>
<div>
<span style="white-space:pre;"></span>transform: rotate(-200deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>transform-origin: center center;</div>
<div>
<span style="white-space:pre;"></span>transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>.rotateIn {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: rotateIn;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: rotateIn;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: rotateIn;</div>
<div>
<span style="white-space:pre;"></span>animation-name: rotateIn;</div>
<div>}</div>
<div>@-webkit-keyframes rotateInUpLeft {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform-origin: left bottom;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: rotate(90deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform-origin: left bottom;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes rotateInUpLeft {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform-origin: left bottom;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: rotate(90deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform-origin: left bottom;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes rotateInUpLeft {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform-origin: left bottom;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: rotate(90deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform-origin: left bottom;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@keyframes rotateInUpLeft {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>transform-origin: left bottom;</div>
<div>
<span style="white-space:pre;"></span>transform: rotate(90deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>transform-origin: left bottom;</div>
<div>
<span style="white-space:pre;"></span>transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>.rotateInUpLeft {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: rotateInUpLeft;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: rotateInUpLeft;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: rotateInUpLeft;</div>
<div>
<span style="white-space:pre;"></span>animation-name: rotateInUpLeft;</div>
<div>}</div>
<div>@-webkit-keyframes rotateInDownLeft {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform-origin: left bottom;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: rotate(-90deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform-origin: left bottom;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes rotateInDownLeft {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform-origin: left bottom;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: rotate(-90deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform-origin: left bottom;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes rotateInDownLeft {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform-origin: left bottom;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: rotate(-90deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform-origin: left bottom;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@keyframes rotateInDownLeft {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>transform-origin: left bottom;</div>
<div>
<span style="white-space:pre;"></span>transform: rotate(-90deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>transform-origin: left bottom;</div>
<div>
<span style="white-space:pre;"></span>transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>.rotateInDownLeft {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: rotateInDownLeft;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: rotateInDownLeft;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: rotateInDownLeft;</div>
<div>
<span style="white-space:pre;"></span>animation-name: rotateInDownLeft;</div>
<div>}</div>
<div>@-webkit-keyframes rotateInUpRight {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform-origin: right bottom;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: rotate(-90deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform-origin: right bottom;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes rotateInUpRight {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform-origin: right bottom;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: rotate(-90deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform-origin: right bottom;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes rotateInUpRight {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform-origin: right bottom;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: rotate(-90deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform-origin: right bottom;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@keyframes rotateInUpRight {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>transform-origin: right bottom;</div>
<div>
<span style="white-space:pre;"></span>transform: rotate(-90deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>transform-origin: right bottom;</div>
<div>
<span style="white-space:pre;"></span>transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>.rotateInUpRight {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: rotateInUpRight;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: rotateInUpRight;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: rotateInUpRight;</div>
<div>
<span style="white-space:pre;"></span>animation-name: rotateInUpRight;</div>
<div>}</div>
<div>@-webkit-keyframes rotateInDownRight {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform-origin: right bottom;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: rotate(90deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform-origin: right bottom;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes rotateInDownRight {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform-origin: right bottom;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: rotate(90deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform-origin: right bottom;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes rotateInDownRight {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform-origin: right bottom;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: rotate(90deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform-origin: right bottom;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@keyframes rotateInDownRight {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>transform-origin: right bottom;</div>
<div>
<span style="white-space:pre;"></span>transform: rotate(90deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>transform-origin: right bottom;</div>
<div>
<span style="white-space:pre;"></span>transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>.rotateInDownRight {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: rotateInDownRight;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: rotateInDownRight;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: rotateInDownRight;</div>
<div>
<span style="white-space:pre;"></span>animation-name: rotateInDownRight;</div>
<div>}</div>
<div>@-webkit-keyframes rotateOut {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform-origin: center center;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform-origin: center center;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: rotate(200deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes rotateOut {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform-origin: center center;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform-origin: center center;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: rotate(200deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes rotateOut {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform-origin: center center;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform-origin: center center;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: rotate(200deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@keyframes rotateOut {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>transform-origin: center center;</div>
<div>
<span style="white-space:pre;"></span>transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>transform-origin: center center;</div>
<div>
<span style="white-space:pre;"></span>transform: rotate(200deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>.rotateOut {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: rotateOut;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: rotateOut;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: rotateOut;</div>
<div>
<span style="white-space:pre;"></span>animation-name: rotateOut;</div>
<div>}</div>
<div>@-webkit-keyframes rotateOutUpLeft {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform-origin: left bottom;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform-origin: left bottom;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: rotate(-90deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes rotateOutUpLeft {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform-origin: left bottom;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform-origin: left bottom;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: rotate(-90deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes rotateOutUpLeft {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform-origin: left bottom;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform-origin: left bottom;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: rotate(-90deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@keyframes rotateOutUpLeft {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>transform-origin: left bottom;</div>
<div>
<span style="white-space:pre;"></span>transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>transform-origin: left bottom;</div>
<div>
<span style="white-space:pre;"></span>transform: rotate(-90deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>.rotateOutUpLeft {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: rotateOutUpLeft;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: rotateOutUpLeft;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: rotateOutUpLeft;</div>
<div>
<span style="white-space:pre;"></span>animation-name: rotateOutUpLeft;</div>
<div>}</div>
<div>@-webkit-keyframes rotateOutDownLeft {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform-origin: left bottom;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform-origin: left bottom;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: rotate(90deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes rotateOutDownLeft {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform-origin: left bottom;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform-origin: left bottom;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: rotate(90deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes rotateOutDownLeft {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform-origin: left bottom;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform-origin: left bottom;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: rotate(90deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@keyframes rotateOutDownLeft {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>transform-origin: left bottom;</div>
<div>
<span style="white-space:pre;"></span>transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>transform-origin: left bottom;</div>
<div>
<span style="white-space:pre;"></span>transform: rotate(90deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>.rotateOutDownLeft {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: rotateOutDownLeft;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: rotateOutDownLeft;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: rotateOutDownLeft;</div>
<div>
<span style="white-space:pre;"></span>animation-name: rotateOutDownLeft;</div>
<div>}</div>
<div>@-webkit-keyframes rotateOutUpRight {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform-origin: right bottom;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform-origin: right bottom;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: rotate(90deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes rotateOutUpRight {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform-origin: right bottom;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform-origin: right bottom;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: rotate(90deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes rotateOutUpRight {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform-origin: right bottom;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform-origin: right bottom;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: rotate(90deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@keyframes rotateOutUpRight {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>transform-origin: right bottom;</div>
<div>
<span style="white-space:pre;"></span>transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>transform-origin: right bottom;</div>
<div>
<span style="white-space:pre;"></span>transform: rotate(90deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>.rotateOutUpRight {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: rotateOutUpRight;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: rotateOutUpRight;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: rotateOutUpRight;</div>
<div>
<span style="white-space:pre;"></span>animation-name: rotateOutUpRight;</div>
<div>}</div>
<div>@-webkit-keyframes rotateOutDownRight {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform-origin: right bottom;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform-origin: right bottom;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: rotate(-90deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes rotateOutDownRight {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform-origin: right bottom;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-moz-transform-origin: right bottom;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: rotate(-90deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes rotateOutDownRight {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform-origin: right bottom;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>-o-transform-origin: right bottom;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: rotate(-90deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@keyframes rotateOutDownRight {</div>
<div>
<span style="white-space:pre;"></span>0% {</div>
<div>
<span style="white-space:pre;"></span>transform-origin: right bottom;</div>
<div>
<span style="white-space:pre;"></span>transform: rotate(0);</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><span style="white-space:pre;"></span></div>
<div>
<span style="white-space:pre;"></span>100% {</div>
<div>
<span style="white-space:pre;"></span>transform-origin: right bottom;</div>
<div>
<span style="white-space:pre;"></span>transform: rotate(-90deg);</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>.rotateOutDownRight {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: rotateOutDownRight;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: rotateOutDownRight;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: rotateOutDownRight;</div>
<div>
<span style="white-space:pre;"></span>animation-name: rotateOutDownRight;</div>
<div>}</div>
<div>@-webkit-keyframes hinge {</div>
<div>
<span style="white-space:pre;"></span>0% { -webkit-transform: rotate(0); -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; } <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>20%, 60% { -webkit-transform: rotate(80deg); -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; } <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>40% { -webkit-transform: rotate(60deg); -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; } <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>80% { -webkit-transform: rotate(60deg) translateY(0); opacity: 1; -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; } <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>100% { -webkit-transform: translateY(700px); opacity: 0; }</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes hinge {</div>
<div>
<span style="white-space:pre;"></span>0% { -moz-transform: rotate(0); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; } <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>20%, 60% { -moz-transform: rotate(80deg); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; } <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>40% { -moz-transform: rotate(60deg); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; } <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>80% { -moz-transform: rotate(60deg) translateY(0); opacity: 1; -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; } <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>100% { -moz-transform: translateY(700px); opacity: 0; }</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes hinge {</div>
<div>
<span style="white-space:pre;"></span>0% { -o-transform: rotate(0); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; } <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>20%, 60% { -o-transform: rotate(80deg); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; } <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>40% { -o-transform: rotate(60deg); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; } <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>80% { -o-transform: rotate(60deg) translateY(0); opacity: 1; -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; } <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>100% { -o-transform: translateY(700px); opacity: 0; }</div>
<div>}</div>
<div><br></div>
<div>@keyframes hinge {</div>
<div>
<span style="white-space:pre;"></span>0% { transform: rotate(0); transform-origin: top left; animation-timing-function: ease-in-out; } <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>20%, 60% { transform: rotate(80deg); transform-origin: top left; animation-timing-function: ease-in-out; } <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>40% { transform: rotate(60deg); transform-origin: top left; animation-timing-function: ease-in-out; } <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>80% { transform: rotate(60deg) translateY(0); opacity: 1; transform-origin: top left; animation-timing-function: ease-in-out; } <span style="white-space:pre;"></span>
</div>
<div>
<span style="white-space:pre;"></span>100% { transform: translateY(700px); opacity: 0; }</div>
<div>}</div>
<div><br></div>
<div>.hinge {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: hinge;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: hinge;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: hinge;</div>
<div>
<span style="white-space:pre;"></span>animation-name: hinge;</div>
<div>}</div>
<div>/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */</div>
<div><br></div>
<div>@-webkit-keyframes rollIn {</div>
<div>
<span style="white-space:pre;"></span>0% { opacity: 0; -webkit-transform: translateX(-100%) rotate(-120deg); }</div>
<div>
<span style="white-space:pre;"></span>100% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); }</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes rollIn {</div>
<div>
<span style="white-space:pre;"></span>0% { opacity: 0; -moz-transform: translateX(-100%) rotate(-120deg); }</div>
<div>
<span style="white-space:pre;"></span>100% { opacity: 1; -moz-transform: translateX(0px) rotate(0deg); }</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes rollIn {</div>
<div>
<span style="white-space:pre;"></span>0% { opacity: 0; -o-transform: translateX(-100%) rotate(-120deg); }</div>
<div>
<span style="white-space:pre;"></span>100% { opacity: 1; -o-transform: translateX(0px) rotate(0deg); }</div>
<div>}</div>
<div><br></div>
<div>@keyframes rollIn {</div>
<div>
<span style="white-space:pre;"></span>0% { opacity: 0; transform: translateX(-100%) rotate(-120deg); }</div>
<div>
<span style="white-space:pre;"></span>100% { opacity: 1; transform: translateX(0px) rotate(0deg); }</div>
<div>}</div>
<div><br></div>
<div>.rollIn {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: rollIn;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: rollIn;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: rollIn;</div>
<div>
<span style="white-space:pre;"></span>animation-name: rollIn;</div>
<div>}</div>
<div>/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */</div>
<div><br></div>
<div>@-webkit-keyframes rollOut {</div>
<div>    0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateX(0px) rotate(0deg);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><br></div>
<div>    100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-webkit-transform: translateX(100%) rotate(120deg);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes rollOut {</div>
<div>    0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateX(0px) rotate(0deg);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><br></div>
<div>    100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-moz-transform: translateX(100%) rotate(120deg);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes rollOut {</div>
<div>    0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateX(0px) rotate(0deg);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><br></div>
<div>    100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>-o-transform: translateX(100%) rotate(120deg);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>@keyframes rollOut {</div>
<div>    0% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 1;</div>
<div>
<span style="white-space:pre;"></span>transform: translateX(0px) rotate(0deg);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div><br></div>
<div>    100% {</div>
<div>
<span style="white-space:pre;"></span>opacity: 0;</div>
<div>
<span style="white-space:pre;"></span>transform: translateX(100%) rotate(120deg);</div>
<div>
<span style="white-space:pre;"></span>}</div>
<div>}</div>
<div><br></div>
<div>.rollOut {</div>
<div>
<span style="white-space:pre;"></span>-webkit-animation-name: rollOut;</div>
<div>
<span style="white-space:pre;"></span>-moz-animation-name: rollOut;</div>
<div>
<span style="white-space:pre;"></span>-o-animation-name: rollOut;</div>
<div>
<span style="white-space:pre;"></span>animation-name: rollOut;</div>
<div>}</div>
<div><br></div>
<div>/* originally authored by Angelo Rohit - https://github.com/angelorohit */</div>
<div><br></div>
<div>@-webkit-keyframes lightSpeedIn {</div>
<div>
<span style="white-space:pre;"></span>0% { -webkit-transform: translateX(100%) skewX(-30deg); opacity: 0; }</div>
<div>
<span style="white-space:pre;"></span>60% { -webkit-transform: translateX(-20%) skewX(30deg); opacity: 1; }</div>
<div>
<span style="white-space:pre;"></span>80% { -webkit-transform: translateX(0%) skewX(-15deg); opacity: 1; }</div>
<div>
<span style="white-space:pre;"></span>100% { -webkit-transform: translateX(0%) skewX(0deg); opacity: 1; }</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes lightSpeedIn {</div>
<div>
<span style="white-space:pre;"></span>0% { -moz-transform: translateX(100%) skewX(-30deg); opacity: 0; }</div>
<div>
<span style="white-space:pre;"></span>60% { -moz-transform: translateX(-20%) skewX(30deg); opacity: 1; }</div>
<div>
<span style="white-space:pre;"></span>80% { -moz-transform: translateX(0%) skewX(-15deg); opacity: 1; }</div>
<div>
<span style="white-space:pre;"></span>100% { -moz-transform: translateX(0%) skewX(0deg); opacity: 1; }</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes lightSpeedIn {</div>
<div>
<span style="white-space:pre;"></span>0% { -o-transform: translateX(100%) skewX(-30deg); opacity: 0; }</div>
<div>
<span style="white-space:pre;"></span>60% { -o-transform: translateX(-20%) skewX(30deg); opacity: 1; }</div>
<div>
<span style="white-space:pre;"></span>80% { -o-transform: translateX(0%) skewX(-15deg); opacity: 1; }</div>
<div>
<span style="white-space:pre;"></span>100% { -o-transform: translateX(0%) skewX(0deg); opacity: 1; }</div>
<div>}</div>
<div><br></div>
<div>@keyframes lightSpeedIn {</div>
<div>
<span style="white-space:pre;"></span>0% { transform: translateX(100%) skewX(-30deg); opacity: 0; }</div>
<div>
<span style="white-space:pre;"></span>60% { transform: translateX(-20%) skewX(30deg); opacity: 1; }</div>
<div>
<span style="white-space:pre;"></span>80% { transform: translateX(0%) skewX(-15deg); opacity: 1; }</div>
<div>
<span style="white-space:pre;"></span>100% { transform: translateX(0%) skewX(0deg); opacity: 1; }</div>
<div>}</div>
<div><br></div>
<div>.lightSpeedIn {</div>
<div>    -webkit-animation-name: lightSpeedIn;</div>
<div>    -moz-animation-name: lightSpeedIn;</div>
<div>    -o-animation-name: lightSpeedIn;</div>
<div>    animation-name: lightSpeedIn;</div>
<div><br></div>
<div>    -webkit-animation-timing-function: ease-out;</div>
<div>    -moz-animation-timing-function: ease-out;</div>
<div>    -o-animation-timing-function: ease-out;</div>
<div>    animation-timing-function: ease-out;</div>
<div>}</div>
<div><br></div>
<div>.animated.lightSpeedIn {</div>
<div>    -webkit-animation-duration: 0.5s;</div>
<div>    -moz-animation-duration: 0.5s;</div>
<div>    -o-animation-duration: 0.5s;</div>
<div>    animation-duration: 0.5s;</div>
<div>}</div>
<div><br></div>
<div>/* originally authored by Angelo Rohit - https://github.com/angelorohit */</div>
<div><br></div>
<div>@-webkit-keyframes lightSpeedOut {</div>
<div>    0% { -webkit-transform: translateX(0%) skewX(0deg); opacity: 1; }</div>
<div>
<span style="white-space:pre;"></span>100% { -webkit-transform: translateX(100%) skewX(-30deg); opacity: 0; }</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes lightSpeedOut {</div>
<div>
<span style="white-space:pre;"></span>0% { -moz-transform: translateX(0%) skewX(0deg); opacity: 1; }</div>
<div>
<span style="white-space:pre;"></span>100% { -moz-transform: translateX(100%) skewX(-30deg); opacity: 0; }</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes lightSpeedOut {</div>
<div>
<span style="white-space:pre;"></span>0% { -o-transform: translateX(0%) skewX(0deg); opacity: 1; }</div>
<div>
<span style="white-space:pre;"></span>100% { -o-transform: translateX(100%) skewX(-30deg); opacity: 0; }</div>
<div>}</div>
<div><br></div>
<div>@keyframes lightSpeedOut {</div>
<div>
<span style="white-space:pre;"></span>0% { transform: translateX(0%) skewX(0deg); opacity: 1; }</div>
<div>
<span style="white-space:pre;"></span>100% { transform: translateX(100%) skewX(-30deg); opacity: 0; }</div>
<div>}</div>
<div><br></div>
<div>.lightSpeedOut {</div>
<div>    -webkit-animation-name: lightSpeedOut;</div>
<div>    -moz-animation-name: lightSpeedOut;</div>
<div>    -o-animation-name: lightSpeedOut;</div>
<div>    animation-name: lightSpeedOut;</div>
<div><br></div>
<div>    -webkit-animation-timing-function: ease-in;</div>
<div>    -moz-animation-timing-function: ease-in;</div>
<div>    -o-animation-timing-function: ease-in;</div>
<div>    animation-timing-function: ease-in;</div>
<div>}</div>
<div><br></div>
<div>.animated.lightSpeedOut {</div>
<div>    -webkit-animation-duration: 0.25s;</div>
<div>    -moz-animation-duration: 0.25s;</div>
<div>    -o-animation-duration: 0.25s;</div>
<div>    animation-duration: 0.25s;</div>
<div>}</div>
<div><br></div>
<div>/* originally authored by Angelo Rohit - https://github.com/angelorohit */</div>
<div><br></div>
<div>@-webkit-keyframes wiggle {</div>
<div>    0% { -webkit-transform: skewX(9deg); }</div>
<div>    10% { -webkit-transform: skewX(-8deg); }</div>
<div>    20% { -webkit-transform: skewX(7deg); }</div>
<div>    30% { -webkit-transform: skewX(-6deg); }</div>
<div>    40% { -webkit-transform: skewX(5deg); }</div>
<div>    50% { -webkit-transform: skewX(-4deg); }</div>
<div>    60% { -webkit-transform: skewX(3deg); }</div>
<div>    70% { -webkit-transform: skewX(-2deg); }</div>
<div>    80% { -webkit-transform: skewX(1deg); }</div>
<div>    90% { -webkit-transform: skewX(0deg); }</div>
<div>
<span style="white-space:pre;"></span>100% { -webkit-transform: skewX(0deg); }</div>
<div>}</div>
<div><br></div>
<div>@-moz-keyframes wiggle {</div>
<div>    0% { -moz-transform: skewX(9deg); }</div>
<div>    10% { -moz-transform: skewX(-8deg); }</div>
<div>    20% { -moz-transform: skewX(7deg); }</div>
<div>    30% { -moz-transform: skewX(-6deg); }</div>
<div>    40% { -moz-transform: skewX(5deg); }</div>
<div>    50% { -moz-transform: skewX(-4deg); }</div>
<div>    60% { -moz-transform: skewX(3deg); }</div>
<div>    70% { -moz-transform: skewX(-2deg); }</div>
<div>    80% { -moz-transform: skewX(1deg); }</div>
<div>    90% { -moz-transform: skewX(0deg); }</div>
<div>
<span style="white-space:pre;"></span>100% { -moz-transform: skewX(0deg); }</div>
<div>}</div>
<div><br></div>
<div>@-o-keyframes wiggle {</div>
<div>    0% { -o-transform: skewX(9deg); }</div>
<div>    10% { -o-transform: skewX(-8deg); }</div>
<div>    20% { -o-transform: skewX(7deg); }</div>
<div>    30% { -o-transform: skewX(-6deg); }</div>
<div>    40% { -o-transform: skewX(5deg); }</div>
<div>    50% { -o-transform: skewX(-4deg); }</div>
<div>    60% { -o-transform: skewX(3deg); }</div>
<div>    70% { -o-transform: skewX(-2deg); }</div>
<div>    80% { -o-transform: skewX(1deg); }</div>
<div>    90% { -o-transform: skewX(0deg); }</div>
<div>
<span style="white-space:pre;"></span>100% { -o-transform: skewX(0deg); }</div>
<div>}</div>
<div><br></div>
<div>@keyframes wiggle {</div>
<div>    0% { transform: skewX(9deg); }</div>
<div>    10% { transform: skewX(-8deg); }</div>
<div>    20% { transform: skewX(7deg); }</div>
<div>    30% { transform: skewX(-6deg); }</div>
<div>    40% { transform: skewX(5deg); }</div>
<div>    50% { transform: skewX(-4deg); }</div>
<div>    60% { transform: skewX(3deg); }</div>
<div>    70% { transform: skewX(-2deg); }</div>
<div>    80% { transform: skewX(1deg); }</div>
<div>    90% { transform: skewX(0deg); }</div>
<div>
<span style="white-space:pre;"></span>100% { transform: skewX(0deg); }</div>
<div>}</div>
<div><br></div>
<div>.wiggle {</div>
<div>    -webkit-animation-name: wiggle;</div>
<div>    -moz-animation-name: wiggle;</div>
<div>    -o-animation-name: wiggle;</div>
<div>    animation-name: wiggle;</div>
<div><br></div>
<div>    -webkit-animation-timing-function: ease-in;</div>
<div>    -moz-animation-timing-function: ease-in;</div>
<div>    -o-animation-timing-function: ease-in;</div>
<div>    animation-timing-function: ease-in;</div>
<div>}</div>
<div><br></div>
<div>.animated.wiggle {</div>
<div>    -webkit-animation-duration: 0.75s;</div>
<div>    -moz-animation-duration: 0.75s;</div>
<div>    -o-animation-duration: 0.75s;</div>
<div>    animation-duration: 0.75s;</div>
<div>}&lt;/style&gt;</div>
<div><br></div>
<div><br></div>
<div>
<span style="white-space:pre;"></span>&lt;!--banner--&gt;</div>
<div>
<span style="white-space:pre;"></span>&lt;script src="/js/jquery.bxslider-rahisified.js"&gt;&lt;/script&gt;</div>
<div>
<span style="white-space:pre;"></span>&lt;script src="/js/jquery.easing.1.3.js"&gt;&lt;/script&gt;</div>
<div>
<span style="white-space:pre;"></span>&lt;!--[if lt IE 9]&gt;</div>
<div>
<span style="white-space:pre;"></span>&lt;script src="/js/html5shiv.js"&gt;&lt;/script&gt;</div>
<div>
<span style="white-space:pre;"></span>&lt;![endif]--&gt;</div>
<div><br></div>
<div>
<span style="white-space:pre;"></span>&lt;/head&gt;</div>
<div>&lt;body marginwidth="0" marginheight="0" class="show"&gt;</div>
<div>&lt;article id="cont" class="" style="text-align:center; margin:0 auto; padding:30px 0; width: 1100px; ;"&gt;</div>
<div><br></div>
<div>
<span style="white-space:pre;"></span>&lt;!-- 컬러챠트 삽입 { --&gt;</div>
<div>
<span style="white-space:pre;"></span>&lt;style media="" data-href="/colorbox/css/colorbox_iframe.css"&gt;/*# sourceURL=/colorbox/css/colorbox_iframe.css */</div>
<div>/*@ sourceURL=/colorbox/css/colorbox_iframe.css */</div>
<div>@import url("https://cdn.rawgit.com/theeluwin/NotoSansKR-Hestia/master/stylesheets/NotoSansKR-Hestia.css");</div>
<div><br></div>
<div><br></div>
<div><br></div>
<div>body {margin:0;padding:0;}</div>
<div><br></div>
<div>#behr_colorbox {width:850px; font-family: "Noto Sans Korean", "NotoSans", sans-serif,"dotum"; overflow: hidden;position: relative; font-size: 12px;  line-height: 1.2; text-align: left; z-index: 9999;}</div>
<div>#behr_colorbox * {margin:0; padding: 0; vertical-align: top;}</div>
<div>#behr_colorbox a {outline: none; text-decoration: none; cursor: pointer;}</div>
<div>#behr_colorbox img {border:0;}</div>
<div>#behr_colorbox ul {list-style: none;}</div>
<div>#behr_colorbox .behr_monitor {width: 570px; border:2px solid #e6e6e5; min-height: 846px; margin-top: 52px; float: left; margin-left: 15px;}</div>
<div>#behr_colorbox .behr_monitor .behr_color_menu {padding:33px 2px 25px;}</div>
<div>#behr_colorbox .behr_monitor .behr_color_menu ul {font-size: 0}</div>
<div>#behr_colorbox .behr_monitor .behr_color_menu ul li {display: inline-block; width: 11%; font-size: 12px;height: 49px; position: relative; vertical-align: top;}</div>
<div>#behr_colorbox .behr_monitor .behr_color_menu ul li a {display: block; text-align: center; position: absolute; top:0; left:0; width: 100%; bottom:0; }</div>
<div><br></div>
<div>#behr_colorbox .behr_inner {width: 540px}</div>
<div><br></div>
<div>#behr_colorbox .behr_nav {position: absolute; top:0; left: 15px; height: 52px;}</div>
<div>#behr_colorbox .behr_nav ul {overflow: hidden; position: absolute; bottom:0; left: 0; width: 582px;}</div>
<div>#behr_colorbox .behr_nav ul li {float: left; height: 52px; position: relative;width: 108px;}</div>
<div>#behr_colorbox .behr_nav ul li a {display: block; width: 108px; background: #e6e6e5; text-align: center; position: relative; bottom: 0; position: absolute; left:0; border-radius: 6px 6px 0 0; color:#535353; height: 42px;line-height: 42px; font-size:12px;}</div>
<div>#behr_colorbox .behr_nav ul li:nth-child(odd) a {background:#f2f2f2;}</div>
<div>#behr_colorbox .behr_nav ul li a.active {background: #535353; color:#fff; height: 52px; line-height: 58px; font-size: 14px}</div>
<div><br></div>
<div>#behr_colorbox .behr_selectColor {width: 240px; float: right; margin-right: 15px;}</div>
<div>#behr_colorbox .behr_selectColor h3 {height: 52px; background: #535353; color:#fff; font-size: 18px; text-align: center; line-height: 58px; font-weight: 400; border-radius: 5px 5px 0 0}</div>
<div>#behr_colorbox .behr_palette {background: #e6e6e5; min-height: 850px;} </div>
<div>#behr_colorbox .behr_palette_guide { font-size: 11px; color: #535353; line-height: 20px; font-weight: 300; padding:12px 11px; border-bottom:1px solid #fff;} </div>
<div>#behr_colorbox .behr_colorChart {overflow:hidden; overflow-y:scroll; height: 600px;  position: relative;}</div>
<div>#behr_colorbox .behr_colorChart.bhallcolors {margin-top: 65px;}</div>
<div>#behr_colorbox .loading {position: absolute; top:160px; left:0; width: 580px; bottom:0; z-index: 998; background: rgba(256,256,256,0.8); text-align: center;}</div>
<div>#behr_colorbox .loading img {padding-top:45%; }</div>
<div>#behr_colorbox .cc_submenu a {cursor: pointer;}</div>
<div>#behr_colorbox .behr_colorChart .cc-box {width: 60px; height: 40px; border-radius: 5px; overflow: hidden; display: inline-block; margin:4px; cursor: pointer;transition: transform 0.2s ease}</div>
<div>#behr_colorbox .behr_colorChart .cc-box-none {width: 60px; height: 40px; overflow: hidden; display: inline-block; margin:4px;vertical-align: top;}</div>
<div>#behr_colorbox .behr_colorChart .cc-box-img {width: 540px;  display: inline-block;margin:4px; margin-top: 20px; vertical-align: top;}</div>
<div>#behr_colorbox .behr_colorChart .cc-box-img img {width: 100% !important;}</div>
<div>#behr_colorbox .behr_colorChart .cc-box-imgbox {margin-bottom: 4px; height: 274px;}</div>
<div>#behr_colorbox .behr_colorChart .cc-box-img .cc-box:nth-of-type(2) {margin-left: 0;}</div>
<div>#behr_colorbox .behr_colorChart .cc-box-img .cc-box:nth-of-type(5) {margin-right: 0;}</div>
<div>#behr_colorbox .behr_colorChart .cc-box .cc-name {display: none;}</div>
<div>#behr_colorbox .behr_colorChart .cc-box:hover {transform: scale(1.1); }</div>
<div>#behr_colorbox .behr_colorChart .cc-box.active {background-image: url("https://behr.kr/colorbox/css/../icon/chk.png") !important; background-position:  50% 50% !important; background-repeat: no-repeat !important;}</div>
<div>#behr_colorbox .behr_colorChart .cc-box.activeb {background-image: url("https://behr.kr/colorbox/css/../icon/chk_b.png") !important; background-position:  50% 50% !important; background-repeat: no-repeat !important;}</div>
<div>#behr_colorbox #behr_palette_save .cc-box { position: relative; padding:12px 0; margin:0 12px; border-bottom:1px solid #fff; overflow: hidden; min-height: 57px; box-sizing: border-box; cursor: pointer;}</div>
<div>#behr_colorbox #behr_palette_save .cc-box .cc-view {display: block; width: 40px; height: 40px;border-radius: 5px; position: absolute; top:12px; left:0; z-index: 3;}</div>
<div>#behr_colorbox #behr_palette_save .cc-box .cc-name {font-size:12px; padding-left: 52px;padding-top: 1px; color: #535353; padding-right: 40px}</div>
<div>#behr_colorbox #behr_palette_save .cc-box .cc-name span {display: block; font-size:15px; padding-top: 0px; font-weight: bold;}</div>
<div>#behr_colorbox #behr_palette_save .cc-box .palette_del {position: absolute; top:24px; right:15px; cursor: pointer; width: 20px; height: 20px; background: url("https://behr.kr/colorbox/css/../icon/close.png") no-repeat 0 0; overflow: hidden; text-align: left; text-indent: -9999px;}</div>
<div>#behr_colorbox #behr_palette_save .cc-box .palette_del:hover {background-position: 0 -20px;}</div>
<div>#behr_colorbox .wh-ov {background: #fff; opacity: 0.7; position: fixed; top:0; left:0; bottom:0; right: 0; width: 100%; height: 100%; z-index: 9998; display: none}</div>
<div>#detailCanvas {background: url("https://behr.kr/colorbox/css/../icon/detail_iframe.png") no-repeat 0 0; width: 1050px; height: 850px; z-index: 9999; position: absolute; top:28px; left: 25px; display: none}</div>
<div>#detailCanvas a.detailCanvas_close {position: absolute; top:3px; left: 771px; width: 26px; height: 26px; display: block; overflow: hidden; text-indent: -999px; text-align: left; cursor: pointer;}</div>
<div>#detailCanvas #detailCanvas_list {position: absolute; top:30px; left: 232px; overflow: hidden; height: 60px; width: 540px; padding-top: 5px; padding-left: 5px;}</div>
<div>#detailCanvas #detailCanvas_list .cc-box {float: left; margin-right: 5px;width: 43px; height: 43px; display: block; position: relative; cursor: pointer;border-radius: 5px; margin-bottom: 5px}</div>
<div>#detailCanvas #detailCanvas_list .cc-box .cc-view {position: relative;width: 43px; height: 43px; border-radius: 5px; display: block; top:0; left:0;position: absolute;}</div>
<div>#detailCanvas #detailCanvas_list .cc-box.active .cc-view  {border:4px solid  #3f3e3e;  top:-4px; left:-4px; z-index: 3;}</div>
<div>#detailCanvas #detailCanvas_list .cc-box:hover .cc-view {transform: scale(1.1);}</div>
<div>#detailCanvas #detailCanvas_list .cc-box.active:hover .cc-view {transform: scale(1);}</div>
<div>#detailCanvas #detailCanvas_list .cc-box .cc-name, #detailCanvas #detailCanvas_list .cc-box .palette_del {display:none;}</div>
<div>#detailCanvas #detailCanvas_view {width: 540px; height: 200px; display: block; position: absolute; top:100px; left: 237px;}</div>
<div>#detailCanvas #detailCanvas_view .cc-box .cc-view {position: absolute; top:0; left: 0; right: 0; bottom: 0; z-index: -1;}</div>
<div>#detailCanvas #detailCanvas_view .cc-box .cc-name {padding:30px 35px 18px; font-size:30px; color:#fff; font-weight: bold;}</div>
<div>#detailCanvas #detailCanvas_view .cc-box .cc-name span {display: block;font-weight: normal; font-size: 22px; color:#fff;}</div>
<div>#detailCanvas #detailCanvas_view .cc-box[data-tcol=B] .cc-name, </div>
<div>#detailCanvas #detailCanvas_view .cc-box[data-tcol=B] .cc-name span {color:#333;}</div>
<div>#detailCanvas #detailCanvas_view .cc-box .palette_del {display: none;}</div>
<div>#detailCanvas #detailCanvas_view .cc-box .detailColorvs_buyBtn {display: none; bottom:10px; left:233px;}</div>
<div>#detailCanvas #detailCanvas_view:hover .cc-box .detailColorvs_buyBtn {display: block;}</div>
<div>#detailCanvas .detailCanvas_btn {display: block;width: 174px; height: 53px; position: absolute; top:319px; cursor: pointer; text-indent: -999px; text-align: left; overflow: hidden; }</div>
<div>#detailCanvas .detailCanvas_btn01 {left: 237px;}</div>
<div>#detailCanvas .detailCanvas_btn02 {left: 419px;}</div>
<div>#detailCanvas .detailCanvas_btn03 {left: 602px;}</div>
<div>#detailCanvas .detailCanvas_btn:hover {background: url("https://behr.kr/colorbox/css/../icon/btn_hover_iframe.gif") no-repeat 0 0;}</div>
<div>#detailCanvas .detailCanvas_view {display: block; width: 175px; position: absolute; top:388px; height: 237px;}</div>
<div>#detailCanvas .detailCanvas_view01 {left: 237px;}</div>
<div>#detailCanvas .detailCanvas_view02 {left: 419px;}</div>
<div>#detailCanvas .detailCanvas_view03 {left: 602px;}</div>
<div>#detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .cc-view {position: absolute; top:0; left: 0; right: 0; bottom: 0; z-index: -1;}</div>
<div>#detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .cc-name {padding:25px 40px 18px 5px; font-size:16px; color:#fff; font-weight: bold;}</div>
<div>#detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .cc-name span {display: block;font-weight: normal; font-size: 15px; color:#fff;}</div>
<div>#detailCanvas #detailCanvas_color .detailCanvas_view .cc-box[data-tcol=B] .cc-name, </div>
<div>#detailCanvas #detailCanvas_color .detailCanvas_view .cc-box[data-tcol=B] .cc-name span {color:#333;}</div>
<div>#detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .palette_del {display: none; }</div>
<div>#detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .detailColorvs_buyBtn {display: none; top:140px;left:50px;}</div>
<div>#detailCanvas #detailCanvas_color .detailCanvas_view01:hover .cc-box .detailColorvs_buyBtn {display: block;}</div>
<div>#detailCanvas #detailCanvas_color .detailCanvas_view02:hover .cc-box .detailColorvs_buyBtn {display: block;}</div>
<div>#detailCanvas #detailCanvas_color .detailCanvas_view03:hover .cc-box .detailColorvs_buyBtn {display: block;}</div>
<div>#detailCanvas .detailColorvs_buyBtn {cursor: pointer; width: 74px; height: 74px; background: url("https://behr.kr/colorbox/css/../icon/cart.png") no-repeat 0 0; text-align: left; text-indent: -9999px; overflow: hidden; position: absolute; }</div>
<div><br></div>
<div>/*검색결과*/</div>
<div>#behr_colorbox #cc_search_area {display: none; position: absolute; height: 104px; top:54px; left: 17px; width: 540px; background: #fff;}</div>
<div>#behr_colorbox #cc_search_area .cc_search {display: block; background: url("https://behr.kr/colorbox/css/../icon/ccsearch_iframe.jpg") no-repeat 0 0; width: 500px; height: 50px; position: absolute; top:33px; left:44px;}</div>
<div>#behr_colorbox #cc_search_area .cc_search label {display: inline-block; width: 100px; line-height: 50px; font-size: 18px; color:#535353; text-align: center; }</div>
<div>#behr_colorbox #cc_search_area .cc_search input {display: inline-block;width:308px; height: 48px; line-height: 48px; border:0; background: #fff; font-size: 14px; color:#535353; padding: 0 20px; box-sizing: border-box; margin-top: 1px;}</div>
<div>#behr_colorbox #cckeywordauto {position: absolute; top:92px; width: 550px; text-align: center;}</div>
<div>#behr_colorbox #cckeywordauto ul {text-align: center; font-size: 0;}</div>
<div>#behr_colorbox #cckeywordauto ul li {display: inline-block; background: #e6e6e5; border-radius: 5px; padding:5px 8px; font-size:14px; color:#535353; margin:0 2px;}</div>
<div>#behr_colorbox #cckeywordauto ul li:nth-child(odd) {background: #f2f2f2;}</div>
<div>#behr_colorbox #cckeywordauto ul li a {cursor: pointer; font-weight: 100}</div>
<div>#ccsearchOutput {background: #535353; color:#fff; padding:0 14px; line-height: 41px; height: 41px; box-sizing: border-box; position: absolute; top:143px; left:20px; right: 20px;}</div>
<div>#ccsearchOutput span {vertical-align: bottom; font-size:22px; margin-right: 8px; display: inline-block;}</div>
<div>#behr_colorbox.namelist .behr_colorChart .cc-box {width: 80px; height: 60px; display: inline-block; overflow: visible; position: relative; margin:10px 175px 10px 20px; position: relative; transition: none;}</div>
<div>#behr_colorbox.namelist .behr_colorChart .cc-box:before {content: ''; display: block; position: absolute; background:#ddd; width: 230px; height: 1px; bottom:-10px; left:0;}</div>
<div>#behr_colorbox.namelist .behr_colorChart .cc-box:hover {transform: scale(1);}</div>
<div>#behr_colorbox.namelist .behr_colorChart .cc-name { position: absolute; left: 87px; top:6px; display: block; width: 210px; font-size: 14px; color:#535353;}</div>
<div>#behr_colorbox.namelist .behr_colorChart .cc-name span {display: block;}</div>
<div>#behr_colorbox.namelist .behr_colorChart {margin-top: 78px !important; height: 660px !important;}</div>
<div>#behr_colorbox.namelist .loading {top:238px;}</div>
<div><br></div>
<div><br></div>
<div>#behr_colorbox.all_colors .behr_colorChart {margin-top: 65px;}</div>
<div><br></div>
<div>/*메뉴별 모양*/</div>
<div>#behr_colorbox .behr_color_menu a {color: transparent;}</div>
<div><br></div>
<div>/*1.all colors메뉴*/</div>
<div>#behr_colorbox.all_colors .behr_color_menu a.bh_colornav0 {background: #b1383d;}</div>
<div>#behr_colorbox.all_colors .behr_color_menu a.bh_colornav1 {background: #d3533a}</div>
<div>#behr_colorbox.all_colors .behr_color_menu a.bh_colornav2 {background: #ffcb3a}</div>
<div>#behr_colorbox.all_colors .behr_color_menu a.bh_colornav3 {background: #4f725a}</div>
<div>#behr_colorbox.all_colors .behr_color_menu a.bh_colornav4 {background: #006993}</div>
<div>/*#behr_colorbox.all_colors .behr_color_menu a.bh_colornav5 {background: #86b9b2}*/</div>
<div>#behr_colorbox.all_colors .behr_color_menu a.bh_colornav5 {background: #7f657e}</div>
<div>#behr_colorbox.all_colors .behr_color_menu a.bh_colornav6 {background: #a99884}</div>
<div>#behr_colorbox.all_colors .behr_color_menu a.bh_colornav7 {background: #818181}</div>
<div>#behr_colorbox.all_colors .behr_color_menu a.bh_colornav8 {background: #f1f1f1}</div>
<div><br></div>
<div>/*2.best coloes 메뉴*/</div>
<div>#behr_colorbox.best_colors .behr_color_menu a.bh_colornav0 {background: #b1383d;}</div>
<div>#behr_colorbox.best_colors .behr_color_menu a.bh_colornav1 {background: #d3533a}</div>
<div>#behr_colorbox.best_colors .behr_color_menu a.bh_colornav2 {background: #ffcb3a}</div>
<div>#behr_colorbox.best_colors .behr_color_menu a.bh_colornav3 {background: #4f725a}</div>
<div>#behr_colorbox.best_colors .behr_color_menu a.bh_colornav4 {background: #006993}</div>
<div>/*#behr_colorbox.best_colors .behr_color_menu a.bh_colornav5 {background: #86b9b2}*/</div>
<div>#behr_colorbox.best_colors .behr_color_menu a.bh_colornav5 {background: #7f657e}</div>
<div>#behr_colorbox.best_colors .behr_color_menu a.bh_colornav6 {background: #a99884}</div>
<div>#behr_colorbox.best_colors .behr_color_menu a.bh_colornav7 {background: #818181}</div>
<div>#behr_colorbox.best_colors .behr_color_menu a.bh_colornav8 {background: #f1f1f1}</div>
<div><br></div>
<div>/*3. by booms 메뉴*/</div>
<div>#behr_colorbox.by_rooms .behr_monitor .behr_color_menu ul li {width: 67px;}</div>
<div>#behr_colorbox.by_rooms .behr_color_menu a {background:#f2f2f2 url("https://behr.kr/colorbox/css/../icon/byroom.png") no-repeat;}</div>
<div>#behr_colorbox.by_rooms .behr_color_menu ul li:nth-child(odd) a {background-color:#e6e6e6;}</div>
<div>#behr_colorbox.by_rooms .behr_color_menu a.bh_colornav0 {background-position: 0 0 !important; }</div>
<div>#behr_colorbox.by_rooms .behr_color_menu a.bh_colornav1 {background-position: -99px 0 !important; }</div>
<div>#behr_colorbox.by_rooms .behr_color_menu a.bh_colornav2 {background-position: -198px 0 !important; }</div>
<div>#behr_colorbox.by_rooms .behr_color_menu a.bh_colornav3 {background-position: -297px 0 !important; }</div>
<div>#behr_colorbox.by_rooms .behr_color_menu a.bh_colornav4 {background-position: -396px 0 !important; }</div>
<div>#behr_colorbox.by_rooms .behr_color_menu a.bh_colornav5 {background-position: -495px 0 !important; }</div>
<div>#behr_colorbox.by_rooms .behr_color_menu a.bh_colornav6 {background-position: -594px 0 !important; }</div>
<div>#behr_colorbox.by_rooms .behr_color_menu a.bh_colornav7 {background-position: -693px 0 !important; }</div>
<div><br></div>
<div>/*4. by styles 메뉴*/</div>
<div>#behr_colorbox.by_styles .behr_monitor .behr_color_menu ul li {width: 67px;}</div>
<div>#behr_colorbox.by_styles .behr_color_menu a {background:#f2f2f2; position: relative;}</div>
<div>#behr_colorbox.by_styles .behr_color_menu ul li:nth-child(odd) a {background-color:#e6e6e6;}</div>
<div>#behr_colorbox.by_styles .behr_color_menu a span {color:#535353; line-height: 49px;font-size: 12px; letter-spacing: -0.02em}</div>
<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav0 span {color:#9f9480;}</div>
<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav1 span {color:#4fb3d0;}</div>
<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav2 span {color:#88a379;}</div>
<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav3 span {color:#848595;}</div>
<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav4 span {color:#81242b;}</div>
<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav5 span {color:#c1a889;}</div>
<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav6 span {color:#64a093;}</div>
<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav7 span {color:#839894;}</div>
<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav0.active {background:#9f9480;}</div>
<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav1.active {background:#4fb3d0;}</div>
<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav2.active {background:#88a379;}</div>
<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav3.active {background:#848595;}</div>
<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav4.active {background:#81242b;}</div>
<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav5.active {background:#c1a889;}</div>
<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav6.active {background:#64a093;}</div>
<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav7.active {background:#839894;}</div>
<div>#behr_colorbox.by_styles .behr_color_menu a.active span {color:#fff !important;line-height: 60px;}</div>
<div>#behr_colorbox.by_styles .behr_color_menu a.active {height: 60px; margin-top: -5px;border-radius: 5px; }</div>
<div><br></div>
<div>#behr_colorbox.all_colors .behr_color_menu a.active,</div>
<div>#behr_colorbox.best_colors .behr_color_menu a.active {background-image: url("https://behr.kr/colorbox/css/../icon/check.png"); background-repeat: no-repeat; background-position: 50% 50%; height: 60px; margin-top: -5px; border-radius: 5px; }</div>
<div>#behr_colorbox.by_rooms .behr_color_menu ul li a:hover {background-color: #535353; border-radius: 5px; }</div>
<div>#behr_colorbox.by_rooms .behr_color_menu ul li a span {position: absolute; top:-20px; text-align: center; color:#535353; width: 100%; left: 0; display:none;}</div>
<div>#behr_colorbox.by_rooms .behr_color_menu ul li a:hover span, #behr_colorbox.by_rooms .behr_color_menu ul li a.active span {position: absolute; top:-20px; text-align: center; display: block; color:#535353; width: 100%; left: 0;}</div>
<div>#behr_colorbox.by_rooms .behr_color_menu ul li a.active {background-color: #535353; height: 60px; margin-top: -5px; border-radius: 5px;}</div>
<div>#behr_colorbox.by_rooms .behr_color_menu a.active:after,</div>
<div>#behr_colorbox.by_styles .behr_color_menu a.active:after {position:absolute; content: '';display: block; width: 100%; height: 100%; top:0; left: :0;  background-image: url("https://behr.kr/colorbox/css/../icon/check.png"); background-repeat: no-repeat; background-position: 50% 50%; height: 60px; margin-top: -5px; border-radius: 5px; }</div>
<div><br></div>
<div>#behr_colorbox.by_styles .behr_color_menu ul li a u {position: absolute; top:-20px; text-align: center; color:#535353; width: 100%; left: 0; display:none; text-decoration: none;}</div>
<div>#behr_colorbox.by_styles .behr_color_menu ul li a:hover u, #behr_colorbox.by_styles .behr_color_menu ul li a.active u {position: absolute; top:-20px; text-align: center; display: block; color:#535353; width: 100%; left: 0;}</div>
<div><br></div>
<div><br></div>
<div>#behr_colorbox .cc_more_btn {position: absolute; left:184px; width: 208px; text-align: center;}</div>
<div>#behr_colorbox .cc_more_btn a {display: block; height: 37px; width: 208px; color: #535353; cursor: pointer;}</div>
<div>#behr_colorbox .cc_more_btn a i {display: inline-block; width: 35px; height: 35px; border-radius: 50%; background: #f9f9f9; vertical-align: middle; margin:0 10px;}</div>
<div>#behr_colorbox .cc_more_btn a span {display: inline-block; vertical-align: top; width: 50px; height: 35px; line-height: 31px; text-align: left;text-transform : capitalize}</div>
<div>#behr_colorbox .cc_more_btn a i.red {background:#b1383d }</div>
<div>#behr_colorbox .cc_more_btn a i.orange {background:#d3533a }</div>
<div>#behr_colorbox .cc_more_btn a i.yellow {background: #ffcb3a}</div>
<div>#behr_colorbox .cc_more_btn a i.green {background: #4f725a}</div>
<div>#behr_colorbox .cc_more_btn a i.blue {background:#006993 }</div>
<div>#behr_colorbox .cc_more_btn a i.mint {background: #86b9b2}</div>
<div>#behr_colorbox .cc_more_btn a i.purple {background: #7f657e}</div>
<div>#behr_colorbox .cc_more_btn.prev {top:167px;}</div>
<div>#behr_colorbox .cc_more_btn.next {top:850px;}</div>
<div>#behr_colorbox .cc_more_btn.prev a i {background-repeat: no-repeat; background-image: url("https://behr.kr/colorbox/css/../icon/a_up.png"); background-position: 50% 50%;}</div>
<div>#behr_colorbox .cc_more_btn.next a i {background-repeat: no-repeat; background-image: url("https://behr.kr/colorbox/css/../icon/a_down.png"); background-position: 50% 50%;}</div>
<div>#behr_colorbox.namelist .cc_more_btn {display: none !important}</div>
<div><br></div>
<div><br></div>
<div><br></div>
<div><br></div>
<div>/* 20180327 신령주 추가 */</div>
<div>#behr_colorbox span.cc_zoom {position:absolute; right:-10px; bottom:-5px; display:block; width:21px; height:21px; background:url("https://behr.kr/colorbox/css/../icon/zoomin.png") 0 0 no-repeat;}</div>
<div>#behr_colorbox .behr_nav ul li a:hover{background: #535353; color:#fff; height: 52px; line-height: 58px; font-size: 18px}</div>
<div>#behr_colorbox.all_colors .behr_color_menu ul.cc_submenu li a:hover {background-image: url("https://behr.kr/colorbox/css/../icon/check.png"); background-repeat: no-repeat; background-position: 50% 50%; height: 60px; margin-top: -5px; border-radius: 5px; }</div>
<div>#detailCanvas_list span.cc_zoom {display:none;}</div>
<div>#behr_colorbox.best_colors .behr_color_menu a:hover {background-image: url("https://behr.kr/colorbox/css/../icon/check.png"); background-repeat: no-repeat; background-position: 50% 50%; height: 60px; margin-top: -5px; border-radius: 5px; }</div>
<div>#behr_colorbox.by_rooms .behr_color_menu ul li a.active {background:#535353 url("https://behr.kr/colorbox/css/../icon/byroom_on.png") no-repeat;}</div>
<div>#behr_colorbox.by_rooms .behr_color_menu ul li a:hover {background:#535353 url("https://behr.kr/colorbox/css/../icon/byroom_on.png") no-repeat; height: 60px; margin-top: -5px; border-radius: 5px;}</div>
<div>#behr_colorbox.by_rooms .behr_color_menu ul li a:hover:after {position:absolute; content: '';display: block; width: 100%; height: 100%; top:0; left: :0;  background-image: url("https://behr.kr/colorbox/css/../check.png"); background-repeat: no-repeat; background-position: 50% 50%; height: 60px; margin-top: -5px; border-radius: 5px; }</div>
<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav0:hover {background:#9f9480;}</div>
<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav1:hover {background:#4fb3d0;}</div>
<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav2:hover {background:#88a379;}</div>
<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav3:hover {background:#848595;}</div>
<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav4:hover {background:#81242b;}</div>
<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav5:hover {background:#c1a889;}</div>
<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav6:hover {background:#64a093;}</div>
<div>#behr_colorbox.by_styles .behr_color_menu a.bh_colornav7:hover {background:#839894;}</div>
<div>#behr_colorbox.by_styles .behr_color_menu a:hover span {color:#fff !important;line-height: 60px;}</div>
<div>#behr_colorbox.by_styles .behr_color_menu a:hover {height: 60px; margin-top: -5px;border-radius: 5px; }</div>
<div>#behr_colorbox.by_styles .behr_color_menu a:hover:after {position:absolute; content: '';display: block; width: 100%; height: 100%; top:0; left: :0;  background-image: url("https://behr.kr/colorbox/css/../icon/check.png"); background-repeat: no-repeat; background-position: 50% 50%; height: 60px; margin-top: -5px; border-radius: 5px; }</div>
<div>#behr_colorbox.by_styles .behr_color_menu a {text-transform: capitalize;}</div>
<div><br></div>
<div>#detailCanvas_view span.cc_zoom {display:none;}</div>
<div>#behr_colorbox .detailCanvas_view span.cc_zoom {display:none;}</div>
<div>#detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .palette_del {position: absolute; top:5px; right:5px; cursor: pointer; width: 20px; height: 20px; background: url("https://behr.kr/colorbox/css/../icon/close.png") no-repeat 0 0; overflow: hidden; text-align: left; text-indent: -9999px; display:block;}</div>
<div>#detailCanvas #detailCanvas_color .detailCanvas_view .cc-box .palette_del:hover {background-position: 0 -20px;}</div>
<div>.behr_palette .pal_down {display:block; margin:0 auto !important; cursor:pointer;}</div>
<div>.behr_palette .pal_up {display:block; margin:0 auto 0 !important; padding-top:5px !important; cursor:pointer;}</div>
<div>.behr_palette #behr_palette_save {height:720px; overflow:hidden;}</div>
<div>#detailCanvas #detailCanvas_list.h90 {height:96px;}</div>
<div>#detailCanvas #detailCanvas_view.h90 {height:164px; top:140px;}&lt;/style&gt;</div>
<div>
<span style="white-space:pre;"></span>&lt;script type="text/javascript" src="/colorbox/js/colorbox_iframe.js?ver=1"&gt;&lt;/script&gt;</div>
<div>
<span style="white-space:pre;"></span>&lt;script type="text/javascript"&gt;</div>
<div>
<span style="white-space:pre;"></span>var buyInput = "textinput"; <span style="white-space:pre;"></span>//컬러값 입력하는곳의 아이디입력</div>
<div>
<span style="white-space:pre;"></span>var ccDisplay = "off"; <span style="white-space:pre;"></span>//컬러값 선택후 컬러챠트 사라는 기능 on/off</div>
<div>
<span style="white-space:pre;"></span>var cckwd = new Array("coffee","silver","vintage","lemon","red","green","pink"); <span style="white-space:pre;"></span>//추천키워드 최대 7개</div>
<div>
<span style="white-space:pre;"></span>&lt;/script&gt;</div>
<div>
<span style="white-space:pre;"></span>&lt;div id="behr_colorbox" class="sch_color by_rooms"&gt;&lt;div class="behr_nav"&gt; <span style="white-space:pre;"></span>&lt;ul&gt; <span style="white-space:pre;"></span>&lt;li&gt;&lt;a class="ccsubmenu" data-cc_category="all_colors"&gt;All Colors&lt;/a&gt;&lt;/li&gt; <span style="white-space:pre;"></span>&lt;li&gt;&lt;a class="ccsubmenu" data-cc_category="best_colors"&gt;Best Colors&lt;/a&gt;&lt;/li&gt; <span style="white-space:pre;"></span>&lt;li&gt;&lt;a class="ccsubmenu active" data-cc_category="by_rooms"&gt;By Rooms&lt;/a&gt;&lt;/li&gt; <span style="white-space:pre;"></span>&lt;li&gt;&lt;a class="ccsubmenu" data-cc_category="by_styles"&gt;By Styles&lt;/a&gt;&lt;/li&gt; <span style="white-space:pre;"></span>&lt;li&gt;&lt;a class="ccsearch"&gt;Search&lt;/a&gt;&lt;/li&gt; <span style="white-space:pre;"></span>&lt;/ul&gt; <span style="white-space:pre;"></span>&lt;/div&gt; <span style="white-space:pre;"></span>&lt;div class="behr_monitor"&gt; <span style="white-space:pre;"></span>&lt;div class="behr_inner"&gt; <span style="white-space:pre;"></span>&lt;div class="behr_color_menu"&gt; <span style="white-space:pre;"></span>&lt;ul class="cc_submenu"&gt;&lt;li&gt;&lt;a data-group="BEDROOM" class="bh_colornav0 active"&gt;&lt;span&gt;침실&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a data-group="BATHROOM" class="bh_colornav1"&gt;&lt;span&gt;욕실&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a data-group="KIDSROOM" class="bh_colornav2"&gt;&lt;span&gt;아이방&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a data-group="LIVINGROOM" class="bh_colornav3"&gt;&lt;span&gt;거실&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a data-group="KITCHEN" class="bh_colornav4"&gt;&lt;span&gt;부엌&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a data-group="DININGROOM" class="bh_colornav5"&gt;&lt;span&gt;주방&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a data-group="OFFICE" class="bh_colornav6"&gt;&lt;span&gt;서재&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a data-group="EXTERIOR" class="bh_colornav7"&gt;&lt;span&gt;실외공간&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt; <span style="white-space:pre;"></span>&lt;/div&gt; <span style="white-space:pre;"></span>&lt;div id="cc_search_area" style="display: none;"&gt; <span style="white-space:pre;"></span>&lt;div class="cc_search"&gt; <span style="white-space:pre;"></span>&lt;label&gt;컬러찾기&lt;/label&gt;&lt;input type="text" id="cc_search_btn" placeholder="컬러번호 또는 컬러명으로 검색하세요"&gt; <span style="white-space:pre;"></span>&lt;/div&gt; <span style="white-space:pre;"></span>&lt;div id="cckeywordauto"&gt; <span style="white-space:pre;"></span>&lt;ul&gt;&lt;li&gt;&lt;a&gt;coffee&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a&gt;silver&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a&gt;vintage&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a&gt;lemon&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a&gt;red&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a&gt;green&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a&gt;pink&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt; <span style="white-space:pre;"></span>&lt;/div&gt; <span style="white-space:pre;"></span>&lt;div id="ccsearchOutput"&gt;&lt;span id="cckeyword"&gt;coffee&lt;/span&gt;검색결과&lt;/div&gt; <span style="white-space:pre;"></span>&lt;/div&gt; <span style="white-space:pre;"></span>&lt;/div&gt; <span style="white-space:pre;"></span>&lt;div class="behr_colorChart" style="display: block;"&gt;&lt;div class="cc-box" data-ccid="0" data-name="PALE CORAL" data-code="PPU3-07" data-rgb="#F0D0B5" data-tcol="B" data-scroll="0" style="background:#F0D0B5;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;PALE CORAL&lt;span&gt;PPU3-07&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="1" data-name="COCO" data-code="N270-3" data-rgb="#D1BBA2" data-tcol="B" data-scroll="0" style="background:#D1BBA2;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;COCO&lt;span&gt;N270-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="2" data-name="STUDIO TAUPE" data-code="PPU5-07" data-rgb="#A5978A" data-tcol="W" data-scroll="0" style="background:#A5978A;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;STUDIO TAUPE&lt;span&gt;PPU5-07&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="3" data-name="CHATEAU" data-code="PPU7-06" data-rgb="#B5A18B" data-tcol="B" data-scroll="0" style="background:#B5A18B;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;CHATEAU&lt;span&gt;PPU7-06&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="4" data-name="DISTANT LAND" data-code="N260-5" data-rgb="#A68A72" data-tcol="W" data-scroll="0" style="background:#A68A72;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;DISTANT LAND&lt;span&gt;N260-5&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="5" data-name="ANTIQUE WHITE" data-code="23" data-rgb="#E8DDCB" data-tcol="B" data-scroll="0" style="background:#E8DDCB;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;ANTIQUE WHITE&lt;span&gt;23&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="6" data-name="CURIOUS COLLECTION" data-code="N290-4" data-rgb="#D2BB9A" data-tcol="B" data-scroll="0" style="background:#D2BB9A;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;CURIOUS COLLECTION&lt;span&gt;N290-4&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="7" data-name="DOESKIN GRAY" data-code="N200-2" data-rgb="#CCC3BB" data-tcol="B" data-scroll="0" style="background:#CCC3BB;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;DOESKIN GRAY&lt;span&gt;N200-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="8" data-name="WASABI POWDER" data-code="PPU9-10" data-rgb="#BDB390" data-tcol="B" data-scroll="0" style="background:#BDB390;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;WASABI POWDER&lt;span&gt;PPU9-10&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="9" data-name="MINTED LEMON" data-code="PPU10-08" data-rgb="#C0C6A9" data-tcol="B" data-scroll="0" style="background:#C0C6A9;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;MINTED LEMON&lt;span&gt;PPU10-08&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="10" data-name="RIVERDALE" data-code="N410-3" data-rgb="#BEC5BC" data-tcol="B" data-scroll="0" style="background:#BEC5BC;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;RIVERDALE&lt;span&gt;N410-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="11" data-name="ZEN" data-code="PPU11-14" data-rgb="#AABAB0" data-tcol="B" data-scroll="0" style="background:#AABAB0;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;ZEN&lt;span&gt;PPU11-14&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="12" data-name="ATMOSPHERIC" data-code="PPU12-15" data-rgb="#899698" data-tcol="B" data-scroll="0" style="background:#899698;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;ATMOSPHERIC&lt;span&gt;PPU12-15&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="13" data-name="OBSERVATORY" data-code="PPU13-19" data-rgb="#455D66" data-tcol="W" data-scroll="0" style="background:#455D66;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;OBSERVATORY&lt;span&gt;PPU13-19&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="14" data-name="FLOWING BREEZE" data-code="N480-2" data-rgb="#B9C6CC" data-tcol="B" data-scroll="0" style="background:#B9C6CC;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;FLOWING BREEZE&lt;span&gt;N480-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="15" data-name="FOREVER DENIM" data-code="PPU14-05" data-rgb="#778591" data-tcol="W" data-scroll="0" style="background:#778591;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;FOREVER DENIM&lt;span&gt;PPU14-05&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="16" data-name="CATHEDRAL GRAY" data-code="PPU18-14" data-rgb="#ACAAA8" data-tcol="B" data-scroll="0" style="background:#ACAAA8;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;CATHEDRAL GRAY&lt;span&gt;PPU18-14&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="17" data-name="SUEDE GRAY" data-code="PPU18-17" data-rgb="#857F7B" data-tcol="W" data-scroll="0" style="background:#857F7B;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;SUEDE GRAY&lt;span&gt;PPU18-17&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="18" data-name="FRENCH LILAC" data-code="PPU16-10" data-rgb="#BDB8BB" data-tcol="B" data-scroll="0" style="background:#BDB8BB;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;FRENCH LILAC&lt;span&gt;PPU16-10&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="19" data-name="SO MERLOT" data-code="PPU1-15" data-rgb="#84525B" data-tcol="W" data-scroll="0" style="background:#84525B;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;SO MERLOT&lt;span&gt;PPU1-15&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="20" data-name="BLACKBERRY JAM" data-code="S100-6" data-rgb="#6F5F71" data-tcol="W" data-scroll="0" style="background:#6F5F71;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;BLACKBERRY JAM&lt;span&gt;S100-6&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="21" data-name="LUXE LILAC" data-code="N560-3" data-rgb="#A7A3B2" data-tcol="B" data-scroll="0" style="background:#A7A3B2;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;LUXE LILAC&lt;span&gt;N560-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="22" data-name="BLUEPRINT" data-code="S470-5" data-rgb="#5F818F" data-tcol="W" data-scroll="0" style="background:#5F818F;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;BLUEPRINT&lt;span&gt;S470-5&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="23" data-name="HALF SEA FOG" data-code="N470-3" data-rgb="#A9B7BC" data-tcol="B" data-scroll="0" style="background:#A9B7BC;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;HALF SEA FOG&lt;span&gt;N470-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="24" data-name="SILVER BULLET" data-code="N520-2" data-rgb="#C4C4C4" data-tcol="B" data-scroll="0" style="background:#C4C4C4;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;SILVER BULLET&lt;span&gt;N520-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="25" data-name="MINED COAL" data-code="PPU18-18" data-rgb="#6C6A66" data-tcol="W" data-scroll="0" style="background:#6C6A66;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;MINED COAL&lt;span&gt;PPU18-18&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="26" data-name="JUNGLE CAMOUFLAGE" data-code="N350-4" data-rgb="#AAA795" data-tcol="B" data-scroll="0" style="background:#AAA795;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;JUNGLE CAMOUFLAGE&lt;span&gt;N350-4&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="27" data-name="KINDLING" data-code="N200-6" data-rgb="#7A7069" data-tcol="W" data-scroll="0" style="background:#7A7069;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;KINDLING&lt;span&gt;N200-6&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="28" data-name="HARMONIOUS GOLD" data-code="M300-3" data-rgb="#E9CFA4" data-tcol="B" data-scroll="0" style="background:#E9CFA4;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;HARMONIOUS GOLD&lt;span&gt;M300-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="29" data-name="LUNAR SURFACE" data-code="N460-3" data-rgb="#B5B9B7" data-tcol="B" data-scroll="0" style="background:#B5B9B7;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;LUNAR SURFACE&lt;span&gt;N460-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="30" data-name="CANVAS LUGGAGE" data-code="N300-2" data-rgb="#E1D7C7" data-tcol="B" data-scroll="0" style="background:#E1D7C7;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;CANVAS LUGGAGE&lt;span&gt;N300-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="31" data-name="BREATHE" data-code="S360-2" data-rgb="#D1D1B9" data-tcol="B" data-scroll="0" style="background:#D1D1B9;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;BREATHE&lt;span&gt;S360-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="32" data-name="METROPOLIS" data-code="N140-3" data-rgb="#B3A9A6" data-tcol="B" data-scroll="0" style="background:#B3A9A6;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;METROPOLIS&lt;span&gt;N140-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="33" data-name="LINEN WHITE" data-code="70" data-rgb="#F6ECD8" data-tcol="B" data-scroll="0" style="background:#F6ECD8;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;LINEN WHITE&lt;span&gt;70&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="34" data-name="ANONYMOUS" data-code="780F-5" data-rgb="#939392" data-tcol="W" data-scroll="0" style="background:#939392;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;ANONYMOUS&lt;span&gt;780F-5&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="35" data-name="DRY BROWN" data-code="N230-5" data-rgb="#968375" data-tcol="W" data-scroll="0" style="background:#968375;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;DRY BROWN&lt;span&gt;N230-5&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="36" data-name="PERFECT TAUPE" data-code="PPU18-13" data-rgb="#B5ACA1" data-tcol="B" data-scroll="0" style="background:#B5ACA1;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;PERFECT TAUPE&lt;span&gt;PPU18-13&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="37" data-name="STERLING" data-code="780E-3" data-rgb="#D2D4D3" data-tcol="B" data-scroll="0" style="background:#D2D4D3;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;STERLING&lt;span&gt;780E-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="38" data-name="SUBTLE TOUCH" data-code="790E-1" data-rgb="#DBDADA" data-tcol="B" data-scroll="0" style="background:#DBDADA;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;SUBTLE TOUCH&lt;span&gt;790E-1&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="39" data-name="FRENCH SILVER" data-code="PPU18-05" data-rgb="#B8BCBE" data-tcol="B" data-scroll="0" style="background:#B8BCBE;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;FRENCH SILVER&lt;span&gt;PPU18-05&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="40" data-name="FLANNEL GRAY" data-code="N520-3" data-rgb="#ADADAD" data-tcol="B" data-scroll="0" style="background:#ADADAD;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;FLANNEL GRAY&lt;span&gt;N520-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="41" data-name="ULTRA PURE WHITE PRW15" data-code="PR-W15" data-rgb="#F8F9F5" data-tcol="B" data-scroll="0" style="background:#F8F9F5;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;ULTRA PURE WHITE PRW15&lt;span&gt;PR-W15&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="42" data-name="WHITE METAL" data-code="N520-1" data-rgb="#D0D0D0" data-tcol="B" data-scroll="0" style="background:#D0D0D0;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;WHITE METAL&lt;span&gt;N520-1&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="43" data-name="BURNISHED CLAY" data-code="PPU18-09" data-rgb="#D2CCC5" data-tcol="B" data-scroll="0" style="background:#D2CCC5;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;BURNISHED CLAY&lt;span&gt;PPU18-09&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="44" data-name="DARK NAVY" data-code="S530-7" data-rgb="#40495B" data-tcol="W" data-scroll="0" style="background:#40495B;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;DARK NAVY&lt;span&gt;S530-7&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="45" data-name="DARK PEWTER" data-code="PPU18-04" data-rgb="#8D9397" data-tcol="W" data-scroll="0" style="background:#8D9397;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;DARK PEWTER&lt;span&gt;PPU18-04&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="46" data-name="POLAR BEAR" data-code="75" data-rgb="#F5F3ED" data-tcol="B" data-scroll="0" style="background:#F5F3ED;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;POLAR BEAR&lt;span&gt;75&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="47" data-name="CHICAGO FOG" data-code="N140-2" data-rgb="#C9C1BE" data-tcol="B" data-scroll="0" style="background:#C9C1BE;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;CHICAGO FOG&lt;span&gt;N140-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="48" data-name="SPUN WOOL" data-code="N220-1" data-rgb="#E3DDD6" data-tcol="B" data-scroll="0" style="background:#E3DDD6;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;SPUN WOOL&lt;span&gt;N220-1&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="49" data-name="BOOT CUT" data-code="S510-2" data-rgb="#AEC1D0" data-tcol="B" data-scroll="0" style="background:#AEC1D0;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;BOOT CUT&lt;span&gt;S510-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;div class="cc-box-img"&gt;&lt;div class="cc-box-imgbox"&gt;&lt;img src="/colorbox/img/byrooms/Bed01.jpg" alt="이미지1번입니다."&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="57" data-name="GENTLE SEA" data-code="S470-2" data-rgb="#B0C8D1" data-tcol="B" data-scroll="i" style="background:#B0C8D1;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;GENTLE SEA&lt;span&gt;S470-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="58" data-name="POLAR BEAR" data-code="75" data-rgb="#F5F3ED" data-tcol="B" data-scroll="i" style="background:#F5F3ED;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;POLAR BEAR&lt;span&gt;75&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class="cc-box-img"&gt;&lt;div class="cc-box-imgbox"&gt;&lt;img src="/colorbox/img/byrooms/Bed02.jpg" alt="이미지2번입니다"&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="63" data-name="UNDINE" data-code="M450-4" data-rgb="#89C0BC" data-tcol="B" data-scroll="i" style="background:#89C0BC;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;UNDINE&lt;span&gt;M450-4&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="64" data-name="CARBON" data-code="N520-7" data-rgb="#3D3E3F" data-tcol="W" data-scroll="i" style="background:#3D3E3F;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;CARBON&lt;span&gt;N520-7&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="65" data-name="SPANISH SAND" data-code="OR-W7" data-rgb="#DCD0BE" data-tcol="B" data-scroll="i" style="background:#DCD0BE;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;SPANISH SAND&lt;span&gt;OR-W7&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class="cc-box-img"&gt;&lt;div class="cc-box-imgbox"&gt;&lt;img src="/colorbox/img/byrooms/Bed03.jpg" alt="이미지3번입니다"&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="69" data-name="CHATEAU" data-code="PPU7-06" data-rgb="#B5A18B" data-tcol="B" data-scroll="i" style="background:#B5A18B;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;CHATEAU&lt;span&gt;PPU7-06&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="70" data-name="POLAR BEAR" data-code="75" data-rgb="#F5F3ED" data-tcol="B" data-scroll="i" style="background:#F5F3ED;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;POLAR BEAR&lt;span&gt;75&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="71" data-name="BLACKOUT" data-code="N510-7" data-rgb="#413F3F" data-tcol="W" data-scroll="i" style="background:#413F3F;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;BLACKOUT&lt;span&gt;N510-7&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class="cc-box-img"&gt;&lt;div class="cc-box-imgbox"&gt;&lt;img src="/colorbox/img/byrooms/Bed04.jpg" alt="이미지4번입니다"&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="75" data-name="AGED BEIGE" data-code="PPU7-09" data-rgb="#D7CFC1" data-tcol="B" data-scroll="i" style="background:#D7CFC1;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;AGED BEIGE&lt;span&gt;PPU7-09&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="76" data-name="PURE EARTH" data-code="PPU7-05" data-rgb="#A79481" data-tcol="W" data-scroll="i" style="background:#A79481;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;PURE EARTH&lt;span&gt;PPU7-05&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="77" data-name="WHITE" data-code="1852" data-rgb="#EBEAE7" data-tcol="B" data-scroll="i" style="background:#EBEAE7;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;WHITE&lt;span&gt;1852&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class="cc-box-img"&gt;&lt;div class="cc-box-imgbox"&gt;&lt;img src="/colorbox/img/byrooms/Bed05.jpg" alt="이미지5번입니다"&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="81" data-name="FUTURE VISION" data-code="N100-3" data-rgb="#BCB5BD" data-tcol="B" data-scroll="i" style="background:#BCB5BD;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;FUTURE VISION&lt;span&gt;N100-3&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="82" data-name="ULTRA PURE WHITE" data-code="PPU18-06" data-rgb="#F8F8F4" data-tcol="B" data-scroll="i" style="background:#F8F8F4;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;ULTRA PURE WHITE&lt;span&gt;PPU18-06&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class="cc-box-img"&gt;&lt;div class="cc-box-imgbox"&gt;&lt;img src="/colorbox/img/byrooms/Bed06.jpg" alt="이미지6번입니다"&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="87" data-name="PALE PARSNIP" data-code="S320-2" data-rgb="#E3D7C1" data-tcol="B" data-scroll="i" style="background:#E3D7C1;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;PALE PARSNIP&lt;span&gt;S320-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="88" data-name="SLEEK WHITE" data-code="OR-W15" data-rgb="#FAF5EB" data-tcol="B" data-scroll="i" style="background:#FAF5EB;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;SLEEK WHITE&lt;span&gt;OR-W15&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="89" data-name="MAUVELOUS" data-code="BNC-12" data-rgb="#B5A49E" data-tcol="B" data-scroll="i" style="background:#B5A49E;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;MAUVELOUS&lt;span&gt;BNC-12&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class="cc-box-img"&gt;&lt;div class="cc-box-imgbox"&gt;&lt;img src="/colorbox/img/byrooms/Bed07.jpg" alt="이미지7번입니다"&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="93" data-name="ROMAN PLASTER" data-code="PPU7-10" data-rgb="#DDD1C0" data-tcol="B" data-scroll="i" style="background:#DDD1C0;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;ROMAN PLASTER&lt;span&gt;PPU7-10&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="94" data-name="SWISS COFFEE" data-code="12" data-rgb="#F1ECE1" data-tcol="B" data-scroll="i" style="background:#F1ECE1;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;SWISS COFFEE&lt;span&gt;12&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="95" data-name="JOURNEYS END" data-code="S520-2" data-rgb="#BAC9D6" data-tcol="B" data-scroll="i" style="background:#BAC9D6;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;JOURNEYS END&lt;span&gt;S520-2&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box-none"&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class="cc-box-img"&gt;&lt;div class="cc-box-imgbox"&gt;&lt;img src="/colorbox/img/byrooms/Bed08.jpg" alt="이미지8번입니다"&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="99" data-name="PARK AVENUE" data-code="MQ2-55" data-rgb="#bbb2a9" data-tcol="B" data-scroll="i" style="background:#bbb2a9;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;PARK AVENUE&lt;span&gt;MQ2-55&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="100" data-name="COLD STEEL" data-code="MQ5-20" data-rgb="#808f99" data-tcol="W" data-scroll="i" style="background:#808f99;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;COLD STEEL&lt;span&gt;MQ5-20&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="101" data-name="CREME DE LA CREME" data-code="MQ3-33" data-rgb="#e2ddd8" data-tcol="B" data-scroll="i" style="background:#e2ddd8;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;CREME DE LA CREME&lt;span&gt;MQ3-33&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;div class="cc-box" data-ccid="102" data-name="UNPREDICTABLE HUE" data-code="MQ2-58" data-rgb="#7b746c" data-tcol="W" data-scroll="i" style="background:#7b746c;"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;UNPREDICTABLE HUE&lt;span&gt;MQ2-58&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt; <span style="white-space:pre;"></span>&lt;/div&gt; <span style="white-space:pre;"></span>&lt;div class="behr_selectColor"&gt; <span style="white-space:pre;"></span>&lt;h3&gt;My BEHR Colors&lt;/h3&gt; <span style="white-space:pre;"></span>&lt;div class="behr_palette"&gt; <span style="white-space:pre;"></span>&lt;div class="behr_palette_guide"&gt; <span style="white-space:pre;"></span>크게 보고 싶은 컬러를 눌러 보세요. <span style="white-space:pre;"></span>&lt;/div&gt; <span style="white-space:pre;"></span>&lt;div id="behr_palette_save"&gt; <span style="white-space:pre;"></span>&lt;/div&gt; <span style="white-space:pre;"></span>&lt;/div&gt; <span style="white-space:pre;"></span>&lt;div id="detailCanvas" style="display: none;"&gt;&lt;div id="detailCanvas_list"&gt;&lt;div class="cc-box" data-ccid="94" data-name="SWISS COFFEE" data-code="12" data-rgb="#F1ECE1" data-tcol="B" data-scroll="i" style=";"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;SWISS COFFEE&lt;span&gt;12&lt;/span&gt;&lt;/p&gt;&lt;a class="cc-view" style="background:#F1ECE1;"&gt;&lt;span class="cc_zoom"&gt;&lt;/span&gt;&lt;/a&gt;&lt;a class="palette_del"&gt;삭제&lt;/a&gt;&lt;/div&gt;&lt;div class="cc-box active" data-ccid="95" data-name="JOURNEYS END" data-code="S520-2" data-rgb="#BAC9D6" data-tcol="B" data-scroll="i" style=";"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;JOURNEYS END&lt;span&gt;S520-2&lt;/span&gt;&lt;/p&gt;&lt;a class="cc-view" style="background:#BAC9D6;"&gt;&lt;span class="cc_zoom"&gt;&lt;/span&gt;&lt;/a&gt;&lt;a class="palette_del"&gt;삭제&lt;/a&gt;&lt;/div&gt; <span style="white-space:pre;"></span>&lt;/div&gt;&lt;div id="detailCanvas_view"&gt;&lt;div class="cc-box active" data-ccid="95" data-name="JOURNEYS END" data-code="S520-2" data-rgb="#BAC9D6" data-tcol="B" data-scroll="i" style=";"&gt; <span style="white-space:pre;"></span>&lt;p class="cc-name"&gt;JOURNEYS END&lt;span&gt;S520-2&lt;/span&gt;&lt;/p&gt;&lt;a class="cc-view" style="background:#BAC9D6;"&gt;&lt;span class="cc_zoom"&gt;&lt;/span&gt;&lt;/a&gt;&lt;a class="palette_del"&gt;삭제&lt;/a&gt;&lt;a class="detailColorvs_buyBtn"&gt;주문하기&lt;/a&gt;&lt;/div&gt;&lt;/div&gt; <span style="white-space:pre;"></span>&lt;div id="detailCanvas_color"&gt; <span style="white-space:pre;"></span>&lt;a class="detailCanvas_btn detailCanvas_btn01" data-index="0"&gt;1번색상선택&lt;/a&gt; <span style="white-space:pre;"></span>&lt;a class="detailCanvas_btn detailCanvas_btn02" data-index="1"&gt;2번색상선택&lt;/a&gt; <span style="white-space:pre;"></span>&lt;a class="detailCanvas_btn detailCanvas_btn03" data-index="2"&gt;3번색상선택&lt;/a&gt; <span style="white-space:pre;"></span>&lt;div class="detailCanvas_view detailCanvas_view01"&gt;&lt;/div&gt; <span style="white-space:pre;"></span>&lt;div class="detailCanvas_view detailCanvas_view02"&gt;&lt;/div&gt; <span style="white-space:pre;"></span>&lt;div class="detailCanvas_view detailCanvas_view03"&gt;&lt;/div&gt; <span style="white-space:pre;"></span>&lt;/div&gt;&lt;a class="detailCanvas_close"&gt;닫기&lt;/a&gt;&lt;/div&gt; <span style="white-space:pre;"></span>&lt;/div&gt; <span style="white-space:pre;"></span>&lt;div class="loading" style="display: none;"&gt;&lt;img src="/colorbox/icon/ajax-loader.gif"&gt;&lt;/div&gt;&lt;div class="wh-ov" style="display: none;"&gt;&lt;/div&gt;&lt;/div&gt;</div>
<div>
<span style="white-space:pre;"></span>&lt;!-- } 컬러챠트 삽입 --&gt;&lt;/article&gt;&lt;/body&gt;&lt;/html&gt;</div>
<div>&lt;/iframe&gt;&lt;/center&gt;</div>
</div>
<div><br></div>
<div><br></div>
<div><br></div>
<div><br></div>
<div><br></div>
<div><br></div>
<div><br></div>
<div><br></div>
<div>이렇게 넣으면 되는거 아닌가요? ㅠㅠ 안되네요</div>
					

					
					
						
						

						
						

						
						
					
				</div></h2>
<br>


<!-- kin ad -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-9176212351894019"
     data-ad-slot="7193423339"
     data-ad-format="auto"
     data-full-width-responsive="true"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script>

</div><br>
</section>
</article>
<div id="bo_v_bot">

</div>

<!--
<div id="cboard"></div>
<script>
var mobileKeyWords=new Array('iPhone','iPod','BlackBerry','Android','Windows CE','Windows CE;','LG','MOT','SAMSUNG','SonyEricsson','Mobile','Symbian','Opera Mobi','Opera Mini','IEmobile');for(var word in mobileKeyWords){if(navigator.userAgent.match(mobileKeyWords[word])!=null){document.getElementById("cboard").innerHTML="<iframe id='cboard_frame' onload='cboardLoaded()' width='100%' height='100%' frameborder='0' src='/dddd_mobile.php' scrolling='no'></iframe>";break;}
else{document.getElementById("cboard").innerHTML="<iframe src='/dddd.php' width='100%' height='227' frameborder='0' scrolling='no' border='0' marginwidth='0' marginheight='0'></iframe>";}}
function cboardLoaded(){let frame=document.getElementById('cboard_frame');let height=document.getElementById('cboard_frame').contentWindow.document.body.scrollHeight;frame.height=height+"px";}
</script>
-->

<style>
h4 {
font-weight: normal;
}
</style>
	
<button type="button" class="cmt_btn">댓글목록 1</button>

<section id="bo_vc">
<article>  <header>      <span class="comment_profile_img"><img src="https://cboard.net/img/no_profile.gif" width="40" height="40" alt="profile_image"></span>      익명      <span class="sound_only">작성일</span>      <span class="bo_vc_hdinfo">-</span>  </header>  <div class="cmt_contents">      <p><h4><div class="answerDetail _endContents _endContentsText">
		<div class="se-viewer se-theme-default" lang="ko-KR">    <!-- SE_DOC_HEADER_START -->    <!--@CONTENTS_HEADER-->    <!-- SE_DOC_HEADER_END -->    <div class="se-main-container">                <div class="se-component se-text se-l-default" id="SE-f2c45377-e2ad-4089-b1b2-5e697378f5b2">                    <div class="se-component-content">                        <div class="se-section se-section-text se-l-default">                            <div class="se-module se-module-text">                                    <!-- SE-TEXT { --><p class="se-text-paragraph se-text-paragraph-align- " style="" id="SE-56d5dcde-8f0f-439b-838c-d175f7d18539"><span style="" class="se-fs- se-ff-   " id="SE-6b229d3a-0e1e-4701-9cda-73da608ae647">죄송한데 이렇게 질문하면 못 알아봅니다..ㅠㅠ</span></p>
<!-- } SE-TEXT --><!-- SE-TEXT { --><p class="se-text-paragraph se-text-paragraph-align- " style="" id="SE-e29c57b8-2ac0-472d-ab7b-21d6be26b41a"><span style="" class="se-fs- se-ff-   " id="SE-adf3e85e-229a-4ec2-b863-6a0075045bb3">깃허브나 hastebin에 소스 올리셔서 얘기해주시면 편할 것 같습니다.</span></p>
<!-- } SE-TEXT -->                            </div>                        </div>                    </div>                </div>    </div>
</div>
	</div></h4></p>  </div></article>

<!--
<article>
    <header>
        <span class="comment_profile_img"><img src="https://cboard.net/img/no_profile.gif" width="40" height="40" alt="profile_image"></span>
        익명
        <span class="sound_only">작성일</span>
        <span class="bo_vc_hdinfo">-</span>
    </header>

    <div class="cmt_contents">

    </div>
</article>
-->

<aside id="bo_vc_w">
<b>댓글쓰기</b>
<form name="fviewcomment" id="fviewcomment" action="https://cboard.net/bbs/kin_comment_update.php" onsubmit="return fviewcomment_submit(this);" method="post" autocomplete="off" class="bo_vc_w">
<input type="hidden" name="post_id" value="1_1040205_428878900">
<textarea id="wr_content" name="wr_content" required title="댓글 내용" placeholder="댓글내용을 입력해주세요"></textarea>
<div class="bo_vc_w_wr">

<div class="btn_confirm">
<input type="submit" id="btn_submit" class="btn_submit btn" value="댓글등록">
<div id="loading" style="display: none;">
  <p>댓글을 등록중입니다...</p>
  <div class="loader"></div>
</div>
</div>

</div>
</form>
</aside>

<style>
.loader {
  border: 16px solid #f3f3f3; /* Light grey */
  border-top: 16px solid #3498db; /* Blue */
  border-radius: 50%;
  width: 120px;
  height: 120px;
  animation: spin 2s linear infinite;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
</style>

<script>
document.getElementById('fviewcomment').addEventListener('submit', function() {
    // 제출 버튼을 누르면 버튼을 숨기고 로딩 바를 표시
    document.getElementById('btn_submit').style.display = "none";
    document.getElementById('loading').style.display = "block";
});
</script>


<!--
    <article id="c_56151">
        <header>
            <span class="comment_profile_img"><img src="https://cboard.net/img/no_profile.gif" width="40" height="40" alt="profile_image"></span>
            맙소사
            <span class="sound_only">작성일</span>
            <span class="bo_vc_hdinfo">-</span>
        </header>

        <div class="cmt_contents">
            <p>대황북미의 압박감</p>
        </div>
    </article>

    <article id="c_56152">
        <header>
            <span class="comment_profile_img"><img src="https://cboard.net/img/no_profile.gif" width="40" height="40" alt="profile_image"></span>
            Saito Shuka
            <span class="sound_only">작성일</span>
            <span class="bo_vc_hdinfo">-</span>
        </header>
        <div class="cmt_contents">
		<p>대 황 북 미 </p>
            <div class="bo_vl_opt">
                <button class="cmt_opt"><span class="sound_only">댓글옵션</span><i class="fa fa-ellipsis-v" aria-hidden="true"></i></button>
                <ul class="bo_vl_act btn_edit">
                    <li><a href="https://cboard.net/leagueoflegends/56150?rewrite=1&amp;c_id=56152&amp;w=c#bo_vc_w" onclick="comment_box('56152', 'c'); return false;" rel="nofollow"><i class="fa fa-reply"></i>답변</a></li>
                    <li><a href="https://cboard.net/bbs/password.php?w=x&amp;bo_table=leagueoflegends&amp;comment_id=56152&amp;page=1" onclick="return comment_delete();" rel="nofollow"><i class="fa fa-trash"></i>삭제</a></li>
                </ul>
            </div>
        </div>
        <span id="edit_56152"></span>
        <span id="reply_56152"></span>
        <input type="hidden" id="secret_comment_56152" value="">
        <textarea id="save_comment_56152" style="display:none">대 황 북 미</textarea>
    </article>

    <article id="c_56153">
        <header>
            <span class="comment_profile_img"><img src="https://cboard.net/img/no_profile.gif" width="40" height="40" alt="profile_image"></span>
            나..아니라니까
            <span class="sound_only">작성일</span>
            <span class="bo_vc_hdinfo">-</span>
        </header>
        <div class="cmt_contents">
		<p>북미제일검 </p>
            <div class="bo_vl_opt">
                <button class="cmt_opt"><span class="sound_only">댓글옵션</span><i class="fa fa-ellipsis-v" aria-hidden="true"></i></button>
                <ul class="bo_vl_act btn_edit">
                    <li><a href="https://cboard.net/leagueoflegends/56150?rewrite=1&amp;c_id=56153&amp;w=c#bo_vc_w" onclick="comment_box('56153', 'c'); return false;" rel="nofollow"><i class="fa fa-reply"></i>답변</a></li>
                    <li><a href="https://cboard.net/bbs/password.php?w=x&amp;bo_table=leagueoflegends&amp;comment_id=56153&amp;page=1" onclick="return comment_delete();" rel="nofollow"><i class="fa fa-trash"></i>삭제</a></li>
                </ul>
            </div>
        </div>
        <span id="edit_56153"></span>
        <span id="reply_56153"></span>
        <input type="hidden" id="secret_comment_56153" value="">
        <textarea id="save_comment_56153" style="display:none">북미제일검</textarea>
    </article>
	-->

</section>

<!--
<div id="myImage"></div>
<script>
    function deviceDetect() {
        if (/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) {
            return true;
        } else {
            return false;
        }
    }

    window.onload = function() {
        var mobileImage = '<p><a href="https://cboard.net/kin/write?"><img src="https://cdn.discordapp.com/attachments/640532950542450688/1136286319425880084/-001_4.png" style="max-width: 100%; height: auto;"></a></p>';
        var desktopImage = '<p><a href="https://cboard.net/kin/write?"><img src="https://cdn.discordapp.com/attachments/640532950542450688/1136284287440801923/-001_2.png" style="max-width: 100%; height: auto;"></a></p>';

        var htmlToAdd = deviceDetect() ? mobileImage : desktopImage;
        document.getElementById('myImage').innerHTML = htmlToAdd;
    }
</script>
-->

<style>
  .related-list {
    border: 1px solid #ccc;
    border-radius: 5px;
    margin-top: 20px;
    padding: 10px;
  }

  .related-list-title {
    font-weight: bold;
    margin-bottom: 10px;
  }

  .related-list-item {
    margin-bottom: 5px;
  }

  .related-list-item-link {
    color: #333;
    text-decoration: none;
  }

  .related-list-item-link:hover {
    text-decoration: underline;
  }

#my-custom-style .related-list-title {
    font-size: 20px; /* 큰 글씨로 제목 설정 */
    color: #333; /* 진한 회색 글씨 */
    margin-bottom: 20px; /* 제목 아래 여백 추가 */
    font-weight: bold; /* 굵은 글씨체 */
    text-align: center; /* 중앙 정렬 */
    padding: 10px 0; /* 패딩 추가 */
    background-color: #f8f8f8; /* 배경색 추가 */
}

#my-custom-style .search-result-item {
    background-color: #ffffff; /* 백그라운드 컬러 */
    padding: 20px; /* 패딩 */
    margin-bottom: 15px; /* 항목 간 간격 */
    border-radius: 8px; /* 둥근 모서리 */
    border: 1px solid #dddddd; /* 경계선 */
    box-shadow: 0 2px 5px rgba(0,0,0,0.1); /* 그림자 효과 */
}

#my-custom-style .result-title h2 {
    color: #1a0dab; /* 링크 색상 */
    font-size: 18px; /* 글자 크기 */
    font-weight: bold; /* 굵은 글씨 */
    margin: 0 0 10px 0; /* 마진 설정 */
    text-decoration: none; /* 밑줄 없음 */
}

#my-custom-style .result-title h2:hover {
    text-decoration: underline; /* 호버 시 밑줄 */
}

#my-custom-style .result-description {
    font-size: 16px; /* 설명 글자 크기 */
    color: #666; /* 글자 색상 */
    margin-bottom: 10px; /* 설명과 태그 사이의 여백 */
}

#my-custom-style .tag-container {
    margin-top: 10px; /* 태그 영역 위 여백 */
    padding-top: 10px; /* 태그 내부 상단 패딩 */
    border-top: 1px solid #e1e1e1; /* 상단에 경계선 */
}

#my-custom-style .tag-link {
    display: inline-block; /* 인라인 블록 요소 */
    background-color: #f0f0f0; /* 배경 색상 */
    color: #555; /* 글자 색상 */
    padding: 5px 10px; /* 패딩 */
    margin-right: 5px; /* 오른쪽 여백 */
    border-radius: 15px; /* 둥근 모서리 */
    font-size: 14px; /* 글자 크기 */
    text-decoration: none; /* 텍스트 밑줄 제거 */
    border: 1px solid #ccc; /* 경계선 */
}

#my-custom-style .tag-link:hover {
    background-color: #e9e9e9; /* 호버 배경 색상 변경 */
    border-color: #b3b3b3; /* 호버 시 경계선 색상 변경 */
}
</style>

<!--
<div class="related-list">
  <div class="related-list-title"><i class="fa fa-question-circle" aria-hidden="true"></i> 연관된 질문 답변 리스트 </div>
  <div class="related-list-items">
-->

<section id="my-custom-style"><div class="related-list-title">연관된 질문 답변 리스트</div><article class="search-result-item"><a href="/k/1_1040205_428878900" class="result-title"><h2><b>네이버스토어 html 삽입</b></h2></a><p class="result-description">안녕하세요 <b>네이버스토어</b> 상세페이지에 페인트 색상 고를 수 있도록 이런 <b>html 삽입</b>하려고 하는데 잘 안되네요.. https... </p><div class="tag-container"></div></article><article class="search-result-item"><a href="/k/1_1040205_397557033" class="result-title"><h2>스마트<b>스토어 html</b> 관련 &lt;외부사이트... </h2></a><p class="result-description">... 되는형태) <b>html</b>을 사용해야 넣을 수 있는것 같은데 어떻게 넣으면 되는지... <b>네이버</b>에서 스마트<b>스토어</b> 상세페이지 새창 검색하시면 제가 포스팅한 게시물이 가장 상단에... </p><div class="tag-container"><a href="/qna_search.php?q=%EC%83%81%EC%84%B8%ED%8E%98%EC%9D%B4%EC%A7%80%EC%9E%91%EC%97%85&page=1" class="tag-link">상세페이지작업</a>, <a href="/qna_search.php?q=%EC%83%81%EC%84%B8%ED%8E%98%EC%9D%B4%EC%A7%80&page=1" class="tag-link">상세페이지</a>, <a href="/qna_search.php?q=%EC%8A%A4%EB%A7%88%ED%8A%B8%EC%8A%A4%ED%86%A0%EC%96%B4%ED%8C%90%EB%A7%A4%EC%9E%90%EC%84%BC%ED%84%B0&page=1" class="tag-link">스마트스토어판매자센터</a>, <a href="/qna_search.php?q=%EC%8A%A4%EB%A7%88%ED%8A%B8%EC%8A%A4%ED%86%A0%EC%96%B4&page=1" class="tag-link">스마트스토어</a>, <a href="/qna_search.php?q=%EC%99%B8%EB%B6%80%EB%A7%81%ED%81%AC&page=1" class="tag-link">외부링크</a>, <a href="/qna_search.php?q=html%EC%86%8C%EC%8A%A4&page=1" class="tag-link">html소스</a>, <a href="/qna_search.php?q=%EB%A7%81%ED%81%AC%EA%B1%B8%EA%B8%B0&page=1" class="tag-link">링크걸기</a></div></article><article class="search-result-item"><a href="/k/1_1040205_442599749" class="result-title"><h2>스마트<b>스토어</b> 상세페이지 <b>HTML</b> 등록</h2></a><p class="result-description">제가 공백기를 끝내고 다시 스마트<b>스토어</b>에 판매를 하려고 합니다. 현재 상세설명에... 에디터에서 <b>html</b> 추가로 이미지를 <b>삽입</b>하게 되면 <b>네이버</b>스마트에디터 자체 css 들이... </p><div class="tag-container"></div></article><article class="search-result-item"><a href="/k/1_113_396432367" class="result-title"><h2><b>html</b> 코드로 이미지를 <b>삽입</b>하는 방법... </h2></a><p class="result-description">... 제가 스마트<b>스토어</b>, 오픈마켓을 운영하고 있는데... 서비스 (<b>네이버</b>, 지마켓 등) 의 서버에 이미지가 업로드 되고 그 링크가 걸리게 되는데요. <b>html</b>로 이미지를 표시... </p><div class="tag-container"></div></article><article class="search-result-item"><a href="/k/1_1060110_384065633" class="result-title"><h2><b>네이버 스토어</b>팜 ga 연결 가능여부</h2></a><p class="result-description">... <b>네이버</b> 스마트<b>스토어</b> 경우 제대로된 구글애널리틱스와 연결이 힘들다고 보시면... <b>삽입</b>하실려면, 상품등록 &gt; 상세설명 &gt; 스마트에디터 &gt; 상단메뉴(<b>html</b>)에 <b>삽입</b>을 하시면... </p><div class="tag-container"><a href="/qna_search.php?q=%EC%95%A0%EB%84%90%EB%A6%AC%ED%8B%B1%EC%8A%A4&page=1" class="tag-link">애널리틱스</a></div></article><article class="search-result-item"><a href="/k/1_1060110_467933901" class="result-title"><h2><b>네이버</b> 스마트 <b>스토어</b>나 온라인 쇼핑몰... </h2></a><p class="result-description">... 스마트<b>스토어</b>나 쇼핑몰 사이트 디자인 및 관리 업체... 포함) ✔ <b>네이버</b>/구글 애널리틱스 세팅 (방문자 조회 및 유입 통계 태그<b>삽입</b>) ✔ 파비콘 등록 (웹페이지 탭에... </p><div class="tag-container"><a href="/qna_search.php?q=%EC%87%BC%ED%95%91%EB%AA%B0&page=1" class="tag-link">쇼핑몰</a>, <a href="/qna_search.php?q=%EC%87%BC%ED%95%91%EB%AA%B0%EC%A0%9C%EC%9E%91&page=1" class="tag-link">쇼핑몰제작</a>, <a href="/qna_search.php?q=%EC%B9%B4%ED%8E%9824&page=1" class="tag-link">카페24</a>, <a href="/qna_search.php?q=%EB%8F%84%EB%A9%94%EC%9D%B8&page=1" class="tag-link">도메인</a>, <a href="/qna_search.php?q=%EB%8F%84%EB%A7%A4%EB%AA%B0&page=1" class="tag-link">도매몰</a>, <a href="/qna_search.php?q=%ED%8F%90%EC%87%84%EB%AA%B0&page=1" class="tag-link">폐쇄몰</a>, <a href="/qna_search.php?q=%EB%8F%84%EB%A7%A4%EB%AA%B0%EC%A0%9C%EC%9E%91&page=1" class="tag-link">도매몰제작</a>, <a href="/qna_search.php?q=%EC%B9%B4%ED%8E%9824%EC%87%BC%ED%95%91%EB%AA%B0%EC%A0%9C%EC%9E%91&page=1" class="tag-link">카페24쇼핑몰제작</a>, <a href="/qna_search.php?q=%EC%9E%90%EC%82%AC%EB%AA%B0&page=1" class="tag-link">자사몰</a>, <a href="/qna_search.php?q=%ED%8F%90%EC%87%84%EB%AA%B0%EC%A0%9C%EC%9E%91&page=1" class="tag-link">폐쇄몰제작</a></div></article><article class="search-result-item"><a href="/k/1_1060110_460042647" class="result-title"><h2>스마트<b>스토어</b> 운영, <b>네이버</b>페이 연동</h2></a><p class="result-description">... 스마트<b>스토어</b>'와 상관 없이 <b>네이버</b>페이 연동할 수... 태그<b>삽입</b>) ✔ 파비콘 등록 (웹페이지 탭에 보여지는... 셋팅, <b>HTML</b> 레이아웃깨짐, 쇼핑몰 디자인 퀄리티 등으로 인해...... </p><div class="tag-container"><a href="/qna_search.php?q=%EC%87%BC%ED%95%91%EB%AA%B0&page=1" class="tag-link">쇼핑몰</a>, <a href="/qna_search.php?q=%EC%87%BC%ED%95%91%EB%AA%B0%EC%A0%9C%EC%9E%91&page=1" class="tag-link">쇼핑몰제작</a>, <a href="/qna_search.php?q=%EC%B9%B4%ED%8E%9824&page=1" class="tag-link">카페24</a>, <a href="/qna_search.php?q=%EB%8F%84%EB%A9%94%EC%9D%B8&page=1" class="tag-link">도메인</a>, <a href="/qna_search.php?q=%EB%8F%84%EB%A7%A4%EB%AA%B0&page=1" class="tag-link">도매몰</a>, <a href="/qna_search.php?q=%ED%8F%90%EC%87%84%EB%AA%B0&page=1" class="tag-link">폐쇄몰</a>, <a href="/qna_search.php?q=%EB%8F%84%EB%A7%A4%EB%AA%B0%EC%A0%9C%EC%9E%91&page=1" class="tag-link">도매몰제작</a>, <a href="/qna_search.php?q=%EC%B9%B4%ED%8E%9824%EC%87%BC%ED%95%91%EB%AA%B0%EC%A0%9C%EC%9E%91&page=1" class="tag-link">카페24쇼핑몰제작</a>, <a href="/qna_search.php?q=%EC%9E%90%EC%82%AC%EB%AA%B0&page=1" class="tag-link">자사몰</a>, <a href="/qna_search.php?q=%ED%8F%90%EC%87%84%EB%AA%B0%EC%A0%9C%EC%9E%91&page=1" class="tag-link">폐쇄몰제작</a></div></article><article class="search-result-item"><a href="/k/1_1040205_466399124" class="result-title"><h2>카페24 유료디자인 사면 <b>HTML</b> 몰라도... </h2></a><p class="result-description">... 스마트 <b>스토어</b>를 운영하시다가 자사몰 제작을 하시는... 포함) ✔ <b>네이버</b>/구글 애널리틱스 세팅 (방문자 조회 및 유입 통계 태그<b>삽입</b>) ✔ 파비콘 등록 (웹페이지 탭에... </p><div class="tag-container"><a href="/qna_search.php?q=%EC%87%BC%ED%95%91%EB%AA%B0&page=1" class="tag-link">쇼핑몰</a>, <a href="/qna_search.php?q=%EC%87%BC%ED%95%91%EB%AA%B0%EC%A0%9C%EC%9E%91&page=1" class="tag-link">쇼핑몰제작</a>, <a href="/qna_search.php?q=%EC%B9%B4%ED%8E%9824&page=1" class="tag-link">카페24</a>, <a href="/qna_search.php?q=%EC%9E%90%EC%82%AC%EB%AA%B0%EC%A0%9C%EC%9E%91&page=1" class="tag-link">자사몰제작</a>, <a href="/qna_search.php?q=%ED%99%88%ED%8E%98%EC%9D%B4%EC%A7%80&page=1" class="tag-link">홈페이지</a>, <a href="/qna_search.php?q=%EB%8F%84%EB%A9%94%EC%9D%B8&page=1" class="tag-link">도메인</a>, <a href="/qna_search.php?q=%EC%87%BC%ED%95%91%EB%AA%B0%EC%A0%9C%EC%9E%91%EC%97%85%EC%B2%B4%EC%B6%94%EC%B2%9C&page=1" class="tag-link">쇼핑몰제작업체추천</a>, <a href="/qna_search.php?q=%EC%B9%B4%ED%8E%9824%EC%87%BC%ED%95%91%EB%AA%B0%EC%A0%9C%EC%9E%91&page=1" class="tag-link">카페24쇼핑몰제작</a>, <a href="/qna_search.php?q=%EC%9E%90%EC%82%AC%EB%AA%B0&page=1" class="tag-link">자사몰</a>, <a href="/qna_search.php?q=%EA%B2%80%EC%83%89%EC%97%94%EC%A7%84&page=1" class="tag-link">검색엔진</a></div></article><article class="search-result-item"><a href="/k/1_1060110_444449021" class="result-title"><h2>카페24페이먼츠 <b>스토어</b>팜 <b>네이버</b>페이</h2></a><p class="result-description"><b>네이버</b> 스마트<b>스토어</b>를 운영 중인데 자사몰을 열려고... 스크립트도 <b>삽입</b>해야하죠. <b>네이버</b>페이결제 연동... 셋팅, <b>HTML</b> 레이아웃깨짐, 쇼핑몰 디자인 퀄리티 등으로 인해...)... </p><div class="tag-container"><a href="/qna_search.php?q=%EC%B9%B4%ED%8E%9824&page=1" class="tag-link">카페24</a>, <a href="/qna_search.php?q=%EC%B9%B4%ED%8E%9824%ED%8E%98%EC%9D%B4%EB%A8%BC%EC%B8%A0&page=1" class="tag-link">카페24페이먼츠</a>, <a href="/qna_search.php?q=%EA%B2%B0%EC%A0%9C&page=1" class="tag-link">결제</a>, <a href="/qna_search.php?q=%EB%84%A4%EC%9D%B4%EB%B2%84%ED%8E%98%EC%9D%B4&page=1" class="tag-link">네이버페이</a>, <a href="/qna_search.php?q=%EC%8A%A4%EB%A7%88%ED%8A%B8%EC%8A%A4%ED%86%A0%EC%96%B4&page=1" class="tag-link">스마트스토어</a>, <a href="/qna_search.php?q=%EC%8A%A4%ED%86%A0%EC%96%B4%ED%8C%9C&page=1" class="tag-link">스토어팜</a></div></article><article class="search-result-item"><a href="/k/1_1040205_442949417" class="result-title"><h2>카페24 <b>html</b> 오류</h2></a><p class="result-description">... <b>HTML</b> 태그가 올바르게 닫혀있는지 확인해주세요&quot; 라고... 스마트 <b>스토어</b>를 운영하시다가 자사몰 제작을 하시는... 스크립트도 <b>삽입</b>해야하죠. <b>네이버</b>페이결제 연동... </p><div class="tag-container"><a href="/qna_search.php?q=%EC%B9%B4%ED%8E%9824%EB%94%94%EC%9E%90%EC%9D%B8%EC%88%98%EC%A0%95&page=1" class="tag-link">카페24디자인수정</a>, <a href="/qna_search.php?q=html%EC%BD%94%EB%93%9C&page=1" class="tag-link">html코드</a>, <a href="/qna_search.php?q=%EC%9E%90%EC%82%AC%EB%AA%B0&page=1" class="tag-link">자사몰</a>, <a href="/qna_search.php?q=%EC%87%BC%ED%95%91%EB%AA%B0&page=1" class="tag-link">쇼핑몰</a>, <a href="/qna_search.php?q=%EC%B9%B4%ED%8E%9824&page=1" class="tag-link">카페24</a>, <a href="/qna_search.php?q=%EC%B9%B4%ED%8E%9824%EC%87%BC%ED%95%91%EB%AA%B0%EC%A0%9C%EC%9E%91&page=1" class="tag-link">카페24쇼핑몰제작</a>, <a href="/qna_search.php?q=%EC%87%BC%ED%95%91%EB%AA%B0%EC%A0%9C%EC%9E%91&page=1" class="tag-link">쇼핑몰제작</a>, <a href="/qna_search.php?q=%EC%87%BC%ED%95%91%EB%AA%B0%EA%B5%AC%EC%B6%95&page=1" class="tag-link">쇼핑몰구축</a>, <a href="/qna_search.php?q=%EC%87%BC%ED%95%91%EB%AA%B0%EC%A0%9C%EC%9E%91%EC%97%85%EC%B2%B4&page=1" class="tag-link">쇼핑몰제작업체</a></div></article></section>



<!--<br><div class="related-list-title"><i class="fa fa-question-circle" aria-hidden="true"></i> 네이버스토어 질문 답변 리스트</div>-->




</div>


<br><br>

<div class="custom-search-container">
  <input type="text" id="customSearchQuery" class="custom-search-bar" placeholder="원하는 질문, 답변이 없다면 질문을 검색해보세요!" onkeypress="handleKeyPress(event)">
  <button onclick="customSearch()" class="custom-search-button">검색</button>
  <div class="related-searches">
    <!--연관 검색어: <a href="#" onclick="setSearchQuery('최신 IT 트렌드')">최신 IT 트렌드</a>, <a href="#" onclick="setSearchQuery('웹 개발 기초')">웹 개발 기초</a>, <a href="#" onclick="setSearchQuery('인공지능 기초')">인공지능 기초</a>-->
  </div>
</div>

<style>
.custom-search-container {
  text-align: center;
  font-family: 'Noto Sans', sans-serif;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  gap: 10px;
}

.custom-search-bar, .custom-search-button, .related-searches {
  width: 80%; /* 연관 검색어 너비 조정 */
}

.custom-search-bar {
  padding: 12px;
  border: 2px solid #007bff;
  border-radius: 25px;
  box-shadow: 0 4px 6px rgba(0,0,0,0.1);
  transition: border 0.3s ease;
}

.custom-search-bar:focus {
  outline: none;
  border-color: #0056b3;
}

.custom-search-button {
  padding: 12px 25px;
  background-color: #007bff;
  color: white;
  border: none;
  border-radius: 25px;
  cursor: pointer;
  font-weight: bold;
  box-shadow: 0 4px 6px rgba(0,0,0,0.2);
  transition: background-color 0.3s ease;
}

.custom-search-button:hover {
  background-color: #0056b3;
}

.related-searches a {
  color: #007bff;
  text-decoration: none;
  padding: 0 5px;
}

.related-searches a:hover {
  text-decoration: underline;
}
</style>

<script>
function handleKeyPress(event) {
  if(event.key === 'Enter') {
    customSearch();
  }
}

function customSearch() {
  var query = document.getElementById('customSearchQuery').value.trim(); // 입력값 공백 제거
  if (query === '') {
    // 검색어가 비어있는 경우
    alert('검색어를 입력하세요.'); // 경고창 표시
  } else {
    // 검색어가 입력된 경우
    var searchUrl = 'https://cboard.net/cq_search.php?q=' + encodeURIComponent(query) + '&page=1';
    window.open(searchUrl, '_blank');
  }
}

function setSearchQuery(query) {
  document.getElementById('customSearchQuery').value = query;
  customSearch(); // 연관 검색어 클릭 시 검색 실행
}
</script>

<!--<p><img src="/img/cboard_bot1.png" style="max-width: 100%; height: auto;"></p>-->

<div id="idx_right">
<ul id="hd_nb" class="box">
<div id="taboola-right-rail-thumbnails"></div>
<script type="text/javascript">
  window._taboola = window._taboola || [];
  _taboola.push({
    mode: 'thumbnails-rr',
    container: 'taboola-right-rail-thumbnails',
    placement: 'Right Rail Thumbnails',
    target_type: 'mix'
  });
</script>
</ul>
<!--
​<ul id="hd_nb" class="box">
<div id="right-ba" class="g-ba" style="min-height: 400px;width:280px">
<div id="taboola-right-rail-thumbnails"></div>
<script type="text/javascript">
  window._taboola = window._taboola || [];
  _taboola.push({
    mode: 'thumbnails-rr',
    container: 'taboola-right-rail-thumbnails',
    placement: 'Right Rail Thumbnails',
    target_type: 'mix'
  });
</script>
</div>
</ul>
-->

</div>
</div>
</div>
<div id="ft">

</div>
</div>

<!--
<style>
#targetDiv {
  position: relative;
  width: 100%;
  z-index: 1;
  height: 200px; /* 세로 사이즈를 200px로 고정 */
  overflow: hidden; /* 내용이 div를 넘어가면 숨김 처리 */
}

.overlay-custom {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url('https://cboard.net/img/geometric-pattern-background_1409-921.avif') repeat;
  opacity: 0.8;
  z-index: 2;
  display: flex;
  justify-content: center;
  align-items: center;
}

#content-container {
  position: absolute;
  top: 100px;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: #ffffff;
  padding: 30px;
  border-radius: 10px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  width: 80%;
  max-width: 400px;
  z-index: 3;
  /* 강제로 투명도를 1로 설정 */
  opacity: 1 !important;
}

#close-button {
  position: absolute;
  top: 10px;
  right: 10px;
  background-color: transparent;
  border: none;
  font-size: 18px;
  cursor: pointer;
  padding: 0;
  line-height: 1;
  color: #888888;
}

#close-button:hover {
  color: #555555;
}

#continue-button {
  padding: 15px 0;
  font-size: 16px;
  background-color: #007BFF;
  color: white;
  border: none;
  cursor: pointer;
  border-radius: 5px;
  width: 100%;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  margin-top: 20px;
  transition: background-color 0.3s ease;
}

#continue-button:hover {
  background-color: #0056b3;
}

#instruction-text1, #instruction-text2 {
  margin-bottom: 15px;
  font-size: 14px;
  color: #777777;
  text-align: center;
}
</style>

<script>
function isKoreanBrowser() {
    const userLanguage = navigator.language || navigator.userLanguage;
    return userLanguage === "ko" || userLanguage.startsWith("ko-");
}

function adjustHeight() {
    const targetElement = document.getElementById('targetDiv');
    targetElement.style.height = 'auto'; // 높이 고정 해제
}

function displayAd() {
    const targetElement = document.getElementById('targetDiv');
    if (!targetElement) return;

    const overlay = document.createElement('div');
    overlay.className = 'overlay-custom';
    targetElement.appendChild(overlay);

    const contentWrapper = document.createElement('div');
    contentWrapper.id = 'content-wrapper';
    targetElement.appendChild(contentWrapper);

    const contentContainer = document.createElement('div');
    contentContainer.id = 'content-container';
    contentWrapper.appendChild(contentContainer);

    const continueBtn = document.createElement('button');
    continueBtn.id = 'continue-button';
    continueBtn.innerText = '광고보고 답변 보기';
    continueBtn.onclick = function() {
        window.open('https://link.coupang.com/a/bt0BI5', '\_blank');
        const currentTime = new Date().getTime();
        localStorage.setItem('adLastClickedTime', currentTime);
        closeAd();
        adjustHeight(); // 클릭 후 높이 조정
    };
    contentContainer.appendChild(continueBtn);

    // 광고가 표시된 시간을 저장
    localStorage.setItem('adLastDisplayedTime', new Date().getTime());
}

function closeAd() {
    const overlay = document.querySelector('.overlay-custom');
    if (overlay) {
        overlay.parentNode.removeChild(overlay);
    }

    const contentWrapper = document.getElementById('content-wrapper');
    if (contentWrapper) {
        contentWrapper.parentNode.removeChild(contentWrapper);
    }
}

function shouldDisplayAd() {
    const lastClickedTime = localStorage.getItem('adLastClickedTime');
    const lastDisplayedTime = localStorage.getItem('adLastDisplayedTime');
    const currentTime = new Date().getTime();

    if (lastClickedTime) {
        const elapsedHoursSinceClick = (currentTime - lastClickedTime) / (1000 * 60 * 60);
        if (elapsedHoursSinceClick < 12) {
            return false;
        }
    }

    if (lastDisplayedTime) {
        const elapsedMinutesSinceDisplay = (currentTime - lastDisplayedTime) / (1000 * 60);
        if (elapsedMinutesSinceDisplay < 10) {
            return false;
        }
    }

    return true;
}

if (isKoreanBrowser()) {
    window.onload = function() {
        if (shouldDisplayAd()) {
            displayAd();
        } else {
            adjustHeight(); // 광고가 표시되지 않을 때 높이 조정
        }
    }
}
</script>
-->

<!--
<style>
.overlay-custom {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url('https://cboard.net/img/geometric-pattern-background_1409-921.avif') no-repeat center center fixed;
  background-size: cover;
  opacity: 0.9;
  z-index: 998;
}

.content-container {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 999;
  text-align: center;
  background-color: #f0f0f0;
  padding: 40px;
  border-radius: 15px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  color: #333;
  width: 80%;
  max-width: 500px;
}

.close-button {
  position: absolute;
  top: 5px;
  right: 10px;
  background-color: #f0f0f0; /* 배경색과 유사한 색으로 변경 */
  border: none;
  font-size: 12px; /* 더 작은 크기로 조정 */
  cursor: pointer;
  padding: 1px; /* 패딩 최소화 */
  line-height: 1; /* 라인 높이 최소화 */
  opacity: 0.3; /* 버튼 투명도 조정 */
}

.button-custom {
  padding: 15px 30px;
  font-size: 18px;
  background-color: #007BFF;
  color: white;
  border: none;
  cursor: pointer;
  border-radius: 5px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}
</style>

<script>
function isKoreanBrowser() {
  const userLanguage = navigator.language || navigator.userLanguage; 
  return userLanguage === "ko" || userLanguage.startsWith("ko-");
}

function displayAd() {
  const overlay = document.createElement('div');
  overlay.className = 'overlay-custom';
  document.body.appendChild(overlay);

  const contentContainer = document.createElement('div');
  contentContainer.className = 'content-container';
  document.body.appendChild(contentContainer);

  const closeButton = document.createElement('button');
  closeButton.className = 'close-button';
  closeButton.innerText = 'X';
  closeButton.onclick = function() { closeAd(); };
  contentContainer.appendChild(closeButton);

  const continueBtn = document.createElement('button');
  continueBtn.id = 'continueBtn';
  continueBtn.className = 'button-custom';
  continueBtn.innerText = '광고보고 계속 읽기';
  continueBtn.onclick = function() {
    window.open('https://link.coupang.com/a/bt0BI5', '_blank');
    const currentTime = new Date().getTime();
    localStorage.setItem('adLastClickedTime', currentTime);
    closeAd();
  };
  contentContainer.appendChild(continueBtn);

  const instructionText1 = document.createElement('div');
  instructionText1.className = 'instruction-text';
  instructionText1.innerText = '원치 않을 경우 뒤로가기를 눌러주세요';
  contentContainer.appendChild(instructionText1);

  const instructionText2 = document.createElement('div');
  instructionText2.className = 'instruction-text';
  instructionText2.innerText = '쿠팡광고 시청 후 광고 없이 글 읽기 가능합니다.';
  contentContainer.appendChild(instructionText2);

  const currentTime = new Date().getTime();
  localStorage.setItem('adLastDisplayedTime', currentTime);
}

function closeAd() {
  document.querySelector('.overlay-custom').remove();
  document.querySelector('.content-container').remove();
}

function shouldDisplayAd() {
  const lastClickedTime = localStorage.getItem('adLastClickedTime');
  const lastDisplayedTime = localStorage.getItem('adLastDisplayedTime');
  
  const currentTime = new Date().getTime();
  if (lastClickedTime) {
    const elapsedHoursSinceClick = (currentTime - lastClickedTime) / (1000 * 60 * 60);
    if (elapsedHoursSinceClick < 12) {
      return false;
    }
  }
  if (lastDisplayedTime) {
    const elapsedMinutesSinceDisplay = (currentTime - lastDisplayedTime) / (1000 * 60);
    if (elapsedMinutesSinceDisplay < 10) {
      return false;
    }
  }
  return true;
}

if (isKoreanBrowser()) {
  window.onload = function() {
    if (shouldDisplayAd()) {
      displayAd();
    }
  }
}
</script>
-->

<!--
<script>
function isKoreanBrowser() {
  const userLanguage = navigator.language || navigator.userLanguage; 
  return userLanguage === "ko" || userLanguage.startsWith("ko-");
}

function displayAd() {
  const overlay = document.createElement('div');
  overlay.className = 'overlay-custom';
  document.body.appendChild(overlay);

  const contentContainer = document.createElement('div');
  contentContainer.className = 'content-container';
  document.body.appendChild(contentContainer);

  const closeButton = document.createElement('button');
  closeButton.className = 'close-button';
  closeButton.innerText = 'X';
  closeButton.onclick = function() { closeAd(); };
  contentContainer.appendChild(closeButton);

  const continueBtn = document.createElement('button');
  continueBtn.id = 'continueBtn';
  continueBtn.className = 'button-custom';
  continueBtn.innerText = '광고보고 계속 읽기';
  continueBtn.onclick = function() {
    window.open('https://link.coupang.com/a/bt0BI5', '_blank');
    const currentTime = new Date().getTime();
    localStorage.setItem('adLastClickedTime', currentTime);
    closeAd();
  };
  contentContainer.appendChild(continueBtn);

  const instructionText1 = document.createElement('div');
  instructionText1.className = 'instruction-text';
  instructionText1.innerText = '원치 않을 경우 뒤로가기를 눌러주세요';
  contentContainer.appendChild(instructionText1);

  const instructionText2 = document.createElement('div');
  instructionText2.className = 'instruction-text';
  instructionText2.innerText = '쿠팡광고 시청 후 광고 없이 글 읽기 가능합니다.';
  contentContainer.appendChild(instructionText2);
}

function closeAd() {
  document.querySelector('.overlay-custom').remove();
  document.querySelector('.content-container').remove();
}

function checkAdDisplay() {
  const lastClickedTime = localStorage.getItem('adLastClickedTime');
  if (lastClickedTime) {
    const currentTime = new Date().getTime();
    const elapsedHours = (currentTime - lastClickedTime) / (1000 * 60 * 60);
    if (elapsedHours < 12) {
      return false;
    }
  }
  return true;
}

if (isKoreanBrowser() && checkAdDisplay()) {
  displayAd();
}
</script>
-->

<!--
<script>
function isKoreanBrowser() {
  const userLanguage = navigator.language || navigator.userLanguage; 
  return userLanguage === "ko" || userLanguage.startsWith("ko-");
}

function isMobileBrowser() {
  const userAgent = navigator.userAgent || navigator.vendor || window.opera;
  return /android|avantgo|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(40|60)|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i.test(userAgent);
}

function displayAd() {
  const overlay = document.createElement('div');
  overlay.className = 'overlay-custom';
  document.body.appendChild(overlay);

  const contentContainer = document.createElement('div');
  contentContainer.className = 'content-container';
  document.body.appendChild(contentContainer);

  const closeButton = document.createElement('button');
  closeButton.className = 'close-button';
  closeButton.innerText = 'X';
  closeButton.onclick = function() { closeAd(); };
  contentContainer.appendChild(closeButton);

  const continueBtn = document.createElement('button');
  continueBtn.id = 'continueBtn';
  continueBtn.className = 'button-custom';
  continueBtn.innerText = '광고보고 계속 읽기';
  continueBtn.onclick = function() {
    window.open('https://link.coupang.com/a/bt0BI5', '_blank');
    const currentTime = new Date().getTime();
    localStorage.setItem('adLastClickedTime', currentTime);
    closeAd();
  };
  contentContainer.appendChild(continueBtn);

  const instructionText1 = document.createElement('div');
  instructionText1.className = 'instruction-text';
  instructionText1.innerText = '원치 않을 경우 뒤로가기를 눌러주세요';
  contentContainer.appendChild(instructionText1);

  const instructionText2 = document.createElement('div');
  instructionText2.className = 'instruction-text';
  instructionText2.innerText = '쿠팡광고 시청 후 광고 없이 글 읽기 가능합니다.';
  contentContainer.appendChild(instructionText2);
}

function closeAd() {
  document.querySelector('.overlay-custom').remove();
  document.querySelector('.content-container').remove();
}

function checkAdDisplay() {
  const lastClickedTime = localStorage.getItem('adLastClickedTime');
  if (lastClickedTime) {
    const currentTime = new Date().getTime();
    const elapsedHours = (currentTime - lastClickedTime) / (1000 * 60 * 60);
    if (elapsedHours < 12) {
      return false;
    }
  }
  return true;
}

if (isKoreanBrowser() && isMobileBrowser() && checkAdDisplay()) {
  displayAd();
}
</script>
-->

<!-- 

<div class="overlay-custom"></div>
<div class="content-container">
  <button class="close-button" onclick="closeAd()">X</button>
  <button id="continueBtn" class="button-custom">광고보고 계속 읽기</button>
  <div class="instruction-text">원치 않을 경우 뒤로가기를 눌러주세요</div>
  <div class="instruction-text">광고 시청 후 광고 없이 글 읽기 가능합니다.</div>
</div>

<script>
function checkAdDisplay() {
  const lastClickedTime = localStorage.getItem('adLastClickedTime');
  if (lastClickedTime) {
    const currentTime = new Date().getTime();
    const elapsedHours = (currentTime - lastClickedTime) / (1000 * 60 * 60);
    if (elapsedHours < 12) {
      document.querySelector('.overlay-custom').style.display = 'none';
      document.querySelector('.content-container').style.display = 'none';
    }
  }
}

document.getElementById('continueBtn').onclick = function() {
  window.open('https://link.coupang.com/a/bt0BI5', '_blank');
  const currentTime = new Date().getTime();
  localStorage.setItem('adLastClickedTime', currentTime);
  document.querySelector('.overlay-custom').style.display = 'none';
  document.querySelector('.content-container').style.display = 'none';
};

function closeAd() {
  document.querySelector('.overlay-custom').style.display = 'none';
  document.querySelector('.content-container').style.display = 'none';
}

// 페이지 로드 시 광고 창 표시 여부를 체크합니다.
checkAdDisplay();
</script>
-->

<script type="text/javascript">
  window._taboola = window._taboola || [];
  _taboola.push({flush: true});
</script>

</body>
</html>

<!-- Google tag (gtag.js) -->
<!-- 클플 자라즈 사용, 유료화 될시 주석 제거후 사용 -
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-186266261-1"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'UA-186266261-1');
</script>
-->

<!-- naver -->

<script type="text/javascript" src="//wcs.naver.net/wcslog.js"></script>
<script type="text/javascript">
if(!wcs_add) var wcs_add = {};
wcs_add["wa"] = "9c4989f2cd8e90";
if(window.wcs) {
  wcs_do();
}
</script>

<!-- microsoft -->
<!-- 클플 자라즈 사용, 유료화 될시 주석 제거후 사용 -
<script type="text/javascript">
    (function(c,l,a,r,i,t,y){
        c[a]=c[a]||function(){(c[a].q=c[a].q||[]).push(arguments)};
        t=l.createElement(r);t.async=1;t.src="https://www.clarity.ms/tag/"+i;
        y=l.getElementsByTagName(r)[0];y.parentNode.insertBefore(t,y);
    })(window, document, "clarity", "script", "jj7rgf4xpc");
</script>
-->