@media screen and (max-width:1210px) {
.mainwrap {
padding: 0 20px;
}
.topmid {
border-radius: 0;
}
#footerwrap {
margin: 0 -20px;
border-radius: 0;
}
}
@media screen and (max-width:1000px) {
#headerwrap {
grid-template-columns: 45% 55%;
gap: 5px;
}
.menukanan .glyphicon-search {
display: inline-block;
}
#headerwrap .headmid {
display: none;
position: absolute;
width: 100%;
height: auto;
top: 100%;
z-index: 2;
padding: 10px 10px;
background: var(--colorlight);
}
.vid-container {
grid-template-columns: 50% 50%;
}
.product-container {
grid-template-columns: repeat(4, 1fr);
}
.ppreview {
max-width: 300px;
width: auto;
}
}
@media screen and (max-width:660px) {
.mainwrap {
padding: 0;
}
.maincontain,.singlecontain {
margin: 0;
border-radius: 0;
}
.profil {
display: block;
}
.foto {
float: left;
margin: 20px 20px 10px 0;
}
.imgcircle {
width: 150px;
height: 150px;
}
.biograp {
display: contents;
}
.vid-container {
grid-template-columns: 100%;
}
.product-container {
grid-template-columns: repeat(3, 1fr);
}
.ppreview {
max-width: 50%;
}
#footerwrap {
margin: 0;
} .popup iframe{
width: auto;
}
blockquote {
padding: 10px 10px 10px 50px;
}
.confused {
float: none;
margin: 10px auto;
display: block;
}
}
@media screen and (max-width:500px) {	
::-webkit-scrollbar {
display: none;
}
.product-container {
grid-template-columns: repeat(2, 1fr);
gap: 10px;
}
.blog-container {
grid-template-columns: repeat(1, 1fr);
gap: 10px;
}
.ppreview {
max-width: 400px;
margin: 0 auto;
float: none;
}
.zoomcover{
display: block;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
}
.zoomfull {
display: none;
}
.zoomhp {
display: inline-block;
}
.fwidgetwrap {
grid-template-columns: repeat(1, 1fr);
padding: 0 10px;
gap: 20px;
}
.footwidget {
margin-bottom: 15px;
}
.homefoot {
padding: 10px;
}
.copyright {
display: block;
text-align: center;
}
.katarsip select {
position: unset;
width: 100%;
margin-top: 20px;
}
}
@media screen and (max-width:420px) {	
#headerwrap {
grid-template-columns: repeat(1, 1fr);
height: 120px;
}
#headerwrap .headleft {
text-align: center;
padding: 0;
}
#headerwrap .headright {
background: var(--color2);
}
#containwrap {
padding-top: 170px;
}
.maincontain,.singlecontain {
padding: 10px;
}
.maintitle {
margin: -10px -10px 10px;
} .wareply {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
}
.wapop,.popup {
border-radius: 0;
}
.fancybox-content {
position: fixed;
top:0;
right:0;
left:0;
bottom: -8px;
}
.fancybox-container {
z-index: 1000000000 !important
}
#autopopup {
position: relative;
}
}
@media screen and (max-width:280px) {
.foto {
float: none;
display: block;
margin: 10px;
text-align: center;
}
.product-container {
grid-template-columns: repeat(1, 1fr);
}
}