@charset "utf-8";
/*  Royal Restrooms  Tyler TX
color: #542C81;  deep purple
color: #715294;  hover purple
*/

/* CSS Reset */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }
article, aside, details, figcaption, figure,  footer, header, hgroup, menu, nav, section { display: block; }
body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
table { border-collapse: collapse; border-spacing: 0; }

/* Floats Clear */
.fl { float: left; }
.fr { float: right; }
.cf:before, .cf:after { content: " "; /* 1 */ display: table; /* 2 */ }
.cf:after { clear: both; }
.cf { /**zoom: 1;*/ }

/* CSS Document */
body { font-family: 'Open Sans', sans-serif; font-size: 18px; line-height: 1.5; font-weight: 400; color: #666; background: #FFF; min-width: 320px; }
p { line-height: 1.5; margin-bottom: 10px; }
.emphasize { font-weight: 600; }
.center { text-align: center; }

#wrapper { padding: 0; }

/* Global */
a { color: #542C81; text-decoration: none; }
a:hover { text-decoration: underline; }
a.bullet:before { content: "\00bb"; font-size: 1.3em; margin-right: 3px; }
h1, h2, h3, h4 { font-family: 'Roboto Condensed', sans-serif; color: #333; }
h1 { font-size: 28px; line-height: 1.3; }
h1.index { width: 76%; color: #FFF; background: #555; text-align: center; margin: 0 auto; padding: 1.5% 2% 2%; }
h1.index span { font-size: 24px; font-style: italic; }
h2 { font-size: 20px; }
h2.brand { color: #542C81 !important; font-weight: 600; }
h3 { font-size: 16px; }
hr.tiny { width: 40px; margin: 0 auto 2%; border: 0; height: 0; border-top: 3px solid #333; border-bottom: 0 none; }

ul.disc { list-style: disc; padding: 0 50px 0 15px; }
ul.inline-list { float: left; margin-right: 5%; }
ul.inline li { display: inline-block; margin-right: 15px; color: #000; font-weight: 600; }
ul.inline li:last-child { margin-right: 0; }
ul.center { text-align: center; }
ul.bullet a:before { float: left; color: #666; font-size: 8px; content: "\25b6"; margin-top: 8px; margin-right: 5px; }

ul.inline-three { position: relative; width: 100%; }
ul.inline-three li { position: relative; float: left; width: 33.333%; }
ul.inline-three li img { width: 98%; margin: 0 auto; }

ul.table li { float: left; }
ul.table.two-cell li { width: 300px; padding: 8px 0; border-bottom: 1px solid #EEE; }
ul.table.two-cell li:nth-child(2n+1) { clear: left; width: 320px; }
ul.table.two-cell li:first-child, ul.table.two-cell li:nth-child(2) { padding: 0 0 10px; }

img.autosize { width: 100%; height: auto; }
img.max-autosize { width: auto; max-width: 100%; height: auto; }
img.page-img { float: left; margin: 0 50px 30px 0; width: auto; height: auto; }
img.page-img.larger { width: inherit; max-width: 500px; }
img.page-img.left { float: left; margin: 0 40px 30px 0; }
img.noshow { display: none; }
.toggle-off { display: none; }
.top-space { padding-top: 60px; }

/* Horizontal Rule */
hr { border: 0; height: 0; margin: 0; border-top: 1px solid #DDD; border-bottom: 0 none;}
hr.gray { border: 0; height: 0; margin: 0; border-top: 1px solid #999; border-bottom: 0 none;}
hr.dashed { clear: both; border: 0; height: 0; border-top: 2px dashed #DDD; border-bottom: 0 solid #DDD;}
hr.faded { clear: both; height: 1px; border: 0; margin: 0 auto;  background-image: -webkit-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.45), rgba(0,0,0,0)); background-image: -moz-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.45), rgba(0,0,0,0)); background-image: -ms-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.45), rgba(0,0,0,0)); background-image: -o-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.45), rgba(0,0,0,0)); }
hr.faded.white { clear: both; height: 1px; border: 0; margin: 0 auto; background-image: -webkit-linear-gradient(left, rgba(0,0,0,0), rgba(255,255,255,0.60), rgba(0,0,0,0)); background-image: -moz-linear-gradient(left, rgba(0,0,0,0), rgba(255,255,255,0.60), rgba(0,0,0,0)); background-image: -ms-linear-gradient(left, rgba(0,0,0,0), rgba(255,255,255,0.60), rgba(0,0,0,0)); background-image: -o-linear-gradient(left, rgba(0,0,0,0), rgba(255,255,255,0.60), rgba(0,0,0,0)); }
hr.faded.gray { clear: both; height: 1px; border: 0; margin: 0 auto;  background-image: -webkit-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.2), rgba(0,0,0,0)); background-image: -moz-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.2), rgba(0,0,0,0)); background-image: -ms-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.2), rgba(0,0,0,0)); background-image: -o-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.2), rgba(0,0,0,0)); }

/* Branding */
a.facebook i { color: #3b5998 !important; }
a.twitter i { color: #55acee !important; }
a.pinterest i { color: #cb2027 !important; }
a.instagram i { color: #125688 !important; }

a.facebook-bg { background: #3b5998 !important; }
a.facebook-bg i { color: #FFF !important; background: #3b5998 !important; padding: 6px 10px; border-radius: 49%; }
a.twitter-bg { background: #55acee !important; }
a.pinterest-bg { background: #cb2027 !important; }
a.instagram-bg { background: #125688 !important; }
a.chat { background: #C63 !important; }

.brand { color: #542C81; font-weight: 600; }
.brand-bg { background: #E31837 !important; }
.bg-light-gray { background: #F9F9F9 !important; }
.trademark { font-size: .7em; vertical-align: top; }
.hover-trans a { transition: color 0.4s ease 0s; }
.hover-bg-trans a { transition: background 0.4s ease 0s; }

.no-top-margin { margin-top: 0 !important; }
.no-bottom-margin { margin-bottom: 0 !important; }
.no-top-padding { padding-top: 0 !important; }
.no-bottom-padding { padding-bottom: 0 !important; }
.center { text-align: center; }

/* Header */
#porheader-wrap { position: relative; width: 100%; background: #FFF; padding: 20px 0 15px; z-index: 1002; }
#porheader-wrap.fixed { display: none; position: fixed; top: 0; z-index: 10001; opacity: 1; }
#porheader { position: relative; width: 80%; margin: 0 auto; padding: 0 0; }
#porheader #logo { position: relative; float: left; width: auto; line-height: 0; overflow: hidden; }
#porheader #logo img { width: auto; height: auto; max-height: 160px; }

/* Header links */
#header-links { float: right; margin-left: 4%; margin-top: 28px; }
#header-links.vertical-links { margin-top: 0; }
#header-links.vertical-links li.navbar-icon { float: none; margin-left: 0; margin-bottom: 5px; }
#header-links.vertical-links li.navbar-icon:last-child { margin-bottom: 0; }
#porheader-wrap.fixed #header-links.vertical-links { margin-top: 5px; }
#porheader-wrap.fixed #header-links.vertical-links li.navbar-icon { float: left; margin-left: 10px; margin-bottom: 0; }
#porheader-wrap.fixed #header-links.vertical-links li.navbar-icon:last-child { margin-bottom: 0; }
#header-links li.navbar-icon { float: left; margin-left: 15px; }
#header-links li.navbar-icon:first-child { margin-left: 0; }
#header-links li.navbar-icon img { width: 20px; height: 20px; }

/* Menu */
#pormenu { display: none; position: fixed; top: 15px; left: 10px; z-index: 10002; }
#pormenu ul { display: none; position: fixed; width: 100%; height: 100%; /*background-color: rgba(0, 0, 0, 0.95);*/ background: #333 url(images/bg-black.png) repeat; background-position: top left; top: 0; right: 0; bottom: 0; left: 0; overflow-y: scroll; overflow-x: hidden; }
#pormenu ul li { float: none; position: relative; display: block; width: 90%; padding: 0 2%; }
#pormenu ul li:first-child { padding-top: 13px; }
#pormenu ul li a { float: left; clear: left; font-size: 16px; color: #FFF; text-decoration: none; text-transform: uppercase; padding: 10px 0 10px 15px; white-space: nowrap; }
#pormenu ul li.close-menu a { margin-top: 20px; background: #444; line-height: 40px; padding: 8px 23px 0 18px; margin-left: 12px; }
#pormenu ul li a:hover { color: #DDD; }
#pormenu ul li:last-child a { margin-bottom: 15%; }
#pormenu i { margin-right: 7px; }
#pormenu ul li.menu-buttons { border-bottom: 1px solid #333; margin-left: 20px; margin-bottom: 15px; padding: 20px 0; overflow: hidden; }
#pormenu ul li.menu-buttons div { float: left; }
#pormenu ul li.menu-buttons div a { float: left; display: block; background: #444; padding: 10px 5px; margin-left: 5px; }
#pormenu ul li.menu-buttons div.first a { margin-left: 0; }
#pormenu ul li.menu-buttons div i { float: left; font-size: 26px; margin-left: 8px; }
#pormenu ul li.menu-buttons div a.adjust-one i { margin-top: 1px; }
#pormenu ul li.menu-buttons div.exit { float: right; }
#pormenu ul li.menu-buttons div.exit a { padding: 10px; }

/* Navbar */
#navbar-wrap { position: absolute; bottom: 0; right: 0; z-index: 2002; padding: 0; padding-right: 0; }
#navbar { clear: both; position: relative; float: right; margin-top: 0; padding: 0; }
#navbar ul { float: left; }
#navbar ul li { position: relative; float: left; padding: 0 0; line-height: 45px; border-right: 1px solid #FFF; }
#navbar ul li:first-child { padding-left: 0; }
#navbar ul li:last-child { border-right: 0 none; }
#navbar ul li.no-border { border-right: 0 none; }
#navbar ul li a { display: block; font-family: 'Roboto Condensed', sans-serif; color: #FFF; font-weight: 300; text-transform: uppercase; background: #542C81; padding: 0 30px; }
#navbar ul li a:hover { background: #715294; transition: background 0.4s ease 0s; text-decoration: none; }
#navbar ul li.dropdown i { padding-left: 7px; }

/* Navbar submenu */
#navbar ul ul { position: absolute; right: 9999px; width: auto; margin: 0 0; padding: 0 0; z-index: 2004; opacity: 0;
transition: opacity .5s ease-in-out; -moz-transition: opacity .5s ease-in-out; -webkit-transition: opacity .5s ease-in-out; }
#navbar ul li.dropdown:hover ul { opacity: 1; left: 0; right: auto; }
#navbar ul ul li { float: none; display: block; width: 100%; line-height: 1; background: #333; border-right: 0 none; padding: 5px 10px; }
#navbar ul ul li:first-child { padding-top: 10px; padding-left: 10px; }
#navbar ul ul li:last-child { padding-bottom: 15px; }
#navbar ul ul li a { display: block; min-width: 100%; font-size: 15px; font-weight: 400; text-align: left; background: none; padding: 0 0 !important; white-space: nowrap; }
#navbar ul ul li a:hover { background: none; }

/* Header store locations */
#header-locations { position: relative; width: 100%; float: right; margin-bottom: 15px; }
#header-locations ul { float: right; margin-top: 4px; }
#header-locations ul.locations { float: right; margin-top: 0; margin-right: 10px; }
#header-locations ul li { position: relative; display: block; text-align: right; font-family: 'Roboto Condensed', sans-serif; font-size: 16px; line-height: 1; padding: 2px 0 3px; white-space: nowrap; }
#header-locations ul.locations li { font-size: 28px; }
#header-locations ul li:last-child { margin-right: 0; }
#header-locations ul li a { color: #542C81; text-decoration: none; }
#header-locations ul li a:hover { color: #333; }
#header-locations ul li i { color: #111; margin-left: 5px; }
#header-locations ul li a.facebook-bg i { float: left; margin-top: -10px; }
#header-locations ul li a.facebook-bg i:hover { opacity: .9;}
#header-locations ul li span { color: #555; font-size: 20px; font-style: italic; }

.store-locations-call-list { position: relative; width: 100%; margin: 0 auto; }
.store-locations-call-list ul { text-align: center; }
.store-locations-call-list ul li { display: block; margin: 0 auto 15px; max-width: 300px; }
.store-locations-call-list ul li a { display: block; padding: 15px 5px; margin: 0 auto; white-space: nowrap; font-size: 20px; color: #FFF; border-radius: 0px; background: #542C81; /*background-image: -webkit-linear-gradient(top, #DD1F1F, #542C81); background-image: -moz-linear-gradient(top, #DD1F1F, #542C81); background-image: -ms-linear-gradient(top, #DD1F1F, #542C81); background-image: -o-linear-gradient(top, #DD1F1F, #b31919); background-image: linear-gradient(to bottom, #DD1F1F, #542C81);*/ }
.store-locations-call-list ul li span { display: block; margin-top: 5px; }
.store-locations-call-list ul li a:hover { text-decoration: none; }
.store-locations-call-list i { display: inline-block; vertical-align: top; margin-top: 6px; font-size: 14px; color: #999; }

/* Fixed header */
#porheader-wrap.fixed #logo img { max-height: 40px; }
#porheader-wrap.fixed #navbar { margin-top: 0; }
#porheader-wrap.fixed #header-links { margin-top: 10px; }
#porheader-wrap.fixed.navbar-under-logo { border-bottom: 0 none; }


/* Search bar */
#search-bar-wrap { position: relative; width: 90%; background: #999; padding: 5px 5%; box-shadow: 0 4px 4px -2px #333; }
/*#search-bar-wrap { position: relative; width: 99%; background: #FFF; padding: 5px .5%; }*/
#search-bar { /*display: none;*/ position: relative; float: left; width: 78%; background: #EEE; padding: 0; margin: 0 auto; border: 1px solid #333; border-radius: 4px; overflow: hidden; /*-webkit-transition: width 1s, height 1s; transition: width 1s, height 1s;*/ }
#search-bar-form { position: relative; width: 100%; }
#search-bar-form input { width: 90%; border: 0 none; height: 40px; line-height: 1; font-size: 18px; color: #111; background: #EEE; padding: 0 16px; margin: 0; }
#search-bar-form .btn-search { position: absolute; top: 0; right: 0; font-family: 'Roboto Condensed', sans-serif; font-size: 16px; color: #FFF; text-transform: uppercase; text-decoration: none; line-height: 40px; padding: 0 13px; margin: 0; background: #E31837; }
#search-bar-form .btn-search:hover { opacity: .9; }
#search-bar-form .btn-search i { float: left; font-size: 20px; line-height: 40px; }
#por-search-box { border-left: 4px solid #E31837 !important; padding-left: 10px; }

#search-bar-cart { position: relative; float: right; width: 21%; height: 40px; border: 1px solid #333; border-radius: 4px; background: #EEE; /*border-right: 4px solid #999;*/ }
#search-bar-wrap.fixed #search-bar-cart { margin-top: 5px; }
#search-bar-cart ul { float: left; }
#search-bar-cart ul li { float: left; font-family: 'Roboto Condensed', sans-serif; line-height: 40px; text-transform: uppercase; font-size: 16px; font-weight: 700; margin-right: 10px; }
#search-bar-cart ul li:first-child { margin-left: 10px; }
#search-bar-cart ul li:last-child { /*float: right;*/ margin-right: 10px; }
#search-bar-cart ul li a { color: #111; text-decoration: none; }
#search-bar-cart ul li a:hover { color: #C00; }
#search-bar-cart img { float: left; width: 28px; height: 28px; margin-top: 6px; margin-right: 8px; }

#search-bar-cart.search-bar-cart-menu ul { z-index: 2003; }
#search-bar-cart.search-bar-cart-menu ul li.search-bar-cart-menu { display: none; position: absolute; right: 0; height: 40px; } 
#search-bar-cart.search-bar-cart-menu ul ul { position: absolute; top: 40px; right: 9999px; width: auto; margin: 0 0; padding: 0 0; z-index: 2002; opacity: 0;
transition: opacity .3s ease-in-out; -moz-transition: opacity .3s ease-in-out; -webkit-transition: opacity .3s ease-in-out; }
#search-bar-cart.search-bar-cart-menu ul li:hover ul { left: auto; right: 10px; z-index: 2001; opacity: 1; }
#search-bar-cart.search-bar-cart-menu ul li:hover ul ul { display: none; }
#search-bar-cart.search-bar-cart-menu ul li:hover ul i { float: right; }
#search-bar-cart.search-bar-cart-menu ul ul li { float: none; position: relative; display: block; width: 100%; line-height: 1; background: #333; border-right: 0 none; padding: 5px 10px; }
#search-bar-cart.search-bar-cart-menu ul ul li:last-child { padding-bottom: 10px; }
#search-bar-cart.search-bar-cart-menu ul ul li a { display: block; min-width: 100%; color: #FFF; font-size: 15px; font-weight: 400; text-align: left; padding: 0 0; white-space: nowrap; }
#search-bar-wrap.fixed #search-bar-cart.search-bar-cart-menu ul li.search-bar-cart-menu { display: block; }
#search-bar-wrap.fixed #search-bar-cart.search-bar-cart-menu ul li.hide-in-cart-menu { display: none !important; }

/* Fixed search bar */
#search-bar-wrap.fixed { position: fixed; top: 0; padding-top: 0; padding-bottom: 0; z-index: 100001; }
#search-bar-logo { display: none; position: relative; float: left; width: 6%; }
#search-bar-logo img { width: auto; height: 40px; margin-top: 0; transition: width 1s; -webkit-transition: width 1s; }
#search-bar-wrap.fixed.show-search-bar-logo #search-bar { width: 72%; margin-top: 5px; /*transition: width 1s; -webkit-transition: width 1s;*/ }
#search-bar-wrap.fixed.show-search-bar-logo #search-bar-logo { display: block; line-height: 0; }
#search-bar-wrap.fixed.show-search-bar-logo #search-bar-logo img { height: 50px; }

/* Slideshow */
#slideshow-container { position: relative; width: 80%; background: #FFF; overflow: hidden; margin: 0 auto; padding: 0 0; }
#slideshow-left { position: relative; float: left; width: 50%; }
#slideshow-right { position: relative; float: left; width: 50%; }
.slideshow-wrap { position: relative; display: block; width: 100%; padding: 0; margin: 0 auto; overflow: hidden; border: 0 solid #333; }
#slider1_container { position: relative; margin: 0 auto; top: 0; left: 0; overflow: hidden; }
#slider1_container a { display: block; }
.slideshow-dimensions { width: 1470px; height: 700px; /*min-width: 1024px;*/ }
.jssorb21 div, .jssorb21 div:hover, .jssorb21 .av { background: url(images/b13.png) no-repeat; overflow: hidden; cursor: pointer; }
.jssorb21 div { background-position: -5px -5px; }
.jssorb21 div:hover, .jssorb21 .av:hover { background-position: -35px -5px; }
.jssorb21 .av { background-position: -65px -5px; }
.jssorb21 .dn, .jssorb21 .dn:hover { background-position: -95px -5px; }
.jssora21l, .jssora21r, .jssora21ldn, .jssora21rdn { position: absolute; cursor: pointer; display: block; background: url(images/a21.png) center center no-repeat; overflow: hidden; }
.jssora21l { background-position: -3px -33px; }
.jssora21r { background-position: -63px -33px; }
.jssora21l:hover { background-position: -123px -33px; }
.jssora21r:hover { background-position: -183px -33px; }
.jssora21ldn { background-position: -243px -33px; }
.jssora21rdn { background-position: -303px -33px; }
.jssorb21 { position: absolute; bottom: 2%; left: 6px; }
.jssora21l, .jssora21ldn { width: 55px; height: 55px; top: 30%; left: 1%; }
.jssora21r, .jssora21rdn { width: 55px; height: 55px; top: 30%; right: 1%; }
#slider1_container img:hover, .slides .slide-panel:hover { cursor: pointer; }
.slideshow-wrap .slide-content-overlay { position: absolute; width: 92%; top: 5%; right: 0; bottom: 5%; left: 0; text-align: center; /*background-color: rgba(0, 0, 0, 0.2);*/ border-radius: 0; padding: 0 0; margin: 0 auto;}
.slideshow-wrap .slide-content-overlay:hover { cursor: pointer; }
.slideshow-wrap .slide-content { position: absolute; top: 0; width: 100%; text-align: center; }
.slideshow-wrap .slide-caption { position: absolute; top: 88%; left: 2%; width: 100%; font-size: 45px; color: #FFF; }
.slideshow-wrap .slide-link { position: absolute; top: 5px; right: 2%; width: 250px; margin: 0 25px 0; }
.slideshow-wrap .slide-link a { font-family: 'Roboto Condensed', sans-serif; font-size: 20px; font-weight: 500; color: #FFF; text-align: center; text-transform: uppercase; background: #542C81; padding: 15px 25px 17px; border-radius: 0; overflow: hidden; }
.slideshow-wrap .slide-link a:hover { background: #FFF; color: #111; transition: background 0.4s ease 0s; text-decoration: none; }

/* Tiles */
.portiles { position: relative; width: 80%; padding: 4px 0 0; background: #F6F6F6; margin: 0 auto; z-index: 1001; }
.portiles ul { position: relative; width: 100%; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; text-align: center; margin: 0 auto; }
.portiles ul li { position: relative; width: 32.93%; margin: 0 .2% 4px; text-align: center; line-height: 0; }
.portiles ul li a { display: block; color: #FFF; font-size: 20px; text-transform: uppercase; }
.portiles ul li img { width: 100%; height: auto; }
.portiles ul li span { position: absolute; display: block; bottom: 0; left: 0; right: 0; width: 100%; text-align: center; background-color: rgba(0, 0, 0, 0.3); padding: 30px 0; z-index: 1002; }
.portiles ul li span:hover { background-color: rgba(0, 0, 0, 0.4) }

/* Icons */
.poricons { position: relative; width: 80%; background: #542C81; padding: 30px 0; margin: 0 auto; z-index: 1001; }
.poricons h3 { font-size: inherit; }
.poricons ul { position: relative; display: table; width: 100%; margin: 0 auto; }
.poricons ul li { position: relative; display: table-cell; vertical-align: middle; width: 25%; font-size: 24px; text-align: center; white-space: nowrap; }
.poricons img { vertical-align: middle; width: 40px; height: auto; margin-right: 15px; }
.poricons span { vertical-align: middle; }
.poricons a { display: block; color: #FFF; }
.poricons a:hover { color: #DDD; text-decoration: none; }

/* Banners */
.porbanners-wrap { padding: 0 0; }
.porbanners-wrap ul { width: 76%; text-align: left; background: #F6F6F6; padding: 2% 2% 3.5%; margin: 0 auto; }
.porbanners-wrap.page-banners ul { width: 100%; background: #FFF; padding-bottom: 0; }
.porbanners-wrap ul li { position: relative; display: inline-block; width: 28%; vertical-align: top; padding: 0 0 70px; margin: 0 3% 0; }
.porbanners-wrap ul li:first-child { margin-left: 0; }
.porbanners-wrap ul li:last-child { margin-right: 0; }
.porbanners-wrap ul li img { width: 100%; height: auto; /*border-radius: 20px;*/ overflow: hidden; }
.porbanners-wrap ul li img:hover { opacity: .9; }
.porbanners-wrap ul li h2 { font-size: 24px; color: #333; padding: 0; margin: 20px 0 10px; text-transform: uppercase; }
.porbanners-wrap.page-banners ul li h2 { font-size: 20px; }
.porbanners-wrap ul li .banner-content { overflow: hidden; width: 97%; margin: 0 auto; }
.porbanners-wrap ul div.readmore a { position: absolute; bottom: 0; display: block; width: 98%; text-align: center; color: #FFF; font-family: 'Roboto Condensed', sans-serif; font-weight: 500; font-size: 15px; background: #542C81; padding: 20px 0; /*margin: 0 auto;*/ margin-top: 15px; text-decoration: none; border-radius: 0; text-transform: uppercase; }
.porbanners-wrap ul div.readmore a:hover { background: #715294; transition: background 0.4s ease 0s; }
.porbanners-wrap.border-bottom { border-bottom: 40px solid #EEE; }

/* Panels */
.porpanels { position: relative; width: 80%; background: #EEE; padding: 2.5% 0; border-bottom: 4px solid #CCC; margin: 0 auto; z-index: 1001; }
.porpanels-content { position: relative; width: 90%; margin: 0 auto; }
.porpanels h2 { margin: 0 0 15px; }

/* Categories */
.porcat { position: relative; width: 90%; background: #EEE url(images/bg-gray.png) repeat; background-position: top left; padding: 4% 0; margin: 0 auto; z-index: 1001; }
.porcat h2 { text-align: center; margin-bottom: 40px; }
.porcat ul { width: 90%; margin: 0 auto; text-align: center; }
.porcat ul li { position: relative; display: inline-block; width: 11%; margin: 0 1% 3%; vertical-align: top; }
.porcat ul li a { color: #111; text-decoration: none; }
.porcat ul li span { display: block; text-align: center; text-transform: uppercase; line-height: 1.2; margin-top: 10px; }
.porcat img { width: 100%; height: auto; border: 2px solid #222; border-radius: 10px; overflow: hidden; }

/* Logos */
.porlogos { position: relative; width: 90%; background: #FFF; padding: 3% 0 2%; margin: 0 auto; z-index: 1001; }
.porlogos ul { text-align: center; }
.porlogos ul li { display: inline-block; vertical-align: middle; margin: 0 2% 1%; }
.porlogos img { width: auto; height: auto; max-height: 70px; }

/* Banners */
.porbanners { position: relative; width: 90%; background: #FFF; padding: 0; margin: 0 auto; z-index: 1001; } 
.porbanners ul li { display: block; position: relative; width: 100%; line-height: 0; overflow: hidden; }
.porbanners ul li:nth-child(2n+1) { background: #EEE; }
.porbanners h2 { margin-bottom: 25px; line-height: 1.2; }
.porbanners .banner-text { position: relative; float: left; width: 44%; padding: 2.5% 3% 0; }
.porbanners .banner-img { position: relative; float: left; width: 50% }
.porbanners ul li:nth-child(2n+1) .banner-img { float: right; }
.porbanners .banner-img img { width: 100%; height: auto; }

/* Content */
.content-wrap { position: relative; width: 80%; background: #FFF; padding: 1.5% 0 2%; margin: 0 auto; border-top: 4px solid #DDD; }
.content { position: relative; width: 70%; float: left; padding: 0; }
.content.full-width { width: 100%; padding-top: 0; }
.content h1 { margin: 1px 0 13px; }
.content h2 { color: #000; margin: 25px 0 10px; }
.content a { text-decoration: none; }
.content a:hover { color: #715294; }
.content strong { font-weight: 700; }
.page-img.fr img { margin: 20px 0 20px 40px; }
.page-buttons { width: 96%; padding: 5% 2%; }
.page-buttons ul li { /*text-transform: uppercase;*/ }
.page-buttons ul li span { display: block; margin: 25px 0 5px; font-size: 22px; }
.page-buttons ul li:first-child span { margin-top: 0; }
.page-buttons ul li a { display: block; background: #E31837; border-radius: 50px; font-size: 20px; color: #FFF; text-decoration: none; padding: 18px 0; }
.page-buttons ul li a:hover { color: #FFF; opacity: .9; }
.page-buttons ul li img { width: auto; height: 25px; margin: 3px 5px 0 0; vertical-align: top; }

.feedback { font-size: 14px; }
.feedback img { margin-right: 5px; }

.store-locations-wrap { padding: 35px 0 0; }
.store-location { clear: both; margin-bottom: 45px; }
.store-location ul { float: left; width: 30%; }
.store-location h2 { margin-top: 0; }
.store-location h3 { font-size: 18px; margin-top: 15px; }
.store-map { float: left; position: relative; width: 70%; }
.store-map iframe { width: 100%; height: auto; min-height: 350px; border: 1px solid #999 !important; }

/* About */
#about-panel-outer { position: relative; width: 96%; background: #F5F5F5; margin: 0 auto; padding: 20px 2%; }
#about-panel { position: relative; width: 96%; font-size: 18px; text-align: center; line-height: 1.4; background: #FFF; padding: 20px 2%; margin: 0 auto; }
#about-panel h2 { font-size: 24px; color: #542C81; margin-top: 5px; }
#about-panel h3 { font-size: 20px; color: #542C81; margin-top: 5px; margin-bottom: 5px; }
#about-panel ul.inline li { display: inline-block; margin-right: 15px; color: #542C81; font-weight: 600; }
ul.inline li:last-child { margin-right: 0; }

/* Catalog */
.catalog { position: relative; float: left; width: 20%; font-family: 'Roboto Condensed', sans-serif; background: #F6F6F6; border: 1px solid #DDD; border-radius: 6px; padding: 1.3% 2%; margin-right: 4%; }
.catalog .catalog-title { display: block; color: #111; font-size: 24px; line-height: 1.1; margin-top: 4px; text-transform: uppercase; }
.catalog ul { margin-top: 15px; }
.catalog ul li { display: block; line-height: 1.2; margin-bottom: 8px; }
.catalog ul li a { display: block; color: #444; font-size: 18px; text-transform: uppercase; text-decoration: none; }
.catalog ul li a:hover { color: #E31837; }

/* Mobile Catalog */
.mobile-catalog { position: relative; }
.mobile-catalog h1 { font-size: 20px; margin: 8px 0 15px; }
.mobile-catalog ul { width: 100%; }
.mobile-catalog ul li { background: none; }
.mobile-catalog ul li a { display: block; color: #111; border-bottom: 1px solid #DDD; line-height: 1.2; text-decoration: none; text-transform: uppercase; padding: 6px 0 8px; }
.mobile-catalog ul li:first-child a { border-top: 1px solid #DDD; }
.mobile-catalog ul li a:before { content: "\203A"; font-size: 1.3em; margin-right: 3px; }
.readmore-button.show-in-tablet a { font-family: 'Roboto Condensed', sans-serif; font-size: 20px; background: #F6F6F6; border-color: #DDD; border-width: 1px; margin: 0 0 20px; white-space: nowrap; }
.readmore-button.show-in-small-tablet a { font-family: 'Roboto Condensed', sans-serif; font-size: 20px; background: #F6F6F6; border-color: #DDD; border-width: 1px; margin: 0 0 20px; white-space: nowrap; }
.readmore-button.nav-button a { margin: 15px 0; }
.readmore-button.nav-button i { margin-left: -5px; padding-right: 3px; }

/* Footer */
.porfooter-wrap { position: relative; width: 100%; margin: 0 auto; }
#porfooter { position: relative; width: 78%; color: #FFF; font-size: 14px; text-align: center; line-height: 1.4; /*background: #333;*/ background: #333 url(images/bg-dark.png) repeat; background-position: top left; background-size: 18px 30px; padding: 35px 1% 30px; margin: 0 auto; }
#porfooter h4 { font-size: 20px; color: #FFF; margin-bottom: 15px; text-align: center; }
#porfooter h4 span { display: block; color: #FFF; }
#porfooter a { color: #DDD; text-decoration: none; }
#porfooter a:hover { color: #FFF; }
.footer-locations, .footer-links, #footer-connect { position: relative; display: inline-block; vertical-align: top; text-align: left; padding: 0 1%; margin: 0 auto 15px; }
.footer-locations ul, .footer-links ul { text-align: left; display: inline-block; margin: 0 15px 25px; vertical-align: top; }
.footer-links a { font-size: 14px; }
#footer-connect { padding: 0; }
#footer-connect ul { text-align: left; }
#footer-connect ul li { display: inline-block; color: #FFF; margin: 0 5px; }
#footer-connect ul li:first-child { margin-left: 0; }
#footer-connect ul li:last-child { margin-right: 0; }
#footer-connect i { font-size: 26px; }
#porfooter.center-footer ul { text-align: center; }
#porfooter.center-footer ul li { display: inline-block; color: #FFF; margin: 0 5px; }
.footer-links i { width: 20px; text-align: center; }
.footer-locations img { width: auto; height: 10px; }

/* Copyright */
.serving { position: relative; width: 98%; margin: 20px auto 0; color: #DDD; text-align: center; }
#copyright { position: relative; width: 98%; display: block; text-align: center; color: #CCC; margin-top: 5px; }
#copyright ul { width: 100%; text-align: left; margin: 0 auto; }
#copyright ul li { display: inline-block; font-size: 12px; margin-left: 20px; }
#copyright ul li:first-child { margin-left: 0; }

/* Parallax - Stellar.js */
.parallax { position: relative; background: transparent; background-repeat: no-repeat; background-position: center 0; background-attachment: fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; z-index: 1000; overflow: hidden; }
.parallax .overlay { z-index: 1001; }

/* Backend */
#mainpage, #newitempage { float: left; width: 70%; padding: 0 0 40px; }
#mainpage h1, #newitempage h1 { display: block; margin: 13px 0 15px; /*text-transform: uppercase;*/ }
#mainpage h1 a, #newitempage h1 a { line-height: 0; font-size: 20px; margin-top: 0; text-decoration: none; }
#mainpage table tbody tr td h1, #newitempage table tbody tr td h1 { width: 100%; }
#mainpage h3, #newitempage h3 { font-size: 30px; padding: 0; margin: 0 0 30px; }
#mainpage h3 a, #newitempage h3 a { line-height: 0; font-size: 22px; margin-top: 10px; text-decoration: none; }
#mainpage h3 a:hover, #newitempage h3 a:hover { color: #111; }
#mainpage table { width: 100%; }
#mainpage form table tbody tr td { padding: 5px 0; }
#mainpage form table tbody tr td table tbody tr td { vertical-align: top; }
#mainpage table tbody tr td div.wrap4 img { margin: 20px 0; }
#mainpage ul { list-style: disc; margin: 10px 0 15px 25px; }
.multicolcell div { float: none !important; padding: 0 5px !important; }
.multicolcell { position: relative; display: block; float: left; width: 165px; height: 220px; text-align: center; border: 1px solid #DDD; box-shadow: 0 1px 4px #CCC; margin: 0 20px 18px 0; border-radius: 6px; padding-bottom: 15px; }
.multicolcell:hover { border-color: #DDD; }
.multicolcell a { }
.multicolcell a:hover { text-decoration: none; }
.multicolheading, .multicoldescr { display: block; font-size: 14px; font-family: 'Roboto Condensed', sans-serif; color: #333; font-weight: 500; text-transform: uppercase; line-height: 1.3; text-align: center; text-decoration: none !important; }
.thumbnailimgtall, .thumbnailimg { max-height: 110px; max-width: 110px; }
.wrap4 { display: block; margin-bottom: 5px; }
.cycle-slideshow { overflow: hidden; }
a.cycle-slide { margin-top: 0 !important; }
a.cycle-slide.cycle-slide-active { margin-top: 0 !important; }
div.detailedimg { margin: 10px 0 20px !important; }
.detailedimg p { font-size: 14px !important; color: #111 !important; line-height: 1.3 !important }
#form1 { margin-top: 20px; }
#form1 table tbody tr td { padding: 5px 0; }
#form1 table tbody tr td strong { line-height: 2; }
#form1 input { line-height: 1; padding: 7px; }
#form1 p input { margin-top: 10px; }
td.cattitle { padding: 20px 0; color: #FFF; background: #43854a; text-transform: uppercase; text-align: center !important; }
#productname { float: left; }
#mainpage table tbody tr td div.wrap4 img { margin: 0; float: left; }
#mainpage table tbody tr td { vertical-align: top; text-align: left; }
table.InventoryTable td { text-align: center !important; vertical-align: middle !important; }
.detailedviewrow { /*display: none;*/ }
ul.CommentBlock { margin-right: 60px !important; }
ul.CommentBlock li { font-size: 16px; }

/* Resources */
.resources { padding: 0 0 0 5px; }
.resources h3 { font-size: 20px; color: #111; padding: 0; margin: 10px 0 0; }
.resources h3 a { font-size: 16px; font-weight: bold; text-decoration: none; }
.resources p { padding: 0 0 0 5px; margin: 5px 0 10px; }
.resources ul { padding-left: 10px; }
.resources ul li a { background: url(images/bullet-dark.png) no-repeat 0 5px; padding-left: 12px; }

/* FAQs */
.faqs h3 { display: block; font-size: 18px; font-weight: 500; color: #333; padding: 5px 10px; line-height: inherit; }
.faqs .faq:nth-child(odd) { background-color: #F2F2F2; }
.faqs h3:hover { cursor: pointer; }
.faqs h3 span.faq-num { border-right: 2px solid #FFF; padding-right: 10px; }
.faqs h3 span.spacer { width: 15px; }
.faqs h3 span.show-faq { font-family: Arial, Helvetica, sans-serif; font-weight: 700; float: right; }
.faqs ul { background: #FFF; padding: 10px 15px; }
.faqs .faq:nth-child(even) ul { padding-top: 0; }
.faqs p { background: #FFF; padding: 10px 15px; }
.faqs .faq:nth-child(even) p { padding-top: 0; }

/* Misc */
* { -webkit-tap-highlight-color: rgba(0,0,0,0); }

::-webkit-input-placeholder { color: #111; }
:-moz-placeholder { color: #111; }
::-moz-placeholder { color: #111; }
:-ms-input-placeholder { color: #111; }

.go-to-top { display: none; position: fixed; bottom: 20px; right: 20px; z-index: 10001; }
.go-to-top a { display: block; line-height: 1; }
.go-to-top i { color: #777; font-size: 30px; line-height: 1; border: 1px solid #CCC; background: #FFF; padding: 8px 15px 10px; opacity: .9; }
.go-to-top i:hover { color: #333; }

.button { position: relative; display: block; margin: 20px 0 25px; }
.button a { width: auto; padding: 10px 15px; background: #542C81; color: #FFF; } 
.button a:hover { background: #715294; color: #FFF; }
.button-center { position: relative; display: block; margin: 0 auto; text-align: center; margin: 40px 0 25px; }
.button-center a { width: auto; padding: 20px 25px; background: #542C81; color: #FFF; font-size: 30px; } 
.button-center a:hover { background: #715294; color: #FFF; }

.contact-box-wrap { display: none; position: fixed; z-index: 4001; top: 0; right: 0; bottom: 0; left: 0; background-color:rgba(0, 0, 0, 0.5); }
.contact-box { position: fixed; background: #FFF; top: 50%; left: 50%; text-align: center; transform: translate(-50%, -50%); padding: 5%; }
.contact-box-title { font-size: 35px; line-height: 1.2; }
.contact-box-title span { display: block; font-size: 18px; }
.contact-box p { margin: 5px 0; }

/* Drop shadow */
.drop-shadow { position: relative; display: block; background: #FFF; line-height: 0; -webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; }
.drop-shadow:before, .drop-shadow:after { content: ""; position: absolute; z-index: -2; }
.lifted:before, .lifted:after { bottom: 20px; left: 5px; width: 50%; height: 20%; -webkit-box-shadow: 0 20px 5px rgba(0, 0, 0, 0.3); -moz-box-shadow: 0 20px 5px rgba(0, 0, 0, 0.3); box-shadow: 0 20px 5px rgba(0, 0, 0, 0.3); -webkit-transform: rotate(-6deg); -moz-transform: rotate(-6deg); -ms-transform: rotate(-6deg); -o-transform: rotate(-6deg); transform: rotate(-6deg); }
.lifted:after { right: 5px; left: auto; -webkit-transform: rotate(6deg); -moz-transform: rotate(6deg); -ms-transform: rotate(6deg); -o-transform: rotate(6deg); transform: rotate(6deg); }

/* Buttons */
.readmore-button { display: block; }
.readmore-button a { float: left; color: #333; border: 2px solid #333; line-height: 40px; background: #FFF; padding: 0 20px; margin: 15px 0 25px; }
.readmore-button a:hover { color: #111; text-decoration: none; }

/* Disable website scrolling */
.disable-scrolling { height: 100%; overflow: hidden; }

.inline-panels-wrap { position: relative; width: 100%; padding-top: 20px; }
.inline-panel { position: relative; display: inline-block; margin: 0 35px 25px 0; vertical-align: middle; }
.inline-panel:last-of-type { margin-right: 0; }
.inline-panel img { max-height: 320px; }


/* Full width */
body.full-width #porheader { width: 100%; }
body.full-width #porheader #logo { margin-left: 1%; } body.full-width #porheader-wrap.navbar-under-logo #logo { margin-left: 0; }
body.full-width #porheader #header-links { margin-right: 1%; } 
body.full-width #search-bar-wrap { width: 98%; }
body.full-width #slideshow-container { width: 100%; padding: 15px 0; }
body.full-width .slideshow-wrap { width: 98%; }
body.full-width h1.index { width: 96%; }
body.full-width .portiles { width: 100%; }
body.full-width .poricons { width: 100%; }
body.full-width .porpanels { width: 100%; }
body.full-width .porcat { width: 100%; }
body.full-width .porbanners { width: 100%; }
body.full-width .porlogos { width: 100%; }
body.full-width #porfooter { width: 100%; }

/* Media Querries */
.show-in-menu { display: none; }
.show-in-mobile { display: none; }
.show-in-tablet { display: none; }
.show-in-small-tablet { display: none; }

/* Contact Form */
.contact-form-wrap { position: relative; width: 100%; display: flex; flex-direction: row; justify-content: space-between; }
.contant-form { position: relative; float: left; width: 25%; }
.form-all { width: 100%; }
.supernova .form-all, .form-all { background: #F5F5F5; }

@media screen and (max-width : 1800px) {
  #search-bar-cart ul li { font-size: 13px; }
  #search-bar-cart ul li img { width: 20px; height: 20px; margin-top: 9px; margin-right: 5px; }
  .slideshow-wrap .slide-content-overlay { /*background-color: rgba(0, 0, 0, 0.3);*/ }
  .card-flip-back { padding-top: 40px; }
  .card-flip-back p { font-size: 13px; }
  .card-flip-back h2 { font-size: 15px; }
  .card-flip-back .readmore a { margin-top: 20px; font-size: 14px; }
}

@media screen and (max-width : 1600px) {
  #navbar-wrap { margin-top: 1.8%; }
  .portiles.flip-tiles ul li, .card-flip { width: 250px; height: 167px; }
  .card-flip-back h2 { font-size: 16px; }
  .card-flip-back .readmore a { }
  .porcat ul { width: 100%; }
  .porcat ul li { width: 15%; }
  .card-flip-back { padding-top: 20px; }
}

@media screen and (max-width : 1366px) {
  #search-bar-logo { width: 7%; }
  #search-bar-wrap.fixed #search-bar-cart ul li span { display: none; }
  #search-bar-wrap.fixed.show-search-bar-logo #search-bar { width: 71%; }
  .portiles.v2 ul li .tile-content { font-size: 12px; }
  .portiles.v2 ul li .tile-content h2 { font-size: 18px; }
  .portiles.v2 ul li .tile-content .readmore-button a { }
  .portiles.flip-tiles { width: 86%; padding: 0 2% 2%; }
  .content-wrap { width: 96%; padding: 2.5% 2%; }
}

@media screen and (max-width : 1280px) {
  #porheader { width: 98%; }
  #porheader #navbar { margin-top: 0; } #porheader-wrap.has-font-logo #navbar { margin-top: 8px; } #porheader-wrap.has-font-logo.fixed #navbar { margin-top: 8px; }
  #porheader #navbar ul ul li { /*margin: 0 10px;*/ padding: 5px 10px; padding-right: 0; }
  #porheader #navbar ul ul li a { font-size: 13px; }
  #porheader #navbar ul li.navbar-icon img { width: 15px; height: 15px; }
  #porheader-wrap.has-font-logo #header-links { margin-left: 2%; }
  #search-bar-wrap { float: none; display: block; width: 98%; padding: 5px 1%; }
  #search-bar-cart ul li { font-size: 12px; }
  #slideshow-container { width: 98%; }
  .slideshow-wrap .slide-content { }
  h1.index { width: 94%; }
  .portiles { width: 100%; }
  .portiles.flip-tiles { width: 96%; }
  .card-flip-back { padding-top: 17px; }
  .portiles.flip-tiles ul li, .card-flip { width: 230px; height: 154px; }
  .poricons { width: 100%; }
  .porpanels { width: 98%; }
  .porbanners-wrap ul { width: 94%; }
  .porcat { width: 100%; }
  .porcat ul li { width: 17%; }
  .porlogos { width: 100%; }
  .porbanners { width: 100%; }
  .store-map { width: 68%; }
  #porfooter { width: 98%; }
  .card-flip-back { padding-top: 15px; }
  .contact-form-wrap { flex-direction: column-reverse; }
  .contact-form-wrap .content, .contact-form-wrap .contant-form { float: none; width: 95%; margin: 0 auto 20px; }
}
@media screen and (max-width : 1140px) {
  img.page-img { margin: 0 50px 30px 0; width: 25%; height: auto; }
  .top-space { padding-top: 0; }
}
@media screen and (max-width : 1100px) {
  .portiles.flip-tiles ul li, .card-flip { width: 400px; height: 268px; }
  .card-flip-back p { padding: 0 10%; }
  .card-flip-back h2 { font-size: 18px; }
  .card-flip-back .readmore a { margin-top: 30px; font-size: 14px; }
  .card-flip-back { padding-top: 40px; }
}
@media screen and (max-width : 1024px) {
  #porheader { padding: 0; }
  #porheader-wrap.fixed, #porheader.has-font-logo.fixed { background: #FFF; border-bottom: 0 none; }
  #porheader-wrap.navbar-under-logo { padding-bottom: 7px; }
  #porheader-wrap.navbar-under-logo #porheader #logo { margin-top: 0; }
  #porheader-wrap.navbar-under-logo #porheader #header-links { top: 5px; }
  #porheader #logo { float: none; text-align: center; margin-left: 0; }
  #porheader #logo img { width: auto; max-height: 60px; }
  #porheader #pormenu { position: absolute; display: block; top: 5px; left: 5px; margin-top: 0; } #porheader-wrap.fixed #pormenu { top: 0; } #porheader-wrap.has-font-logo #pormenu { top: -5px; margin-top: 0; }
  .hide-in-menu { display: none !important; }
  #porheader-wrap.navbar-under-logo.has-font-logo #porheader #logo { margin-top: 0; }
  #porheader #pormenu .show-submenu img { /*background: #FFF;*/ border-radius: 2px; }
  #porheader #navbar-wrap { display: none; }
  #porheader #pormenu { margin-top: 11px; }
  #porheader #header-links li.navbar-icon { margin-top: 10px; }
  #porheader #header-links { float: none; position: absolute; top: 5px; right: 10px; margin-top: 0; } #porheader-wrap.fixed #header-links { top: 5px; margin-top: 0; }
  #porheader-wrap.fixed #header-links.vertical-links { margin-top: 0; }
  #porheader-wrap.fixed.has-font-logo #header-links.vertical-links { margin-top: 0; top: 0; }
  #porheader-wrap.has-font-logo #header-links { top: -2px; margin-top: 0; } #porheader-wrap.has-font-logo.fixed #header-links { top: -2px; margin-top: 0; }
  #porheader-wrap.navbar-under-logo #porheader #header-links { } #porheader-wrap.fixed.navbar-under-logo #porheader #header-links { top: 0; }
  #porheader #header-links .navbar-search, #porheader #header-links .navbar-cart { display: none; }
  #porheader #header-links .navbar-phone img { width: 30px; height: 30px; }
  #search-bar-form input { width: 90%; padding-right: 20%; }
  #search-bar { width: 100%; }
  #search-bar-cart { display: none; }
  #search-bar-wrap.fixed.show-search-bar-logo { display: none; }
  .portiles ul li { width: 48.8%; }
  .portiles ul li a { font-size: 18px; }
  .poricons { padding: 10px 0 0; }
  .poricons img { margin-right: 10px; }
  .show-in-mobile { display: block; }
  .hide-in-tablet { display: none !important; }
  .show-in-tablet { display: block !important; }
}
@media screen and (max-width : 1000px) {
  body { font-size: 14px; }
  ul.bullet a:before { margin-top: 5px; }
  .poricons { width: 100%; background: none; }
  .poricons ul li { display: block; width: 98%; background: #542C81; /*border-radius: 6px;*/ padding: 5% 0 6%; margin: 0 auto 10px; }
  .poricons ul li:last-child { margin-bottom: 0; }
  .poricons img { display: none; }
  .porpanels h2 { text-align: left; }
  .porcat ul li { width: 20%; }
  .porlogos img { max-height: 50px; }
  .porbanners h2 { font-size: 18px; }
  .portiles.flip-tiles { padding: 1% 2% 3%; }
  .card-flip-back { padding-top: 50px; }
  .portiles.flip-tiles ul li, .card-flip { width: 350px; height: 234px; }
  .catalog { width: 25%; }
  .catalog .catalog-title { font-size: 20px; }
  .catalog ul li a { font-size: 16px; }
  .content { width: 66%; }
  #mainpage, #newitempage { width: 65%; }
  #mainpage h1, #newitempage h1 { margin-top: 5px; }
}
@media screen and (max-width : 900px) {
  h1.index { font-size: 24px; }
  h1.index span { font-size: 20px; }
}
@media screen and (max-width : 800px) {
  .porcat ul li { width: 40%; }
  .porpanels h2 { font-size: 20px; }
  .porpanels h3 { font-size: 18px; }
  .portiles.v2 ul li { width: 96%; margin: 10px 2% 0; }
  .portiles.v2 ul li:last-child { margin-bottom: 10px; }
  .porlogos img { max-height: 40px; }
  .porbanners .banner-img { width: 44%; padding: 1% 3%; }
  .porbanners .banner-img img { margin-top: 5%; }
  .portiles.flip-tiles ul { display: block; width: 100%; text-align: center; } .portiles.flip-tiles ul.right-tiles { text-align: center; }
  .portiles.flip-tiles ul li, .card-flip { width: 400px; height: 268px; }
  .porbanners-wrap ul li { position: relative; display: block; width: 100%; margin: 0 0 40px; }
  .store-location ul { width: 40%; }
  .store-map { width: 58%; }
  .store-map iframe { min-height: 250px; }
  .page-img.fr { float: none; display: block; margin: 0 0 15px; }
  .page-img.fr img { margin: 15px 0 0; width: 100%; height: auto; }
  .store-location ul { width: 100%; }
  .store-map { clear: left; width: 100%; margin-top: 25px; }
  .store-map iframe { min-height: 250px; }
  .card-flip-back { padding-top: 70px; }
  h1.index { font-size: 22px; }
  h1.index span { font-size: 18px; }
}
@media screen and (max-width : 700px) {
  #slideshow-left { display: block; float: none; width: 100%; margin-bottom: 15px; }
  #slideshow-right { display: block; float: none; width: 100%; }
  .slideshow-wrap { border: 0 none; }
  .content h1 { font-size: 20px; margin-bottom: 15px; }
  .catalog { display: none; }
  .content, #mainpage, #newpage { width: 100%; }
  .show-in-small-tablet { display: block !important; }
  img.page-img { float: none; display: block; margin: 20px 0; width: 100%; height: auto; }
  ul.disc { margin-bottom: 20px; }
  .portiles ul li { width: 98%; margin: 0 0 4px; }
  .footer-links ul li { margin: 10px 0; }
}
@media screen and (max-width : 500px) {
  #porheader #logo a { font-size: 22px; }
  #porheader #pormenu { top: 5px; } #porheader-wrap.has-font-logo #pormenu { }
  #porheader #header-links { top: 5px; } #porheader-wrap.fixed #header-links { top: 4px; } #porheader-wrap.has-font-logo #header-links { top: -5px; }
  #porheader-wrap.has-font-logo.fixed #header-links { top: 0; }
  #porheader #header-links li.navbar-icon { margin-left: 5px; }
  #search-bar-form input { width: 80%; padding-right: 30%; }
  .portiles { width: 96%; }
  .portiles ul li a { font-size: 16px; }
  .poricons { width: 98%; }
  .porbanners .banner-img { float: none; display: block; width: 90%; margin: 0 auto; }
  .porbanners .banner-text { float: none; display: block; width: 90%; margin: 0 auto; }
  .porbanners ul li:nth-child(2n+1) .banner-img { float: none; display: block; }
  #porfooter { padding: 5% 0; text-align: left; }
  #footer-connect ul { text-align: left; }
  .card-flip-back { padding-top: 30px; }
  .portiles.flip-tiles ul li, .card-flip { width: 300px; height: 201px; }
  .slideshow-wrap .slide-text { font-size: 28px; }
  .slideshow-wrap .slide-content-overlay { }
  .slideshow-wrap .slide-text span { font-size: 45px; }
  .slideshow-wrap .slide-link a { font-size: 30px; }
  .multicolcell { width: 140px; height: 180px; }
  .thumbnailimgtall, .thumbnailimg { max-height: 80px; max-width: 80px; }
  .readmore-button.show-in-tablet a { font-size: 18px; }
}
@media screen and (max-width : 360px) {
  #pormenu ul li.menu-buttons div i { font-size: 20px; }
  #slideshow-container { width: 95%; }
  h1.index { width: 92%; font-size: 18px; padding: 15px 2% 20px; }
  h1.index span { font-size: 14px; }
  .portiles ul li a { font-size: 14px; }
  .portiles ul li span { background-color: rgba(0, 0, 0, 0.4); }
  .portiles.v2 ul li .tile-content { width: 92%; padding: 0 4%; font-size: 12px; }
  .portiles.v2 ul li .tile-content h2 { font-size: 20px; margin: 20px 20px; }
  .portiles.v2 ul li .tile-content .readmore-button a { font-size: 12px; margin-top: 5px }
  .porcat h2 { font-size: 20px; margin-bottom: 20px; }
  .porcat ul li { margin-bottom: 7%; }
  .porcat ul li span, .porcat.v2 ul li span, .porcat.v2a ul li span, .porcat.v3 ul li span { margin-top: 10px; }
  .porcat.v3 img { padding: 6px 0; }
  .hide-in-mobile { display: none !important; }
}