
body {background-color: white; color:black; margin:0.5em ; }
footer {background-color:#eee;color:black; position: fixed; bottom:0; left:0; width:100%; padding-top:3px;}
footer>img {height:48px; position:fixed; right:0; bottom:0;}
footer>img:hover {height:125px}
a {color:#ff3500;}

main {padding-bottom:2em }
article {clear:both; margin:0.3em; background-color:#ffe; display: block;}
em {font-weight:bold}

/* 
  ##Device = Desktops
  ##Screen = 1281px to higher resolution desktops
*/

html { font-family:  'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 1.5em; quotes: "“" "”" ; font-weight:100}
@media (min-width: 1281px) {
  
  //CSS
  body {margin:5%; font-size: 130% }
article img {float: left ;  padding: 0.5em; width:150px;} 
hr {display:none}
p {padding:0.5em;} 
p+p {clear:both;}
h2 {padding:1em}
article {margin:1em;}

}

/* 
  ##Device = Laptops, Desktops
  ##Screen = B/w 1025px to 1280px
*/

@media (min-width: 1025px) and (max-width: 1280px) {
  
  //CSS
  
}

/* 
  ##Device = Tablets, Ipads (portrait)
  ##Screen = B/w 768px to 1024px
*/

@media (min-width: 768px) and (max-width: 1024px) {
  
  //CSS
  
}

/* 
  ##Device = Tablets, Ipads (landscape)
  ##Screen = B/w 768px to 1024px
*/

@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
  
  //CSS
  
}

/* 
  ##Device = Low Resolution Tablets, Mobiles (Landscape)
  ##Screen = B/w 481px to 767px
*/

@media (min-width: 481px) and (max-width: 767px) {
  
  //CSS
  
}

/* 
  ##Device = Most of the Smartphones Mobiles (Portrait)
  ##Screen = B/w 320px to 479px
*/

@media (min-width: 320px) and (max-width: 480px) {
  
  //CSS
  
}
