/*
CSS for Hannah Joy's site: body frame
*/

body {
   font-family: Verdana, Helvetica, Arial, sans-serif;
   /* background-color: #FFC0CB; */
   background-color: #FFCCCC;
   line-height: 150%;
   padding:0;
   margin:0;
   width: 100%;
   font-size: small;
   color: darkred;
}


#bodycontent {
   left: 10px;
   position: absolute;
   font-size: small;
   /* top: 10px; */
}

/*---------------------------------------------------
Stylink the body links
----------------------------------------------------*/
a {
   /* display: block; */
   /* color: #FFF; */
   background-color: crimson;
   width: 32em;
   padding: 3px 3px 3px 17px;
   text-decoration: none;
   border-bottom: 1px solid #fff;
   font-size: small;
   font-weight: bold;
   color: white;
}

a:hover {
   color: #FFFF66;
}


/*-----------------------------------------
Styling the blogrole2 section
------------------------------------------*/
#blogrole2 {
   display: block;
   float: right;
   margin-top: 55px;
   margin-left:10px;
   margin-bottom:10px;
   margin-right:10px;
   width: 305px;
   border: 2px solid navy;
   font-size: x-small;
}

#blogrole2 h2 {
   background: #006;
   color: #fff;
   padding: 5px;
   margin: 0;
   font-weight: bold;
}

#blogrole2 div {
   padding: 5px;
}

#blogrole2 a
{
   display: block;
   color: white;
   background-color: #FF9999;
   width: 12em;
   padding: 3px 3px 3px 17px;
   text-decoration: none;
   border-bottom: 1px solid #fff;
   font-weight: normal;
} 

#blogrole2 a:hover {
   color: #FFFF66;
}

/*-----------------------------------------
Styling the blogrole4 section
(speciaal t.b.v. de links pagina)
------------------------------------------*/
#blogrole4 {
   display: block;
   float: left;
   margin-top: 20px;
   margin-bottom:10px;
   margin-right:10px;
   width: 270px;
   border: none
   font-size: x-small;
}

#blogrole4 a
{
   color: navy;
   background-color: #FFCCCC;
   width: 12em;
   padding: 3px 3px 3px 17px;
   text-decoration: none;
   border-bottom: none;
   font-weight: normal;
} 

#blogrole4 a:hover {
   color: #FFFF66;
}

/*-----------------------------------------
Styling the blogrole5 section
(speciaal t.b.v. de links pagina)
------------------------------------------*/
#blogrole5 {
   display: block;
   float: left;
   margin-top: 20px;
   margin-bottom:10px;
   margin-right:10px;
   width: 250px;
   border: none
   font-size: x-small;
}

#blogrole5 div {
   padding: 5px;
}

#blogrole5 a
{
   color: navy;
   background-color: #FFCCCC;
   width: 12em;
   padding: 3px 3px 3px 17px;
   text-decoration: none;
   border-bottom: none;
   font-weight: normal;
} 

#blogrole5 a:hover {
   color: #FFFF66;
}

/*-----------------------------------------
Styling the blogrole6 section
(speciaal t.b.v. de links pagina)
------------------------------------------*/
#blogrole6 {
   display: block;
   float: left;
   margin-top: 20px;
   margin-bottom:10px;
   margin-right:10px;
   width: 250px;
   border: none
   font-size: x-small;
}

#blogrole6 div {
   padding: 5px;
}

#blogrole6 a
{
   color: navy;
   background-color: #FFCCCC;
   width: 12em;
   padding: 3px 3px 3px 17px;
   text-decoration: none;
   border-bottom: none;
   font-weight: normal;
} 

#blogrole6 a:hover {
   color: #FFFF66;
}

/*-----------------------------------------
Styling the blogrole40 section
(speciaal t.b.v. de index pagina)
------------------------------------------*/

#blogrole40 a
{
   background-color: #FFCCCC;
   color: marlin;
   width: 12em;
   padding: 3px 3px 3px 17px;
   text-decoration: none;
   border-bottom: none;
   font-weight: bold;
   border: none;
} 
#blogrole40 a:hover {
   color: #FFFF66;
}

/*-----------------------------------------
Styling the blogrole80 section
(speciaal t.b.v. de mijnmuziek pagina)
------------------------------------------*/
#blogrole80 {
   display: block;
   float: left;
   margin-top: 20px;
   margin-bottom:10px;
   margin-right:10px;
   width: 750px;
   border: none
   font-size: x-small;
}

#blogrole80 a
{
   color: #FFCCCC;
   background-color: #FFCCCC;
   width: 12em;
   padding: 3px 3px 3px 17px;
   text-decoration: none;
   border-bottom: none;
   font-weight: normal;
   border: none;
} 

#blogrole80 a:hover {
   color: #FFFF66;
}

/* --------------------------------------------------
Styling the table on the media page
----------------------------------------------------*/
table.media {
   border-collapse:collapse;
}

table.media th, table.media td {
   padding: 6px;
   border: 1px solid navy;
}

table.media th {
   font-size: small;
   text-align: left;
   background: navy;
   color: white;
   padding-top: 0;
   padding-bottom: 0;
   padding-left: 2px;
   padding-right: 2px;
}

table.media td {
   font-size: small;
   color: darkred;
}
/*-----------------------------------------
Classes
------------------------------------------*/
.fun {
   font-family: Georgia, Times, serif;
   color: #339999;
   letter-spacing: 0.05em;
   font-weight: bold;
}

.fotoboek p {
   font-size: 65%;
   font-weight: bold;
   margin-top: 0;
   width: 530px;
   line-height: 1.4em;
   padding-bottom: 20px;
   border-bottom: 1px solid crimson;
   margin-bottom: 10px;
}

.photocredit {
   font-weight: normal;
   color: gray;
}

.picturelinks a {
   background-color #FFCCCC;
   color: marlin;
   width: 12em;
   padding: none;
   text-decoration: none;
   border-bottom: none;
   font-weight: bold;
   border: none; 
}

