/* Jamaica Natural Style - mahad:Mahan seh suh */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, img { margin: 0; padding: 0;border: 0; outline: 0;font-size: 100%;} body { color: #999; font-family: 'Josefin Sans', sans-serif; font-size: 1.125rem;margin: 0; padding: 0; text-align: center; background-color: #000; } h1 { color: #E2B41F; font-size: 24px; font-style: normal; line-height: 28px; font-weight: normal; font-variant: normal; letter-spacing: -1px; } h2 { color: #FFF; font-size: 1.6em; font-weight: normal; line-height: 24px; font-family: Verdana, Geneva, sans-serif; padding-bottom: .375rem; letter-spacing: -1px; } h3 { font-size: 1.10em; font-weight: bold;} header { top: 0; z-index: 3; position: sticky;background: black;} hr { background-color: #333; color: #333; height: .0625rem; border: 0; clear: left;} ul, ul li { margin: 0; padding: 0; list-style: none;} a, a:link { color: #9C0; font-weight: bold; text-decoration: none;} a:visited { color: #9C0; font-weight: bold; text-decoration: none;} a:hover { color: #FFF; font-weight: bold; text-decoration: underline;} a:focus { color: #9C0;} a span { font-weight: normal;} a:active { color: #9C0;} input,textarea { border-radius:.3125rem; border:1px solid #111; color:#777; font:normal 1em Verdana, Geneva, sans-serif; margin-bottom: .625rem; padding: .3125rem; } .link { cursor: pointer;} #frontlist { list-style: disc; margin-left: .625rem; clear: left; font-size: 1.45em;} #navbg { clear: both; display: block;} #nav-rightimage { position: absolute; background: no-repeat top;width: 92%;} .download #jamfones { margin-top: 36%; margin-right: 3%;} .wrapcontainer { margin-left: auto; margin-right: auto; width: 100%;} #hiddenwrap { position: absolute; z-index: 2; width: 100%; min-height: 100%; height: 300%; background-color:rgba(0, 0, 0, 0.75); } #outerWrapper { margin-bottom: .9375rem; margin-left: auto; margin-right: auto; text-align: left; clear: both; } #header { z-index: 4; padding-top: .25rem;} #header .loggedIn { background: #587145; } #headerbg { height: 53px; padding: 0; background: #000 url(../images/6kingz.png) no-repeat; width: 100%; } #headerbg #authenik { clear: left;} #headerbg #authenik, #headerbg #awti, #headerbg #mahad, #headerbg #undap, #headerbg #n4sa, #headerbg #blung { float: left; width: 55px; height: 55px;} #headerbg #mahad { margin-left: -.3125rem;} #headerbg #authenik:hover, #headerbg #awti:hover, #headerbg #mahad:hover, #headerbg #undap:hover, #headerbg #blung:hover { cursor: pointer;} #navbarheader { background: url(../images/headbg.png) no-repeat;} #jamtitle { color: #F7DF2C; display: none; padding: .3125rem;} #jamtitle:link { color: #F7DF2C;/* color: #9C0; */ } #loginbox { float: right; margin-top: -4.25rem;margin-top: -4.25rem; margin-right: .625rem; z-index: 1; width: 54%;} #logo { float:left; vertical-align:text-top; } #logo2, #logo3 { display: none;} #jamfones { margin-top: 4%; z-index: 1; position: relative;} #userLoggedIn #loginbox { margin-top: -3rem;} .index #jamfones { margin-top: 36%; float: right;} .about #jamfones { z-index: 1 !important;} .company #jamfones { margin-top: 0; z-index: 1;} /* Sets the style for the header text. */ #headinfo { text-align: right; float: right;} #loginspace { display: none; width: 90%; margin: 0 auto;} #loginspace.block { display: block;} #forgotpswd, #loginspace { z-index: 2; position:relative;} #fill_1, #fill_2 { padding-left: 100px;} #forgotpass { color: #9C0; text-decoration: none; z-index: 2; position:relative;} #forgetpswd:hover { color: #FF0; font-weight: bold; cursor: pointer; text-decoration: none;} #hasemail a { margin-right: .625rem; color: lightslategrey; font-weight: normal;} #loggedin_shim { display: none;} #loginbtn { margin-bottom: .625rem; font-size: 130%;} #loginlink { display: none; font-weight: bold; cursor: pointer;} #loginlink span { color: #9C0;} #loginstate { float: left; width: 20%; padding: .4375rem;/*margin-top: 9px; position: absolute;*/ z-index: 1; right: 0; background: #638224; border-radius: .1875rem;} #newAccount { /*padding: 5px 0;*/ text-align: left;color: #9C0; text-decoration: none; z-index: 2; position:relative; float: left;} #newAccount:hover { color: #FF0; cursor: pointer;} /* These are the settings for the top navigation bar */ #navmenubox { display: flex; height: 3rem; /* margin-left: -2rem; */} #navmenubox ul a { margin-left: -.75rem; padding-right: .9375rem; padding-left: .9375rem; color: #ccc; font-size: 1.125rem; font-weight: 500; line-height: 2.125rem; text-transform: capitalize; } #navmenubox ul li:first-of-type:hover { padding-left: .9375rem; text-decoration: underline; border-radius: .3125rem; background:green;} #nav { height: 3.25rem; /* border-top: 1px solid #4b554c; */ background: linear-gradient(360deg, rgba(2,0,36,1) 0%, rgba(1,0,0,1) 27%, rgba(75,85,76,1) 100%); background: url(../images/content-fade2.png) repeat-x top;} #nav ul { margin-top: 0;} #navLinx { flex: 1; height: 100%; color: #FFF; /* margin-top: -1rem; margin-right: 1.25rem; */ } #navLinx ul li { display: block; float: left; list-style: none; clear: right;} #navLinx ul li a { display: block; padding-right: .9375rem; padding-left: .9375rem; padding-top: 0; padding-bottom: 0; text-align: left; color: #CCC; font-size: 1.125rem; font-weight: normal; line-height: 3rem; } #navLinx ul li a:hover { text-decoration: none; margin-top: .125rem; color: #FFF; background: url(../images/nav-hover.png) repeat-x top; background: green; border-radius: .3125rem; } #navLinx ul li#active { background: url(../images/nav-hover.png) repeat-x top; text-decoration: none;} #navLinx ul li#active a { color: #FFFFFF;} #navLinx { clear: both; z-index: 2;} #artist_sellist2 { width: 20rem; margin-left: -3rem; background:#7E9C23; font-size: 1rem; margin-top: -7px; /* padding-right: .625rem; */ color: #000; border-radius: .1875rem; box-shadow: 1px 2px 5px rgba(0, 0, 0, .3);} #artist_sellist2 ul li { clear: both;} #artist_sellist2 ul li:hover { width: 99%;} #xOut { display: none; float: right; position: absolute; top: 13%; right: 21%; color: #fff; z-index: 3;} /* booted from the strap*/ .navbar-collapse { max-height: 340px; margin-top: -.3125rem; padding-left: .9375rem; overflow-x: visible; border-top: .0625rem solid transparent; box-shadow: none; /* box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1); */ } /* >> artist select menu ------------------------ */ [class^="artist_selmenu"], #jn-artist { clear: both; white-space: nowrap;} html[xmlns] [class^="artist_selmenu"] { display: block;} * html [class^="artist_selmenu"] { height: 1%;} [class^="artist_selmenu"] li { float: left; list-style: none; position: relative; z-index: 2;} /* main level link */ [class^="artist_selmenu"] a { font-size:11px; font-weight: bold; color: #fff; text-decoration: none; display: block; padding: 7px .3125rem; margin: 0; border-radius: .3125rem; } [class^="artist_selmenu"] .rightend { padding: 0 .3125rem; display: block; color: #ddd;} [class^="artist_selmenu"] #end a { border: none;} [class^="artist_selmenu"] li a { text-transform:uppercase;} /* main level link hover */ [class^="artist_selmenu"] li:hover > a { /* background:#A9DB3A; */ color: #000;} #art_selmenu li:hover > a { background:#A9DB3A; color: #000;} /* sub levels link hover */ [class^="artist_sellist"] ul li a:hover , [class^="artist_sellist"] li:hover { color: #f1a669;} [class^="artist_sellist"] ul a:hover { background: #A9DB3A !important; color:#93440c !important; white-space: normal; /*text-shadow:none; filter: dropshadow(color=#); */} /* level 2 list */ [class^="artist_sellist"] ul { display: none; position: relative; background:#7E9C23; font-size: 1rem; margin-top: -7px;padding-right: .625rem; color: #000; border-radius: .1875rem; box-shadow: 1px 2px 5px rgba(0, 0, 0, .3);} /* dropdown */ [class^="artist_sellist"] li:hover > ul { display: block; color: #93440c; /* top: 30px; */} [class^="artist_sellist"] ul li { float: none; width: 100%;/*margin-right: .3125rem;margin-left: -20px; */ padding: .125rem; line-height:120%; /*border-bottom:0 solid #e86e23;*/ } [class^="artist_sellist"] ul a { font-size:.75rem; text-transform:none; font-weight: normal; color:#000 !important; padding:7px .625rem; /* text-shadow: 1px 1px 0 #f89559; filter: dropshadow(color=#f89559, offx=1, offy=1); */} [class^="artist_sellist"] li:hover span { font-weight: bold; color: red; } [class^="artist_sellist"] { position: absolute; width: auto; } [class^="artist_sellist"].sidebar-border { display: none; } [class^="artist_sellist"] ul .thumbnailz a:hover span{ display: block;} #navDisplay { display: none;} .userlink1 { font-weight: bold; color: gold;} /* >> END nav2 ------------------------ */ .sliderBlock { display: block;} #feature { background: no-repeat right top; clear: both; margin-top: 1.8%; margin-bottom: 1rem; padding-left: 1.25rem; color: #FFF; font-size: 14px; font-weight: normal; line-height: 22px; text-align: left; position: relative; } #feature .title { font-size: 1.75em; font-weight: normal; letter-spacing: -1px; float: left; margin-bottom: 1.25rem; } #feature ul { padding-top: 0; margin-top: 25px; color: #9C0;} #feature p { margin: 0; padding: 0;} /* Styles for download icon */ #download { float:right; margin: 2% 45% 0 0; z-index: 1; position: relative;} /* This is the smaller image that spans the entire width of the subpage template */ #subfeature { height: 102px; background: url(../images/subpage-feature.jpg) no-repeat;} #subfeature2 { height: 102px; background: #719612 url(../images/subpage-feature2.png) no-repeat; position: relative;} .subfeature-content { padding-top: 1.25rem; padding-right: 1.25rem; padding-left: 12%;} #subwrap { height: 104px; background: no-repeat right top; color: #000;} #subwrap p { white-space: nowrap;} #subwrap .title { float: left; line-height: 100%; color: #FFE700; text-shadow: 0 1px 1px rgba(0, 0, 0, 1); font-weight: 400; font-size: 1.23em;} #subwrap a:link, #subwrap a:visited, #subwrap a:active { color:#FFF;} /* This is the logo shown to the left of the large image on the home page only */ #contentWrapper { display: inline-block; position: relative; /* float: left; */ background-image: linear-gradient(#222, #000); width: 100%; z-index: 1; } #contentWrapper2 { width: 75%; position: relative; float: left; background-image: linear-gradient(#222, #000); z-index: 0;} .company #contentWrapper2 { position: relative; z-index: 1;} .index #contentWrapper2 { z-index: 1;} #userLoggedIn #contentWrapper2 { z-index: 1;} #contentWrapper #content { width: 70%; float: left; margin: 0; padding: 0; position: relative; border-bottom-left-radius: .625rem; border-bottom-right-radius: .625rem; } #content2 { margin: 0; width: 100%; /*overflow: hidden;*/ z-index: 3; padding: 0px;} #left_id { padding: .3125rem; border: 0 solid #333; box-shadow:0 -5px 300px #333;} #rightColumn { clear: right; float: right; width: 24%; padding-bottom: 1.25rem; margin-top: 0; z-index: 2; position: relative; padding-right: 0;} /* This creates more spacing between lines in the content paragraphs */ #content p { line-height: 140%;} /* This styles the headings in the right sidebar */ #rightColumn h2 { color: #fff; padding-left: .9375rem; padding-top: 8px; padding-bottom: 8px; font-family: Arial, Helvetica, sans-serif; font-size: 11px; font-style: normal; line-height: 1.125rem; font-weight: bold; text-transform: uppercase; margin: 0; letter-spacing: .1875rem; /*background: url(../images/sidebar-h2.jpg) repeat-x left top;*/ background: linear-gradient(to bottom right, #8B9E8B, #4A524A); border: .0625rem solid #272727;} /* This styles the dividing lines between items in the right sidebar if hr is used */ #rightColumn hr { background-color: #333; color: #333; height: .0625rem; border: 0;} /* This styles the navigation links in the sidebar. */ #rightColumn ul { margin: 0 0 0 .625rem; padding: 5px 0;} #rightColumn ul li { list-style: none; display: inline;} #rightColumn ul li a{ color: #999; font-family: Verdana, Geneva, sans-serif; font-size: 1.08em; font-weight: normal; line-height: 1.0em; letter-spacing: -1px; padding: 5px .25rem 5px .375rem; display: block; /* background-color: #000; */} #rightColumn ul li a:hover { margin-left: 25px; margin-left: -.0325rem; padding-left: 1rem; text-decoration: none; color: #9C0; background-color: #536d37; /*border: .0625rem solid #203624; padding: .3125rem; */ border-radius: .1875rem;} /* Styles the background and border for the sidebar boxes */ .rolloverX:hover { background: #222722;} .sidebar-border { border: solid 2px #272727; border-top-style: none; margin-top: .1875rem; border-radius: .3125rem; background-color: #000; padding: .625rem;} .sidebar-border2 { border: solid 2px #272727; /*margin: 0;*/background-color: #000; padding: .625rem .3125rem;} .sidebar-border p { margin-top: .4375rem; margin-bottom: .4375rem;} /* This styles footer section */ #innerfoot2, #innerfoot { position: relative; margin-left: auto; margin-right: auto; text-align: center;} #footsub { text-align: center; } footer a:link, footer a:visited, footer a:active { color: #666;} footer a:hover { color: #FFF; text-decoration: none;} footer p { margin:0 0 .625rem 0; /*padding: 0;*/} footer { width: 100%; position: relative; bottom: 0; clear: both; margin: 0 auto .625rem; height: 60px; color: #666; padding:.625rem 0 0; border-top: .0625rem solid #333; font-size: 11px; background-color: #000; z-index: 2;} .footcart { position: absolute;} /* These are the settings for the contact form in the sidebar. Commonly used for newsletter signups. */ #newsletter { margin: 0 .625rem; padding-top: .9375rem; width: 90%;} #newsletter label { display:block; padding-bottom:.3125rem; font-size: 11px; font-weight: normal; text-transform: uppercase; color: #999; letter-spacing: .0625rem; padding-left: .3125rem; } #newsletter input { width: 100%; background-color: #333; color: #FFF; border: .0625rem solid #666; font-size: .75rem; font-weight: bold; padding: .1875rem; margin-bottom: 8px;} #newsletter input[type="checkbox"]{ width: .0625rem; margin: 5px 5px 0 0;} #newsletter select { width: 215px; background-color: #FFF; color: #666; border: .0625rem solid #425066; font-size: .75rem; font-weight: bold; padding: .1875rem; margin-bottom: 8px; } #newsletter #button { width: 125px; height: 31px; text-align:center; color:#FFF; font-size:11px; font-weight:bold; background: #FFF url(../images/button.jpg) no-repeat; border-style: none; margin-top: 8px; line-height: 25px; } #newsletter #button:hover { color: #FFF; background-image: url(../images/button-hover.jpg); cursor: pointer; } #mailcheckbox { position: relative; width: 100%; height: 25px; margin: 0 auto; background: #111; font-size: 11px; border-radius: .1875rem; } #mailcheckbox:hover { background: #232; border: 0 solid #696;} #mailcheckbox span { margin-left:.3125rem;} #mailcheckbox input { float: right; border:0; margin: 0 5px 0 0;} #announce { padding: .625rem; text-align:justify; color:#dd3; font-size:14px; margin: 0 auto; background: #111; border: .0625rem solid #343; border-radius: .375rem; } /* Styles for floating images right or left */ /* This styles the sitemap page list */ #sitemap li { margin-bottom: 8px;} #sitemap ul { margin-top: .3125rem;} #sitemap li.subpage { padding-left: .75rem; line-height: 100%; margin-top: 0; margin-bottom: 0; margin-left: .3125rem; list-style: none;} #sitemap li.subpage a, #content li.subpage a:link { font-weight:normal;} /* These are the styles for the contact form */ .inputValue { width:50%; margin-top:.3125rem;} .inputText { width:85%; height:180px; margin-top:.3125rem;} .border, .border2, .border3, td.border { position: relative; border:1px solid #333; margin: 0 auto 1em; padding: 2em; background:no-repeat 1em center; } .subheader { margin: .625rem 0; margin-left: .625rem; position: relative; z-index: 1; color: cyan;} .msg_info, .msg_goinfo, .msg_success, .msg_warning, .msg_error, .msg_feature, .msg_tip{ position: relative; border:1px solid #333; font-size: 13px; margin: 0 auto 1em; padding:1em 2em; background: no-repeat 1em center; border-radius: .375rem; } .msg_error { color: #ffc; font-weight: 500; line-height: 1rem; margin: 0 auto; padding-left: 2rem; border: .0625rem solid #f00; background:url('../images/icons/error.png') #6F1B1B no-repeat .1875rem .3125rem; z-index: 5; } /*.msg_feature { border: .0625rem solid #d2c41b; background:url('../images/icons/new.png') #fffbce; } */ .msg_goinfo { border: .0625rem solid #69c; background:url('../images/icons/info.png') no-repeat .1875rem .3125rem; } .msg_info { border: .0625rem solid #69c; background:url('../images/icons/info.png') #dfeefd no-repeat .1875rem .3125rem;} .msg_success{ border: .0625rem solid #4F8A10; background:url('../images/icons/success.png') #193229 no-repeat .1875rem .3125rem;} .msg_tip { border: .0625rem solid #d2c41b; background:url('../images/icons/tip.png') #ffebce; } .msg_warning{ border: .0625rem solid #d2c41b; background:url('../images/icons/warning.png') no-repeat .1875rem .3125rem; color:#FE9; z-index: 5} .center { margin-left:auto; margin-right: auto; text-align: center;} .clear { clear: both;} .close_msg { float: right; height:100%; margin-left:.3125rem;} .disabled { cursor: not-allowed;} .enabled { cursor: default;} .fleft,.left{ float: left;} .fright, .right { float: right;} [class^='hide'], .no_display { display: none;} .inline { display: inline;} .instruct { font-size:11px;} .italics { font-style: italic;} .justify { text-align: justify;} .middle { margin: 0 auto;} .nowrap { white-space:nowrap;} .showblock { display: block;} .textleft { text-align: left;} .textright { text-align: right;} .underline { text-decoration: underline;} .redgfx { color: red;} .required { color:#C00; font-size: 9px;} .whtgfx { color: white;} .yelgfx { color: gold;} .stressrep { color: #9c0; font-weight:600;} /* .stressrep:hover{ color: gold; } */ .redalert { color: red; font-weight:600;} .whitealert { color: #fff; font-weight:600;} .black { color: #000;} .blue { color: #03f;} .bluealert { color: #03f; font-weight:600;} .cyan { color: #cef;} .cyanalert { color: #cef; font-weight:600;} .glowxtra { background-color: gold; padding: .3125rem; border: .0625rem solid black;} .green { color: #9C0;} .grey { color: #aaa;} .greyout { color: #000; background: #ddd;} .grn_hd { color: #0a1; font-size: 12pt;} .grngfx { color: #0c0;} .grnalert { color: #0a1; font-weight:600;} .rec_update { color: #f63; font-weight:600;} .tinyalert { color: #f00; font-weight:600; font-size: 8px;} .pickalert { color: #FF9933; font-size: .8em;} .required { color: #FF0000; font-size: .9em;} .evenrow { background: #111;} .oddrow { background: #222; /* z-index: 5; */ position: relative;} .hilite_oddrow { background: #2d4e3e;} .hilite_evenrow { background: #1c3532;} .emp { font-weight:bold;} .bigemp { font-size: 1.9em; color: red;} .bigfont { font-size: 14pt;font-weight:600;} .bigslim { font-size: 1.30em; line-height: 1.45em} .big { font-size: 1.5em;} .bigger { font-size: 1.75em;} .bigpadleft50 { padding-left: 50px;} .bigpadleft100 { padding-left: 100px;} .bold { font-weight:600; font-style: normal;} .bolder { font-weight:700; font-style: normal;} .boldItal { font-weight:600; font-style: italic;} .bolderItal { font-weight:700; font-style: italic;} .normalfont { font-size: 1.0em;} .plusfont { font-size: 1.20em;} .regpxfont { font-size: 11px;} .small { font-size: .625rem;} .smaller { font-size: 9px;} .smallemp { font-size: 10pt; font-weight:bold;} .ssizeplus { font-size: 3.9em;} .supersize { font-size: 2.9em;} .pad5, .pad5px { padding: .3125rem;} .pad10, .pad10px { padding: .625rem;} .pad15 { padding: .9375rem;} .pad20 { padding: 1.25rem;} .pad25, .pad25px { padding: 25px;} .padbot_5 { padding-bottom: .3125rem;} .padbot_10 { padding-bottom: .625rem;} .padright5 { padding-right: .3125rem;} .padright10 { padding-right: .625rem;} .padright15 { padding-right: .9375rem;} .padright20 { padding-right: 1.25rem;} .padright25 { padding-right: 25px;} .padleft5 { padding-left: .3125rem;} .padleft10 { padding-left: .625rem;} .padleft25 { padding-left: 25px;} .padright10 { padding-right: .625rem;} .padright25 { padding-right:25px;} .px_10spacer{ margin: .625rem;} .px_25spacer{ margin: 25px;} .px_5top { margin-top: .3125rem;} .px_10top { margin-top: .625rem;} .px_20top { margin-top: 1.25rem;} .px_16top { margin-top: 1rem;} .px_25top { margin-top: 25px;} .px_5bott { margin-bottom: .3125rem;} .px_10bott { margin-bottom: .625rem;} .px_20bott { margin-bottom: 1.25rem;} .px_25bott { margin-bottom: 25px;} .border { border: .0625rem solid #333;} .border2 { border: .0625rem solid #676F45;} .border3 { border: .0625rem solid #9EAF57;} .brdrtop5 { border-top-left-radius: .3125rem; border-top-right-radius: .3125rem;} .brdrtop10 { border-top-left-radius: .625rem; border-top-right-radius: .625rem;} .bottline { border-bottom: .0625rem solid #333;} .box_half { width: 48%;} .box_third { width: 40%;} .box_2third { width: 60%;} .box_qrt { width: 23%;} .box_3qrt { width: 73%;} .fullhundred{ width: 100%;} .fullwidth { width: 100%;} .width16 { width: 16%;} .width16px { width: 1rem;} .errorblock { z-index: 6} .content_artist_hdr { z-index:6;} .testmode { width: 100%; border: .0625rem solid #f00; padding: .3125rem; margin: 0 auto; background: gold; color: red; font-size: 1.25em;} .hotsong { position: relative; padding: .3125rem; margin: 0 auto; background: #6F1B1B;} .hotalbum a:hover, div .hotalbum:hover { background: #6F1B1B;} .hotalbum { float: left; position: relative; border: .0625rem solid #633; border-radius: .1875rem; padding: .3125rem; margin-right: .3125rem;} .coolalbum { position: relative; float: left; border: .0625rem solid #999; border-radius: .1875rem; padding: .3125rem; margin-left: .0625rem;} .genbox { position: relative; width: 95%; border: .0625rem solid #333; border-radius: .375rem; padding: .3125rem; margin: 0 auto;} .genbox2 { position: relative; width: 90%; border-radius: .375rem; padding: .3125rem; margin: 0 auto; } .bigerror { background: #6F1B1B url('../images/icons/error.png') no-repeat; border: .0625rem solid #f00; color: #ffc; position: relative; border-radius: .375rem; padding:1.5em 1.2em 1.5em 2.5em; margin-bottom: .625rem; font-size: 1.36em; } .normal { color: #999; font-size: .75rem;} .roundbox { border-radius: .375rem;} .roundboxline { border-radius: .375rem; border: .0625rem solid #333;} .bottomline { border-bottom: .0625rem solid #333;} .listitems { list-style-type:circle; margin-left: 1.25rem;} .logback { background-color: #26331d !important;} #mahadbrand { position: relative; float: left; padding-right: .625rem;} #loginstate .separator:first-of-type { display: none;} /* // Page 2 */ #company { color: #9c9; font-family: tahoma, verdana,Arial, Helvetica, sans-serif; font-size: 1rem; text-align: justify; float: left; width: 100%; padding: 1.25rem; margin: 0 auto; border: .0625rem solid #333; border-radius: 1.25rem; box-shadow:0 -5px 300px #333; } #tabhead { border: .0625rem solid #333; border-bottom: none; background: #222; padding: .9375rem; width: 72%; margin-top: .625rem; border-top-right-radius: .375rem; border-top-left-radius: .375rem; } #resholder, .resholder { z-index: 5; height: auto; position: relative; top: 0; border: .0625rem solid #333; border-collapse: collapse; border-spacing: .3125rem; font-size: .75rem; padding: .625rem; margin: 0 auto; border-radius: .375rem; } #resholder .tr:hover{ background: #384134;} /* #resholder .tr:nth-last-child(1):hover, #resholder .tr:nth-last-child(2):hover { background: none;} */ #resholder .tr.hilite_evenrow:hover { background: #213f2c;} #resholder .tr.hilite_oddrow:hover { background: #48693a;} #resholder .tr.hilite_oddrow:hover { background: #48693a;} #resholder .tr:hover ~ #overlay { display: block;} #resholder .tr:last-of-type:hover, /*#resholder .tr:nth-last-child(2):hover { background: none; } #resholder .td { transform: translateY(0);} #resholder .trow .td:first-of-type { transform: translateY(0);} #resholder .td span { margin-top: .3125rem;} #resholder .td.left { padding-left: .625rem;}*/ #subhdr, #content_artist { z-index: 5; position: relative;} h1#subhdr { margin-left: 6rem;} #content_artist { padding: .625rem;} .halfbox { width: 64%;float: left; border: .0625rem solid #333; border-collapse: collapse; border-spacing: .3125rem; font-size: .75rem; padding: .625rem; border-radius: .375rem; } #trbody { clear: both; position: relative; color: #999; z-index: 5;} #selall { float: left; height: 100%; margin: 0 auto; text-align: center; } .collapsehead { height: auto;} .trhead { clear: both; width: 100%; height: 30px; border: .0625rem solid #333;} .headinfo { float: left; border-right: .0625rem solid #333; z-index: 8; height: 100%; margin: 0 auto; padding: 5px 0 0 .625rem; } /* */ .width_1 { text-align: center;} .width_1 { width: 3%; text-align: center;} .width_2 { width: 36%;} .width_3 { width: 18%;} .width_4 { width: 16%;} .width_5 { width: 5%;} .width_6 { width: 5%;} .width_7 { width: 12%;} .width_8 { width: 5%;} .alb.width_1 { width: 5%; text-align: center;} .alb.width_2 { width: 5%;} .alb.width_3 { width: 40%;} .alb.width_4 { width: 20%;} .alb.width_5 { width: 10%;} .alb.width_6 { width: 7%;} .alb.width_7 { width: 13%;} /*div .tr[class$='row'] { display: flex; flex-direction: row;} div .tr.evenrow, div .tr.oddrow { display: flex; flex-direction: row;}*/ .tr { clear: both; width: 100%; height: 2.0625rem; vertical-align: middle; z-index: auto;} div.table { display:table; width:100%; border-collapse:collapse;} div.row, .row { display: table-row;} div.cell { display: table-cell;} div.colspan>div { width: .0625rem;} div.colspan>div>div { position: relative; width:100%;} div.title { text-align: center; font-weight: bold; font-size: larger;} .heading { display: table-row; font-weight: bold; text-align: center;} .cell { display: table-cell; border: thin solid; padding-left: .3125rem; padding-right: .3125rem;} #restable { position: relative; display:table; width:100%; border-collapse:collapse; border: .0625rem solid #333; border-spacing: .3125rem; font-size: .75rem; margin: 0 auto; border-radius: .375rem; width: 100%; } #retrecs { padding: .3125rem;} #restable .td { height: 100%; margin: .125rem 0; font-size: .75rem; float: left; /*overflow:hidden;*/} #restable .td:last-child { transform: translateY(0);} #albumwrapper { margin: 0 auto; height: auto; min-height: 336px; border: .0625rem solid #333; border-top: none; } #albuminfo, #albumbox { float: left; margin: 0 auto;} #albuminfo { width: 99%; padding: .625rem; clear: both; border: 0 solid #333; border-radius: .375rem; position: relative; z-index: 1;} #albumbox { width: 13.125rem; margin-left: .5%;padding: .1875rem; border: .0625rem solid #333; background: #99cc00; border-top-left-radius: .375rem; border-bottom-left-radius: .375rem; } #albumplayer { z-index: 6; width: 100%; margin: 0 auto .3125rem; margin-top: -5%; float: left; /* background: #002709; */ position: relative; /* border: .0625rem solid #91b363; */ border-top-left-radius: 0; } #albumInstruct { color: #0c0; font-size: 11px;} #bigalbumwrap { padding: 25px; clear: both; position: relative; width: 80%; border: .0625rem solid #ccc; border-collapse: collapse;margin: 0 auto; border-radius: .625rem; } #bigalbumtitle { float: left; margin: .625rem 0 .625rem 5%; } #bigalbum_in { padding: .625rem; clear: both; position: relative; width: 80%; border: 0 solid #ddd; margin: 0 auto; border-radius: .625rem;} #mp3 { left: 54%; margin-top: -5.25%; position: absolute; z-index:2; } #mp3.dlmp3 { left: 90.75%;} #mpl { z-index: 2;} #moretracks_row { height: 8.5em;} #moretracks { background: #4D5E23 url(../images/thumbsup2.png) no-repeat left top; padding: 5px 25px 25px; clear: both; color: #CBE014; position: relative; border: .0625rem solid #123212; border-collapse: collapse; margin: 0 auto; border-bottom-left-radius: .625rem; border-bottom-right-radius: .625rem; } td.border { z-index: 8; } #profilehdr2 { clear: both; color: #8F9F00; position: relative; border: 0 solid #123212; border-collapse: collapse; margin: 0 auto; border-radius: .625rem;} #playerwrap { position: relative; z-index: 1; } [id^="starback"]{ position: absolute; width: 100%; border-radius: .3125rem; z-index: -1; background: -webkit-radial-gradient(circle, #a91909, #000000);} #starback1 { margin: -28px 0 0 -28px;} #starback2 { margin-left: .0625rem; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } #starback3 { height: 100%; margin: 0 auto; top: 0;} #starback4 { margin: -19px 0 0 -19px; border-top-left-radius: 0; border-top-right-radius: 0;} #profilethumb { position: absolute; right:-.3125rem; top:20px; z-index: 4;} #prof_imgs { position: absolute; right: 0; top:0; z-index: 5;} #hotsingle { position: relative; right: 0; top:0; margin: .625rem 0 0 0;} #jamsplat { position: absolute; right: 50px; top:0; margin: -110px -.625rem 0 0; z-index: 0; } #sngdisplay { width: 60%;height: 8.5rem; position: absolute; top: 3%; left: 37%; z-index: 7;} #sngTitle, #sngLen, #sngNum{ float: left; /* margin-top: 1.5%; */ } #curSng { width: 100%; height: 100%; font-size: 1.75rem; font-family: 'Josefin Sans', tahoma, helvetica; color: #F6F4BE; font-style: italic;} #sngLen { width: 27%;/* padding-left: 1rem; */} #sngLen span { font-size: 1.25rem; float: left;} #sngNum { padding: 0 .25rem 0 1.5rem;} #sngTitle { top: 0; left: 5%; font-size: 2rem; font-style: normal; font-weight: normal; line-height: 2rem; margin-top: 0;} #sngTitle span { font-size: 2.3rem; color: #e6e4b1;} #sngTitle span:nth-of-type(2) { color: #fbf876; display: block; clear: both; font-size: 2.5rem; font-style: italic;} #sngAlbum { color: rgb(157, 196, 95); font-size: 1.5rem; font-weight: bold; padding-left: 7%; clear: both;} #sngAlbum span { color: rgb(127, 139, 96); font-weight: normal;} #avalbums { position: relative; margin-top:-.625rem; padding: .3125rem; z-index: 7; border: 0 solid #333; border-radius: .375rem; } #agroup_hdr { z-index: 8; margin-top: 0; position: relative; padding-top: .625rem; } #agroup_hdr h1 { font-size: 1.85em; color: #CCFF14; z-index: 8; margin-left: .625rem;} #downloadthumb { position: relative; margin: 5px 0 0 90px; color: white;} .avalbumbox { position: relative; float: left; margin: .3125rem 0 0 0; line-height: 100%; z-index: 2; width: 90px; text-align: center; border: 0 solid #333; border-radius: .1875rem;} .avalbumbox:hover { border: .0625rem solid gold; background: #333; border-radius: .1875rem; padding: 0; } .avalbumbox a {color: #fbff03;} .songhilite { background: #EA570A; color: #fff; height: 40px;} .songhilite a { color: #000;} #restable .songhilite .td { transform: translateY(20%);} #restable .songhilite .td:last-child { transform: translateY(15%);} #songinfoheader, .songhilite{ z-index: 9; position: relative; border-right: none;} #songinfoheader div:nth-child(2).headinfo { text-align: center;} /* Thumbnail and imagery */ .thumbnailer, .thumbnailercntr { position: relative; top: -50%; left: 5em;font-family: Calibri, Tahoma, Geneva, sans-serif; margin-left: 0; width: 250px; z-index: 9; border-radius: .4375rem; } .thumbnailz a { position: relative;} .thumbnailz a span { position: absolute; margin-left: 25%; display: none; z-index:9;} #title_artist ul .thumbnailz a:hover span{ display: block;} #artistselect { font-size: 1.44em } #artistselect ul .thumbnailz a:hover { border: .0625rem solid #00aa11; border-radius: .1875rem; background: #4F8A10; padding: .3125rem; font-size: 1em; font-weight: bold; line-height: 1.0em; } #sel_artisthdr { z-index: 9; color: #FFF; font-size: 19px; font-weight: normal; line-height: 24px; padding-bottom: .375rem; letter-spacing: -1px; } .album #sngdisplay { top: 25%;} .artist_thumbprofile{ display: none; position: absolute; border: 0 solid #ccc; z-index: 10; top: 36%; left: 36%;} .artist_thumbprofile:hover { display: block;} .hide_abox { width:100%; padding: .0625rem;} .thmblnk { Width: 99%;} .vidlaunch { margin-top: .25rem; float: left; display: block; white-space:nowrap;} .videoicon { width:25px; padding: 2px;} /* ------------// Likes -comments //-------------------------*/ #display_comment .commentbox { margin-bottom: 1.25rem; background-color: #fff; border: .0625rem solid transparent; border-radius: .25rem; -webkit-box-shadow: 0 .0625rem .0625rem rgba(0,0,0,.05); box-shadow: 0 .0625rem .0625rem rgba(0,0,0,.05); } #display_comment .combody { padding: 1rem; color: #586356; background: #fff; } #regardSong { cursor: pointer;} .commentbox>.comhead { color: #333; background-color: #f5f5f5; border-color: #ddd;} .comhead { padding: .625rem 1rem; border-bottom: .0625rem solid transparent; border-top-left-radius: .1875rem; border-top-right-radius: .1875rem; } .comfoot { padding: .625rem 1rem; background-color: #f5f5f5; border-top: .0625rem solid #ddd; border-bottom-right-radius: .1875rem; border-bottom-left-radius: .1875rem; } .likesbox { float: right; font-size: 1rem; margin-right: 5%; width: 40%; position: relative;} .likesbox [class*='fa-'] span { font-size: .75rem; margin-left: .25rem;} .likesbox [class*='fa-'] { width: 15%; font-size: 1rem; margin-left: .3125rem; margin-right: .3125rem; } .likesbox [class*='fa-']:hover::before { color:#86f53c; cursor: pointer;} .likesbox .fa-comment:hover { font-family: 'FontAwesome';} .likesbox .fa-laugh:hover, .likesbox .fa-meh:hover, .likesbox .fa-frown:hover { font-family: 'Font Awesome 5 Free'; font-weight: 900;} .likesbox .tooltip { display: none;} .likesbox .tooltip:hover { display: block; position: absolute; width: 200px; top: 1rem; left: 0; margin: 1rem; padding: 5px 1.25rem 5px 5px; z-index: 1050; background: #8f0404; border: #666 .0625rem dotted;} .rateMsg { position: absolute; z-index: 1;} /* // --------------------// Cart //-----------------// */ #cartAmt { color: gold; font-size: 1rem; line-height: 1rem; padding: .125rem .3125rem; background: green; border-radius: 2px;} #cartData { color: black; display: none; width: 100%; line-height: 1.25rem; margin-top: 2.9rem; border: .125rem solid #ffc107; border-radius: .625rem; background: white;} #cartData .opacItem { opacity: .3;} #cartData .tr { width: 95%; height: 4.5rem; margin: 0 auto; padding: .4rem 0 .4rem; border-bottom: .0625rem solid #cddc39;} #cartData .tr div { padding-left: .625rem;} #cartData .tr:first-child { padding-top: .5rem;} #cartData #emptyCart { height: 7rem; padding: 1rem;} #cartDisplay { width: 36%; top: 68%; right: 3.5%; position: absolute; z-index: 0;} #cartDisplay .avalbumbox{ width: 3.125rem; height: 3.125rem; margin-top: .3125rem;} /*#cartDisplay .avalbumbox:hover { margin-top: 0; padding-left:.3125rem; border: .3125rem solid gold; background:none;}*/ #cartDisplay .cartImg:hover { margin-top: 0; padding-left:.3125rem; border: .3125rem solid gold; background:none;} #cartDisplay span { width: 1.25rem; margin-right: -3rem; margin-top: .5rem; float: right;} #cartPage { width: 100%; background: #fff;} #cartPage #cartAmt { color: grey; background: none;} #cartPage #cartData { margin-top:0; border-radius: 0; overflow: auto; min-height: 12.5rem; max-height: 37.5rem;} #cartPage #cartSubmit { margin-top: 0.5rem;} #cartPage #subTotRow { width: 27%; min-height: 11.25rem; right: .3125rem; position: absolute; border: none; background: #fff;} #cartPage #totDesc { color: grey; font-size: 1rem; margin-top: .3125rem;} #cartPage .cartItems { width: 73%; height: auto; float: left; overflow-y: hidden; background: #fff;} #cartPage .subButt { width: 100%; padding-bottom: .625rem; position: absolute; top: 2%; right: 10%; left: 0; text-align: center; background: #e3e8e3;} #cartPage .cartsubT { top: 50%; position: absolute;} #cartPage .cartsubTot { width: 100%;position: relative;} #cartPage .wrap { height: 90%; padding: .625rem; border: .0625rem solid #cddc39; border-radius: .3125rem;} #cartOver { width: 45%; height: 36rem; display: none; position: absolute; right: 0;} #cartSubmit { color: #4CAF50; /* margin-top: 1.5rem; */ padding: .75rem; position: relative; /* z-index: 1; */ cursor: pointer;} /* #cartSubmit.err { margin-top: -5.5rem;} */ #cartSubTot { color: red; margin-right: 2.125rem;} #cartTitle { height: 3.125rem; height: 3.125rem; color: #fff; padding-top: .625rem; padding-left: 1.875rem; position: relative; background: #648119;} #emptyCart h1 { font-size: 3rem; line-height: 2rem; padding-bottom: 1rem;} #goBuyErr { transition: opacity 750ms cubic-bezier(0.65, 0.04, 1, 1); opacity: 1; transition: opacity 0.3s, visibility 0.3s; display: none; z-index: 1; width: 100%; height: 4rem; margin-top: -.625rem; /* padding-bottom: .5rem; padding-top: .3125rem; */ text-align: center; position: relative; float :left; color: gold; background: red; border-radius:.3125rem; } #subTotRow.tr { height: 8rem; padding-top: .4rem;} #subTotRow p { float: right; padding-top: .5rem; padding-right: 2.125rem;} #trbody .fa-cart-arrow-down, #trbody .inCart { height: 100%; padding: .125rem 2rem; color: white; font-size: 1.5rem; white-space: nowrap; border-radius: .1875rem; transition: all .15s ease 0s;} #trbody .fa-cart-arrow-down { margin-bottom: .65rem; -webkit-backface-visibility: hidden !important; box-shadow: none !important; background: #365920; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, rgba(255, 255, 255, .3)), color-stop(100%, rgba(255, 255, 255, 0))) !important; background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, .3), rgba(255, 255, 255, 0)) !important; background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0), rgba(255, 255, 255, .3)) !important; background-image: -o-linear-gradient(rgba(255, 255, 255, .3), rgba(255, 255, 255, 0)) !important; background-image: linear-gradient(to top, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .3) 100%) !important; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4dffffff', endColorstr='#00ffffff', GradientType=0) !important; } #trbody .fa-cart-arrow-down:hover { color: #fff700;} #trbody .inCart { background: white; padding: .20rem 1.3rem; color: #365920; font-size: 1rem; font-weight: bold; line-height: 1.95rem;} .addMe, .delMe { margin-top: .125rem; margin-left: .1875rem;} .addMe span, .delMe span { margin-top: 0;} .cartEven { padding-right: .1875rem; background: #fff;} .cartEven:hover, .cartOdd:hover { background: #efffce; border-right: .03125rem solid #cddc39; border-left: .03125rem solid #cddc39;} .cartImg { width: 3.125rem; /* border: .0625rem solid gold; padding: 0; */} .cartItems { height: 13rem; overflow-y: auto;} .cartOdd { padding-right: .1875rem; background: #f3fef7;} .cartTxtWrap { width: 30%; float: left; text-align: left;} .cartPrcWrap { float: right; text-align: left; margin-top: 1.25rem;} .fa-shopping-cart { font-size: 3.5rem; margin-top: -.3125rem;float: right;} .remove { font-size: .9rem; color: #085b8f; cursor: pointer;} .remove:hover { text-decoration: underline;} .sngArtist { color: grey;} .sngPrice { width: 3.375rem;} .sngPriceChk { float: right; cursor: pointer;} .sngPrice, .sngPriceChk { float: left;} .subButt { position: relative; left: -2.1875rem; float: right; } /* // --------------------// Contact Form //-----------------// */ #artistselect { position: relative;} #contactform, #privacy, #conditions, #artistselect { padding: 1.125rem; padding-left: 3rem; box-shadow:0 -5px 300px #333; border-bottom-left-radius: .625rem; border-bottom-right-radius: .625rem; } #contactjamnat { line-height: 150%; width: 100%;} #contactjamnat textarea{ width: 75%;} #cap_ques { margin: .625rem; } #secblock#retmsg, #secblock#cap_ques{ margin: .625rem;} /* // --------------------// PRIVACY & TERMS //-----------------// */ #privacy strong, #conditions strong { color: #9f9;} #privacy a,#conditions a{ color: #9C0;} .list_1 { color: #9C0;} /* // --------------------// Login Form //-----------------// */ /*######## #signupbox ######## #signupbox{ margin-left:auto; margin-right:auto; max-width: 700px; padding: 30px 30px 1.25rem 30px; font: .75rem Arial, Helvetica, sans-serif; color: #666; border-radius: .3125rem; }*/ #arrow { display: none; position: absolute; width: 270px; height: 315px; margin-left: 2rem; z-index: 3; background: url('../images/uparrow.png') no-repeat;} #popupLog { width: 500px; max-width: 630px; padding: 1.25rem 1.25rem 1.25rem 30px; border: 2px solid #99DB48; background: #000 url('../images/jamfonesbk.png') no-repeat; border-collapse: collapse; margin: 0 auto; border-radius: .625rem; } #signupbox, #logininfo, #msginfo, #mainlogin_formbox { position: absolute; right: 100px; top: 1.25rem; width: 500px; max-width: 650px; margin: 0 auto;padding: 1.25rem 1.25rem 1.25rem 30px; background: #000 url('../images/jamfonesbk.png') no-repeat; border: 2px solid #99DB48; border-collapse: collapse; border-radius: .625rem; z-index: 9; } #logininfo, #msginfo { transform: translateY(50%); width: 65%;} #navControl { display: none;} #signin { margin-top: 3%;} #signin .form-group { float: left; margin-left: .5rem; margin-bottom: 0;} #signin #loginbtn { margin-left: .25rem;} #logged_in { display: block; background: #464F31; padding: 7px 5px 7px; border-radius: .25rem; } #logged_in div { width: 100%;} #loginform { border-collapse: collapse; border-spacing: .3125rem; font-size: .75rem; margin: 0 auto; border-radius: .375rem;} #loginform.nologin input::placeholder { color: gold;} #login_formboxX { width: 54%; padding: 1.25rem; border: .0625rem solid #123212; border-collapse: collapse; margin: 0 auto; border-radius: .625rem; } #login_formbox2 { margin-left: 15rem; } form #login_form { border: .0625rem solid #333; padding: 1.25rem; margin:50px auto; width: 250px; background: #000; background: linear-gradient(90deg,#505F4D 19% , #777F77 75%); border-radius: 1.25rem; box-shadow:0 -5px 300px #333;} #login_form label { font-size: 11px; font-family: arial, sans-serif; list-style-type: none; color: #fff; text-shadow: #000 1px 1px; margin-bottom: .625rem; letter-spacing: .0625rem; display: block;} #login_form .leftcol { width: 35%; float: left; text-align: right; } #acc_linkblock { margin-left: 50%; text-align: center; margin-top:-2rem; } .ajaxbox h1 { padding: 1.25rem 0 1.25rem 40px; display: block; margin: -20px -1.3125rem 1.25rem -32px; color: #FFF; background: #99DB48; text-shadow: .0625rem .0625rem .0625rem #949494; border-radius: 5px 5px 0; border-bottom:.0625rem solid #89AF4C;} .ajaxbox h1>span { display: block; font-size: 11px; color: #FFF;} .ajaxbox label { display: block; margin: 0 0 .3125rem;} .ajaxbox label>span { float: left; margin-top: .625rem; color: #fff;} .ajaxbox input[type="text"], .ajaxbox input[type="password"], .ajaxbox input[type="email"], .ajaxbox textarea, .ajaxbox select { color: #555; height: 36px; width: 103%; margin-top: 2px; border: .0625rem solid #E5E5E5; background: #FBFBFB; outline: 0; box-shadow: inset 1px 1px 2px #eeeeee; line-height: 24px; font-weight: normal; font-variant: normal; font-style: normal; font-size: 22px; font-family: Arial, Helvetica, sans-serif; } .ajaxbox textarea { height:100px; padding-top: .625rem;} .ajaxbox select { width:72%; height:36px;} .ajaxbox.button { background-color: #9DC45F; border-radius: .3125rem; border: none; padding: .625rem 25px .625rem 25px; color: #FFF; text-shadow: 1px 1px 1px #949494;} .ajaxbox.button:hover { background-color:#80A24A;} .closeme { width: 120px; padding: .625rem; text-align: center; color: #fff; background: #99DB48; font-weight: bold; text-decoration: none; box-shadow:0 -5px 300px #333; border-radius: .25rem; margin-top: .9375rem; margin-right: auto; margin-left: auto; float: right;} .closeme:hover { color: #FF0; font-weight: bold; cursor: pointer; background: #A51200;} .collapse:not(.show) { display: block;} .toggleme { display: none;} .loginText p { margin: 0;} [contenteditable="true"]{ padding: .625rem; outline: 1px #000;} [contenteditable="true"]:hover { background: #fff700; border: .0625rem solid red; font-weight: bold; font-size: 13px; color: red;} #msg_msg, #login_msg { color: #ff0;} #status { padding: .625rem; background: #090; color: #ff0; font-weight: bold; font-size: .75rem; margin-bottom: .625rem; display: none; width: 90%; } #userinfotable { margin: 0 auto; width: 99%; color: #000; border-radius: .375rem;} #userinfotable td { padding: 8px;} #login_form .rightcol { border: 0 solid #999;} #login_form #regblock.rightcol { width: 75%; border: 0 solid #999;} input.submit { width: 100px; background: #777F77; -webkit-transition-property: -webkit-box-shadow, background; -webkit-transition-duration: 0.25s; background: linear-gradient(90deg, #515F4D 19%, #777F77 75%); color: #fff; text-transform: uppercase; text-shadow: #000 1px 1px; border-top: .0625rem solid #999; margin-top: .625rem; } input[name|="sel_"] { width: 1.125rem; height: 1rem; } input:hover,textarea:hover { box-shadow: 0 0 .25rem #311; background: #757F1F; color: #78b10a; border: .0625rem solid #ff0;} #login_form #submit, #submit, #comsubmit { width:239px; height:76px; text-align:center; color:#FFF; font-size: 11px; font-weight:bold; background: url(../images/jumptoaction.png) no-repeat; border: none; margin-top: 8px; line-height: 25px; } #submit { text-align: center; margin: 0 auto 8px; padding: .3125rem;} #submit input { padding: .1875rem; border: .0625rem solid #393;} .submit:hover, #submit:hover, #dosubmit#submit:hover { background: url(../images/jumptoaction.png) no-repeat 0 -76px;} .tr #buyalbum { right: 7.5%; } #buytraks, #buyalbum { float: right; color: #fff700; background-color: #47a447; border-color: #4cae4c; padding: 14px; right: 5.5%; margin-top: .4375rem; font-weight: 600; font-size: 1.25em; font-family: Helvetica Neuve,arial,tahoma,serif; text-align: center; text-transform: uppercase; border-radius: .3125rem; z-index: 5; position: relative; } #buytraks.stick { position: absolute; top: 0; right: 0; z-index: 9;} #buytraks.sticky { position: fixed; top: 0; right: 25px; box-shadow: 5px 8px 5px #000;} #submsg, #subhdmsg { top: 50%; font-size: 1rem; text-align: center; padding-left: 5%; width: 100%;} #subhdmsg span { font-size: 171%; color: yellow;} #buyalbum { margin-top: .625rem;} /* #buytraks{ width: 138px; height: 31px; padding: .625rem; } #buytraks span, #buyalbum span { display: block; line-height: 14px; position: relative; margin-top: .4375rem; } #buytraks:hover, #buyalbum:hover{ color: #fff700; background-color: #270; border-color: #398439; text-transform: uppercase; cursor:pointer; /* font-weight: bold;font-size: 1.5em; font-family: arial, helvetica, tahoma; text-align: center; /*background: green url('../images/button.png') -0px -97px; } */ textarea:hover { box-shadow: 0 0 .25rem #311; background: #757F1F; color: #ff0; border: .0625rem solid #ff0; } #myemail label, #mypass label { margin-top: .75rem; text-align: left; } #whatcust { float: left; margin-left: .3125rem; margin-top: .625rem; } #returningCust { margin-top: -.625rem; } #login_form input.disabled { background: #0C0F0B;} #login_form input.enabled { background: #424F40;} .form_errs { line-height:155%; padding: .625rem; border: .0625rem solid #f00; background: #6F1B1B; color: #ffc; font-size: .9375rem; border-collapse: collapse; margin: 5px auto; border-radius: .3125rem; text-align: center;} .form_warn { width: 90%; padding: .625rem; border: .0625rem solid gold; background: #8F641A; color: gold; font-size: 14px; border-collapse: collapse; margin: 5px auto; border-radius: .3125rem; } /* Regt Form */ #regpass label { color: #fff; text-shadow: #000 1px 1px; letter-spacing: .0625rem; position: relative; margin: 0 0 0 25px; display: block; } #login_form #myname, #login_form #regemail { margin: 0; padding: 0;} #myregpass, #regemail, #myname { width: 100%;} #infosales { margin: 0 auto; width: 99%; color: #000; border-radius: .375rem;} #infosales td { padding: .3125rem; border: .0625rem solid black;} #infosales tr:hover { border: .1875rem solid green; z-index: 10; width: 1024px; background-color: gold;} #infosales .color1 { background: #D1DF99;} #infosales .color2 { background: #C9DF6F;} #infosales td:hover { border: none;} #infosales .finalpay:hover { color: red; border: none;font-weight: bold} /* //-------------------------// Download Output //------------ */ #cDown { clear: both; border: .0625rem solid #333; font-weight: 500; width: 100%; height: 50px; padding: .3125rem; border-radius: .375rem; } #countDown { border: 0 solid #d33; line-height: 1.5em; color: red; width: 100%; font-size: 1.8em; margin: 0 auto; } #downbox { clear:both; height: 1.5625rem; line-height: .75rem; margin: 0 auto; padding: .3125rem; border-left: .0625rem solid #333; border-bottom: .0625rem solid #333; } #dlboxwrap { border-top: .0625rem solid #333; margin-bottom:80px; clear: both; } #dusty { position: absolute; left: 530px; top: 300px; width: 300px; height: 300px; background: url(../images/dustytapes300.png) no-repeat; } .downbox ,.downboxname, .downboxlink { position: relative; border-collapse: collapse; border-spacing: .3125rem; font-size: .75rem; } .downbox { border-radius: .375rem; } .downboxname { float: left; width: 180px;} .downboxlink { float: left; width:300px; border-left: .0625rem solid #333; padding-left: .625rem; padding-top: .3125rem; } /* MISC */ #title_artist, #title_newsletter, #title_singles, #title_album { border-top: .0625rem solid #333; /* background: #000;*/} .abtn.cellval { display: block; position: relative; text-align: center;} .cellheader { display: none;} .cellval { width: 100%; display: inline-block; /* z-index: 5; */ position: relative; text-align: left; padding-top: 7px;} .artistlist_hdr:hover, .title_singles_hdr:hover, .title_newsletter_hdr:hover, .title_artist_hdr:hover, .title_album_hdr:hover { cursor: pointer;} .artistlist, .artistlist_1, .artist_sellist, .select_artist { display: block; /* margin: 5px 0 0 .625rem; margin-top: .1875rem; border: solid 2px #272727; */ padding: .625rem; border-top-style: none; border-radius: .3125rem;} .artistlist ul li, .artistlist_1 ul li, .artist_sellist ul li, .select_artist ul li{ line-height: 1.0em; letter-spacing: -1px; padding: 2px .25rem 2px .375rem; list-style-type: none; } .artistlist a:hover, .artistlist_1 a:hover, .artist_sellist a:hover, .select_artist a:hover { text-decoration: underline;} .select_artist_1, .select_artist_2{ list-style-type: none;} .title_album_hdr{ clear: both;} /* // --------------------// Download Choice //-----------------// */ #advertbox { margin-left: auto; margin-right: auto; text-align: center;} #affil_2 { clear: both; text-align: center;} .advertImg { width: 190px; } .sel_artistbox { position: relative; margin: 0 auto; padding: .25rem; border: .0625rem solid #272727; } .affiliates { clear: both; display: inline-block; margin-left: auto; margin-right: auto; padding: .625rem; border: .0625rem solid #333; border-radius: .375rem; } .sudo_adbox { height: 125px; } /* INPUT STYLED MISC */ #restable#checkAll { z-index: 8;} .checkbox, .radio { width: 19px; height: 25px; padding: 0 5px 0 0; background: url(../images/checkbox.png) no-repeat; display: block; clear: left; float: left; } .radio { background: url(../images/radio.gif) no-repeat;} .select { position: absolute; width: 158px; height: 1.3125rem; padding: 0 24px 0 8px; color: #fff; font: .75rem/1.3125rem arial,sans-serif; overflow: hidden; } /* wrapper divs */ .custom-checkbox, .custom-radio { position: relative; } /* input, label positioning */ .custom-checkbox input, .custom-radio input { position: absolute; left: 2px; top: .1875rem; margin: 0; z-index: 0;} .custom-checkbox label, .custom-radio label { display: block; position: relative; z-index: 1; font-size: 1.3em; line-height: 1; padding: .5em 0 .5em 30px; margin: 0 0 .3em; cursor: pointer; } .custom-checkbox label { background: url(../images/checkbox.gif) no-repeat; } .custom-radio label { background: url(../images/radiobutton.gif) no-repeat; } .custom-checkbox label, .custom-radio label { background-position: -.625rem -14px;} .custom-checkbox label.hover, .custom-checkbox label.focus, .custom-radio label.hover, .custom-radio label.focus { background-position: -.625rem -114px;} .custom-checkbox label.checked, .custom-radio label.checked { background-position: -.625rem -214px;} .custom-checkbox label.checkedHover, .custom-checkbox label.checkedFocus { background-position: -.625rem -314px;} .custom-checkbox label.focus, .custom-radio label.focus { outline: 1px dotted #ccc;} #overlayEffect { display:none; position:fixed; height:100%; width:100%; top:0; left:0; z-index:1; background: linear-gradient( #299a0b 0%,#233a0b 100%); opacity:.54;} #popupContainer { color: #8FC800; position:fixed; left:50%; top:50%; width:500px; background: #000; border:2px solid gold; z-index:12; padding: .625rem; box-shadow: 0 0 2px rgba(255, 255, 255, 0.6) inset; border-radius:6px; } #popupContainer h1 { text-align:left; text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.6); color:#090; font-size:22px; border-bottom:2px dotted #D3D3D3; padding: 5px 2px; margin-bottom: .625rem; } #popupContainer p { font-size:1rem; line-height:1.4;} #close { background:url('../images/icons/close.png') no-repeat center center; cursor:pointer; width:56px; height:56px; z-index:13; position:absolute; top:0; right:0; } #button { text-align:center; padding: .625rem;} #signinbtn, #signoutbtn { display: none;} .videoicon img { vertical-align: top;} .hidden { display:none; } .transparent { width: 100%; opacity: 0.5; } .longcut { display: block; float: left;} .shortcut { display: none; float: left; } /* Audio Player Styles ================================================== */ /* ******** */ @-webkit-keyframes rotate { from { -webkit-transform: rotate(0deg) } to { -webkit-transform: rotate(360deg) } } @-webkit-keyframes counter-rotate { from { -webkit-transform: rotate(360deg) } to { -webkit-transform: rotate(0deg) } } @-moz-keyframes rotate { from { -moz-transform: rotate(0deg) } to { -moz-transform: rotate(360deg)} } @-moz-keyframes counter-rotate { from { -moz-transform: rotate(360deg)} to { -moz-transform: rotate(0deg) } } @-ms-keyframes rotate { from { -ms-transform: rotate(0deg) } to { -ms-transform: rotate(360deg) } } @-ms-keyframes counter-rotate { from { -ms-transform: rotate(360deg) } to { -ms-transform: rotate(0deg) } } @-o-keyframes rotate { from { -o-transform: rotate(0deg) } to { -o-transform: rotate(360deg) } } @-o-keyframes counter-rotate { from { -o-transform: rotate(360deg) } to { -o-transform: rotate(0deg) } } @keyframes rotate { from { transform: rotate(0deg) } to { transform: rotate(360deg) } } @keyframes counter-rotate { from { transform: rotate(360deg) } to { transform: rotate(0deg) } } #audiobase audio { width: 0; height: 0; } /* #audioPlayer .fa, #audioPlayer .fa:hover { margin-top: .625rem;} */ #audiotarget { width:100%;} #audiowrap, #plwrap { margin:0 auto; position: static;} #btnNext { margin-left: -.375rem;} #btnPlay { margin-top: .625rem; margin-left: -.375rem; color: #eba916;} #nowPlay { display: inline;} #npAction { padding:1.3125rem; position: absolute; margin-left: 14%;} #npTitle { padding:1.3125rem;} #plList { overflow-y: scroll; height: 249px; -ms-scrollbar-highlight-color: #474c1a; -ms-scrollbar-face-color: #9aa538; -ms-scrollbar-arrow-color: #9aa538; } #plList::-webkit-scrollbar { width: .9375rem; background-color: #474c1a;} #plList::-webkit-scrollbar-track{ border: .0625rem solid black; background-color: #474c1a;} #plList::-webkit-scrollbar-thumb{ background-color: #9aa538; } #plList li { cursor: pointer; display: block; margin:0; padding:5px 0;} #plList li:hover { background-color:rgba(0,0,0,.1);} #plistBttns { float: left; width: 38%; text-align: center; position: relative; overflow-y: auto;} #sngLenTime { color: #a1fb84; } #song-scrubber-load { height: 100%; width: 100%; background-size: 30px 30px; background-image: linear-gradient(45deg,rgba(0,0,0,.1) 25%,transparent 25%,transparent 50%,rgba(0,0,0,.1) 50%,rgba(0,0,0,.1) 75%,transparent 75%,transparent); transition: opacity .3s ease; animation: barberpole .5s linear infinite;} #song-scrubber-progress { box-shadow: 0 0 0; background-color: #f7c342; border-radius: 0; background: #F7C341; } #song-scrubber-load { height: 100%; width: 100%; background-size: 30px 30px; background-image: linear-gradient(45deg,rgba(0,0,0,.1) 25%,transparent 25%,transparent 50%,rgba(0,0,0,.1) 50%,rgba(0,0,0,.1) 75%,transparent 75%,transparent); transition: opacity .3s ease; animation: barberpole .5s linear infinite;} #song-scrubber-progress { box-shadow: 0 0 0; background-color: #f7c342; border-radius: 0; background: #F7C341; } /*.abtn.cellval { height: 100%;}*/ .abtn.cellval span { display: block;} .audioButton { height: 100%;} .audioButton .button { width: 0; height: .625rem; position: absolute; margin: 8px 0 0 .75rem; padding: 0; border: 0; background: transparent; box-sizing: border-box; border-color: transparent transparent transparent #fff; transition: 100ms all ease; cursor: pointer; border-style: solid; border-width: 5.5px 0 5.5px .625rem; } .audioButton .button.pause { border-style: double; margin: 9px 0 0 .625rem; border-width: 0px 0 0px .625rem; } .audioButton .abtn:hover, .audioButton .theBtn:hover, .audioButton .button:hover { border-color: transparent transparent transparent #9ef472;} .audioButton .circle{ width: 30px; height: 30px; border: 2px solid #598560; background-color: transparent; border-radius: 50%; display: inline-block;} .audioButton .pause, .audioButton .play, .audioButton .stop { margin-top: 0; text-align: center; padding-right: 0; padding-left: 0;} .audioButton .pause:focus, .audioButton .play:focus, .audioButton .stop:focus { margin-top: 0; text-align: center; padding-right: 0; padding-left: 0;} .audioButton .paused{ height: .625rem; margin-left: .625rem; margin-top: 10px; border-style: double; border-width: 0 0 0 .625rem; } .audioButton .play { display: block;} .audioButton .stop { display: none;} .audioPlay { height: 0; width: 0;} .nowPlayTrak span { color: yellow; } .nowPlayTrak{ color: #fad400;} .plItem { position:relative;} .plTitle { left:5%; overflow:hidden; position:absolute; right:10%; text-overflow:ellipsis;top:0; white-space:nowrap;} .plNum { width:25px;} .plLength { padding-left: 1.3125rem; position:absolute; right: 1.3125rem; top:0;} .plSel, .plSel:hover{ background-color:rgba(0,0,0,.1); color:#fff;cursor:default !important;} a[id^="btn"]:not(#btn_lsb), [id^="btn"]:not(#btn_lsb) { margin-top: .625rem; border-radius: .1875rem; color:#ffc107; cursor:pointer; display:inline-block; font-size:1.44rem; height:2.5625rem; line-height:.8; padding: .4375rem; text-decoration:none; transition:background .3s ease; width: 2.1875rem;} a[id^="btn"]:last-child { margin-left:-17px;} a[id^="btn"]:hover, [id^="btn"]:hover, a[id^="btn"]:active, [id^="btn"]:active { background-color:rgba(0,0,0,.1); color:#97e62f;} a[id^="btn"]::-moz-focus-inner { border:0; padding:0;} #btnPlay:hover, #btnPrev:hover, #btnNext:hover { color: #97e62f;} /* Plyr Overrides ================================================== */ .plyr--audio .plyr__controls { background-color:transparent; border:none; color:#fff; padding:20px 1.25rem 1.25rem 13px; width:100%;} .plyr--audio .plyr__controls button.tab-focus:focus, .plyr--audio .plyr__controls button:hover, .plyr__play-large { background:rgba(0,0,0,.1);} .plyr__progress--played, .plyr__volume--display { color:rgba(0,0,0,.1);} .plyr--audio .plyr__progress--buffer, .plyr--audio .plyr__volume--display { background:rgba(0,0,0,.1);} .plyr--audio .plyr__progress--buffer { color:rgba(0,0,0,.1);} /*--------------------------Visualizer -------------*/ .vzwrapper { position: absolute; top: 0; width: 100%; height: 100%; /* background: radial-gradient(circle, #396362, #000000); */ box-shadow: inset 0 0 160px 0 #000; cursor: pointer; } .vzwrapbox{ position: absolute; width: 100%; height: 100%; /* transform: translate(-50%, -81%); height: initial; width: initial; */ background: transparent; box-shadow: none; } #visualizer, canvas #visualizer{ width: 100%; height: 100%; } @media screen and (min-width: 420px) { .vz-wrapper { box-shadow: inset 0 0 200px 60px #000; } } /*------------------------- // Comments ---------*/ .com_container { margin-left: 15%; margin-right: 15%;} #commenter:focus { color: #d7e609; background:#505F4D } #commenter { width: 27%;} #comment { width: 72%;} #display_comwrap { width: 100%; padding: 1%; background: linear-gradient(#000, #4b554c); /* border-radius: .25rem; */} #display_comment, .emoji-wysiwyg-editor { width: 95%; font-size: 1rem; margin: 0 auto; padding-top: .3125rem;} .emoji-wysiwyg-editor:hover { font-size: 1rem; font-weight: normal;} #comment_form { position: relative; margin-top: .75rem; margin-left: 3.25%;} #comlabel { font-weight: 700;} #comlabeltext { font-size: .9375rem;} #comLogin { color: #9cf723; text-decoration: underline; cursor: pointer;} #regardSong { color: #1eff00;font-size: .9375rem; font-style: italic; margin-left: .75rem;} #resetComment { font-size: .9rem; } button.reply { width: 30%;} .panel-default>.panel-heading.comtab, .comtab { position: relative; margin-left: 5%; background: linear-gradient(to bottom,#edf1ec 0,#dee3dc 100%)} .soctoggle { display: none;} .sngArtist { color: #72915a !important; font-weight: normal;} .sngArtist a, .sngArtist a:hover, .sngArtist a:link .sngArtist a:visited{ color: #72915a !important; font-weight: normal; } .sngName { margin-right: 5%;} .sngName:hover { text-decoration: none;} .sngTitle { color: #090; font-style: italic; font-weight: 500;} .sngTitle a:link, .sngTitle a:visited, .sngTitle a:hover .sngTitle a { color: #090!important; font-weight: normal; } /*Container for audio player*/ #audioControl{ width: 45%; height: 7%; margin: auto; margin-top: 1%; margin-left: 36%; border-radius: .25rem; border-top: .0625rem solid gold; } /* Play/Pause Button */ #pButton{ height:60px; width: 60px; border: none; background-size: 50% 50%; background-repeat: no-repeat; background-position: center; float:left; outline:none; } #gutter { width: 400px; height: 1.25rem; background: #4200f7; margin-top: 1.25rem; float: left; border-radius: .9375rem; } /*Grabable Handle*/ #handle{ cursor: pointer; width: 1.125rem; height: 1.125rem; border-radius: 50%; margin-top: 1px; background: rgba(0, 255, 196, 0.82); } #timeline{ width: 60%; height: 30%; background: rgba(92, 182, 35, 0.3); margin-top: 1.25rem; float: right; border-radius: .9375rem; } /*Grabable Playhead*/ #playhead{ cursor: pointer; width: 1.125rem; height: 1.125rem; border-radius: 50%; margin-top: 1px; background: #ffc107; } #playhead:hover { background: #97e62f;} .abs-center{ margin: auto; position: fixed; top:0; right:0; bottom:0; left:0; } /*--------------------------------------// MEDIA QUERIES //-------------------------------------------------*/ @media screen and (min-width: 1451px) { /* #rightColumn { margin-top: -4.75%;} */ #spaceblock #rightColumn { margin-top: -13.32%;} #signin { margin-top: 4%;} .pad20 { width: 90%; margin-left: 5%} } @media screen and (min-width: 1201px) and (max-width: 1950px){ #mp3.dlmp3 { margin-top: -6.25%;} .company #jamfones { margin-top: 9%; right: 18%; z-index: 2; float: right; } } @media screen and (min-width: 1201px) and (max-width: 1450px){ /* #rightColumn { margin-top: -11%; } */ #spaceblock #rightColumn { margin-top: 21%; } } @media screen and (min-width: 1025px){ /* #resholder .td div:last-child { margin-top: 0; transform: translateY(0);} */ #signin { margin-top: 5%;} } @media screen and (min-width: 768px){ #commenter { width: 40%;} } @media screen and (max-width: 1600px) { #mp3.dlmp3 { margin-top: -6.5%;} } @media screen and (max-width: 1200px){ #albumplayer { z-index: 7; position: relative; width: 80%;} #audioControl { margin-left: 45%;} #cartDisplay { width: 45%; } #contentWrapper2{ width: 69%;} #jamfones { z-index: 0; margin-left: 50%;} #jamsplat { position: relative; /* margin: 0 -120px 0 0px; */} #loginform { margin: 0; padding: 0;} #logged_in { white-space: nowrap; border: none;} #logged_in div { display: block;} #mp3.dlmp3 { left: 88%; margin-top: -8.5%;} #profilethumb.pageAlbum { /* right: -62px; */z-index: 4;} #rightColumn { width: 30%; margin-top: 0; z-index: 2;} #signin input { width: 152px;} #slidebox .thumbnailz a span { margin-left:0; margin-top: -36%;} /* #sngdisplay { top: 36%; left: 33%;} */ #sngAlbum { font-size: 1.2rem;} #sngAlbum span { color: #fff;} #sngdisplay:hover { height: 8.5rem; background-color: rgb(71 183 14 / 81%);padding:.325rem; color: #ffc107; border-radius: 0.54rem; }; #sngTitle { font-size: 2rem;} #sngTitle span, #sngTitle span:nth-of-type(2) { font-size: 1.75rem;} #userLoggedIn #loginbox { width: 57%; margin-top: 0;} /*.album #albuminfo { top: 12.5rem;} .album #sngdisplay { top: 32%; left: 33%;}*/ .company #jamfones { z-index: 2; margin-top: 9%; margin-left: 50%; right: 0;} .index #jamfones { z-index: 1;} .thumbnailz a span { margin-left: 45%;} } @media screen and (min-width: 1025px) and (max-width: 1200px){ #mp3.dlmp3 { margin-top: -8%;} #sngdisplay { top: 3%;} .album #albumbox{ width: 25%;} } @media screen and (min-width: 756px) and (max-width: 1024px) { #albuminfo { top: 0; /*11rem*/} #loginbox { margin-top: -3rem; } #sngNum { position: relative; margin-top: 0; /*right: 50%;*/} #sngLenTime { position: relative; margin-top: 1%; right: -3%;} #sngDur { position: relative; margin-top: 13%; right: 36%;} /* #sngLen { position: relative; margin-top: 5%; right: 20%; width: 36%;} #sngLen span { font-size: inherit;}*/ } @media screen and (min-width: 757px) and (max-width: 1200px) { #sngdisplay.retract { width: 45%; height: 90%; padding: .225rem; background: rgb(48 107 23 / 85%); border-radius: .3125rem;} } @media screen and (max-width: 1024px){ audio { width: 45em;} #buytraks, #buyalbum { margin-right: 0;} #cartPage #cartData { min-height: 11.625rem;} #cartDisplay { width: 54%; } #loginbox { width: 56%; } #mp3.dlmp3 { display: none; left: 85%; margin-top: -8.5%;} #plistBttns { margin-top: 2%;} #trbody .fa-cart-arrow-down, #trbody .inCart { padding: .25rem .7rem;} #trbody .tr { height: 3rem;} .fullwidth { width: 100%;} .likesbox { width: 50%;} /* .album #albuminfo { top: 0; } */ .album #albumplayer { margin-top: -12%;} /* .album #sngdisplay { top: 25%; left:0;} */ .album #sngNum { right: 3%;} } @media screen and (max-width: 900px) { #albumbox { width: 32%; /* left: 68%; margin-top: -30%;*/ z-index: 8; position: absolute; border-radius: .375rem; } #albumbox img { width: 100%;} #albumplayer { width: 95%;} #lgdtxt { display: none;} #loginbox { margin-top: -26px;} #download { margin: 2% 36% 0 0;} #loginbox { margin-top: -6.25%;} #loginform { margin-top: 48px;}s #loginstate { float: left;} #rightColumn { margin-top: 0;} /*.album #albumbox { width: 25%;} .album #albuminfo { top: 0;}*/ .subfeature-content { margin-left: -11px;} .subfeature-content div { clear: both; margin-left: 25px; color: #FFE700; font-weight: 400; font-size: 1.23em;} } @media screen and (max-width: 850px) { #albumplayer { width: 100%; /*height: 100%;*/} #buytraks, #buyalbum { right: 0;} #hasemail a { color: #b9e0e6;} #jamfones { z-index: 0;} #logged_in { text-align: left;} #loginbox { float: none; width: 100%; position: absolute;} #loginstate { float: left; width: 22%; height: 100%; margin-top: 0;margin-left: .3125rem; background: green; border-radius: .1875rem;} #mp3.dlmp3 { left: 84%; margin-top: -11.75%;} #userLoggedIn #lgdtxt { display: none;} #userLoggedIn #loginstate { position: absolute;} #userLoggedIn #loginbox { width: 50%; right: 0; /*top: 21%; */ -webkit-transition: width 1s; /* For Safari 3.1 to 6.0 */ transition: width 1s;} #userLoggedIn #loginbox:hover { width: 72%; height: 54%; text-align: left;} #userLoggedIn #logged_in:hover ~ #userLoggedIn #lgdtxt { display: block;} } /* @media screen and (max-width: 768px) { #acc_linkblock { margin-top: -.9375rem;} #albuminfo .box_2third .listitems { margin-left: 0; } #cartDisplay { top: 94%; right: 2%;} #cartPage #subTotRow { width: 100%; position: sticky;} #cartPage .cartItems { width: 100%;} #download { margin: 5% 9% 0 0;} #feature .title { margin-bottom: 1.25rem; margin-top: 30px; text-align: left; } #forgotpass { margin-top: .3125rem; } #forgotpass .separator { color: white; } #loggedin_shim { margin-top: -28px;} #loginlink, #nav-rightimage, #fill_1 { display: none; } #loginbox { margin-top: 0;} #loginstate { position: relative; margin-top: 0; background: none; padding-top: 0; border-radius: .1875rem; height: 0;} #infobox_2third { width: 47%; } #infobox_2third p { margin-top: -.3125rem; width: 110%;} #logininfo, #msginfo { left: 5%;} #mp3 { display: none;} [class^="artist_selmenu"] { margin-top: -20px; margin-left: .625rem;} #navLinx ul li a:hover, #navLinx ul li a:hover { background: green; border-radius: .3125rem;} #newAccount { padding: .3125rem;} #newsletter #button { height: 31px; text-align: center; font-weight: bold; background: #4F8A10;} #prof_imgs { top: -65px; } #profilethumb { right: -.625rem;} #rightColumn { font-size: 85%; z-index: 0;} #subwrap .title { float: left; text-align: left; width: 100%; margin-left: 45px; font-size: 1.3125rem;} #trbody .inCart { padding: .25rem .5rem;} #trbody .fa-cart-arrow-down { padding: .125rem 1.25rem; } #userLoggedIn .longcut { display: none;} #userLoggedIn .shortcut { display: block; float: left; padding-left: 57%;} #userLoggedIn .loginbox:hover ~ #userLoggedIn .longcut { display: block; } #userLoggedIn .loginbox:hover ~ #userLoggedIn .shortcut { display: none; } #userLoggedIn #loginstate { margin-top: .375rem;} .advertImg { width: 150px; } .downboxlink { width: 102.5%; border: .0625rem solid #333; padding: 11px 0 0 .625rem; margin: 2px 0 0 -6px; border-top: 0; border-right: 0;} .showme { float: left; text-align: left;} .slick-prev { left: 0;} .slick-next { right: 0;} } @media screen and (max-width: 768px) and (min-width: 650px){ .collapse { display: block; } .navbar-collapse{ margin-top: -50Px;} .navbar-form .form-group { margin-bottom: 0px; display: inline-block; vertical-align: middle; } #acc_linkblock { margin-top: -.9375rem; margin-left: 50%; } } @media screen and (max-width: 740px) and (min-width: 651px){ #acc_linkblock { margin-left: 41%;} #signin input { width: 125px;} #signin input:hover {width: 152px;} } */ @media screen and (max-width: 767px) { [id^="profilehdr"] { background: #8c2c2c7a;} [class^="artist_selmenu"] { margin-left: 0; } #acc_linkblock { float: right; margin-top: -.5rem; margin-right: 5.5%; padding: .125rem; background: #052701; border-radius: 2px; } /* #albumbox, */#headerbg, #linklogout, #navbarheader #loginlink, #prof_imgs, #profilethumb, #subfeature2, canvas, .collapse, .collapsehead, .separator, .showme { display: none;} #agroup_hdr { padding-top: 1.625rem;} #albumbox { display: block; top: 11rem; right: 8%;} #albuminfo { width: 100%; padding-top: 10%;} #agroup_hdr { z-index: 8; margin-top: 0.0625rem; position: relative; padding-top: 1.625rem; } #albumwrapper { position: static;} #artistselect { font-size: 1.3em;} #artist_sellist2{ position: absolute; top: 1%; left: 48%;} #artist_sellist2 ul { border-radius: 0;} #artist_sellist2 ul li { margin-left: 0;} #audiobase audio{ margin-top: 1.5625rem;} #audioControl { width: 75%; margin: auto; margin-top: 1.5rem; } #buytraks, #buyalbum { float: none; margin-left: 1%;} #cartData #emptyCart{ height: 9rem;} #cartDisplay { top: 8%; right: 3%;} #cartPage .cartItems{ width: auto; float: revert;} #cartPage .subButt { position: relative;} #cartPage .cartsubT { top: revert; position: revert; } #cartPage #subTotRow{ position: revert; width: 100%; min-height: auto;} #cartPage .wrap { height: 103%; border: none;} #cartOver { width: 60%; top: 40%;} #commenter { width: 54%;} #contactform, #privacy, #conditions, #artistselect { padding-left: 1.5rem;} #content p:first-of-type { font-size: 90%;} #content span.italics{ font-size: 110%;} #contentWrapper2{ width: 100%; z-index: 0;} #curSng { margin-left: 1rem;} #headinfo { text-align: right; float: none;} #feature ul { margin-left: -.625rem;} #feature .title { text-align: left;} /* #forgotpass, #newAccount { margin: 7px 0 0 .625rem;} */ #forgotpass { margin: 0;} #frontlist { margin-left: 0;} #login_formbox2 { margin-left: 3rem;} #logged_in { clear: both; border: none; float: none; text-align: center; } #logged_in div { display: block;} #loginform { margin-top: 1.5rem; display: none;} #loginSlide { top: 12%; left: 1%; position: absolute; width: 5%; color: #fff;} #loginSlidebox { margin-top: 2rem; height: auto; padding-bottom: .3125rem; z-index: 0; clear: both;} #loginbox { margin: 0 auto .625rem; padding-bottom: .3125rem; background: black;} #loginbtn { margin-top: -.125rem; margin-right: 6%; float: right; width: 24%; height: 45px;} #loginspace { width: 99%; margin: 18px auto;} #loginstate { display: none; } #logo { margin: 7px .625rem; display: none;} #logo3 { display: block; margin-left: 3.5rem;} #mp3 { left: 75%;margin-top: 6.75%; z-index: 1; } #moretracks_row { height: 130px;} #newAccount { margin: 0 0 0 .625rem;} #nav { display: none; width: 85%; height: 100%; font-size: .9rem; overflow: visible; background: black url(../images/content-fade2.png) repeat-x top; z-index: 2;} #navbarheader#loginSlide{ float: left; margin-top: -.625rem;} #navbarheader .icon-bar { width: 1.5em; height: .1875rem; width: 7.5rem; height: .5rem; background-color: goldenrod; } #navControl { display: block; width: 4rem; margin-right: .3125rem; border-radius: 50%; z-index: 2; } #navControl:hover { background: #6c2016;} #navDisplay { display: block; position: absolute; width: 21%; margin-top:0; margin-left: 15%; color:#fff; background: #38440a; border-radius: .25rem; height: 5rem;} #navDisplay i { margin:13% auto;} #navDisplay .fa-cart-arrow-down { padding: .125rem 1.6rem;} #navLinx { margin: 2% .3125rem; height: 100%; background: none;} #navLinx ul { padding: 18% .375rem 0 .375rem;} #navLinx ul li { margin-top: 0; float: none; border-bottom: .0625rem solid #333; border-radius: .1875rem; /* background: url(../images/content-fade2.png) repeat-x top; */} #navLinx ul li a { padding-left: 15%; text-align: left; border-radius: 0;} #navLinx ul li:last-of-type { border: none;} #navLinx .glow { background: #104e20;} #navLinx { float: left;} #navLinx,#navDisplay{ width: 90%; margin-right: 3%;} #navDisplay { width: 21%; margin-top: 0; margin-left: 10%;} #nav-rightimage { display: none;} #plList { padding-left: .3125rem;} #plistBttns { width: auto;} #prof_img { display: none;} #restable .td { margin: .03125rem 0;} #resholder .td.left { /*float: none;*/ padding-left: 0;} #resholder .tr div:last-child { top: 0; margin-top: -.09375rem; text-align: left; position: -webkit-sticky; position: sticky; } #resholder .tr div:last-child .inCart { top: .4375rem; position: relative;} #resholder .tr div.theBtn { margin: .1875rem 0 0 -1rem;} #restable .oddrow .td { background: #162115;} #restable .evenrow .td { background: #3c4236;} #restable .td.left { width: 100%; height: 2.5rem; text-align: left; padding-left: 1.3125rem;} #restable .td { border-top: .0625rem solid #524725; overflow: visible;} #restable #checkAll { margin-top: -8px;} #restable input[type="checkbox"]{ margin-top: .5625rem; width: 25px; height: 1.25rem;} #rightColumn { z-index: 1; position: relative; width: 100%;} #selall { float: right; margin-top: -20px; color: red; width : 20%;} #selall::after { content: " Select All"; margin-top: .625rem; margin-top: -23px; margin-left: 23px; display: block; } #signinbtn, #signoutbtn { display: block; float: none; width: 100%; margin: 0 auto; color: #F6F4BE; font-size: 1.2em; border: 0; background-image: -webkit-linear-gradient(top,#5cb85c 0, #419641 100%); background-image: linear-gradient(to bottom,#5cb85c 0, #419641 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5cb85c', endColorstr='#ff419641', GradientType=0); filter: progid:DXImageTransform.Microsoft.gradient(enabled=false); } #signin { margin: 0 auto; margin-top: -.625rem; height: auto;} #signin input { width: 100%; font-size: 1.5em;} #signin.right { float: none;} #signinbtn:hover, #signoutbtn:hover { color: goldenrod; background: green; background-image: linear-gradient(to bottom,#5cb85c 0, green 100%);} #signupbox { position: relative; right: 0; top: 0;} #sngAlbum { font-size: 1.25rem; } #songinfoheader { border: none; height: 0;} #slidebox .thumbnailz a span { margin-left: 21%;} #signinbtn:focus, #signoutbtn:focus { border: transparent;} #sngdisplay { position: inherit; width: 100%; height: auto; top: 72%; left: 0; padding: 1%; border-radius: .3125rem; box-shadow: 0 .375rem .375rem -.375rem #000; background-color: rgba(0, 128, 0, .5);} #sngLen { line-height: .9;} #sngLenTime { position: relative;} #sngTitle { font-size: 1.75rem;} #sngTitle span { font-size: 1.15rem; line-height: 1rem;} #subhdmsg { width: 100%;} #subwrap { margin-top: 0; height: .3125rem;} #sngTitle span:nth-of-type(2) { font-size: 2rem; padding-top: 5px;} #starback, #starback2{display: none;} #timeline { width: 60%; margin-top: 1.1rem; margin-left: 1rem;} #trbody .fa-cart-arrow-down, #trbody .inCart { margin-top: .36rem;} #userLoggedIn #lgdtxt { display: block;} #userLoggedIn #loginSlidebox { margin-top: 0;} #userLoggedIn #loginbox { width: 100%; margin: 0 auto .625rem; position: relative; top: 2px; -webkit-transition: none; transition: none;} #userLoggedIn #loginbox:hover { width: 100%; height: auto;} .albuminfo .emp { font-weight: normal;} .alb.width_1 { text-align: left;} .alb.width_2 { width: 7%;} .alb.width_3 { width: 37%;} .artist_sellist2_2 h3{ margin-right: 25%;} .audioButton:hover, .tr .width_8:hover, .audioButton:focus { background: #00aa11;} .audioButton { background: red;} .audioButton .pause, .audioButton .play, .audioButton .stop { text-align: left;} .audioButton .button.ab767 { top: -.5625rem; left: -.125rem; border-width: 1rem 0 1rem 2rem; z-index: 1;} .audioButton .circle.ab767 { position: absolute; top: -.625rem; width: 54px; left: -.4375rem; height: 3.375rem; background-color: #598560;} .audioButton .button.ab767.paused { height: 1.875rem; border-width: 0 0 0 1.625rem;} .audiocell { height: 30px;} .box_2third { width: 50%; margin-top: -20px;} .cartItems { height: 18rem; overflow-y: unset;} .cartTxtWrap { width: auto;} .cellheader { display: inline; width: 60px; float: left; font-style: italic; font-size: 75%;} .cellval { display: inline; float: left; font-size: 1rem;} .collapsehead { display: block;} .com_container { margin-left: 12.5%; margin-right: 12.5%; } .company #contentWrapper2 {z-index: 0;} .footcart { position: relative; } .likesbox .fa { margin-top: 0;} .likesbox .social{ position: absolute; display: block; width: max-content; top: 5%; margin-left: 0; z-index: 1; padding: .3125rem; border-radius: .3125rem; background: transparent; border: .0625rem solid #586e44; box-shadow: 0 .3125rem .3125rem .0625rem black;} .likesbox [class*='fa-'] { width: auto;} .plLength { right: .3125rem;} .rotate { -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); } .separator { display: block;} .slider { width: 100%;} .slick-prev, .slick-next { height: 100%;background: transparent !important; cursor: pointer;} .slick-slide { margin: 0;} .soctoggle { display: none;} .sngArtist, .sngName {font-size: 1rem;} .songhilite { height: 100%;} .songhilite a { color: #8deb39;} .spaceblock { clear: both; width: 100%; height: 100%; margin-bottom: .625rem; border: .0625rem solid #6c2016; border-top: none; padding: 0; } .spaceblock.collapsed { border: 2px solid #628b2f; border-top: none;} .theBtn { margin-top: .1875rem;} .theBtn.stop.curPlay { position: relative;top: 12%;} .thumbnailz a span { margin-left: 36%;} .thumbnailercntr{ left: 4em;} .tr { border-top: .0625rem solid #333;} .trhead .headinfo, .trhead .alb .headinfo { display: none;} .toggleme { display: block; float: right; position: relative; z-index: 1; height: 40px; font-size: 1.25em; font-weight: bold; margin: 0 auto; margin-bottom: .9375rem; padding: .625rem; padding-top: 0;color: #fff; cursor: pointer; text-align: center; text-decoration: none;width: 100%;border-radius: .25rem; box-shadow:0 -5px 300px #333; background: #6c2016; border-radius:0;} .toggleme.collapsed { background: #628b2f;} .toggleme span { font-size: 1.25em; } .toggleme i { margin-top: 8px;} .vidlaunch { margin-top: -3px;} .width_1 { height: 30px;} .width_1, .width_2, .width_3, .width_4, .width_5, .width_6, .width_7 { width: 100%;} .album #albumbox{ top: -2rem;} .album #albumInstruct { position: absolute;top: 12rem;} input[type=checkbox]{margin-top: .5rem; } } @media screen and (max-width: 560px){ .album #albumbox { top: 0rem; } } @media screen and (max-width: 500px) { a[id^="btn"] { font-size: 1.5rem; margin: .625rem -.75rem 9px -.9375rem;} a[id^="btn"]:last-child { margin-left: -.3125rem;} #albuminfo { padding-top: 18%; } #albuminfo .box_third { width: 100%;} #selall { margin: 5px 0;} #songinfoheader { border-top: .0625rem solid #333; height: .9375rem;} #npAction { margin-left: 17%; color: #a7f515;} #npTitle { padding: .1875rem; margin-right: 5%;} #restable { border-bottom: none;} .album #albumbox { top: 8rem;} .album #albumInstruct { top: 0;} .box_2third { margin-top: .9375rem; width: 100%;} .feat { float: initial; position: absolute;top: 1.3125rem;left: .125rem; } } @media screen and (max-width: 439px) { #albumbox { top: 0;} } @media screen and (max-width: 425px) { h1 { font-size: 19px; line-height: 25px; font-variant: normal; letter-spacing: -1px;} h1#subhdr { margin-left: .625rem;} #acc_linkblock { margin-right: auto;} #advertbox, #mp3, #jamsplat, #hotsingle, #hotsingle, #subfeature2 .avalbumz, .subfeature-content, .testmode,canvas{ background: none;} #agroup_hdr h1 { font-size: 1.65em;} #albuminfo { clear: both; float: none; position: inherit;} #albuminfo, #albumbox { float: none; margin: 0;} #albumwrapper { position: static;} #avalbums { position: static; top: 50px; padding: .3125rem; z-index: 7; border: 0 solid #333; border-radius: .375rem; background: #205d2a;} #cartDisplay { top: 25%; right: .5%;} #content h1 { color: #e2b41f;} #contentWrapper2{ position: relative; float: none; background-image: linear-gradient(#222, #000); width: 100%;} #headinfo { margin-top: -1.3125rem; float: left; text-align: left;} #feature { clear: both; padding-left: 1.25rem; color: #FFF;} #feature .title { font-size: 24px; margin: .625rem;} #footsub { font-size: 90%;} #hasemail { float: none; margin: .625rem 0 .625rem;} #hasemail a { color: lightslategrey; font-weight: normal;} #jamtitle { color: #F7DF2C;} #logged_in { clear: both; border: none; float: none; text-align: center; margin-top: -8.67%;} #logged_in div { display: block;} #loginSlide { margin-top: 8px;} #loginstate { float: none;} #loginstate a { color: #999;} #loginform { margin: 0 .625rem;} #logo, #logo2, #logo3, #fill_1, #fill_2, #jamtitle { display: none; font-size: 14px; position: relative; margin-top: 0; transform: scale(1,1.15);} #logo3 { display: block; left: 10%; margin: 0 auto;} #logo3 { margin: 2%; width:70%; } #navLinx ul li a{ padding-left: 10%; margin-left: 10%;} #newsletter #button { color: #FF0; background: #440; font-weight: normal;} #newsletter #button:hover { color: white; font-weight: bold; background: #990;} #resholder,.resholder { padding: .3125rem;} #restable .td { overflow: visible;} #rightColumn { z-index: 2;position: relative; float: none; width: 100%;} #sel_artistlist, [class^="artist_selmenu"], #profilethumb { display: none;} #artistselect ul .thumbnailz a:hover { padding: 0; font-size: 1em;} #title_artist ul .thumbnailz a:hover span { display: none;} #signinbtn:hover, #signoutbtn:hover { color: goldenrod; background-image: linear-gradient(to bottom,#5cb85c 0, green 100%);} #signupbox, #logininfo, #msginfo, #mainlogin_formbox { position: absolute; right: 0; width: 100%; padding-left: .625rem; border: 2px solid #99DB48; background: #000 url('../images/jamfonesbk.png') no-repeat; border-collapse: collapse; margin: 0 auto; border-radius: .3125rem; z-index: 9; box-shadow: 5px 25px 35px #545E4C;} #feature ul { padding-top: 0; margin-top: .625rem;} #playerwrap { position: static;} #moretracks_row { height: 170px;} #newAccount { padding-right: 1rem;} #resholder .td.left { padding-top: 0;} #selall { width: 12%;} #selall::after { margin-left: -36px;} #userLoggedIn #loginbox { margin-top: 9%;} .albuminfo .emp { font-weight: normal;} .audiocell { height: 30px;} .bigslim { font-size: 1em;} .box_third { width: auto; float: left;} .closeme { width: 110px; text-align: center;} .collapsehead { height: auto;} .navbar-toggle { position: relative;} .navbar-collapse{ margin-top: -.9375rem;} .oddrow { background: #66df7a77;} .rotate { transform: rotate(90deg);} .select_artist_1, .select_artist_2{ font-size: 1em;} .separator, .showme { display: none;} .td { border-top: .0625rem solid #211;} .tr { border-top: .0625rem solid #333;} .width_1, .width_2, .width_3, .width_4, .width_5, .width_6, .width_7 { width: 100%;} input[type="checkbox"] { margin: 0px 0 0 .625rem;margin-top: .0625rem;line-height: normal;} } @media screen and (max-width: 320px) { #loginSlide { margin: 12% 2% 0;} #logo3 { margin: 2%; width:70%; height: 90%;} #navLinx ul li a { padding-left: 5%;} #navControl { float: right; width: 52px; height: 52px; margin: -20% 2% 0 0;} #plistBttns { width: 25%;} #selall { margin-right: .3125rem;} a[id^="btn"] { margin-left: -.9375rem;} } @media screen and (-webkit-min-device-pixel-ratio: 0) { audio { margin: 0; } }