/* Cross-device support */

@viewport {
  width: device-width ;
  zoom: 1.0 ;
}

@-ms-viewport {
  width: device-width ;
}

/* social media icons */
.fa {
  padding: 8px;
  font-size: 20px;
  width: 15px;
  text-align: center;
  text-decoration: none;
  border-radius: 50%;
  color: #3b2f2f;
}
.fa:hover {
    opacity: 0.7;
}

/* default settings */
body {
  color:#392C20;
  box-sizing: border-box;
/*  -webkit-text-size-adjust: 100%;*/
}

/* applied to all html elements */
* {
    font-family: Arial;
}

p {
  line-height: 1.6;
}

/* goodreads header */
h2 a {
  color:inherit;
}
a {
  color:#885224;
  text-decoration:none;
}

a:hover{
  text-decoration: underline;
}

.header {
  padding: 40px;
  text-align:center;
  background-image: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), url('../imgs/smallheader.jpg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position:center;
  position: relative;
  height: 100%;
  min-height:100%;
  color: white;
  font-size: 20px;
}

.content {
  max-width: 800px;
  margin: auto;
}

/* responsive image */
.responsive_center {
  width:100%;
  height:auto;
}

/* code blocks */

code {
  font-family: Consolas,"courier new";
/*  padding: 10px 10px 10px 10px;*/
  font-size: 105%;
}

pre.code {
  border-radius:5px;
  padding: 10px 10px 10px 10px;
/*  padding-left: 20px;
  padding-right: 20px;*/
  overflow:auto;
  word-wrap:normal;
  background-color: #392819;
  color: #E9E8E8;
}


/* cards */

.mycolumn {
  float:left;
  padding: 5px 5px 5px 5px;
  width: 30%;
}
/* Remove extra left and right margins, due to padding */
.myrow {margin: 0 -5px;}

/* Clear floats after the columns */
.myrow:after {
  content: "";
  display: table;
  clear: both;
}
/* Responsive columns */
@media screen and (max-width: 600px) {
  .mycolumn {
    width: 100%;
    max-width: 100%;
    display: block;
    margin-bottom: 20px;
  }
}
/* Style the counter cards */
.mycard {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
  padding: 10px 10px 10px 10px;
  text-align: center;
  background-color: #E9E8E8;
}