@media screen and (max-width:1120px) {
.tophead,.navi {max-width:100%;}
.header {padding: 0 10px}
.jamkerja {margin-right: 10px}
.maincontain {
padding: 10px;
}
}
@media screen and (max-width:999px) {
.topcontact  span, .topmember span, .watitle span {
display:none;
} .togglemenu {
display: block;
}
#navicontent {
width: 300px;
height: calc(100% - 40px);
position: fixed;
top: 40px;
left: -300px;
background: var(--color1);
overflow: auto;
z-index: 3;
}
#navicontent > div {
background: rgb(0,0,0,0.1);
padding: 5px;
height: 100%;
}
.naviku>li {
float: none;
border-bottom: 1px solid #ffffff1c;
}
.naviku li a {
color: #FFF;
}
.naviku li li .parent {
background-position: 100% 50%;
}
.naviku ul {
display: block;
width: 100%;
border: none;
}
.naviku li ul {
background: none;
}
.naviku li li.hover ul,.naviku>li.hover>ul {
position: static;
}
.naviku li li{
border: none;
margin-left: 15px;
}
.naviku li li a {
padding: 4px 8px;
color: #FFF;
font-size: 95%;
}
.naviku ul li:last-child {
border-bottom: none;
}
.naviku li li:before {
content: '';
position: absolute;
top: 8px;
right: 100%;
width: 7px;
height: 7px;
border-bottom: 1px solid #DDD;
border-left: 1px solid #DDD;
} .newsticker li {
font-size: 12px;
} .sliderblock {
padding: 0 50px;
}
.slidertext h2 {
font-size: 120%;
}
.slidertext p {
font-size: 100%;
font-weight: 400;
}
.slidertext button {
font-weight: 400;
padding:3px 10px;
letter-spacing: normal;
font-size: 90%;
text-transform: none;
}
#slidprod, #slidblog, #slidfeat, #katspes {
width: calc(100% + 4px);
margin: -2px;
} .areafeed {
margin: 0 0 30px;
}
.gridpad {
padding: 2px;
}
.grid:hover, .gridblog:hover {
box-shadow: none;
}
.hargathumb {
font-size: 95%;
}
.boxview .zoomwrap {
width: 100%;
float: none;
}
.boxview #galeriview {
width: 100%;
white-space: nowrap;
margin-top: 5px;
height: 100px;
} #indexwrap .maincontain.testiwrap {
display: block;
padding: 15px;
}
.maintitle.testihome{
width:100%;
text-align: center;
}
#testi {
width:100%;
} .boxdetail .kolom1, .boxdetail .kolom2 {
width: 100%;
}
.boxdetail .kolom2 {
border: none;
padding: 0;
}
.boxdetail .kolom2:hover {
box-shadow: none;
}
}
@media screen and (max-width:640px) {
body {
background: #FFF;
} .topleft {
max-width: 25%;
}
.topright {
width: 75%;
}
.topmid {
display: none;
}
.topsearch {
display: inline-block;
}
#topmember,#rincian {
top:0;
right: 0;
bottom: 0;
width: 100%;
position: fixed;
max-height: 100%;
}
#rincian {
overflow: auto;
}
#rincian #jcart table tbody {
max-height: none;
} .headleft {
width: 100%;
text-align: center;
}
.headright {
display: none;
position: fixed;
top: 40px;
left: 0;
z-index: 2;
width: 100%;
padding: 0;
}
.headkat {
background: var(--color1);
}
.jamkerja {
width: 100%;
margin: 0;
} .sliderblock {
padding: 0;
}
.slidertext {
max-width: 100%;
height: 100%;
align-items: center;
display: grid;
font-size: 90%;
}
.megaslider .owl-controls .owl-page span {
width: 15px;
height: 15px;
}
.owl-buttons {
display: none;
} .why {
text-align: center;
padding: 7px;
}
.why img {
float: none;
margin: 0;
} .gridpad {
width: 33.33333%;
}
.gridpad:nth-child(4n+1){
clear: none;
}
.gridpad:nth-child(3n+1){
clear: left;
}
.gridblog p {
display: none;
}
.listview {
margin-bottom: 10px;
}
.listview p{
overflow: auto;
max-height: 70px;
} .testi {
padding: 10px;
} .footbarwidget {
width: 100%;
}
.socmed a {
width: 50%;
} .boxview, .boxdetail {
float: none;
width: 100%;
padding: 0;
}
.boxdetail {
border: none;
margin-top: 10px;
}
.zoomcover{
display: block;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
}
.zoomfull {
display: none;
}
.zoomhp {
display: inline-block;
} .avadiskusi,.avatesti {
width: 60px;
height: 60px;
} .viewform {
width: 100%;
float: none;
}
.wizard-card form {
margin: 0 0 200px;
padding: 0;
border: none;
}
.viewcart  {
width: 100%;
position: fixed;
bottom: 0;
left: 0;
z-index: 5;
border: none;
box-shadow: 0px 0px 10px 5px #0000001c;
max-height: 210px;
padding: 10px;
}
.voucher {
padding: 5px;
}
.voucher li {
width: 50%;
float: right;
}
.vouch {
margin: 0;
}
#dcart td {
padding: 2px;
font-size: 13px;
}
#dcart .trqty,#dcart .trberat, #dcart .headtitle, .wizard-navigation{
display: none;
} .boxpp {
display: none;
}
.boxinfo {
padding: 0;
width: 100%;
} ::-webkit-scrollbar {
display: none;
}
.tabmenu {
overflow: auto;
white-space: nowrap;
height: 40px;
border: none;
}
.popup,.invpop, .quickpop {
min-width: 280px;
width: auto;
font-size: 95%;
}
.dataTables_wrapper .dataTables_length {
width: 50%;
text-align: left;
float: left;
}
.dataTables_wrapper .dataTables_filter {
width: 50%;
text-align: right;
float: right;
margin-top: 0;
}
.banx {
display: grid;
width: 50%;
float: left;
}
.banx:nth-child(2n+1){
clear: both;
}
blockquote {
padding: 10px 10px 10px 50px;
}
}
@media screen and (max-width:420px) { .infomember{
width: 100%;
float: none;
}
.menumember {
min-width: 200px;
margin: 10px auto;
float: none;
background: #F9F9F9;
} .slidertext h2, .slidertext p {
font-size: 90%;
margin: 0;
}
.slidertext button {
display: none;
} .gridpad {
width: 50%;
}
.gridpad:nth-child(3n+1){
clear: none;
}
.gridpad:nth-child(2n+1){
clear: left;
} .socmed a {
display: flex;
align-items: center;
}
.socmed .small {
display: none;
}
.wali span {
display: none;
}
.wareply {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
}
.wareply input {
width: 70%;
}
.wareply button {
width: 30%;
}
.affstats li {
width: 50%;
}
.affstats li:nth-child(3n+1) {
clear: none;
}
.affstats li:nth-child(2n+1) {
clear: left;
}
.inv-filter {
border: none;
}
.inv-filter ul {
height: 42px;
overflow: auto;
white-space: nowrap;
}
.inv-filter ul li {
float: none;
display: inline-block;
}
.inv-filter ul li, .inv-filter .current, .inv-filter li:hover {
border-bottom: none;
}
.viewform .jcart-item-total {
display: none;
}
.banx {
width: 100%;
text-align: center;
}
.banx span:nth-child(1){
margin: 0 auto;
}
.oketable > tbody > tr > td:nth-child(2n+1) {
font-size: 90%;
margin-top: 10px;
padding-bottom: 0;
}
.oketable > tbody > tr > td:nth-child(1),.oketable > tbody > tr > td {
width: 100%;
display: block;
}
.regleft,.regright {
width: 100%;
float: none;
border: none;
padding: 0;
}
.captchay {
text-align: left;
padding-top: 0;
}
.invpop {
max-height:100%;
}
.fancybox-content {
position: fixed;
top:0;
right:0;
left:0;
bottom: -8px;
}
.fancybox-container {
z-index: 1000000000 !important
}
#autopopup {
position: relative;
}
}