a:link {
text-decoration: none;
color: black;
}
a:visited {
text-decoration: none;
color: black;
}
a:hover {
text-decoration: none;
color: blue;
cursor: pointer;
}
a:active {
text-decoration: none;
color: black;
}
@font-face {
font-family: 'resamitzbold';
src: url('./fonts/resamitzbold/resamitzbold-webfont.eot');
src: url('./fonts/resamitzbold/resamitzbold-webfont.eot?#iefix') format('embedded-opentype');
src: local("☺"),
url('./fonts/resamitzbold/resamitzbold-webfont.woff2') format('woff2'),
url('./fonts/resamitzbold/resamitzbold-webfont.woff') format('woff'),
url('./fonts/resamitzbold/resamitzbold-webfont.ttf') format('truetype'),
url('./fonts/resamitzbold/resamitzbold-webfont.svg#resamitzbold') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'resamitz';
src: url('./fonts/resamitz/resamitz-webfont.eot');
src: url('./fonts/resamitz/resamitz-webfont.eot?#iefix') format('embedded-opentype');
src: local("☺"),
url('./fonts/resamitz/resamitz-webfont.woff2') format('woff2'),
url('./fonts/resamitz/resamitz-webfont.woff') format('woff'),
url('./fonts/resamitz/resamitz-webfont.ttf') format('truetype'),
url('./fonts/resamitz/resamitz-webfont.svg#resamitzbold') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'opensans';
src: url('fonts/opensans/OpenSans-Regular.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
html, body, div, object, blockquote, pre,
abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center, dl, dt, dd, fieldset, form, label, legend,
caption, tr, th, td {
margin: 0;
padding: 0;
border: 0;
font-size: 1em;
font-size: 1rem;
font-weight: normal;
background: transparent;
font-family: 'resamitzbold';
color: black;
}
#footer td, li {
color:black;
}
/*
ul{
list-style-type: none;
padding: 0px;
text-align:left;
}
li{
display:inline;
}
*/
p {
border: 0;
font-size: 1em;
font-size: 1rem;
font-weight: normal;
vertical-align: baseline;
background: transparent;
}
span {
font-family: 'opensans';
/* font-size: 9px;*/
/* line-height: 12px; */
}
a {
margin: 0;
padding: 0;
font-weight: normal;
}
h1, h2, h3, h4, h5, h6 {
margin: 0;
border: 0;
vertical-align: baseline;
background: transparent;
}
body {
line-height: inherit;
width:825px;
margin:auto;
height:auto;
color:black;
background-Color:white;
text-align:center;
}
html { }
body table {
margin: 0;
padding: 0;
font-size: 1em;
font-size: 1rem;
font-weight: normal;
vertical-align: baseline;
background: transparent;
}
::-webkit-input-placeholder { /* Chrome/Opera/Safari */
color: black;
}
::-moz-placeholder { /* Firefox 19+ */
color: black;
}
:-ms-input-placeholder { /* IE 10+ */
color: black;
}
:-moz-placeholder { /* Firefox 18- */
color: black;
}
[placeholder]:focus::-webkit-input-placeholder {
color: #fdfdfd;
}
/* ------------------------HEADER----------------------------*/
#header {
width:800px;
height:110px;
text-align:center;
margin:auto;
}
.content {
width:800px;
text-align:center;
margin-left:auto;
margin-right:auto;
margin-top:75px !important;
color:black;
background-Color:white;
}
#logoLinkToHome {
width: 200px;
height: 25px;
margin-left:5px;
display:inline;
}
#rightTop1 {
margin-right: 0px;
margin-top: 30px;
width: 400px;
height: 25px;
font-family: 'resamitzbold';
font-size: 14px;
float:right;
}
.headerOptionItem a:hover {
color:white;
background-Color:rgb(0,100,200);
padding:5px;
}
.headerOptionItem {
float:right;
padding-left:10px;
}
.headerOptionItemImage {
float:right;
padding-left:10px;
font-size:16px;
}
#Navigation {
display:block;
position: relative;
width:440px;
margin:auto;
height:40px;
float:right;
}
#Navigation ul.nav {
height: 40px;
background-color: white;
color:black;
padding-left:100px;
width:auto;
}
/*
ul.nav li {
float: right;
font-size: 17px;
cursor: pointer;
}
ul.nav li+li a{
border-right: 1px solid #000000;
padding-right: 10px;
padding-left: 10px;
padding-top:5px;
padding-bottom:3px;
}
#pri {
}
#pri > li {
background-color: white;
color:black;
font-weight: bold;
}
#pri > li.active, #pri > li:hover {
background-color: white;
color:black;
}
#pri li div.inner {
display:none;
position: absolute;
right: 0px;
top: 55px;
width: 800px;
height: 60px;
line-height: 16px;
}
#pri li div.inner li {
padding: 12px 0px 12px 12px;
font-size: 16px;
}
#pri li div.inner li a {
padding: 12px 0px 12px 6px;
margin: 0px;
border: none;
line-height: 16px;
}
#pri li div.inner li+li a{
padding: 12px 6px 12px 6px;
margin: 0px;
border: none;
line-height: 16px;
}
#pri li:hover div.inner, #pri li div.inner:hover {
display: block;
z-index: 1;
}
*/
#Navigation ul.nav.sec {
background-color: rgba(0,0,0,0.5);
color:white !important;
-webkit-transition: opacity 500ms;
-moz-transition: opacity 500ms;
-o-transition: opacity 500ms;
transition: opacity 500ms;
}
#Navigation ul.nav.sec {
background-Color:black;
}
ul.nav.sec li:hover {
color:white !important;
}
.inner a:link {
text-decoration: none;
color: white;
}
.inner a:visited {
text-decoration: none;
color: white;
}
.inner a:hover {
text-decoration: none;
font-weight: bolder;
cursor: pointer;
color: rgb(85,179,196);
}
.inner a:active {
text-decoration: none;
color:white;
}
/*
.arrow {
position:relative;
background: url(images/dropdownArrow.png) no-repeat top center;
height:30px;
width:100%;
opacity:0;
margin-top: 3px;
}
*/
ul.nav li:hover .arrow{
opacity: 1;
}
ul.nav li:hover > a{
color: white !important;
background-Color: rgb(0,100,200);
}
.nav.last {
color: rgb(220,220,220);
padding-right: 10px;
padding-left: 10px;
padding-top:5px;
padding-bottom:3px;
}
/*-------------------------END DROPDOWN MENU---------------------------*/
/* ------------------------END HEADER----------------------------------*/
/* ------------------------SLIDESHOW-----------------------------------*/
#topSlideShowContainer {
position: relative;
width: 825px;
height: 400px;
background-color: white;
overflow: hidden;
margin-left:auto;
margin-right:auto;
}
#topSlideShow {
position: relative;
width: 825px;
text-align: center;
margin-left:auto;
margin-right:auto;
margin-top:50px;
}
#slider1_container {
width: 825px;
height: 400px;
margin-top: 0px;
}
.slideTextContainer {
position: absolute;
width: 380px;
height: 300px;
top: 10px;
left: 425px;
text-align: left;
line-height: 1.8em;
font-size: 12px;
}
.slideStyle {
cursor: move;
position: absolute;
left: 0px;
top: 0px;
overflow: hidden;
width: 800px;
height: 375px;
}
.slideHeader {
display: block;
text-transform: uppercase;
font-size: 32px;
color: darkblue;
}
.slideSub1 {
display: block;
line-height: 1.1em;
font-size: 24px;
color: darkblue;
}
.slideSub2 {
display: block;
line-height: 1.1em;
font-size: 18px;
color: darkblue;
padding-right:5px;
}
.slideButton {
-webkit-appearance: none;
padding: 15px 45px;
float: left;
background-Color: rgb(0,100,200);
color:white;
font-size:24px;
display:block !important;
}
.slideImg {
position: absolute;
top: 23px;
width: 400px;
height: 300px;
left:0px;
opacity: 1;
}
.jssora07l, .jssora07r {
display:block !important;
}
/* ------------------------END SLIDESHOW------------------------------*/
/* ------------------------SLIDESHOW LINKS----------------------------*/
#belowSlideShow {
width:800px;
text-align:center;
margin:auto;
}
#slideshowLinks {
width: auto;
height: 40px;
background-Color:white;
margin:auto;
margin-top:-14px;
}
#slideshowLinksLine {
width: 100%;
height: 40px;
margin-top:-14px;
font-family: 'resamitzbold';
font-size: 14px;
background-Color:#e4eaee;
margin:auto;
}
#slideshowLinksLine ul {
text-align: center;
}
#slideshowLinksLine li+li{
border-left: 1px solid #000000;
padding-top: .5%;
padding-bottom: .5%;
}
.slideOptionItem {
padding: 10px;
line-height: 40px;
}
/* ------------------------END SLIDESHOW LINKS----------------------------*/
/* ------------------------TOP BLOCKS-------------------------------------*/
#topBlocks {
width: 800px;
margin: auto;
background-Color:white;
margin-top: 5px;
}
.img-list {
list-style-type: none;
margin: 0;
padding: 0;
text-align: left;
}
.img-list li {
display: inline-block;
width: 320px;
height: 119.5px;
margin: 0 1em 1em 0;
position: relative;
color:white;
}
.img-list li+li{
margin-left: 77.5px;
}
.textTopBox-content {
color: white;
cursor: pointer;
display: table;
height: 400px;
width: auto;
left: 0;
position: absolute;
top: 0;
opacity: 1;
}
.textTopBox-content span {
display: table-cell;
text-align: center;
vertical-align: middle;
text-transform:uppercase;
font-size: 36px;
line-height:25px;
}
.img-list li:hover .textTopBox-content {
opacity: 0;
}
.text-content {
padding-left:7%;
padding-right:7%;
padding-top: 0%;
background: rgba(0,0,0,0.5);
font-size:30px;
color: white;
cursor: pointer;
display: table;
height: 360px;
width: 405px;
left: 0;
position: absolute;
top: 0;
opacity: 0;
-webkit-transition: opacity 500ms;
-moz-transition: opacity 500ms;
-o-transition: opacity 500ms;
transition: opacity 500ms;
}
.text-content span {
display: table-cell;
text-align: left;
vertical-align: middle;
width:320px;
}
.img-list li:hover .text-content {
opacity: 1;
}
.uploadFilesBulletText {
padding-left: 20px;
line-height: 30px;
font-size: 22px;
width:800px;
word-wrap:none;
}
/* ------------------------END TOP BLOCKS----------------------------*/
#mainBody {
width: 800px;
margin: auto;
height: 550px;
margin-top: 20px;
background-Color:white;
}
/* ------------------------LEFT BLOCKS----------------------------*/
#leftBlocks {
width: 22%;
height: auto;
background-Color:white;
float:left;
}
#leftBlock1 {
height: 140px;
display:block;
}
#leftBlock2 {
height: auto;
background-Color:white;
display:block;
}
.navLeftBlockButton {
-webkit-appearance: none;
width:156px;
background-Color:black;
color:white;
font-size:16px;
padding-top:6px;
padding-bottom:6px;
padding-left:10px;
padding-right:10px;
cursor:pointer;
}
.filterHeader {
padding:2px;
cursor:pointer;
}
.navLeftBlockOptions {
margin-top: 10px;
font-size: 12px;
}
.navLeftBlockOptions li {
display:block;
}
.navLeftBlockOptionItem {
padding-right:0px;
font-size:14px;
display:block;
text-align:center;
line-height:20px;
}
.navLeftBlockFilterItem {
padding-right:0px;
font-size:18px;
display:block;
line-height:30px;
border: 1px solid #000000;
width: 90%;
padding-left: 5px;
margin: 5px 0px 5px 0px;
cursor:pointer;
}
#navLeftBlockFilterFavorites {
padding-right:0px;
color: white;
font-size:18px;
display:block;
line-height:30px;
border: 1px solid #000000;
width: 90%;
padding-left: 5px;
margin: 5px 0px 5px 0px;
background-color:black;
}
.expandFilterItem {
font-size: 24px;
float: right;
padding: 1px 5px;
cursor: pointer;
}
.filterCheckbox {
margin-top:-3px;
padding-top:5px;
padding-bottom:5px;
transform: scale(1.5);
}
.selectFilterItem {
font-size: 14px;
line-height:20px;
margin-top:10px;
}
.selectFilterItem :hover {
background-Color:darkblue;
color:white;
padding:5px;
}
.selectFilterBox {
width: 10px;
height: 10px;
padding-right: 10px;
}
.navLeftBlogOptions {
margin-top: 10px;
font-size: 12px;
line-height: 16px;
}
.navLeftBlogOptions li {
display:block;
text-align: left;
}
.navLeftBlogOptions li+li {
margin-top: 20px;
}
.navLeftGalleryOptions {
line-height: 16px;
}
.navLeftGalleryOptions ul {
margin-top: 10px;
}
.navLeftGalleryOptions li {
display:block;
text-align: left;
}
.navLeftGalleryOptions li+li {
margin-top: 10px;
}
.galleryInfoMain {
font-size: 13px;
}
.galleryInfoSub {
font-size: 11px;
font-face: 'resamitz';
}
.blogBullet {
float:left;
margin-right: 20px;
text-align:center;
width:30px;
height:30px;
background-color:rgb(229,236,239)
}
/*------------------------------------*\
Clickable Dropdown
\*------------------------------------*/
/*
#leftBlockFilters ul {
font-weight:900;
}
#leftBlockFilters ul li {
position:relative;
list-style:none;
cursor:pointer;
}
#leftBlockFilters ul li ul {
position:absolute;
left:0;
right:0;
}
#leftBlockFilters ul li a {
transition:background-color 0.2s ease-in-out;
-webkit-transition:background-color 0.2s ease-in-out;
-moz-transition:background-color 0.2s ease-in-out;
display:block;
padding:8px 10px 8px 40px;
background:#FFF;
color:#333;
text-decoration:none;
}
#leftBlockFilters ul li a:hover {
background:#F2F2F2;
}
/* Fallbacks */ /*
#leftBlockFilters .no-js ul {
display:none;
}
#leftBlockFilters .no-js:hover ul {
display:block;
}
/* ------------------------END LEFT BLOCKS----------------------------*/
/* ------------------------RIGHT BLOCKS-------------------------------*/
#rightBlocks {
width: 75%;
height: auto;
margin-left: 15px;
float:left;
display:inline-block;
}
#rightBlocksStore {
width: 74%;
height: auto;
margin-left: 25px;
float:left;
display:inline-block;
}
#rightBlockTopRow{
width: auto;
height: 50px;
}
#rightBlockGroup {
width:100%;
float:left;
height:270px;
background-Color:white;
}
#rightBlockBottomRow {
width: auto;
height: 200px;
padding-top: 10px;
clear: both;
background-Color: white;
}
#selectedFilters {
float: left;
font-style: italic;
font-size: 16px;
}
.listFilters {
background: black;
font-size: 16px;
font-style: normal;
margin-left: 5px;
padding: 5px;
color: white;
line-height:24px;
margin-bottom:10px;
}
#topRow {
height: 20px;
}
#secondRowLeft {
margin-top: 40px;
width: 25%;
height: 20px;
}
#selectPage {
margin-top: 35px;
width: 33%;
height: 30px;
float: left;
}
#view_sort {
float: right;
}
.prompt {
font-size: 16px;
font-style: normal;
width: 60px;
margin-right: 10px;
margin-left:0px;
padding-right:5px;
color:black;
margin-top:0px;
}
.field {
font-family: 'opensans';
font-size: 12px;
width: 145px;
float: right;
margin-left:0px;
margin-right:0px;
float:left;
font-weight:normal;
text-align:left;
margin-top:0px;
font-size:20px;
}
.topHeaders {
font-size: 16px;
float: left;
}
.topHeadersPage {
font-size: 18px;
float: left;
border-right: 1px solid #000000;
padding: 9px 9px 9px 9px;
background-color:lightblue;
color:black;
}
.storeHeadersBreak1 {
background-Color: black;
height: 1px;
width: 100%;
border: none;
}
.listArtul {
margin: 0px;
vertical-align:top;
}
#rightBlockListArt ul li{
margin-right: 5px;
margin-top: 15px;
}
.listArtContainer {
width: 31.5%;
display: inline-block;
border: 0px;
}
.listArtContainer {
margin-bottom:5px !important;
line-height:5px !important;
}
.listArtColumnContainer {
width: 31.5%;
display: inline-block;
border: 0px;
margin-bottom:5px !important;
line-height:5px !important;
}
.listArt {
width: 90%;
margin-top: 7px;
margin-left: 8px;
}
.listArtBreak {
background-Color: black;
height: 0px;
width: 75%;
border: none;
margin-top: 2px;
margin-bottom: 2px;
}
#artDescription {
width: 75%;
margin: auto;
text-align: left;
line-height:24px !important;
font-size:16px !important;
}
.artTitle {
font-style: normal;
font-size: 16px;
font-weight:normal;
text-align:center;
font-family: 'opensans';
}
.artistName {
font-size: 16px;
font-weight:bold;
text-align:center;
font-family: 'opensans';
}
.artBottomRow {
margin-top: 7px;
font-size: 16px;
line-height: 14px;
}
.artPriceSuffix{
font-style: italic;
font-size:12px;
}
.artPrice {
float: right;
}
#rightBlockAboutUsContainer {
height:205px;
float:left;
width:45%;
position: relative;
background-Color: white;
}
#rightBlockAboutUs {
height: 98.5%;
width: 99%;
background-Color:white;
position: absolute;
bottom: 0;
right: 0;
}
#rightBlockAboutUsPhotosContainer {
float:left;
background-Color:white;
width:58px;
height:100%;
display: table;
}
#rightBlockAboutUsPhotosContainerInner {
display: table-cell;
vertical-align: middle;
line-height: 0;
}
#rightBlockAboutUsText {
background-Color: rgb(229,236,239);
float: right;
margin-top: 7px;
padding: 7px;
padding-right: 0;
width: 175px;
font-size: 12px;
line-height: 15px;
text-align: left;
}
#rightBlockEventsContainer {
height:205px;
float:right;
width:45%;
position: relative;
background-Color: white;
}
#rightBlockEvents {
height: 98.5%;
width: 99%;
background-Color:white;
position: absolute;
bottom: 0;
right: 0;
}
#eventsDate {
margin-top: 3px;
}
#rightBlockEventsPhotosContainer{
float:left;
background-Color:white;
width:85px;
height:80%;
display: table;
}
#rightBlockEventsPhotosContainerInner {
display: table-cell;
vertical-align: middle;
line-height: 0;
}
#rightBlockEventsText {
background-Color: rgb(229,236,239);
float: right;
margin-top: 6px;
padding: 3px;
width: 150px;
font-size: 10px;
line-height: 15px;
text-align: left;
word-wrap: break-word;
}
.rightBlockTopRowBox {
height: auto;
float:left;
width:50%;
}
.bodyTopImage {
margin: 0;
padding: 0;
text-align: left;
}
.bodyTopImage li {
display: inline-block;
width:300px;
height: 50px;
padding:0;
position: relative;
}
.bodyTopImage li+li {
float: right;
}
.rightBlockTopRowBox-content {
color: white;
cursor: pointer;
display: table;
width: auto;
height: 100%;
left: 0;
position: absolute;
top: 0;
margin-left: 15px;
}
.rightBlockTopRowBox-content span {
font-size: 26px;
display: table-cell;
text-align: left;
vertical-align: middle;
}
.bodyBlockGroup {
margin: 0;
padding: 0;
text-align: left;
}
.bodyBlockGroup li {
display: inline-block;
width:300px;
height: 125px;
padding:0;
position: relative;
float: left;
margin-top: 0px;
}
.bodyBlockGroup li+li {
float: left;
margin-left: 0px;
}
.bodyBlockGroup-content {
color: white;
cursor: pointer;
display: table;
width: 60px;
height: 50%;
left: 0;
position: absolute;
top: 0;
margin-left: 5px;
margin-top: 5px;
}
.bodyBlockGroup-more {
color: white;
cursor: pointer;
display: table;
width: 65px;
height: 12px;
left: 0;
position: absolute;
top: 55px;
padding:6px;
margin-left: 0px;
margin-top: 5px;
background-Color:#5FC8DB;
}
.bodyBlockGroup-more span {
font-size: 10px;
display: table-cell;
text-align: left;
}
.bodyBlockGroup-content span {
font-size: 16px;
display: table-cell;
text-align: left;
line-height: 17px;
}
.rightBlockBorderTop {
border-top: 1px solid #000000;
width:99%;
float:right;
}
.rightBlockBorderLeft {
border-left: 1px solid #000000;
position: absolute;
bottom: 0;
top:1%;
}
.rightBlockBottomRowButtonContainer {
float: left;
width: 25px;
height: 100%;
background-color: black;
line-height: 202px;
text-align: center;
}
.rightBlockBottomRowButton {
-webkit-appearance: none;
display: inline-block;
vertical-align: middle;
line-height: normal;
width: 16px;
height: auto;
color: white;
font-family: 'resamitzbold';
word-wrap:break-word;
white-space:pre;
}
.rightBlockAboutUsPhotos {
height: 80px;
width: 48px;
padding-top: 2.5px;
padding-bottom: 2.5px;
}
.rightBlockEventsPhotos {
height: 100px;
width: 75px;
}
.rightBlockBottomRowButton2 {
-webkit-appearance: none;
width: auto;
float: right;
background-Color: rgb(95,200,219);
color:white;
font-size:12px;
padding-top:6px;
padding-bottom:6px;
padding-left:10px;
padding-right:10px;
position: absolute;
bottom: 0;
right: 0;
}
/* ------------------------END RIGHT BLOCKS----------------------------*/
/* ------------------------UPDATE BOX----------------------------------*/
/* #updateBox {
margin:auto;
margin-top: 50px;
height: 165px;
border: 2px solid black;
clear:both;
text-align:center;
width:800px;
}
.updateBoxHeader {
color: white;
font-size: 16px;
float: left;
margin-top: 20px;
margin-left: 20px;
}
.updateInput {
width: 44%;
margin-top: 20px;
margin-left: 20px;
font-size:1.2em;
font-size:1.2rem;
padding:5px;
}
.updateInput2 {
width: 75%;
margin-top: 10px;
margin-left: 20px;
font-size:1.2em;
font-size:1.2rem;
padding:5px;
} */
.button{
-webkit-appearance: none;
width: auto;
float: left;
background-Color: rgb(220,220,220);
color:black;
font-size:20px !important;
padding-top:11px;
padding-bottom:11px;
padding-left:29px;
padding-right:29px;
margin-top: 10px;
margin-left: 20px;
cursor:pointer;
-moz-border-radius: 15px;
border-radius: 15px;
box-shadow: 5px 5px 5px black;
font-family: 'resamitz';
}
.inputField {
width:300px !important;
font-size:1em !important;
font-size:1rem !important;
background-Color:lightblue;
color:black;
padding:5px;
font-weight: bold;
margin-left:10px !important;
margin-bottom:10px !important;
}
/* .button {
-webkit-appearance: none;
width: auto;
float: left;
background-Color: rgb(220,220,220);
color:black;
font-size:14px;
padding-top:11px;
padding-bottom:11px;
padding-left:15px;
padding-right:15px;
margin-top: 10px;
-moz-border-radius: 15px;
border-radius: 15px;
box-shadow: 5px 5px 5px black;
} */
/* ------------------------END UPDATE BOX------------------------------*/
/* ------------------------FOOTER--------------------------------------*/
#footer {
width:850px;
height:275px;
text-align:center;
margin:auto;
margin-top:30px;
color:black;
background-Color:white;
}
#footerColumnCenter {
width: 850px;
margin: 0 auto;
}
#socialMedia {
text-align: center;
width: auto;
clear:both;
margin-left: auto;
margin-right: auto;
}
#copyright {
font-size: 20px;
margin-top: 30px;
display: inline-block;
}
.footerBreak1 {
background-Color: black;
height: 1px;
width: auto;
border: none;
display:none;
}
.footerBreak2 hr {
background-Color: black;
height: 1px;
border: none;
width: 5%;
}
.footerBreak2Left{
float: left;
}
.footerBreak2Right{
float: right;
}
.footerColumn {
width: 190px;
float: left;
padding-left:15px;
}
.navFooterTitle {
text-decoration: underline;
display: inline-block;
width: 175px;
color:black;
font-size:20px;
}
.navFooterOptions {
width:auto;
text-align:left;
}
.navFooterOptions li {
margin-top: 15px;
}
.navFooterOptions li a {
color:black;
}
.navFooterContactOptions li {
margin-top: 5px;
}
.navFooterContactOptions ul {
margin-top: 10px;
}
.navFooterOptionItem {
font-size:18px;
display:block;
padding-top:15px;
}
.navFooterContactMain {
font-size: 12px;
display: block;
}
.navFooterContactSub {
font-size: 10px;
display: block;
}
.socialMediaIcon {
margin-left:25px;
margin-right: 20px;
height:75px;
width:auto;
}
/* ------------------------END FOOTER----------------------------------*/
.clear {
clear: both;
}
.textOverImage {
text-align:center;
width: 100%;
}
/* remember to highlight insertions somehow! */
ins {
text-decoration: none;
}
del {
text-decoration: line-through;
}
/* tables still need 'cellspacing="0"' in the markup */
body table {
border-collapse: collapse;
border-spacing: 0;
}
.imgcaptcha {
width:70px;
height:50px;
text-align:center;
margin-top:10px;
}
.textcaptcha {
font-size:xx-large;
color: lightgreen;
background-color: #000000;
border-width:1px;
text-align:center;
margin-top:10px;
}
.ui-widget input:focus {
outline: none;
border: 1px solid #007a96;
}
.ui-widget textarea {
margin: 0;
float: right;
width: 78.25%;
background: #e7edf1;
border: solid 2px #E5E5E5 !important;
height: 175px;
cursor: pointer;
}
.ui-widget textarea:focus {
outline: none;
border: 1px solid #007a96;
}
.ui-widget ul {
margin: 30px 0 0 0;
}
.ui-widget label {
font-size: 16px;
line-height: 30px;
}
.registerLabel {
float:right !important;
width:150px !important;
text-align:right !important;
padding-top:0px !important;
padding-bottom:10px !important;
}
.ui-widget .registerLabel {
display: block;
padding: 15px 15px 0px 20px;
margin: 10px 0px 0px 0px;
}
.ui-widget .securityQuestionSelect {
margin-left: 20px;
width: 84.5%;
background-Color:rgb(240,240,240);
}
.ui-widget .requiredField {
margin: 4px 15px 0 0;
}
#requiredIdentify_wrapper {
text-align: center;
margin-top: 25px;
}
#requiredIdentify {
vertical-align: middle;
font-size: 14px;
}
.requiredIdentifyPic {
background: url(images/required_field.png) no-repeat ;
height: 18px;
width: 18px;
vertical-align: middle;
}
.requiredField {
background: url(images/required_field.png) no-repeat ;
float: right;
height: 18px;
width: 18px;
padding-bottom: 5px;
}
.securityQuestionSelect {
width: 320px !important;
text-align:left;
margin:0px !important;
margin-top:5px !important;
margin-bottom:5px !important;
background-Color:rgb(240,240,240);
padding:10px !important;
margin-left:10px !important;
line-height: 28px !important;
}
#profile a {
float: right;
padding: 10px 25px;
margin-top: -13px;
background-Color: rgb(220,220,220);
color: black;
font-size: 18px;
}
.column {
width: 50%;
}
input {
font-size:16px;
font-family: 'opensans';
}
.ui-dialog .ui-dialog-title {
font-size: 25px !important;
text-align:center;
}
.ui-tooltip-content {
font-size:18px;
line-height:22px;
}
.ui-widget input {
border: solid 2px #E5E5E5 !important;
margin: 5px 30px 0px 30px;
color:black;
padding: 7px;
display:block;
font-size:16px;
font-family: 'opensans' !important;
width:85%;
background-Color:rgb(240,240,240);
}
.ui-widget label {
display: block;
padding: 15px 15px 0px 30px;
margin: 10px 0px 0px 0px;
clear: both;
}
.ui-widget-content a {
font-size: 14px;
font-style: italic;
line-height: 16px;
color: #e0214e;
margin-right: 35px;
}
.ui-dialog .ui-dialog-buttonpane button {
margin: .5em .4em .5em 0;
cursor: pointer;
-webkit-border-radius: 3px;
width: 150px;
padding: 0;
}
.ui-button-text-only .ui-button-text {
font-size: 18px;
padding: 14px 25px;
}
.ui-widget #securityLabel {
margin-top: -2px;
}
.ui-widget #updates {
float:left;
margin: 20px 0 0 17px;
}
.ui-widget #updates input {
margin: 0;
width: auto;
margin-top: 3px;
float: left;
margin-right: 7px;
}
.ui-widget .loginLink {
margin: 20px 30px 0 0;
}
.ui-widget #email_password_reset {
width: 87%;
margin: 0 10px 20px 10px;
}
.ui-widget #passwordRegisterLink {
margin: 15px 10px 0 0;
}
.ui-widget #passwordLoginLink {
margin: 0 10px 0 0;
}
.passwordLink {
font-size: .9em;
font-size: .9rem;
}
.ui-draggable-handle {
background: rgb(100,150,200) !important;
color:white !important;
padding:3px;
text-align:center;
}
.ui-dialog .ui-dialog-buttonpane button {
-webkit-appearance: none;
padding: 8px 25px !important;
background-Color: rgb(220,220,220);
color:black;
font-size:18px;
border: none;
font-family: 'resamitzbold';
-moz-border-radius: 15px;
border-radius: 15px;
box-shadow: 5px 5px 5px black;
}
.ui-widget-content {
background-Color:white !important;
border:none !important;
}
.ui-widget-content.success-dialog {
background-Color:white;
}
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
text-align:center;
float:none !important;
}
h3 {
font-size:24px;
padding-bottom:20px;
}
h4 {
font-size:20px;
}
.left {
font-size:20px;
margin-bottom:10px;
margin-top:10px;
margin-left:20px;
}
.right {
font-size:20px;
margin-bottom:10px;
margin-top:10px;
margin-right:20px;
}
p.right {
font-size:16px;
color:black;
}
h4.right {
margin-top:25px;
color:black;
}
h4.left {
margin-top:25px;
color:black;
}
p.left {text-align:left;font-family: 'opensans';font-size:16px;color:black}
p.right {text-align:right;font-family: 'opensans';font-size:16px;color:black;padding-right:5px}
#Navigation ul.nav.sec {
background-Color:black;
}
.art {
width:800px;
text-align:center;
}
.imgcol {
max-width:350px;
min-width:200px;
height:auto;
max-height:500px;
width:auto;
text-align:center;
border-width:1px;
border-color:white;
border-style:solid;
}
.content td {
vertical-align: middle;
}
.content p {
color:black;
}
.header a {
font-size:15px;
}
#popup_title {
font-size:18px !important;
background: lightgreen !important;
color:black !important;
padding:3px;
}
#popup_message {
font-size:16px;
font-weight:bold;
}
#popup_ok {
font-size:18px;
font-weight:bold;
padding:5px;
background-Color: rgb(220,220,220);
margin-top:5px;
float:none;
color:black;
cursor:pointer;
-moz-border-radius: 15px;
border-radius: 15px;
box-shadow: 5px 5px 5px black;
margin: .5em .4em .5em 0;
-webkit-border-radius: 3px;
width: 150px;
}
#popup_cancel {
font-size:18px;
font-weight:bold;
padding:5px;
background-Color: rgb(220,220,220);
margin-top:5px;
float:left;
color:black;
margin: .5em .4em .5em 0;
margin-left:100px;
cursor:pointer;
-moz-border-radius: 15px;
border-radius: 15px;
box-shadow: 5px 5px 5px black;
-webkit-border-radius: 3px;
width: 150px;
}
#popup_container {
text-align:center !important;
}
.nav ul {
float: right;
z-index: 100;
list-style: none;
line-height: 1;
background: #555555;
padding: 0;
border: solid #3D3D3D;
border-width: 0px 0;
margin: 0 0 0 0;
margin-right:25px;
text-align: left !important;
font-family: 'resamitzbold';
font-size: 17px;
font-weight: bold;
}
.nav li ul {
text:align:left !important;
display:block !important;
float:none !important;
}
.nav a {
display: block;
width: auto !important;
color: black !important;
text-decoration: none;
padding: .75em .55em .75em 1em !important;
}
.sec a {
display: block;
width: 7em;
color: black;
text-decoration: none;
padding: .75em .75em .75em .75em;
font-weight:bold;
}
.nav li {
float: left;
padding: 0px;
width:auto !important;
z-index: 100;
text-align:center !important;
background: white !important;
color:black !important;
}
.nav li ul li{
float: left;
padding: 0px;
width:auto !important;
z-index: 100;
text-align:center !important;
color:white !important;
}
.sec ul{
float:none !important;
display:block !important;
width:auto !important;
}
.sec li{
float:none !important;
display:block !important;
width:auto !important;
text-align:left !important;
}
.nav li ul {
position: absolute;
left: -999em;
height: auto !important;
width: auto !important;
padding-left: 0px !important;
margin-left: 0px !important;
font-weight: normal;
border-width: 0.1em;
margin: 0;
z-index: 100;
display:block !important;
text-align:left !important;
}
.nav li li {
padding-right: 0em;
}
.nav li ul li {
text-align:left !important;
}
.nav li ul ul {
margin: -1.75em 0 0 10em;
}
.nav li:hover ul ul, .nav li:hover ul ul ul, .nav li.sfhover ul ul, .nav li.sfhover ul ul ul {
color: white;
left: -999em;
}
.nav li:hover ul, .nav li li:hover ul, .nav li li li:hover ul, .nav li.sfhover ul, .nav li li.sfhover ul, .nav li li li.sfhover ul {
left: auto;
}
.gsc-search-box-tools .gsc-search-box .gsc-input .gsc-input-box,
.gsc-search-box-tools .gsc-search-box .gsc-input .gsc-input-box-focus {
width: 200px !important;
margin-left:20px !important;
margin-top:10px !important;
}
.cse .gsc-control-cse,
.gsc-control-cse {
padding: 0em !important;
margin-top:25px !important;
}
.gsc-search-button {
margin-top: 10px !important;
}
CSS Placeholder Color
Placeholders, those frequently grayed out text elements inside an input, can be a pain to style. Fortunately we've sourced a short but effective CSS solution to style your input's placeholder text any color and opacity you wish. Read on for the code.
Changing placeholder text color
Let's start with a simple input and some placeholder text, for this example we'll use the word 'search' but you can use anything you want. The basic HTML is below:
HTML
Input (and textarea) placeholder text defaults to a light gray color, however, we can change that with a few lines of CSS. Here we'll color the input text red using an HTML color name, but any color method will suffice (HEX, RGB, HSL).
CSS
::-webkit-input-placeholder { /* Chrome */
color: red;
}
:-ms-input-placeholder { /* IE 10+ */
color: red;
}
::-moz-placeholder { /* Firefox 19+ */
color: red;
opacity: 1;
}
:-moz-placeholder { /* Firefox 4 - 18 */
color: red;
opacity: 1;
}
Demo on CodePen
Note that it's important to include the different vendor prefixes in order to support as many browsers as possible. Only Firefox's input placeholder text defaults to a slight transparency so its unnecessary to set the opacity property on IE or Chrome.
Changing placeholder focus text color
Alright, we've successfully changed the color of the placeholder text to red, but it would be nice if something happened when a user clicks inside our input. Using the same vendor prefixed CSS properties, we can alter the opacity of the input placeholder text on focus.
CSS
::-webkit-input-placeholder { /* Chrome */
color: black;
transition: opacity 150ms ease-in-out;
}
:focus::-webkit-input-placeholder {
opacity: 0.25;
}
:-ms-input-placeholder { /* IE 10+ */
color: black;
transition: opacity 150ms ease-in-out;
}
:focus:-ms-input-placeholder {
opacity: 0.25;
}
::-moz-placeholder { /* Firefox 19+ */
color: black;
opacity: 1;
transition: opacity 150ms ease-in-out;
}
:focus::-moz-placeholder {
opacity: 0.25;
}
:-moz-placeholder { /* Firefox 4 - 18 */
color: black;
opacity: 1;
transition: opacity 150ms ease-in-out;
}
:focus:-moz-placeholder {
opacity: 0.25;
}
ul {list-style: none !important;padding:0px}
li {list-style: none !important}
h3 {padding-bottom:20px}
#headerModules u {
font-size:1.2em !important;
font-size:1.2rem !important;
}
#registerMessage {
padding:10px;
}
h5 {font-size:1.2em;font-size:1.2rem)}
.productMore {
font-size:20px;
font-family: 'resamitz' !important;
}
#productButtons span {
font-family: 'resamitz' !important;
}
.artTitle, .artistName, .artType, .artPrice {
font-size:16px;
font-family: 'opensans';
text-align:center;
display:block;
float:none;
margin-top:0px;
line-height:20px;
}
#footer {font-family:'resamitzbold'}
.uploadButton {
-webkit-appearance: none;
padding: 8px 25px;
background-Color: rgb(220,220,220);
color:black;
font-size:18px;
border: none;
font-family: 'resamitzbold' !important;
-moz-border-radius: 15px;
border-radius: 15px;
box-shadow: 5px 5px 5px black;
font-family: 'resamitz';
}
.uploadButton:hover {
background-color:rgb(235,235,235);
cursor: pointer;
font-weight:bold;
color:blue;
}
.messageOK {
font-family:resamitz;
background-Color:lightgreen !important;
font-weight:bold;
padding:10px;
padding-left:15px;
padding-right:15px;
line-height:25px;
}
#tooltip
{
text-align: left;
font-size:20px;
color: #fff;
background: #111;
position: absolute;
z-index: 100;
padding: 15px;
font-family: 'opensans';
}
#tooltip:after /* triangle decoration */
{
width: 0;
height: 0;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-top: 10px solid #111;
content: '';
position: absolute;
left: 50%;
bottom: -10px;
margin-left: -10px;
}
#tooltip.top:after
{
border-top-color: transparent;
border-bottom: 10px solid #111;
top: -20px;
bottom: auto;
}
#tooltip.left:after
{
left: 10px;
margin: 0;
}
#tooltip.right:after
{
right: 10px;
left: auto;
margin: 0;
}