Skip to content

Instantly share code, notes, and snippets.

@marisqaporter
Last active November 29, 2016 16:58
Show Gist options
  • Save marisqaporter/553f5080733748ad0e7149392972dac6 to your computer and use it in GitHub Desktop.
Save marisqaporter/553f5080733748ad0e7149392972dac6 to your computer and use it in GitHub Desktop.
hike image and padding fixes
@media only screen and (max-device-width: 480px) and (min-device-width: 320px)
.view-id-hike_single_page .views-field.views-field-field-features {
line-height: 32px;
margin-top: 315px;
padding-left: 20px;
}
@media only screen and (max-device-width: 480px) and (min-device-width: 320px)
.get-directions {
float: none;
right: 25px;
left: 15px;
margin-top: 812px;
text-align: center;
width: 90%;
}
@media only screen and (max-width: 480px) and (min-width: 320px)
.node-type-hike .gallery-block-detail {
background-color: #cc5500;
color: #fff;
height: 324px;
opacity: 1.0;
padding: 30px;
position: absolute;
top: 540px;
width: 100%;
/* right: 44px; */
}
@media only screen and (max-device-width: 480px) and (min-device-width: 320px)
.node-type-hike .gallery-block-detail {
right: 0px;
top: 540px;
width: 100%;
padding: 20px;
}
@media only screen and (max-width: 767px) and (min-width: 320px)
.node-type-hike .vt-commerce-image-wrapper .vt-commerce-image-large img, .node-type-destination .vt-commerce-image-wrapper .vt-commerce-image-large img, .node-type-park .vt-commerce-image-wrapper .vt-commerce-image-large img {
float: left;
height: 100% !important;
/* margin: -2px 6px 10px 0; */
width: auto !important;
max-width: 1240px !important;
padding: 0px !important;
margin-left: -47% !important;
}
@media only screen and (max-width: 480px)
.view-id-hike_single_page .hike-wrap, .view-destination-single-page .destination-wrap, .view-park-single-page .park-wrap {
left: 20px;
right: 20px;
}
.views-field-field-features p {
padding-left: 5px;
padding-right: 20px;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment