SHARE
TWEET

Untitled

a guest Nov 10th, 2016 23 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. #canvis {
  2.     margin: 0px auto;
  3.     max-width: 960px;
  4. }
  5. /* MISC
  6. –––––––––––––––––––––––––––––––––––––––––––––––––– */
  7. html {
  8.     height: 100%;
  9.     margin: 0;
  10.     background-color: #E8E8E8;
  11. }
  12. body {
  13.     margin: 0 auto;
  14.     min-height: 100%;
  15.     width: 970px;
  16.     background-color:   #D8D8D8;
  17. }
  18. *{
  19.     padding: 0px;
  20.     margin: 0px;
  21. }
  22. ul {
  23.     list-style-type: none;
  24. }
  25. img { /*Makes images resize with there divs*/
  26.     width: 100%;
  27.     height: 100%;
  28. }
  29.  
  30. /* Structure
  31. –––––––––––––––––––––––––––––––––––––––––––––––––– */
  32. /* Banner BASE */
  33. .logoH {
  34.     height: 100%;
  35.     width: 70%;
  36.     float: left;
  37.     color: #6a6a65;
  38.     }
  39.     .logoH p {
  40.         padding-top:25px;
  41.         text-align: center;
  42.         font-size: 2.0rem;
  43.     }
  44.  
  45. #nav {
  46.     float: left;
  47.     height: 100%;
  48.     width: 30%;
  49.     list-style-type: none;
  50. }
  51. #nav ul {
  52.     width: 100%;
  53.     height: 100%;
  54.     display: none;
  55. }
  56. #nav ul li {
  57.     float: left;
  58.     width: 23%;
  59.     margin-right: 2%;
  60.     height: 100%;
  61.     border-bottom: 2px #6a6a65 solid;
  62.     }
  63. #nav ul li a {
  64.     display: block;
  65.     color: #6a6a65;
  66.     text-decoration: none;
  67.     text-align: left;
  68.     padding-top: 3%;
  69.     }
  70.  
  71. /* Content BASE */
  72. #headWrapper{height: 80px; margin: 0% 2.5% 3% 2.5%;}
  73.    
  74. .column-left{ float: left; width: 95%; height: 300px; margin: 0% 2.5% 1% 2.5%;}
  75. .column-right{ float: left; width: 95%; height: 300px; margin: 0% 2.5% 1% 2.5%;}
  76. .column-center{ float: left; width: 95%; height: 300px; margin: 0% 2.5% 1% 2.5%;}
  77. /* Larger than mobile */
  78. @media (min-width: 480px) {
  79.     #headWrapper{height: 110px; margin: 0% 2% 3% 2%;}
  80.    
  81.     .column-left{ width: 47%; height: 250px; margin: 0% 0% 1% 2%;}
  82.     .column-right{width: 47%; height: 250px; margin: 0% 0% 1% 2%;}
  83.     .column-center{width: 47%; height: 250px; margin: 0% 0% 1% 2%;}
  84.    
  85.     .logoH { width: 100%; height: 80%;}
  86.    
  87.     #nav { width: 100%; height:20%;}
  88.     #nav ul {display: inline;}
  89.     #nav img {display: none;}
  90. }
  91. /* Larger than phablet */
  92. @media (min-width: 660px) {
  93.     #headWrapper{ height: 130px; margin: 0% 1% 3% 1%;}
  94.    
  95.     .column-left{width: 32%; height: 250px; margin: 0% 0% 1% 1%;}
  96.     .column-right{ width: 32%; height: 250px; margin: 0% 0% 1% 0%;}
  97.     .column-center{width: 32%; height: 250px; margin: 0% 1% 1% 1%;}
  98.    
  99.     .logoH { width: 60%; height: 100%;}
  100.    
  101.     #nav { width: 40%; height:20%; position: relative; top: 80%;}
  102.     #nav ul {display: inline;}
  103.     #nav img {display: none;}
  104. }
  105.  
  106. /* Typography
  107. –––––––––––––––––––––––––––––––––––––––––––––––––– */
  108. h1, h2, h3, h4, h5, h6 {
  109.   margin-top: 0;
  110.   margin-bottom: 2rem;
  111.   font-weight: 300; }
  112. h1 { font-size: 4.0rem; line-height: 1.2;  letter-spacing: -.1rem;}
  113. h2 { font-size: 3.6rem; line-height: 1.25; letter-spacing: -.1rem; }
  114. h3 { font-size: 3.0rem; line-height: 1.3;  letter-spacing: -.1rem; }
  115. h4 { font-size: 2.4rem; line-height: 1.35; letter-spacing: -.08rem; }
  116. h5 { font-size: 1.8rem; line-height: 1.5;  letter-spacing: -.05rem; }
  117. h6 { font-size: 1.5rem; line-height: 1.6;  letter-spacing: 0; }
  118.  
  119. /* Larger than phablet */
  120. @media (min-width: 550px) {
  121.   h1 { font-size: 5.0rem; }
  122.   h2 { font-size: 4.2rem; }
  123.   h3 { font-size: 3.6rem; }
  124.   h4 { font-size: 3.0rem; }
  125.   h5 { font-size: 2.4rem; }
  126.   h6 { font-size: 1.5rem; }
  127. }
  128.  
  129. p {
  130.   margin-top: 0;
  131.   }
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top