Advertisement
Guest User

old responsive css

a guest
Jun 30th, 2016
22
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 9.17 KB | None | 0 0
  1. @charset "utf-8";
  2.  
  3. @media only screen and (max-width: 959px) {
  4.  
  5. img {
  6.     max-width:100%;
  7. }
  8. img {
  9.     -ms-interpolation-mode:bicubic;
  10. }
  11. iframe {
  12.     width:100%;
  13. }
  14. body {
  15.     min-width:inherit;
  16. }
  17. .body-wrapper,
  18. #slider-wrapper {
  19.     width:auto !important;;
  20. }
  21. #menu-wrapper select {
  22.     display:block;
  23. }
  24. #main-nav {
  25.     display:none;
  26. }
  27. #nivoslider-wrapper {
  28.     width:auto;
  29.     height:auto;
  30.     padding:0;
  31. }
  32. #nivoslider {
  33.     width:auto;
  34.     height:auto;
  35. }
  36. #kwicks-wrapper,
  37. #showcase-holder,
  38. #cycle-wrap,
  39. #roundaboutslider,
  40. #liteaccordion,
  41. #tmslider-holder {
  42.     display:none;
  43. }
  44. .content,
  45. .sidebarleft,
  46. .sidebarright {
  47.     min-height:inherit !important;
  48. }
  49. .sidebarleft,
  50. .sidebarright {
  51.     padding-top:40px;
  52.     overflow:hidden;
  53. }
  54. .container_2,
  55. .container_3,
  56. .container_4,
  57. .container_6,
  58. .container_8,
  59. .container_9,
  60. .container_10,
  61. .container_12 {
  62.     width:auto !important;
  63. }
  64. .percol {
  65.     width:100% !important;
  66.     padding-right:0 !important;
  67.     padding-left:0 !important;
  68. }
  69. .featured-thumbnail img {
  70.     width:100%;
  71. }
  72. .posts .featured-thumbnail iframe {
  73.     position:absolute;
  74.     top:0;
  75.     left:0;
  76.     width:100%;
  77.     height:100%;
  78. }
  79. .grid_6 .posts.halfstyle .featured-thumbnail.video {
  80.     padding-bottom:100%;
  81. }
  82. .grid_8 .posts.halfstyle .featured-thumbnail.video,
  83. .grid_12 .posts.halfstyle .featured-thumbnail.video {
  84.     padding-bottom:66.66%;
  85. }
  86. .grid_6 .posts.fullstyle .featured-thumbnail.video,
  87. .grid_8 .posts.fullstyle .featured-thumbnail.video,
  88. .grid_12 .posts.fullstyle .featured-thumbnail.video {
  89.     padding-bottom:50%;
  90. }
  91. .grid_6 .posts.single .featured-thumbnail.video,
  92. .grid_8 .posts.single .featured-thumbnail.video,
  93. .grid_12 .posts.single .featured-thumbnail.video {
  94.     padding-bottom:50%;
  95. }
  96. .posts.halfstyle .featured-thumbnail-wrapper {
  97.     width:100% !important;
  98.     float:none !important;
  99. }
  100. .posts.halfstyle h2 {
  101.     padding-top:10px;
  102. }
  103. .grid_12.fullstyle .posts .featured-thumbnail.video {
  104.     padding-bottom:25.2874%;
  105. }
  106. .grid_8.fullstyle .posts .featured-thumbnail.video {
  107.     padding-bottom:40%;
  108. }
  109. .single-post .date-wrapper {
  110.     position:static;
  111. }
  112. .ports.single .grid_12 .featured-thumbnail.video {
  113.     padding-bottom:50%;
  114. }
  115. .ports.single .grid_8 .featured-thumbnail.video {
  116.     padding-bottom:59.67%;
  117. }
  118. .ports .related .grid_3 {
  119.     width:220px;
  120.     display:inline;
  121.     float:left;
  122.     position:relative;
  123.     margin-left:10px;
  124.     margin-right:10px;
  125. }
  126. #port-details {
  127.     margin-top:20px;
  128. }
  129. #port-content-wrapper #port-details {
  130.     margin-top:0;
  131.     margin-bottom:20px;
  132. }
  133. #inlineinfo {
  134.     height:auto;
  135.     min-height:450px;
  136. }
  137. #inlineinfo .portfolio-item-context  {
  138.     margin-left:0;
  139.     border-color:transparent;
  140.     clear:both;
  141. }
  142. #inlineinfo .portfolio-item-context h1  {
  143.     padding-top:15px;
  144. }
  145. #inlineinfo .featured-thumbnail {
  146.     margin-left:0 !important;
  147.     margin-right:0 !important;
  148. }
  149. .pleft,
  150. .pleft.border,
  151. .bothright.border {
  152.     padding-left:0;
  153.     border-left:none;
  154. }
  155. .pright,
  156. .pright.border,
  157. .bothleft.border {
  158.     padding-right:0;
  159.     border-right:none;
  160. }
  161. .bothleft,
  162. .bothright,
  163. .bothmiddle {
  164.     left:auto;
  165. }
  166. #copyright .copleft,
  167. #copyright .copright {
  168.     text-align:center;
  169.     float:none;
  170. }
  171. /*.twitter-shortcode {
  172.     max-width:795px;
  173.     padding:0 0 0 145px;
  174. }*/
  175. .twitter-shortcode #twitter_update_list span {
  176.     padding:20px 20px 5px 0;
  177. }
  178. .twitter-shortcode .profileLink {
  179.     position:static;
  180.     margin:10px 0 5px;
  181. }
  182. .stunningtext a.stunning {
  183.     position:static;
  184.     margin:20px 0 10px;
  185. }
  186. .container_12 .grid_2,
  187. .container_12 .grid_3,
  188. .container_12 .grid_4,
  189. .container_12 .grid_6,
  190. .container_12 .grid_8,
  191. .container_12 .grid_9,
  192. .container_12 .grid_10,
  193. .container_12 .grid_12 {
  194.     width:780px;
  195.     margin-left:auto;
  196.     margin-right:auto;
  197.     float:none;
  198.     display:block;
  199. }
  200. .portfolio-item iframe {
  201.     height:100%;
  202. }
  203. .container_12 .portfolio-item.grid_3,
  204. .container_12 .portfolio-item.grid_4,
  205. .container_12 .portfolio-item.grid_6,
  206. .container_12 .portfolio-item.grid_12 {
  207.     margin-left:10px;
  208.     margin-right:10px;
  209. }
  210. .container_12 .portfolio-item.grid_3,
  211. .container_12 .portfolio-item.grid_4 {
  212.     width:380px;
  213. }
  214. .portfolio-item.grid_3 .featured-thumbnail {
  215.     height:242px;
  216. }
  217. .portfolio-item.grid_4 .featured-thumbnail {
  218.     height:240px;
  219. }
  220. .portfolio-item.grid_6 .featured-thumbnail {
  221.     height:509px;
  222. }
  223. .portfolio-item.grid_12 .featured-thumbnail {
  224.     height:498px;
  225. }
  226. .ports .related-content {
  227.     width:800px;
  228.     margin:0 auto;
  229. }
  230. .shortcodevideo {
  231.     width:100%;
  232. }
  233.  
  234. /* Woocommerce */
  235. div.product .summary {
  236.     margin-left:0;
  237. }
  238. div.product .woocommerce-tabs {
  239.     margin-left:0;
  240. }
  241. .cross-sells .products {
  242.     width:auto;
  243.     margin:0 0 20px;
  244. }
  245. .products .button {
  246.     width:50%;
  247.  
  248. }
  249.  
  250. @media only screen and (max-width:799px) {
  251.  
  252. #top-bar {
  253.     text-align:center;
  254. }
  255. #top-bar > div {
  256.     display:block;
  257.     float:none;
  258.     margin-bottom:5px;
  259. }
  260. #logo-wrapper,
  261. .top-information {
  262.     overflow:hidden;
  263.     float:none;
  264.     text-align:center;
  265. }
  266. #breadcrumb {
  267.     text-align:center;
  268. }
  269. .post-shortcode-item .post-context {
  270.     overflow:visible;
  271. }
  272. /*.post-shortcode-item .post-time {
  273.     width:auto;
  274.     height:130px;
  275.     float:none;
  276. }
  277. .post-shortcode-item .post-time:before {
  278.     width:100%;
  279. }*/
  280. .post-shortcode-item .post-title {
  281.     padding:20px 0 0;
  282.     clear:both;
  283. }
  284. .container_12 .grid_2,
  285. .container_12 .grid_3,
  286. .container_12 .grid_4,
  287. .container_12 .grid_6,
  288. .container_12 .grid_8,
  289. .container_12 .grid_9,
  290. .container_12 .grid_10,
  291. .container_12 .grid_12 {
  292.     width:620px;
  293. }
  294. .container_12 .portfolio-item.grid_3,
  295. .container_12 .portfolio-item.grid_4 {
  296.     width:300px;
  297. }
  298. .portfolio-item.grid_3 .featured-thumbnail {
  299.     height:191px;
  300. }
  301. .portfolio-item.grid_4 .featured-thumbnail {
  302.     height:200px;
  303. }
  304. .portfolio-item.grid_6 .featured-thumbnail {
  305.     height:404px;
  306. }
  307. .portfolio-item.grid_12 .featured-thumbnail {
  308.     height:396px;
  309. }
  310. .ports .related-content {
  311.     width:640px;
  312. }
  313. #lightboxinfo .featured-thumbnail {
  314.     height:318px;
  315. }
  316. #lightboxinfo .featured-thumbnail iframe {
  317.     height:100%;
  318. }
  319. #error404 h1 {
  320.     font-size:80px;
  321. }
  322.  
  323. }
  324.  
  325. @media only screen and (max-width:639px) {
  326.  
  327. .container_12 .grid_2,
  328. .container_12 .grid_3,
  329. .container_12 .grid_4,
  330. .container_12 .grid_6,
  331. .container_12 .grid_8,
  332. .container_12 .grid_9,
  333. .container_12 .grid_10,
  334. .container_12 .grid_12 {
  335.     width:460px;
  336. }
  337. .container_12 .portfolio-item.grid_3,
  338. .container_12 .portfolio-item.grid_4 {
  339.     width:460px;
  340. }
  341. .portfolio-item.grid_3 .featured-thumbnail {
  342.     height:293px;
  343. }
  344. .portfolio-item.grid_4 .featured-thumbnail {
  345.     height:240px;
  346. }
  347. .portfolio-item.grid_6 .featured-thumbnail {
  348.     height:300px;
  349. }
  350. .portfolio-item.grid_12 .featured-thumbnail {
  351.     height:294px;
  352. }
  353. .ports .related-content {
  354.     width:480px;
  355. }
  356. #lightboxinfo .featured-thumbnail {
  357.     height:236px;
  358. }
  359.  
  360. /* Woocommerce */
  361. .col2-set .col-1,
  362. .col2-set .col-2 {
  363.     float:left;
  364.     width:100%;
  365. }
  366. .col2-set .col-1 {
  367.     margin-bottom:40px;
  368. }
  369. .reset_variations {
  370.     bottom:-25px;
  371. }
  372.  
  373. }
  374.  
  375. @media only screen and (max-width:479px) {
  376.  
  377. .container_12 .grid_2,
  378. .container_12 .grid_3,
  379. .container_12 .grid_4,
  380. .container_12 .grid_6,
  381. .container_12 .grid_8,
  382. .container_12 .grid_9,
  383. .container_12 .grid_10,
  384. .container_12 .grid_12 {
  385.     width:300px;
  386. }
  387. .container_12 .portfolio-item.grid_3,
  388. .container_12 .portfolio-item.grid_4 {
  389.     width:300px;
  390. }
  391. .portfolio-item.grid_3 .featured-thumbnail {
  392.     height:191px;
  393. }
  394. .portfolio-item.grid_4 .featured-thumbnail {
  395.     height:200px;
  396. }
  397. .portfolio-item.grid_6 .featured-thumbnail {
  398.     height:196px;
  399. }
  400. .portfolio-item.grid_12 .featured-thumbnail {
  401.     height:191px;
  402. }
  403. .ports .related-content {
  404.     width:320px;
  405. }
  406. .author-info img {
  407.     float:none;
  408.     margin-bottom:20px;
  409. }
  410. ol.commentlist .comment-author img {
  411.     float:none;
  412. }
  413. #lightboxinfo .featured-thumbnail {
  414.     height:154px;
  415. }
  416. #lightboxinfo h1 {
  417.     padding:20px 10px;
  418.     font-size:36px;
  419. }
  420. #lightboxinfo .portfolio-item-content {
  421.     padding:0 30px 30px;
  422. }
  423. #inlineinfo .featured-thumbnail iframe {
  424.     position:absolute;
  425.     top:0;
  426.     left:0;
  427.     width:100%;
  428.     height:100%;
  429. }
  430. #error404 h1 {
  431.     font-size:50px;
  432. }
  433.  
  434. /* Woocommerce */
  435. table.cart {
  436.     display:block;
  437.     border-width:1px;
  438.     border-style:solid;
  439.     overflow:hidden;
  440. }
  441. table.cart th,
  442. table.cart .product-remove,
  443. table.cart .product-thumbnail {
  444.     display:none;
  445. }
  446. table.cart td,
  447. table.cart tr,
  448. table.cart tbody {
  449.     display: block;
  450.     border: none !important;
  451. }
  452. table.cart .actions > .button,
  453. table.cart .coupon input,
  454. table.cart .coupon .input-text {
  455.     width:100%;
  456.     margin:0 0 5px 0;
  457. }
  458. td.actions {
  459.     overflow:hidden;
  460.     padding:10px;
  461. }
  462.  
  463. }
  464.  
  465. @media only screen and (max-width:319px) {
  466.  
  467. .container_12 .grid_2,
  468. .container_12 .grid_3,
  469. .container_12 .grid_4,
  470. .container_12 .grid_6,
  471. .container_12 .grid_8,
  472. .container_12 .grid_9,
  473. .container_12 .grid_10,
  474. .container_12 .grid_12 {
  475.     width:220px;
  476. }
  477. #header-up.container_12 .grid_12 {
  478.     width:100%;
  479. }
  480. .container_12 .portfolio-item.grid_3,
  481. .container_12 .portfolio-item.grid_4 {
  482.     width:220px;
  483. }
  484. .portfolio-item.grid_3 .featured-thumbnail {
  485.     height:140px;
  486. }
  487. .portfolio-item.grid_4 .featured-thumbnail {
  488.     height:147px;
  489. }
  490. .portfolio-item.grid_6 .featured-thumbnail {
  491.     height:143px;
  492. }
  493. .portfolio-item.grid_12 .featured-thumbnail {
  494.     height:140px;
  495. }
  496. .ports .related-content {
  497.     width:240px;
  498. }
  499. #lightboxinfo .featured-thumbnail {
  500.     height:113px;
  501. }
  502. #error404 {
  503.     font-size:12px;
  504. }
  505. #error404 h1 {
  506.     font-size:36px;
  507. }
  508.  
  509. }
  510.  
  511. @media only screen and (max-width:240px) {
  512.  
  513. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement