/* #Tablet (Portrait)
Note: Design for a width of 768px */
@media only screen and (min-width: 768px) and (max-width: 959px) {
/* Superfish Menu */
.sf-menu > li > a {
padding-left: 14px;
padding-right: 14px;
}
/* Post Loop */
.post-loop li {
width: 172px;
height: 164px;
}
.post-loop .post-caption {
padding: 12px;
}
.post-excerpt {
overflow: hidden;
}
/* #Sliders
================================================== */
/* #Flexslider
-------------------------------------------------- */
.slider,
.flexslider {
height: 286px;
}
.flex-caption {
top: 35%;
}
.flex-caption h2 {
font-size: 26px;
}
.flex-caption h2 strong {
font-size: 32px;
padding-left: 30px;
}
/* #Revolution Slider
-------------------------------------------------- */
.banner,
.bannercontainer {
width:748px;
height:286px;
}
/* Latest Posts */
.latest-posts-holder .featured-thumb {
height: auto;
}
.latest-posts-holder .featured-thumb,
.latest-posts-holder .featured-thumb a {
max-width: 172px;
}
/* Carousel */
.elastislide-horizontal ul li {
margin: 0 8px;
}
/* #Widgets
================================================== */
/* Ad Spots */
.ad-holder li {
margin: 0 10px 10px 0;
}
.ad-holder li a {
display: block;
width: 95px;
height: 95px;
padding: 9px;
}
/* Pricing Grid
-------------------------------------------------- */
/* 4 cols */
.pricing-tables.four-cols .pricing-column {
width:186px;
}
/* 3 cols */
.pricing-tables.three-cols .pricing-column {
width:248px;
}
/* Blog Page
-------------------------------------------------- */
/* Gallery Post Format */
.entry__gallery .flexslider {
height: auto;
}
/* Contact Page
-------------------------------------------------- */
/* Google Map */
#map_canvas {
height:246px;
}
}
/* #Mobile (Portrait)
Note: Design for a width of 320px */
@media only screen and (max-width: 767px) {
/* #Header
================================================== */
/* Header */
#header .grid_12 {
margin-bottom: 0;
}
/* Header Top */
.header-top {
padding: 8px 0 12px 0;
}
/* Top Menu */
.header-top-menu {
float: none;
overflow: hidden;
padding: 0 0 10px 12px;
text-align: center;
}
.header-top-menu li {
float: none;
display: inline;
}
/* Navigation */
nav.primary .sf-menu {
display:none;
}
/* Social Links */
.social-links {
float: none;
overflow: hidden;
width: 100%;
text-align: center;
}
.social-links li {
float: none;
display: inline-block;
overflow: hidden;
margin-left: 6px;
vertical-align: top;
}
/* Logo */
#logo {
float: none;
text-align: center;
}
/* Vertical Tabs */
.tabs__vertical .tab-menu ul {
margin: 0;
border-bottom: 1px solid #eb593c;
border-right: none;
}
/* Footer */
#footer [class^="grid_"]:last-child {
margin-bottom: 0;
}
.copyright-primary,
.copyright-secondary {
float: none;
text-align: center;
}
.copyright .grid_12 {
margin-bottom: 0;
}
/* #Sliders
================================================== */
#slider .grid_12 {
margin-bottom: 0;
}
/* #Flexslider
-------------------------------------------------- */
.slider,
.flexslider {
height: 115px;
}
/* Direction Nav */
.flex-direction-nav {
display: none;
}
/* Control Nav */
.flex-control-paging li a {
width: 18px;
height: 18px;
font-size: 10px;
line-height: 18px;
}
.flex-caption {
left: 15px;
top: 30%;
}
.flex-caption h2 {
font-size: 15px;
}
.flex-caption h2 strong {
font-size: 17px;
padding-left: 10px;
}
/* #Revolution Slider
-------------------------------------------------- */
.banner,
.bannercontainer {
width:300px;
height:115px;
}
.tparrows {
display: none;
}
/* #Content
================================================== */
.page-title .grid_12 {
margin-bottom: 0;
}
.content-wrapper {
padding-bottom: 30px;
}
/* Post Loop */
.post-loop {
margin-bottom: -40px;
overflow: hidden;
}
.post-loop li {
width: 145px;
height: 138px;
margin: 0 10px 10px 0;
}
.post-loop .post-img {
opacity: 1;
}
.post-loop li:nth-child(2n) {
margin-right: 0;
}
.post-loop .post-caption {
padding: 10px;
}
/* Latest Posts */
.latest-posts-holder .featured-thumb {
max-width: 145px;
overflow: hidden;
margin: 0 10px 12px 0;
height: auto;
}
.latest-posts-holder .post-meta span {
display: block;
margin-bottom: 2px;
}
.latest-posts-holder .post-excerpt {
clear: both;
}
.latest-posts-holder .post-header h3 {
font-size: 14px;
}
/* Post Navigation */
.post-nav {
padding-bottom: 20px;
}
/* Sidebar Bottom */
.sidebar__bottom {
padding-top: 0;
}
/* About Page
-------------------------------------------------- */
/* Team */
.team-img {
float: left;
margin-right: 20px;
width: 40%;
}
.team-holder hgroup {
overflow: hidden;
}
.team-excerpt {
overflow: hidden;
max-height: 4.5em
}
.team-holder .social-links {
float: left;
text-align: left;
}
/*/ Team */
/* #Sidebar
================================================== */
.sidebar {
margin-bottom: 0 !important;
}
/* Pricing Grid
-------------------------------------------------- */
.single-pricing-table {
margin: 0 0 30px 0;
}
.single-pricing-table.active {
margin: 0 0 30px 0;
}
/* 4 cols */
.pricing-tables.four-cols .pricing-column {
width:100%;
margin-left:0;
}
/* 3 cols */
.pricing-tables.three-cols .pricing-column {
width:100%;
margin-left:0;
}
/* #Misc
================================================== */
.tabs__vertical .tab-menu {
margin-bottom: 0 !important;
}
/* Carousel */
.elastislide-carousel ul li a {
opacity: 1;
}
.elastislide-wrapper nav span {
width: 24px;
}
.elastislide-horizontal ul li {
margin: 0;
}
/* Horizontal Rule */
.grid_1 .hr,
.grid_2 .hr,
.grid_3 .hr,
.grid_4 .hr,
.grid_5 .hr,
.grid_6 .hr,
.grid_7 .hr,
.grid_8 .hr,
.grid_9 .hr,
.grid_10 .hr,
.grid_11 .hr,
.grid_12 .hr {
margin-left: 0;
margin-right: 0;
}
.hide-on-phone {
display: none;
}
/* Blog Page
-------------------------------------------------- */
/* Gallery Post Format */
.entry__gallery .flexslider {
height: auto;
}
/* Post
-------------------------------------------------- */
/* Comments */
.commentlist .children {
padding:0;
background:none;
}
/* Comment Form */
.comment-form {
margin-bottom: 30px;
}
.comment-form .field {
overflow:hidden;
margin-bottom:0;
}
.comment-form .field input,
.comment-form .field textarea {
margin-bottom:18px;
width: 100%;
}
/* Projects
-------------------------------------------------- */
.project-feed-filter {
padding-bottom: 15px;
float: left;
}
.project-feed-filter li {
margin: 0 0 0 5px;
}
.project-feed-filter li:first-child {
margin-left: 0;
}
.project-feed-filter a {
padding: 3px 8px;
}
/* Contact Page
-------------------------------------------------- */
/* Google map */
.map-wrapper {
margin-bottom:0;
}
#map_canvas {
height:200px;
}
.contact-form .field input,
.contact-form .field textarea {
margin-bottom:18px;
width: 100%;
}
/* prettyPhoto styling for small screens */
.pp_pic_holder.pp_default { width: 100%!important; left: 0!important; overflow: hidden; }
div.pp_default .pp_content_container .pp_left { padding-left: 0!important; }
div.pp_default .pp_content_container .pp_right { padding-right: 0!important; }
.pp_content { width: 100%!important; height: auto!important; }
.pp_fade { width: 100%!important; height: 100%!important; }
a.pp_expand, a.pp_contract, .pp_hoverContainer, .pp_gallery, .pp_top, .pp_bottom { display: none!important; }
#pp_full_res img { width: 100%!important; height: auto!important; }
.pp_details { width: 94%!important; padding-left: 3%; padding-right: 4%; padding-top: 10px; padding-bottom: 10px; background-color: #fff; margin-top: -2px!important; }
a.pp_close { right: 10px!important; top: 10px!important; }
}
/* #Mobile (Landscape)
Note: Design for a width of 480px */
@media only screen and (min-width: 480px) and (max-width: 767px) {
/* Flickr Widget */
.flickr-widget .thumb:nth-child(4n) {
margin-right: 4px;
}
.flickr-widget .nomargin {
margin-right: 4px;
}
/* #Sliders
================================================== */
/* #Flexslider
-------------------------------------------------- */
.slider,
.flexslider {
height: 161px;
}
.flex-caption {
left: 25px;
top: 32%;
}
.flex-caption h2 {
font-size: 18px;
}
.flex-caption h2 strong {
font-size: 22px;
padding-left: 20px;
}
/* #Revolution Slider
-------------------------------------------------- */
.banner,
.bannercontainer {
width:420px;
height:161px;
}
/* #Content
================================================== */
/* Post Loop */
.post-loop {
margin-bottom: -40px;
overflow: hidden;
}
.post-loop li {
width: 200px;
height: 191px;
margin: 0 20px 20px 0;
}
/* Latest Posts */
.latest-posts-holder .featured-thumb {
margin: 0 20px 10px 0;
}
.latest-posts-holder .featured-thumb,
.latest-posts-holder .featured-thumb a {
max-width: 200px;
float: left;
}
.latest-posts-holder .post-meta span {
margin-bottom: 4px;
}
.latest-posts-holder .post-header h3 {
font-size: 15px;
margin-bottom: 1em;
}
/* About Page
-------------------------------------------------- */
/* Team */
.team-img {
}
.team-holder hgroup {
}
.team-holder .social-links {
float: none;
}
/*/ Team */
/* #Widgets
================================================== */
/* Ad Spots */
.ad-holder li {
margin: 0 5px 5px 0;
}
.ad-holder li:nth-child(even) {
margin-right: 5px;
}
.ad-holder li:nth-child(4n) {
margin-right: 0;
}
.ad-holder li a {
display: block;
width: 85px;
height: 85px;
padding: 8px;
}
}