body {width:100%;
      margin:0 auto 0 auto;
      padding:20px;
      border:10px solid black;
      background:#ffffff;
	font-size: 1.5em; }

/*links */
a:link {color: white;font-weight: bold;}
a:visited {color: #ffdd88;font-weight: bold;}

/*divs*/
div.thumbnail{max-width:250px;
	display: inline-block;
	
}

div.main{
	background-color:white;
	font-weight: bold;
	font-size: 1.2em;
padding:25pt;
}

div.head{
	background-image:url(images/raoheader.png);
	background-size: 100%;
padding: 15pt;
border-radius: 25px;
font-weight: normal
font-size: 1.2em; 
text-align:center;
}

div.reviews{
	background-color:#b3b3b3;
padding: 20px;
border-radius: 25px;
font-weight: normal}

div.books{
	background-color:#b3b3b3;
padding: 15px;
border-radius: 25px;
font-weight: normal
font-size: 1.2em; 
text-align:center;
}
div.title {	
	text-align: center;
	color: black;
	font-weight: bold;
	line-height: 20px;
	padding: 10px;
}

div.table{display:table;}
.names{padding:10px;float:left;}


/*paragraphs*/
p.small{font-size: 1.2em; text-align:center;}
p.in {
    text-indent: 70px;
} 

/*buttons*/
.namebutton{font-weight: bold; color:navy;}

 /* Popovers */
.popover {
    border: 2px dotted red;
max-width: 100% !important;
}

/* Popover Header */
.popover-title {
    background-color: #ffdd88 !important;
    color: #333333;
    text-align:center;
font-size: large !important;
}

/* Popover Body */
.popover-content {
    background-color: #e6a400;
    color: black;
    padding: 25px;
font-size: large !important;
}


/*tables*/
/*setting table to 100% width makes it responsive*/
table.border {
	border-width: 10px;
	padding: 1px;
	border-color: #FFcc00;
	
	border-collapse: collapse;
	-moz-border-radius: 0px 0px 0px 0px;
	vertical-align: top;
	width: 100%;
	background-image:url(images/afpnowords.jpg);  
	background-width: 100%;
}
/*sets same border style for all cells within table*/
table.border td {
	border-width: 15px;
	padding: 5px;
	border-color: #FFDD88;
	border-collapse: collapse;
	-moz-border-radius: 0px 0px 0px 0px;
	vertical-align: top;
	font-family: 	"Helvetica", sans;
	
}

.whitegrad {
  background: none; /* For browsers that do not support gradients */
  background: -webkit-linear-gradient(left,rgba(255,255,255,1),rgba(255,255,255,0)); /*Safari 5.1-6*/
  background: -o-linear-gradient(right,rgba(255,255,255,1),rgba(255,255,255,0)); /*Opera 11.1-12*/
  background: -moz-linear-gradient(right,rgba(255,255,255,1),rgba(255,255,255,0)); /*Fx 3.6-15*/
  background: linear-gradient(to right, rgba(255,255,255,1),rgba(255,255,255,0)); /*Standard*/
} 

.radgrad {
  background: none; /* For browsers that do not support gradients */
  background: -webkit-radial-gradient(rgba(255,255,255,1),rgba(255,255,255,0)); /* Safari 5.1 to 6.0 */
  background: -o-radial-gradient(rgba(255,255,255,1),rgba(255,255,255,0)); /* For Opera 11.6 to 12.0 */
  background: -moz-radial-gradient(rgba(255,255,255,1),rgba(255,255,255,0)); /* For Firefox 3.6 to 15 */
  background: radial-gradient(rgba(255,255,255,1),rgba(255,255,255,0)); /* Standard syntax */
} 

/*define the columns of the table*/

 td.edge {font-size:1.2em;color: #FFFFFF;}
 td.center{font-size:1.5em; background-color: white;}
 td.footer{text-align: center; color: white;}
 td.header{text-align: center; font-size: 1.5em; color: white;}

.title{text-align:center; font-size: 2.5em; font-weight: bold; color:black;}


/*attempts to make images responsive without letting them get too large or too small*/

img.med {
    width: 100%;
	max-width: 247px;
	max-width: 25vw;
	height: auto;
}

img.mid {
    width: 100%;
	max-width: 400px;
	max-width: 40vw;
	height: auto;
	float: left;
	margin: 10px;
	padding: 2px;
}

img.wide {
	width: 100%;
}


/*makes text wrap around right side of image*/
.textwrap {
float: left;
margin: 10px;
}