@charset "utf-8";
body {
    color: #fff;
    margin: 0;
    padding: 0;
    background: #000;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px
}
input {
    font-size: 11px;
    font-family: Arial, Helvetica, sans-serif
}
img {
    border: 0
}
a {
    color: #726f68;
    text-decoration: none
}
a:focus {}a:hover {
    color: #333
}
h2 {
    font-size: 32px;
    font-weight: lighter;
    margin: 0;
    color: #4e4d4d;
    font-family: Arial, Helvetica, sans-serif;
}
h3 {
    font-size: 18px;
    font-weight: lighter;
    margin: 0;
    color: #4e4d4d;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: lighter
}
h4 {
    font-size: 16px;
    font-weight: lighter;
    margin: 0;
    color: #4e4d4d;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: lighter;
}
h5 {
    font-size: 14px;
    font-weight: lighter;
    margin: 0;
    color: #4e4d4d;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: lighter;
}
.red{
    color: #cd0010!important
}
.white{
    color: #fff;
}

div#main::-webkit-scrollbar { 
    display: none; 
}

div#container {
    position: relative;
    width: 1280px;
    margin: 0 auto
}
div#main {
    height: 629px;
    z-index: 2;
	overflow:auto;
}
ul {
    padding: 0;
    list-style: none;
    margin: 0 0 10px;
}
.left,
.center,
.right {
    position: absolute;
    display: block
}
.left {
    color: #726f68
}
.top {
    position: relative;
    height: 24px;
    top: 10px;
    z-index: 10
}
.top ul li {
    display: inline
}
div#color-pick {
    float: left;
    position: relative;
    width: 370px;
    height: 118px;
    margin: 20px 0 10px 0;
    padding: 3px 0 0 18px;
    background: url(../Images/color-pick-bg.png) no-repeat
}
#color-title {
    float: left;
    width: auto;
    width: 95%
}
div#color-pick div.carousel {
    position: relative;
    display: block;
    white-space: nowrap;
    overflow: hidden;
    width: 278px;
    left: 11px;
    top: -3px;
    float: left
}
.carousel-item .HoverEffect {
    width: 46px;
    height: 60px;
    z-index: 15;
    position: absolute;
    cursor: pointer;
    overflow: hidden
}
div.carousel div.carousel-items {
    position: relative;
    margin: 7px 0 0 0
}
div.carousel .carousel-item {
    position: relative;
    display: inline-block;
    padding: 0 0 0 0;
    width: 45px;
    height: 60px;
    overflow: hidden
}
div.carousel .carousel-item img {
    position: absolute;
    top: 0;
    left: 0
}
div#color-pick .option-bg {
    position: absolute;
    width: 45px;
    height: 60px
}
div#color-pick .hot .option-bg,
div#color-pick .active .option-bg {
    left: 0;
    top: 3px!important;
    width: 100%;
    display: block
}
div#color-pick .hot .option-bg,
div#color-pick .active .HoverEffect img,
.carousel-item.hot .HoverEffect img {
    position: absolute;
    top: -65px;
    display: block
}
input.quantity {
    width: 40px
}
.product .right ul.plus-links {
    float: left;
    margin: 15px 0 0 0;
    width: 99%
}
ul.plus-links li {
    display: inline;
    border-right: 1px solid #d9d9d9;
    padding: 0 15px 0 0;
    margin: 0 0 0 12px
}
ul.plus-links li a {
    position: relative;
    z-index: 30
}
ul.plus-links .first {
    margin-left: 0
}
ul.plus-links .last {
    border-right: none
}
.reg-glow {
    text-shadow: #fff 0 0 3px
}
#RightSideArrow {
    position: absolute;
    top: 48px;
    right: 53px
}
div#header {
    position: relative;
    background: #000;
    height: 120px;
    padding: 0;
    margin: 0;
    font-size: 10px;
    clear: both;
    z-index: 3
}
#nav-container {
    z-index: 14;
    margin: 0 0 5px 0
}
div#logo {
    padding: 14px 0 0 0;
    float: left
}
.promotion {
    float: left;
    margin: 0 0 0 33px
}
div#header .right {
    display: block;
    position: absolute;
    right: 0;
    margin: 33px 0 0 0;
    z-index: 9998;
    float: left
}
div#header .rightSingleCountry {
    display: block;
    position: absolute;
    right: 0;
    margin: 18px 0 0 0
}
input#search {
    border: none;
    color: #999;
    background: transparent;
    font-size: 10px;
    height: 17px;
    position: relative;
    top: 2px;
    left: 7px;
    padding: 0 20px 0 0;
    width: 85px
}
a#search-go {
    background: url(../Images/search-go.gif) no-repeat;
    border: none;
    width: 17px;
    height: 17px;
    position: absolute;
    top: 0;
    right: 0;
    cursor: pointer
}
div#header .search-container {
    margin: 0 20px 0 16px;
    background: url(../Images/search-bg.gif) no-repeat;
    width: 123px;
    height: 17px;
    padding: 0 0 5px;
    position: relative;
    top: -2px
}
.header-item a {
    color: #b1b1b1
}
.header-item a:hover {
    color: #e1dbf3
}
div#header .header-item {
    color: #8f8f8f;
    display: inline
}
div#header .right-divide {
    padding: 0 16px;
    border-right: 1px solid #282828
}
div#header .share-img,
div#header .cart-img {
    top: 4px;
    position: relative;
    margin: 0 2px
}
div.product div.top .left a {
    color: #cd0010!important
}
div.product div.top .left a:hover {
    color: #333!important
}
div.product div.top .right {
    left: auto;
    right: 0;
    margin-right: 14px
}
div.product div.top .right li {
    background: url(../Images/breadcrumb-arrow-right.gif) no-repeat center right;
    padding-right: 15px;
    padding-left: 7px
}
div.product div.top .right .current {
    background: none;
    padding-right: 0
}
#bodya_0_lblRight {
    float: left;
    display: block;
    width: 420px
}
#header .left {
    left: 26px;
    min-width: 410px;
    float: left
}
.product .left {
    left: 26px;
    width: 20%
}
#easyscroll {
    float: left;
    width: 300px
}
#easyscrollnav,
#easyscrollnav2 {
    padding: 10px;
    float: left;
    width: 100%;
    text-align: center;
    cursor: pointer
}
.product .left ul li {
    margin: 0 0 7px
}
.product .left a:hover,
div#main .left a.active {
    color: #cd0010
}
.product .center {
    left: 28%
}
.product .middle .left,
div#main .middle .right {
    margin-top: 40px
}
div#main .right {
    padding: 0 10px 0 0
}
.product .middle .right {
    left: 55%;
    width: 400px
}
.product .middle .left h2 {
    margin-bottom: 30px
}
.product .middle .right h2 {
    margin-bottom: 0
}
.product .middle .right h3 {
    margin-bottom: 16px
}
.product .right ul {
    margin-left: 14px;
    list-style-type: disc;
    float: left
}
.product .right .right-column-content {
    position: relative;
    width: 350px;
    float: left;
    margin: 15px 0 0 0
}
#CartInfoSelection {
    float: left;
    width: 100%;
    margin: 0
}
#CartInfoSelection li {
    list-style: none;
    display: block;
    float: left;
    position: relative
}
#CartInfoSelection li label {
    float: left;
    display: block;
    padding: 5px 0 0 0
}
#CartInfoSelection li input {
    display: block;
    float: left
}
#CartInfoSelection li input#info-color-title {
    border: none;
    background: url(../Images/input-option-name.png) center center;
    padding: 6px 10px 7px;
    width: 157px
}
#CartInfoSelection li input#info-color-quantity {
    border: none;
    background: url(../Images/input-option-count.png) center center;
    padding: 6px 10px 7px 10px;
    width: 15px;
    text-align: center
}
.product .right .info {
    padding: 10px 0;
    border: 1px solid #d4cfdb;
    border-left: none;
    border-right: none
}
#cart-confirmation {
    position: absolute;
    text-align: center;
    top: -73px;
    left: -18px;
    display: none
}
div.select div.top .left a {
    color: #cd0010!important
}
div.select div.top .left a:hover {
    color: #333!important
}
div.select div.top .right {
    left: auto;
    right: 0;
    margin-right: 14px
}
div.select div.top .right li {
    background: url(../Images/breadcrumb-arrow-right.gif) no-repeat center right;
    padding-right: 15px;
    padding-left: 7px
}
div.select div.top .right .current {
    background: none;
    padding-right: 0
}
.select .left {
    left: 26px;
    width: 20%
}
.select .left ul li {
    margin: 0 0 7px
}
.select .left a:hover,
div#main .left a.active {
    color: #cd0010
}
.select .center {
    top: 0;
    left: 42%
}
.select .middle .left {
    top: 21%;
    left: 21%
}
.select .middle .right {
    top: 40%;
    left: 56%
}
.select .middle .left h2 {
    margin-bottom: 30px
}
.select .middle ul.center li {
    height: 100%;
    display: block;
    text-align: center
}
.select .middle ul.center li img {
    cursor: Pointer
}
.select .middle .right h2 {
    margin-bottom: 0
}
.select .middle .right h3 {
    margin-bottom: 16px
}
.select .right ul {
    margin-left: 14px;
    list-style-type: disc
}
.select .right .right-column-content {
    position: relative;
    width: 350px
}
.select .right .info {
    padding: 8px 0;
    border: 1px solid #d4cfdb;
    border-left: none;
    border-right: none
}
.select .right input#info-color-title {
    border: none;
    background: url(../Images/input-option-name.png) center center;
    padding: 6px 10px 7px;
    width: 157px
}
.select .right input#info-color-quantity {
    border: none;
    background: url(../Images/input-option-count.png) center center;
    padding: 6px 10px 7px;
    width: 15px;
    text-align: center
}
#ctl4 {
    float: left;
    position: relative
}
.overlay {
    position: absolute;
    top: 17px;
    left: -34px;
    visibility: hidden;
    z-index: 25
}
.overlay .close {
    position: absolute;
    top: 0;
    right: 50px;
    z-index: 20;
    font-size: 12px
}
.overlay .tab {
    position: absolute;
    background: url(../Images/overlay-tab-title.png) no-repeat;
    color: #cd0010;
    width: 154px;
    height: 45px;
    top: -26px;
    z-index: 20;
    left: -10px
}
.overlay .tips-and-tricks {
    left: 115px
}
.overlay .as-seen-in {
    left: 208px
}
.overlay .overlay-content {
    position: relative;
    left: -45px;
    width: 546px
}
.overlay .overlay-content .overlay-top {
    height: 27px;
    background: url(../Images/overlay-top-bg.png) no-repeat
}
.overlay .overlay-content .overlay-middle {
    z-index: 19;
    position: relative;
    left: -1px;
    background: url(../Images/overlay-middle-bg.png) repeat-y;
    float: left;
    width: 548px;
    height: 200px;
    padding: 0 0 0 25px
}
.overlay .overlay-content .overlay-middle space-fix {
    height: 6px
}
.overlay .overlay-content .overlay-bottom {
    height: 27px;
    background: url(../Images/overlay-bottom-bg.png) no-repeat;
    float: left;
    width: 548px
}
.overlay .overlay-left {
    float: left;
    position: absolute;
    left: 27px
}
.overlay .overlay-right {
    position: relative;
    float: right;
    top: 20px;
    right: 53px
}
.overlay .overlay-full {
    position: relative;
    float: right;
    right: 60px;
    top: 23px
}
.overlay .overlay-right .item,
.overlay .item {
    border-top: 1px solid #d4d4d4;
    padding: 10px 0 10px 0
}
.overlay .overlay-right .first,
.overlay .first {
    border-top: none
}
.overlay .overlay-right .item p,
.overlay .item p {
    margin: 0;
    width: 95%
}
.overlay .overlay-right .item .title {
    font-weight: bold;
    margin: 0 0 2px
}
.overlay .overlay-right .item .more-tips {
    display: inline-block;
    color: #cd0010;
    margin: 6px 0;
    padding: 0 8px 0 0;
    position: relative;
    background: url(../Images/pixel-arrow-red-right.gif) no-repeat center right
}
.scroll-pane {
    width: 220px;
    overflow: auto;
    float: left;
    padding: 10px
}
#panel-tips,
#panel-seen-in,
#panel-long-description {
    height: 150px
}
.scroll-pane-full {
    width: 492px;
    overflow: auto;
    float: left
}
.more-info {
    width: 470px
}
.more-info p {
    padding: 0 10px
}
a.jScrollArrowUp {
    background: url(../Images/basic_arrow.gif) no-repeat 0 0
}
a.jScrollArrowDown {
    background: url(../Images/basic_arrow.gif) no-repeat 0 -13px
}
#slide-out {
    position: absolute;
    width: 300px;
    right: -300px;
    bottom: 50px;
    z-index: 50
}
#slide-out div.ul {
    position: relative;
    height: 175px
}
#slide-out div.ul div.li {
    position: relative;
    display: inline;
    margin: 18px;
    top: 35px;
    z-index: 1
}
#slide-out div.ul div.li a {
    cursor: Pointer
}
#slide-out div.ul div.li a:focus {
    outline: none!important
}
#slide-out div.ul div.li div.tool-tip {
    background: #fff;
    display: none;
    position: absolute;
    top: -120px;
    left: -180px;
    width: 170px;
    height: 30px;
    padding: 10px 16px;
    font-size: 10px;
    line-height: 150%;
    border: 1px solid #ccc
}
#slide-out div.tool-tip span.tool-tip-title,
a.tool-tip-link,
a.tool-tip-link:hover {
    display: block;
    color: #b50000
}
#slide-out .title {
    width: 37px;
    position: absolute;
    left: -37px;
    height: 175px
}
div#footer {
    position: relative;
    background: #000;
    height: 30px;
    z-index: 100
}
#footer ul.footer-oneline {
    position: absolute;
    right: 6px;
    top: 7px
}
#footer ul.footer-oneline li {
    display: inline;
    font-size: 9px;
    color: #656565;
    letter-spacing: 1px;
    margin: 0 5px
}
#footer ul.footer-oneline li a {
    display: inline;
    font-size: 9px;
    color: #b1b1b1;
    letter-spacing: 1px;
    margin: 0 5px
}
#footer ul.footer-oneline li a:hover {
    color: #fff!important
}
#footer ul.footer-oneline li.special {
    margin: 0 22px
}
#footer ul.footer-oneline li.special a {
    color: #b1b1b1
}
#footer .row {
    display: block;
    position: relative;
    overflow: hidden
}
#footer .dummy-row {
    display: block;
    position: relative
}
#footer .row .background {
    display: block;
    position: relative;
    height: 100%;
    background: #000;
    top: 0;
    z-index: 10
}
#footer .row-title {
    position: absolute;
    top: 0;
    z-index: 20;
    top: 7px;
    left: 8px
}
#footer .row-title a {
    color: #fff
}
#footer .row .content {
    position: absolute;
    margin: 25px 0 0 110px;
    z-index: 20;
    display: none;
    width: 100%
}
#footer .row .column {
    position: relative;
    display: inline;
    top: -19px;
    float: left;
    margin: 0 0 20px 19px;
    layout: hasLayout
}
#footer .row .column .column-title {
    position: relative;
    left: -6px;
    display: inline;
    padding: 0 11px 0 0;
    background: url(/Images/footer-arrow-right.gif) no-repeat right center
}
#footer .row .first {
    margin: 0 0 20px 30px
}
#footer ul.columns {
    margin: 16px 0 0 -19px;
    padding: 0 6px 0 6px;
    border-left: #393939 1px dotted;
    width: 100%;
    height: 84px
}
#footer ul.columns li {
    width: 150px;
    margin: 0 6px 6px
}
#footer ul.columns li a {
    color: #b4b4b4;
    font-size: 11px
}
#footer ul.columns li a:hover {
    color: #fff
}
#footer .collections ul {
    display: inline-block;
    width: 150px
}
#footer .favorites ul {
    width: 150px
}
#footer .interactive-tools ul {
    width: 150px
}
#footer .beyond-the-look ul {
    width: 150px
}
#footer ul.images {
    float: left;
    display: block;
    padding: 0 0 0 6px;
    position: relative;
    margin: 0 0 0 0;
    top: 0
}
#footer ul.images li {
    display: block;
    margin: 0 12px 0 0;
    float: left
}
#footer .categories ul.images li {
    display: inline
}
#footer .categories ul.images li a {
    display: inline-block;
    margin: 0 8px 0 0;
    width: 58px;
    text-align: center
}
#flashmovie {
    text-align: center;
    height: 100%;
    width: 100%
}
#flashmovie_p {
    position: relative;
    text-align: center;
    height: 100%;
    width: 100%;
    top: -24px
}
#countryselection {
    text-align: right;
    margin: 0 auto;
    padding: 0
}
#countryselectcontainer {
    width: 200px;
    text-align: right;
    float: right;
    margin: 0 auto;
    padding: 0;
    display: none
}
.countrydropdowncontainer {
    position: absolute;
    right: 10px;
    z-index: 9999;
    color: #b1b1b1;
    font-size: 10px
}
.menuclick {
    background-color: #000;
    padding: 10px 10px 0 10px;
    margin: 0 auto;
    text-align: left
}
.menuclick li,
.menuclick li img,
ul.menu li img {
    vertical-align: middle
}
ul.menu {
    background-color: #000;
    padding: 10px;
    text-transform: uppercase;
    text-align: left;
    color: #b1b1b1;
    display: none
}
ul.menu li {
    vertical-align: middle;
    padding: 5px 0 5px 0;
    color: #b1b1b1
}
li.countrylink a,
ul.menuclick li {
    color: #b1b1b1;
    text-transform: uppercase;
    font-size: 10px
}
li.countrylink a:hover,
ul.menuclick li:hover {
    color: #e1dbf3
}
.countryflagimage {
    padding-right: 8px;
    margin: 0 auto
}
.countrymaincontainer {
    display: none
}
#main-navigation {
    xpadding: 70px 5px 0 0;
    width: 100%;
    position: relative;
    z-index: 11
}
.subcategory-links {
    font-size: 12px;
    margin: 10px 0;
    white-space: nowrap
}
.main-navigation-list-item {
    float: left;
    position: relative;
    padding-right: 20px;
    width: auto;
    font-size: 14px;
    display: inline
}
.megaNavLinks a:link,
.megaNavLinks a:link:visited,
.main-navigation-list-item a:link,
.main-navigation-list-item a:visited {
    color: #fff
}
.megaNavLinks a:hover,
.megaNavLinks a:link:active,
.main-navigation-list-item a:hover,
.main-navigation-list-item a:active {
    color: #000
}
#products-sub-items-container {
    display: none;
    position: absolute;
    background: #2c2c2c;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    left: -9999px
}
.products-sub-items {
    float: left;
    display: inline;
    margin: 0 5px;
    white-space: nowrap
}
#whats-new-sub-items,
#hair-color-sub-items,
#beauty-tools-sub-items,
#fragrances-sub-items,
#makeup-tips-trends-sub-items,
#video-sub-items,
#awards-sub-items {
    display: none;
    position: absolute;
    background: #2c2c2c;
    width: auto;
    left: -9999px
}
#whats-new-sub-items {
    display: none;
    position: absolute;
    background: #2c2c2c;
    left: -9999px
}
.all-sub-menus {
    padding: 5px
}
#main-navigation li:hover #products-sub-items-container,
#main-navigation li:hover ul {
    display: block;
    left: 0
}
.lt-ie8 #main-navigation li:hover ul {
    top: 14px
}
#main-navigation li a {}#main-navigation li:hover>a {
    color: red
}
#wnSprite {
    background: url('/~/media/Images/Revlon/Navigation/megaNavSprite.ashx') no-repeat -1px -2px
}
#main-navigation li:hover>a#wnSprite {
    background: url('/~/media/Images/Revlon/Navigation/megaNavSprite.ashx') #2c2c2c no-repeat -1px -19px;
    z-index: 20
}
#makeupSprite {
    background: url('/~/media/Images/Revlon/Navigation/megaNavSprite.ashx') no-repeat -103px -2px;
    width: 58px;
    height: 11px
}
#main-navigation li:hover>a#makeupSprite {
    background: url('/~/media/Images/Revlon/Navigation/megaNavSprite.ashx') #2c2c2c no-repeat -103px -19px;
    width: 58px;
    height: 11px
}
#haircolorSprite {
    background: url('/~/media/Images/Revlon/Navigation/megaNavSprite.ashx') no-repeat -177px -2px;
    width: 87px;
    height: 12px
}
#main-navigation li:hover>a#haircolorSprite {
    background: url('/~/media/Images/Revlon/Navigation/megaNavSprite.ashx') #2c2c2c no-repeat -177px -19px;
    width: 87px;
    height: 12px
}
#btSprite {
    background: url('/~/media/Images/Revlon/Navigation/megaNavSprite.ashx') no-repeat -288px -2px;
    width: 186px;
    height: 12px
}
#main-navigation li:hover>a#btSprite {
    background: url('/~/media/Images/Revlon/Navigation/megaNavSprite.ashx') #2c2c2c no-repeat -288px -19px;
    width: 186px;
    height: 12px
}
#fragranceSprite {
    background: url('/~/media/Images/Revlon/Navigation/megaNavSprite.ashx') no-repeat -494px -2px;
    width: 94px;
    height: 12px
}
#main-navigation li:hover>a#fragranceSprite {
    background: url('/~/media/Images/Revlon/Navigation/megaNavSprite.ashx') #2c2c2c no-repeat -494px -19px;
    width: 186px;
    height: 12px
}
#tipsSprite {
    background: url('/~/media/Images/Revlon/Navigation/megaNavSprite.ashx') no-repeat -610px -2px;
    width: 163px;
    height: 12px
}
#main-navigation li:hover>a#tipsSprite {
    background: url('/~/media/Images/Revlon/Navigation/megaNavSprite.ashx') #2c2c2c no-repeat -610px -19px;
    width: 163px;
    height: 12px
}
#vidsSprite {
    background: url('/~/media/Images/Revlon/Navigation/megaNavSprite.ashx') no-repeat -782px -2px;
    width: 52px;
    height: 12px
}
#main-navigation li:hover>a#vidsSprite {
    background: url('/~/media/Images/Revlon/Navigation/megaNavSprite.ashx') #2c2c2c no-repeat -782px -19px;
    width: 52px;
    height: 12px
}
#itListsSprite {
    background: url('/~/media/Images/Revlon/Navigation/megaNavSprite.ashx') no-repeat -853px -2px;
    width: 165px;
    height: 12px
}
#main-navigation li:hover>a#itListsSprite {
    background: url('/~/media/Images/Revlon/Navigation/megaNavSprite.ashx') #2c2c2c no-repeat -853px -19px;
    width: 165px;
    height: 12px;
    color: red
}
.subcategory-link {
    color: red
}
.collection-subcategory-link {
    color: red;
    padding-left: 10px
}
.collection-header {
    font-size: 12px
}
.whats-new-images {
    float: left;
    display: inline
}
.whats-new-sub-list-item {
    width: auto;
    float: left;
    display: inline;
    padding: 5px
}
.collection-links {
    font-size: 12px;
    margin: 10px 0 10px 5px;
    white-space: nowrap;
    text-transform: uppercase
}
.siteLogo {
    position: relative;
    z-index: 12
}
#header-container {
    clear: both
}
.clearfix:before,
.clearfix:after {
    content: " ";
    display: table
}
.clearfix:after {
    clear: both
}

#home table {
    width:300px;
    height:300px;
    position:fixed;
    margin-left:-150px; /* half of width */
    margin-top:-150px;  /* half of height */
    top:50%;
    left:50%;
}

#biography {
    overflow:scroll; 
    height:100%;
}

#photogallery {
    overflow:scroll; 
    height:100%;
}

/*-----------Audio Controls Styling----------------------*/


audio:hover, audio:focus, audio:active
{
-webkit-transform: scale(1.05);
-moz-transform: scale(1.05);
transform: scale(1.05);
}

audio
{
height: 50px;
}
/*---------------------------------*/


.wrap {
   overflow: hidden;
   margin: 10px;
}
.photobox {
   float: left;
   position: relative;
   width: 20%;
   padding-bottom: 20%;
}
.boxInner {
   position: absolute;
   left: 10px;
   right: 10px;
   top: 10px;
   bottom: 10px;
   overflow: hidden;
}
.boxInner img {
   width: 100%;
}
.boxInner .titleBox {
   position: absolute;
   bottom: 0;
   left: 0;
   right: 0;
   margin-bottom: 5px;
   background: #000;
   background: rgba(0, 0, 0, 0.5);
   color: #cd0010;
   padding: 10px;
   text-align: bottom;
   -webkit-transition: all 0.3s ease-out;
   -moz-transition: all 0.3s ease-out;
   -o-transition: all 0.3s ease-out;
   transition: all 0.3s ease-out;
}
body.no-touch .boxInner:hover .titleBox, body.touch .boxInner.touchFocus .titleBox {
   margin-bottom: 0;
}
@media only screen and (max-width : 480px) {
   /* Smartphone view: 1 tile */
   .box {
      width: 100%;
      padding-bottom: 100%;
   }
}
@media only screen and (max-width : 650px) and (min-width : 481px) {
   /* Tablet view: 2 tiles */
   .box {
      width: 50%;
      padding-bottom: 50%;
   }
}
@media only screen and (max-width : 1050px) and (min-width : 651px) {
   /* Small desktop / ipad view: 3 tiles */
   .box {
      width: 33.3%;
      padding-bottom: 33.3%;
   }
}
@media only screen and (max-width : 1290px) and (min-width : 1051px) {
   /* Medium desktop: 4 tiles */
   .box {
      width: 25%;
      padding-bottom: 25%;
   }
}

#wnSprite
   {
   width: 40px;
   height: 14px;
   }
   #main-navigation li:hover > a#wnSprite {
   width: 40px;
   height: 14px;
   }
   #makeupSprite
   {
   width: 40px;
   height: 14px;
   }
   #main-navigation li:hover > a#makeupSprite {
   width: 40px;
   height: 14px;
   }
   #haircolorSprite
   {
   width: 40px;
   height: 14px;
   }
   #main-navigation li:hover > a#haircolorSprite {
   width: 40px;
   height: 14px;
   }
   #btSprite
   {
   width: 40px;
   height: 14px;
   }
   #main-navigation li:hover > a#btSprite {
   width: 40px;
   height: 14px;
   }
   #fragranceSprite
   {
   width: 40px;
   height: 14px;
   }
   #main-navigation li:hover > a#fragranceSprite {
   width: 40px;
   height: 14px;
   }
   #skinSprite
   {
   width: 40px;
   height: 14px;
   }
   #main-navigation li:hover > a#skinSprite {
   width: 40px;
   height: 14px;
   }
   #itListsSprite
   {
   width: 40px;
   height: 14px;
   }
   #main-navigation li:hover > a#itListsSprite {
   width: 40px;
   height: 14px;
   }

#contactus input, textarea {
	padding: 10px;
	border: 1px solid #E5E5E5;
	width: 200px;
	color: #999999;
	box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 8px;
	-moz-box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 8px;
	-webkit-box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 8px;		
}

#contactus textarea {
	width: 400px;
	height: 150px;
	max-width: 400px;
	line-height: 18px;
}

#contactus input:hover, textarea:hover,
#contactus input:focus, textarea:focus {
	border-color: 1px solid #C9C9C9;
	box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 8px;
	-moz-box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 8px;
	-webkit-box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 8px;	
}

#contactus .form label {
	margin-left: 10px;
	color: #999999;
}

/* ===========================
   ====== Submit Button ====== 
   =========================== */

#contactus .submit input {
	width: 100px; 
	height: 40px;
	background-color: #4e4d4d; 
	color: #FFF;
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;		
}