Team:SCUT/CSS/responsive.css
/*
- Responsive layout for Line - 7th of September 2012
- /
.select-menu { color:#999; }
.select-menu { display:none; }
@media only screen and (max-width:767px) { .logo a { left: 50%; margin-left: -90px; } }
/* Table of Contents
======================================
#Mobile - 240px #Mobile - 320px #Mobile - 480px
#Tablet - 768px */
/* #Mobile - 240px
================================================== */
@media only screen and (max-width: 319px) {
.one-half { width: 220px; } .one-third { width: 220px; } .two-third { width: 220px; } .one-fourth { width: 220px; } .three-fourth { width:220px; } .one-sixth { width: 220px; } .five-sixth { width: 220px }
.one-fourth, .one-half, .two-third, .one-third, .three-fourth, .one-sixth, .five-sixth { position: relative; clear:both; float: left; margin-right:0; margin-bottom:20px; }
.percent-one-half { width: 220px; } .percent-one-third { width: 220px; } .percent-two-third { width: 220px; } .percent-one-fourth { width: 220px; } .percent-three-fourth { width: 220px; } .percent-one-fifth { width: 220px; } .percent-two-fifth { width: 220px; } .percent-three-fifth { width: 220px; } .percent-four-fifth { width: 220px; } .percent-one-sixth { width: 220px; } .percent-five-sixth { width: 220px; }
.percent-one-half, .percent-one-third, .percent-two-third, .percent-three-fourth, .percent-one-fourth, .percent-one-fifth, .percent-two-fifth, .percent-three-fifth, .percent-four-fifth, .percent-one-sixth, .percent-five-sixth { position: relative; margin-right: 0; float: left; min-height:1px; margin-bottom:20px; }
#posts img { width: 100%; height: auto; }
.homepage-services { width:100%; }
html #wrapper { width:240px; margin:0 auto; }
html #header { width:220px;
}
html #footer { width:240px; }
#header .one-fourth { width:240px; }
.centered-wrapper { width:220px; padding:0 10px; }
.logo { text-align: center; }
.logo img { display:inherit; margin:0 auto; top:25px; position:relative; }
#navigation { float:none; margin-bottom:30px; margin-top: 20px; }
ul#mainnav { display:none; }
.select-menu { display:block; clear:both; margin:5px auto; padding:5px 10px; width:200px; } .tparrows { display:none; }
.tp-bullets { display:none; }
.box-slide1, .box-slide2, .title_text, .description_text { display:none; }
.intro { padding: 45px 0; width: 220px; } .intro h2 { line-height:36px; } .intro h5 { line-height: 24px; margin-bottom: 15px; }
h3.service { margin-bottom:10px; }
.service-item { margin-bottom:25px; border-bottom:1px solid #efefef; }
#topfooter h3 { margin-bottom:10px; }
#topfooter .one-fourth { margin-bottom:30px; }
#bottomfooter { height:auto; line-height:auto; padding-top:30px; }
#bottomfooter p { line-height:24px; }
#bottomfooter #social { margin:10px 0 0 !important; }
#flickr li { margin: 0 10px 9px 0; }
#bottomfooter p { float: none; text-align: center; }
ul#social { float: none; text-align: center; margin-bottom:30px; }
ul#social li { display: inline-block; }
.jcarousel-container-horizontal { width: 220px; clear: both; margin-left: 0px; height:auto !important; }
.jcarousel-clip-horizontal { width: 220px; height: auto; }
.jcarousel-item { width: 220px; height: 180px; display: block; position: relative; background: white; }
#homeblog-carousel .blog-carousel-details { padding-top:10px; }
#homeblog-carousel .jcarousel-item { width:220px; height:auto !important; } #homeblog-carousel .jcarousel-container-horizontal { height:auto; }
#homeblog-carousel .blog-carousel-details { clear:both; }
.jcarousel-item img, #homeblog-carousel .jcarousel-item img { width:100%; }
span.caption { line-height:34px; }
.page-title { width: 240px; padding: 0 0 10px; margin:0; }
.page-background { display:none; }
.title-wrapper { width:100%; height:auto; box-shadow:none; padding:0; margin-bottom:30px; }
.title-bg, .title-content { width:100%; padding:0; margin:0; position:relative; clear:both; top:0; height:auto; overflow:hidden; } .title-content { padding:5%; width:90% !important; } .title-wrapper .one-third { margin:0; }
.top-shadow, .bottom-shadow { display:none; }
.portfolio-nav { overflow:hidden; float:none; text-align:center; }
.portfolio-nav a { float:none; display:inline-block; text-align:center; margin:0 5px; }
#skills .skill { width:60%; } #skills h2 { right:10px; }
.search-form { display:none; }
.page-title h2 { margin-bottom:33px; text-align:center; }
.pricing-column { width:220px; margin-bottom:20px; }
.package-value, .package-features, .signup { border-left:1px solid #DBDBDB; }
.normal-table { overflow:hidden; width: 220px; display: block; }
.t-page .testimonial-item { width:180px !important; }
ul#testimonials-carousel .testimonial-item { width:180px; }
li.table-6 { width:100%; float:left; }
li.table-5 { width:100%; float:left; } li.table-4 { width:100%; float:left; }
li.table-3 { width:100%; float:left; }
li.table-2 { width:100%; float:left; }
.column-body ul li { border-right: 1px solid #efefef; }
.column .column-header { border-left: 0 none; border-top: 1px solid #EFEFEF; }
.column { margin-top:20px; }
.pricing-table .last-column .column-header, .pricing-table .last-column .column-body ul { border-right: 0 none; }
.pricing-table .no-border { display: none; }
.team-details { float: none; margin-right: 0; width: auto; text-align: center; }
.team-avatar { float: none; width: 100%; text-align:center; }
pre, code { white-space: normal; }
.team-twitter, .team-facebook, .team-linkedin { float: none; }
.team-text h3 { text-align:center; }
h1 { font-size:24px; line-height:30px; margin-bottom:13px; }
h2 { font-size:18px; line-height:24px; margin-bottom:20px; }
h3 { font-size:16px; line-height:22px; }
h4 { font-size:12px; line-height:20px; }
.space { height:40px; }
.toggle-view h3 { padding: 7px 20px 7px 10px; }
blockquote { font-size: 14px; font-style: italic; line-height:24px; margin: 10px 20px; padding: 0 0 5px 10px; }
ul.tabs li a { padding:0 10px; }
ul#filters { overflow:hidden; float: none; clear: both; text-align: center; margin-top: 0px; }
ul#filters li { display: inline; margin: 0 1px 3px 0; float: left; } ul#filters li a { padding:5px 10px; } #portfolio-wrapper .four-columns li, #portfolio-wrapper .three-columns li, #portfolio-wrapper .two-columns li { width: 220px; }
#portfolio-wrapper .four-columns img, #portfolio-wrapper .three-columns img, #portfolio-wrapper .two-columns img { width: 100%; height: auto; } #portfolio-wrapper .four-columns li, #portfolio-wrapper .three-columns li, #portfolio-wrapper .two-columns li { height:263px !important; }
.portfolio li.item-wide, .portfolio li.item-wide img { width:220px !important; height:178px !important; } .portfolio li.item-wide h1 { font-size:20px; line-height:28px; } .portfolio li.item-long, .portfolio li.item-long img { width:220px !important; height:85px !important; }
.portfolio li.item-long h1 { font-size:14px; }
#posts .pagenav { margin-bottom:50px; }
.slides_container { width:220px; }
.slides_container div.slide { width:220px; }
#slides .caption { display:none; }
.portfolio-gallery { width:220px; } .portfolio-gallery img { width:220px; } .gallery-page { width:220px; } .gallery-page li { width:220px; margin:0 20px 10px 0; clear:both; } .gallery-page img { width:220px; } #masonry-blog { width:220px; } .columns-two .masonry-post, .columns-three .masonry-post { width:220px; } .masonry-page-content { padding:10px; }
.masonry-page-content i, #blog-page i, .post-content i { display:none; } #masonry-blog .vimeo-article iframe, #masonry-blog .vimeo-article embed, .post iframe { width:220px !important; height:auto !important; } .columns-two .slides_container, .columns-three .slides_container { height:115px !important; } div.jp-audio div.jp-type-single div.jp-progress, div.jp-duration { display:none; } span.pages { display:none; } .post .slides_container .slide { height:115px !important; width:220px; } .post .slides_container { height:115px !important; width:220px; }
.slide iframe, .slide embed { width:220px; height:auto; }
.slides_container div.slide img { width:220px; height:auto; }
.pagination { bottom:20px; }
.single-portfolio-nav { overflow:hidden; margin-bottom:30px; }
body.single-portfolio #crumbs { display:none; }
#posts { width:220px; margin-right:0px; }
.post-thumbnail img { width:220px; height:auto; } .video-thumbnail iframe, .video-thumbnail embed { width:220px; height:auto; }
.meta { clear:both; width:220px; margin-right:0px; border-bottom:1px solid #efefef; padding-bottom:10px; margin-bottom:10px; }
.meta p { float:left; margin-right:20px; }
.excerpt { clear:both; width:220px; float:none; }
#sidebar { width:220px; }
#posts .post-content img {
width:100%;
height:auto;
margin-bottom:10px;
}
.next-prev-posts .previous-post, .next-prev-posts .next-post {
width:100%;
}
.author-bio { padding:15px; }
.authorp { width:100%; }
.authorp h2 { font-size:14px; }
.author-bio img { margin: 0 15px 0 0; } .commentwrap { margin: 0 0 0 80px; }
#commentform { width:220px; }
#commentform input[type="text"], #commentform textarea, .contactform input[type="text"] { width: 198px; padding: 5px 10px; font-size: 12px; }
.contactform input[type="submit"] { width:220px; }
#posts .avatar img { width:60px; height:60px; }
.contact-map iframe { width:220px; }
.post img { width:220px; height:auto; }
#posts .author-bio img { width:60px; height:60px; } .contact-info { margin-bottom:30px; }
.single-post .widget { margin-top:40px; margin-bottom:0px; }
.separator { width:100%; height:1px; clear:both; margin:30px 0; display:inline-block; }
.double-separator { width:100%; height:1px; clear:both; margin:30px 0; }
#footer .double-separator { margin:40px 0; }
#topfooter .one-third { margin-bottom:30px; }
#bottomfooter { margin-top:10px; }
ul#home-filters { position:relative; overflow:hidden; margin-bottom:20px; }
ul#home-filters a { padding:5px 15px; margin:0 2px 2px; }
ul#social { margin:30px 0 10px; }
.contact-map iframe { width:220px; height:200px; }
.clients li { padding:0; border:0; }
.one-page #header { height:86px; width:240px; }
.one-page .top-shadow, .one-page .bottom-shadow { display:none !important; } .one-page .select-menu { display:none; }
.one-page .onepage-title { font-size: 24px; font-weight: 300; margin-bottom: 20px; line-height: 30px; }
}
/* #Mobile - 320px
================================================== */
@media only screen and (min-width: 320px) and (max-width: 479px) {
.one-half { width: 300px; } .one-third { width: 300px; } .two-third { width: 300px; } .one-fourth { width: 300px; } .three-fourth { width:300px; } .one-sixth { width: 300px; } .five-sixth { width: 300px }
.one-fourth, .one-half, .two-third, .one-third, .three-fourth, .one-sixth, .five-sixth { position: relative; clear:both; float: left; margin-right:0; margin-bottom:20px; }
.percent-one-half { width: 300px; } .percent-one-third { width: 300px; } .percent-two-third { width: 300px; } .percent-one-fourth { width: 300px; } .percent-three-fourth { width: 300px; } .percent-one-fifth { width: 300px; } .percent-two-fifth { width: 300px; } .percent-three-fifth { width: 300px; } .percent-four-fifth { width: 300px; } .percent-one-sixth { width: 300px; } .percent-five-sixth { width: 300px; }
.percent-one-half, .percent-one-third, .percent-two-third, .percent-three-fourth, .percent-one-fourth, .percent-one-fifth, .percent-two-fifth, .percent-three-fifth, .percent-four-fifth, .percent-one-sixth, .percent-five-sixth { position: relative; margin-right: 0; float: left; min-height:1px; margin-bottom:20px; }
.homepage-services { width:100%; }
.page-template-default #posts img { width: 100%; height: auto; }
html #wrapper { width:320px; margin:0 auto; }
html #header { width:300px;
}
html #footer { width:320px; }
#header .one-fourth { width:320px; }
.centered-wrapper { width:300px; padding:0 10px; }
.logo { text-align: center; }
.logo img { display:inherit; margin:0 auto; top:25px; position:relative; }
#navigation { float:none; margin-bottom:30px; margin-top: 20px; }
ul#mainnav { display:none; }
.select-menu { display:block; clear:both; margin:5px auto; padding:5px 10px; width:240px; } .tparrows { display:none; }
.tp-bullets { display:none; }
.box-slide1, .box-slide2, .title_text, .description_text { display:none; }
.intro h2 { line-height:36px; } .intro h5 { line-height: 24px; margin-bottom: 15px; }
#bottomfooter { height:auto; line-height:auto; padding-top:30px; }
#bottomfooter p { line-height:24px; }
#bottomfooter #social { margin:10px 0 0 !important; }
#flickr li { margin: 0 10px 9px 0; }
#bottomfooter p { float: none; text-align: center; }
ul#social { float: none; text-align: center; margin-bottom:30px; }
ul#social li { display: inline-block; }
.slider-wrapper { height:auto; }
.intro { padding: 55px 10px; width: 280px; }
h3.service { margin-bottom:10px; }
.service-item { margin-bottom:25px; border-bottom:1px solid #efefef; }
#topfooter h3 { margin-bottom:10px; }
.jcarousel-container-horizontal { width: 300px; clear: both; margin-left: 0px; height:auto !important; }
.jcarousel-clip-horizontal { width: 300px; height: auto; }
.jcarousel-item { width: 300px; height: 245px; display: block; position: relative; background: white; }
#portfolio-carousel .jcarousel-item { width:300px; height:auto !important; }
#homeblog-carousel .blog-carousel-details { padding-top:10px; }
#homeblog-carousel .jcarousel-item { width:300px; height:auto !important; } #homeblog-carousel .jcarousel-container-horizontal { height:auto; }
#homeblog-carousel .blog-carousel-details { clear:both; width:300px; margin-top:10px; }
.jcarousel-item img, #homeblog-carousel .jcarousel-item img { width:100%; }
#homeblog-carousel .jcarousel-item > a { width:300px; }
.page-title { width: 320px; padding: 0 0 10px; margin:0; }
.page-background { display:none; }
.title-wrapper { width:100%; height:auto; box-shadow:none; padding:0; margin-bottom:30px; }
.title-bg, .title-content { width:100%; padding:0; margin:0; position:relative; clear:both; top:0; height:auto; overflow:hidden; } .title-content { width: 300px; padding: 10px 10px; } .title-wrapper .one-third { margin:0; }
.top-shadow, .bottom-shadow { display:none; }
pre, code {
white-space: normal;
}
.search-form {
display:none;
}
.page-title h2 { margin-bottom:33px; text-align:center; }
.pricing-column { width:300px; margin-bottom:20px; }
.package-value, .package-features, .signup { border-left:1px solid #DBDBDB; }
.normal-table { overflow: hidden; width: 300px; display: block; }
.t-page .testimonial-item { width:260px !important; }
ul#testimonials-carousel .testimonial-item { width:260px; }
li.table-6 { width:100%; float:left; }
li.table-5 { width:100%; float:left; }
li.table-4 { width:100%; float:left; }
li.table-3 { width:100%; float:left; }
li.table-2 { width:100%; float:left; }
.column-body ul li { border-right: 1px solid #efefef; }
.column .column-header { border-left: 0 none; border-top: 1px solid #EFEFEF; }
.column { margin-top:20px; }
.pricing-table .last-column .column-header, .pricing-table .last-column .column-body ul { border-right: 0 none; }
.pricing-table .no-border { display: none; }
ul#filters { overflow:hidden; float: none; clear: both; text-align: center; margin-top: 0; }
ul#filters li { display: inline; margin: 0 1px 3px 0; float: left; } ul#filters li a { padding:5px 10px; }
.portfolio li.item-wide, .portfolio li.item-wide img, .portfolio li.item-small, .portfolio li.item-small img { width:300px !important; height:245px !important; } .portfolio li.item-high, .portfolio li.item-high img { width:300px !important; height:513px !important; } .portfolio li.item-wide h1 { font-size:20px; line-height:28px; } .portfolio li.item-long, .portfolio li.item-long img { width:300px !important; height:116px !important; }
.portfolio li.item-long h1 { font-size:18px; } #portfolio-wrapper .four-columns li, #portfolio-wrapper .three-columns li, #portfolio-wrapper .two-columns li { width: 300px; height:328px; }
#portfolio-wrapper .four-columns img, #portfolio-wrapper .three-columns img, #portfolio-wrapper .two-columns img { width: 100%; height: auto; }
.portfolio-nav { overflow:hidden; float:none; text-align:center; }
.portfolio-nav a { float:none; display:inline-block; text-align:center; margin:0 5px; }
.slides_container { width:300px; }
.slides_container div.slide { width:300px; }
#slides .caption { display:none; }
.slide iframe, .slide embed { width:300px; height:auto; }
.slides_container div.slide img { width:300px; height:auto; }
.slides_container {
width:300px;
}
.slides_container div.slide { width:300px; }
#slides .caption { display:none; }
.portfolio-gallery { width:300px; } .portfolio-gallery img { width:300px; } .gallery-page { width:300px; } .gallery-page li { width:300px; margin:0 20px 10px 0; clear:both; } .gallery-page img { width:300px; }
.pagination { bottom:20px; }
.single-portfolio-nav { overflow:hidden; margin-bottom:30px; }
#masonry-blog { width:300px; } .columns-two .masonry-post, .columns-three .masonry-post { width:300px; } .masonry-page-content { padding:10px; }
.masonry-page-content i, #blog-page i, .post-content i { display:none; } #masonry-blog .vimeo-article iframe, #masonry-blog .vimeo-article embed, .post iframe { width:300px !important; height:auto !important; } .columns-two .slides_container, .columns-three .slides_container { height:157px !important; } div.jp-duration { display:none; } div.jp-audio div.jp-type-single div.jp-progress { width: 25% !important; left: 34% !important; }
.next-prev-posts .previous-post, .next-prev-posts .next-post { width:100%; }
#flickr { width:300px; }
.inner-blog-gallery { overflow:hidden; margin-bottom:30px; width:331px; }
.inner-blog-gallery img { width:145px !important; height:145px !important; }
span.pages { display:none; } .post .slides_container .slide { height:157px !important; width:300px; } .post .slides_container { height:157px !important; width:300px; }
.slide iframe, .slide embed { width:300px; height:auto; }
.slides_container div.slide img { width:300px; height:auto; }
#posts {
width:300px;
margin-right:0px;
}
.post-thumbnail img { width:290px; height:auto; }
.video-thumbnail iframe, .video-thumbnail embed { width:300px; height:auto; }
.widget { margin-bottom:0; margin-top:30px; }
.meta { clear:both; width:300px; margin-right:0px; border-bottom:1px solid #efefef; padding-bottom:10px; margin-bottom:10px; }
.meta p { float:left; margin-right:20px; }
.meta span { margin-right:16px; }
.excerpt { clear:both; width:300px; float:none; }
#sidebar { width:300px; }
.post .post-content img { width:290px; height:auto; margin-bottom:10px; }
.author-bio { padding:15px; }
.authorp { width:185px; }
.authorp h2 { font-size:14px; }
.author-bio img { margin: 0 15px 0 0; }
#posts .avatar img { width:60px; height:60px; }
#commentform { width:300px; }
#commentform input[type="text"] { width: 278px; padding: 5px 10px; font-size: 12px; } #commentform textarea { width:278px; padding: 5px 10px; }
.contact-info { margin-bottom:30px; }
.contact-map iframe { width:300px; }
.post img { width:290px; height:auto; }
.single-post .widget { margin-top:40px; margin-bottom:0px; }
#posts .author-bio img { width:60px; height:60px; }
#posts .pagenav { margin-bottom:50px; }
#topfooter .one-third { margin-bottom:30px; }
#bottomfooter { margin-top:10px; }
ul#home-filters { position:relative; overflow:hidden; margin-bottom:20px; }
ul#home-filters a { padding:5px 15px; margin:0 2px 2px; }
ul#social { margin:30px 0 10px; }
.contact-map iframe { width:300px; height:200px; }
.clients li { padding:0; border:0; }
.one-page #header { height:86px; width:320px; }
.one-page .top-shadow, .one-page .bottom-shadow { display:none !important; } .one-page .select-menu { display:none; }
}
/* #Mobile - 480px
================================================== */
@media only screen and (min-width: 480px) and (max-width: 767px) {
.one-half { width: 460px; } .one-third { width: 460px; } .two-third { width: 460px; } .one-fourth { width: 460px; } .three-fourth { width:460px; } .one-sixth { width: 460px; } .five-sixth { width: 460px }
.one-fourth, .one-half, .two-third, .one-third, .three-fourth, .one-sixth, .five-sixth { position: relative; clear:both; float: left; margin-right:0; margin-bottom:20px; }
.percent-one-half { width: 460px; } .percent-one-third { width: 460px; } .percent-two-third { width: 460px; } .percent-one-fourth { width: 460px; } .percent-three-fourth { width: 460px; } .percent-one-fifth { width: 460px; } .percent-two-fifth { width: 460px; } .percent-three-fifth { width: 460px; } .percent-four-fifth { width: 460px; } .percent-one-sixth { width: 460px; } .percent-five-sixth { width: 460px; }
.percent-one-half, .percent-one-third, .percent-two-third, .percent-three-fourth, .percent-one-fourth, .percent-one-fifth, .percent-two-fifth, .percent-three-fifth, .percent-four-fifth, .percent-one-sixth, .percent-five-sixth { position: relative; margin-right: 0; float: left; min-height:1px; margin-bottom:20px; }
.page-template-default #posts img { width: 100%; height: auto; }
.homepage-services { width:100%; }
html #wrapper { width:480px; margin:0 auto; }
html #header { width:460px;
}
html #footer { width:480px; }
#header .one-fourth { width:480px; }
.centered-wrapper { width:460px; padding:0 10px; }
.logo { text-align: center; position: relative; }
.logo img { position:relative; display:inline-block; margin-top:25px; }
#navigation { float:none; margin-bottom: 30px }
ul#mainnav { display:none; }
.select-menu { display:block; clear:both; margin:5px auto; padding:5px 10px; width:360px; } .tparrows { display:none; }
.tp-bullets { display:none; }
.box-slide1, .box-slide2, .title_text, .description_text { display:none; }
.intro h2 { line-height:36px; margin-bottom:25px; } .intro h5 { line-height: 28px; margin-bottom: 15px; }
#bottomfooter { height:auto; line-height:auto; padding-top:30px; }
#bottomfooter p { line-height:24px; }
#bottomfooter #social { margin:10px 0 0 !important; }
#flickr li { margin: 0 10px 9px 0; }
#bottomfooter p { float: none; text-align: center; }
ul#social { float: none; text-align: center; margin-bottom:30px; }
ul#social li { display: inline-block; }
.slider-wrapper { height:auto; }
.intro { padding: 45px 0; }
h3.service { margin-bottom:10px; }
ul#home-filters { position:relative; overflow:hidden; margin-bottom:20px; }
ul#home-filters a { padding:5px 15px; }
.service-item { margin-bottom:25px; border-bottom:1px solid #efefef; }
.jcarousel-container-horizontal { clear: both; width:460px; }
.jcarousel-clip-horizontal { width: 460px;
}
.jcarousel-item { width:207px; height:140px; }
.jcarousel-item img { width: 100%; }
.featured-sidebar { width:460px; margin-bottom:50px; text-align:center; }
.featured-sidebar ul li { background:none !important; width:460px; }
.featured-sidebar ul li a { width:440px !important; }
.page-title { width: 480px; padding: 0 0 10px; margin:0; }
.page-background { display:none; }
.title-wrapper { width:100%; height:auto; box-shadow:none; padding:0; margin-bottom:30px; }
.title-bg, .title-content { width:100%; padding:0; margin:0; position:relative; clear:both; top:0; height:auto; overflow:hidden; } .title-content { width: 460px; padding: 10px 10px; } .title-wrapper .one-third { margin:0; }
.top-shadow, .bottom-shadow { display:none; }
.portfolio-nav { overflow:hidden; float:none; text-align:center; }
.portfolio-nav a { float:none; display:inline-block; text-align:center; margin:0 5px; }
pre, code { white-space: normal; }
.search-form { display:none; }
.page-title h2 { margin-bottom:33px; text-align:center; }
.pricing-column { width:460px; margin-bottom:20px; }
.package-value, .package-features, .signup { border-left:1px solid #DBDBDB; }
.normal-table { overflow: hidden; width: 460px; display: block; }
.t-page .testimonial-item { width:420px !important; }
ul#testimonials-carousel .testimonial-item { width:420px; }
li.table-6 { width:100%; float:left; }
li.table-5 { width:100%; float:left; }
li.table-4 { width:100%; float:left; }
li.table-3 { width:100%; float:left; }
li.table-2 { width:100%; float:left; }
.column-body ul li { border-right: 1px solid #efefef; }
.column .column-header { border-left: 0 none; border-top: 1px solid #EFEFEF; }
.column { margin-top:20px; }
.pricing-table .last-column .column-header, .pricing-table .last-column .column-body ul { border-right: 0 none; }
.pricing-table .no-border { display: none; }
ul#filters {
overflow:hidden;
float: none;
clear: both;
text-align: center;
margin-top: 0;
}
ul#filters li { display: inline; margin: 0 1px 3px 0; float: left; } ul#filters li a { padding:5px 10px; }
#portfolio-wrapper .four-columns li, #portfolio-wrapper .three-columns li, #portfolio-wrapper .two-columns li { width: 220px; }
#portfolio-wrapper .four-columns img, #portfolio-wrapper .three-columns img, #portfolio-wrapper .two-columns img { width: 100%; height: auto; } #portfolio-wrapper .four-columns li, #portfolio-wrapper .three-columns li, #portfolio-wrapper .two-columns li { height:263px !important; }
.portfolio li.item-wide, .portfolio li.item-wide img { width:220px !important; height:178px !important; } .portfolio li.item-wide h1 { font-size:20px; line-height:28px; } .portfolio li.item-long, .portfolio li.item-long img { width:220px !important; height:85px !important; }
.portfolio li.item-long h1 { font-size:14px; }
.slides_container { width:460px; }
.slides_container div.slide { width:460px; }
#slides .caption { display:none; }
.portfolio-gallery { width:480px; } .portfolio-gallery img { width:220px; } .gallery-page { width:480px; } .gallery-page li { width:220px; margin:0 20px 10px 0; clear:both; } .gallery-page img { width:220px; }
.slide iframe, .slide embed { width:460px; height:auto; } .slides_container div.slide img { width:460px; height:auto; }
.pagination { bottom:20px; }
.single-portfolio-nav { overflow:hidden; margin-bottom:30px; }
#masonry-blog { width:460px; } .columns-two .masonry-post, .columns-three .masonry-post { width:460px; } .masonry-page-content { padding:10px 20px; }
#masonry-blog .vimeo-article iframe, #masonry-blog .vimeo-article embed, .post iframe { width:460px !important; height:auto !important; } .columns-two .slides_container, .columns-three .slides_container { height:240px !important; width:480px !important; }
#blog-page div.jp-audio div.jp-type-single div.jp-progress { width: 40%; left: 23%; }
span.pages { display:none; } .post .slides_container .slide, .columns-three .slides_container .slide { height:240px !important; width:460px !important; } .post .slides_container { height:240px !important; width:460px !important; }
.slide iframe, .slide embed { width:460px; height:259px !important }
.slides_container div.slide img { width:460px; height:auto; }
.inner-blog-gallery { overflow:hidden; margin-bottom:30px; width:481px; } .inner-blog-gallery li, .inner-blog-gallery li a { width:136px !important; height:136px !important; }
.inner-blog-gallery img { width:136px !important; height:136px !important; }
#posts { width:460px; margin-right:0px; }
.post-thumbnail img { width:460px; height:auto; }
.video-thumbnail iframe, .video-thumbnail embed { width:460px; height:auto; }
.widget { margin-bottom:0; margin-top:30px; }
.meta { clear:both; width:460px; margin-right:0px; border-bottom:1px solid #efefef; padding-bottom:10px; margin-bottom:10px; }
.meta p { float:left; margin-right:20px; }
.excerpt { clear:both; width:460px; float:none; }
#sidebar { width:460px; }
.sidebar-post h5 { width: 300px; }
.post-content img { width:460px; height:auto; }
.author-bio { padding:15px; }
.authorp { width:340px; }
.authorp h2 { font-size:14px; }
.author-bio img { margin: 0 15px 0 0; }
#commentform { width:460px; }
#commentform input[type="text"], #commentform textarea, .contactform input[type="text"] { width: 428px; padding: 7px 15px; font-size: 12px; }
#crumbs { height:auto; }
.contact-info { margin-bottom:30px; } .contact-map iframe { width:460px; }
.post img { width:450px; height:auto; } #posts .avatar img { width:60px; height:60px; } #flickr { width:450px; }
.single-post .widget { margin-top:40px; margin-bottom:0px; }
#posts .author-bio img { width:60px; height:60px; }
#posts .pagenav { margin-bottom:50px; }
#topfooter .one-third { margin-bottom:30px; }
#bottomfooter { margin-top:10px; }
ul#social { margin:30px 0 10px; }
.contact-map iframe { width:460px; height:240px; }
.clients li { padding:0; border:0; }
.one-page #header { height:86px; width:480px; }
.one-page .top-shadow, .one-page .bottom-shadow { display:none !important; } .one-page .select-menu { display:none; }
}
/* #Tablet - 768px ================================================== */
@media only screen and (min-width: 768px) and (max-width: 1023px) {
.one-half { width: 364px; } .one-third { width: 30.66%; } .two-third { width: 65.33%; } .one-fourth { width: 364px; } .three-fourth { width: 364px; } .one-fifth { width: 16.8%; } .two-fifth { width: 37.6%; } .three-fifth { width: 58.4%; } .four-fifth { width: 67.2%; } .one-sixth { width: 13.33%; } .five-sixth { width: 82.67%; }
.one-half, .one-third, .two-third, .three-fourth, .one-fourth, .one-fifth, .two-fifth, .three-fifth, .four-fifth, .one-sixth, .five-sixth { position: relative; margin-right: 20px; margin-bottom: 20px; float: left; min-height:1px; }
.percent-one-half { width: 48%; } .percent-one-third { width: 30.66%; } .percent-two-third { width: 65.33%; } .percent-one-fourth { width: 22%; } .percent-three-fourth { width: 74%; } .percent-one-fifth { width: 16.8%; } .percent-two-fifth { width: 37.6%; } .percent-three-fifth { width: 58.4%; } .percent-four-fifth { width: 67.2%; } .percent-one-sixth { width: 13.33%; } .percent-five-sixth { width: 82.67%; }
.percent-one-half, .percent-one-third, .percent-two-third, .percent-three-fourth, .percent-one-fourth, .percent-one-fifth, .percent-two-fifth, .percent-three-fifth, .percent-four-fifth, .percent-one-sixth, .percent-five-sixth { position: relative; margin-right: 4%; float: left; min-height:1px; }
.page-template-template-features-php .one-fourth, .page-template-template-features-php .three-fourth { width:748px; clear:both; margin:0; }
.homepage-services { width:768px; }
html #wrapper { width:768px; margin:0 auto; }
html #header { width:768px; border-bottom:1px solid #efefef; }
html #footer { width:768px; }
.centered-wrapper { width:748px; padding:0 10px; }
.logo { float:left; }
.logo img {
}
.tp-bullets.simplebullets.round .bullet { width:154px; }
#navigation { margin-bottom: 10px; overflow: hidden; margin-top: 25px; float:none; }
ul#mainnav { display:none; }
.services .one-third { width:748px; clear:both; margin-right:0px; } .select-menu { display:block; clear:both; float:right; margin:5px 0; padding:5px 10px; width:380px; }
.box-slide1, .box-slide2, .title_text, .description_text { display:none; }
.intro h2 {
line-height:36px;
font-size:24px;
}
.intro h5 {
line-height: 24px;
margin-bottom: 15px;
font-size:14px;
}
#bottomfooter { height:auto; line-height:auto; padding-top:25px; }
#bottomfooter p { line-height:24px; }
#bottomfooter #social { margin:-10px 0 0 !important; }
#flickr li { margin: 0 10px 9px 0; }
#bottomfooter p { float: left; text-align: left; }
#bottomfooter .one-half { margin-bottom:0; }
ul#social { float: right; text-align: center; margin-bottom:30px; }
ul#social li { display: inline-block; }
.slider-wrapper {
height:auto;
}
.intro { padding: 55px 0; width: 728px; }
h3.service { margin-bottom:10px; }
.service-item { margin-bottom:35px; border-bottom:1px solid #efefef; padding-bottom:10px; }
#topfooter h3 { margin-bottom:10px; }
.jcarousel-container-horizontal { width: 747px; clear: both; margin-left: 0px; }
.jcarousel-clip-horizontal { width: 747px; height: auto; }
.jcarousel-container-horizontal { width: 748px; clear: both; margin-left: 0px; height:auto !important; }
.jcarousel-clip-horizontal { width: 748px; height: auto; }
#portfolio-carousel .jcarousel-item { width: 236px; height: 274px; display: block; position: relative; background: white; }
#homeblog-carousel .blog-carousel-details { padding-top:10px; }
#homeblog-carousel .jcarousel-item { width:236px; height:auto !important; } #homeblog-carousel .jcarousel-item > a { width:236px; } #homeblog-carousel .jcarousel-container-horizontal { height:auto; }
#homeblog-carousel .blog-carousel-details { clear:both; }
.jcarousel-item img, #homeblog-carousel .jcarousel-item img { width:100%; }
.page-title { width: 768px; padding: 0 0 10px; margin:0; }
.page-title h2 { margin-bottom:33px; text-align:center; }
.page-background { display:none; }
.title-wrapper { width:100%; height:auto; box-shadow:none; padding:0; margin-bottom:30px; }
.title-bg, .title-content { width:100%; padding:0; margin:0; position:relative; clear:both; top:0; height:auto; overflow:hidden; } .title-content { padding:30px 0 0; text-align:center; width:768px; } .title-wrapper .one-third { margin:0; }
.top-shadow, .bottom-shadow { display:none; }
.portfolio-nav { overflow:hidden; float:none; text-align:center; }
.portfolio-nav a { float:none; display:inline-block; text-align:center; margin:0 5px; }
#skills .skill { width:60%; } #skills h2 { right:10px; }
.pricing-column { width:187px; }
#header .one-third{ margin-right:4%; }
.page-title .two-third, .page-title .one-third, .page-title .one-fourth, .page-title .three-fourth { width:100%; margin:0; }
.team { width:768px; } .team .one-fourth { width:172px; }
.t-page .testimonial-item { width:228px !important; }
ul#testimonials-carousel .testimonial-item { width:228px; }
.homepage-testimonials .testimonial-item { width:190px !important; }
ul#filters { overflow:hidden; float: none; clear: both; text-align: center; margin-top: 0px; margin-bottom: 20px; margin-left:10px; }
ul#filters li { display: inline-block; margin: 0 10px 5px 0; float: none; }
#portfolio-wrapper .four-columns li, #portfolio-wrapper .three-columns li, #portfolio-wrapper .two-columns li { width: 364px; height:382px; }
#portfolio-wrapper .four-columns img, #portfolio-wrapper .three-columns img, #portfolio-wrapper .two-columns img { width: 100%; height: auto; } .portfolio-single .percent-three-fourth, .portfolio-single .percent-one-fourth { width: 100%; margin: 0; margin-bottom: 20px; clear: both; }
.grid { margin-left: 24px; }
ul.tabs li a { padding: 0 15px; }
.slides_container { width:748px; }
.slides_container div.slide { width:748px; }
#slides .caption { display:none; }
.slide iframe, .slide embed { width:100%; height:400px; }
.single-portfolio-nav { overflow:hidden; margin-bottom:30px; }
.slides_container div.slide img { width:748px; height:auto; }
.portfolio-gallery {
width:769px;
}
.portfolio-gallery img {
width:236px;
}
.gallery-page {
width:769px;
}
.gallery-page li {
width:236px;
margin:0 20px 10px 0;
clear:both;
}
.gallery-page img {
width:236px;
}
#masonry-blog { width:768px; } .columns-two .masonry-post, .columns-three .masonry-post { width:364px; } .masonry-page-content { padding:10px; }
.masonry-page-content i { display:none; } #masonry-blog .vimeo-article iframe, #masonry-blog .vimeo-article embed { width:364px !important; height:auto !important; } .columns-two .slides_container, .columns-three .slides_container { height:190px !important; width:364px !important; } div.jp-audio div.jp-type-single div.jp-progress { width: 26%; left: 28%; } span.pages { display:none; } .post .slides_container .slide, .post .slides_container .slide img { height:391px !important; width:748px !important; } .post .slides_container { height:391px !important; width:748px !important; }
.slide iframe, .slide embed { width:364px; height:auto; }
.post .slide iframe, .post .slide embed, .post iframe { width:748px; height:auto; }
#masonry-blog .slides_container div.slide img { width:364px; height:auto; }
#posts {
width:748px;
margin-right:0px;
}
.post-thumbnail img { width:748px; height:auto; }
.inner-blog-gallery { width:100%; overflow:hidden; }
.video-thumbnail { width:100%; }
#flickr { width:748px; }
.video-thumbnail iframe, .video-thumbnail embed { width:100%; }
.meta { clear:both; width:748px; margin-right:0px; border-bottom:1px solid #efefef; padding-bottom:10px; margin-bottom:10px; }
.meta p { float:left; margin-right:20px; }
.excerpt { clear:both; width:748px; float:none; }
#sidebar { width:748px; }
.sidebar-post h5 { width: 300px; }
.post-content img { height:auto; }
.author-bio { padding:15px; }
.authorp { width:630px; }
.authorp h2 { font-size:18px; }
.author-bio img { margin: 0 15px 0 0; }
#commentform { width:748px; }
#commentform input[type="text"] { width: 197px; padding: 7px 15px; font-size: 12px; }
#commentform textarea { width:725px; }
.contactform input[type="text"] { width: 139px; padding: 7px 15px; font-size: 12px; }
.widget { margin-top:40px; margin-bottom:0px; }
.contact-map iframe { width:748px; }
.post img { height:auto; }
#posts .author-bio img { width:60px; height:60px; }
.clients li { padding:0; border:0; }
#posts .pagenav { margin-bottom:50px; }
.contact-map iframe { width:748px; height:240px; }
.one-page #header { height:86px; } .one-page #header .two-third { display:none; } .one-page #header .one-third { width:100%; } .top-shadow, .bottom-shadow { display:none !important; }
.one-page .logo { text-align: center; float:none; }
.one-page .logo img { display:inherit; margin:0 auto; top:25px; position:relative; }
}
/* #Screens Bigger than - 1280px
================================================== */
@media only screen and (min-width: 1281px) {
.one-half { width: 550px; }
.one-third { width: 320px; }
.two-third { width: 780px; }
.one-fourth { width:180px; }
.three-fourth { width: 835px; }
.one-sixth { width: 170px; }
.five-sixth { width: 930px; }
.one-fourth, .one-half, .two-third, .one-third, .three-fourth, .one-sixth, .five-sixth { position: relative; margin-right:8px; float: left; }
.percent-one-half { width: 48%; } .percent-one-third { width: 30.66%; } .percent-two-third { width: 65.33%; } .percent-one-fourth { width: 22%; } .percent-three-fourth { width: 74%; } .percent-one-fifth { width: 16.8%; } .percent-two-fifth { width: 37.6%; } .percent-three-fifth { width: 58.4%; } .percent-four-fifth { width: 67.2%; } .percent-one-sixth { width: 13.33%; } .percent-five-sixth { width: 82.67%; }
.percent-one-half, .percent-one-third, .percent-two-third, .percent-three-fourth, .percent-one-fourth, .percent-one-fifth, .percent-two-fifth, .percent-three-fifth, .percent-four-fifth, .percent-one-sixth, .percent-five-sixth { position: relative; margin-right: 4%; float: left; }
.centered-wrapper, .title-bg, .title-wrapper, .title-content { width:1120px; }
.tp-bullets.simplebullets.round .bullet { width:224px; }
.jcarousel-container { margin-bottom:20px; }
.jcarousel-container-horizontal { width: 1120px; }
.jcarousel-clip-horizontal { width: 1120px; height: auto; }
#portfolio-carousel .jcarousel-item { width: 170px; height: auto; }
#homeblog-carousel .jcarousel-item { width: 550px; height: auto; }
#portfolio-carousel .jcarousel-item img { width:100%; height:auto; }
#homeblog-carousel .jcarousel-item img { width:265px; height:auto; }
#homeblog-carousel .jcarousel-item > a { width:265px; margin-right:20px; }
#homeblog-carousel .blog-carousel-details { width:265px; }
.jcarousel-item-horizontal { margin-right: 20px; }
.gallery-page { width:1140px; } .gallery-page li { width:360px; margin:0 20px 20px 0; } .clients li { padding:0 28.1px; }
.pricing-column { width:280px; }
.portfolio { margin-right:-20px; }
.portfolio li { margin-right:20px; margin-bottom:20px; }
.portfolio li.item-wide, .portfolio li.item-wide img { width:550px !important; height:450px !important; border-bottom: none !important; }
.portfolio li.item-small, .portfolio li.item-small img { width:265px !important; height:215px !important; border-bottom: none !important; }
.portfolio li.item-high, .portfolio li.item-high img { width:265px !important; height:450px !important; border-bottom: none !important; }
.portfolio li.item-long, .portfolio li.item-long img { width:550px !important; height:215px !important; border-bottom: none !important; }
#portfolio-wrapper { width:1140px; }
#portfolio-wrapper .four-columns img { width:265px; height:auto; }
#portfolio-wrapper .three-columns img { width:360px; height:auto; }
#portfolio-wrapper .two-columns img { width:550px; height:auto; }
#portfolio-wrapper .four-columns li { width: 265px; height:300px; }
#portfolio-wrapper .three-columns li { width: 360px; height: 378px; }
#portfolio-wrapper .two-columns li { width: 550px; height: 534px; } .slides_container div.slide, .slides_container { width:1120px } .portfolio-gallery { width:1140px; height:auto; }
.portfolio-gallery img { width:360px; }
#masonry-blog { width:1140px; } .columns-two .masonry-post { width:550px; } .columns-two .slides_container, .columns-two .slides_container .slide { width:550px !important; height:287px !important; }
.columns-three .slides_container, .columns-three .slides_container .slide { width:360px !important; height:188px !important; }
div.jp-audio div.jp-type-single div.jp-progress { width: 48%; left: 20%; }
.columns-two .vimeo-article iframe { width:550px !important; height:309px !important; }
.columns-three .vimeo-article iframe { width:360px !important; height:202px !important; }
.columns-three .masonry-post { width:360px; }
.columns-three div.jp-audio div.jp-type-single div.jp-progress { display:block !important; width: 20%; left: 30%; }
#sidebar { width:300px; } #posts { width:780px; }
.post-thumbnail img { width:780px; }
.post .slides_container, .post .slides_container .slide { width:780px; height:408px; }
.post .vimeo-article iframe { width:780px; height:439px; }
#flickr { width:300px; } #flickr li { margin:0 5px 5px 0; }
.inner-blog-gallery { overflow: hidden; clear: both; }
.contact-map iframe { width:1120px; height:360px; }
.bannercontainer {
background-color:#fff;
width:1120px;
max-height:450px !important;
}
.banner{ width:1120px; height:450px; }
.bannercontainer-simple { padding:0px; background-color:#fff; width:1120px; }
.banner-simple{ width:1120px; height:450px; }
span.hover-link , span.hover-image , span.hover-video { width:41px; height:41px; margin-left: -20px; margin-top: -20px; }
}