File: /www/wwwroot/sr.dfhtcs.com/static/css/responsive.css
/*CSS FOR RESPONSIVE LAYOUTS*/
/*___________________________________________________________________*/
/*---------------iPad & Samsung Galaxy Tablets portrait---------------*/
/*___________________________________________________________________*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
#container{ width: 794px;}
.container {width: 714px; }
.sidebar .widget .top-search input{width: 145px;}
.after-nav-info{display: none;}
.flex-slider-text{ margin-top: 60px;margin-bottom: 60px; }
.flex-slider-text h1{font-size: 22px;line-height: 28px;}
.flex-slider-text p{font-size: 13px;line-height: 21px;}
ul.main-menu.alternative{float: left;width: 100%;display: block;margin-top: 15px;}
ul#portfolio-container.two-columns li {width: 47.88%;}
ul#portfolio-container .flex-control-nav li, .blog-post .flex-control-nav li{ width: 10px;}
ul#portfolio-container.two-columns li .item-wrapp .portfolio-item:hover a.item-permalink{left: 38%;}
ul#portfolio-container.two-columns li .item-wrapp .portfolio-item:hover a.item-preview{right: 38%;}
ul#portfolio-container.three-columns li .item-wrapp .portfolio-item:hover a.item-permalink{left: 31.5%;}
ul#portfolio-container.three-columns li .item-wrapp .portfolio-item:hover a.item-preview{right: 31.5%;}
.one-third.product .item-wrapp .portfolio-item:hover a.item-permalink{left: 26%;}
.one-third.product .item-wrapp .portfolio-item:hover a.item-preview{right: 26%;}
.portfolio-item:hover a.item-permalink{left: 26%;}
.portfolio-item:hover a.item-preview{right: 26%;}
.blog-item.small:hover a.item-permalink{display: none;}
.blog-item.small:hover a.item-preview{display: none;}
.blog-item.medium:hover a.item-permalink{left: 34%;}
.blog-item.medium:hover a.item-preview{right: 34%;}
.blog-item.large:hover a.item-permalink{left: 42%;}
.blog-item.large:hover a.item-preview{right: 42%;}
.blog-post.layout-2 .media-holder{ float:left;width: 110px;}
.comment-entry{margin:-70px 0 0 90px;width:75%;}
ul.commentlist li.child .comment-entry{ width:70%;}
}
/*___________________________________________________________________*/
/*---------------iPhone & Samsung Mobiles landscape---------------*/
/*___________________________________________________________________*/
@media only screen and (min-width: 480px) and (max-width: 767px) {
#container{ width: 440px;}
.container {width: 400px; }
#main-navigation select { display: block}
#main-navigation ul{display: none;}
#main-navigation select {margin: 30px 70px; width:300px;}
.after-nav-info{ width: 100%;text-align: center;}
#logo{text-align:center;width: 100%;float: left;}
a#logo span {text-align: center;display: block;position: relative;}
.top-search{display: none;}
.one,.one-half,.two-third,.one-third,.one-fourth ,.one-fifth,.one-sixth,.three-fourth{ float:left;position:relative;width: 100%; margin-right: 0!important;margin-bottom: 20px;}
#header-links ul.social-links{display: none;}
#header-links div{margin-bottom: 0px;}
ul#portfolio-container.two-columns li, ul#portfolio-container.three-columns li, ul#portfolio-container.four-columns li {width: 47.88%;}
ul#portfolio-container .flex-control-nav li, .blog-post .flex-control-nav li{ width: 10px;}
ul#portfolio-container.two-columns li .item-wrapp .portfolio-item:hover a.item-permalink{left: 28%;}
ul#portfolio-container.two-columns li .item-wrapp .portfolio-item:hover a.item-preview{right: 28%;}
ul#portfolio-container.three-columns li .item-wrapp .portfolio-item:hover a.item-permalink{left:28%;}
ul#portfolio-container.three-columns li .item-wrapp .portfolio-item:hover a.item-preview{right:28%;}
.one-third.product .item-wrapp .portfolio-item:hover a.item-permalink{left: 40%;}
.one-third.product .item-wrapp .portfolio-item:hover a.item-preview{right: 40%;}
.portfolio-item:hover a.item-permalink{left: 28%;}
.portfolio-item:hover a.item-preview{right: 28%;}
ul.pricing-boxes li{margin-bottom: 20px;}
ul.pricing-boxes.five li {width:99%; }
ul.pricing-boxes.four li {width: 99%;}
ul.pricing-boxes.three li {width: 99%; }
ul.pricing-boxes li .plan-features{ border-right:1px solid #e6e9ee;}
.plan-features ul li{margin-bottom: 0px;}
.blog-post.layout-2 .media-holder{width: 400px;margin-bottom: 20px; margin-right: 0px;}
.blog-item.small:hover a.item-permalink{left: 40%;}
.blog-item.small:hover a.item-preview{right: 40%;}
.blog-item.medium:hover a.item-permalink{left: 30%;}
.blog-item.medium:hover a.item-preview{right: 30%;}
.blog-item.large:hover a.item-permalink{left: 40%;}
.blog-item.large:hover a.item-preview{right: 40%;}
#filterable li {margin-bottom: 5px;}
#filterable li a {padding: 5px 8px;}
#breadcrumb{ text-align: center;padding-bottom: 15px;}
#breadcrumb .one-half{margin-bottom: 0px;}
#breadcrumbs ul{float:left;width: 100%;text-align: center}
.comment-entry{margin:-70px 0 0 90px;width:66%;}
ul.commentlist li.child .comment-entry{ width:56%;}
}
/*___________________________________________________________________*/
/*---------------iPhone & Samsung Mobiles landscape---------------*/
/*___________________________________________________________________*/
@media only screen and (min-width: 320px) and (max-width: 479px) {
#container{ width: 300px;}
.container {width:260px; }
#main-navigation select { display: block}
#main-navigation ul{display: none;}
#main-navigation select {margin: 30px 10px; width:260px;}
.after-nav-info{ width: 100%;text-align: center;}
#logo{text-align:center;width: 100%;float: left;}
a#logo span {text-align: center;display: block;position: relative;}
.top-search{display: none;}
.one,.one-half,.two-third,.one-third,.one-fourth ,.one-fifth,.one-sixth,.three-fourth{ float:left;position:relative;width: 100%; margin-right: 0!important;margin-bottom: 20px;}
#header-links ul.social-links{display: none;}
#header-links div{margin-bottom: 0px;}
ul#portfolio-container {margin:0 0 0 0%;}
ul#portfolio-container.two-columns li, ul#portfolio-container.three-columns li, ul#portfolio-container.four-columns li {width: 98%;margin-right: 0!important;}
ul#portfolio-container .flex-control-nav li, .blog-post .flex-control-nav li{ width: 10px;}
ul#portfolio-container.two-columns li .item-wrapp .portfolio-item:hover a.item-permalink{left: 33%;}
ul#portfolio-container.two-columns li .item-wrapp .portfolio-item:hover a.item-preview{right: 33%;}
ul#portfolio-container.three-columns li .item-wrapp .portfolio-item:hover a.item-permalink{left:33%;}
ul#portfolio-container.three-columns li .item-wrapp .portfolio-item:hover a.item-preview{right:33%;}
.one-third.product .item-wrapp .portfolio-item:hover a.item-permalink{left: 33%;}
.one-third.product .item-wrapp .portfolio-item:hover a.item-preview{right: 33%;}
.portfolio-item:hover a.item-permalink{left: 33%;}
.portfolio-item:hover a.item-preview{right: 33%;}
ul.pricing-boxes li{margin-bottom: 20px;}
ul.pricing-boxes.five li {width:99%; }
ul.pricing-boxes.four li {width: 99%; }
ul.pricing-boxes.three li {width: 99%;}
ul.pricing-boxes li .plan-features{ border-right:1px solid #e6e9ee;}
.plan-features ul li{margin-bottom: 0px;}
.blog-post.layout-2 .media-holder{width:260px;margin-bottom: 20px; margin-right: 0px;}
.blog-item.small:hover a.item-permalink{left: 33%;}
.blog-item.small:hover a.item-preview{right: 33%;}
.blog-item.medium:hover a.item-permalink{left: 33%;}
.blog-item.medium:hover a.item-preview{right: 33%;}
.blog-item.large:hover a.item-permalink{left: 33%;}
.blog-item.large:hover a.item-preview{right: 33%;}
#filterable li {margin-bottom: 5px;}
#filterable li a {padding: 5px 8px;}
#breadcrumb{ text-align: center;padding-bottom: 15px;}
#breadcrumb .one-half{margin-bottom: 0px;}
#breadcrumbs ul{float:left;width: 100%;text-align: center}
.comment-entry{margin:-70px 0 0 90px;width:66%;}
ul.commentlist li.child .comment-entry{ width:56%;}
.blog-post.layout-3{width: 98%; margin-right: 0%!important}
ul.commentlist li.child{margin-left: 0px;}
.comment-entry{ margin:0px 0 0 0px;width:82%;}
ul.commentlist li.child .comment-entry{ width:82%;}
form.simple-form textarea {width: 90%; }
.comment > .avatar,.comment-arrow{display: none;}
}