/*----------------------------------------------- /* Responsive /*---------------------------------------------*/ @media screen and (max-width:1420px) { .shareit { position: relative; width: 100%; top: 0; padding-left: 0; padding-right: 0; margin: 0; padding-top: 0; border: none; } } @media screen and (max-width:1200px) { #header { padding: 0 2.5%; width: 95%; } #page, .footer-widgets { width: 95% } #sidebars img, #footer img, #content img { height: auto } #commentform textarea { width: 90%!important } } @media screen and (max-width:1024px) { .article { padding-left: 2%; width: 62%; padding-right: 2%; } .single_post, .single_page, .related-posts, .postauthor, #commentsAdd, .latestPost, .flexslider, #comments { margin-right: 0; margin-left: 0; width: 100%; padding-left: 0; } #sidebar-left { display: none } .threecolumns .sidebar.c-4-12 { width: 30%; } } @media screen and (max-width:1000px) { #move-to-top { margin-right: 0; right: 5px; } } @media screen and (max-width:960px) { .main-navigation { left: 0 } img { max-width: 100%; height: auto!important; } .ad-300 img { max-width: 100% } .ad-125 li { max-width: 40% } .ad-125 img { padding: 0; background: #FAFAFA; border: 0; } } @media screen and (max-width:900px) { .widget-header { max-width: 70% } .main-navigation a { padding: 8px 14px } } @media screen and (max-width:865px) { .main-header { position: relative ; min-height: 42px;} #page, .container { max-width: 95% } footer .container { padding: 0 3%; max-width: 94%; } .footer-widgets { padding-right: 0; padding-left: 0; width: 100%; } .mts-cart { text-align: center!important; width: 44%; margin-bottom: 5px; } .main-navigation, #navigation { border: none !important; background: #283744; position: absolute; width: 100%; } .main-navigation { width: 100%; margin-bottom: 20px; position: relative!important; } #navigation .menu a, #navigation .menu [class^="icon-"] > a, #navigation .menu [class*=" icon-"] > a { color: #fff!important; padding-left: 0!important; padding-right: 0!important; } #navigation .menu { float: none; background: transparent; } #navigation ul ul { display: block!important; visibility: visible!important; opacity: 1!important; position: relative; left: 0!important; border: 0; top: 0; width: 100%; } #navigation ul li li { background: transparent; border: 0; } nav { height: auto } nav ul { width: 100%; display: none; height: auto; } #navigation li, #navigation ul li li { width: 100%!important; float: left; position: relative; } #navigation ul li:after { background: transparent } #navigation ul li:before { display: none } #navigation li a { border-bottom: 1px solid #576979!important; width: 100%!important; } #navigation a { text-align: left; width: 100%; text-indent: 25px; } nav a#pull { display: block; background-color: #283744; color: #fff; padding: 10px; text-indent: -999em; width: 30px; height: 20px; text-align: center; position: absolute; top: 0; left: auto; right: -6%; } nav a#pull:after { content: ""; background: url('images/nav-icon.png') no-repeat; width: 21px; height: 30px; display: inline-block; position: absolute; right: 15px; top: 10px; } .secondary-navigation #navigation ul .sfHover a, .secondary-navigation #navigation ul li:hover, .secondary-navigation #navigation ul .sfHover ul li { background: transparent } } @media screen and (max-width:768px) { .article { width: 96% } .latestPost .title { font-size: 34px } .sidebar.c-4-12 { width: 96.4%; max-width: 300px; float: none; margin: 0 auto; } } @media screen and (max-width:728px) { #header h1, #header h2, .site-description { float: none; text-align: center; width: 100%; max-width: 100%; padding: 0; } #header h1, #header h2 { font-size: 40px ; margin: 0; height: 100%;} .site-description { margin-top: 0 } #logo a, #logo img { float: none; letter-spacing: 0; padding: 0; line-height: 1; } .logo-wrap { margin-bottom: 0; margin-top: 0; width: 100%; } .mts-cart { width: 100% } .latestPost .title { font-size: 30px } } @media screen and (max-width:720px) { .secondary-navigation a { padding-top: 10px!important; padding-bottom: 10px!important; } .article { width: 94%; border: 0; padding-right: 3%; padding-left: 3%; } .single_post, .single_page, .related-posts, .postauthor, #comments, #commentsAdd { padding-right: 0; width: 100%; margin-right: 0; } .latestPost .title, .single-title, .single_page h1 { font-size: 24px; line-height: 1.4; } .sidebar.c-4-12 { float: left; width: 92% !important; padding-left: 0; padding-right: 0; margin-left: 3.8%; } .flexslider { margin-left: 0 } .f-widget { width: 49% } .f-widget-2 { margin-right: 0 } .f-widget-3 { clear: left } .ad-125 li { max-width: 45% } #comments { margin-right: 0 } .widget-header .textwidget { margin-top: 0; padding-left: 0; border-left: none; } } @media screen and (max-width:600px) { .featured-thumbnail img { width: 100% } } @media screen and (max-width:550px) { .latestPost .title { font-size: 200%; line-height: 34px; } .sbutton { float: right } .f-widget { width: 100%; margin-right: 0; } } @media screen and (max-width:480px) { nav { border-bottom: 0 } #navigation { margin-top: 0; margin-bottom: 0; } .secondary-navigation { width: 102%; height: 35px; } .related-posts li { width: 100%; float: left!important; max-width: 100%; } .related-posts li img { margin-right: 10px; } .related-posts .relatepostli4 { padding-bottom: 15px; border-bottom: 1px solid #CCC; margin-bottom: 11px; } .one_half, .one_third, .two_third, .three_fourth, .one_fourth, .one_fifth, .two_fifth, .three_fifth, .four_fifth, .one_sixth, .five_sixth { width: 100%; margin-right: 0; } .copyrights { text-align: center } .top { width: 100% } } @media screen and (max-width:400px) { article header { overflow: hidden } .post-info .thecategory { clear: left; } .slidertext { display: none } #commentform textarea { width: 96% } .flex-caption { display: none } #cancel-comment-reply-link { margin-bottom: 0; float: left;} } @media screen and (max-width:320px) { .latestPost { float: none } .latest-cat-post #featured-thumbnail { width: 100%; max-width: 100%; } .latest-cat-post #featured-thumbnail .featured-thumbnail { float: none } #navigation li { display: block; float: none; width: 100%; } #navigation li a { border-bottom: 1px solid #576979 } }